Explorar el Código

📝 docs(prd): update shopping cart page UI refactoring details

- move shopping cart page technical details from story 13 to story 12
- add target file path: mini/src/pages/cart/index.tsx
- detail technical points including page structure, layered cart design, product card, quantity selector, checkout bar, empty state, etc.
- specify success criteria for shopping cart page refactoring
yourname hace 1 mes
padre
commit
b5f36d6c6f
Se han modificado 1 ficheros con 19 adiciones y 19 borrados
  1. 19 19
      docs/prd/epic-001-tcb-shop-theme-integration.md

+ 19 - 19
docs/prd/epic-001-tcb-shop-theme-integration.md

@@ -160,6 +160,25 @@
      - 页面组件TypeScript编译正常,无错误
      
 12. ✅ **故事12:购物车页面UI重构** - 参照tcb-shop-demo购物车页面设计,重构现有购物车页面UI,实现分层购物车、商品卡片、底部结算栏等功能 (已完成)
+   - **目标文件**: `mini/src/pages/cart/index.tsx`
+   - **技术要点**:
+     - **页面结构重构**:参照demo页面结构,重新组织页面布局,包含购物车商品列表、底部结算栏、广告区域等
+     - **分层购物车设计**:实现分层购物车结构,支持按店铺分组显示商品
+     - **商品卡片重构**:重新设计购物车商品卡片,包含商品图片、名称、规格、价格、数量选择器
+     - **数量选择器样式**:应用tcb-shop-demo数量选择器样式(灰色背景,44rpx高度,加减按钮样式)
+     - **底部结算栏**:重构底部结算栏,包含全选功能、总价计算、去结算按钮
+     - **购物车空态**:实现购物车空态页面,包含空购物车图标和去首页按钮
+     - **广告区域**:在购物车页面底部添加广告区域
+     - **侧滑删除功能**:实现商品侧滑删除功能,支持左滑显示删除按钮
+     - **数据集成**:保持现有购物车数据API集成,应用tcb-shop-demo购物车数据结构
+     - **样式集成**:应用tcb-shop-demo购物车页面设计规范,创建专用CSS文件
+     - **功能完整性**:验证全选、删除、数量调整、结算等所有功能正常工作
+   - **成功标准**:
+     - 购物车页面UI与tcb-shop-demo设计完全一致
+     - 所有功能模块正常工作(商品列表、数量选择、全选、删除、结算等)
+     - 数据API集成完整,显示真实购物车数据
+     - 底部结算栏功能正常(全选、总价计算、去结算)
+     - 页面组件TypeScript编译正常,无错误
 
 13. ✅ **故事13:订单列表页UI重构** - 参照tcb-shop-demo订单列表页设计,在小程序中实现完整的订单列表功能,包含订单状态筛选、订单卡片展示、订单操作按钮等功能 (已完成)
    - **对照文件**:
@@ -188,25 +207,6 @@
      - 页面组件TypeScript编译正常,无错误
      - `tcb-shop-demo/pages/cart/components/cart-empty/index.js` - 购物车空态组件
      - `tcb-shop-demo/pages/cart/components/goods-card/index.js` - 购物车商品卡片组件
-   - **目标文件**: `mini/src/pages/cart/index.tsx`
-   - **技术要点**:
-     - **页面结构重构**:参照demo页面结构,重新组织页面布局,包含购物车商品列表、底部结算栏、广告区域等
-     - **分层购物车设计**:实现分层购物车结构,支持按店铺分组显示商品
-     - **商品卡片重构**:重新设计购物车商品卡片,包含商品图片、名称、规格、价格、数量选择器
-     - **数量选择器样式**:应用tcb-shop-demo数量选择器样式(灰色背景,44rpx高度,加减按钮样式)
-     - **底部结算栏**:重构底部结算栏,包含全选功能、总价计算、去结算按钮
-     - **购物车空态**:实现购物车空态页面,包含空购物车图标和去首页按钮
-     - **广告区域**:在购物车页面底部添加广告区域
-     - **侧滑删除功能**:实现商品侧滑删除功能,支持左滑显示删除按钮
-     - **数据集成**:保持现有购物车数据API集成,应用tcb-shop-demo购物车数据结构
-     - **样式集成**:应用tcb-shop-demo购物车页面设计规范,创建专用CSS文件
-     - **功能完整性**:验证全选、删除、数量调整、结算等所有功能正常工作
-   - **成功标准**:
-     - 购物车页面UI与tcb-shop-demo设计完全一致
-     - 所有功能模块正常工作(商品列表、数量选择、全选、删除、结算等)
-     - 数据API集成完整,显示真实购物车数据
-     - 底部结算栏功能正常(全选、总价计算、去结算)
-     - 页面组件TypeScript编译正常,无错误
 
 ## 兼容性要求