## MODIFIED Requirements

### Requirement: 任务列表页面路径

混剪任务管理系统 SHALL 将混剪任务列表页面路径从 `/material/mix-task` 变更为 `/system/task-management/mix-task`。

#### Scenario: 访问混剪任务列表
- **WHEN** 用户访问 `/system/task-management/mix-task`
- **THEN** 显示混剪任务列表页面
- **AND** 左侧导航中「混剪视频任务」项高亮

### Requirement: 页面布局结构调整

混剪任务列表页面 SHALL 使用任务中心的子页面布局，不再包含独立的顶部标题栏。

#### Scenario: 显示混剪任务列表
- **WHEN** 用户在任务中心访问混剪任务列表
- **THEN** 页面不显示独立的标题栏
- **AND** 页面内容适配任务中心的右侧内容区域

### Requirement: 组件导入路径优化

混剪任务列表页面 SHALL 使用 `@/` 别名路径导入组件和 API。

#### Scenario: 导入通用组件
- **WHEN** 混剪任务列表需要使用通用组件
- **THEN** 使用 `@/views/task-management/components/ComponentName.vue` 导入
- **AND** 不再使用 `../../` 等相对路径

### Requirement: 筛选栏组件化

混剪任务列表 SHALL 将筛选栏抽取为独立组件 `TaskFilterBar.vue`。

#### Scenario: 使用筛选栏组件
- **WHEN** 渲染混剪任务列表页面
- **THEN** 使用 `<TaskFilterBar />` 组件显示筛选条件
- **AND** 组件支持 v-model 双向绑定

### Requirement: 状态标签组件化

混剪任务列表 SHALL 将状态显示抽取为独立组件 `TaskStatusTag.vue`。

#### Scenario: 显示任务状态
- **WHEN** 渲染任务列表中的状态列
- **THEN** 使用 `<TaskStatusTag :status="task.status" />` 组件
- **AND** 组件根据状态值显示不同颜色的标签

### Requirement: 操作按钮组件化

混剪任务列表 SHALL 将操作按钮抽取为独立组件 `TaskActionButtons.vue`。

#### Scenario: 显示任务操作按钮
- **WHEN** 渲染任务列表中的操作列
- **THEN** 使用 `<TaskActionButtons :task="task" />` 组件
- **AND** 组件根据任务状态显示不同的操作按钮

### Requirement: Composable 逻辑复用

混剪任务列表 SHALL 使用 Composable 抽取通用逻辑。

#### Scenario: 使用 useTaskList
- **WHEN** 混剪任务列表需要加载数据
- **THEN** 调用 `useTaskList(fetchApi)`
- **AND** 使用返回的数据和方法渲染页面

### Requirement: API 调用保持不变

混剪任务列表 SHALL 继续使用 `MixTaskService` 调用后端 API。

#### Scenario: 获取混剪任务列表
- **WHEN** 页面需要加载任务列表
- **THEN** 调用 `MixTaskService.getTaskPage(params)`

### Requirement: 功能完整性保持

混剪任务列表 SHALL 保持所有现有功能。

#### Scenario: 所有功能正常工作
- **WHEN** 用户使用混剪任务列表
- **THEN** 筛选、搜索、分页、操作功能正常
- **AND** 状态轮询机制正常
- **AND** 错误处理机制正常

### Requirement: 路由元信息配置

混剪任务列表页面 SHALL 通过路由 meta 信息设置页面标题。

#### Scenario: 设置页面标题
- **WHEN** 用户访问混剪任务列表页面
- **THEN** 浏览器标题栏显示「混剪任务」

### Requirement: 性能优化实施

混剪任务列表 SHALL 实施性能优化措施。

#### Scenario: 性能优化实施
- **WHEN** 任务列表渲染大量数据
- **THEN** 使用防抖处理搜索输入
- **AND** 页面隐藏时暂停轮询

### Requirement: 向后兼容支持

混剪任务列表 SHALL 提供向后兼容方案。

#### Scenario: 兼容旧路径
- **WHEN** 用户访问旧路径 `/material/mix-task`
- **THEN** 系统重定向到 `/system/task-management/mix-task`

### Requirement: 测试覆盖实施

混剪任务列表 SHALL 实施完整的测试覆盖。

#### Scenario: 编写测试用例
- **WHEN** 混剪任务列表页面重构完成
- **THEN** 编写组件渲染测试、API调用测试、用户交互测试