待办事项Web应用生成器

任务目标

• 本 Skill 用于:快速生成完整的待办事项列表Web应用
• 能力包含:一键生成包含CRUD功能的待办事项应用、响应式界面设计、本地数据持久化、命令行数据管理工具
• 触发条件:用户要求"创建待办事项应用"、"生成任务管理工具"、"需要能保存数据的todo list"等

前置准备

• 依赖说明:本Skill的脚本使用Python标准库，无需额外安装依赖
• 无需创建额外文件或文件夹

操作步骤

• 标准流程:
  1. 应用生成:调用 scripts/generate_todo_app.py 生成完整的Web应用代码
     • 支持自定义应用标题和配色方案
     • 生成包含HTML、CSS、JavaScript的完整代码
     • 支持任务优先级、截止日期、完成状态等字段
  2. 数据管理:使用 scripts/todo_manager.py 进行批量数据操作
     • 从JSON文件导入/导出待办事项
     • 批量添加、删除、更新任务
     • 生成任务统计报告
  3. 应用部署:直接在浏览器中打开生成的HTML文件即可使用
  4. 功能扩展:根据 references/feature_guide.md 添加高级功能
• 可选分支:
  • 当需要数据备份:调用 todo_manager.py 导出数据为JSON文件
  • 当需要批量导入:准备符合 references/data_format.md 格式的JSON文件，使用 todo_manager.py 导入
  • 当需要自定义样式:修改生成的CSS部分，参考 assets/templates/ 中的模板

资源索引

• 必要脚本:
  • scripts/generate_todo_app.py(生成完整的待办事项Web应用代码，支持自定义配置)
  • scripts/todo_manager.py(命令行工具，用于批量管理待办事项数据)
• 领域参考:
  • references/data_format.md(数据格式规范和示例，用于导入/导出)
  • references/feature_guide.md(功能扩展指导，包含高级功能实现方案)
• 输出资产:
  • assets/templates/(HTML/CSS/JS代码模板和样式参考)

注意事项

• 生成的Web应用使用LocalStorage存储数据，数据保存在浏览器本地
• 清除浏览器缓存会导致数据丢失，建议定期使用 todo_manager.py 备份数据
• 应用支持响应式设计，适配手机、平板、桌面等设备
• 所有JavaScript代码为纯原生实现，无需依赖第三方库

使用示例

• 示例1:生成基础待办事项应用

  python scripts/generate_todo_app.py --title "我的任务清单" --color "#3498db"
  

  生成名为 my-todo-app.html 的完整应用文件

• 示例2:管理现有数据

  # 导出数据
  python scripts/todo_manager.py --export backup.json
  
  # 查看任务统计
  python scripts/todo_manager.py --stats
  

• 示例3:批量导入任务

  # 先创建符合格式的JSON文件，参考 references/data_format.md
  python scripts/todo_manager.py --import tasks.json