基于JAVA+SpringBoot+Vue的健康评测系统

选题动因

到现在为止，互联网已经进入了千家万户，最普通的平民百姓也有属于自己的智能设备，计算机各种技术的储备也是相当的丰富，并且实现也是没有难度，各行各业，包括一些个人，也积极拥抱互联网时代的到来，也可以说是互联网时代的到来把人们都给包在互联网之中。从刚开始的政府办公，国家企业的开头使用，到如今的老百姓都能用上，别说那些普通企业了。计算机就是有这样的魅力，互联网被称为浪潮不是浪得虚名的。采用计算机技术，开发一些软件，实现软件所在的目的，这是一个常理，这个基础的常理缩短了地域之间的联系，提高了地域竞争水准，减低了人力成本和数据存储成本。本课题研究的疫情打卡健康评测系统，也是采用了计算机技术，该系统能够提高疫情打卡健康评测信息数据的检索速度，使用起来非常的方便。

目的和意义

在疫情打卡健康评测系统实际操作中，使用者会发现使用起来相当的方便，并且对数据的管理者来讲，也能及时的获得自己想要的数据，对整个数据的所有者能提供强大的帮助，疫情打卡健康评测系统从操作者的角度出发，不管是在数据的接收以及传递，以及处理结果，都有一个很明显的要求，对有效数据的处理，并且形成集合，并且对有效数据集合进行固定化处理，可以得到更有效的数据，有了疫情打卡健康评测系统，让管理层不至于把大量的人力和财力资源消耗在数据处理整合方面，完全可以让不知疲倦的计算机来进行，不仅投入减低，并且产出也不少。互联网时代就是如此，顺之者昌，响应互联网时代，不至于说可以乘风破浪，起码可以降低直接淘汰出局的几率。疫情打卡健康评测系统的出现是顺应时代的。

系统流程分析

操作逻辑是一个可以用画图工具展示的，因为数据在录入过程中的不可见，只能看到返回结果，所以把流程画成图可以更好的理解其中的顺序。

在系统的各项操作中，其他的录入环节，会对操作者具体操作的每条信息都会提出验证要求，比如不能为空，只能是汉字，以及其他的要求等，这些都在前端需要编写清楚，达到友好提示的目的，有效的帮助操作人员理解操作。具体数据的流程如下面的图所示。当操作员输入信息后，点击提交后台就会接收操作员提交的信息，并且提前编写好的逻辑会继续验证，如果数据合格就存入到数据库里并且返回成功提示，这样一个录入环节就达到了设计要求。

图3.1 添加信息流程图

有时候录入的一些数据可能需要修改，修改就是纠正之前的操作，所以修改数据必须是先把想要修改的数据从数据库里获取出来，然后在这个之上进行修改，修改数据也有相应的操作流程。

图3.2 修改信息流程图

数据的查询是在任何程序上都是一个常规的操作，面对的数据量不一样，想要获取想要的数据时间也不一样，都是尽快的获取自己想要的结果，所以数据查询就需要有个查询条件作为查询关键词，这样可以更好的获取符合关键词的数据。

图3.3 查询信息流程图

系统功能分析

当设计人员通过参考各种文献以及其他类似项目的调研后，就会对项目具体的功能进行分析，这样有的放矢可以更快的设计程序的功能。

疫情打卡健康评测系统的操作者有管理员，分析的管理员功能将使用用例图进行展示。图3.4展示了管理员用例图。管理员审核学生返校申请信息，管理学生居家，学生打卡，学生留言，试卷，试题以及学生考试信息等。

图3.4 管理员用例图

疫情打卡健康评测系统的操作者有学生，分析的学生的功能将使用用例图进行展示。图3.5展示了学生用例图。学生选择试卷进行考试，查看考试得分信息，添加学生返校申请信息，添加并管理打卡和居家信息。

图3.5 学生用例图

在系统设计环境，业务的处理逻辑和数据的设计逻辑虽然是重中之重，但是这些都是用户看不见摸不着的，用户也只是能看到部署好的项目运行起来的结果，所以用户对界面布局以及界面功能比较看重。所以说，如今只要是开发网站不仅仅是需要懂一点页面设计就行，也需要懂得UI设计的人群。传统的网页设计其实就是换几个颜色，放几张图片，然后来充实操作页面，让操作页面不至于太单调，但是互联网发展至今，开发也越来越精细化，用户越来越挑剔，还用凑合方式来进行程序开发，已经是属于落后的状态了。

布局设计原则

布局不是传统的把页面分分类，输入和显示页面，调整调整间距这些笼统的说法了，布局设计也是有一定的原则的。

首先，布局一定要清晰合理。布局的清晰不是说图片清晰或者文字清晰，而是说用户在使用过程中，看到导航的布局，就能明白所有功能模块都可以在导航里寻找，打开一个页面，就能知道重要与不重要的资料，必须与不必须的填写，甚至是输入的格式是什么规格，都可以让用户使用的时候一目了然。因为界面是有限的，所以说布局是相当重要的一点设计原则。

其次，布局的体现要符合大众审美，比如说导航，尽量都是网页的上方或者左侧。如果把导航放到网页下方或者右方，这些代码都是可以实现，但是不符合正常人的思维定向。现代人的读写习惯都是从上而下，从左到右的阅读方式，人们身体和心灵已经习惯了这种方式，如果布局到其他方向首先用户会感到新颖，但是却不会买账，因为操作几遍后就会不习惯。

最后，布局也要考虑这个软件是用来做什么的，常用这个软件的人员的年龄划分，性别划分，以及职业划分。划分了使用人群，就可以对背景进行调色填充，如果是长时间用电脑的人群尽量设计的有护眼功能，不至于看一会眼睛就受不了，尽量要区分长时间使用和短时间使用的背景，这一点很重要。

综上所述，系统设计需要考虑方方面面，布局设计也是需要精细化考虑，系统设计需要考虑太多，但是实现却不能弄得操作上太复杂，系统设计尽量的要满足用户需要，提高用户满意度。

功能结构设计

在基于系统功能分析的基础之上，开始对系统的详细功能进行设计，最终将使用结构图的形式对设计的结果进行展示。

管理员具备的详细功能将参照最终的设计结果，即图4.1所示的管理员功能结构图。其中管理员审核学生返校申请信息，管理学生居家，学生打卡，学生留言，试卷，试题以及学生考试信息等。

图4.1 管理员功能结构图

学生具备的详细功能将参照最终的设计结果，即图4.2所示的学生功能结构图。其中学生选择试卷进行考试，查看考试得分信息，添加学生返校申请信息，添加并管理打卡和居家信息。

图4.2 学生功能结构图

数据库设计

数据库的选用方面肯定要选一个市场反应比较好，性价比比较高的数据库，不能凭空想象数据库，要结合程序设计的需求来选择对应的数据库。目前来讲，市面上常用的关系型数据库足够达到需求。

数据库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(11)

否

yonghu_id

学生

int(11)

是

daka_photo

打卡照片

varchar(200)

是

daka_content

打卡备注

text

是

insert_time

打卡日期

date

是

create_time

创建时间

timestamp

是

表4.2 试卷表

字段

注释

类型

空

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.3 试题表

字段

注释

类型

空

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.4 考试记录表

字段

注释

类型

空

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.5 答题详情表

字段

注释

类型

空

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.6 错题表

字段

注释

类型

空

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.7 学生返校申请表

字段

注释

类型

空

id (主键)

主键

int(11)

否

yonghu_id

学生

int(11)

是

fanxiaoshenqing_uuid_number

申请编号

varchar(200)

是

insert_time

申请时间

timestamp

是

fanxiaoshenqing_time

申请返校日期

date

是

jiankangma_photo

健康码

varchar(200)

是

xingchengma_photo

行程码

varchar(200)

是

hesuanbaogao_photo

核酸报告

varchar(200)

是

fanxiaoshenqing_content

申请理由

text

是

fanxiaoshenqing_yesno_types

审核状态

int(11)

是

fanxiaoshenqing_yesno_text

审核意见

text

是

update_time

审核时间

timestamp

是

create_time

创建时间

timestamp

是

表4.8 留言板表

字段

注释

类型

空

id (主键)

主键

int(11)

否

yonghu_id

学生

int(11)

是

liuyan_name

留言标题

varchar(200)

是

liuyan_text

留言内容

text

是

insert_time

留言时间

timestamp

是

reply_text

回复内容

text

是

update_time

回复时间

timestamp

是

create_time

创建时间

timestamp

是

表4.9 资讯信息表

字段

注释

类型

空

id (主键)

主键

int(11)

否

news_name

资讯名称

varchar(200)

是

news_photo

资讯图片

varchar(200)

是

news_types

资讯类型

int(11)

否

insert_time

资讯发布时间

timestamp

是

news_content

资讯详情

text

是

create_time

创建时间

timestamp

是

表4.10 管理员表

字段

注释

类型

空

id (主键)

主键

bigint(20)

否

username

用户名

varchar(100)

否

password

密码

varchar(100)

否

role

角色

varchar(100)

是

addtime

新增时间

timestamp

否

表4.11 居家表

字段

注释

类型

空

id (主键)

主键

int(11)

否

yonghu_id

学生

int(11)

是

xueshengjujia_zhuangtai_types

居家状态

int(11)

是

jujia_time

居家日期

date

是

xueshengjujia_address

居家位置

varchar(200)

是

xueshengjujia_content

居家备注

text

是

create_time

创建时间

timestamp

是

表4.12 学生表

字段

注释

类型

空

id (主键)

主键

int(11)

否

username

账户

varchar(200)

是

password

密码

varchar(200)

是

yonghu_name

学生姓名

varchar(200)

是

yonghu_phone

学生手机号

varchar(200)

是

yonghu_id_number

学生身份证号

varchar(200)

是

yonghu_photo

学生头像

varchar(200)

是

sex_types

性别

int(11)

是

yonghu_email

电子邮箱

varchar(200)

是

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 居家管理界面

学生返校申请管理

实现学生返校申请管理功能，其界面运行的效果图见图5.10。在该界面，学生登记健康码，行程码，核酸检测报告等信息，查看管理员对学生返校申请的审核情况。

图5.10 学生返校申请管理界面