Files
wecom_it_smart_desk/docs/07-项目管理/任务说明书/任务说明书-REQ-AI-001-打字机效果.md
T
Simon facc04aa65 chore: docs 结构整改 + compose 双目录对齐(合并重建提交)
本提交为 .git 对象库损坏后的重建提交,内容等价于原先三个本地提交
(5e2fd4c2 / 57a53c98 / 5d7e1873)的累积结果,未做任何额外改动。

一、docs 结构整改(整改 #14)
根因:重构时新结构为 untracked 文件,执行 git stash(未带 -u)未纳入,
随后 git reset 拉回 HEAD 旧 tracked 树,导致旧树复活、新旧两棵目录
树并存于 docs/,共 791 文件、双分类体系冲突。

修复动作:
- b2 同名异主题文件改名迁移保全 9 个
- C 类 39 个孤立文件按主题正确归类
- A/B1 类 222 个重复文件删除(新结构已有内容副本)
- 9 个旧独有空目录删除
- 270 处内部引用按 verified 映射改写
- 整改记录 #14 登记于 04-运维文档/部署运维

结果:docs 791 → 569 文件,顶层仅规范 8 类 + 治理文件,单树恢复。
残留:约 20 处指向从未存在文件的陈旧死链,归入独立文档卫生任务。

二、compose 双目录对齐(消除踩坑 A)
- docker-compose.yml:nginx 前端挂载全部由根目录 frontend-*/dist
  改为 src/frontend-*/dist(h5 / agent / admin / terminal)
- docker-compose.dev.yml:dev 服务 build context 与卷同步改 src/
- 效果:本地 docker compose up 不再把根目录 stale dist 挂回,
  与线上一致,分叉隐患消除(已 docker compose config 校验通过)

防复发铁律:
- 重构须提交;仓库修复须 git stash -u 或先 commit
- 新结构须 git add 并提交,避免再次 untracked 复活
- H5 改动只动 src/frontend-h5/,禁改根目录遗留 frontend-*/
2026-08-07 22:31:32 +08:00

6.1 KiB
Raw Blame History

任务说明书 — AI 回复打字机逐字显示效果

版本: v1.0 | 日期: 2026-07-25


📋 基本信息

项目 内容
任务名称 AI 回复打字机逐字显示效果
任务ID #125
优先级 🟡 P2
类型 功能增强(UI 优化)
状态 已完成
负责人 Simon
创建日期 2026-07-25
完成日期 2026-07-25

📥 输入项来源

产品需求

来源文档 相关章节 说明
01-产品文档/03-AI服务/PRD-REQ-AI-001-复杂场景与统一路由-v1.1.md 全文 AI 对话链路中"逐字渲染"概念已提及,但前端未实际实现
需求评估结论(2026-07-25 纯 UI 优化,不涉及新功能/新页面/新 API,无需独立 PRD

技术方案

来源文档 相关章节 说明
02-技术文档/实现配置/AI对话链路全栈改造实施计划-v1.0.md §5, §7 打字机流式渲染概念设计,v1.3 补充实际交付记录
E2E 打字机验证报告(2026-07-08 全文 证实 WS 流式推送 343 chunk / 1469 字符,后端能力已就绪

原型设计

本次为纯渲染增强,不涉及新页面/新组件,无原型图。 符合规范 §2.1 豁免条件。

需了解的现有代码(历史现状)

模块/文件 说明 需了解的内容
frontend-h5/src/components/chat/MessageBubble.vue H5 消息气泡组件 消息类型区分(ai/employee/agent/system),文本渲染路径(line 79/89)
frontend-agent/src/components/chat/MessageBubble.vue 坐席端消息气泡组件 同上(sender_type 区分,line 53/113
frontend-h5/src/stores/conversation.ts H5 会话 Store streamingAiMessageId 占位气泡状态,ai_reply 事件处理
frontend-agent/src/stores/conversation.ts 坐席端会话 Store ai_thinking / new_message 事件处理

📤 输出成果要求

交付物清单

# 交付物 类型 说明
1 frontend-h5/src/composables/useTypewriter.ts 代码(新建) H5 端打字机组合式函数
2 frontend-agent/src/composables/useTypewriter.ts 代码(新建) 坐席端打字机组合式函数
3 frontend-h5/src/components/chat/MessageBubble.vue 代码(修改) 引入 useTypewriterAI 消息 msg.contentdisplayContent + 闪烁光标
4 frontend-agent/src/components/chat/MessageBubble.vue 代码(修改) 同上(sender_type === 'ai' 时启用)
5 docs/00-版本迭代总览.md 文档(更新) v1.2.1 → v1.2.2
6 docs/02-技术文档/实现配置/AI对话链路全栈改造实施计划-v1.0.md 文档(更新) v1.3 补充打字机交付状态
7 本任务说明书 文档(新建)

非目标(Non-goals

  • 不修改后端 WS 推送逻辑(流式 chunk 已就绪)
  • 不为员工/坐席/系统消息添加动画
  • 不添加点击跳过动画的交互(保留为后续迭代)
  • 不修改消息去重逻辑

🔧 验证方式

功能验证

验证项 验证方法 结果
AI 消息逐字显示 发送消息触发 AI 回复,观察气泡 文字逐字出现
闪烁光标 观察 AI 消息末尾 `
长消息加速 发送复杂问题触发长回复(>300 字) 前半逐字,后半批量
非 AI 消息不受影响 观察员工/坐席/系统消 一次性完整显示
"正在思考"占位不受影响 观察 AI 思考中的消息 脉冲动画不受干扰
本地 vite build npm run build 无错误 H5 3.75s / Agent 5.14s

部署验证

验证项 方法 结果
H5 dist 含 typewriter 代码 grep typewriter-cursor 生产 dist index-C8VRkrdB.css
Agent dist 含 typewriter 代码 grep typewriter-cursor 生产 dist Workspace-DFRCrrlx.css + JS
nginx 服务正常 curl localhost/itdesk/ 200 OK
企微内实际可用 Ctrl+Shift+R 强制刷新后验证 已确认

完成标准

验收条件

  • 代码合入(前端源文件已修改)
  • 本地编译通过(H5 + Agent
  • 版本号更新(v1.2.1 → v1.2.2
  • 相关文档已更新(版本总览 + 技术方案)
  • 生产部署已验证
  • 任务说明书已创建

📊 工作分解

子任务 负责人 预估工时 状态
创建 useTypewriter composable(双端) Simon 0.5h
修改 MessageBubble.vue(双端) Simon 0.5h
本地编译验证 Simon 0.2h
打字机效果演示页 Simon 0.3h
需求评估 + 文档更新 Simon 0.3h
生产部署 + 验证 Simon 0.3h

📞 依赖与阻塞

前置依赖

依赖任务 依赖说明 状态
REQ-AI-001 复杂场景与统一路由 AI 对话链路基础设施(WS 流式推送) 已完成
WS ai_reply_chunk 流式推送 后端推送完整消息内容 已就绪(2026-07-08 E2E 验证通过)

阻塞因素

无阻塞。


📈 变更记录

日期 变更内容 变更人 说明
2026-07-25 创建任务 Simon 初始版本,任务已完成

📎 附件

  • 版本迭代总览:docs/00-版本迭代总览.mdv1.2.2 条目)
  • 技术方案:docs/02-技术文档/实现配置/AI对话链路全栈改造实施计划-v1.0.mdv1.3 变更)
  • E2E 验证:docs/03-测试文档/02-E2E测试/方案A-消息发送延时-E2E验证报告-20260708.md
  • 演示页面:docs/03-测试文档/02-E2E测试/e2e-screenshots/typewriter-demo.html
  • 源码:
    • frontend-h5/src/composables/useTypewriter.ts
    • frontend-agent/src/composables/useTypewriter.ts
    • frontend-h5/src/components/chat/MessageBubble.vue
    • frontend-agent/src/components/chat/MessageBubble.vue