Skip to content

Survivor0102/weapp_test

Repository files navigation

待办清单小程序 📝

一个功能完善的微信小程序待办事项管理应用,支持番茄钟专注、分类管理、优先级设置等功能。

✨ 最近更新

v1.1.0 (2026-03-25)

  • 🍅 新增番茄钟功能 - 工作/短休息/长休息三种模式
  • 🔗 关联待办 - 番茄钟可关联具体待办事项
  • 📊 专注统计 - 记录今日完成番茄钟数量
  • ⏱️ 专注时长 - 待办事项显示累计专注时间
  • 🎨 优化编辑体验 - 显示已选择的分类和优先级(带颜色标识)
  • 📜 虚拟滚动组件 - 支持长列表性能优化(待启用)

📁 项目结构

todo-miniprogram/
├── pages/                   # 页面目录
│   ├── index/               # 首页 - 待办列表
│   ├── add/                 # 新增/编辑页
│   ├── category/            # 分类管理页
│   └── pomodoro/            # 番茄钟页 ⭐ 新增
│
├── components/              # 公共组件
│   ├── todo-item/           # 待办项组件
│   ├── filter-bar/          # 筛选栏组件
│   ├── empty-state/         # 空状态组件
│   └── virtual-list/        # 虚拟滚动组件 ⭐ 新增
│
├── utils/                   # 工具函数
│   ├── storage.js           # 本地存储封装
│   ├── util.js              # 通用工具
│   └── date.js              # 日期处理
│
└── styles/                  # 样式变量
    └── variables.wxss       # CSS 变量定义

🚀 功能特性

核心功能

  • ✅ 待办事项增删改查
  • ✅ 完成/取消完成切换
  • ✅ 分类管理(支持自定义分类和颜色)
  • ✅ 优先级设置(高/中/低)
  • ✅ 截止时间设置
  • ✅ 多维度筛选(全部/未完成/已完成/分类)

番茄钟功能 🍅

  • ⏱️ 25 分钟工作模式
  • ☕ 5 分钟短休息
  • 🌴 15 分钟长休息
  • 🔗 关联待办事项
  • 📊 今日专注统计
  • 📈 累计专注时长记录
  • 📳 完成震动提醒

交互体验

  • 🎨 简洁现代的 UI 设计
  • 📱 流畅的动画过渡
  • 🔄 下拉刷新
  • 💾 本地数据持久化
  • 🎯 左滑删除操作
  • 🏷️ 分类和优先级可视化

🛠️ 技术亮点

1. 编辑体验优化

  • 选择分类后显示带颜色标识的标签
  • 选择优先级后显示对应颜色标签
  • 编辑模式自动加载已有数据
  • 表单字段默认值正确显示

2. 虚拟滚动组件

// 自动检测列表长度,超过阈值启用虚拟滚动
<virtual-list 
  items="{{todos}}" 
  item-height="160"
  buffer-size="5"
  threshold="20"
/>

3. 番茄钟实现

  • 使用 setInterval 精确计时
  • 支持暂停/继续/重置
  • 自动切换工作/休息模式
  • 数据持久化保存

📖 快速开始

1. 导入项目

  1. 打开微信开发者工具
  2. 选择「导入项目」
  3. 选择项目目录
  4. 填写 AppID(测试可选「测试号」)
  5. 点击「导入」

2. 运行项目

  • 点击「编译」按钮
  • 在模拟器或真机上预览

🎨 样式定制

所有样式变量定义在 styles/variables.wxss 中:

page {
  --primary-color: #3498db;      /* 主题色 */
  --success-color: #2ecc71;      /* 成功色 */
  --danger-color: #e74c3c;       /* 危险色 */
  --bg-color: #f5f6fa;           /* 背景色 */
  /* ... 更多变量 */
}

💾 数据存储

本地存储键值

  • todos - 待办事项数组
  • categories - 分类数组
  • pomodoro_history - 番茄钟完成记录 ⭐ 新增

待办数据结构

{
  id: 'id_1711353600000_abc123',
  title: '完成项目报告',
  completed: false,
  categoryId: 'cat_001',
  priority: 'high',
  dueDate: 1711353600000,
  focusTime: 50,  // 累计专注分钟数 ⭐ 新增
  createdAt: 1711267200000,
  updatedAt: 1711267200000
}

📦 扩展建议

待实现功能

  • 待办事项搜索
  • 子任务支持
  • 重复待办
  • 提醒通知
  • 数据导出/导入
  • 云同步
  • 统计图表
  • 虚拟滚动实际集成到首页

性能优化

  • 长列表虚拟滚动启用
  • 图片懒加载
  • 分包加载
  • 骨架屏

📝 开发规范

代码风格

  • 使用 ES6+ 语法
  • 组件化开发
  • 样式使用 CSS 变量
  • 注释清晰完整

提交规范

feat: 新功能
fix: 修复 bug
docs: 文档更新
style: 样式调整
refactor: 重构代码
test: 测试相关
chore: 构建/工具链

📄 License

MIT License


开发者: Survivor0102
最后更新: 2026-03-25

About

a test for ai project

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors