@@ -0,0 +1,78 @@
|
||||
# {{任务编号}} 前端任务:{{任务标题}}
|
||||
|
||||
## 概述
|
||||
|
||||
{{一段描述:组件级交互目标}}
|
||||
|
||||
**前置依赖**: {{依赖任务列表}}
|
||||
|
||||
## tmux 执行协议
|
||||
|
||||
- **Session**: `arno-team`,始终复用 `项目` / `后端` / `前端` / `测试` 四个 pane,禁止新建 tmux session / window / pane
|
||||
- **环境重置**: 开始前确保目标 pane 中是新启动的 `cc` 环境(/exit 后重启,清除遗留上下文)
|
||||
- **分发方式**: 由 `项目` pane 发送简短提示词,让目标 pane 自行读取任务文件
|
||||
|
||||
## 前置文档(必读)
|
||||
|
||||
> 执行本任务前必须加载以下文档,作为设计和交互规范。
|
||||
|
||||
### 设计文档(所有前端任务通用)
|
||||
- `docs/05-设计-UI.md` — 设计系统摘要(组件结构、设计令牌、色彩/排版/间距体系)
|
||||
- `docs/设计-Apple风格.md` — Apple 风格设计令牌(色彩、排版、组件规范)
|
||||
- `docs/设计-UX-错误处理.md` — 错误状态处理规范(错误提示样式/交互/文案)
|
||||
|
||||
### 编码规范(所有前端任务通用)
|
||||
- `docs/11-工程规范.md` §6(前端开发规范:Svelte 5、组件设计原则、IPC 通信模式)
|
||||
- `team/svelte.md` — Svelte 5 开发完整指南
|
||||
|
||||
### 按任务选取
|
||||
| 任务 | UI 设计文档 | UX 交互文档 | API 契约 |
|
||||
|------|-----------|-----------|---------|
|
||||
| M2-002 | `docs/设计-UI-初始化向导.md` | `docs/设计-UX-用户旅程.md` §2.1, §2.2 + `docs/设计-UX-操作流程.md` §4.1 | `docs/09-API契约.md` §5 |
|
||||
| M4-004 | `docs/设计-UI-主界面.md` | `docs/设计-UX-交互模式.md` + `docs/设计-UX-操作流程.md` §4.3 | `docs/09-API契约.md` §9.4、§9.5 |
|
||||
| M4-005 | `docs/设计-UI-主界面.md` | `docs/设计-UX-交互模式.md` + `docs/设计-UX-操作流程.md` §4.3 | `docs/09-API契约.md` §9.7 |
|
||||
| M5-003 | `docs/设计-UI-状态组件.md` | `docs/设计-UX-交互模式.md` §3.5, §3.8 | `docs/09-API契约.md` §6、§9.17 |
|
||||
| M7-003 | `docs/设计-UI-主界面.md` | `docs/设计-UX-交互模式.md` + `docs/设计-UX-操作流程.md` §4.3 | — |
|
||||
| M7-005 | `docs/设计-UI-认证.md` | `docs/设计-UX-操作流程.md` §4.2 | `docs/09-API契约.md` §9.16 |
|
||||
| M8-004 | `docs/设计-UI-其他.md` | `docs/设计-UX-用户旅程.md` §2.5 + `docs/设计-UX-操作流程.md` §4.6 | — |
|
||||
|
||||
## 功能需求(FR-NNN ~ FR-NNN)
|
||||
|
||||
- {{需求条目}}
|
||||
|
||||
## 需要创建的文件
|
||||
|
||||
### 1. `src/lib/components/{{path}}/{{Component}}.svelte` — {{组件名}}
|
||||
|
||||
{{组件结构骨架(script + markup)}}
|
||||
|
||||
### 2. 其他文件
|
||||
|
||||
{{附加组件/类型定义/Store}}
|
||||
|
||||
## 设计系统(Apple 风格)
|
||||
|
||||
| 元素 | 规范 |
|
||||
|------|------|
|
||||
| {{设计令牌}} | {{值}} |
|
||||
|
||||
## 编码规范
|
||||
|
||||
- Svelte 5 runes 语法($state, $derived, $effect, $props)
|
||||
- TypeScript 类型注解,禁止 any
|
||||
- CSS 使用设计令牌,参照 Apple 风格设计系统
|
||||
- 完整指南参考 `team/svelte.md`
|
||||
|
||||
## 验收标准
|
||||
|
||||
- {{逐条检查}}
|
||||
- 无控制台错误
|
||||
|
||||
## 验证命令
|
||||
|
||||
```bash
|
||||
cd apps/desktop/frontend && npx svelte-check --tsconfig ./tsconfig.json
|
||||
cd apps/desktop/frontend && npm run build
|
||||
```
|
||||
|
||||
完成后将产出物清单写入 `/workspace/tasks/result/{{任务编号}}.md`。
|
||||
Reference in New Issue
Block a user