diff --git a/docs/superpowers/specs/2026-06-29-scriptview-dialog-flow-only-design.md b/docs/superpowers/specs/2026-06-29-scriptview-dialog-flow-only-design.md new file mode 100644 index 0000000..a5da97e --- /dev/null +++ b/docs/superpowers/specs/2026-06-29-scriptview-dialog-flow-only-design.md @@ -0,0 +1,221 @@ +--- +author: Peanut +created_at: 2026-06-29 +purpose: ScriptView 简化为纯对话流模式:删除 read/chat 二段切换 + 按旧版布局统一 AI 消息按钮组 +--- + +# ScriptView 简化为纯对话流模式 + +## 背景 + +`bf6f279 feat: ScriptView 改造为对话中心查看/修改模式` 引入了 read/chat 二段切换,但偏离了原始设计。用户的原始设计意图: + +- **从剧本库点卡片进入**:直接以对话形式查看完整的从创建剧本开始的对话(用户心愿 → AI 剧本 → 改写对话 → 续写对话 → ...) +- **AI 消息卡片**:按旧版布局展示按钮组 +- **不要二段切换**:不要先 read 再点按钮进 chat + +## 旧版布局参考(来自 commit `cbf5157` 和 `0db434c`) + +``` +MessageCard 顶部(story-head-actions): + ┌──────────────────────────────────┐ + │ [剧本标题] [收起/展开] [复制] │ + └──────────────────────────────────┘ + +MessageCard 底部(result-actions): + ┌──────────────────────────────────┐ + │ [换个方向] [不像我] [继续生成] [▶ 播放] │ + └──────────────────────────────────┘ +``` + +## 设计 + +### 1. 入口流程简化 + +| 入口 | 改动 | +|---|---| +| 剧本库点卡片 | `openScriptChat` → 直接设 `viewState='result'`,`viewMode='chat'` | +| 首页心愿输入生成新剧本 | 保持现状(home → generating → result) | +| read 模式 | **整个删除** | + +### 2. 删除 read 模式相关代码 + +**删除的位置**: + +| 文件 | 位置 | 内容 | +|---|---|---| +| `mini-program/src/pages/main/ScriptView.vue` | template `view v-if="viewMode === 'read'"` | 整个版本切换器 + 章节展示 + read-action-bar | +| `mini-program/src/pages/main/ScriptView.vue` | `selectedVersionMessageId` ref | 只被 read 模式用 | +| `mini-program/src/pages/main/ScriptView.vue` | `onSelectVersion` | 版本切换(read 模式用) | +| `mini-program/src/pages/main/ScriptView.vue` | `setAsCurrentVersion` | 设为当前版本(read 模式用) | +| `mini-program/src/pages/main/ScriptView.vue` | `enterChatMode` | read → chat 切换(不再需要) | +| `mini-program/src/pages/main/ScriptView.vue` | `rewriteCurrentVersion` | read 模式改写入口 | +| `mini-program/src/pages/main/ScriptView.vue` | `continueCurrentVersion` | read 模式续写入口 | + +`currentVersionMessageId` 保留:chat 模式下 AI 消息的"删除版本"按钮需要它来判断 `canDelete`。 + +### 3. 按旧版布局统一 AI 消息按钮组 + +**MessageCard 改造**: + +```vue + +``` + +**关键变化**: +- `messageType === 'script'` 分支去掉(长文本统一渲染) +- `result-actions` 在 script 类型下按旧版布局 + 加 script 专属按钮 +- 短消息气泡(chat/system)保持不变 + +### 4. ScriptView template 简化 + +**简化前的 read 模式 section**: +```vue + + ... + ... + ... + +``` + +**删除**。 + +**简化后的 chat 模式 section**: +```vue + + + + + {{ wishText }} + {{ currentMessageTime }} + + + + 心愿已实现,故事已为你展开 + {{ currentResultTime }} + + + + + + + + + {{ message.content }} + {{ message.time || formatMessageTime() }} + + + + + + ... + +``` + +### 5. ScriptView 的 `continue` / `change-direction` / `not-like-me` emits + +旧版 emit 在 script-actions 下不存在,需要保留以兼容旧版按钮。 + +- `continue`(旧版 "继续生成"按钮)→ 触发 `continueMessage` 或 `continueInChat` +- `change-direction`("换个方向")→ 触发 `changeDirection` +- `not-like-me`("不像我")→ 触发 `notLikeMe` + +**这些函数已经存在于 ScriptView.vue 中**(来自旧版代码)。直接绑定。 + +## 验收标准 + +- [ ] 从剧本库点卡片 → 直接进入对话流(无需点"进入对话修改") +- [ ] 对话流完整显示:用户心愿 + AI 剧本 + 改写/续写对话 +- [ ] AI 消息卡片顶部:收起/展开、复制、版本号标签 +- [ ] AI 消息卡片底部:换个方向、不像我、续写、改写、查看历史版本、删除版本、TTS 播放 +- [ ] read 模式相关代码完全删除(不再有任何切换按钮) +- [ ] Console 无报错 + +## 风险与回退 + +- **风险低**:只删除 read 模式 + 调整 MessageCard 按钮布局,不影响后端 +- **回退**:`git revert` 单个 commit 即可恢复