jiapu/docs/superpowers/plans/2026-07-09-pc-auth-three-pages.md

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 截图，不再使用 APP.openapi.json。
• 开发环境接口地址为 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 专项计划记录。

• Step 1: 写入本计划

创建本计划，明确页面、接口、验证码场景、样式和验证约束。

• 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: 登录页同时支持密码登录和短信登录。

• Step 1: 页面增加登录方式切换

在 login.html 的登录表单内增加模式切换按钮，密码登录区域保留 phone/password/validToken，短信登录区域增加 phone/smsCode/validToken 和发送验证码按钮。

• Step 2: CSS 写入登录页专属样式

在 public/css/login.css 增加模式切换、隐藏区域、验证码行样式，不在 JS 中写样式。

• Step 3: JS 支持短信登录提交

在 public/js/auth-pages.js 增加 buildSmsLoginBody(values)，提交时按当前模式调用 /genealogy/pc/auth/login 或 /genealogy/pc/auth/login/sms。

• Step 4: 发送短信复用场景码

登录页短信验证码按钮使用 data-scene-code="WEB_H5_LOGIN"，忘记密码页继续使用 WEB_H5_FORGOT_PASSWORD。

• 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 字段提交。

• Step 1: 注册页字段复核

确认注册页只提交 phone/password/nickName/validToken，grantType/tenantId/clientId/registerSource 由 api-client.js 统一补齐。

• 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 完成记录和验证结果。

• Step 1: 运行测试

运行：

node tests\auth-pages.test.js
node tests\api-client.test.js
node tests\captcha-pages.test.js

期望全部输出 passed。

• Step 2: 运行语法检查

运行：

node --check public\js\auth-pages.js
node --check public\js\api-client.js
node --check public\js\captcha-pages.js

期望无输出且退出码为 0。

• Step 3: 更新追踪文档

把 PC-009 状态改为“已完成”，写入完成时间、修改文件、接口路径、验证码场景和验证结果。