# 需求分析 — 撤销栈修复、字段删除交互优化与签名字段闭环(2026-04-17-12-34-56) ## 一、需求来源 用户反馈 TemplateManage 中删除字段后撤销失效、插入字段导致非预期换行、Backspace/Delete 误删父级内容;同时希望优化手术者签名的业务逻辑闭环,包括尺寸约束、表单显隐控制及完成报告时的弱阻断提示。 ## 二、具体需求拆解 ### 需求 1:修复撤销(Undo)失效 **问题**:在 TemplateManage 中点击红色 × 或通过键盘删除智能字段后,点击工具栏的"撤销"按钮无法恢复被删除的字段。 **原因**:当前代码使用 `smartField.remove()` 和 `target.remove()` 直接操作 DOM,绕过了浏览器的原生撤销栈(undo stack)。 **期望**:删除字段的操作能被浏览器的 `execCommand('undo')` 正确撤销。 ### 需求 2:修复插入字段换行与 Backspace/Delete 误删 **问题**: - 在 TemplateManage 中插入"手术日期"或"手术者签名"后,字段框有时会直接跳到下一行。 - Backspace 键无法删除字段(无反应)。 - Delete 键会误删字段前面的大段文本(如"手术步骤、术中出现的情况及处理:")。 **期望**: - 插入的字段保持在当前行内,不强制换行。 - Backspace/Delete 键能精准删除光标相邻的单个字段节点,不影响周围文本。 ### 需求 3:签名图片尺寸约束与字段管理 **问题**: - 当前签名图片没有最大尺寸限制,可能过大。 - "手术者签名"字段不在 ReportEditor 的右侧基本信息表单中显示,无法控制是否签字。 **期望**: - 签名图片设置最大宽度 `120px`、最大高度 `40px`,等比例缩放(`object-fit: contain`)。 - 将 `surgeonSignature` 字段改为 `visibleInForm: true`、`isSystemLocked: false`,使其可在字段管理中显隐控制。 - 在 ReportEditor 右侧表单中增加"手术者签名确认"(`isSigned`)单选下拉框,选项为"已签字"、"未签字",默认"未签字"。 - 模板中的 `surgeonSignature` 字段根据 `isSigned` 的值渲染: - `isSigned === '已签字'` 且用户有签名图 → 显示等比例缩放后的签名图片。 - 其他情况 → 显示"【未签字】"。 ### 需求 4:完成报告时的签名校验提示 **期望**:点击"完成报告"时: - 若模板中存在 `data-bind="surgeonSignature"` 的字段,但 `isSigned !== '已签字'`,弹出 `confirm` 提示"模板中包含【手术者签名】字段,但您未选择'已签字'。是否继续完成报告?",用户选择"取消"则中断保存,选择"确定"则继续保存。 - 若 `isSigned === '已签字'` 但当前用户未上传电子签名图片,弹出 `confirm` 提示"您选择了'已签字',但账号尚未上传电子签名图片。报告中将不显示签名图片,是否继续完成?",同样弱阻断(可继续保存)。 ## 三、影响范围分析 | 文件 | 改动说明 | |------|----------| | `src/pages/TemplateManage.tsx` | 点击删除和键盘删除逻辑全部改用 `Selection + Range + execCommand('delete')`;`insertSmartField` 的 HTML 末尾增加 `​`(零宽空格)防止强制换行。 | | `src/types.ts` | `surgeonSignature` 改为 `visibleInForm: true, isSystemLocked: false`;新增 `isSigned` 字段到 `DEFAULT_FORM_FIELDS`。 | | `src/pages/ReportEditor.tsx` | `reportData` 初始值增加 `isSigned: '未签字'`;签名同步逻辑改为基于 `isSigned` 判断;`saveReport('completed')` 增加签名校验提示。 | | `src/index.css` | 调整 `.report-signature-img` 为 `max-width: 120px; max-height: 40px; object-fit: contain;`。 | | `src/utils/print.ts` | 打印样式中同步签名图片尺寸约束。 | ## 四、验收标准 - [ ] TemplateManage 中删除字段后,点击"撤销"按钮能正确恢复字段。 - [ ] TemplateManage 中插入字段后保持在当前行,不跳到下一行。 - [ ] Backspace/Delete 键能精准删除单个字段节点,不误删周围文本。 - [ ] ReportEditor 中签名图片最大 120×40px,等比例缩放。 - [ ] ReportEditor 右侧表单出现"手术者签名确认"下拉框(已签字/未签字)。 - [ ] 选择"已签字"且有签名图时,模板中显示签名图片;选择"未签字"或无签名图时显示"【未签字】"。 - [ ] 点击"完成报告"时,签名状态异常会弹出弱阻断提示,用户可取消或继续保存。 - [ ] `npm run lint` 无编译错误。