基于JAVA+SpringBoot+Vue的在线考试与学习交流网页平台

课题背景

二十一世纪互联网的出现，改变了几千年以来人们的生活，不仅仅是生活物资的丰富，还有精神层次的丰富。时代进步的标志，就是让人们过上更好的生活。在互联网诞生之前，地域位置往往是人们思想上不可跨域的鸿沟，信息的传播速度极慢，信息处理的速度和要求还是通过人们骑马或者是信鸽传递，这些信息传递都是不可控制的，中间很有可能丢失，信息的传递水平决定了人们生活的水平。现如今，大家都在用互联网来实现自己的目的，从内部管理设置计算机管理，提高内部信息管理水平，从外部市场也可以用计算机获取相关数据进行处理，如今各行各业已经严重依赖于计算机了。

本课题研究和开发在线考试与学习交流网页平台，让安装在计算机上的该系统变成管理人员的小帮手，提高考试信息与学习交流信息处理速度，规范考试信息与学习交流信息处理流程，让管理人员的产出效益更高。

课题意义

传统处理数据，必须是一张张纸，然后处理完毕又是统计在一张张纸上面，不断的重复处理，最终有个结果给最高层作为参考，这个模式在互联网没有出现之前，是一种常见的事情，信息管理的效率提不上去，那就用人才，人多力量大，是一个以前人们的常识。计算机的诞生就是发现了人多力量大的不足，比如高端计算人才的培养已经跟不上使用了，所以人们研究出专门帮助人们计算的机器，就是计算机的前身，到了互联网时代，人们发现完全可以让程序供应商提供解决方案，自己挑选自己合适的方案来提高自己的产出比。于是市面上就出现了各种各样的依靠程序处理信息的解决方案。

本课题研发的在线考试与学习交流网页平台，就是提供考试信息与学习交流信息处理的解决方案，它可以短时间处理完信息，并且只需要使用者动动鼠标和键盘就能获取自己需要的信息，并且这些信息都有专门的存储设备，而且数据的备份和迁移都可以设定为无人值守，从人力角度和信息处理角度以及信息安全角度，在线考试与学习交流网页平台是完胜传统纸质操作的，所以在线考试与学习交流网页平台就是如此的值得信赖。

系统流程

在线考试与学习交流网页平台投入使用后，其各个功能的内部操作逻辑需要使用者通过流程图来进行了解。

操作流程

使用者在操作在线考试与学习交流网页平台中，应该按照本系统提供的操作流程（图3.1即为本系统的操作流程图）进行操作，这样可以减少使用者操作中出现的错误，从而节省进入在线考试与学习交流网页平台的时间。

图3.1 系统操作流程

登录流程

在线考试与学习交流网页平台通过登录功能（图3.2即为其登录的流程）引导使用者进入指定的功能操作区，也避免非本系统的用户享受本系统提供的服务以及查看本系统提供的信息，从而保障本系统用户的安全使用。

图3.2 登录流程

删除信息流程

在线考试与学习交流网页平台在经过长期使用后，会产生很多的数据信息。为了腾出存储空间存放更多的数据，本系统数据库中存储的数据，一些没有参考价值的数据需要进行删除（图3.3即为删除信息的流程），删除数据过程中，为避免误删，使用者要根据系统的提示来决定是否删除数据。

图3.3 删除信息流程

添加信息流程

在线考试与学习交流网页平台提供可视化的功能操作区，非常方便使用者进行数据操作，当使用者往系统中录入数据时（图3.4即为添加信息的流程），本系统也会进行数据合法性的判断，符合要求的数据才能够在数据库指定表中进行登记。

图3.4 添加信息流程

功能需求

在线考试与学习交流网页平台根据使用权限的角度进行功能分析，并运用用例图来展示各个权限需要操作的功能。

图3.5即为管理员用例图，管理员权限操作的功能包括对注册用户信息的管理，对试题，试卷，考试记录，错题本以及学习视频等信息的管理。

图3.5 管理员用例图

图3.6即为用户用例图，用户权限操作的功能包括选择试卷进行在线考试，查看考试记录和错题本，查看学习视频，查看论坛帖子。

图3.6 用户用例图

系统的设计一切都是为了用户的使用，虽然用户使用过程中可能只是面对着浏览器进行各种操作，但是不代表着系统对于用户在浏览器上的操作不进行处理，所以说，设计一个系统需要考虑到方方面面。

功能结构设计

图4.1即为设计的管理员功能结构，管理员权限操作的功能包括对注册用户信息的管理，对试题，试卷，考试记录，错题本以及学习视频等信息的管理。

图4.1 管理员功能结构

图4.2即为设计的用户功能结构，用户权限操作的功能包括选择试卷进行在线考试，查看考试记录和错题本，查看学习视频，查看论坛帖子。

图4.2 用户功能结构

数据库设计

在线考试与学习交流网页平台运行中产生的数据需要按照提前设置的存储规则进行保存，而这个存储规则则是在数据库的设计中进行设置的。通常情况下，为了更好的配合系统运行，也要给用户带来良好的使用体验，设计一个很好的数据库是必须的，因为它能减少用户的等待时间，还可以对系统的请求在最短时间内进行响应。所以，对数据库设计时，需要花费一定的时间来分析系统对于数据存储的要求以及存储的具体数据，然后设计具体的存储规则，保证数据库能够对系统的各种数据请求进行及时回应，缩短数据处理时间，并在一定程度上降低数据冗余，节省存储空间。

数据库概念设计

实体-联系图还有一个名称即E-R图，是Entity Relationship Diagram各英文单词首字母的缩写，它这种概念模型通常用于对现实世界进行描述。同时它还是一种能够直观表达数据中实体，联系，属性的有效手段。绘制E-R图能够选择的工具也有很多，但是Office Visio 这款软件在E-R图的绘制上一般都是作为首选工具，因为它是基于可视化处理，使用它创建E-R图非常简单。使用基本的E-R图构成元素，比如椭圆，菱形，矩形，还有实线段来表达对应的信息，椭圆代表属性，即实体的特征，矩形代表实体，即数据库中的一个具体数据表，菱形代表实体中相互关系，实线段主要是完成椭圆，矩形，菱形的连接，基于这样的方式即可完成对本系统的E-R图进行完整绘制。

（1）图4.4即为学习视频这个实体所拥有的属性值。

图4.4 学习视频实体属性图

（2）图4.5即为用户这个实体所拥有的属性值。

图4.5 用户实体属性图

（3）图4.6即为试卷这个实体所拥有的属性值。

图4.6 试卷实体属性图

（4）图4.7即为试题这个实体所拥有的属性值。

图4.7 试题实体属性图

（5）图4.8即为上面介绍的实体中存在的联系。

图4.8 实体间关系E-R图

数据库物理设计

本小节主要任务即是根据上述内容进行数据存储结构的设计，也就是在数据库中设计存放本系统的数据的数据表，设计数据表时，需要对各个字段进行确定，通常来说，一个实体与一张数据表相对应，实体的属性就用来表示字段名称，不同的字段表示的数据类型以及取值都不相同，这里需要根据系统实际数据的情况进行设置，同时也需要在具体表中确定该表的主键，以及该表各个字段是否能够保持空等进行说明，设计完成一张数据表的结构之后，在保存时同样要命名，尽量选择英文名称进行命名并保存，方便今后系统对数据表进行数据存储访问时，在提高数据存储效率的同时，还不容易导致系统出错。接下来就对设计的数据表进行展示。

表4.1 试卷表

字段

注释

类型

空

id (主键)

主键

int(20)

否

exampaper_name

试卷名称

varchar(200)

否

exampaper_date

考试时长(分钟)

int(11)

否

exampaper_myscore

试卷总分数

int(20)

否

exampaper_types

试卷状态

int(11)

否

exampaper_delete

逻辑删除（0代表未删除 1代表已删除）

int(255)

是

create_time

创建时间

timestamp

否

表4.2 试题表

字段

注释

类型

空

id (主键)

主键

int(20)

否

exampaper_id

所属试卷id（外键）

int(20)

否

examquestion_name

试题名称

varchar(200)

否

examquestion_options

选项，json字符串

longtext

是

examquestion_score

分值

int(20)

是

examquestion_answer

正确答案

varchar(200)

是

examquestion_analysis

答案解析

longtext

是

examquestion_types

试题类型

int(20)

是

examquestion_sequence

试题排序，值越大排越前面

int(20)

是

create_time

创建时间

timestamp

否

表4.3 考试记录表

字段

注释

类型

空

id (主键)

主键

int(20)

否

examrecord_uuid_number

考试编号

varchar(200)

是

yonghu_id

考试用户

int(20)

否

exampaper_id

所属试卷id（外键）

int(20)

否

total_score

所得总分

int(200)

是

insert_time

考试时间

timestamp

否

create_time

创建时间

timestamp

否

表4.4 答题详情表

字段

注释

类型

空

id (主键)

主键

int(20)

否

examredetails_uuid_number

试卷编号

varchar(200)

是

yonghu_id

用户id

int(20)

否

examquestion_id

试题id（外键）

int(20)

否

examredetails_myanswer

考生答案

varchar(200)

是

examredetails_myscore

试题得分

int(20)

否

create_time

创建时间

timestamp

否

表4.5 错题表

字段

注释

类型

空

id (主键)

主键

int(20)

否

yonghu_id

用户id

int(20)

否

exampaper_id

试卷（外键）

int(20)

否

examquestion_id

试题id（外键）

int(20)

否

examredetails_myanswer

考生作答

varchar(200)

是

insert_time

记录时间

timestamp

否

create_time

创建时间

timestamp

否

表4.6 论坛表

字段

注释

类型

空

id (主键)

主键

int(11)

否

forum_name

帖子标题

varchar(200)

是

yonghu_id

用户

int(11)

是

jiaoshi_id

教师

int(11)

是

users_id

管理员

int(11)

是

forum_content

发布内容

text

是

super_ids

父id

int(11)

是

forum_types

帖子类型

int(11)

是

forum_state_types

帖子状态

int(11)

是

insert_time

发帖时间

timestamp

是

update_time

修改时间

timestamp

是

create_time

创建时间

timestamp

是

表4.7 公告信息表

字段

注释

类型

空

id (主键)

主键

int(11)

否

news_name

公告信息标题

varchar(200)

是

news_types

公告信息类型

int(11)

是

news_photo

公告信息图片

varchar(200)

是

insert_time

公告信息时间

timestamp

是

news_content

公告信息详情

text

是

news_delete

假删

int(11)

是

create_time

创建时间

timestamp

是

表4.8 管理员表

字段

注释

类型

空

id (主键)

主键

bigint(20)

否

username

用户名

varchar(100)

否

password

密码

varchar(100)

否

role

角色

varchar(100)

是

addtime

新增时间

timestamp

否

表4.9 学习视频表

字段

注释

类型

空

id (主键)

主键

int(11)

否

xuexishipin_name

课程标题

varchar(200)

是

xuexishipin_photo

封面

varchar(200)

是

xuexishipin_video

视频

varchar(200)

是

xuexishipin_jiangshi

讲师

varchar(200)

是

xuexishipin_types

学习类型

int(11)

是

xuexishipin_content

详情

text

是

create_time

创建时间

timestamp

是

表4.10 学习视频留言表

字段

注释

类型

空

id (主键)

主键

int(11)

否

xuexishipin_id

学习视频

int(11)

是

yonghu_id

用户

int(11)

是

xuexishipin_liuyan_text

留言内容

text

是

reply_text

回复内容

text

是

insert_time

留言时间

timestamp

是

update_time

回复时间

timestamp

是

create_time

创建时间

timestamp

是

表4.11 用户表

字段

注释

类型

空

id (主键)

主键

int(11)

否

username

账户

varchar(200)

是

password

密码

varchar(200)

是

yonghu_name

用户姓名

varchar(200)

是

yonghu_photo

头像

varchar(255)

是

yonghu_phone

用户手机号

varchar(200)

是

yonghu_id_number

用户身份证号

varchar(200)

是

yonghu_email

邮箱

varchar(200)

是

sex_types

性别

int(11)

是

yonghu_delete

假删

int(11)

是

create_time

创建时间

timestamp

是

管理员功能实现

学习视频管理

图5.1 即为编码实现的学习视频管理界面，管理员在该界面中发布学习视频，对学习视频的相关内容进行修改，比如学习视频封面，讲师，学习类型等信息的更改，可以删除学习视频。

图5.1 学习视频管理界面

试卷管理

图5.2 即为编码实现的试卷管理界面，管理员在该界面中新增试卷，对本界面显示的试卷信息进行修改或删除，在搜索框中编辑试卷名称可以查询试卷信息。

图5.2 试卷管理界面

试题管理

图5.3 即为编码实现的试题管理界面，管理员在该界面中主要就是增加，修改，查询，删除试题信息。

图5.3 试题管理界面

考试记录

图5.4 即为编码实现的考试记录界面，管理员在该界面中对用户考试的记录信息进行查看，包括查看用户考试所得总分，用户考试的详情信息等。

图5.4 考试记录界面

用户管理

图5.5 即为编码实现的用户管理界面，管理员在该界面中负责为用户重置密码，更改用户的基础信息，查询用户，删除用户等。

图5.5 用户管理界面

用户功能实现

试卷表

图5.6 即为编码实现的试卷表界面，用户在该界面中选择试卷并参与在线考试。

图5.6 试卷表界面

学习视频

图5.7 即为编码实现的学习视频界面，用户在该界面中播放学习视频进行知识的学习，用户在视频下方可以查看留言，发布留言，查看留言回复信息等。

图5.7 学习视频界面

错题表

图5.8 即为编码实现的错题表界面，用户在该界面中查看错题信息，包括试卷名称，考生作答，试题类型，分值等信息。

图5.8 错题表界面

论坛信息

图5.9 即为编码实现的论坛信息界面，用户在该界面中可以查看论坛区域的所有帖子，用户在该区域也能发布帖子，每个帖子查看之后，用户可以发布帖子评论等。

图5.9 论坛信息界面