34 lines
1.1 KiB
Markdown
34 lines
1.1 KiB
Markdown
# 实现方案
|
||
|
||
开始时间:2026-05-18-19-06-50
|
||
|
||
## Web 端改造
|
||
|
||
1. 信息架构
|
||
- 顶部状态栏显示服务状态、当前任务和输出视频入口。
|
||
- 左侧工作流区域包含上传/样例、算法、参数和运行按钮。
|
||
- 右侧结果区域包含预览、指标总览、结果帧网格和单帧详情。
|
||
|
||
2. 交互增强
|
||
- 文件拖拽上传。
|
||
- 样例视频一键加载为 `File` 对象后提交。
|
||
- 算法使用卡片式单选,保留 `<select>` 作为表单值。
|
||
- 运行中显示进度条和状态文案。
|
||
- 点击结果卡片可打开详情弹窗,查看原图、叠加图、掩膜和指标。
|
||
|
||
3. 后端补充
|
||
- 增加 `/api/samples`,返回可用样例文件和 URL,便于前端加载样例。
|
||
|
||
4. 视觉方向
|
||
- 医学影像控制台风格:深色工作台、琥珀高亮、青绿色状态色、紧凑信息密度。
|
||
- 避免营销页布局,首屏就是工具。
|
||
|
||
## 影响范围
|
||
|
||
- `frontend/index.html`
|
||
- `frontend/styles.css`
|
||
- `frontend/app.js`
|
||
- `backend/main.py`
|
||
- `README.md`
|
||
- 相关测试与工程分析文档
|