feat: 剪辑计划片段CRUD前端全链路对接 #403

Merged

xiaoxia merged 19 commits from feat/edit-plan-clips-frontend into develop 2026-07-17 09:59:13 +08:00

Conversation 1 Commits 19 Files Changed 10

+2073 -67

xiaoxia commented 2026-07-16 11:53:41 +08:00

Owner

Copy Link

Copy Source

概述

对接后端 PR#389 剪辑计划片段 API，完成前端全链路整合。

主要变更

1. API 层

• 新增 12 个 clips 相关类型定义（EditPlanClip / CreateRequest / UpdateRequest 等）
• 新增 12 个 API 函数：片段CRUD（5个）+ 批量操作（3个 reorder/batch-delete/from-assets）+ 列表查询 + 复制计划

2. Hook 层

• 新建 useEditPlanClips hook（React Query 缓存 + 乐观更新 + 撤销重做）

3. 独立片段管理页

• 新建 PlanClipsManager 页面（/app/edit-plans/:planId/clips）
• 支持：列表/增删改/批量删除/排序/素材导入

4. 列表页整合

• 操作列增加「片段」入口按钮
• 增加「复制」按钮（对接 copy plan API）

5. 编辑器深度整合

• 生成前同步：生成时自动同步本地片段到后端 clips 表（先删后建策略，并发控制 3 个请求）
• 进度可视化：生成弹窗展示每个片段实时状态（等待/处理中/完成/失败）
• 加载还原：从 planId 进入时优先从 clips 表还原片段，config.segments 兜底兼容
• 右侧栏片段 Tab：编辑器内直接管理片段（增删改/排序），无需跳转独立页面
• 封面配置还原：加载计划时还原 cover_config

设计决策

• 增量式整合：不搞大重构，分阶段对接，保持向后兼容
• 生成时全量重建：先删后建策略，简单可靠，避免增量同步的复杂冲突
• 向后兼容：加载片段时 clips 表优先，config.segments 兜底（老数据无缝过渡）
• 并发控制 3：批量创建片段时限制并发数，避免请求风暴

依赖

• 后端 PR#389 (feat/edit-plan-clips-api) 需先合入

变更统计

+2159 / -49 行，11 个文件

## 概述 对接后端 PR#389 剪辑计划片段 API，完成前端全链路整合。 ## 主要变更 ### 1. API 层 - 新增 12 个 clips 相关类型定义（EditPlanClip / CreateRequest / UpdateRequest 等） - 新增 12 个 API 函数：片段CRUD（5个）+ 批量操作（3个 reorder/batch-delete/from-assets）+ 列表查询 + 复制计划 ### 2. Hook 层 - 新建 useEditPlanClips hook（React Query 缓存 + 乐观更新 + 撤销重做） ### 3. 独立片段管理页 - 新建 PlanClipsManager 页面（/app/edit-plans/:planId/clips） - 支持：列表/增删改/批量删除/排序/素材导入 ### 4. 列表页整合 - 操作列增加「片段」入口按钮 - 增加「复制」按钮（对接 copy plan API） ### 5. 编辑器深度整合 - **生成前同步**：生成时自动同步本地片段到后端 clips 表（先删后建策略，并发控制 3 个请求） - **进度可视化**：生成弹窗展示每个片段实时状态（等待/处理中/完成/失败） - **加载还原**：从 planId 进入时优先从 clips 表还原片段，config.segments 兜底兼容 - **右侧栏片段 Tab**：编辑器内直接管理片段（增删改/排序），无需跳转独立页面 - **封面配置还原**：加载计划时还原 cover_config ## 设计决策 - 增量式整合：不搞大重构，分阶段对接，保持向后兼容 - 生成时全量重建：先删后建策略，简单可靠，避免增量同步的复杂冲突 - 向后兼容：加载片段时 clips 表优先，config.segments 兜底（老数据无缝过渡） - 并发控制 3：批量创建片段时限制并发数，避免请求风暴 ## 依赖 - 后端 PR#389 (feat/edit-plan-clips-api) 需先合入 ## 变更统计 +2159 / -49 行，11 个文件

xiaoxia added 8 commits 2026-07-16 11:53:41 +08:00

feat: 生成任务取消接口 - POST /tasks/{task_id}/cancel ... 11c00811eb

新增生成任务取消接口：
- 支持 pending / running 状态的任务取消
- 取消后状态变为 cancelled，记录取消日志
- 终态（completed/failed/cancelled）不可取消，返回 409
- 权限校验：只能取消自己创建的任务
- 复用领域模型已有的 mark_cancelled 方法

feat: worker渲染任务取消检查点 - 素材下载后检测cancelled状态 ... a08eea1630

在渲染主流程中增加取消检查点：
- 素材下载完成后、启动FFmpeg前，检查generation_task状态
- 如果已被取消（cancelled），立即中止，不启动渲染
- 计划状态从 rendering 切回 editing，用户可继续编辑
- 与 API 层的取消接口配套

不修改 FFmpeg 运行时取消（后续迭代），覆盖排队/下载期间取消的场景

feat: 生成进度弹窗增加取消按钮 - 对接 cancelGenerationTask API ... 7060fa3124

- EditPlanStatus 新增 cancelled 状态及标签
- 新增 cancelGenerationTask API 函数
- 生成进度弹窗生成中状态增加"取消生成"按钮
- 取消前二次确认，防止误操作
- 轮询检测 cancelled 状态，取消后显示已取消提示
- 保存当前 generation_task_id 用于取消调用

feat: 剪辑计划片段CRUD前端对接 - 列表页复制 + 片段管理页面 ... 7e2f35d4dd

- 新增片段CRUD API 类型与函数（9个接口）
- 新增 useEditPlanClips hook（React Query 缓存 + 乐观更新）
- 新增片段管理页面 PlanClipsManager（列表/增删改/批量删除/排序/素材导入）
- 列表页操作列增加「片段」入口和「复制」按钮
- 对接后端 PR#389 feat/edit-plan-clips-api

feat: 生成前同步片段到后端clips表 ... 87e739d42f

- 编辑器新增 syncClipsToBackend 函数
- 生成前自动将本地片段同步到后端 clips 表
- 并发控制 3 个请求，删除旧片段后批量重建
- 同步失败不阻塞生成（后端有模板兜底）
- 对接后端 PR#389 clips API

feat: 生成进度弹窗增加片段状态列表 ... da07dbd1de

- 新增 genClipStatuses state 保存每个片段的处理状态
- 生成进度弹窗展示所有片段的实时状态（等待中/处理中/完成/失败）
- 处理中状态带呼吸动画效果
- 使用轮询已有的 clips 数据，无额外请求

feat: 编辑器加载计划时优先从后端clips表还原片段 ... 33ccb16bd3

- 加载计划时并行请求 clips 列表
- 优先从后端 clips 表还原片段（含 config.tts_config / trim_config）
- 无 clips 数据时从 config.segments 兜底（老数据兼容）
- 形成完整闭环：编辑→同步→生成→重新加载

feat: 编辑器深度整合 - 右侧栏片段Tab + 封面配置还原 ... 170f295d09

- 右侧栏增加属性/片段Tab切换，编辑器内直接管理片段
- 加载剪辑计划时还原封面配置（cover_config）
- 新增 EditorClipList 紧凑片段列表组件
- 片段Tab支持选中、上下移动、删除、添加操作

xiaoxia added 1 commit 2026-07-16 12:56:16 +08:00

fix: 移除EditorClipList未使用的onSplit prop bebe5a78c6

xiaoxia added 1 commit 2026-07-16 13:54:16 +08:00

style: auto-format with black ae20abaed5

xiaoxia added 1 commit 2026-07-16 20:07:34 +08:00

Merge remote-tracking branch 'origin/develop' into feat/edit-plan-clips-frontend 81a23c4dd0

xiaoxia added 2 commits 2026-07-16 21:50:05 +08:00

fix: 移除PlanClipsManager未使用的Tooltip导入 5d0880c323

fix: 修复lint错误 - 移除重复EditPlanClip定义/未使用类型导入/handleClipReorder传参 646217f78c

xiaoxia added 1 commit 2026-07-16 21:55:41 +08:00

fix: 补充ClipStatusItem类型导入 beb447d602

xiaoxia added 1 commit 2026-07-17 07:41:29 +08:00

fix: 修复前端lint和类型错误 ... dbc8cb9fb2

- STATUS_CONFIG补充cancelled状态定义
- ClipData类型增加media_asset_id字段
- EditorClipList的onAdd包一层默认参数，修复类型不匹配
- handleClipUpdate改用useCallback包裹，修复exhaustive-deps
- 修复no-explicit-any警告
- 字幕类型和常量抽离到types/subtitle.ts，满足react-refresh规则

xiaoxia added 1 commit 2026-07-17 07:47:56 +08:00

fix: 移除未使用的SubtitleMode和DEFAULT_SUBTITLE_STYLE导入 cff4ffda83

xiaoxia added 1 commit 2026-07-17 07:55:11 +08:00

style: prettier格式化 a3423c0efa

xiaoxia added 1 commit 2026-07-17 09:19:28 +08:00

style: 补充prettier格式化 7285ac9b6b

auto-approve-bot approved these changes 2026-07-17 09:30:37 +08:00

auto-approve-bot left a comment

Collaborator

Copy Link

Copy Source

CI全绿，自动审批通过。

CI全绿，自动审批通过。

xiaoxia added 1 commit 2026-07-17 09:53:14 +08:00

feat: 剪辑计划片段CRUD前端全链路对接 ... 8f1f119ef0

- 列表页新增复制计划功能
- 新增片段管理页面（PlanClipsManager）
- 编辑器深度整合：右侧栏片段Tab + 封面配置还原
- 编辑器加载计划时从后端clips表还原片段
- 生成前同步片段到后端clips表
- 生成进度弹窗增加片段状态列表
- 基于最新develop rebase，合并#428取消功能

xiaoxia force-pushed feat/edit-plan-clips-frontend from b3cac17e36 to 8f1f119ef0 2026-07-17 09:53:14 +08:00 Compare

xiaoxia merged commit abe854be76 into develop 2026-07-17 09:59:13 +08:00

xiaoxia deleted branch feat/edit-plan-clips-frontend 2026-07-17 09:59:13 +08:00

Sign in to join this conversation.

Reviewers

No Reviewers

auto-approve-bot

Labels

Clear labels

P0

阻塞性，必须立即处理

P1

高优先级

P2

中优先级

P3

低优先级/后考虑

architecture

架构设计

backend

后端相关

blocked

阻塞中

bug

Bug修复

ci-bug

CI本身的bug

ci-optimization

CI优化类任务

ci-pipeline

CI流水线/workflow相关

cleanup

代码清理

devops

运维/部署/CI

documentation

文档相关

feature

新功能

frontend

前端相关

question

需要讨论确认

ready

PR CI通过，可合并

refactor

代码重构

No Label

Milestone

No items

No Milestone

Projects

Clear projects

No project

Assignees

Clear assignees

auto-approve-bot xiaoxia

No Assignees

2 Participants

Notifications

Subscribe

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: xiaoxia/xiaoxia-saas#403