瀏覽代碼

docs(story-008.005): 添加残疾人选择器组件任务,支持订单管理UI需求

- 更新Story描述:添加创建可复用残疾人选择器组件目标
- 扩展Acceptance Criteria:新增第7条残疾人选择器组件要求
- 添加任务8:创建残疾人选择器组件(复杂对话框模式)
  - 分析源系统SelectPersonModal实现
  - 创建DisabledPersonSelector组件(8个搜索字段、表格展示、黑名单确认)
  - 扩展API客户端支持搜索功能
  - 创建组件集成测试
  - 更新包导出配置
- 添加技术说明:残疾人选择器组件设计章节
- 更新测试策略:包含选择器组件测试
- 更新状态和变更记录

🤖 Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>
yourname 5 天之前
父節點
當前提交
d51162d688
共有 1 個文件被更改,包括 65 次插入6 次删除
  1. 65 6
      docs/stories/008.005.transplant-disability-management-ui.story.md

+ 65 - 6
docs/stories/008.005.transplant-disability-management-ui.story.md

@@ -1,12 +1,12 @@
 # Story 008.005: 移植残疾人管理UI(disability → @d8d/allin-disability-management-ui)
 
 ## Status
-Ready for Review
+In Progress (新增残疾人选择器组件任务)
 
 ## Story
 **As a** 开发者,
-**I want** 将disability管理页面从allin_system-master/client移植为独立UI包@d8d/allin-disability-management-ui,完成技术栈转换并集成区域选择器组件,
-**so that** 我们可以将Allin系统的残疾人管理UI模块集成到当前项目中,遵循现有的UI包结构和编码标准,正确集成区域选择器组件用于残疾人区域信息管理。
+**I want** 将disability管理页面从allin_system-master/client移植为独立UI包@d8d/allin-disability-management-ui,完成技术栈转换并集成区域选择器组件和创建可复用的残疾人选择器组件
+**so that** 我们可以将Allin系统的残疾人管理UI模块集成到当前项目中,遵循现有的UI包结构和编码标准,正确集成区域选择器组件用于残疾人区域信息管理,并提供可复用的残疾人选择器组件供其他模块(如订单管理)使用
 
 ## Acceptance Criteria
 1. 创建`allin-packages/disability-management-ui`目录结构
@@ -15,9 +15,10 @@ Ready for Review
 4. 完成API客户端转换:与disability-module集成
 5. 完成状态管理转换:残疾人数据状态
 6. 完成表单转换:基础残疾人信息表单(包含区域选择)
-7. 配置package.json:依赖`@d8d/allin-disability-module`和`@d8d/area-management-ui`
-8. 编写组件测试:验证残疾人管理功能(包含区域选择验证)
-9. 通过类型检查和基本测试验证
+7. **残疾人选择器组件**:创建可复用的残疾人选择器组件(复杂对话框模式),支持多维度搜索、筛选和批量选择
+8. 配置package.json:依赖`@d8d/allin-disability-module`和`@d8d/area-management-ui`
+9. 编写组件测试:验证残疾人管理功能(包含区域选择验证和选择器组件测试)
+10. 通过类型检查和基本测试验证
 
 ## Tasks / Subtasks
 - [x] 任务1:创建残疾人管理UI包基础结构 (AC: 1)
@@ -52,11 +53,47 @@ Ready for Review
   - [x] 验证表单验证和错误处理功能
   - [x] 验证组件导出和类型定义正确
 
+- [ ] 任务8:创建残疾人选择器组件(新增任务)
+  - [ ] 分析源系统残疾人选择器实现:`allin_system-master/client/app/admin/dashboard/order/SelectPersonModal.tsx`
+    - **查看要点**:对话框模式、8个搜索字段、表格展示、黑名单确认逻辑
+    - **搜索字段**:姓名、性别、残疾证号、联系电话、省份、城市、残疾类型、残疾等级
+    - **区域集成**:省份→城市三级联动,集成`@d8d/area-management-ui`区域选择器
+  - [ ] 创建残疾人选择器组件:`src/components/DisabledPersonSelector.tsx`
+    - **组件模式**:复杂对话框模式(Dialog组件)
+    - **功能**:支持单选/多选模式、搜索筛选、分页、黑名单确认
+    - **Props接口**:
+      ```typescript
+      interface DisabledPersonSelectorProps {
+        open: boolean;
+        onOpenChange: (open: boolean) => void;
+        onSelect: (person: DisabledPerson | DisabledPerson[]) => void;
+        mode?: 'single' | 'multiple';
+        selectedIds?: number[];
+        disabledIds?: number[];
+      }
+      ```
+    - **搜索区域**:8个搜索字段,支持重置功能
+    - **表格区域**:DataTable展示残疾人列表,包含选择操作
+    - **黑名单逻辑**:黑名单人员需要二次确认
+  - [ ] 扩展API客户端支持搜索功能
+    - **搜索API**:扩展残疾人API客户端,支持搜索参数传递
+    - **分页支持**:集成分页参数到搜索查询
+    - **类型定义**:创建搜索相关的类型定义
+  - [ ] 创建组件集成测试:`tests/integration/disabled-person-selector.integration.test.tsx`
+    - **测试场景**:对话框打开/关闭、搜索功能、选择功能、黑名单确认、错误处理
+    - **测试ID**:为关键交互元素添加`data-testid`属性
+    - **参考文件**:`packages/advertisement-type-management-ui/tests/integration/advertisement-type-selector.integration.test.tsx`
+  - [ ] 更新包导出配置
+    - **组件导出**:在`src/index.ts`和`src/components/index.ts`中导出`DisabledPersonSelector`组件
+    - **类型导出**:确保相关类型定义正确导出
+    - **用途说明**:作为可复用组件供其他UI包使用(如订单管理UI需要选择残疾人)
+
 ### 任务调整说明
 根据UI包开发规范和经验,对原任务进行了优化:
 1. **移除任务4(自定义Hook)**:主组件直接使用`useQuery`和`useMutation`,无需额外Hook封装
 2. **移除任务5(表单Schema)**:直接使用后端模块的Schema,避免重复定义
 3. **优化组件结构**:将表格、表单、模态框功能集成到主组件中,简化结构
+4. **新增任务8(残疾人选择器组件)**:基于故事008.007的需求分析,添加可复用的残疾人选择器组件任务,采用复杂对话框模式,支持多维度搜索和筛选,供订单管理UI等其他模块使用
 
 ## Dev Notes
 
@@ -137,6 +174,25 @@ Ready for Review
 - **数据格式**:`AreaSelect`组件返回`{ provinceId?, cityId?, districtId? }`格式
 - **验证集成**:残疾人Schema中的区域字段验证与`AreaSelect`组件集成
 
+### 残疾人选择器组件设计(新增)
+- **组件模式**:复杂对话框模式(Dialog组件),参考源系统`SelectPersonModal.tsx`
+- **搜索功能**:8个搜索字段,支持多维度筛选
+  - 姓名(模糊搜索)
+  - 性别(下拉选择:男/女)
+  - 残疾证号(精确搜索)
+  - 联系电话(模糊搜索)
+  - 省份/城市(集成`AreaSelect`组件,三级联动)
+  - 残疾类型(下拉选择,从字典获取)
+  - 残疾等级(下拉选择,从字典获取)
+- **表格展示**:DataTable展示残疾人列表,包含选择操作
+- **选择模式**:支持单选和多选模式
+- **特殊逻辑**:
+  - 黑名单人员二次确认
+  - 已选择/禁用人员标识
+  - 分页支持
+- **API集成**:扩展残疾人API客户端,支持搜索参数传递
+- **复用性**:作为可复用组件导出,供其他UI包(如订单管理UI)使用
+
 ### 表单验证要求
 - **必填字段**:姓名、性别、身份证号、残疾证号、残疾类型、残疾等级、联系电话
 - **身份证号验证**:格式验证、唯一性验证(后端验证)
@@ -151,6 +207,7 @@ Ready for Review
 - **测试覆盖要求**:
   - 完整CRUD流程测试
   - 区域选择器集成测试
+  - **残疾人选择器组件测试**:对话框功能、搜索筛选、选择逻辑、黑名单确认
   - 表单验证测试(必填字段、身份证号格式、联系电话格式)
   - 错误处理测试(API错误、验证错误)
 - **测试模式**:参考现有UI包的集成测试模式
@@ -159,12 +216,14 @@ Ready for Review
 - 使用`data-testid`进行元素定位,避免文本查找
 - 模拟完整的用户交互流程
 - 验证区域选择器的集成和数据转换
+- **测试残疾人选择器组件**:对话框交互、搜索功能、选择逻辑、黑名单处理
 - 测试表单验证和错误提示
 - 覆盖各种错误场景
 
 ## Change Log
 | Date | Version | Description | Author |
 |------|---------|-------------|--------|
+| 2025-12-04 | 1.3 | 添加残疾人选择器组件任务,支持故事008.007的订单管理需求 | John (PM) |
 | 2025-12-03 | 1.2 | 修复测试问题和Schema错误消息,所有测试通过 | James (Dev Agent) |
 | 2025-12-03 | 1.1 | 完成残疾人管理UI包开发,包含区域选择器集成 | James (Dev Agent) |
 | 2025-12-03 | 1.0 | 初始创建故事008.005 | Scrum Master Bob |