在线课堂微信小程序

一、技术路线：

开发语言：Java

使用框架：spring boot

前端技术：JavaScript、VUE.js（2.X）、css3

数据库：MySQL 5.7

数据库管理工具：Navicat或sqlyog

开发工具：IDEA或Ecplise

二、项目介绍：

https://www.bilibili.com/video/BV1XG411R7yA?t=14.9

三、运行截图：

3.1用户前台功能实现

注册用户通过注册窗口，进行在线填写用户账号、用户姓名、性别、年龄、头像、用户手机等，信息编辑完成后核对信息无误后进行选择注册，系统核对用户所输入的账号信息是否准确，核对信息准确无误后系统进入到操作界面。如图3-1所示。

图3-1注册用户界面图

用户登录通过填写账号、密码进行登录，进入到在线课堂微信小程序主界面，如图3-2所示。

图3-2用户登录界面图

用户首页页面可以查看首页、课程信息、公告栏、我的等信息，进行相对应的操作，如图3-3所示。

图3-3首页功能界面图

用户进入课程信息页面可以查看课程名称、课程分类、课程图片、任课老师、课程价格、预览视频、课程介绍等信息，进行课程订阅、点我收藏操作，如图3-4所示。

图3-4课程信息界面图

用户进入公告栏页面可以查看公告标题、公告类型、封面图片、发布日期、发布人、内容等信息，进行提交操作，如图3-3-所示。

图3-5公告栏界面图

用户进入我的页面可以查看课程信息、课程订阅、课程视频、我的收藏管理、在线客服、留言板等信息，进行相对应的操作，如图3-6-所示。

图3-6我的页面界面图

用户进入用户信息页面可以填写用户账号、密码、用户姓名、性别、年龄、头像、用户手机等信息，进行保存、退出登录操作，如图3-7-所示。

图3-7用户信息界面图

用户进入课程订阅页面可以填写订阅编号、课程名称、课程分类、课程图片、任课老师、课程价格、用户账号、用户姓名、用户手机等信息，进行提交操作，如图3-8-所示。

图3-8课程订阅界面图

3.2 管理员后台功能实现

管理员通过在线课堂微信小程序进行确认，管理员进入到在线课堂微信小程序主界面，管理员进入到操作界面，通过登录窗口进行在线填写用户名和密码、角色进行登录，登录成功后进入到系统操作界面进行相应信息的获取，如图3-9所示。

图3-9管理员登录界面图

管理员进入到界面，通过界面的任务大厅，登录成功后进入到系统可以进行查看首页、个人中心、用户管理、课程分类管理、课程信息管理、课程订阅管理、课程视频管理、公告栏管理、留言板管理、系统管理等功能模块，进行相对应操作，如图3-10所示。

图3-10管理员功能界面图

管理员进入到用户管理页面可以查看用户账号、用户姓名、性别、年龄、头像、用户手机等信息，进行详情、修改、删除操作，如图3-11示。

图3-11用户管理界面图

管理员进入到课程分类管理页面可以查看课程分类等信息，进行详情、修改、删除操作，如图3-12所示。

图3-12课程分类管理界面图

管理员进入到课程信息管理界面可以查看课程名称、课程分类、课程图片、任课老师、课程价格、预览视频等信息，进行详情、修改、删除操作，如图3-13所示。

图3-13课程信息管理界面图

管理员进入到课程订阅管理页面可以查看订阅编号、课程名称、课程分类、课程图片、任课老师、课程价格、用户账号、用户姓名、用户手机、是否支付、审核回复、审核状态、审核等信息，进行详情、推送视频、修改、删除操作，如图3-14所示。

图3-14课程订阅管理界面图

管理员进入到课程视频管理页面可以查看订阅编号、课程名称、课程分类、课程图片、任课老师、课程视频、发布时间、用户账号、用户姓名等信息，进行详情、修改、删除操作，如图3-15所示。

图3-15课程视频管理界面图

管理员进入公告栏管理页面可以查看公告标题、公告类型、封面图片、发布日期、发布人等信息，进行详情、修改、查看评论、删除操作，如图3-16所示。

图3-16公告栏管理界面图

管理员进入留言板管理页面可以查看用户名、留言内容、回复内容等信息，进行详情、修改、回复、删除操作，如图3-17所示。

图3-17留言板管理界面图

轮播图；该页面为轮播图管理界面。管理员可以在此页面进行首页轮播图的管理，通过新建操作可在轮播图中加入新的图片，还可以对以上传的图片进行修改操作，以及图片的删除操作，如图3-18所示。

图3-18轮播图界面图