ssm基于在线开放课程的Web前端+vue

5 系统实现

一、技术路线：

开发语言：Java

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

数据库：MySQL 5.7

数据库管理工具：Navicat或sqlyog

开发工具：IDEA或Ecplise

二、项目介绍：

https://www.bilibili.com/video/BV1Fw411X79F/

三、运行截图：

下面主要是通过功能实现界面截图的形式，并且运用文字来描述功能实现界面的内容。

3.1 管理员功能实现

3.1.1 教师管理

该功能主要用于实现对教师基本信息的管理，教师管理界面的运行效果见图3.1。在此界面，管理员添加或修改教师的姓名，性别，联系方式等信息，可以对指定教师的账户重置密码。

图3.1 教师管理界面

3.1.2 教学资源管理

该功能主要用于实现对教学资源基本信息的管理，教学资源管理界面的运行效果见图3.2。在此界面，教学资源的课件和教学资源的视频需要管理员上传，同时还需要管理员登记资源标题，资源类型等信息，以及修改教学资源的信息。

图3.2 教学资源管理界面

3.1.3 论坛管理

该功能主要用于实现对论坛帖子基本信息的管理，论坛管理界面的运行效果见图3.3。在此界面，管理员可以查看论坛帖子的标题和论坛帖子的内容，可以删除传播不良信息的论坛帖子，可以通过论坛回复功能及时跟踪论坛回帖信息以及及时删除传播不良信息的回帖数据。

图3.3 论坛管理界面

3.1.4 回答管理

回答管理界面的运行效果见图3.4。在此界面，管理员下载学生的回答文件，并对未批改的回答信息进行批改，已经批改的回答信息可以删除。

图3.4 回答管理界面

3.1.5 作业管理

该功能主要用于实现对作业基本信息的管理，作业管理界面的运行效果见图3.5。在此界面，管理员上传作业文件，登记作业信息，发现有错误数据的作业信息可以及时修改，以及删除早期布置的已经失效的作业信息。

图3.5 作业管理界面

3.2 教师功能实现

3.2.1 试卷管理

该功能主要用于实现对试卷基本信息的管理，试卷管理界面的运行效果见图3.6。在此界面，教师为试卷的总分数以及考试时长数据进行设置，同时可以设置试卷状态为启用状态或者是设置试卷状态为禁用状态，教师删除试卷可以直接通过删除功能执行即可。

图3.6 试卷管理界面

3.2.2 试题管理

试题管理界面的运行效果见图3.7。在此界面，教师对各种类型的试题进行管理，试题信息包括正确答案，答案解析，分值，试题类型等信息，教师对每种试题信息都可以进行修改，查询，删除等。

图3.7 试题管理界面

3.2.3 学生成绩

学生成绩界面的运行效果见图3.8。在此界面，教师对学生的学科成绩进行增加，已经存在的学生成绩信息也能通过修改功能及时更正登记错误的数据。

图3.8 学生成绩界面

3.2.4 考试管理

考试管理界面的运行效果见图3.9。在此界面，教师主要是查看学生对试卷进行答题之后的成绩信息，以及对学生的试卷答题记录信息进行查看。

图3.9 考试管理界面

3.3 学生功能实现

3.3.1 试卷表

试卷表界面的运行效果见图3.10。在此界面，学生查看试卷说明信息，学生对试卷答题需要点击试卷信息右侧的考试按钮，进入考试界面才可以答题。

图3.10 试卷表界面

3.3.2 教学资源

教学资源界面的运行效果见图3.11。在此界面，学生通过查看教学资源视频的方式进行学习，或者是对教学资源界面显示的教学资源文件进行下载。

图3.11 教学资源界面

3.3.3 在线论坛

在线论坛界面的运行效果见图3.12。在此界面，学生主要是针对具体的话题进行讨论，讨论方式主要是发布帖子，以及对查看的帖子进行评论的方式进行。

图3.12 在线论坛界面

3.3.4 错题本

错题本界面的运行效果见图3.13。在此界面，学生主要是查看已完成交卷的试卷的回答错误的题目信息，学生通过错题本可以了解自己回答错误的题目以及查看该题目的正确答案和解析信息。

图3.13 错题本界面

3.3.5 回答管理

回答管理界面的运行效果见图3.14。学生对作业查看之后，学生对作业回答的内容就以文件的形式在回答管理界面进行上传，已经上传的回答信息，会让管理员进行批改。

图3.14 回答管理界面