2.4 KiB
2.4 KiB
实现方案 —— 2026-04-19-01-03-37
方案目标
调整默认自动插入帧索引为间隔抽取、模板导出文件名加时间戳、修复占位符删除恢复居中。
需求 1:默认 autoInsertFrameIndices 改为 [0,2,4,6,8,10]
修改文件 1:src/pages/Login.tsx
在 initData() 的 defaultSettings 中,将 autoInsertFrameIndices 从 [0, 1, 2, 3, 4, 5] 改为 [0, 2, 4, 6, 8, 10]。frameCount 保持 12,framePositions 保持原有均匀分布逻辑。
修改文件 2:src/pages/SystemSettings.tsx
在 resetToDefault 函数中,补全缺失的 autoInsertFrames、autoInsertDelay、autoInsertFrameIndices 字段,并将 autoInsertFrameIndices 设为 [0, 2, 4, 6, 8, 10]。
需求 2:模板导出 JSON 文件名加时间戳
修改文件:src/pages/TemplateManage.tsx
在 handleExportTemplate 中,生成下载前追加北京时间戳:
const ts = new Date(Date.now() + 8 * 60 * 60 * 1000).toISOString().replace(/[:.]/g, '-').slice(0, 16);
a.download = `模板导出-${template.name}-${ts}.json`;
需求 3:TemplateManage 占位符删除恢复居中
修改文件:src/pages/TemplateManage.tsx
在 handleEditorClick 的删除恢复分支中,补齐与 ReportEditor 一致的逻辑:
.placeholder-text使用position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;- 恢复
width(从maxWidth)、height/lineHeight(从maxHeight) - 设置
textAlign='center'、verticalAlign='middle'、justifyContent='center'、alignItems='center' - 根据宽度判断显示"插图"(<80px)或"插入/点击放置图片"
涉及文件及修改点
| 文件 | 修改点 |
|---|---|
src/pages/Login.tsx |
defaultSettings.autoInsertFrameIndices 改为 [0,2,4,6,8,10] |
src/pages/SystemSettings.tsx |
resetToDefault 补全 autoInsert 相关字段,索引改为间隔抽取 |
src/pages/TemplateManage.tsx |
导出文件名加时间戳;删除恢复补齐居中样式 |
风险与注意事项
Login.tsx的修改只影响首次初始化(无 systemSettings 时),已有用户的 localStorage 不会被覆盖。SystemSettings.tsx的resetToDefault是用户主动触发的重置操作,会覆盖现有设置。- 两端编辑器的占位符删除恢复逻辑需要保持同步,后续修改时应同时检查 ReportEditor 和 TemplateManage。