Bläddra i källkod

📝 docs(prd): 添加史诗017人才小程序功能实现文档

- 新增史诗017 PRD文档,详细描述人才小程序功能实现计划
- 包含史诗目标、状态更新、技术栈说明和集成点分析
- 拆分为8个用户故事,涵盖UI包创建、页面实现、性能优化等完整开发流程
- 提供兼容性要求、风险缓解措施和测试策略
- 明确依赖史诗015的API模块,采用与史诗011相同的成功架构模式
yourname 3 veckor sedan
förälder
incheckning
1b082c9515
1 ändrade filer med 397 tillägg och 0 borttagningar
  1. 397 0
      docs/prd/epic-017-talent-mini-program-implementation.md

+ 397 - 0
docs/prd/epic-017-talent-mini-program-implementation.md

@@ -0,0 +1,397 @@
+# 史诗017 - 人才小程序功能实现
+
+## 史诗目标
+在mini-talent项目中完整实现人才小程序的所有页面功能,基于史诗015已创建的API模块基础,为残疾人用户提供个人信息管理、考勤记录、就业信息查询等完整的服务体验,并创建rencai mini ui包提供可复用的UI组件。
+
+## 状态更新(2025-12-25)
+- **依赖状态**:史诗015已完成3/8核心故事(38%),核心API就绪
+- **启动建议**:史诗017可以立即开始,与史诗015并行开发
+- **调整说明**:参照史诗011(用人方小程序)的成功模式,采用相同的架构和开发规范
+- **故事拆分**:史诗拆分为8个故事,便于逐步开发和测试
+- **整体进度**:所有故事未开始
+
+## 史诗描述
+
+### 现有系统上下文
+
+**当前相关功能:**
+- **mini-talent项目**:基础小程序前端框架(从mini项目复制)
+- **mini-ui-packages目录**:已创建多个UI包(yongren-dashboard-ui、yongren-talent-management-ui等)
+- **史诗015成果**:已为人才小程序补充了人才用户认证、个人信息查询等API接口
+- **原型设计**:`docs/小程序原型/rencai.html` 提供了完整的6个页面原型设计
+
+**技术栈:**
+- 前端:TypeScript、React、Hono RPC客户端、Tailwind CSS、Taro
+- 测试:Jest(mini项目使用Jest)
+- API通信:基于Hono RPC的API客户端模式
+- 包管理:pnpm workspace
+
+**集成点:**
+- 在mini-ui-packages下创建rencai相关的mini ui包,每个UI包包含自己的API客户端和RPC类型
+- 参照yongren系列UI包的模式,每个UI包独立管理自己的API路由和类型定义
+- UI包内部封装API调用逻辑,页面组件内部使用对应的API客户端
+- mini-talent只需要导入和使用页面组件,无需关心API客户端的实现细节
+- **UI组件开发**:基于原型文件创建独立的rencai mini ui包,复用现有小程序通用组件
+- 遵循mini-talent项目现有的页面结构和路由配置
+
+**史诗015完成状态更新(2025-12-25):**
+- ✅ **已就绪**:数据库schema、人才用户认证、个人信息查询API
+- ⚠️ **进行中**:就业信息API、帮助与支持API、通知与消息API、数据统计API
+- 🚀 **启动建议**:史诗017可以立即开始,参照已完成的API进行前端开发
+
+### 增强详情
+
+**新增/变更内容:**
+
+**1. 创建rencai mini ui包:**
+在`mini-ui-packages`下创建以下UI包:
+- `@d8d/rencai-dashboard-ui` - 人才首页/个人主页UI包
+- `@d8d/rencai-auth-ui` - 人才登录认证UI包
+- `@d8d/rencai-personal-info-ui` - 人才个人信息UI包
+- `@d8d/rencai-attendance-ui` - 人才考勤记录UI包
+- `@d8d/rencai-employment-ui` - 人才就业信息UI包
+- `@d8d/rencai-settings-ui` - 人才设置页UI包
+- `@d8d/rencai-shared-ui` - 人才共享UI组件包
+
+**2. API客户端集成模式:**
+- 每个rencai UI包内部包含自己的API客户端(`src/api/index.ts`)
+- UI包内部封装API调用逻辑,页面组件内部直接使用对应的API客户端
+- 通过package.json的`exports`字段配置导出路径,参照yongren系列UI包的配置格式:
+  ```json
+  "exports": {
+    ".": { ... },
+    "./api": { ... },
+    "./pages/LoginPage/LoginPage": { ... }
+  }
+  ```
+- mini-talent使用export配置的完整路径导入页面组件:`import LoginPage from '@d8d/rencai-auth-ui/pages/LoginPage/LoginPage'`
+- 支持`/api/v1/rencai`路径前缀的API调用
+- 提供类型安全的TypeScript RPC客户端
+
+**3. 实现页面功能:**
+在mini-talent项目中实现以下6个核心页面:
+1. 登录页 - 人才用户身份证号/残疾证号密码登录
+2. 首页/个人主页 - 个人概览、打卡状态、快捷功能入口、最新通知
+3. 考勤记录页 - 考勤日历、打卡明细、考勤统计
+4. 个人信息页 - 基本信息、银行卡信息、证件照片
+5. 就业信息页 - 当前就业状态、薪资记录、就业历史
+6. 设置页 - 账号安全、消息通知、帮助中心、退出登录
+
+**集成方式:**
+1. **API客户端模式**:每个UI包内部管理自己的API客户端和RPC类型,API调用逻辑封装在页面组件内部,mini-talent无需关心API实现
+2. **UI组件开发**:基于原型文件创建独立的rencai mini ui包,参照yongren系列UI包的结构
+3. **导航栏组件集成**:所有页面统一集成`Navbar`导航栏组件,建立页面层级结构规范
+4. **页面结构**:遵循mini-talent项目现有的页面目录结构(`src/pages/`),页面使用package.json exports配置的完整路径导入UI包组件
+5. **路由配置**:使用现有的路由配置模式,配置底部TabBar导航
+
+**成功标准:**
+1. 6个页面功能完整实现,符合原型设计要求
+2. rencai系列mini ui包创建完成,组件可复用
+3. 与史诗015补充的API模块无缝集成
+4. 保持mini-talent项目现有功能的完整性
+5. 通过Jest测试验证,包括组件测试和集成测试
+6. 遵循项目编码规范和UI组件使用规范
+
+## 故事列表
+
+### 故事017.001:rencai mini ui包基础框架搭建
+**背景:** 史诗015已完成人才用户认证API和个人信息查询API,需要创建rencai系列的mini ui包,每个UI包包含自己的API客户端和RPC类型,建立人才小程序的基础技术框架。
+
+**任务列表:**
+1. 分析史诗015已完成的API模块,确定每个UI包需要集成的RPC客户端
+2. 在`mini-ui-packages`下创建rencai系列UI包基础结构:
+   - `@d8d/rencai-dashboard-ui` - 包含首页相关的API客户端和页面组件
+   - `@d8d/rencai-auth-ui` - 包含人才认证相关的API客户端和登录组件
+   - `@d8d/rencai-personal-info-ui` - 包含个人信息查询相关的API客户端和页面组件
+   - `@d8d/rencai-attendance-ui` - 包含考勤记录相关的API客户端和页面组件(前端模拟)
+   - `@d8d/rencai-employment-ui` - 包含就业信息相关的API客户端和页面组件
+   - `@d8d/rencai-settings-ui` - 包含设置相关的API客户端和页面组件
+   - `@d8d/rencai-shared-ui` - 包含共享UI组件
+3. 为每个UI包创建API客户端(`src/api/index.ts`),集成对应的RPC接口
+4. 配置每个UI包的package.json,添加页面组件的exports导出路径(参照yongren系列UI包的export配置)
+5. 配置mini-talent项目的路由结构,支持页面导航
+6. 创建基础布局组件(状态栏、底部导航、页面容器),参考原型设计`docs/小程序原型/rencai.html`
+7. 建立人才用户认证框架,支持后续登录页面集成
+8. 编写基础测试,验证现有功能不受影响
+
+**验收标准:**
+- [ ] rencai系列7个UI包基础结构创建完成
+- [ ] 每个UI包包含自己的API客户端(`src/api/index.ts`)和对应的RPC类型定义
+- [ ] 每个UI包的package.json配置了页面组件的exports导出路径(如`"./pages/LoginPage/LoginPage"`),参照yongren-dashboard-ui的格式
+- [ ] mini-talent使用exports配置的完整路径导入页面组件:`import LoginPage from '@d8d/rencai-auth-ui/pages/LoginPage/LoginPage'`
+- [ ] 页面组件内部已封装API调用逻辑,mini-talent无需关心API实现
+- [ ] mini-talent项目的路由结构配置完成,支持页面导航
+- [ ] 基础布局组件(状态栏、底部导航、页面容器)可用并符合移动端设计
+- [ ] 人才用户认证框架就绪,支持后续登录页面集成
+- [ ] 现有mini-talent项目功能不受影响
+
+### 故事017.002:登录与首页实现
+**背景:** 依赖故事017.001完成的基础框架和史诗015提供的人才用户认证API、个人信息查询API,实现人才用户登录功能和首页/个人主页页面。
+
+**任务列表:**
+1. 创建`@d8d/rencai-auth-ui`包,实现登录页面功能
+2. 支持人才用户身份证号/残疾证号密码登录
+3. 完善认证状态管理(token存储、验证、自动刷新)
+4. 创建`@d8d/rencai-dashboard-ui`包,实现首页/个人主页页面
+5. 展示个人概览数据(姓名、残疾类型、出勤统计、本月薪资)
+6. 实现打卡状态显示(已打卡/未打卡,上班/下班打卡时间)
+7. 集成快捷功能入口(个人信息、考勤记录、薪资查询、企业信息)
+8. 实现最新通知列表
+9. 集成Navbar导航栏组件,建立统一的页面层级结构(主页面使用TabBarLayout+Navbar无返回按钮)
+10. 优化用户体验,确保页面设计符合原型标准
+11. 编写集成测试,验证登录和首页功能
+
+**验收标准:**
+- [ ] 登录页面功能完整,支持人才用户身份证号/残疾证号密码登录
+- [ ] 登录状态管理正常,token存储和验证可靠
+- [ ] 首页/个人主页页面展示个人概览数据(姓名、残疾类型、出勤统计、本月薪资)
+- [ ] 打卡状态显示正常(已打卡/未打卡,上班/下班打卡时间)
+- [ ] 快捷功能入口可用(个人信息、考勤记录、薪资查询、企业信息)
+- [ ] 最新通知列表显示正常
+- [ ] 页面设计符合原型标准,移动端体验良好,已集成Navbar导航栏组件
+- [ ] 与基础框架(故事017.001)无缝集成,建立统一的页面层级结构规范
+
+### 故事017.003:个人信息功能实现
+**背景:** 依赖故事017.001-017.002完成的基础,以及史诗015提供的个人信息查询API、银行卡信息查询API、证件照片查询API,实现个人信息管理功能。
+
+**任务列表:**
+1. 创建`@d8d/rencai-personal-info-ui`包,实现个人信息页面
+2. 展示个人基本信息(姓名、性别、年龄、身份证号、残疾证号、残疾类型、联系电话、联系地址)
+3. 集成银行卡信息查询API,展示银行卡列表(银行名称、卡号脱敏、卡类型、是否默认)
+4. 集成证件照片查询API,展示证件照片列表(身份证、残疾证、体检报告、征信报告)
+5. 支持证件照片预览功能
+6. 集成Navbar导航栏组件,使用Navbar带返回按钮(二级页面)
+7. 优化页面布局和数据展示
+8. 编写集成测试,验证个人信息功能
+
+**验收标准:**
+- [ ] 个人信息页面展示完整的个人基本信息
+- [ ] 银行卡信息查询接口返回银行卡信息(卡号脱敏处理)
+- [ ] 证件照片查询接口返回证件照片信息
+- [ ] 支持证件照片预览功能
+- [ ] 页面设计符合原型标准,已集成Navbar导航栏组件
+- [ ] 所有查询接口验证用户权限,确保用户只能查询自己的数据
+
+### 故事017.004:考勤记录功能实现
+**背景:** 依赖故事017.001-017.003完成的基础,实现考勤记录查看功能。注:史诗015的考勤记录API为P2延期功能,当前打卡功能为前端模拟实现。
+
+**任务列表:**
+1. 创建`@d8d/rencai-attendance-ui`包,实现考勤记录页面
+2. 实现考勤日历视图,标记已打卡日期和打卡状态(前端模拟数据)
+3. 实现月份切换功能
+4. 展示考勤统计(出勤率、正常出勤天数、迟到次数、早退次数、缺勤次数)
+5. 实现打卡明细列表,按日期倒序排列
+6. 显示每日打卡详情(上班打卡时间、下班打卡时间、打卡状态)
+7. 集成Navbar导航栏组件,使用Navbar带返回按钮(二级页面)
+8. 优化大数据量列表性能和页面间导航
+9. 编写集成测试,验证考勤记录功能
+
+**验收标准:**
+- [ ] 考勤日历视图功能完整,正确标记打卡状态(前端模拟数据)
+- [ ] 支持月份切换,展示对应月份的考勤数据
+- [ ] 考勤统计数据展示完整(出勤率、正常出勤天数、迟到次数、早退次数、缺勤次数)
+- [ ] 打卡明细列表功能完整,支持按日期倒序排列
+- [ ] 显示每日打卡详情(上班打卡时间、下班打卡时间、打卡状态)
+- [ ] 页面设计符合原型标准,已集成Navbar导航栏组件
+- [ ] 前端模拟数据结构符合后续API接口规范,便于后续替换为真实API
+
+### 故事017.005:就业信息功能实现
+**背景:** 依赖故事017.001-017.004完成的基础,以及史诗015提供的就业信息API(当前就业状态查询、薪资记录查询、就业历史查询),实现就业信息查看功能。
+
+**任务列表:**
+1. 创建`@d8d/rencai-employment-ui`包,实现就业信息页面
+2. 集成当前就业状态查询API,展示当前工作信息(企业名称、岗位名称、入职日期、工作状态、订单编号、薪资水平)
+3. 集成薪资记录查询API,展示薪资发放历史,支持按月份查询
+4. 实现就业历史时间线视图,展示所有历史就业记录
+5. 支持薪资详情查看(薪资明细)
+6. 集成Navbar导航栏组件,使用Navbar带返回按钮(二级页面)
+7. 优化页面加载性能和数据展示
+8. 编写集成测试,验证就业信息功能
+
+**验收标准:**
+- [ ] 当前就业状态查询接口返回正确的当前工作信息
+- [ ] 薪资记录查询接口返回历史薪资记录,支持按月查询
+- [ ] 就业历史查询接口返回个人的就业历史记录
+- [ ] 就业历史时间线视图展示完整,按时间倒序排列
+- [ ] 支持薪资详情查看功能
+- [ ] 页面设计符合原型标准,已集成Navbar导航栏组件
+
+### 故事017.006:设置与帮助功能实现
+**背景:** 依赖故事017.001-017.005完成的基础,以及史诗015提供的帮助与支持API、登录日志查询API,实现设置页和帮助功能。
+
+**任务列表:**
+1. 创建`@d8d/rencai-settings-ui`包,实现设置页面
+2. 展示个人信息摘要(姓名、残疾类型、出勤统计、本月薪资)
+3. 实现功能入口列表(修改个人信息、账号与安全、消息通知设置)
+4. 实现帮助与支持入口(帮助中心、用户协议、隐私政策)
+5. 集成登录日志查询API,展示个人登录日志
+6. 实现退出登录功能
+7. 集成Navbar导航栏组件(设置页在底部TabBar中)
+8. 编写集成测试,验证设置与帮助功能
+
+**验收标准:**
+- [ ] 设置页面展示个人信息摘要
+- [ ] 功能入口列表可用(修改个人信息、账号与安全、消息通知设置)
+- [ ] 帮助与支持入口可用(帮助中心、用户协议、隐私政策)
+- [ ] 登录日志查询接口返回个人的登录日志记录
+- [ ] 退出登录功能正常
+- [ ] 页面设计符合原型标准,已集成Navbar导航栏组件
+
+### 故事017.007:通知与消息功能实现
+**背景:** 依赖故事017.001-017.006完成的基础,以及史诗015提供的通知与消息API,实现系统通知和消息推送功能。
+
+**任务列表:**
+1. 扩展`@d8d/rencai-shared-ui`包,创建通知相关组件
+2. 集成通知列表查询API,展示个人通知列表
+3. 实现通知详情查看功能
+4. 实现通知标记已读功能(单条标记、批量标记)
+5. 展示未读通知数量
+6. 在首页集成通知入口,显示最新通知
+7. 在设置页添加消息通知设置入口
+8. 编写集成测试,验证通知与消息功能
+
+**验收标准:**
+- [ ] 通知列表查询接口返回个人的通知列表,支持分页
+- [ ] 通知详情查询接口返回通知的详细信息
+- [ ] 通知标记已读接口支持单条和批量标记已读
+- [ ] 未读通知数查询接口返回正确的未读通知数量
+- [ ] 首页正确显示最新通知
+- [ ] 设置页消息通知设置入口可用
+- [ ] 页面设计符合原型标准
+
+### 故事017.008:性能优化与测试完善
+**背景:** 依赖故事017.001-017.007完成的所有功能,进行性能优化和测试完善,确保人才小程序达到生产环境质量标准。
+
+**任务列表:**
+1. **性能优化**:
+   - 页面加载性能优化(懒加载、代码分割)
+   - 列表渲染性能优化(虚拟列表、分页加载)
+   - 图片加载优化(懒加载、压缩)
+   - API请求优化(缓存、防抖节流)
+
+2. **测试完善**:
+   - 补充单元测试,确保组件测试覆盖率≥80%
+   - 补充集成测试,确保API集成测试覆盖率≥60%
+   - 端到端测试,覆盖主要用户流程
+   - 性能测试,验证页面加载和交互性能
+
+3. **兼容性测试**:
+   - 测试不同小程序平台的兼容性(微信、支付宝等)
+   - 测试不同设备和屏幕尺寸的适配
+   - 测试网络异常情况的处理
+
+4. **用户体验优化**:
+   - 添加加载状态提示
+   - 优化错误提示信息
+   - 添加空状态提示
+   - 优化交互动效
+
+5. **文档更新**:
+   - 更新API使用文档
+   - 更新组件使用文档
+   - 添加部署说明
+
+**验收标准:**
+- [ ] 页面加载时间≤2秒(首屏加载)
+- [ ] 列表滚动流畅,无卡顿
+- [ ] 组件测试覆盖率≥80%
+- [ ] API集成测试覆盖率≥60%
+- [ ] 端到端测试覆盖主要用户流程
+- [ ] 兼容主流小程序平台和设备
+- [ ] 用户体验良好,无明显的性能问题
+- [ ] 文档完整,包含API使用说明和组件使用说明
+
+## 兼容性要求
+
+- [ ] 现有mini-talent项目功能不受影响
+- [ ] rencai系列UI包遵循yongren系列UI包的API客户端模式,每个包独立管理自己的API和类型
+- [ ] 使用一致的UI组件库,保持界面风格统一
+- [ ] 保持路由结构的统一性,新增路由不影响现有路由
+- [ ] rencai系列UI包遵循现有的mini-ui-packages包结构规范
+- [ ] 性能影响最小化,不影响现有功能响应速度
+
+## 风险缓解
+
+**主要风险:**
+1. **API集成风险**:史诗015的API可能尚未全部完成,需要并行开发
+2. **UI组件复用风险**:rencai系列UI包可能与现有yongren系列UI包存在差异
+3. **性能风险**:小程序性能可能影响用户体验
+4. **兼容性风险**:不同小程序平台可能存在兼容性问题
+
+**缓解措施:**
+1. **分阶段集成**:
+   - 先集成已完成的API(人才用户认证、个人信息查询)
+   - 未完成的API使用前端模拟数据,便于后续替换
+   - 与史诗015保持密切沟通,了解API开发进度
+
+2. **UI组件规范统一**:
+   - 参照yongren系列UI包的结构和命名规范
+   - 复用`@d8d/mini-shared-ui-components`的通用组件
+   - 创建`@d8d/rencai-shared-ui`共享UI包
+
+3. **性能优化**:
+   - 使用懒加载和代码分割减少初始加载体积
+   - 列表使用虚拟列表优化大数据量渲染
+   - 图片使用懒加载和压缩优化加载速度
+
+4. **兼容性测试**:
+   - 在开发过程中持续进行多平台测试
+   - 使用Taro的跨平台能力,确保代码兼容性
+   - 针对不同平台进行适配和优化
+
+**回滚计划:**
+1. 如果新增功能导致严重问题,可临时移除新增路由,恢复原有功能
+2. 每个UI包独立管理,可通过卸载对应包进行回滚
+3. UI包独立发布,可通过包版本管理进行回滚
+4. 保持完整的测试用例,确保回滚后功能正常
+
+## 完成定义
+
+- [ ] 所有8个故事完成,验收标准全部满足
+- [ ] 6个页面功能完整,符合原型设计要求
+- [ ] rencai系列7个UI包创建完成,组件可复用
+- [ ] API集成测试通过,包括正常流程和异常情况测试
+- [ ] 现有功能回归测试通过,确保无功能退化
+- [ ] 代码符合项目编码规范,通过代码审查
+- [ ] 文档更新完成,包括API接口文档和用户操作手册
+- [ ] 性能测试通过,页面加载时间在可接受范围内
+- [ ] 移动端适配良好,主流设备和平台测试通过
+
+## 依赖关系
+
+- 依赖史诗015(人才小程序API支持)提供完整的API接口
+- 依赖现有的mini-talent项目基础框架和构建配置
+- 依赖mini-ui-packages目录下的其他UI包作为参考
+- 依赖现有的通用UI组件包(`@d8d/mini-shared-ui-components`)
+- 参照史诗011(用人方小程序功能实现)的成功模式和架构
+
+**史诗015依赖状态(2025-12-25):**
+- ✅ **已就绪**:人才用户认证、个人信息查询
+- ⚠️ **进行中**:就业信息API、帮助与支持API、通知与消息API
+- ⚠️ **延期**:考勤记录API(P2优先级,前端模拟实现)
+- 🚀 **启动建议**:史诗017可以立即开始,与史诗015并行开发
+
+## 测试策略
+
+1. **单元测试**:对新增组件和工具函数进行Jest单元测试
+2. **集成测试**:测试API客户端与后端服务的集成
+3. **UI测试**:对页面交互和用户体验进行测试
+4. **性能测试**:验证页面的加载和渲染性能
+5. **兼容性测试**:测试不同小程序平台和设备的兼容性
+6. **回归测试**:确保现有功能不受影响
+
+---
+
+**故事经理交接说明:**
+
+请为这个已有项目开发详细用户故事。关键考虑:
+
+- 这是对现有mini-talent项目的增强,技术栈:TypeScript、React、Hono RPC、Tailwind CSS、Taro,测试使用Jest
+- 集成点:史诗015补充的人才小程序API模块(人才用户认证、个人信息查询、就业信息查询等)
+- 参照模式:史诗011(用人方小程序)的成功模式和架构,yongren系列UI包的结构规范
+- API集成模式:每个rencai UI包内部管理自己的API客户端和RPC类型,API调用逻辑封装在页面组件内部,mini-talent只需导入页面组件使用
+- UI包创建:在mini-ui-packages下创建rencai系列UI包,参照yongren系列UI包的结构
+- 关键兼容要求:不影响现有功能,保持系统完整性
+- 每个故事必须验证现有功能保持完整
+
+史诗应在保持系统完整性的同时,为残疾人用户提供完整的人才小程序功能,实现`docs/小程序原型/rencai.html`中的完整页面功能,并创建可复用的rencai mini ui包。