- Remove surgeonSignature and hospitalLogo from DEFAULT_FORM_FIELDS. - Replace logo and signature in default template with inline image-placeholder spans. - Enhance insertImage() in both editors with prompt for max-width/height (px). - Abbreviate placeholder text to '插入图片' when width < 80px. - Force inline insertion using display:inline-flex + vertical-align:middle. - Port image-source picker modal from ReportEditor to TemplateManage. - Remove legacy triggerPlaceholderUpload direct upload logic.
3.1 KiB
3.1 KiB
测试方案 — 2026-04-17-19-26-17
测试目标
验证 6 项需求全部正确实现,且不破坏现有编辑、保存、打印功能。
测试步骤
1. 编译检查
npm run lint
- 预期:
tsc --noEmit通过,0 errors。
2. 字段体系清理(需求 1)
- 进入
/template-manage。 - 在"插入字段"Tab 中,确认分类列表只有"填空、单选、多选、时间",没有"图片"。
- 在"字段管理"Tab 中,确认同样没有"图片"分组。
- 在"字段管理 → 新增字段"中,确认 category select 没有"图片"选项,type select 也不会出现"图片"。
3. 默认模板占位符替换(需求 4)
- 重新加载默认模板(或清空 localStorage 后重新登录)。
- 确认模板顶部 Logo 处显示为一个虚线框占位符(而非直接显示医院 Logo 图片)。
- 确认"手术者签名:"后方显示为一个虚线框占位符,而非
smart-field-wrapper文本框。
4. 插入图片占位符同行与尺寸设置(需求 2、5)
- 在
/template-manage编辑器中,将光标放在一段文字中间,点击工具栏"插入图片占位符"。 - 在 prompt 中输入宽度
120,高度60。 - 确认占位符插入后与前后文字保持在同一行,没有换行。
- 使用浏览器 DevTools 检查该占位符,确认
style中包含display:inline-flex和max-width:120px; max-height:60px;。 - 在
/report-editor中重复上述操作,确认行为一致。 - 测试留空宽高:确认插入的占位符没有
max-width/max-height,但有默认的padding: 8px 16px;。
5. 占位符文字自适应(需求 3)
- 插入一个宽度为
60px的图片占位符。 - 确认占位符内显示的文字是**"插入图片"**(而非"插入/点击放置图片")。
- 插入一个宽度为
120px的占位符,确认显示"插入/点击放置图片"。
6. 图片来源选择弹窗统一(需求 6)
- 在
/template-manage中,点击任意无图片的image-placeholder。 - 确认弹出"选择图片来源"弹窗,包含"本地上传"、"我的签名"、"系统素材"三个选项。
- 选择"系统素材"中的医院 Logo,确认占位符被替换为 Logo 图片。
- 在
/report-editor中点击占位符,确认弹窗行为与/template-manage完全一致。 - 测试弹窗中的"取消"按钮,确认点击后弹窗关闭且占位符未被修改。
7. 回归测试
- 保存模板:修改模板后点击保存,刷新页面确认内容不丢失。
- 保存报告:在
/report-editor中填写表单并保存草稿,确认内容持久化。 - 打印预览:确认图片占位符(已填充和未填充)在打印预览中显示正常。
- 撤销重做:插入占位符后按
Ctrl+Z,确认占位符被正确撤销。 - 拖拽/自动插入关键帧:确认
/report-editor中的视频关键帧仍能正常插入到图片占位符中。
判定标准
全部测试通过后方可认为任务完成。若任何测试失败,需回滚并重新分析根因。