# 页面名称：{{页面名}}

> **填写说明**：以下以“需要身份门禁的页面”为例演示各节填法。实际使用时替换 `{{}}` 中的内容。每节开头的灰色文字是填写指引，请按指引填写后删除指引文字。
>
> **需求防增生铁律**：示例只演示文档颗粒度，不代表产品默认功能。页面元素、字段、流程和验收项必须逐项来自 `Source IDs`；没有对应 REQ/AC，不得增加注册、短信/邮件验证码、账号密码、密码找回、第三方登录或其他认证方式。认证方式或其方案前置能力未在上游确认时，停止生成并退回 prd-master，不能在本模板里选方案。

---

## 1. 文档元信息

> 填写页面的基本归属信息，让读者一眼知道这是哪个产品的哪个页面。

| 字段 | 内容 |
| :--- | :--- |
| 页面 ID | `{{PAGE-F01-01；发布后不重编号}}` |
| Source IDs | `{{REQ-F01-01, AC-F01-01, NFR-001；设计补充项写 design-derived: DEC-001}}` |
| 所属产品 | {{产品名称}} |
| 所属模块 | {{模块名称}} |
| 适用端 | Web / H5 / 小程序 / App 内 WebView |
| 页面路由 | `/login` |
| 页面类型 | 门禁 / 列表 / 详情 / 表单 / 看板（选一） |
| 所属阶段 | 阶段1(MVP) / 阶段2 / 阶段3（从页面清单继承） |
| 上游来源 | {{用户从哪里来到这个页面}} |
| 下游去向 | {{用户从这里去往哪些页面}} |

**示例：**

| 字段 | 内容 |
| :--- | :--- |
| 页面 ID | `PAGE-F01-01` |
| Source IDs | `REQ-F01-01, AC-F01-01, NFR-001` |
| 所属产品 | 落地营现场支持系统 |
| 所属模块 | 账号与用户体系 |
| 适用端 | Web |
| 页面路由 | `/login` |
| 页面类型 | 门禁 |
| 所属阶段 | 阶段1(MVP) |
| 上游来源 | 系统启动 / 重定向 |
| 下游去向 | 学习计划列表页 |

---

## 2. 页面概述

### 2.1 一句话定位

> 用 1-3 句话说明这个页面**存在的唯一理由**。

**示例：** 让已具备上游约定身份凭据的用户，通过 requirements 明确确认的认证方式进入系统。

### 2.2 存在理由

> 回答"没有这个页面会怎样"。列 1-3 条具体的风险或痛点。

**示例：**
1. 无门禁则任意人可进入系统，存在数据泄露风险
2. 无法识别用户身份，无法提供个性化内容
3. 无法记录用户行为，丢失学习数据

### 2.3 页面目标（可衡量）

> 用表格列出可衡量的目标指标。

**示例：**

| 目标维度 | 具体指标 |
| :--- | :--- |
| 登录成功率 | 正常路径登录成功率 ≥ 99% |
| 登录效率 | 用户从打开页面到登录完成 ≤ 15 秒 |
| 安全性 | 无有效登录态者 100% 被拦截 |

### 2.4 不做什么（范围边界）

> 列 3-5 项**看似相关但不属于本页面**的功能。每项注明"为什么不做"。这一节用于防止功能蔓延，是产品文档的重要边界。

**示例：**
- **不做**任何未被 Source IDs 覆盖的注册或认证方式——避免设计替产品扩大范围
- **不做**未定义的账号恢复入口——只有对应 REQ/AC 存在才生成
- **不做**页面内角色选择——当前需求约定由系统识别角色

---

## 3. 用户与场景

### 3.1 目标用户

> 用表格描述用户画像。维度包括：角色 / 人数 / 技术熟练度 / 使用设备 / 使用姿势。

**示例：**

| 维度 | 描述 |
| :--- | :--- |
| 角色 | 患者用户 / 普通学习者 / 企业管理员（多角色分别写清） |
| 人数 | 单次使用通常 1 人 |
| 技术熟练度 | 中等（能操作手机 App） |
| 使用设备 | 手机 / PC |
| 使用姿势 | 近距离手持操作 |

### 3.2 核心使用场景

> 至少写 2 个场景：1 个主场景 + 1 个兜底场景。每个场景包含"时机 / 前置条件 / 用户动作 / 用户情绪"。

**示例：**

**场景 A：正常认证（主场景）**
- 时机：用户首次打开产品或登录态失效
- 前置：具备 requirements 已确认的认证凭据
- 动作：按已确认方式提交凭据 → 认证成功 → 进入主页
- 情绪：期待、顺畅

**场景 B：认证失败后重试（兜底场景）**
- 时机：凭据无效、已过期或网络异常
- 前置：认证未成功
- 动作：看到 requirements 定义的错误反馈 → 修正或重试
- 情绪：不焦虑、可快速重试

### 3.3 用户核心诉求（优先级排序）

> 按优先级从高到低列出用户最在意的事。

**示例：**
1. **快**：一键到位，不要多余步骤
2. **准**：错了能立刻知道原因
3. **稳**：登录后不频繁掉线
4. **可控**：失败后知道下一步怎么办

---

## 4. 信息架构

### 4.1 区域划分

> 从上到下 / 从左到右，列出页面的所有区域。让读者知道页面整体结构。

**示例：**
1. 顶部区域
2. 中部主卡片
3. 错误反馈区域
4. 辅助操作区域

### 4.2 区域内容

> 每个区域放什么内容（不描述长什么样，只描述有什么）。

**示例：**

**1. 顶部区域**
- Logo + 产品名
- 简短欢迎语（如"欢迎回来"）

**2. 中部主卡片**
- requirements 已确认的认证控件
- 登录按钮
- 错误提示区

**3. 错误反馈区域**
- Source IDs 定义的认证失败、过期和网络异常反馈

**4. 辅助操作区域**
- 仅列 Source IDs 明确要求的帮助或恢复入口

---

## 5. 界面内容

### 5.1 元素清单

> 逐一列出页面上的可交互或信息元素。每个元素写清：**内容 / 文案 / 数据来源 / 显示条件**。不写样式。

**示例：**

**认证控件**
- 类型：`{{从 Source IDs 读取；不得自行选为密码、验证码或第三方登录}}`
- 内容：`{{只列对应 REQ/AC 需要的字段和动作}}`
- 数据来源：用户输入或已确认的认证系统
- 显示条件：`{{来自 REQ/AC}}`

**登录按钮**
- 文案："登录"
- 显示条件：始终显示

**错误提示**
- 文案：根据错误类型变化（见第 8 节校验规则）
- 显示条件：校验失败时出现

### 5.2 辅助信息

> 页脚、帮助文案、版本号等非核心信息。

**示例：**
- 帮助文案：`{{仅当 Source IDs 明确要求时填写}}`
- 页脚：版权信息 / 版本号

---

## 6. 交互流程

### 6.1 页面加载与初始化

> 用户进入页面后看到什么，系统做了什么初始化。

**示例：**
- 检查是否已有登录态 → 已登录则直接跳转主页，不展示登录页
- 未登录 → 展示登录页，账号输入框自动聚焦

### 6.2 核心操作流程

> 用"用户做 X → 系统做 Y → 跳到 Z"的产品流程描述。不写动画、不写技术实现。

**示例：**

```
用户按 requirements 已确认的方式提交认证
    │
    ├─ 必填凭据缺失 → 展示对应 AC 的提示，不发起请求
    │
    └─ 非空 → 系统校验身份
         │
         ├─ 校验失败 → 展示不泄露敏感信息的明确反馈，可重试
         │
         └─ 校验成功 → 建立登录态 → 跳转主页
```

### 6.3 辅助操作

> 快捷键、次要入口等。

**示例：**
- 桌面端主凭据输入区按 Enter = 提交认证
- 仅保留 Source IDs 覆盖的辅助入口

---

## 7. 状态与边界

### 7.1 页面状态全景

> 用表格列出页面所有状态。至少覆盖 6 态：初始 / 输入 / 提交 / 成功 / 失败 / 异常。

**示例：**

| 状态 | 触发条件 | 页面表现 |
| :--- | :--- | :--- |
| 初始态 | 页面首次加载 | 账号框聚焦，登录按钮可点击 |
| 输入态 | 用户正在输入 | 实时输入，无实时校验 |
| 提交态 | 点击登录后 | 按钮变为"登录中"，不可重复点击 |
| 成功态 | 校验通过 | 跳转主页 |
| 失败态 | 身份校验失败 | 展示不泄露敏感信息的明确反馈，可重试 |
| 异常态 | 网络超时 / 断网 | 提示"网络异常，请重试"，可重试 |

### 7.2 边界与容错

> 至少覆盖 5 种边界场景。这是产品文档的核心价值——防漏 Case。

**示例：**

| 边界场景 | 处理策略 |
| :--- | :--- |
| 连续认证失败 | 按上游安全规则限流或提示，不在页面文档自行发明阈值 |
| 网络断开 | 提示"网络异常"，用户可直接重试，无需刷新 |
| 会话过期 | 跳回登录页，副标题可提示"登录已过期，请重新登录" |
| 输入不合法 | 按对应 AC 拦截并给出可修正提示 |
| 重复提交 | 首次请求完成前禁用重复提交 |

---

## 8. 业务规则与校验

### 8.1 字段定义

> 定义页面涉及的数据字段。

**示例：**

| 字段 | 说明 |
| :--- | :--- |
| `{{credential}}` | 只填写 requirements 已确认认证方式所需的凭据 |
| `{{session}}` | 认证成功后建立的登录态；字段语义来自 REQ/AC |

### 8.2 校验规则

> 用表格列出每个校验项：时机 / 规则 / 失败反馈文案。

**示例：**

| 校验项 | 时机 | 规则 | 失败反馈 |
| :--- | :--- | :--- | :--- |
| 必填凭据 | 提交时 | 按对应 AC 判断 | 使用对应 AC 的可修正反馈 |
| 凭据格式 | 失焦或提交时 | 按已确认认证方式判断 | 不暴露内部校验细节 |
| 身份校验 | 服务端 | 按已确认认证系统判断 | 不区分账号不存在和凭据错误 |

### 8.3 特殊业务规则

> 防滥用、登录态、权限等特殊规则。

**示例：**
- **防重复提交**：提交期间按钮禁用
- **认证防滥用**：限流、冷却或锁定阈值只照抄 NFR/AC，不自行给默认值
- **登录态时效**：只使用上游已确认的时效

---

## 9. 页面流转

### 9.1 流转图

> 用 ASCII 图或文字描述上下游流转关系。

**示例：**

```
系统启动 / 访问需登录页
        │
        ▼
   是否已登录？─── 是 ──→ 跳转主页
        │
        否
        ▼
    登录页（本页）
        │
     校验成功
        │
        ▼
    跳转主页 / 来源页
```

### 9.2 与其他模块的关系

> 本页面与系统其他模块的关联和隔离关系。

**示例：**
- 关联：只列页面清单与 Source IDs 已定义的注册、恢复或主页
- 隔离：与管理员后台登录完全独立，不共享账号和登录态

### 9.3 扩展预案

> 未来可演进但**当前不做**的方向。记录以便未来扩展时不破坏现有结构。

**示例：**

| 扩展方向 | 触发条件 | 改造点 |
| :--- | :--- | :--- |
| 新认证方式 | PRD 新增并确认对应 REQ 与方案前置能力 | 回到 PRD 后增量设计，不在当前页面预埋入口 |
| 多账号切换 | PRD 新增多身份切换需求 | 增加账号选择中间页 |

---

## 10. 数据需求

### 10.1 页面需要什么数据

> 从产品视角列出页面需要拿到什么数据。不写接口实现。

**示例：**

| 数据 | 来源 | 用途 |
| :--- | :--- | :--- |
| 产品名称 / Logo | 系统配置 | 渲染顶部品牌区 |
| 登录态 | 前端缓存 | 判断是否跳过登录页 |

### 10.2 页面提交什么数据

> 列出页面需要提交的数据。

**示例：**

| 数据 | 触发时机 | 用途 |
| :--- | :--- | :--- |
| `{{已确认认证方式所需凭据}}` | 点击登录 | 身份校验 |

### 10.3 明确排除的数据

> 列出页面不需要的数据，防止过度设计。

**示例：**
- 不需要用户详细资料（登录后从主页获取）
- 不需要权限列表（登录后由系统路由决定）

---

## 11. 验收标准

> 每类至少 5 条可测试的具体标准。

### 11.1 功能验收

**示例：**

| 编号 | 验收点 | 通过标准 |
| :--- | :--- | :--- |
| F-01 | 正确登录 | 使用 Source IDs 指定的有效凭据后，按 AC 时限跳转主页 |
| F-02 | 错误反馈 | 身份校验失败时展示对应 AC 的反馈 |
| F-03 | 空值拦截 | 缺少必填凭据时不发起请求 |
| F-04 | 重复提交 | 请求完成前不重复发起认证 |
| F-05 | 已登录跳过 | 有效登录态访问登录页，直接跳转主页 |

### 11.2 体验验收

**示例：**

| 编号 | 验收点 | 通过标准 |
| :--- | :--- | :--- |
| U-01 | 自动聚焦 | 页面加载后账号框自动聚焦 |
| U-02 | 登录效率 | 正常路径 ≤ 15 秒完成 |
| U-03 | 错误体验 | 错误提示温和，不锁死 |
| U-04 | 网络异常 | 断网时有提示，可直接重试 |
| U-05 | 会话过期 | 过期后正确跳回登录页 |

### 11.3 安全验收（产品层）

**示例：**

| 编号 | 验收点 | 通过标准 |
| :--- | :--- | :--- |
| S-01 | 加密传输 | 地址栏为 https:// |
| S-02 | 不存敏感凭据 | 前端不把敏感认证凭据写入不安全持久存储 |
| S-03 | 错误不泄露 | 失败反馈不暴露账号是否存在或内部校验细节 |