Files
jiapuapp/docs/superpowers/plans/2026-07-17-g01-error-state-redesign.md
T
2026-07-20 06:52:33 +08:00

50 lines
2.3 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# G01 读取失败状态重设计 Implementation Plan
> **For agentic workers:** REQUIRED SUB-SKILL: Use `superpowers:executing-plans`. 本项目禁止多代理、worktree 和所有 Git 写操作。
**Goal:** 让 G01 读取失败状态与已通过的空状态、加载状态共享同一红金国风视觉体系。
**Architecture:** G01 页面继续拥有错误状态结构与 `retryLoad` 行为;视觉只消费现有透明金框、foundation 印牌、分隔线和 A 系列按钮资产,不创建新的重复资产。
**Tech Stack:** uni-app、Vue 3、SCSS、PowerShell 契约、Chrome DevTools Protocol 截图。
## Global Constraints
- 只修改 G01 失败状态及其测试。
- 保留状态判断和重试行为。
- 不生成已有资产的副本。
- H5 不是 Android 最终验收。
### Task 1: 建立失败视觉契约
**Files:**
- Create: `tests/g01-error-state-contract.ps1`
- Test: `tests/g01-error-state-contract.ps1`
- [ ] 写入断言:错误态必须引用 `g01-empty-panel-frame.png``brand-seal.png``section-divider.png``a01-scroll-primary-v3.png`,必须保留 `retryLoad`,且错误态片段不得引用 `g01-empty-panel.png`
- [ ] 运行 `powershell -ExecutionPolicy Bypass -File tests/g01-error-state-contract.ps1`,预期因现有旧面板而失败。
### Task 2: 实现透明金框错误态
**Files:**
- Modify: `pages/genealogy/g01-my-genealogies.vue`
- Test: `tests/g01-error-state-contract.ps1`
- [ ]`.state-panel--error` 内部替换为透明框、红金印牌、标题、说明、分隔线和原重试按钮。
- [ ] 为错误态设置 `1120rpx` 高度、居中内容、`132rpx × 136rpx` 印牌、`42rpx` 标题、`27rpx` 说明和 `560rpx × 124rpx` 按钮。
- [ ] 运行契约,预期输出 `G01-ERROR-STATE-CONTRACT PASS`
### Task 3: 运行与视觉回归
**Files:**
- Create: `docs/design/screens/runtime/2026-07-17/04-g01-error-after-412x900.png`
- Verify: `tests/compile-audit.ps1`
- [ ] 运行 G01 失败态契约、空状态契约、加载契约和编译审计。
- [ ] 在同一 Chrome 标签页截图 `320×568``360×640``360×800``412×915`
- [ ] 逐张检查标题、按钮、框线、背景和底栏是否裁切,并运行 `git diff --check`
## Execution Choice
用户已授权自主选择最佳方案,采用当前会话 Inline Execution;不等待额外确认。