128 lines
4.9 KiB
Markdown
128 lines
4.9 KiB
Markdown
# PC Auth Three Pages Implementation Plan
|
||
|
||
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||
|
||
**Goal:** 按 `genealogy-pc-openapi.yaml` 和 Apifox 截图,把登录、注册、忘记密码三页与 PC 认证接口、验证中心接口对齐。
|
||
|
||
**Architecture:** 根目录 `config.js` 继续作为环境、`clientid`、`tenantId` 的唯一配置入口;`utils` 继续存放跨页面公共工具;页面业务逻辑集中在 `public/js/auth-pages.js`,接口调用集中在 `public/js/api-client.js`,验证码适配集中在 `public/js/captcha-pages.js`。页面差异样式只写入对应 CSS 文件。
|
||
|
||
**Tech Stack:** 原生 HTML/CSS/JavaScript、`public/tac` 滑动验证、Node 断言测试。
|
||
|
||
## Global Constraints
|
||
|
||
- 接口依据只使用 `genealogy-pc-openapi.yaml` 与用户补充的 Apifox 截图。
|
||
- 开发环境接口地址为 `https://test-genealogy-api.ddxcjp.cn`。
|
||
- PC `clientid` 为 `ced7e5f0498645c6ec642dcf450b036f`,租户 ID 为 `000000`。
|
||
- 登录验证码场景为 `WEB_H5_LOGIN`,注册验证码场景为 `WEB_H5_REGISTER`,忘记密码验证码场景为 `WEB_H5_FORGOT_PASSWORD`。
|
||
- 不在 JS 中注入样式;页面差异样式写入对应 CSS 文件,公共样式写入 `public/css/public.css`。
|
||
- 新增或修改的 HTML、CSS、JS 注释使用中文,代码保持可读,不压缩。
|
||
|
||
---
|
||
|
||
### Task 1: 记录专项计划
|
||
|
||
**Files:**
|
||
- Modify: `docs/pc-api-page-integration-tracker-2026-07-09.md`
|
||
- Create: `docs/superpowers/plans/2026-07-09-pc-auth-three-pages.md`
|
||
|
||
**Interfaces:**
|
||
- Consumes: 用户确认“可以”先做登录、注册、忘记密码三页。
|
||
- Produces: PC-009 专项计划记录。
|
||
|
||
- [x] **Step 1: 写入本计划**
|
||
|
||
创建本计划,明确页面、接口、验证码场景、样式和验证约束。
|
||
|
||
- [x] **Step 2: 写入追踪记录**
|
||
|
||
在追踪文档中新增 `PC-009`,状态为“进行中”,开始时间为 `2026-07-09 16:32:17 +08:00`。
|
||
|
||
### Task 2: 登录页补齐短信登录
|
||
|
||
**Files:**
|
||
- Modify: `login.html`
|
||
- Modify: `public/css/login.css`
|
||
- Modify: `public/js/auth-pages.js`
|
||
- Modify: `tests/auth-pages.test.js`
|
||
- Modify: `tests/api-client.test.js`
|
||
|
||
**Interfaces:**
|
||
- Consumes: `ApiClient.login(body)`、`ApiClient.loginBySms(body)`、`ApiClient.sendSmsCode(body)`、`CaptchaPages.ensureToken(form, options)`。
|
||
- Produces: 登录页同时支持密码登录和短信登录。
|
||
|
||
- [x] **Step 1: 页面增加登录方式切换**
|
||
|
||
在 `login.html` 的登录表单内增加模式切换按钮,密码登录区域保留 `phone/password/validToken`,短信登录区域增加 `phone/smsCode/validToken` 和发送验证码按钮。
|
||
|
||
- [x] **Step 2: CSS 写入登录页专属样式**
|
||
|
||
在 `public/css/login.css` 增加模式切换、隐藏区域、验证码行样式,不在 JS 中写样式。
|
||
|
||
- [x] **Step 3: JS 支持短信登录提交**
|
||
|
||
在 `public/js/auth-pages.js` 增加 `buildSmsLoginBody(values)`,提交时按当前模式调用 `/genealogy/pc/auth/login` 或 `/genealogy/pc/auth/login/sms`。
|
||
|
||
- [x] **Step 4: 发送短信复用场景码**
|
||
|
||
登录页短信验证码按钮使用 `data-scene-code="WEB_H5_LOGIN"`,忘记密码页继续使用 `WEB_H5_FORGOT_PASSWORD`。
|
||
|
||
- [x] **Step 5: 更新测试**
|
||
|
||
`tests/auth-pages.test.js` 增加短信登录 body 断言;`tests/api-client.test.js` 增加 `loginBySms` 和 `sendSmsCode` 路径/入参断言。
|
||
|
||
### Task 3: 注册和忘记密码复核
|
||
|
||
**Files:**
|
||
- Verify: `register.html`
|
||
- Verify: `forgot-password.html`
|
||
- Verify: `public/js/auth-pages.js`
|
||
|
||
**Interfaces:**
|
||
- Consumes: `/genealogy/pc/auth/register`、`/genealogy/pc/auth/sms/code`、`/genealogy/pc/auth/password/reset`。
|
||
- Produces: 注册和忘记密码页面确认继续按 PC 字段提交。
|
||
|
||
- [x] **Step 1: 注册页字段复核**
|
||
|
||
确认注册页只提交 `phone/password/nickName/validToken`,`grantType/tenantId/clientId/registerSource` 由 `api-client.js` 统一补齐。
|
||
|
||
- [x] **Step 2: 忘记密码页字段复核**
|
||
|
||
确认忘记密码页提交 `tenantId/phone/smsCode/newPassword/validToken`,不再出现邮箱找回文案。
|
||
|
||
### Task 4: 专项验证和完成记录
|
||
|
||
**Files:**
|
||
- Modify: `docs/pc-api-page-integration-tracker-2026-07-09.md`
|
||
|
||
**Interfaces:**
|
||
- Consumes: Task 2 和 Task 3 的实现结果。
|
||
- Produces: PC-009 完成记录和验证结果。
|
||
|
||
- [x] **Step 1: 运行测试**
|
||
|
||
运行:
|
||
|
||
```powershell
|
||
node tests\auth-pages.test.js
|
||
node tests\api-client.test.js
|
||
node tests\captcha-pages.test.js
|
||
```
|
||
|
||
期望全部输出 `passed`。
|
||
|
||
- [x] **Step 2: 运行语法检查**
|
||
|
||
运行:
|
||
|
||
```powershell
|
||
node --check public\js\auth-pages.js
|
||
node --check public\js\api-client.js
|
||
node --check public\js\captcha-pages.js
|
||
```
|
||
|
||
期望无输出且退出码为 0。
|
||
|
||
- [x] **Step 3: 更新追踪文档**
|
||
|
||
把 `PC-009` 状态改为“已完成”,写入完成时间、修改文件、接口路径、验证码场景和验证结果。
|