# 测试方案 — 2026-04-16-22-35-38 ## 测试目标 验证默认模板中的红色占位符已正确替换为智能占位方格，且双向绑定字段 key 与右侧【基本信息】表单字段名完全一致，确保新建报告时联动功能直接生效。 ## 测试环境 - 浏览器：Chrome / Edge - 前置条件：已登录系统（建议使用 `admin` 账号） - 测试页面：`/report-editor`、`/template-manage` --- ## 测试用例设计 ### 用例 1：新建报告 — 默认模板自动加载智能控件 | 步骤 | 操作 | 预期结果 | |------|------|---------| | 1.1 | 进入 `/report-editor`（新建报告） | 编辑器加载默认模板，姓名、性别、年龄、科别、床号、住院号等位置显示为带边框的可填方格 | | 1.2 | 右键检查第一个姓名方格的 DOM | HTML 结构为 `姓名：` | | 1.3 | 检查性别方格的 `data-bind` | 属性值为 `patientGender` | | 1.4 | 检查年龄方格的 `data-bind` | 属性值为 `patientAge` | ### 用例 2：报告编辑端 — 姓名方格输入联动表单 | 步骤 | 操作 | 预期结果 | |------|------|---------| | 2.1 | 在编辑器"姓名"方格内输入"张三" | 右侧【基本信息】"患者姓名"字段实时显示"张三" | | 2.2 | 在编辑器"性别"方格内输入"男" | 右侧"患者性别"字段实时显示"男" | | 2.3 | 在编辑器"年龄"方格内输入"45" | 右侧"患者年龄"字段实时显示"45" | ### 用例 3：报告编辑端 — 表单修改联动方格 | 步骤 | 操作 | 预期结果 | |------|------|---------| | 3.1 | 在右侧表单"患者姓名"中修改为"李四" | 编辑器内"姓名"方格内容同步变为"李四" | | 3.2 | 在右侧表单"科别"中输入"普外科" | 编辑器内"科别"方格同步变为"普外科" | | 3.3 | 在右侧表单"手术名称"中修改为"阑尾切除术" | 编辑器内"手术名称"方格同步变为"阑尾切除术" | ### 用例 4：模板管理端 — 字段库按钮 key 正确性 | 步骤 | 操作 | 预期结果 | |------|------|---------| | 4.1 | 进入 `/template-manage` | 右侧字段库面板正常显示 | | 4.2 | 点击"性别"按钮，在编辑器中插入控件 | 插入的控件 `data-bind="patientGender"` | | 4.3 | 点击"年龄"按钮，在编辑器中插入控件 | 插入的控件 `data-bind="patientAge"` | | 4.4 | 点击"科别"按钮，在编辑器中插入控件 | 插入的控件 `data-bind="department"` | ### 用例 5：老数据兼容 | 步骤 | 操作 | 预期结果 | |------|------|---------| | 5.1 | 编辑一个之前保存的、含有旧红色占位符的老模板 | 页面正常加载，不报错；旧红色文本仍然显示为普通文字 | ### 用例 6：类型检查 | 步骤 | 操作 | 预期结果 | |------|------|---------| | 6.1 | 在项目根目录执行 `npm run lint` | 无 TypeScript 编译错误 | --- ## 验收标准 - [ ] 新建报告时，默认模板中的姓名、性别、年龄、科别、床号、住院号已变为可填方格。 - [ ] 方格的 `data-bind` 属性与右侧表单字段名完全一致。 - [ ] 在方格中输入，右侧表单实时同步更新。 - [ ] 在表单中修改，方格内容实时同步更新。 - [ ] `TemplateManage` 字段库按钮插入的控件 key 正确。 - [ ] `npm run lint` 通过。 ## 测试方式 手工浏览器验证 + DevTools 检查 DOM + `npm run lint` 类型检查。 --- **⚠️ 请审核以上测试方案，确认无误后回复「确认」或提出修改意见，我将进入最终执行阶段。**