# 账号安全与退出 · 设计说明（account-security.vue）

> 单元：`account-security` ｜ group=account ｜ P 依据：P13「设置[账号与安全·退出]」；**注销账号不做（基准线外）**
> 实现：`vue/src/pages/account-security.vue` ｜ 组状态帧 fixtures：`design/fixtures/account.states.json`

## 1. 区块与密度对照

| 区块 | 实现落点 | 密度 | 达成 |
|---|---|---|---|
| ① 手机号行 | 脱敏 138\*\*\*\*5678【占位】+「更换」→ 两步验证码换绑（rebind-step1 本机验证→rebind-step2 新机验证，步骤指示=序号+文字双通道） | 区块 4 | ✓ |
| ② 实名认证行 | me.verified=true → Pill「已实名」绿徽章；行入口→realname（查看认证引导） | — | ✓ |
| ③ 登录设备 | 本设备·当前在线（Pill 绿+check 图标）+说明「设备管理详细列表不在本期范围」 | — | ✓ |
| ④ 退出登录 | 红字行→二次确认 Sheet「退出后需重新登录」（confirm 帧=实帧）→login | — | ✓ |

## 2. 状态帧

| 帧 | 渲染 |
|---|---|
| normal | 四区块列表 |
| rebind-step1 | 换绑第一步：本机号脱敏展示+获取验证码（60s 重发语义）+验证码输入+「下一步」 |
| rebind-step2 | 换绑第二步：新手机号+验证码+「完成换绑」（新号失焦校验语义）；NavBar「放弃」=中断不落半态 |
| confirm | 退出二次确认 Sheet 实帧 |
| error | step1 内「验证码错误，还剩 2 次」红字实帧 |
| guest | N/A（na_reason：仅登录态可达，入口在设置，设置未登录仅显示登录） |

## 3. 九维 A–I

- **A**：换绑两步状态机（step1→step2→完成/放弃）。
- **B**：退出二次确认；换绑中断=放弃并提示（E 维「步骤内返回=放弃换绑」，不落半态）。
- **C**：验证码 60s 重发同 login 规则；新手机号 number 键盘+格式校验。
- **D**：手机号全程脱敏展示（§0.3 口径）。
- **E**：换绑内 NavBar 返回/「放弃」=终止换绑；退出确认 Sheet。
- **F**：双端绑定链路 §0.5（界面统一，链路差异不影响本页形态）。
- **G**：N/A（轻页面）。
- **H**：错误红字 6.32:1+「!」图标；步骤指示双通道。
- **I**：`GET /user/security`；`POST /auth/rebind`；`POST /auth/logout`（全部占位，不接真实通道）。

## 4. 决策点

| 决策触点 | 对应 |
|---|---|
| 手机号是账号根，换绑要稳 | 两步验证码（本机→新机）+中断放弃提示+全程脱敏 |

## 5. 占位与缺口

- **账号手机号占位**：mock.js 无 user.phone_masked 字段=数据缺口；本页以常量 138\*\*\*\*5678 呈现（与规格表 D 维脱敏口径、mock 地址脱敏值一致），登记 fixtures placeholderEntries，提请底座扩展 mock 后改引数据源。
- 换绑只做两步验证码表单示意，**不接真实通道**；登录设备仅 1 台示意；注销不做（页面明示）。

## 7. 视觉验收修复轮（2026-10-10）

| 验收问题 | 处置 | 落点 |
|---|---|---|
| [中] rebind-step2 步骤指示双高亮（step ref 在状态板恒 1） | 已修：步骤指示改由 state 驱动——step2 帧时步骤1 显示完成态（绿✓）步骤2 激活，当前步可分辨 | account-security.vue `.steps/.stp.done` |
| [中] error 帧 NavBar 显示上级「账号与安全」+无放弃出口 | 已修：`inRebind` computed 含 error 帧 → 标题「更换手机号」+放弃按钮 | account-security.vue NavBar |
| [低] 获取验证码 34px/放弃 25px 触达不足 | 已修：`::before` 热区扩展 ≥44pt | account-security.vue `.send/.quit` |
| [低] loading/empty/extreme 三帧无 applicable 也无 na_reason（pages.json 缺口） | 组内补登记：fixtures account-security 段补三帧 applicable:false+na_reason；**pages.json 属保护层，提请底座同步** | account.states.json |
| device-393.png 右缘/底缘裁切 | 组内修不掉（render.py 管线，见 P-1） | — |