08_归档04_VOZEB任务卡
VOZEB-UI-MIGRATION-02-M07-ASSETS — 我的素材列表页
Task ID: VOZEB-UI-MIGRATION-02-M07-ASSETS
目标用户结果: 用户能在统一的 Ocean Air 工作区中筛选、浏览、预览、创建、编辑、导入、导出、下载、发布和删除自己的文本、图片、视频与音频素材
Feature ID / Atomic Requirement IDs: ATD-P0-001/002/003/005(仅承载视觉与既有素材库交互)
Base SHA: fbd66caf43e0f424ac49ce1102b0942c94d68241
必须阅读: VOZEB-UI-FOUNDATION-01.md;VOZEB-UI-MIGRATION-02.md;library-asset-contract.ts;use-asset-page.ts;既有 Asset store/API/transfer 契约
允许修改: 本任务包;web/src/app/(user)/assets/page.tsx;web/src/app/(user)/assets/asset-elements.tsx;同目录新增 assets 页面/元素 CSS module;同目录新增或调整定向视觉契约测试
禁止修改: use-asset-page.ts;asset-transfer.ts;stores/use-asset-store.ts;services/api/library-assets.ts;上传与媒体存储 services;API/contracts/Go/migrations;共享 Ocean/UI 组件;layout/navigation;其它页面
范围: 使用 OceanGlassCard、OceanContentCard、OceanLoadingShell、OceanUtilityControl、OceanReveal 与现有 UI Button 收口页面标题、状态、筛选工具栏、素材卡、加载/错误/空态、分页、详情与新增/编辑弹窗;统一 light/dark、390/430 和可访问性降级
非目标: 改变 CRUD、服务端分页、防抖、筛选、上传、拖拽、导入导出、发布跳转、删除确认、所有权校验、媒体 URL、MIME、下载文件名、Store/API callback 或持久化语义;新增 WebGL、依赖或真实媒体调用
已冻结契约与数据模型: Asset/AssetKind/CreateLibraryAssetInput、useAssetPage 输入输出、addAsset/updateAsset/removeAsset/listAllLibraryAssets、AssetCard/AssetPreviewModal callbacks、/assets 与 /works 路由保持不变
安全与数据限制: 仅页面呈现和现有本地合成会话;不读取 Secret,不触发真实上游或账务,不把媒体或业务列表写入浏览器持久存储
验收命令: pnpm exec vitest run src/app/(user)/assets --reporter=dot;pnpm exec tsc --noEmit --pretty false;pnpm exec eslint src/app/(user)/assets/page.tsx src/app/(user)/assets/asset-elements.tsx src/app/(user)/assets/*.test.tsx --quiet;pnpm exec prettier --check docs/oceanway/VOZEB-UI-MIGRATION-02-M07-ASSETS.md src/app/(user)/assets/page.tsx src/app/(user)/assets/asset-elements.tsx src/app/(user)/assets/*.module.css src/app/(user)/assets/*.test.tsx;pnpm run build;git diff --check
人工决策点: LOCAL_IMPLEMENTATION_CANDIDATE / CANDIDATE_EVIDENCE / NOT_FORMAL_TEST;素材业务契约、正式测试和发布状态不提升
交付物: Ocean Air 素材列表页、内容优先卡片、状态/弹窗/响应式视觉契约测试、任务包验收边界
- 页面继续复用
AppWorkspaceShell的单一背景,不新增 WebGL、页面级背景或每卡 Liquid Glass renderer;静态素材卡只使用单层 Ocean 表面。 - 普通标题、描述、标签、来源、媒体摘要和按钮文案全部使用 Ocean Air 中性文字;蓝色只用于实心主动作、焦点和选中图形,不出现蓝色正文或紫色渐变。
- 现有搜索、类型筛选、页码/页大小、导入导出、创建/编辑表单、封面和媒体拖拽、复制/下载/发布/删除回调以及所有
aria-label保持可用。 - loading/error/empty/ready 状态与最终列表几何一致;reduced motion/transparency 和 forced colors 下不依赖动画、模糊或透明度理解内容。
- 390px、430px 与桌面布局不得产生页面横向溢出;分页、筛选和弹窗内部允许保留隐藏滚动条的真实滚动能力,不得裁切控件。
- 本切片只登记候选实现,不宣称正式 Development、Testing 或 Operations 结论。