xiaoli/peixue-dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
main
peixue-dev/peidu/docs/fixes/2026-01-23-我的课程与学习记录关联/README.md

5.6 KiB
Raw Permalink Blame History

我的课程与学习记录关联 - 完整实施文档

📚 文档导航

  1. 📋 问题分析与解决方案

    • 现状分析
    • 存在的问题
    • 解决方案设计
    • 预期效果

  2. ✅ 后端代码实现

    • 数据库表设计
    • 实体类和Mapper
    • Service层实现
    • Controller接口
    • 积分奖励逻辑

  3. ✅ 前端代码实现

    • API接口定义
    • 我的课程页面改造
    • 课程学习页面
    • 学习进度组件

  4. 🧪 测试指南

    • 测试前准备
    • 7个完整测试用例
    • 调试技巧
    • 常见问题解决

🎯 功能概述

将家长学院的"我的课程"功能与学习记录系统关联,实现:

核心功能

  • ✅ 学习进度追踪 - 实时记录学习位置和进度
  • ✅ 断点续播 - 从上次学习位置继续
  • ✅ 自动保存 - 每30秒自动保存进度
  • ✅ 学习笔记 - 支持记录学习心得
  • ✅ 积分奖励 - 完成学习自动发放积分
  • ✅ 进度可视化 - 进度条和百分比显示

积分奖励规则

  • 完成课程: +50积分
  • 学习笔记(>20字): +10积分
  • 必修课程额外: +150积分
  • 最高可获得: +210积分

📊 数据表设计

course_learning_record 表

CREATE TABLE `course_learning_record` (
  `id` bigint NOT NULL AUTO_INCREMENT,
  `tenant_id` bigint DEFAULT NULL,
  `user_id` bigint NOT NULL,
  `course_id` bigint NOT NULL,
  `purchase_id` bigint NOT NULL,
  `learning_duration` int DEFAULT 0,
  `learning_progress` int DEFAULT 0,
  `last_position` int DEFAULT 0,
  `is_completed` tinyint DEFAULT 0,
  `completed_time` datetime DEFAULT NULL,
  `points_awarded` int DEFAULT 0,
  `notes` text,
  `rating` int DEFAULT NULL,
  `review` text,
  `certificate_url` varchar(500) DEFAULT NULL,
  `create_time` datetime DEFAULT CURRENT_TIMESTAMP,
  `update_time` datetime DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
  `deleted` tinyint DEFAULT 0,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

🔄 业务流程

1. 家长购买课程
   ↓
2. 点击"我的课程"中的课程
   ↓
3. 进入课程学习页面
   ↓
4. 开始播放视频
   ↓
5. 每30秒自动保存进度
   ↓
6. 学习进度达到90%以上
   ↓
7. 填写学习笔记(可选)
   ↓
8. 点击"完成学习"
   ↓
9. 自动发放积分奖励
   ↓
10. 返回"我的课程"显示完成状态

📁 文件清单

后端文件

peidu/backend/src/main/java/com/peidu/
├── entity/
│   └── CourseLearningRecord.java          # 实体类
├── mapper/
│   └── CourseLearningRecordMapper.java    # Mapper接口
├── service/
│   ├── ICourseLearningRecordService.java  # Service接口
│   └── impl/
│       └── CourseLearningRecordServiceImpl.java  # Service实现
└── controller/
    └── ParentAcademyCourseController.java # 控制器(需修改)

前端文件

peidu/uniapp/src/
├── api/
│   └── parentAcademy.js                   # API接口(需修改)
└── user-package/pages/course/
    ├── my-courses.vue                     # 我的课程(需修改)
    └── player.vue                         # 课程学习页面(新建)

数据库文件

peidu/sql/
└── create_course_learning_record_table.sql  # 建表SQL

🚀 实施步骤

第一步: 创建数据库表

mysql -u root -p peidu < peidu/sql/create_course_learning_record_table.sql

第二步: 添加后端代码

  1. 复制 CourseLearningRecord.java 到 entity 目录
  2. 复制 CourseLearningRecordMapper.java 到 mapper 目录
  3. 复制 ICourseLearningRecordService.java 到 service 目录
  4. 复制 CourseLearningRecordServiceImpl.java 到 service/impl 目录
  5. 在 ParentAcademyCourseController.java 中添加新接口

第三步: 添加前端代码

  1. 在 parentAcademy.js 中添加API接口
  2. 修改 my-courses.vue 页面
  3. 创建 player.vue 学习页面

第四步: 编译和部署

# 后端编译
cd peidu/backend
mvn clean compile

# 前端编译
cd peidu/uniapp
npm run build:mp-weixin

# 重启服务

第五步: 测试验证

按照 🧪测试指南 进行完整测试

⚠️ 注意事项

1. 性能优化

  • 学习进度更新采用防抖策略(30秒一次)
  • 避免频繁的数据库写入
  • 考虑使用Redis缓存学习状态

2. 数据一致性

  • 购买记录与学习记录保持同步
  • 积分奖励防止重复发放
  • 使用事务确保数据完整性

3. 用户体验

  • 学习进度自动保存,无需手动操作
  • 网络异常时本地缓存进度
  • 完成课程时给予明确反馈

4. 扩展性

  • 预留课程评价字段
  • 预留学习证书字段
  • 支持未来的学习路径功能

📈 预期效果

用户体验提升

  • ✅ 学习进度可视化
  • ✅ 断点续播功能
  • ✅ 学习激励(积分奖励)
  • ✅ 学习历史记录

数据价值

  • ✅ 课程完成率统计
  • ✅ 用户学习行为分析
  • ✅ 课程质量评估依据
  • ✅ 个性化推荐基础

商业价值

  • ✅ 提高课程完成率
  • ✅ 增强用户粘性
  • ✅ 促进课程复购
  • ✅ 提升用户满意度

🆘 技术支持

如遇到问题,请参考:

  1. 🧪测试指南 中的"常见问题"章节
  2. 查看后端日志: peidu/backend/logs/
  3. 查看前端控制台日志

📝 更新日志

2026-01-23

  • ✅ 完成需求分析和方案设计
  • ✅ 完成数据库表设计
  • ✅ 完成后端代码实现
  • ✅ 完成前端代码实现
  • ✅ 完成测试指南编写