rain/jiapuapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
c848653758620b74123b8df617557aff8e1582ad
jiapuapp/docs/superpowers/plans/2026-07-16-a05-a01-visual-system-migration.md
T
rain 23cfd365a1 视觉审核完成30%
2026-07-16 18:13:03 +08:00

6.2 KiB
Raw Blame History

A05 向 A01 视觉体系收拢实施计划

For agentic workers: REQUIRED SUB-SKILL: Use superpowers:executing-plans inline. 本任务集中修改同一 A05 页面，不派发子代理；项目禁止 worktree、Git 暂存、提交和推送。

Goal: 让 A05 的 Logo、字体、标题分隔、按钮、Toast 和成功结果容器统一使用 A01 已确定的新视觉资产，同时保留四字段重设流程。

Architecture: pages/auth/a05-reset-password.vue 继续独立拥有表单和本地状态。页面直接消费 A01 正式资产；静态 PowerShell 合同负责禁止旧资产回退，Chrome CDP 烟测负责验证交互与多尺寸运行态。

Tech Stack: uni-app、Vue 3 <script setup>、SCSS、PowerShell、Node.js、Chrome CDP。

Global Constraints

  • 只修改 A05、A05 聚焦测试、A05 QA/验收记录和必要计划文档。
  • 不接接口；真实滑动验证使用后续组件自带样式，本轮只显示待接入 Toast。
  • 不使用原生 UniApp Toast、Modal、Loading、ActionSheet。
  • 320×568 允许自然纵向滚动；同时复核 360×640、360×800、412×915。
  • A05 保持 [~]，H5 证据不等于 Android/HBuilderX 或完整用户验收。

Task 1: 收紧 A05 静态视觉合同

Files:

  • Modify: tests/a05-reset-password-contract.ps1
  • Test: tests/a05-reset-password-contract.ps1

Interfaces:

  • Consumes: pages/auth/a05-reset-password.vue UTF-8 源码。

  • Produces: 新资产必需项、旧资产禁用项、Logo/字体/九宫格渲染约束。

  • Step 1: 写失败合同

要求以下源码片段存在：

'a01-vnext-divider-v1.png'
'a01-scroll-primary-v3.png'
'a01-scroll-toast-v3.png'
'a01-scroll-dialog-v3.png'
'width: 184rpx;'
'height: 221rpx;'
"border-image-source: url('/static/assets/foundation/transparent/a01-scroll-toast-v3.png');"
'border-image-slice: 58 280 fill;'

禁止以下旧路径和结构：

'a01-primary-button.png'
'a01-secondary-button.png'
'a02-login-panel.png'
'auth-divider-knot.png'
'feedback-toast__skin'
'verificationVisible'
'verification-layer'
'font-family:'
  • Step 2: 运行合同并确认 RED

Run: powershell.exe -NoProfile -ExecutionPolicy Bypass -File tests/a05-reset-password-contract.ps1

Expected: FAIL，首个失败原因是 A05 尚未引用新标题分隔或新按钮资产。

Task 2: 最小迁移 A05 页面

Files:

  • Modify: pages/auth/a05-reset-password.vue
  • Test: tests/a05-reset-password-contract.ps1

Interfaces:

  • Consumes: A01 的 brand-seal.png、a01-vnext-divider-v1.png、a01-scroll-primary-v3.png、a01-scroll-toast-v3.png、a01-scroll-dialog-v3.png。

  • Produces: 原选择器和表单 API 保持可用；获取验证码入口改为待接入 Toast。

  • Step 1: 替换模板资产

<image class="reset-divider" src="/static/assets/modules/auth/transparent/a01-vnext-divider-v1.png" mode="aspectFit" />
<image class="reset-submit__skin" src="/static/assets/foundation/transparent/a01-scroll-primary-v3.png" mode="aspectFit" />
<image class="success-dialog__skin" src="/static/assets/modules/auth/transparent/a01-scroll-dialog-v3.png" mode="aspectFit" />
<image class="success-action__skin" src="/static/assets/foundation/transparent/a01-scroll-primary-v3.png" mode="aspectFit" />

删除旧验证层和 Toast 图片子层；Toast 只保留真实文字节点。

  • Step 2: 收敛行为验证占位
const prepareGetCode = () => {
  if (!/^1\d{10}$/.test(phone.value)) {
    fieldErrors.value.phone = '请输入正确手机号'
    return
  }
  fieldErrors.value.phone = ''
  showFeedback('滑动验证待接口接入')
}

删除 verificationVisible、closeVerification 和 confirmVerification，不伪造验证码已发送。

  • Step 3: 对齐样式

Logo 改为 184×221rpx；删除全部局部 font-family；按钮图片使用 aspectFit；Toast 复制 A04 已验证的九宫格 border-image 参数；成功卷轴按现有遮罩居中，不改变返回登录逻辑。

  • Step 4: 运行合同并确认 GREEN

Run: powershell.exe -NoProfile -ExecutionPolicy Bypass -File tests/a05-reset-password-contract.ps1

Expected: A05-RESET-PASSWORD-CONTRACT PASS。

Task 3: 更新运行烟测并完成 RED/GREEN

Files:

  • Modify: tests/a05-reset-password-runtime-smoke.js
  • Test: tests/a05-reset-password-runtime-smoke.js

Interfaces:

  • Consumes: Chrome 9222 调试端口与 http://localhost:5173 H5 页面。

  • Produces: 默认态、手机号错误、待接入 Toast、全字段错误、密码不一致和成功结果证据。

  • Step 1: 将旧验证层断言改为新 Toast 断言

点击“获取验证码”后等待 .feedback-toast，断言文字为“滑动验证待接口接入”；同时断言不存在 .verification-layer，表单值未清空。

  • Step 2: 运行烟测

Run: node tests/a05-reset-password-runtime-smoke.js http://localhost:5173

Expected: A05-RESET-PASSWORD-RUNTIME-SMOKE PASS。

Task 4: 真实截图、文档和最终验证

Files:

  • Modify: design-qa.md
  • Modify: docs/验收规划.md
  • Modify: docs/交接记录.md
  • Modify: docs/design/P00_页面结构与资产清单.md
  • Update ignored evidence: tmp/a05-*.png

Interfaces:

  • Consumes: 实际 H5 运行页与静态/运行测试输出。

  • Produces: A05 待审核候选证据，不产生正式验收或冻结结论。

  • Step 1: 捕获四档视口并审视

用 Chrome CDP 捕获 320×568、360×640、360×800、412×915，检查 Logo、标题、四字段、验证码入口、按钮边缘、Toast、成功卷轴、滚动和横向溢出。

  • Step 2: 更新 A05 记录

只记录新视觉迁移与内部 H5 证据；A05 仍为 [~]，真实滑动验证、接口结果和 Android/HBuilderX 仍待审核。

  • Step 3: 运行最终验证
powershell.exe -NoProfile -ExecutionPolicy Bypass -File tests/a05-reset-password-contract.ps1
node tests/a05-reset-password-runtime-smoke.js http://localhost:5173
powershell.exe -NoProfile -ExecutionPolicy Bypass -File tests/capture-chrome-page-contract.ps1
git diff --check

Expected: 三项测试 PASS；git diff --check 退出码 0，允许已有 CRLF 提示。

Reference in New Issue View Git Blame Copy Permalink