2.6 KiB
2.6 KiB
需求分析 — 2026-04-19-02-26-05
1. 需求背景
为 ReportEditor 加入 AI 撰写功能,接入 Kimi-2.5 多模态模型,实现智能化的手术报告辅助撰写。参考 "参考-ReportEditor.tsx" 的设计范式,构建现代化的沉浸式 AI 对话 UI。
2. 需求拆解
- Task 1:TemplateManage 工具栏新增 "插入AI可编辑区域" 按钮,支持命名且不可重名
- Task 2:ReportEditor 工具栏同步新增同样的 AI 区域插入按钮
- Task 3:SystemSettings 完善 AI 接口集成,适配 Kimi-2.5 API(baseURL + apiKey)
- Task 4:ReportEditor 右侧新增 "AI撰写" Tab 面板,包含:
- 类微信风格的聊天对话 UI(气泡、Loading 动画)
- 定向区域锚定(下拉选择
ai-region) - "允许修改正文" 沙盒开关
- 多模态输入:语音输入(Web Speech API)、视频关键帧选择、本地图片上传
- 快捷指令胶囊(可添加/删除/编辑)
- Diff 二次确认弹窗(左右对比、可编辑右侧、确认后注入)
- 注入后视觉反馈(深蓝→淡蓝→透明渐变高亮)
- Task 5:AI 调用逻辑:Fetch API 调用 Kimi API,严格 JSON Schema 输出(reply + updatedHtml)
3. 影响范围
| 文件 | 修改类型 | 风险等级 |
|---|---|---|
src/types.ts |
修改(扩展 SystemSettings) | 低 |
src/pages/SystemSettings.tsx |
修改(AI设置UI) | 中 |
src/pages/TemplateManage.tsx |
修改(工具栏+插入逻辑) | 中 |
src/pages/ReportEditor.tsx |
大规模修改(工具栏、状态、右侧面板、Diff弹窗、API调用) | 高 |
4. 优先级
- P0:ReportEditor AI 面板核心功能(聊天、API调用、Diff确认)
- P1:TemplateManage / ReportEditor 工具栏 AI 区域插入
- P1:SystemSettings Kimi 接口配置
- P2:语音输入、快捷指令编辑等增强体验
5. 验收标准
- 可在 TemplateManage 中插入
ai-region区域,重名时弹窗阻止 - 可在 ReportEditor 中插入
ai-region区域 - SystemSettings 可配置 Kimi API Key 和 Base URL,保存后持久化
- ReportEditor 右侧有 "AI撰写" Tab,点击可展开聊天面板
- 可向 AI 发送文本+图片(关键帧/本地上传),AI 返回 JSON 结构化回复
- 勾选"允许修改正文"时,AI 返回的 HTML 会触发 Diff 弹窗,确认后才注入
- 不勾选"允许修改正文"时,AI 回复仅在聊天气泡中展示,不修改正文
- 注入后目标区域有视觉高亮反馈
- 重新部署后页面可正常访问,无构建错误