diff --git a/src/types.ts b/src/types.ts index 80748f9..dc5f821 100644 --- a/src/types.ts +++ b/src/types.ts @@ -87,17 +87,15 @@ export interface BindableField { export const BINDABLE_FIELDS: BindableField[] = [ { key: 'patientName', label: '姓名' }, - { key: 'gender', label: '性别' }, - { key: 'age', label: '年龄' }, - { key: 'hospitalId', label: '住院号' }, + { key: 'patientGender', label: '性别' }, + { key: 'patientAge', label: '年龄' }, + { key: 'department', label: '科别' }, { key: 'bedNumber', label: '床号' }, + { key: 'hospitalId', label: '住院号' }, { key: 'surgeryDate', label: '手术日期' }, - { key: 'surgeryType', label: '手术类型' }, + { key: 'title', label: '手术名称' }, { key: 'surgeon', label: '手术者' }, { key: 'assistant', label: '助手' }, { key: 'anesthesiologist', label: '麻醉师' }, { key: 'anesthesiaType', label: '麻醉方式' }, - { key: 'preoperativeDiagnosis', label: '术前诊断' }, - { key: 'intraoperativeDiagnosis', label: '术中诊断' }, - { key: 'surgicalProcedure', label: '手术经过' }, ]; diff --git a/src/utils/defaultContent.ts b/src/utils/defaultContent.ts index bb00eff..a62634f 100644 --- a/src/utils/defaultContent.ts +++ b/src/utils/defaultContent.ts @@ -1,3 +1,13 @@ +const smartField = (key: string) => ` + + + + +`; + export const defaultReportContent = `

@@ -14,16 +24,16 @@ export const defaultReportContent = `

- 姓名：*姓名* - 性别: *性别* - 年龄：*年龄* - 科别：*科室* - 床号：*床号* - 住院号：*住院号* + 姓名：${smartField('patientName')} + 性别：${smartField('patientGender')} + 年龄：${smartField('patientAge')} + 科别：${smartField('department')} + 床号：${smartField('bedNumber')} + 住院号：${smartField('hospitalId')}

- 手术日期：年 月 日 + 手术日期：${smartField('surgeryDate')}

@@ -35,7 +45,7 @@ export const defaultReportContent = `

- 手术名称：腹腔镜胆囊切除术 + 手术名称：${smartField('title')}

@@ -44,13 +54,13 @@ export const defaultReportContent = `

- 手术者: 手术者 - 助手: 助手 + 手术者：${smartField('surgeon')} + 助手：${smartField('assistant')}

- 麻醉师：麻醉师 - 麻醉方式: 全麻 + 麻醉师：${smartField('anesthesiologist')} + 麻醉方式：${smartField('anesthesiaType')}

@@ -157,4 +167,3 @@ export const defaultReportContent = ` // Backward compatibility alias export const defaultContent = defaultReportContent; - diff --git a/工程分析/实现方案-2026-04-16-22-35-38.md b/工程分析/实现方案-2026-04-16-22-35-38.md new file mode 100644 index 0000000..dcbda52 --- /dev/null +++ b/工程分析/实现方案-2026-04-16-22-35-38.md @@ -0,0 +1,86 @@ +# 实现方案 — 2026-04-16-22-35-38 + +## 根因分析 + +上一版本虽然实现了 `smart-field-wrapper` 的插入逻辑和双向绑定，但存在两个问题： +1. **`BINDABLE_FIELDS` key 与 `Report` 接口不一致**：例如 `gender`、`age` 在 `Report` 接口中实际为 `patientGender`、`patientAge`，导致 `ReportEditor` 中 `reportData[fieldKey]` 读取到 `undefined`，双向绑定不生效。 +2. **默认模板未使用智能控件**：`defaultContent.ts` 中仍使用红色纯文本占位符（`*姓名*` 等），新建报告时即使字段映射正确，模板里也没有 `data-bind` 节点，联动能力无法被激活。 + +## 修改文件清单 + +| 文件 | 修改类型 | 说明 | +|------|---------|------| +| `src/types.ts` | 修改 | 修正 `BINDABLE_FIELDS` key，移除不存在的字段 | +| `src/utils/defaultContent.ts` | 修改 | 将所有占位符替换为 `smart-field-wrapper` HTML | + +--- + +## 具体代码变更 + +### 变更 1：`src/types.ts` — 修正并精简 `BINDABLE_FIELDS` + +**替换为：** + +```typescript +export const BINDABLE_FIELDS: BindableField[] = [ + { key: 'patientName', label: '姓名' }, + { key: 'patientGender', label: '性别' }, + { key: 'patientAge', label: '年龄' }, + { key: 'department', label: '科别' }, + { key: 'bedNumber', label: '床号' }, + { key: 'hospitalId', label: '住院号' }, + { key: 'surgeryDate', label: '手术日期' }, + { key: 'title', label: '手术名称' }, + { key: 'surgeon', label: '手术者' }, + { key: 'assistant', label: '助手' }, + { key: 'anesthesiologist', label: '麻醉师' }, + { key: 'anesthesiaType', label: '麻醉方式' }, +]; +``` + +### 变更 2：`src/utils/defaultContent.ts` — 占位符替换为智能控件 + +定义一个辅助函数（仅用于生成字符串），将占位符替换为智能控件 HTML： + +```typescript +const smartField = (key: string, label: string) => ` + + ${label}： + + +`; +``` + +**将默认模板中的以下占位符替换：** + +| 原占位符 | 替换为 | +|---------|--------| +| `姓名：*姓名*` | `smartField('patientName', '姓名')`（去掉冒号，因为标签自带冒号） | +| `性别: *性别*` | `smartField('patientGender', '性别')` | +| `年龄：*年龄*` | `smartField('patientAge', '年龄')` | +| `科别：*科室*` | `smartField('department', '科别')` | +| `床号：*床号*` | `smartField('bedNumber', '床号')` | +| `住院号：*住院号*` | `smartField('hospitalId', '住院号')` | +| `手术日期：年 月 日` | `手术日期：${smartField('surgeryDate', '')}` | +| `手术名称：腹腔镜胆囊切除术` | `手术名称：${smartField('title', '')}` | +| `手术者: 手术者` | `手术者：${smartField('surgeon', '')}` | +| `助手: 助手` | `助手：${smartField('assistant', '')}` | +| `麻醉师：麻醉师` | `麻醉师：${smartField('anesthesiologist', '')}` | +| `麻醉方式: 全麻` | `麻醉方式：${smartField('anesthesiaType', '')}` | + +> 注：当 `label` 为空字符串时，只生成 `data-bind` 的方格，不生成前置标签。对于已有中文前缀（如"手术日期："）的场景，使用空 label 更自然。 + +## 风险点 + +| 风险 | 级别 | 应对措施 | +|------|------|---------| +| 现有用户自定义模板仍使用旧占位符，不会自动升级 | 低 | 属于预期行为；只有新建报告时的默认模板会使用新控件 | +| 某些字段（如 `title`）在模板加载后可能被模板名称覆盖 | 低 | `apply template` 逻辑本身就会重置 `title`，这是现有行为，不影响 | + +## 回滚策略 + +本次修改仅涉及常量定义和默认 HTML 字符串，可随时通过 `git revert` 回滚。 + +--- + +**⚠️ 请审核以上方案，确认无误后回复「确认」或提出修改意见，我将继续编写测试方案。** diff --git a/工程分析/测试方案-2026-04-16-22-35-38.md b/工程分析/测试方案-2026-04-16-22-35-38.md new file mode 100644 index 0000000..04ee0d8 --- /dev/null +++ b/工程分析/测试方案-2026-04-16-22-35-38.md @@ -0,0 +1,80 @@ +# 测试方案 — 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` 类型检查。 + +--- + +**⚠️ 请审核以上测试方案，确认无误后回复「确认」或提出修改意见，我将进入最终执行阶段。** diff --git a/工程分析/需求分析-2026-04-16-22-35-38.md b/工程分析/需求分析-2026-04-16-22-35-38.md new file mode 100644 index 0000000..e1b854b --- /dev/null +++ b/工程分析/需求分析-2026-04-16-22-35-38.md @@ -0,0 +1,39 @@ +# 需求分析 — 2026-04-16-22-35-38 + +## 原始需求摘要 + +将默认手术报告模板中红色的 `*姓名* *性别* *年龄* *科室* *床号* *住院号*` 等占位符，替换为可填写的智能占位方框。这些方框需与 `ReportEditor` 右侧【基本信息】表单双向绑定，同时也要在 `TemplateManage` 的模板编辑中体现字段绑定关系。 + +## 需求拆解 + +### 功能点 + +1. **修正字段映射一致性** + - 上一版本中 `BINDABLE_FIELDS` 里的 `gender`、`age` 等 key 与 `Report` 接口中的 `patientGender`、`patientAge` 不一致，导致双向绑定无法命中实际表单字段。 + - 需要统一 key 命名，使其与 `Report` 接口及右侧表单字段名完全一致。 + +2. **更新默认模板内容 (`defaultContent.ts`)** + - 将当前纯文本红色占位符（如 `*姓名*`）替换为 `smart-field-wrapper` 智能控件。 + - 同步将手术日期、手术名称、手术者、助手、麻醉师、麻醉方式等灰色提示文本也替换为绑定控件，提升默认模板的智能化程度。 + +3. **确保双向绑定生效** + - 替换后，新建报告时从默认模板加载的内容中已内嵌 `data-bind` 属性，用户在方格中输入即可自动同步右侧表单；右侧表单修改也会同步回方格。 + +### 非功能点 + +- 不引入新的依赖或文件，仅修改现有常量与字段映射。 +- 保持 `npm run lint` 通过。 +- 老用户已有的自定义模板不会被强制覆盖，仅默认模板生效。 + +## 影响范围预估 + +| 模块 | 影响程度 | 说明 | +|------|---------|------| +| `src/types.ts` | 中 | 修正 `BINDABLE_FIELDS` 的 key，精简为右侧表单实际存在的字段 | +| `src/utils/defaultContent.ts` | 高 | 将占位符替换为智能控件 HTML | +| `src/pages/TemplateManage.tsx` | 低 | 字段库按钮随 `BINDABLE_FIELDS` 自动更新 | +| `src/pages/ReportEditor.tsx` | 低 | 无需改动，已有双向绑定逻辑直接生效 | + +## 待确认问题 + +无。需求明确，修改范围可控。