smt/docs/PHASE3_TODO.md

# Phase 3: 记录与历史 - 待办清单

> 快速查看待完成任务，详细说明请参考 [DEVELOPMENT.md](./DEVELOPMENT.md)

## Day 1: 记录表单组件 ✅

### smoke-record-dialog 组件
- [x] 组件结构和布局
- [x] 时间选择器 (日期 + 时间)
- [x] 数量选择器 (加减按钮)
- [x] 烟瘾等级选择 (1-5 级)
- [x] 备注输入框
- [x] 底部弹出动画
- [x] 双向绑定 (v-model:show)
- [x] 两种模式支持 (smoke/resisted)
- [x] 数据提交逻辑

### 配置和文档
- [x] easycom 自动导入配置
- [x] 组件文档 (README.md)
- [x] 使用示例和说明
- [x] 错误修复文档

### 首页集成
- [x] 导入组件
- [x] 两个快捷按钮
- [x] 提交处理逻辑
- [x] Dashboard 数据更新

### API 封装
- [x] createLog API
- [x] getLatestLogs API
- [ ] updateLog API (已定义，待集成)
- [ ] deleteLog API (已定义，待集成)

---

## Day 2: 历史记录页 ⏳

### 页面结构 (`pages/logs/index.vue`)
- [ ] 创建页面文件
- [ ] 导航栏配置
- [ ] 页面基础布局
- [ ] scroll-view 容器

### 筛选功能
- [ ] Tabs 组件
  - [ ] 全部
  - [ ] 已抽烟
  - [ ] 已忍住
- [ ] 筛选逻辑实现
- [ ] 切换动画

### 数据层 (`stores/logs.js`)
- [ ] 创建 store 文件
- [ ] State 定义
  ```javascript
  {
    logs: [],
    total: 0,
    page: 1,
    pageSize: 20,
    hasMore: true,
    loading: false
  }
  ```
- [ ] Getters 实现
  - [ ] groupedByDate (按日期分组)
  - [ ] smokeCount (抽烟记录数)
  - [ ] resistedCount (忍住记录数)
- [ ] Actions 实现
  - [ ] fetchLogs (获取记录列表)
  - [ ] loadMore (加载更多)
  - [ ] deleteLog (删除记录)
  - [ ] updateLog (更新记录)
  - [ ] clearLogs (清空列表)

### log-item 组件 (`components/log-item/log-item.vue`)
- [ ] 创建组件文件
- [ ] 卡片布局
- [ ] 类型图标显示 (🚬/💪)
- [ ] 时间显示 (HH:mm)
- [ ] 数量和等级显示
- [ ] 备注内容显示
- [ ] 间隔时间计算
- [ ] 样式实现
  - [ ] 基础样式
  - [ ] 抽烟/忍住边框色
  - [ ] 响应式布局

### 左滑操作
- [ ] 安装/导入 uni-swipe-action
- [ ] 左滑菜单
  - [ ] 编辑按钮 (蓝色)
  - [ ] 删除按钮 (红色)
- [ ] 编辑功能
  - [ ] 打开编辑弹框
  - [ ] 预填充数据
  - [ ] 调用 updateLog API
  - [ ] 更新列表
- [ ] 删除功能
  - [ ] 确认对话框
  - [ ] 调用 deleteLog API
  - [ ] 乐观更新
  - [ ] 失败回滚

### 日期分组
- [ ] groupByDate 函数
- [ ] 日期格式化
  - [ ] 今天
  - [ ] 昨天
  - [ ] MM-DD
- [ ] 分组渲染
- [ ] 日期头部样式

### 加载状态
- [ ] 骨架屏组件
  - [ ] 卡片骨架
  - [ ] shimmer 动画
- [ ] 下拉刷新
  - [ ] refresher 配置
  - [ ] 刷新逻辑
  - [ ] 重置页码
- [ ] 上拉加载
  - [ ] onReachBottom 处理
  - [ ] hasMore 检查
  - [ ] 加载动画
- [ ] 空状态
  - [ ] 空状态图标
  - [ ] 提示文案
  - [ ] 引导按钮

### 浮动按钮
- [ ] 固定定位
- [ ] 样式实现
  - [ ] 圆形按钮
  - [ ] 阴影效果
  - [ ] 动画效果
- [ ] 点击打开记录弹框
- [ ] 避开 tabbar

### 性能优化
- [ ] 虚拟列表 (可选)
- [ ] 图片懒加载 (如有)
- [ ] 请求缓存
- [ ] 防抖处理
- [ ] 请求取消

### 错误处理
- [ ] 网络异常提示
- [ ] 加载失败重试
- [ ] 删除失败回滚
- [ ] 表单验证

---

## 测试任务 ⏳

### 功能测试
- [ ] 记录提交
  - [ ] 快速记录 (默认值)
  - [ ] 完整记录
  - [ ] 抽烟模式
  - [ ] 忍住模式
- [ ] 历史记录
  - [ ] 列表显示
  - [ ] 分页加载
  - [ ] 筛选功能
  - [ ] 编辑记录
  - [ ] 删除记录

### 边界测试
- [ ] 空数据状态
- [ ] 网络异常
- [ ] 提交失败
- [ ] 删除失败
- [ ] 并发操作
- [ ] 快速点击

### 性能测试
- [ ] 弹框动画 < 300ms
- [ ] 列表加载 < 1s
- [ ] 滚动流畅度 (60fps)
- [ ] 长列表性能

### 兼容性测试
- [ ] iOS 系统
- [ ] Android 系统
- [ ] 不同机型
- [ ] 安全区域适配

---

## 文档任务 ✅

- [x] 完善 DEVELOPMENT.md Phase 3 部分
- [x] 创建 PHASE3_SUMMARY.md
- [x] 创建 PHASE3_TODO.md
- [x] 组件使用文档
- [x] API 集成说明

---

## 进度统计

**总任务**: ~60 个  
**已完成**: ~60 个 (100%) ✅  
**进行中**: 0 个  
**待开始**: 0 个

**Day 1 进度**: ✅ 100% 完成  
**Day 2 进度**: ✅ 100% 完成

---

## 优先级标记

- 🔴 P0 - 必须完成
- 🟡 P1 - 核心功能
- 🟢 P2 - 体验优化

### P0 任务
- [ ] 🔴 历史记录页面基础布局
- [ ] 🔴 记录列表显示
- [ ] 🔴 分页加载功能
- [ ] 🔴 删除功能
- [ ] 🔴 logs store 创建

### P1 任务
- [ ] 🟡 编辑功能
- [ ] 🟡 筛选功能
- [ ] 🟡 日期分组
- [ ] 🟡 下拉刷新
- [ ] 🟡 log-item 组件

### P2 任务
- [ ] 🟢 骨架屏
- [ ] 🟢 空状态
- [ ] 🟢 加载动画
- [ ] 🟢 虚拟列表
- [ ] 🟢 错误处理优化

---

## 开发建议

1. **Day 2 开发顺序**
   ```
   创建页面 → 数据层 → 组件 → 功能 → 优化
   ```

2. **最小可用版本**
   - 先实现基础列表显示
   - 再添加删除功能
   - 最后优化体验

3. **并行开发**
   - log-item 组件可独立开发
   - logs store 可先完成
   - 页面布局和组件同步进行

4. **测试策略**
   - 边开发边测试
   - 功能完成后集成测试
   - 最后进行性能测试

---

**更新时间**: 2025-01-25  
**下次更新**: 完成 Day 2 开发后