rain
4.2 KiB
4.2 KiB
A04 注册账号设计记录
状态：用户已于 2026-07-14 视觉验收通过；A04 可见效果冻结。 路由：
pages/auth/a04-register；A02 的注册入口与本页“登录”入口构成新用户与已有用户的双向路径。 视觉来源：已验收的 A01 启动／登录引导、A02 账号登录与 G01 我的家谱。
1. 页面任务
让新用户填写手机号、设置密码、确认密码并在本页主动确认协议。A02 是唯一的账号密码／手机验证码登录页；A04 只处理注册，不重复验证码登录。真实注册、短信、微信、协议正文和后端接口均不在本页实现。
2. 视觉结构
- 复用 A02 的朱砂祠堂头与居中谱印，让注册仍属于同一认证场景。
- 使用完整不透明
a02-login-panel.png承担卷轴纸纹、双金线、角纹、云纹和底部山水；A04 不绘制 CSS 卡片、边框或按钮表面。 - 面板标题下使用既有结饰位图建立分隔，随后是三行真实输入、完整朱砂“注册账号”按钮、协议确认行和“已有账号？登录”回流入口；不保留挤压表单的独立引导文案。
- 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 可见效果。