mini-starter/docs/stories/010.005.story.md

Story 010.005: 优化操作按钮文本

Status

Ready for Review

Story

As a 订单管理员 I want 操作按钮文本准确反映功能 so that 更直观地理解按钮功能

Acceptance Criteria

1. 操作栏中"添加资产"按钮修改为"添加附件"
2. 按钮功能保持不变
3. 相关提示文本同步更新

Tasks / Subtasks

• 修改OrderManagement.tsx中的"添加资产"按钮文本 (AC: 1)
  • 定位文件：allin-packages/order-management-ui/src/components/OrderManagement.tsx:565
  • 将"添加资产"修改为"添加附件"
  • 确保按钮的data-testid属性保持不变：add-asset-button-${order.id}
• 修改OrderPersonAssetAssociation.tsx中的"添加资产"按钮文本 (AC: 1)
  • 定位文件：allin-packages/order-management-ui/src/components/OrderPersonAssetAssociation.tsx:350
  • 将"添加资产"修改为"添加附件"
  • 确保按钮功能保持不变
• 修改关闭订单确认对话框中的相关文本 (AC: 3)
  • 定位文件：allin-packages/order-management-ui/src/components/OrderManagement.tsx:707
  • 将"订单关闭后将无法再添加人员或资产"修改为"订单关闭后将无法再添加人员或附件"
  • 确保测试中的验证文本同步更新
• 更新测试文件中的相关注释文本 (AC: 3)
  • 定位文件：allin-packages/order-management-ui/tests/integration/order.integration.test.tsx
  • 将第703行的"先打开下拉菜单，然后点击添加资产按钮"修改为"先打开下拉菜单，然后点击添加附件按钮"
  • 将第708行的"等待下拉菜单打开，然后点击添加资产按钮"修改为"等待下拉菜单打开，然后点击添加附件按钮"
• 验证修改后的功能 (AC: 2)
  • 运行订单管理UI包的测试：pnpm test
  • 验证所有测试通过
  • 手动测试按钮功能是否保持不变

Dev Notes

技术栈信息 [Source: architecture/tech-stack.md]

• 前端框架: React 19.1.0 + TypeScript
• 路由: React Router v7
• 状态管理: @tanstack/react-query (服务端状态) + Context (本地状态)
• UI组件库: shadcn/ui (基于Radix UI)
• 构建工具: Vite 7.0.0
• 样式: Tailwind CSS 4.1.11
• HTTP客户端: 基于Hono Client的封装 + axios适配器

项目结构信息 [Source: architecture/source-tree.md]

• 订单管理UI包路径: allin-packages/order-management-ui/
• 订单模块路径: allin-packages/order-module/
• Web应用路径: web/src/client/admin/
• 组件位置: allin-packages/order-management-ui/src/components/OrderManagement.tsx
• API客户端位置: allin-packages/order-management-ui/src/api/orderClient.ts
• 订单表单组件: allin-packages/order-management-ui/src/components/OrderForm.tsx

需要修改的具体位置（基于代码分析）

1. OrderManagement.tsx中的"添加资产"按钮

• 文件: allin-packages/order-management-ui/src/components/OrderManagement.tsx:565
• 当前文本: 添加资产
• 修改为: 添加附件

• 相关代码:

  <DropdownMenuItem
  onClick={() => handleAddAsset(order.id)}
  data-testid={`add-asset-button-${order.id}`}
  >
  <FileText className="mr-2 h-4 w-4" />
  添加资产  // ← 修改这里
  </DropdownMenuItem>
  

2. OrderPersonAssetAssociation.tsx中的"添加资产"按钮

• 文件: allin-packages/order-management-ui/src/components/OrderPersonAssetAssociation.tsx:350
• 当前文本: 添加资产
• 修改为: 添加附件

• 相关代码:

  <Button onClick={handleAddAsset} size="sm">
  <Plus className="mr-2 h-4 w-4" />
  添加资产  // ← 修改这里
  </Button>
  

3. OrderManagement.tsx中的关闭订单确认对话框文本

• 文件: allin-packages/order-management-ui/src/components/OrderManagement.tsx:707
• 当前文本: 确定要关闭这个订单吗？订单关闭后将无法再添加人员或资产。
• 修改为: 确定要关闭这个订单吗？订单关闭后将无法再添加人员或附件。

• 相关代码:

  <AlertDialogDescription data-testid="close-confirm-dialog-description">
  确定要关闭这个订单吗？订单关闭后将无法再添加人员或资产。  // ← 修改这里
  </AlertDialogDescription>
  

4. 测试文件中的注释文本

• 文件: allin-packages/order-management-ui/tests/integration/order.integration.test.tsx
• 第703行: // 先打开下拉菜单，然后点击添加资产按钮 → // 先打开下拉菜单，然后点击添加附件按钮
• 第708行: // 等待下拉菜单打开，然后点击添加资产按钮 → // 等待下拉菜单打开，然后点击添加附件按钮

UI包开发规范要求 [Source: architecture/ui-package-standards.md]

1. 必须遵循UI包开发规范，基于史诗008经验总结
2. API路径映射验证: 开发前必须验证故事中的API路径映射与实际后端路由定义的一致性
3. 类型推断最佳实践: 必须使用RPC推断类型，而不是直接导入schema类型
4. 测试选择器优化: 必须为关键交互元素添加 data-testid 属性
5. 表单组件模式: 必须使用条件渲染两个独立的Form组件
6. API调用一致性: 必须根据实际路由名称修正API调用

编码标准要求 [Source: architecture/coding-standards.md]

1. 测试框架: 使用Vitest + Testing Library + hono/testing + Playwright
2. 测试位置: tests/ 文件夹与源码并列
3. 覆盖率目标: 核心业务逻辑 > 80%
4. 测试类型: 单元测试、集成测试、E2E测试

测试标准 [Source: architecture/testing-strategy.md]

• 测试框架: Vitest + Testing Library
• 测试位置: tests/integration/ 文件夹
• 测试类型: 集成测试验证组件与API交互
• 覆盖率要求: 核心编辑订单功能 > 80%

测试选择器要求

必须保持现有的 data-testid 属性不变：

• data-testid="add-asset-button-${order.id}" (按钮功能不变，只是文本修改)
• data-testid="close-confirm-dialog-description" (文本内容更新)

文件位置

• 主要修改文件: allin-packages/order-management-ui/src/components/OrderManagement.tsx
• 其他修改文件: allin-packages/order-management-ui/src/components/OrderPersonAssetAssociation.tsx
• 测试文件: allin-packages/order-management-ui/tests/integration/order.integration.test.tsx

测试验证

具体测试要求

1. 按钮文本验证: 验证"添加资产"按钮文本已修改为"添加附件"
2. 功能测试: 验证按钮功能保持不变，点击后仍能打开资产关联模态框
3. 对话框文本验证: 验证关闭订单确认对话框文本已更新
4. 回归测试: 确保现有功能不受影响

测试执行

• 运行订单管理UI包测试: pnpm test
• 验证所有测试通过
• 检查测试覆盖率

Change Log

Date	Version	Description	Author
2025-12-12	1.0	故事创建，基于史诗010-05需求	Scrum Master Bob

Dev Agent Record

此部分由开发代理在实施过程中填写

Agent Model Used

• Claude Code (d8d-model)

Debug Log References

• 测试失败：关闭订单确认对话框文本不匹配（期望："资产"，实际："附件"）
• 修复：更新测试文件中的期望文本以匹配修改后的文本

Completion Notes List

1. 成功修改OrderManagement.tsx中的"添加资产"按钮文本为"添加附件"（第565行）
2. 成功修改OrderManagement.tsx中的关闭订单确认对话框文本（第707行）
3. 成功修改OrderPersonAssetAssociation.tsx中的"添加资产"按钮文本为"添加附件"（第350行）
4. 成功更新测试文件中的相关注释文本
5. 修复测试文件中的期望文本以匹配修改后的内容
6. 所有测试通过验证

File List

1. /mnt/code/188-179-template-6/allin-packages/order-management-ui/src/components/OrderManagement.tsx
2. /mnt/code/188-179-template-6/allin-packages/order-management-ui/src/components/OrderPersonAssetAssociation.tsx
3. /mnt/code/188-179-template-6/allin-packages/order-management-ui/tests/integration/order.integration.test.tsx

DoD Checklist Results

1. Requirements Met:
   • 所有功能需求已实现：修改了"添加资产"按钮文本为"添加附件"
   • 所有验收标准已满足：AC1、AC2、AC3都已满足
2. Coding Standards & Project Structure:
   • 遵循编码标准：只是文本修改，没有引入新代码
   • 遵循项目结构：修改的文件位置正确
   • 遵循技术栈：没有引入新技术
   • 遵循API参考：没有修改API
   • 安全最佳实践：只是文本修改
   • [N/A] 没有新的lint错误：ESLint模块问题（非本次修改引起）
   • 代码注释：不需要新注释
3. Testing:
   • 单元测试：故事没有要求新测试
   • 集成测试：更新了现有测试
   • 所有测试通过：已验证
   • 测试覆盖率：没有降低覆盖率
4. Functionality & Verification:
   • 功能手动验证：文本修改已确认
   • 边界情况处理：只是文本修改
5. Story Administration:
   • 所有任务标记完成：已更新
   • 开发决策文档化：已记录在开发代理记录中
   • 故事总结部分完成：已更新状态和记录
6. Dependencies, Build & Configuration:
   • 项目构建成功：已验证
   • [N/A] 项目lint通过：ESLint模块问题（非本次修改引起）
   • 新依赖：没有添加新依赖
   • [N/A] 依赖记录：不适用
   • [N/A] 安全漏洞：不适用
   • [N/A] 环境变量：不适用
7. Documentation:
   • [N/A] 内联文档：不适用
   • [N/A] 用户文档：不适用
   • [N/A] 技术文档：不适用

最终确认： 我，开发代理，确认故事010.005已成功实施，所有修改已通过测试验证，故事已准备好进行审查。

QA Results

此部分由QA代理在审查完成后填写