From 8693b3febcf6de8b3875e169bc0cf110e0fd9125 Mon Sep 17 00:00:00 2001 From: Peanut Date: Mon, 20 Jul 2026 21:15:36 +0800 Subject: [PATCH] =?UTF-8?q?docs:=20=E6=BE=84=E6=B8=85=E5=8D=A1=E7=89=87?= =?UTF-8?q?=E5=B7=B2=E5=9B=9E=E7=AD=94=E6=98=BE=E7=A4=BA=E4=BF=AE=E5=A4=8D?= =?UTF-8?q?=E8=AE=BE=E8=AE=A1=EF=BC=88label=20=E6=9B=BF=E4=BB=A3=20value?= =?UTF-8?q?=20+=20=E6=98=BE=E7=A4=BA=20AI=20=E9=97=AE=E9=A2=98=EF=BC=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...fication-card-answer-display-fix-design.md | 100 ++++++++++++++++++ 1 file changed, 100 insertions(+) create mode 100644 docs/superpowers/specs/2026-07-19-clarification-card-answer-display-fix-design.md diff --git a/docs/superpowers/specs/2026-07-19-clarification-card-answer-display-fix-design.md b/docs/superpowers/specs/2026-07-19-clarification-card-answer-display-fix-design.md new file mode 100644 index 0000000..a6929f7 --- /dev/null +++ b/docs/superpowers/specs/2026-07-19-clarification-card-answer-display-fix-design.md @@ -0,0 +1,100 @@ +--- +author: AI Assistant +created_at: 2026-07-19 +purpose: 修复澄清卡片已回答显示英文 value 而非中文 label,以及已回答状态不显示 AI 问题的问题 +--- + +# 澄清卡片已回答显示修复设计 + +## 概述 + +ScriptView chat 视图中,澄清卡片(ClarificationCard)提交后: +1. **Bug 1**:"已回答:competition" 显示的是英文 value,而非中文 label("工作/学习上的事") +2. **Bug 2**:已回答状态不显示 AI 的问题(如"你想重写今天的什么经历?") + +根因:ClarificationCard 的 `handleSubmit` 发出的是选项的 value(如 'competition'),`submitClarification` 直接用 value 作为显示文本和后端 payload。 + +## 修复方案 + +### 改动文件 + +- `mini-program/src/pages/main/ScriptView.vue` + +### 改动 1:submitClarification 用 label 显示,value 发给后端 + +```js +const submitClarification = (answer) => { + if (answeringClarification.value) return + const card = [...resultMessages.value].reverse().find(m => m.kind === 'card' && !m.submitted) + if (card) { + // 通过 value 查找选项的 label + const option = card.card?.options?.find(opt => opt.value === answer) + const label = option?.label || answer + card.submitted = true + card.answer = label // 显示用 label(中文) + } + // 用户气泡显示 label + const displayAnswer = card?.card?.options?.find(opt => opt.value === answer)?.label || answer + addResultMessage({ role: 'user', kind: 'text', content: displayAnswer }) + answeringClarification.value = true + currentStreamTask.value = followupStream({ + sessionId: novelSessionId.value, + action: 'answer_clarification', + payload: { answer }, // 后端仍收 value(语义化) + onEvent: handleShortNovelEvent, + onError: (errMsg) => markGenerationFailed(errMsg) + }) + setTimeout(() => { answeringClarification.value = false }, 200) +} +``` + +### 改动 2:card-answered 显示 AI 的问题 + +```html + + {{ msg.card?.question || '' }} + 已回答:{{ msg.answer }} + +``` + +新增 `.card-question-text` 样式(复用 ClarificationCard 的 `.card-question` 样式): + +```css +.card-question-text { + color: #ffffff; + font-size: 32rpx; + font-weight: 600; + margin-bottom: 16rpx; + line-height: 1.5; + display: block; +} +``` + +## 数据流 + +``` +用户点选"工作/学习上的事"(value: 'competition') + └─ ClarificationCard.handleSubmit + └─ emit('submit', 'competition') + └─ ScriptView.submitClarification('competition') + ├─ 查找 option → label = '工作/学习上的事' + ├─ card.answer = '工作/学习上的事'(显示) + ├─ addResultMessage({ content: '工作/学习上的事' }) + └─ followupStream({ payload: { answer: 'competition' } })(后端) +``` + +## 不影响范围 + +- ClarificationCard.vue 组件本身不修改(保持 value 的 emit 行为) +- 后端收到的 answer 仍是 value(语义化,便于判断选择) +- outline、novel、text 等其他消息类型不受影响 +- mp-weixin 模板限制:`v-if` 不能用箭头函数,`submitClarification` 中查找 option 的逻辑在 JS 层完成 + +## 验收标准 + +- [ ] 澄清卡片提交后,"已回答:"后面显示中文 label(如"工作/学习上的事") +- [ ] 用户气泡显示中文 label(如"工作/学习上的事") +- [ ] 已回答状态显示 AI 的问题(如"你想重写今天的什么经历?") +- [ ] 后端收到的 answer 仍是 value(如 'competition') +- [ ] 浏览器 Console 无新增错误 +- [ ] mp-weixin 编译通过