ISISeg/工程分析/实现方案-2026-05-18-19-56-47.md

实现方案

开始时间：2026-05-18-19-56-47

后端改造

1. 视频分割返回时间映射

   • 在 _process_video 中读取源视频 fps、总帧数、时长。
   • 每个返回帧增加：
     • source_time：源视频中的时间。
     • result_time：结果视频中的时间。
     • result_index：结果视频内部帧序号。
   • 返回 source_fps、result_fps、duration、result_duration。

2. 新增单帧多方法对比接口

   • POST /api/compare-frame
   • 参数：文件、frame_index、sensitivity。
   • 后端定位到对应帧和上一帧，对该帧运行 compare_frame，返回多方法图片结果。

前端改造

1. 双视频区域

   • 左侧：原始视频。
   • 右侧：结果视频。
   • 右侧标题改为“预览与结果视频”。

2. 视频同步

   • 维护 currentFrame 和后端返回的时间映射。
   • 点击下方帧列表时同时 seek 原始视频与结果视频。
   • 用户 seek/play/pause 任一视频时同步另一个视频，使用锁避免递归触发。

3. 下方帧列表

   • 新增“预览与结果查看”区域。
   • 复用现有结果图片卡片；点击后设置当前帧并同步两个视频。

4. 多方法对比

   • 控制面板中移除方法卡片里的“多方法对比”，改为运行按钮下方的独立按钮。
   • 默认禁用。
   • 分割完成且当前帧存在时启用。
   • 点击后调用 /api/compare-frame，在弹窗中显示当前帧多方法对比。

5. 进度条

   • 移除 CSS 无限动画。
   • 使用 JS 设置固定阶段进度：准备、上传处理、生成结果、完成。

注意

结果视频目前由抽样帧组成，因此同步采用返回的 source_time 与 result_time 映射，并在用户拖动时选择最近的分割帧。