diff --git a/mobile-uni/src/pages/user/learning/index.vue b/mobile-uni/src/pages/user/learning/index.vue index f79e88d1..eb7b8afd 100644 --- a/mobile-uni/src/pages/user/learning/index.vue +++ b/mobile-uni/src/pages/user/learning/index.vue @@ -98,7 +98,7 @@ - + {{ item.cause }} @@ -117,6 +117,9 @@ 已完成 + {{ mistakes.length ? '当前归因筛选暂无错题' : '完成训练后,低分和红线回合会自动出现在这里' }} @@ -224,16 +227,26 @@ {{ topic }} - {{ knowledgeResult.answer }} + {{ displayedAnswer }} + {{ index + 1 }}. {{ cleanOrderedText(point) }} - - {{ snippet.docTitle || '知识片段' }} - {{ snippetExcerpt(snippet.content) }} + + + {{ snippetExcerpt(snippet.content) }} 知识库暂未命中可引用内容 @@ -348,6 +361,22 @@ const visibleMistakes = computed(() => activeMistakeCause.value === '全部' ? mistakes.value : mistakes.value.filter((item) => item.cause === activeMistakeCause.value)); +/* APP-like folding: long content collapsed by default, nothing removed. */ +const ANSWER_PREVIEW_CHARS = 140; +const showAllMistakes = ref(false); +const showFullAnswer = ref(false); +const expandedSnippets = ref>({}); +const displayedMistakes = computed(() => (showAllMistakes.value ? visibleMistakes.value : visibleMistakes.value.slice(0, 3))); +const answerIsLong = computed(() => (knowledgeResult.value?.answer || '').length > ANSWER_PREVIEW_CHARS); +const displayedAnswer = computed(() => { + const answer = knowledgeResult.value?.answer || ''; + if (showFullAnswer.value || answer.length <= ANSWER_PREVIEW_CHARS) return answer; + return `${answer.slice(0, ANSWER_PREVIEW_CHARS)}…`; +}); +const toggleSnippet = (index: number) => { + expandedSnippets.value = { ...expandedSnippets.value, [index]: !expandedSnippets.value[index] }; +}; + const qualificationStatusLabel = computed(() => { switch (qualification.value?.status) { case 'PASSED': return '已通过'; @@ -554,6 +583,8 @@ const loadKnowledge = async (topic: string, request: RequestScopeTicket = reques const nextKnowledge = await searchKnowledge(topic); if (!requests.isCurrent(request)) return; knowledgeResult.value = nextKnowledge; + showFullAnswer.value = false; + expandedSnippets.value = {}; } catch (error) { if (!requests.isCurrent(request)) return; knowledgeResult.value = null; @@ -1157,4 +1188,53 @@ onUnload(invalidateRequests); .action-button { width: 100%; } + +.fold-toggle { + display: block; + width: 100%; + margin: 10px 0 0; + padding: 8px 0; + border: none; + border-top: 1px dashed #eceff2; + background: transparent; + color: #6b7480; + font-size: 13px; + text-align: center; + line-height: 1.5; +} + +.fold-toggle::after { + border: none; +} + +.snippet-head { + display: flex; + align-items: center; + justify-content: space-between; + gap: 8px; + width: 100%; + margin: 0; + padding: 0; + border: none; + background: transparent; + text-align: left; + line-height: 1.4; +} + +.snippet-head::after { + border: none; +} + +.snippet-arrow { + flex-shrink: 0; + color: #98a1ad; + font-size: 12px; +} + +.snippet-head .snippet-title { + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + overflow: hidden; +}