Files
diary-system/FRONTEND_CHECKLIST.md

2.8 KiB
Raw Blame History

前端修改检查清单

⚠️ 每次修改前端代码前必须阅读,修改后必须逐项验证


📋 修改前准备

  • 已查看 FEATURES.md 了解所有已实现功能
  • 已查看当前 index.html 的完整代码
  • 已创建 git 备份分支:git branch backup-$(date +%Y%m%d-%H%M)
  • 已在功能分支开发:git checkout -b feature/xxx

修改后验证清单

核心功能P0 - 必须全部通过)

1. 日历组件 最重要

  • 日历正常显示当前月份
  • 星期标题显示(日一二三四五六)
  • 今天的日期高亮显示
  • 有日记的日期显示 📝 图标
  • 点击日期能显示当天日记(最关键!)
  • 无日记的日期显示友好提示
  • 上月按钮正常工作
  • 下月按钮正常工作
  • 非当月日期灰色显示

测试方法

# 1. 打开页面 http://cssc.datalibstar.com:8001/
# 2. 检查日历是否正常显示
# 3. 点击今天的日期,查看日记详情
# 4. 点击有日记的其他日期
# 5. 点击没有日记的日期
# 6. 切换上月/下月

2. 统计面板

  • 总日记数显示正确
  • 总任务数显示正确
  • 进行中任务数显示正确
  • 已完成任务数显示正确
  • 完成率显示正确
  • 经验总结数显示正确

测试方法

curl http://cssc.datalibstar.com:8001/api/entries/stats/
curl http://cssc.datalibstar.com:8001/api/experiences/recent/

3. Tab 切换

  • 工作任务 Tab 正常切换
  • 日记 Tab 正常切换
  • 经验总结 Tab 正常切换
  • 切换后内容正确显示

测试方法

# 1. 打开页面
# 2. 依次点击每个 Tab
# 3. 检查内容是否正确切换

4. 日记列表

  • 日记列表正常显示
  • 每条日记显示日期
  • 日记内容完整显示(完成任务、学到的东西等)

5. 经验总结列表

  • 经验总结正常显示
  • 分类标签显示正确
  • 问题/解决方案格式正确
  • 经验教训高亮显示

🚨 禁止操作

  • 直接覆盖 index.html 而不查看原有内容
  • 删除任何 <script> 中的函数而不确认是否使用
  • 修改 API 调用 URL 而不检查后端是否存在
  • 删除 CSS 样式而不确认是否影响布局
  • 修改后不验证就部署

📝 验证记录

修改日期: ___________
修改人: ___________
修改内容: ___________

验证结果:

  • 日历组件验证通过
  • 统计面板验证通过
  • Tab 切换验证通过
  • 日记列表验证通过
  • 经验总结验证通过

发现问题: ___________
修复情况: ___________

验证人签字: ___________


此清单必须打印出来,每次修改前端时逐项勾选并签字确认