Appearance
Feature: 视频节点
一句话目标
用户在视频节点中上传或生成视频,播放预览。
行为约束
约束 1:视频上传
前置条件: 视频节点已创建,无视频(空状态,显示居中占位图标) 行为: 用户点击上传区域或拖拽视频文件到节点 后置条件: 视频通过验证后(MP4/WebM,≤ 300MB)显示播放器
约束 2:上传验证
前置条件: 用户选择了文件 行为: 系统校验文件类型和大小 后置条件: 非法文件显示 toast 错误,不修改节点
约束 2a:下游节点禁止上传
前置条件: 视频节点有 incoming edge(作为其他节点的下游) 行为: 上传区域和工具栏上传按钮不渲染 后置条件: 用户无法通过任何 UI 入口上传视频,只能通过 AI 生成获得内容。删除上游连线后恢复上传能力
约束 3:视频播放
前置条件: 节点已有视频 行为: 用户可播放/暂停、拖拽进度条 seek、查看时间显示 后置条件: 播放状态实时反映在控制栏
约束 4:AI 视频生成
前置条件: 用户已输入 prompt 行为: 点击生成,调用 generateVideo API 后置条件: 生成结果替换当前视频,播放器重置
Acceptance Criteria
- [x] AC-01:空状态显示居中占位图标(flex-1 居中,简化自原有虚线上传区域)
- [x] AC-02:点击和拖拽均可上传视频
- [x] AC-03:非法文件显示错误 toast
- [x] AC-03a:下游节点(有 incoming edge)不渲染上传区域和工具栏上传按钮
- [~] AC-03b:删除上游连线后上传功能恢复
- [x] AC-04:播放/暂停/进度条/时间显示正常工作
- [x] AC-05:生成成功后视频替换并重置播放状态
- [x] AC-06:生成失败不丢失已上传的视频和 prompt
- [x] AC-07:组件卸载时释放 Object URL、abort 请求
- [~] AC-08:有视频时工具栏显示下载按钮,点击在新标签页打开视频(跨域限制,待后端代理/签名 URL 后改为直接下载)
- [~] AC-09:宽高比/分辨率/时长选项根据选中模型的 abilities 动态渲染,无 abilities 的模型不显示参数行
- [~] AC-10:resolution 的 rules 约束生效(如选择 1080p 时 duration 自动收窄为合法值)
- [~] AC-11:切换模型时自动修正所有参数到新模型支持的合法值
- [~] AC-12:生成时校验参考图片数量不超过模型的 reference_image 限制
BDD Scenarios
gherkin
Feature: 视频节点
Scenario: 上传视频并播放
Given 一个空视频节点
When 用户上传一个 MP4 文件
Then 视频预览显示在节点中
When 用户点击播放按钮
Then 视频开始播放
And 进度条实时更新
Scenario: 拒绝非法视频文件
Given 一个空视频节点
When 用户上传一个 350MB 的 MP4 文件
Then 显示文件大小超限的错误提示
And 节点保持空状态
Scenario: 下游节点禁止上传
Given 文本节点 A 连线到视频节点 B
Then B 的上传区域不显示
And B 的工具栏中没有上传按钮
Scenario: 删除上游连线后恢复上传
Given 文本节点 A 连线到视频节点 B
When 用户删除 A → B 连线
Then B 的上传区域重新显示
And B 的工具栏中上传按钮恢复
Scenario: 视频播放控制
Given 视频节点已有视频
When 用户点击播放按钮
Then 视频开始播放
And 进度条实时更新
And 时间显示格式正确
When 用户拖拽进度条到中间位置
Then 视频跳转到对应时间点
Scenario: 生成失败保持已上传视频和 prompt
Given 视频节点已有一段上传的视频
And 用户输入 prompt "转为慢动作"
When 用户点击生成按钮
And API 请求失败
Then 节点状态变为 error
And 上传的视频仍然显示
And prompt 保持 "转为慢动作"
Scenario: 生成成功后视频替换并重置
Given 视频节点处于 idle 状态
And 用户输入 prompt "生成日落延时"
When 用户点击生成按钮
And 生成成功返回新视频
Then 原视频被替换为生成结果
And 播放状态重置为暂停
And 进度条归零
Scenario: 组件卸载时释放资源
Given 视频节点处于 generating 状态
When 用户导航离开画布
Then 进行中的请求被 abort
And Object URL 被释放TDD 单元测试要点
针对文件验证逻辑:
- [ ] MP4/WebM 通过验证
- [ ] 非法类型返回错误信息
- [ ] 超过 300MB 返回错误信息
针对时间格式化:
- [x]
formatTime(65)返回"1:05"→test/nuxt/videoNode.test.ts - [x]
formatTime(0)返回"0:00"→test/nuxt/videoNode.test.ts
Out of Scope
- 截帧(暂停,跨域 CORS 方案未确定)
- 视频裁剪/剪辑
- 多段视频拼接
- 视频延长(未规划)
- 真正的文件下载(需后端代理或 COS 签名 URL,当前为新标签页打开)