docs(epic-13): 创建 Story 13.7 首页导航和交互测试

- 新增 Story 13.7: 验证企业小程序首页 dashboard 的导航和交互功能
- 测试范围：快捷操作按钮、查看全部链接、人才卡片点击
- 验收标准：页面跳转验证、交互响应时间、代码质量标准

Co-Authored-By: Claude <noreply@anthropic.com>

_bmad-output/implementation-artifacts/13-7-dashboard-navigation.md

@@ -0,0 +1,486 @@
+# Story 13.7: 首页导航和交互测试
+
+Status: ready-for-dev
+
+<!-- Note: Validation is optional. Run validate-create-story for quality check before dev-story. -->
+
+## Story
+
+作为测试开发者，
+我想要验证企业小程序首页 dashboard 的导航和交互功能，
+以便确保用户能够正常使用快捷操作和查看详情功能。
+
+## Acceptance Criteria
+
+### AC1: 快捷操作按钮导航测试
+**Given** 用户已登录企业小程序首页
+**When** 点击快捷操作按钮
+**Then** 测试应验证以下功能：
+- 验证"人才库"按钮可点击并跳转到人才库页面
+- 验证"数据统计"按钮可点击并跳转到数据统计页面
+- 验证"订单管理"按钮可点击并跳转到订单管理页面
+- 验证"设置"按钮可点击并跳转到设置页面
+
+### AC2: "查看全部"链接测试
+**Given** 首页显示分配人才列表
+**When** 点击"查看全部"链接
+**Then** 测试应验证以下功能：
+- 验证"查看全部"链接可点击
+- 验证跳转到完整的人才列表页面
+
+### AC3: 人才卡片点击测试
+**Given** 首页显示人才卡片
+**When** 点击人才卡片
+**Then** 测试应验证以下功能：
+- 验证人才卡片可点击
+- 验证跳转到人才详情页面
+- 验证详情页面显示正确的人才信息
+
+### AC4: 页面跳转验证
+**Given** 用户执行导航操作
+**When** 页面跳转完成后
+**Then** 测试应验证以下场景：
+- 验证跳转后的页面 URL 正确
+- 验证跳转后的页面标题正确
+- 验证可以返回首页（底部导航"首页"按钮）
+
+### AC5: 交互响应时间
+**Given** 用户点击导航按钮
+**When** 等待页面跳转
+**Then** 测试应验证以下性能：
+- 验证按钮点击后页面在 2 秒内完成跳转
+- 验证没有卡顿或延迟
+
+### AC6: 代码质量标准
+**Given** 遵循项目测试规范
+**When** 编写测试代码
+**Then** 代码应符合以下标准：
+- 使用 TIMEOUTS 常量定义超时
+- 使用 data-testid 选择器（优先级高于文本选择器）
+- 测试文件命名：`dashboard-navigation.spec.ts`
+- 完整的测试描述和注释
+- TypeScript 类型安全
+- 通过 `pnpm typecheck` 类型检查
+
+## Tasks / Subtasks
+
+- [ ] 任务 1: 创建首页导航测试文件 (AC: #1, #2, #3, #4, #5, #6)
+  - [ ] 1.1 创建 `web/tests/e2e/specs/cross-platform/dashboard-navigation.spec.ts`
+  - [ ] 1.2 配置测试 fixtures（enterpriseMiniPage）
+  - [ ] 1.3 添加测试前置条件（企业用户登录）
+
+- [ ] 任务 2: 扩展 EnterpriseMiniPage 支持导航操作 (AC: #1, #2, #3, #4)
+  - [ ] 2.1 添加快捷操作按钮选择器和方法
+  - [ ] 2.2 添加"查看全部"链接选择器和方法
+  - [ ] 2.3 添加人才卡片选择器和点击方法
+  - [ ] 2.4 添加页面 URL 验证方法
+  - [ ] 2.5 添加页面标题验证方法
+  - [ ] 2.6 添加返回首页方法
+
+- [ ] 任务 3: 实现快捷操作按钮导航测试 (AC: #1, #4, #5)
+  - [ ] 3.1 编写"点击人才库按钮跳转到人才库页面"测试
+  - [ ] 3.2 编写"点击数据统计按钮跳转到数据统计页面"测试
+  - [ ] 3.3 编写"点击订单管理按钮跳转到订单管理页面"测试
+  - [ ] 3.4 编写"点击设置按钮跳转到设置页面"测试
+  - [ ] 3.5 验证页面跳转 URL 正确
+  - [ ] 3.6 验证页面跳转在 2 秒内完成
+
+- [ ] 任务 4: 实现"查看全部"链接测试 (AC: #2, #4, #5)
+  - [ ] 4.1 编写"点击查看全部链接跳转到人才列表"测试
+  - [ ] 4.2 验证跳转后的页面 URL 正确
+  - [ ] 4.3 验证跳转后的页面标题正确
+
+- [ ] 任务 5: 实现人才卡片点击测试 (AC: #3, #4, #5)
+  - [ ] 5.1 编写"点击人才卡片跳转到人才详情"测试
+  - [ ] 5.2 验证详情页面显示正确的人才信息
+  - [ ] 5.3 验证详情页面 URL 正确
+
+- [ ] 任务 6: 实现返回首页测试 (AC: #4)
+  - [ ] 6.1 编写"点击底部导航首页按钮返回首页"测试
+  - [ ] 6.2 验证返回首页后 URL 正确
+  - [ ] 6.3 验证返回首页后页面元素正确显示
+
+- [ ] 任务 7: 验证代码质量 (AC: #6)
+  - [ ] 7.1 运行 `pnpm typecheck` 验证类型检查
+  - [ ] 7.2 运行测试确保所有测试通过
+  - [ ] 7.3 验证选择器使用 data-testid
+
+## Dev Notes
+
+### Epic 13 背景和依赖
+
+**Epic 13: 跨端数据同步测试 (Epic E)**
+
+- **目标**: 验证后台操作后小程序端的数据同步，覆盖完整的业务流程
+- **业务分组**: Epic E（跨端数据同步测试）
+- **背景**: 真实用户旅程跨越管理后台和小程序，需要验证数据同步的正确性和时效性
+- **依赖**:
+  - Epic 10: ✅ 已完成（订单管理 E2E 测试）
+  - Epic 12: 🔄 进行中（小程序登录测试）
+  - Story 13.6: ✅ 已完成（首页看板数据联动专项测试）
+
+**Epic 13 Story 依赖关系：**
+```
+Story 13.1: 后台创建订单 → 企业小程序**订单列表**验证 ✅
+Story 13.2: 后台编辑订单 → 企业小程序验证
+Story 13.3: 后台添加人员 → 人才小程序验证
+Story 13.4: 后台更新状态 → 双小程序验证
+Story 13.5: 跨端测试稳定性验证
+Story 13.6: 后台添加人员 → 企业小程序**首页 dashboard** 人才数据验证 ✅
+Story 13.7: 企业小程序首页 **导航和交互**测试 ← 当前 Story
+```
+
+### 与 Story 13.6 的区别
+
+| 维度 | Story 13.6 | Story 13.7 |
+|------|-----------|-----------|
+| **验证目标** | 首页 **数据同步** | 首页 **导航和交互** |
+| **验证内容** | 分配人才列表、核心统计数字 | 快捷操作按钮、查看全部链接、人才卡片点击 |
+| **测试场景** | 后台添加人员 → 验证首页数据变化 | 点击按钮/链接 → 验证页面跳转 |
+| **测试方法** | `getAssignedTalentCards()`, `getCoreStatistics()` | `clickQuickAction()`, `clickViewAll()`, `clickTalentCard()` |
+
+### 企业小程序首页导航结构
+
+**首页 dashboard 导航结构：**
+```
+┌─────────────────────────────────┐
+│  企业仪表板 (mini-dashboard)     │
+├─────────────────────────────────┤
+│  欢迎区域:                       │
+│  - 欢迎回来                      │
+│  - 企业名称                      │
+├─────────────────────────────────┤
+│  统计卡片:                       │
+│  ┌─────────┬─────────┬─────────┐│
+│  │ 在职人员 │ 待入职  │ 本月新增 ││
+│  └─────────┴─────────┴─────────┘│
+├─────────────────────────────────┤
+│  快捷操作:                       │
+│  ┌───────┬───────┬───────┬─────┐│
+│  │人才库 │数据统计│订单管理│设置 ││
+│  └───────┴───────┴───────┴─────┘│
+├─────────────────────────────────┤
+│  分配人才区域:                   │
+│  - 人才卡片 1, 2, 3...           │
+│  - [查看全部] ← 可点击链接       │
+├─────────────────────────────────┤
+│  底部导航:                       │
+│  ┌────┬────┬────┬────┬────┐    │
+│  │首页│人才│订单│数据│设置│    │
+│  └────┴────┴────┴────┴────┘    │
+└─────────────────────────────────┘
+```
+
+**导航交互流程：**
+```
+用户点击快捷操作按钮 → 页面跳转 → 验证 URL 和标题
+      ↓
+用户可以点击底部导航"首页"返回 → 返回首页 → 验证首页元素
+```
+
+### Story 13.6 关键经验（首页看板测试）
+
+从已完成的 Story 13.6 中学习到的首页看板测试模式：
+
+**企业小程序首页 data-testid：**
+```typescript
+const DASHBOARD_SELECTORS = {
+  dashboard: 'mini-dashboard',
+  quickActions: 'mini-quick-actions',
+  talentCard: 'mini-assigned-talent-card',
+  talentName: 'mini-talent-name',
+};
+```
+
+**首页结构发现：**
+- 首页包含快捷操作按钮（人才库、数据统计、订单管理、设置）
+- 首页包含分配人才区域（人才卡片列表）
+- 首页包含底部导航栏
+- 小程序首页**部分**元素有 data-testid 属性
+
+### EnterpriseMiniPage 扩展方法
+
+需要添加以下方法到 `enterprise-mini.page.ts`：
+
+```typescript
+/**
+ * 点击快捷操作按钮
+ * @param action 快捷操作名称：'talent-pool' | 'data-stats' | 'order-management' | 'settings'
+ */
+async clickQuickAction(action: string): Promise<void> {
+  // 根据不同的快捷操作，点击对应按钮
+  const buttons = {
+    'talent-pool': '人才库',
+    'data-stats': '数据统计',
+    'order-management': '订单管理',
+    'settings': '设置',
+  };
+
+  const buttonText = buttons[action];
+  if (!buttonText) {
+    throw new Error(`未知的快捷操作: ${action}`);
+  }
+
+  // 使用文本选择器（小程序可能缺少 data-testid）
+  await this.page.getByText(buttonText).click();
+}
+
+/**
+ * 点击"查看全部"链接
+ */
+async clickViewAll(): Promise<void> {
+  // 使用文本选择器查找"查看全部"链接
+  await this.page.getByText('查看全部').click();
+}
+
+/**
+ * 点击人才卡片
+ * @param talentName 人才姓名
+ */
+async clickTalentCard(talentName: string): Promise<void> {
+  // 找到对应姓名的人才卡片并点击
+  const card = this.page.getByText(talentName);
+  await card.click();
+}
+
+/**
+ * 验证当前页面 URL
+ * @param expectedUrl 预期的 URL
+ */
+async expectUrl(expectedUrl: string): Promise<void> {
+  await this.page.waitForURL(`**${expectedUrl}**`, { timeout: TIMEOUTS.PAGE_LOAD });
+  expect(this.page.url()).toContain(expectedUrl);
+}
+
+/**
+ * 验证页面标题
+ * @param expectedTitle 预期的页面标题
+ */
+async expectPageTitle(expectedTitle: string): Promise<void> {
+  const title = await this.page.title();
+  expect(title).toContain(expectedTitle);
+}
+
+/**
+ * 返回首页
+ */
+async goBackToHome(): Promise<void> {
+  // 点击底部导航的"首页"按钮
+  await this.page.getByText('首页').click();
+  // 等待首页加载
+  await this.page.waitForTimeout(TIMEOUTS.PAGE_LOAD);
+}
+```
+
+### 小程序导航验证策略
+
+**Taro 小程序路由机制：**
+```typescript
+// Taro 小程序使用 Hash 路由
+// URL 格式：http://localhost:8080/mini#/pages/dashboard
+
+// 验证页面跳转
+async expectUrl(expectedUrl: string): Promise<void> {
+  // 等待 URL 变化
+  await this.page.waitForURL(`**${expectedUrl}**`, { timeout: TIMEOUTS.PAGE_LOAD });
+
+  // 验证 URL 包含预期路径
+  const actualUrl = this.page.url();
+  expect(actualUrl).toContain(expectedUrl);
+}
+```
+
+**页面跳转时间测量：**
+```typescript
+async measureNavigationTime(
+  action: () => Promise<void>
+): Promise<number> {
+  const startTime = Date.now();
+  await action();
+  await this.page.waitForLoadState('networkidle', { timeout: TIMEOUTS.PAGE_LOAD });
+  return Date.now() - startTime;
+}
+```
+
+### 测试数据准备策略
+
+**前置条件：**
+1. 需要企业用户数据（使用 Story 12.2 创建的企业用户）
+2. 需要分配人才数据（使用 Story 13.6 创建的人才数据）
+
+**测试数据唯一性：**
+```typescript
+// 使用 Story 13.6 创建的分配人才数据
+// 无需额外创建数据，直接使用现有数据测试导航功能
+```
+
+### 选择器策略
+
+**优先级（遵循项目标准）：**
+1. `data-testid` 属性（最高优先级）
+2. 文本内容（小程序可能缺少 data-testid）
+3. CSS 类（兜底选择器）
+
+**小程序导航相关的选择器：**
+- 快捷操作按钮：使用文本选择器 `getByText('人才库')`
+- 查看全部链接：使用文本选择器 `getByText('查看全部')`
+- 人才卡片：使用文本选择器 `getByText(talentName)`
+- 底部导航：使用文本选择器 `getByText('首页')`
+
+### TypeScript 类型定义
+
+**导航测试类型：**
+```typescript
+type QuickActionType = 'talent-pool' | 'data-stats' | 'order-management' | 'settings';
+
+interface NavigationResult {
+  /** 导航是否成功 */
+  navigated: boolean;
+  /** 导航耗时（毫秒） */
+  navigationTime: number;
+  /** 目标 URL */
+  targetUrl: string;
+  /** 页面标题 */
+  pageTitle?: string;
+}
+```
+
+### 测试超时配置
+
+**使用 TIMEOUTS 常量：**
+```typescript
+import { TIMEOUTS } from '../../utils/timeouts';
+
+// 页面跳转等待时间
+const NAVIGATION_TIMEOUT = 2000; // 2 秒
+
+// 页面加载等待时间
+const PAGE_LOAD_TIMEOUT = TIMEOUTS.PAGE_LOAD; // 30000ms
+```
+
+### 调试技巧
+
+**导航测试调试：**
+1. 使用 `page.url()` 获取当前 URL
+2. 使用 `page.title()` 获取页面标题
+3. 使用 `page.screenshot()` 在关键步骤截图
+4. 记录导航时间
+
+**导航问题调试：**
+- 检查 URL 是否正确变化
+- 检查页面是否正确加载
+- 验证页面元素是否正确显示
+
+### 参考文档
+
+**架构文档：**
+- `_bmad-output/planning-artifacts/epics.md#Epic 13`
+- `_bmad-output/project-context.md`
+- `docs/standards/e2e-radix-testing.md`
+
+**相关 Story 文档：**
+- `12-4-enterprise-mini-page-object.md` (企业小程序 Page Object)
+- `12-5-enterprise-mini-login.md` (企业小程序登录测试)
+- `13-1-order-create-sync.md` (订单列表同步测试)
+- `13-6-dashboard-sync.md` (首页看板数据联动测试)
+
+### 测试场景示例
+
+**场景 1: 快捷操作按钮导航**
+```typescript
+test('点击人才库按钮跳转到人才库页面', async ({ enterpriseMiniPage }) => {
+  // 1. 登录并进入首页
+  await enterpriseMiniPage.goto();
+  await enterpriseMiniPage.login('13800138000', 'password123');
+  await enterpriseMiniPage.expectLoginSuccess();
+
+  // 2. 点击人才库按钮
+  const startTime = Date.now();
+  await enterpriseMiniPage.clickQuickAction('talent-pool');
+
+  // 3. 验证跳转
+  await enterpriseMiniPage.expectUrl('/pages/talent');
+  await enterpriseMiniPage.expectPageTitle('人才');
+
+  // 4. 验证响应时间
+  const navigationTime = Date.now() - startTime;
+  expect(navigationTime).toBeLessThanOrEqual(2000);
+});
+```
+
+**场景 2: 人才卡片点击**
+```typescript
+test('点击人才卡片跳转到人才详情', async ({ enterpriseMiniPage }) => {
+  // 1. 登录并进入首页
+  await enterpriseMiniPage.goto();
+  await enterpriseMiniPage.login('13800138000', 'password123');
+  await enterpriseMiniPage.expectLoginSuccess();
+
+  // 2. 点击人才卡片
+  const talentName = '测试残疾人_1768346782426_12_8219';
+  await enterpriseMiniPage.clickTalentCard(talentName);
+
+  // 3. 验证跳转
+  await enterpriseMiniPage.expectUrl('/pages/talent-detail');
+
+  // 4. 验证详情页面显示正确的人才信息
+  const pageText = await enterpriseMiniPage.page.textContent('body');
+  expect(pageText).toContain(talentName);
+});
+```
+
+**场景 3: 返回首页**
+```typescript
+test('点击底部导航首页按钮返回首页', async ({ enterpriseMiniPage }) => {
+  // 1. 登录并进入首页
+  await enterpriseMiniPage.goto();
+  await enterpriseMiniPage.login('13800138000', 'password123');
+  await enterpriseMiniPage.expectLoginSuccess();
+
+  // 2. 导航到其他页面
+  await enterpriseMiniPage.clickQuickAction('talent-pool');
+  await enterpriseMiniPage.expectUrl('/pages/talent');
+
+  // 3. 返回首页
+  await enterpriseMiniPage.goBackToHome();
+
+  // 4. 验证返回首页
+  await enterpriseMiniPage.expectUrl('/pages/dashboard');
+  await expect(enterpriseMiniPage.page.getByTestId('mini-dashboard')).toBeVisible();
+});
+```
+
+## Dev Agent Record
+
+### Agent Model Used
+
+_Creation phase - Claude Opus 4.5_
+
+### Debug Log References
+
+_Story 13.7 created_
+
+### Completion Notes List
+
+1. **Story 13.7 创建完成**：
+   - 首页导航和交互测试需求
+   - 与 Story 13.6 的区别说明
+   - EnterpriseMiniPage 扩展方法定义
+   - 状态：ready-for-dev
+
+### File List
+
+_Created files:_
+- `/mnt/code/188-179-template-6/_bmad-output/implementation-artifacts/13-7-dashboard-navigation.md`
+- `/mnt/code/188-179-template-6/_bmad-output/implementation-artifacts/sprint-status.yaml` (updated)
+
+## Change Log
+
+- 2026-01-14: Story 13.7 创建完成
+  - 首页导航和交互测试需求
+  - 快捷操作按钮、查看全部链接、人才卡片点击
+  - 与 Story 13.6 的区别说明
+  - EnterpriseMiniPage 扩展方法定义
+  - 状态：ready-for-dev
+
+---

_bmad-output/implementation-artifacts/sprint-status.yaml

@@ -212,10 +212,11 @@ development_status:
   epic-13: in-progress
   13-1-order-create-sync: done   # 后台创建订单 → 企业小程序验证 ✅ 完成 (2026-01-14) - 跨端数据同步测试、Playwright MCP 探索、DisabledPersonSelector 组件修复
   13-2-order-edit-sync: in-progress       # 后台编辑订单 → 企业小程序验证
-  13-3-person-add-sync: ready-for-dev            # 后台添加人员 → 人才小程序验证
+  13-3-person-add-sync: in-progress            # 后台添加人员 → 人才小程序验证
   13-4-work-status-sync: backlog           # 后台更新状态 → 双小程序验证
   13-5-cross-platform-stability: backlog   # 跨端测试稳定性验证
   13-6-dashboard-sync: done       # 首页看板数据联动专项测试 ✅ 完成 (2026-01-14) - 所有4个测试通过
+  13-7-dashboard-navigation: ready-for-dev   # 首页导航和交互测试 - 测试快捷操作按钮、查看全部链接、人才卡片点击
   epic-13-retrospective: optional
 
 # Epic 组织架构 (2026-01-13):

_bmad-output/planning-artifacts/epics.md

@@ -2452,6 +2452,7 @@ Order (订单) - 必须 companyId
 - Story 13.4: 后台更新状态 → 双小程序验证
 - Story 13.5: 跨端测试稳定性验证
 - Story 13.6: 首页看板数据联动专项测试
+- Story 13.7: 首页导航和交互测试
 
 **技术要点：**
 - 多 Page 对象管理（后台 + 小程序）