Files
jiapuapp/docs/design/A04_注册账号_设计记录.md
T
2026-07-14 17:36:43 +08:00

61 lines
4.2 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.
# A04 注册账号设计记录
> 状态:用户已于 2026-07-14 视觉验收通过;A04 可见效果冻结。
> 路由:`pages/auth/a04-register`A02 的注册入口与本页“登录”入口构成新用户与已有用户的双向路径。
> 视觉来源:已验收的 A01 启动/登录引导、A02 账号登录与 G01 我的家谱。
## 1. 页面任务
让新用户填写手机号、设置密码、确认密码并在本页主动确认协议。A02 是唯一的账号密码/手机验证码登录页;A04 只处理注册,不重复验证码登录。真实注册、短信、微信、协议正文和后端接口均不在本页实现。
## 2. 视觉结构
1. 复用 A02 的朱砂祠堂头与居中谱印,让注册仍属于同一认证场景。
2. 使用完整不透明 `a02-login-panel.png` 承担卷轴纸纹、双金线、角纹、云纹和底部山水;A04 不绘制 CSS 卡片、边框或按钮表面。
3. 面板标题下使用既有结饰位图建立分隔,随后是三行真实输入、完整朱砂“注册账号”按钮、协议确认行和“已有账号?登录”回流入口;不保留挤压表单的独立引导文案。
4. 360 × 800 与 412 × 915 均完整呈现;较小屏幕保留纵向滚动,不允许横向裁切。
## 3. 资产合同
| 路径 | 属性/原图尺寸 | A04 职责 |
| --- | --- | --- |
| `static/assets/foundation/opaque/auth-page-paper.jpg` | opaque / 750×1334 | 认证页纸纹底色。 |
| `static/assets/foundation/opaque/auth-header.png` | opaque / 750×196 | 朱砂祠堂头。 |
| `static/assets/foundation/transparent/brand-seal.png` | transparent / 240×288 | 头部谱印。 |
| `static/assets/foundation/transparent/auth-divider-knot.png` | transparent / 160×96 | 标题与表单之间的位图结饰分隔。 |
| `static/assets/modules/auth/opaque/a02-login-panel.png` | opaque / 940×1672 | A04 完整卷轴注册面板。 |
| `static/assets/foundation/opaque/a01-primary-button.png` | opaque / 1877×418 | A04 注册主按钮皮肤。 |
| `static/assets/modules/auth/transparent/a02-agreement-unchecked.png` | transparent / 96×96 | 本页未同意协议图标。 |
| `static/assets/modules/auth/transparent/a02-agreement-checked.png` | transparent / 96×96 | 本页已同意协议图标。 |
现有认证资产已完整覆盖本页,未使用 ImageGen,也未新增视觉资产。
## 4. 交互合同
- `phone``password``confirmPassword``agreed` 都是 A04 本页状态;协议初始未同意。
- 点击协议行切换两枚透明图标;点击协议名称仅提示“协议页面准备中”。
- 注册前依次校验协议、11 位手机号、密码非空和两次密码一致;通过后仅提示“注册服务待接入”。
- “已有账号?登录”真实跳转 `/pages/auth/a02-login`Chrome 已验证该 URL。
- A04 已从 `data/page-catalog.js` 移出,不再使用 `ModulePage` 临时母版。
## 5. 运行时证据
| 状态 | 截图 |
| --- | --- |
| 改造前,通用表单壳,360×800 | `screens/runtime/2026-07-14/A04-before-360x800.png` |
| 改造前,通用表单壳,412×915 | `screens/runtime/2026-07-14/A04-before-412x915.png` |
| 改造后,注册初始态,360×800 | `screens/runtime/2026-07-14/A04-after-360x800.png` |
| 改造后,注册初始态,412×915 | `screens/runtime/2026-07-14/A04-after-412x915.png` |
| 平衡修订审视前,360×800 | `screens/runtime/2026-07-14/A04-audit-before-360x800.png` |
| 平衡修订审视前,412×915 | `screens/runtime/2026-07-14/A04-audit-before-412x915.png` |
| 平衡修订后,注册初始态,360×800 | `screens/runtime/2026-07-14/A04-after-balance-360x800.png` |
| 平衡修订后,注册初始态,412×915 | `screens/runtime/2026-07-14/A04-after-balance-412x915.png` |
## 6. 自动检查
- `tests/a04-registration-contract.ps1`:独立页面、完整位图面板/按钮、结饰分隔、长标签留白、三项字段、协议状态、校验、A02 回流和禁止 CSS 伪造均可审计。
- `tests/compile-audit.ps1`:A04 不使用失效目录条目,Vue 文件与现有本地导入可编译。
- `tests/full-page-visual-contract.ps1`:A04 保持最终编号路由;G02/G04 合并后全项目共 56 条路由。
用户已于 2026-07-14 确认本页通过视觉验收;后续可审视 A05,但不得改变 A04 可见效果。