瀏覽代碼

📝 docs(prd): update epic-001 progress and task breakdown

- adjust completion rate from 87.5% (7/8) to 77.8% (7/9)
- split original story 8 into two stories:基础组件开发 and 商品分类页开发
- add detailed requirements for story 8:商品分类页基础组件开发
- update to-do list:商品分类页基础组件开发、商品分类页开发
- update component dependencies for category page development
- add verification item for商品分类页基础组件 design consistency
yourname 1 月之前
父節點
當前提交
f1a06b07e8
共有 1 個文件被更改,包括 31 次插入10 次删除
  1. 31 10
      docs/prd/epic-001-tcb-shop-theme-integration.md

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

@@ -4,9 +4,9 @@
 将tcb-shop-demo包中的主题、样式和设计规范分析并集成到当前小程序项目中,提升UI一致性和用户体验,同时保持现有系统的完整性。
 
 ## 当前进度
-- **完成度**: 87.5% (7/8 故事完成)
+- **完成度**: 77.8% (7/9 故事完成)
 - **已集成**: 主题变量、颜色系统、字体系统、布局工具类、组件样式、首页UI重构、首页商品列表数据读取、首页轮播图后台广告数据、用户中心UI重构
-- **待完成**: 商品分类页开发
+- **待完成**: 商品分类页基础组件开发、商品分类页开发
 
 ## 史诗描述
 
@@ -69,17 +69,40 @@
      - 保持现有用户认证和头像上传功能
      - 集成客服弹窗功能
 
-8. **故事8:商品分类页开发** - 参照tcb-shop-demo商品分类页设计,在mini增加商品分类页,并作为tabbar一级页
+8. **故事8:商品分类页基础组件开发** - 实现商品分类页所需的4个基础组件:侧边栏、侧边栏项、标签栏、标签栏更多组件
+   - **组件依赖**:
+     - 侧边栏组件:c-sidebar(滚动容器,宽度176rpx)- 待实现
+     - 侧边栏项组件:c-sidebar-item(选中状态、圆角效果)- 待实现
+     - 标签栏组件:c-tabbar(水平滚动,支持更多)- 待实现
+     - 标签栏更多组件:c-tabbar-more(下拉面板,3列网格)- 待实现
+   - **对照文件**:
+     - `tcb-shop-demo/pages/goods/category/components/goods-category/components/c-sidebar/*` - 侧边栏组件
+     - `tcb-shop-demo/pages/goods/category/components/goods-category/components/c-sidebar/c-sidebar-item/*` - 侧边栏项组件
+     - `tcb-shop-demo/pages/goods/category/components/goods-category/components/c-tabbar/*` - 标签栏组件
+     - `tcb-shop-demo/pages/goods/category/components/goods-category/components/c-tabbar/c-tabbar-more/*` - 标签栏更多组件
+   - **目标文件**:
+     - `mini/src/components/category/CategorySidebar.tsx` - 侧边栏组件
+     - `mini/src/components/category/CategorySidebarItem.tsx` - 侧边栏项组件
+     - `mini/src/components/category/CategoryTabbar.tsx` - 标签栏组件
+     - `mini/src/components/category/CategoryTabbarMore.tsx` - 标签栏更多组件
+   - **技术要点**:
+     - 实现侧边栏滚动容器,固定宽度176rpx
+     - 实现侧边栏项选中状态(左侧红色指示条,文字红色圆角背景)
+     - 实现标签栏水平滚动,支持超过4项时显示更多按钮
+     - 实现标签栏更多下拉面板,3列网格布局
+     - 应用tcb-shop-demo组件设计规范
+     - 保持与现有TDesign组件系统的兼容性
+
+9. **故事9:商品分类页开发** - 参照tcb-shop-demo商品分类页设计,在mini增加商品分类页,并作为tabbar一级页
    - **对照文件**:
      - `tcb-shop-demo/pages/goods/category/index.wxml` - 商品分类页结构模板
      - `tcb-shop-demo/pages/goods/category/index.wxss` - 商品分类页样式文件
      - `tcb-shop-demo/pages/goods/category/index.js` - 商品分类页逻辑文件
      - `tcb-shop-demo/pages/goods/category/components/goods-category/index.wxml` - 商品分类组件结构
      - `tcb-shop-demo/pages/goods/category/components/goods-category/index.wxss` - 商品分类组件样式
-     - `tcb-shop-demo/pages/goods/category/components/goods-category/components/c-sidebar/*` - 侧边栏组件
-     - `tcb-shop-demo/pages/goods/category/components/goods-category/components/c-tabbar/*` - 标签栏组件
    - **目标文件**: `mini/src/pages/category/index.tsx`
    - **技术要点**:
+     - 使用故事8中实现的4个基础组件
      - 实现左侧边栏一级分类导航(c-sidebar组件,宽度176rpx)
      - 实现侧边栏项组件(c-sidebar-item),支持选中状态和圆角效果
      - 实现右侧二级分类网格布局(3列网格,grid-template-columns: 33.33% 33.33% 33.33%)
@@ -106,7 +129,7 @@
 
 ## 完成定义
 
-- [ ] 所有故事完成且验收标准满足 (7/8 完成)
+- [ ] 所有故事完成且验收标准满足 (7/9 完成)
 - [x] 现有功能通过测试验证
 - [x] 集成点正常工作
 - [x] 文档适当更新
@@ -206,10 +229,7 @@
   - 右侧内容区:二级分类网格布局(3列)- 待实现
   - 广告图区域:固定位置显示广告图 - 待实现
 - **组件依赖**:
-  - 侧边栏组件:c-sidebar(滚动容器,宽度176rpx)- 待实现
-  - 侧边栏项组件:c-sidebar-item(选中状态、圆角效果)- 待实现
-  - 标签栏组件:c-tabbar(水平滚动,支持更多)- 待实现
-  - 标签栏更多组件:c-tabbar-more(下拉面板,3列网格)- 待实现
+  - 使用故事8中实现的4个基础组件
   - TDesign组件:image, toast - 待实现
 - **样式特点**:
   - 左侧边栏背景色:`#f5f5f5` - 待实现
@@ -241,6 +261,7 @@
 - ✅ 首页商品数据真实化
 - ✅ 首页轮播图使用后台广告数据
 - ✅ 用户中心UI与tcb-shop-demo设计一致
+- [ ] 商品分类页基础组件与tcb-shop-demo设计一致
 - [ ] 商品分类页与tcb-shop-demo设计一致
 
 ## 故事完成状态