文档
08_归档04_VOZEB任务卡

VOZEB-UI-MIGRATION-02-M05-CANVAS-LIST — 画布列表页

Task ID: VOZEB-UI-MIGRATION-02-M05-CANVAS-LIST
目标用户结果: 用户能在统一 Ocean Way 壳层中浏览、创建、打开、重命名、选择、删除、导入和导出自己的画布
Feature ID / Atomic Requirement IDs: SPACE-P0-001..005(仅承载视觉与既有列表交互)
Base SHA: f576239f4a6ee6fc97c0326f8e9201fce9c6c11d
必须阅读: VOZEB-UI-FOUNDATION-01.md;VOZEB-UI-MIGRATION-02.md;canvas-project-contract.ts;canvas-clean-room.test.ts
允许修改: 本任务包;web/src/app/(user)/canvas/page.tsx;web/src/app/(user)/canvas/components/canvas-project-card.tsx;web/src/app/(user)/canvas/canvas-list-layout.test.tsx;web/src/app/(user)/canvas/canvas-list.module.css
禁止修改: canvas/stores/**;canvas/utils/**;services/api/canvas-projects.ts;API/contracts/Go/migrations;canvas/[id]/**;共享 Ocean 组件;layout/navigation;assets、drama 与其它页面
范围: 将列表页接入 OceanGlassCard、OceanStatusCluster、OceanReveal、OceanLoadingShell、OceanUtilityControl 和现有 UI Button;统一浅色/深色、加载/错误/空态、选择与操作控件的中性 Ocean Air 视觉
非目标: 不改变 Canvas store、API、分页、导入导出、删除、重命名、路由、节点、相机、关系、持久化或编辑器实现
已冻结契约与数据模型: CanvasProjectSummary、useCanvasStore/useCanvasUiStore、CanvasProjectCard 的 callbacks、现有 aria-label、/canvas 与 /canvas/:id 路由保持不变
安全与数据限制: 仅本地合成数据和现有用户会话;不读取或输出 Secret,不触发真实上游、账务或生产写入
验收命令: pnpm exec vitest run src/app/(user)/canvas/canvas-list-layout.test.tsx src/app/(user)/canvas/canvas-clean-room.test.ts;pnpm exec tsc --noEmit --pretty false;pnpm exec eslint src/app/(user)/canvas/page.tsx src/app/(user)/canvas/components/canvas-project-card.tsx --quiet;pnpm exec prettier --check docs/oceanway/VOZEB-UI-MIGRATION-02-M05-CANVAS-LIST.md src/app/(user)/canvas/page.tsx src/app/(user)/canvas/components/canvas-project-card.tsx src/app/(user)/canvas/canvas-list-layout.test.tsx src/app/(user)/canvas/canvas-list.module.css;pnpm run build;git diff --check
人工决策点: LOCAL_IMPLEMENTATION_CANDIDATE / CANDIDATE_EVIDENCE / NOT_FORMAL_TEST;编辑器 /canvas/:id 另建切片
交付物: Ocean Glass 画布列表、状态/空态/加载层、无蓝色正文的卡片操作控件、布局契约测试

验收边界

  • 列表页继续只使用由 AppWorkspaceShell 提供的单一背景,不新增 WebGL 或页面背景。
  • 卡片保留原有事件冒泡阻断、键盘标题入口、选择框、重命名输入和导出/发布/删除动作。
  • 页面动作色只用于图形和实心主动作;标题、描述、元数据和操作标签使用 Ocean Air 中性文字。
  • OceanGlassCard 只作为静态列表表面,不能把编辑器 OceanCanvasKit 或 /canvas/[id] 状态机带入列表。
  • 所有改动仍登记为候选实现,不提升正式 Development、Testing 或 Operations 状态。

On this page