rain
118 lines
4.6 KiB
Markdown
118 lines
4.6 KiB
Markdown
# A04 同步 A01 新视觉体系实施计划
|
||
|
||
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||
|
||
**Goal:** 将 A04 页面内旧认证视觉全部替换为 A01 已审核的新体系，并移除非最终的自定义滑动验证面板。
|
||
|
||
**Architecture:** A04 继续独立拥有注册字段和校验逻辑，只复用 A01 已生产的位图资产与全局字体合同。主按钮按固定比例等比显示，Toast 使用同一张可切片资产；真实滑动验证由后续接口组件负责，当前有效提交只显示待接入反馈。
|
||
|
||
**Tech Stack:** uni-app Vue 3、SCSS、PowerShell 静态契约、Chrome CDP 运行 smoke。
|
||
|
||
## Global Constraints
|
||
|
||
- A04 Logo 必须为 `184×221rpx`、`top: 64rpx`、水平居中。
|
||
- 禁止 A04 引用 `a01-primary-button.png`、`a01-secondary-button.png`、`a02-login-panel.png` 或局部 `STSong/SimSun`。
|
||
- 注册主按钮使用 `a01-scroll-primary-v3.png` 和 `aspectFit`；Toast 使用 `a01-scroll-toast-v3.png` 的 `border-image`。
|
||
- 协议图标、返回箭头、宗祠底板保留。
|
||
- 不使用 worktree，不执行 Git 暂存、提交、推送、重置或清理。
|
||
- 不修改 A01 或其他页面，不对接接口，不把 H5 写成 Android 或用户整页验收。
|
||
|
||
---
|
||
|
||
### Task 1: 用契约锁定 A04 新视觉和验证边界
|
||
|
||
**Files:**
|
||
- Modify: `tests/a04-registration-contract.ps1`
|
||
- Modify: `tests/a04-registration-runtime-smoke.js`
|
||
|
||
**Interfaces:**
|
||
- Consumes: A04 当前页面结构与 A01 v3 资产路径。
|
||
- Produces: 旧资产禁止、Logo 精确尺寸、Toast 切片和有效提交反馈的回归合同。
|
||
|
||
- [ ] **Step 1: 写入失败静态契约**
|
||
|
||
要求 A04 包含 `a01-vnext-divider-v1.png`、`a01-scroll-primary-v3.png`、`a01-scroll-toast-v3.png`、`width: 184rpx;`、`height: 221rpx;`、`border-image-slice:` 和“滑动验证待接口接入”；禁止三个旧资产、`verificationVisible`、`verification-layer`、`feedback-toast__skin` 与 `font-family:`。
|
||
|
||
- [ ] **Step 2: 更新运行 smoke 的期望**
|
||
|
||
有效表单提交后等待 `.feedback-toast`，断言文案为“滑动验证待接口接入”，并断言页面不存在 `.verification-layer`；四档尺寸改为 `320×568`、`360×640`、`360×800`、`412×915`。
|
||
|
||
- [ ] **Step 3: 运行测试确认 RED**
|
||
|
||
运行：
|
||
|
||
```powershell
|
||
powershell.exe -NoProfile -ExecutionPolicy Bypass -File tests/a04-registration-contract.ps1
|
||
```
|
||
|
||
预期：因 A04 仍引用旧主按钮和旧验证面板而失败。
|
||
|
||
---
|
||
|
||
### Task 2: 最小迁移 A04 页面
|
||
|
||
**Files:**
|
||
- Modify: `pages/auth/a04-register.vue`
|
||
|
||
**Interfaces:**
|
||
- Consumes: `a01-vnext-divider-v1.png`、`a01-scroll-primary-v3.png`、`a01-scroll-toast-v3.png` 与全局字体。
|
||
- Produces: A04 新默认态、错误态、协议态和滑动验证待接入反馈。
|
||
|
||
- [ ] **Step 1: 替换模板资产**
|
||
|
||
将标题分隔和主按钮改为新资产与 `aspectFit`，删除验证弹层模板及 Toast 内部拉伸图片。
|
||
|
||
- [ ] **Step 2: 收敛脚本状态**
|
||
|
||
删除 `verificationVisible`、`closeVerification`、`confirmVerification`；有效提交改为：
|
||
|
||
```js
|
||
showFeedback('滑动验证待接口接入')
|
||
```
|
||
|
||
- [ ] **Step 3: 同步样式**
|
||
|
||
将 `.brand-seal` 改为 `184×221rpx`；移除所有局部 `font-family`；主按钮保持现有点击槽但等比承载 v3 皮肤；Toast 使用：
|
||
|
||
```scss
|
||
border: 16rpx solid transparent;
|
||
border-width: 16rpx 74rpx;
|
||
border-image-source: url('/static/assets/foundation/transparent/a01-scroll-toast-v3.png');
|
||
border-image-slice: 58 280 fill;
|
||
border-image-width: 16rpx 74rpx;
|
||
border-image-repeat: stretch;
|
||
```
|
||
|
||
- [ ] **Step 4: 运行静态合同确认 GREEN**
|
||
|
||
运行静态合同，预期输出 `A04-REGISTRATION-CONTRACT PASS`。
|
||
|
||
---
|
||
|
||
### Task 3: 真实运行验证与浏览器交付
|
||
|
||
**Files:**
|
||
- Modify: `design-qa.md`
|
||
|
||
**Interfaces:**
|
||
- Consumes: A04 已迁移页面与 CDP 调试页。
|
||
- Produces: 四档响应式结果和浏览器中的 A04 默认态。
|
||
|
||
- [ ] **Step 1: 运行 A04 smoke**
|
||
|
||
运行 `node tests/a04-registration-runtime-smoke.js`，预期输出 `A04-REGISTRATION-RUNTIME-SMOKE PASS`。
|
||
|
||
- [ ] **Step 2: 捕获并检查 412×915**
|
||
|
||
运行 `capture-chrome-page.js` 捕获 A04 默认态，人工检查 Logo、标题、字段、按钮、协议和底部留白。
|
||
|
||
- [ ] **Step 3: 更新 QA 边界**
|
||
|
||
在 `design-qa.md` 的 A04 段记录新资产和真实滑动验证延期；不得写成用户已验收。
|
||
|
||
- [ ] **Step 4: 最终聚焦验证**
|
||
|
||
重新运行静态合同、运行 smoke、截图合同和 `git diff --check`；将浏览器停在 A04 默认态供用户审核。
|
||
|
||
项目禁止 Git 操作，因此本计划不包含提交步骤。
|