- Add postOpCondition, specimenDescription, pathologySent, frozenPathology to Report type and DEFAULT_FORM_FIELDS - Replace static placeholders in defaultContent.ts with smartField() calls - Auto-merge missing fields from DEFAULT_FORM_FIELDS into existing formFieldsConfig in ReportEditor and TemplateManage
3.2 KiB
3.2 KiB
实现方案 — 模板新增术后字段(2026-04-17-09-57-08)
一、修改文件清单
src/types.ts— 扩展Report类型 + 追加DEFAULT_FORM_FIELDSsrc/utils/defaultContent.ts— 替换默认模板中的 4 处占位文本为smartField()src/pages/ReportEditor.tsx— 增加formFieldsConfig自动补全/升级逻辑src/pages/TemplateManage.tsx— 增加同样的自动补全/升级逻辑
二、详细改动
2.1 src/types.ts
A. Report 接口追加字段
postOpCondition?: string;
specimenDescription?: string;
pathologySent?: string;
frozenPathology?: string;
B. DEFAULT_FORM_FIELDS 追加 4 条
{ key: 'postOpCondition', label: '手术后情况', category: '单选', type: 'single_select', visibleInForm: true, isSystemLocked: false, options: ['患者麻醉恢复后安返病房'] },
{ key: 'specimenDescription', label: '切除标本描述', category: '单选', type: 'single_select', visibleInForm: true, isSystemLocked: false, options: [] },
{ key: 'pathologySent', label: '是否送检病理', category: '单选', type: 'single_select', visibleInForm: true, isSystemLocked: false, options: ['是', '否'] },
{ key: 'frozenPathology', label: '冰冻病理结果', category: '填空', type: 'text', visibleInForm: true, isSystemLocked: false },
2.2 src/utils/defaultContent.ts
将模板底部 template-info-section 中的 4 处文本替换:
患者麻醉恢复后安返病房→${smartField('postOpCondition')}<span style="color: #bdbdbd;">切除标本描述</span>→${smartField('specimenDescription')}是→${smartField('pathologySent')}<span style="color: #bdbdbd;">冰冻病理结果</span>→${smartField('frozenPathology')}
2.3 src/pages/ReportEditor.tsx
在初始化 useEffect 中,读取 formFieldsConfig 后增加字段合并逻辑:
const savedFields = storage.get<FormField[]>('formFieldsConfig', []);
let mergedFields = savedFields;
if (savedFields.length > 0) {
const missing = DEFAULT_FORM_FIELDS.filter(def => !savedFields.some(f => f.key === def.key));
if (missing.length > 0) {
mergedFields = [...savedFields, ...missing];
storage.set('formFieldsConfig', mergedFields);
}
setFormFields(mergedFields);
} else {
setFormFields(DEFAULT_FORM_FIELDS);
storage.set('formFieldsConfig', DEFAULT_FORM_FIELDS);
}
2.4 src/pages/TemplateManage.tsx
在同样的初始化位置执行完全相同的合并逻辑,保证两个页面中的字段配置一致性。
三、风险与回滚
- 风险:修改
DEFAULT_FORM_FIELDS和默认模板后,新用户直接生效;老用户通过合并逻辑无痛升级。 - 回滚:如出现问题,可将
DEFAULT_FORM_FIELDS恢复为 14 条,并回滚defaultContent.ts中的 4 处替换。
四、验证计划
- 清空浏览器 localStorage 后刷新,确认新建报告时模板底部 4 处为可编辑方框。
- 在右侧表单中操作 4 个新控件,观察模板方框实时同步。
- 在模板方框中直接输入,观察右侧表单实时同步。
- 预先写入旧版
formFieldsConfig(14 条),刷新页面,确认自动补全为 18 条。