155 lines
6.8 KiB
Markdown
155 lines
6.8 KiB
Markdown
# G 类型页面共用 C 背景 Implementation Plan
|
||
|
||
> **For agentic workers:** 本计划由当前主代理在同一会话内执行；用户明确禁止多代理、worktree、git add、commit、push、reset 和 checkout。
|
||
|
||
**Goal:** 让 9 个活动 G 页面通过一个公共组件完整显示 C 背景，左右不裁剪、不变形，并用宣纸底色延展剩余页面。
|
||
|
||
**Architecture:** `components/GenealogyPageBackground.vue` 是背景资产路径和显示规则的唯一所有者。各 G 页面移除旧背景图片与私有背景样式，只保留一个公共组件实例；测试从 `pages.json` 推导路由，防止页面清单漂移。
|
||
|
||
**Tech Stack:** uni-app、Vue 单文件组件、SCSS、PowerShell 契约测试、Node.js 运行冒烟测试。
|
||
|
||
## Global Constraints
|
||
|
||
- 仅修改 G 类型页面背景层，不改变页面内容、结构、交互和接口。
|
||
- C 背景按宽度等比显示，顶部对齐，左右不裁剪、不变形。
|
||
- 高屏和长页面未覆盖区域使用同色宣纸底色延展。
|
||
- 不实施 G01 固定区／列表独立滚动。
|
||
- 不使用多代理或 worktree，不执行任何 Git 写操作。
|
||
- H5 截图仅作为内部候选，不能替代 Android/HBuilderX 复核。
|
||
|
||
---
|
||
|
||
### Task 1: 建立公共背景契约
|
||
|
||
**Files:**
|
||
- Create: `tests/genealogy-shared-background-contract.ps1`
|
||
- Read: `pages.json`
|
||
|
||
**Interfaces:**
|
||
- Consumes: `pages.json` 中所有 `pages/genealogy/g*.vue` 活动路由。
|
||
- Produces: 每个 G 页面必须渲染一次 `<GenealogyPageBackground />` 的仓库契约。
|
||
|
||
- [ ] **Step 1: 写失败测试**
|
||
|
||
测试必须断言：公共组件存在；组件唯一引用 `/static/assets/modules/genealogy/opaque/genealogy-page-background.png`；使用 `mode="widthFix"`；包含固定满屏宣纸底层和宽度 `100%` 的图片；每个实际 G 页面恰好使用一次公共组件；页面不得直接引用旧纸纹、旧页脚或公共背景文件。
|
||
|
||
- [ ] **Step 2: 运行测试确认失败**
|
||
|
||
Run: `powershell -NoProfile -ExecutionPolicy Bypass -File tests/genealogy-shared-background-contract.ps1`
|
||
|
||
Expected: 因公共组件和公共资产尚不存在而失败。
|
||
|
||
### Task 2: 实现单一公共背景入口
|
||
|
||
**Files:**
|
||
- Create: `components/GenealogyPageBackground.vue`
|
||
- Create: `static/assets/modules/genealogy/opaque/genealogy-page-background.png`
|
||
- Modify: `design-pipeline/manifests/g01-background-candidates.json`
|
||
- Modify: `design-pipeline/tests/g01-background-candidates.test.mjs`
|
||
|
||
**Interfaces:**
|
||
- Consumes: C 母版和可重建生成结果。
|
||
- Produces: 无属性、无事件的 `<GenealogyPageBackground />` 视觉组件。
|
||
|
||
- [ ] **Step 1: 将当前 C 生成结果复制为 G 模块公共运行资产**
|
||
|
||
源文件为 `design-pipeline/generated/g01-background/g01-list-background-direction-c.png`；目标文件为 `static/assets/modules/genealogy/opaque/genealogy-page-background.png`。复制后验证 SHA-256 仍为 `f14aeed81046d2d5e7ae78b1e62f572689c38261a2cc043142bef9f70200dc5b`。
|
||
|
||
- [ ] **Step 2: 创建最小公共组件**
|
||
|
||
组件使用固定满屏 `view` 提供宣纸底色，并在顶部放置 `width: 100%`、`mode="widthFix"` 的 C 背景图片；组件必须 `pointer-events: none` 且位于页面内容下方。
|
||
|
||
- [ ] **Step 3: 更新流水线清单测试和运行输出所有权**
|
||
|
||
将 manifest 的 `runtimeOutput` 改为公共资产路径，并让 Node 测试断言新路径，避免 G01 私有资产继续成为正式入口。
|
||
|
||
### Task 3: 迁移 9 个 G 页面
|
||
|
||
**Files:**
|
||
- Modify: `pages/genealogy/g01-my-genealogies.vue`
|
||
- Modify: `pages/genealogy/g03-create-genealogy.vue`
|
||
- Modify: `pages/genealogy/g05-genealogy-overview.vue`
|
||
- Modify: `pages/genealogy/g06-search-genealogies.vue`
|
||
- Modify: `pages/genealogy/g08-join-application.vue`
|
||
- Modify: `pages/genealogy/g09-my-applications.vue`
|
||
- Modify: `pages/genealogy/g10-application-review.vue`
|
||
- Modify: `pages/genealogy/g11-genealogy-settings.vue`
|
||
- Modify: `pages/genealogy/g12-generation-poems.vue`
|
||
|
||
**Interfaces:**
|
||
- Consumes: `<GenealogyPageBackground />`。
|
||
- Produces: 每个 G 页面一个公共背景实例，页面内容和交互保持原样。
|
||
|
||
- [ ] **Step 1: 替换模板背景层**
|
||
|
||
删除各页开头的旧纸纹和页脚山水图片，或 G01 的私有 C 背景图片，原位置统一放置 `<GenealogyPageBackground />`。
|
||
|
||
- [ ] **Step 2: 删除仅服务于旧背景的样式**
|
||
|
||
删除 9 个页面中对应 `__paper`、`__footer`、`page-paper-texture`、`page-footer-landscape` 或 `page-background` 规则；不改相邻内容样式。
|
||
|
||
- [ ] **Step 3: 运行公共背景契约确认通过**
|
||
|
||
Run: `powershell -NoProfile -ExecutionPolicy Bypass -File tests/genealogy-shared-background-contract.ps1`
|
||
|
||
Expected: `PASS G genealogy shared background contract`。
|
||
|
||
### Task 4: 更新既有契约与权威资料
|
||
|
||
**Files:**
|
||
- Modify: `tests/g01-visual-contract.ps1`
|
||
- Modify: `docs/交接记录.md`
|
||
- Modify: `docs/验收规划.md`
|
||
- Modify: `docs/design/P00_页面结构与资产清单.md`
|
||
- Modify: `docs/design/设计资产生产流水线规范.md`
|
||
- Modify: `docs/design/G01_列表背景候选与换机重建.md`
|
||
- Modify: `design-qa.md`
|
||
|
||
**Interfaces:**
|
||
- Consumes: 公共组件、公共资产路径和用户本轮决定。
|
||
- Produces: 文档与实际代码一致的未验收状态说明。
|
||
|
||
- [ ] **Step 1: 更新 G01 视觉契约**
|
||
|
||
契约改为检查公共组件和公共资产 SHA-256，不再要求 G01 私有资产路径。
|
||
|
||
- [ ] **Step 2: 更新权威资料**
|
||
|
||
记录 C 已成为 9 个 G 页面公共背景；明确完整显示和宣纸延展规则，同时保留“G01 未整页验收、其他 G 页面未逐页截图复核、Android 复核缺失”。
|
||
|
||
### Task 5: 验证和截图审核
|
||
|
||
**Files:**
|
||
- Runtime evidence only: `docs/design/screens/runtime/2026-07-16/`
|
||
|
||
**Interfaces:**
|
||
- Consumes: H5 运行页和四个目标视口。
|
||
- Produces: 仅供内部审核的运行截图与测试证据。
|
||
|
||
- [ ] **Step 1: 运行聚焦验证**
|
||
|
||
Run: `powershell -NoProfile -ExecutionPolicy Bypass -File tests/genealogy-shared-background-contract.ps1`
|
||
|
||
Run: `powershell -NoProfile -ExecutionPolicy Bypass -File tests/g01-visual-contract.ps1`
|
||
|
||
Run: `powershell -NoProfile -ExecutionPolicy Bypass -File tests/g01-empty-state-contract.ps1`
|
||
|
||
Run: `node --test design-pipeline/tests/g01-background-candidates.test.mjs`
|
||
|
||
Run: `design-pipeline/.venv/Scripts/python.exe -m unittest design-pipeline/tests/test_build_g01_backgrounds.py -v`
|
||
|
||
Run: `node tests/g01-empty-state-runtime-smoke.js`
|
||
|
||
Run: `git diff --check`
|
||
|
||
Expected: 所有测试退出码为 0；`git diff --check` 无空白错误。
|
||
|
||
- [ ] **Step 2: 四档 H5 截图复核 G01**
|
||
|
||
在 320×568、360×640、360×800、412×915 下确认完整左右边缘、无纵向拉伸、无横向溢出，图片下方自然过渡到宣纸底色。
|
||
|
||
- [ ] **Step 3: 报告验证边界**
|
||
|
||
报告 H5 内部候选结果，不宣称 G01 或其他 G 页面正式验收；保留 Android/HBuilderX 真机或模拟器复核缺口。
|
||
|