Epic 003 - Mini Bug修复
Epic Goal
修复当前mini小程序中的一些关键bug,提升用户体验和功能完整性。
Epic Description
Existing System Context:
- 当前mini小程序是一个基于Taro + React + TypeScript的电商小程序
- 使用Hono RPC客户端进行API调用
- 订单管理功能已基本实现,但部分操作缺少实际API调用
- 技术栈:React, TypeScript, Taro, Hono, TanStack Query
Enhancement Details:
- 修复订单列表页和详情页中取消订单功能,现在没有实际调用取消订单的API
- 确保所有订单操作按钮都能正确调用对应的后端API
- 提升用户操作的可靠性和反馈体验
Success criteria:
- 取消订单功能能正确调用后端API
- 用户操作后有明确的成功/失败反馈
- 订单状态能正确更新
Stories
Story 1: 修复订单列表页和详情页的取消订单功能
- 在
OrderButtonBar组件中实现实际的取消订单API调用 (mini/src/components/order/OrderButtonBar/index.tsx)
- 在
OrderDetailPage组件中集成取消订单mutation (mini/src/pages/order-detail/index.tsx)
- 添加取消原因输入功能 (
mini/src/components/common/CancelReasonDialog/index.tsx)
- 完善错误处理和用户反馈
Story 2: 修复订单列表和详情页商品显示问题 ✅ 已完成
- 问题分析: 订单接口返回的数据结构中
goodsDetail字段存储的是JSON字符串格式的商品信息,但前端解析时可能存在问题,导致商品信息无法正确显示
- 架构重构: 从goodsDetail字段解析改为使用一对多关联关系,在订单实体中添加与订单商品的关联
- 后端修复: 更新用户订单路由配置包含orderGoods关联查询,统一图片URL字段格式
- 前端修复: 更新
OrderCard组件和OrderDetailPage使用新的orderGoods关联关系 (mini/src/components/order/OrderCard/index.tsx:18-24, mini/src/pages/order-detail/index.tsx:134-140)
- 数据验证: 验证订单创建时订单商品关联关系正确建立,包含完整的商品信息
- UI优化: 确保订单列表页和详情页中商品图片、名称、规格、价格等信息的完整显示 (
mini/src/pages/order-list/index.tsx, mini/src/pages/order-detail/index.tsx:242-263)
- 错误处理: 增强关联数据为空时的错误处理,显示默认商品信息
Story 3: 修复商品价格显示不一致问题
- 问题分析: 商品列表页显示的商品价格与商品详情页显示的价格可能不一致,可能是由于规格选择、促销活动或数据同步问题导致
- 价格同步: 确保商品列表页的
price字段与商品详情页的price字段数据来源一致 (mini/src/pages/goods-list/index.tsx:166, mini/src/pages/goods-detail/index.tsx:227)
- 规格价格: 修复商品详情页中规格选择时的价格计算逻辑,确保选中规格后价格正确更新 (
mini/src/pages/goods-detail/index.tsx:110-119, mini/src/components/goods-spec-selector/index.tsx)
- 促销价格: 验证促销价格逻辑,确保商品列表页和详情页显示的促销价格一致
- 数据验证: 在商品详情页添加价格验证,确保显示的价格与后端API返回的价格一致
Compatibility Requirements
Risk Mitigation
- Primary Risk: 取消订单API调用失败导致用户体验差
- Mitigation: 完善的错误处理和用户反馈机制
- Rollback Plan: 回退到当前状态,取消订单功能保持模拟状态
Definition of Done
Story Manager Handoff:
"请为这个现有项目史诗开发详细的用户故事。关键考虑因素:
- 这是一个基于{{React, TypeScript, Taro, Hono, TanStack Query}}的现有系统增强
- 集成点:订单API客户端、取消订单路由
- 要遵循的现有模式:订单状态管理、用户操作反馈
- 关键兼容性要求:保持现有API不变,遵循现有UI模式
- 每个故事必须包含验证现有功能保持完整的检查
这个史诗应该在保持系统完整性的同时交付{{修复取消订单功能}}的目标。"