📝 docs(story): update category page status and add goods list UI refactor story

- 更新商品分类页开发故事状态为"Done"
- 添加商品列表页UI重构故事，包含10项验收标准和4个主要任务
- 详细描述UI重构的设计规范、技术实现和测试要求

docs/stories/001.009.category-page-development.story.md

@@ -1,7 +1,7 @@
 # Story 001.009: 商品分类页开发
 
 ## Status
-Draft
+Done
 
 ## Story
 **As a** 小程序用户，

docs/stories/001.010.goods-list-ui-refactor.story.md

@@ -0,0 +1,141 @@
+# Story 001.010: 商品列表页UI重构
+
+## Status
+Draft
+
+## Story
+**As a** 小程序用户，
+**I want** 在商品列表页浏览和筛选商品，
+**so that** 能够快速找到心仪的商品，提升购物体验。
+
+## Acceptance Criteria
+1. 参照tcb-shop-demo商品列表页设计，重构小程序商品列表页UI
+2. 页面层级调整为二级页面，移除TabBarLayout
+3. 页面背景色应用白色背景 `#fff`
+4. 商品列表容器应用灰色背景 `#f2f2f2`，添加内边距 `20rpx 24rpx`
+5. 搜索栏样式使用TDesign Search组件，圆角32rpx，高度64rpx
+6. 商品列表布局使用现有的`GoodsList`组件，保持flex布局
+7. 页面结构参照demo页面结构，使用相同的容器类名
+8. 样式集成应用tcb-shop-demo商品列表页设计规范
+9. 功能保持现有搜索、分类筛选、分页加载等功能
+10. 导航栏添加返回按钮，显示页面标题
+
+## Tasks / Subtasks
+- [ ] 调整页面层级结构 (AC: 2)
+  - [ ] 移除TabBarLayout包装 (`mini/src/pages/goods-list/index.tsx`)
+  - [ ] 将页面改为二级页面结构 (`mini/src/pages/goods-list/index.tsx`)
+  - [ ] 添加导航栏组件 (`mini/src/pages/goods-list/index.tsx`)
+- [ ] 重构页面样式和布局 (AC: 3, 4, 5, 6, 7, 8)
+  - [ ] 应用白色背景色 `#fff` (`mini/src/pages/goods-list/index.tsx`)
+  - [ ] 创建商品列表容器，应用灰色背景 `#f2f2f2` (`mini/src/pages/goods-list/index.tsx`)
+  - [ ] 添加内边距 `20rpx 24rpx` (`mini/src/pages/goods-list/index.tsx`)
+  - [ ] 重构搜索栏样式，使用TDesign Search组件 (`mini/src/pages/goods-list/index.tsx`)
+  - [ ] 应用圆角32rpx，高度64rpx (`mini/src/pages/goods-list/index.tsx`)
+  - [ ] 保持现有`GoodsList`组件布局 (`mini/src/pages/goods-list/index.tsx`)
+  - [ ] 应用tcb-shop-demo页面结构类名 (`mini/src/pages/goods-list/index.tsx`)
+- [ ] 集成导航栏功能 (AC: 10)
+  - [ ] 添加返回按钮 (`mini/src/pages/goods-list/index.tsx`)
+  - [ ] 显示页面标题 (`mini/src/pages/goods-list/index.tsx`)
+  - [ ] 实现导航功能 (`mini/src/pages/goods-list/index.tsx`)
+- [ ] 保持现有功能 (AC: 9)
+  - [ ] 验证搜索功能正常工作 (`mini/src/pages/goods-list/index.tsx`)
+  - [ ] 验证分类筛选功能 (`mini/src/pages/goods-list/index.tsx`)
+  - [ ] 验证分页加载功能 (`mini/src/pages/goods-list/index.tsx`)
+  - [ ] 验证商品点击和添加到购物车功能 (`mini/src/pages/goods-list/index.tsx`)
+
+## Dev Notes
+
+### 对照文件分析
+基于tcb-shop-demo商品列表页实现，需要转换为React + Taro组件：
+
+**页面结构**
+- 页面背景：白色 `#fff`
+- 商品列表容器：灰色背景 `#f2f2f2`，内边距 `20rpx 24rpx`
+- 搜索栏：TDesign Search组件，圆角32rpx，高度64rpx
+- 商品列表：使用现有`GoodsList`组件，flex布局
+
+**样式特点**
+- 页面背景色：`#fff`
+- 商品列表容器背景色：`#f2f2f2`
+- 搜索栏圆角：`32rpx`
+- 搜索栏高度：`64rpx`
+- 容器内边距：`20rpx 24rpx`
+
+**交互功能**
+- 保持现有搜索功能
+- 保持现有分类筛选功能
+- 保持现有分页加载功能
+- 保持现有商品点击和购物车功能
+
+### 技术栈信息
+[Source: architecture/tech-stack.md]
+- **前端框架**: React 19.1.0
+- **构建工具**: Vite 7.0.0
+- **样式**: Tailwind CSS 4.1.11 + tcb-theme.css
+- **小程序框架**: Taro
+- **状态管理**: React Query 5.83.0
+
+### 项目结构
+[Source: architecture/source-tree.md]
+- 页面位置：`mini/src/pages/goods-list/`
+- 组件位置：`mini/src/components/ui/`
+- 文件命名：PascalCase
+- 目录结构：页面使用独立目录组织
+
+### 编码标准
+[Source: architecture/coding-standards.md]
+- TypeScript严格模式
+- 一致的缩进和命名
+- ESLint规则已配置
+- 使用Hono RPC客户端进行API调用
+
+### 样式系统
+[Source: docs/prd/epic-001-tcb-shop-theme-integration.md]
+- 主色调：`#fa4126` (按钮主色)
+- 背景色：`#f2f2f2` (商品列表容器)
+- 字体大小：28rpx (搜索栏文字)
+- 圆角：32rpx (搜索栏)
+
+### API集成
+- **商品数据**: `goodsClient.$get()` 使用现有API
+- **搜索功能**: 保持现有搜索逻辑
+- **分页加载**: 保持现有无限滚动功能
+
+### 组件依赖
+- **基础组件**: GoodsList, GoodsCard (现有)
+- **TDesign组件**: Search, Image, Toast
+- **导航组件**: Navbar
+
+## Testing
+
+### 测试标准
+[Source: architecture/testing-strategy.md]
+- **测试文件位置**: `mini/tests/unit/client/pages/goods-list/`
+- **测试框架**: Vitest + Testing Library
+- **测试模式**: 单元测试
+- **覆盖率要求**: ≥ 80%
+
+### 具体测试要求
+- 页面组件渲染测试
+- 样式应用测试
+- 导航功能测试
+- 现有功能回归测试
+- 搜索和筛选功能测试
+- 分页加载测试
+
+## Change Log
+| Date | Version | Description | Author |
+|------|---------|-------------|--------|
+| 2025-11-21 | 1.0 | 初始故事创建 | Bob (Scrum Master) |
+
+## Dev Agent Record
+
+### Agent Model Used
+
+### Debug Log References
+
+### Completion Notes List
+
+### File List
+
+## QA Results