2.8 KiB
T01 纵向世系轴基准 Implementation Plan
For agentic workers: REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (
- [ ]) syntax for tracking。
Goal: 将 T01 重构为纵向分代、关系线清晰、节点可选择的世系树基准页。
Architecture: 页面继续由 treeState 管理加载、树、阅读提示、空和失败状态。树态使用固定的三代模拟数据和绝对定位关系线，透明真实资产承载节点、状态卡和成员信息栏，横向滚动只服务同代分支扩展。
Tech Stack: uni-app、Vue 3、SCSS、现有 PNG 资产、PowerShell 静态契约、Chrome CDP 运行时验证。
Global Constraints
- 只修改 T01 及其聚焦测试、设计文档和复制到 tree 命名空间的资产。
- 不接 API，不新增路由，不使用系统弹窗或加载。
- 不执行 Git add、commit、push、reset、checkout，不使用 worktree 或多代理。
- 不删除或覆盖现有修改、测试、文档、截图与资产。
Task 1: 新视觉契约（RED）
Files:
-
Modify:
tests/t01-tree-state-contract.ps1 -
Modify:
tests/t01-all-states-visual-contract.ps1 -
要求
lineage-connector、三代横向标签、透明节点／状态／信息栏资产和现有四条路由。 -
明确禁止 T01 继续引用三个旧不透明表面资产。
-
运行两个契约，确认因页面尚未实现新结构而失败。
Task 2: 透明资产与纵向树（GREEN）
Files:
-
Create:
static/assets/modules/tree/transparent/t01-member-node.png -
Create:
static/assets/modules/tree/transparent/t01-member-node-selected.png -
Create:
static/assets/modules/tree/transparent/t01-state-panel.png -
Create:
static/assets/modules/tree/transparent/t01-member-drawer.png -
Modify:
pages/tree/t01-tree-overview.vue -
复制经过检查的现有透明资产到 tree 模块命名空间，不改动来源文件。
-
重排三代节点，加入祖先到子代的垂直／水平关系线和明确世代带。
-
实现红色选中节点、底部透明成员栏和同代横向阅读提示。
-
保留
AppLoading、查询状态和 T03/T04/T06/T07 导航。 -
运行聚焦契约并修至通过。
Task 3: 运行时与视觉复核
Files:
-
Modify only if necessary:
tests/t01-tree-state-runtime-smoke.js -
Create/update evidence under:
docs/design/screens/runtime/2026-07-20/t01-baseline/ -
运行 T01 运行时 smoke，检查各状态和人物资料跳转。
-
在既有 Chrome 标签页检查四档响应式尺寸，重点排除节点裁切、断线和底栏遮挡。
-
对同一
412×915状态做前后视觉对照并修复可见的 P0/P1/P2 问题。 -
只向用户展示正常树态，等待明确审批后再切下一状态；审批前不标记
[x]。