jiapuapp/docs/superpowers/plans/2026-07-13-a01-a02-static-ui-implementation.md

A-01 / A-02 本地 UI 落地执行计划

执行说明： 当前实现仅覆盖 A-01 启动登录引导 与 A-02 双标签登录页 的本地 UI 和本地交互；不接后端、不写 token、不跳转家谱页、不改 Android 打包配置。

目标： 将已确认的 A-01 / A-02 设计落实为可运行的 uni-app 页面，并把“显式阅读并同意协议”作为进入登录页的唯一前置条件。

实现合同： docs/superpowers/specs/2026-07-13-a01-a02-static-ui-implementation-design.md

技术边界： Vue 3 <script setup>、uni-app；仅改路由入口和认证页；仅复用 static/assets/backgrounds/auth-*、static/assets/icons/auth/* 中的资源。

---

任务 1：先建立 A-01 / A-02 页面合同检查

文件：

• 新建：tests/a01-a02-ui-contract.ps1

步骤：

1. 编写 PowerShell 合同测试，读取 pages.json、pages/auth/entry.vue、pages/auth/login.vue。
2. 使用 UTF-8 Base64 常量保存中文断言，避免 PowerShell 文件编码影响中文匹配。
3. 断言 pages/auth/entry 是第一个页面，A-01 有显式协议勾选、账号登录、微信登录、文字注册入口，A-02 有两个标签、忘记密码和本地待接入反馈。
4. 断言认证页中不再出现 appApi、calcMD5、loginWithPassword、uni.reLaunch 和旧的“登录即表示同意”文案。
5. 在页面改造前运行该测试，预期因 A-01 页面尚不存在而失败；不提交红灯状态。

验证：

& .\tests\a01-a02-ui-contract.ps1

预期：失败，指出缺少 pages/auth/entry.vue。

---

任务 2：创建 A-01 启动登录引导页并注册路由

文件：

• 修改：pages.json
• 新建：pages/auth/entry.vue

步骤：

1. 在 pages.json 的 pages 数组首位加入 pages/auth/entry，保留现有认证页路径和所有其余路由。
2. 建立 entry.vue：使用祖祠红色横幅、宣纸和山水背景资源，呈现标题、品牌说明、账号密码登录、微信登录、文字注册入口和协议区域。
3. 以 agreed 作为唯一的本地状态。账号登录在勾选后仅执行：

uni.navigateTo({ url: '/pages/auth/login?agreed=1' })

4. 所有 A-01 操作在未勾选时统一提示：

uni.showToast({ title: '请先阅读并同意相关协议', icon: 'none' })

5. 勾选后，微信登录提示“微信登录功能准备中”，注册入口提示“注册页面准备中”；协议文字本身提示“协议页面准备中”。不创建尚未设计的协议、注册或微信授权页面。
6. 用页面内最小样式匹配已验收的 A-01：窄红色顶部、宣纸主体、红色主按钮、金色描边次按钮、底部山水留白；主内容最大宽度控制为移动端阅读尺寸，并预留安全区。

验证：

& .\tests\a01-a02-ui-contract.ps1

预期：仍失败，仅因 A-02 旧页面含 API / 旧同意逻辑。

---

任务 3：将现有 login 页面替换为 A-02 双标签本地 UI

文件：

• 修改：pages/auth/login.vue

步骤：

1. 删除 appApi、calcMD5、密码加密、网络请求和登录后 reLaunch；不保留兼容分支。
2. 用 onLoad 读取 agreed=1，并仅以此本地参数决定是否允许提交；缺少该参数时，任何提交均提示“请先返回登录引导确认协议”。
3. 默认显示“账号密码登录”标签，字段为账号/手机号与密码；下方保留“忘记密码”文字入口，点击提示“忘记密码页面准备中”。
4. 增加“手机验证码登录”标签，字段为手机号与验证码，并提供不发请求的“获取验证码”次级按钮，点击提示“获取验证码功能待接入”。
5. 两种登录提交完成本地必填校验后均只提示“登录接口待接入”，不得调用网络、写入本地登录态或跳转业务页。
6. 延续 A-01 视觉语言：同款顶部和纸质背景、红金色标签与主按钮、输入区域清晰分组；不复写协议同意逻辑或出现“登录即表示同意”文案。

验证：

& .\tests\a01-a02-ui-contract.ps1

预期：通过。

---

任务 4：做最小可编译验证并更新交接状态

文件：

• 修改：docs/交接记录.md
• 修改：docs/规划.md

步骤：

1. 运行认证页合同测试和现有 Vue 编译审计；若项目现有全部 PowerShell 测试可在合理时间内运行，则一并运行。
2. 检查变更只覆盖 A-01/A-02、路由入口、对应合同测试和状态记录；不触碰用户已有的三个脏文件。
3. 在交接记录与规划中明确记录：A-01/A-02 已完成本地 UI，所有认证接口、协议正文、真实微信授权、注册、找回密码仍未接入并等待后续页面设计/接口阶段。
4. 提交仅包含本轮 A-01/A-02 代码、测试和文档的文件。

验证：

& .\tests\a01-a02-ui-contract.ps1
& .\tests\vue3-compile-audit.ps1
git diff --check
git status --short

预期：前两项通过、git diff --check 无输出，状态中只出现本轮受管文件及已知用户脏文件。

---

自检

• 实现范围只含 A-01、A-02 和它们的入口路由。
• 以实现合同为唯一行为来源，没有引入新认证合同。
• 明确列出红灯、绿灯以及不提交红灯状态的规则。
• 每个任务都给出精确文件和可执行验证命令。
• 无 API、无 token、无伪造完成页、无 Android 配置改动。