考试系统中的数据统计模块(基于若依框架)

1.需要实现的功能

可供参考的网站:

https://exam.yfhl.net/#/admin/dashboard(数据统计)  

https://www.mindskip.net:7001/teacher/#/analyze/paper/list

2.任务分析(需求分析)

1. 子模块数据统计(菜单)分为俩个子页面:成绩管理和考试统计。在成绩管理中,可以查看学生成绩,添加学生线下考试成绩,同时记录在考试统计和考试管理中。在考试统计中, 可以查看学生考试人数和考试通过率。
2. 先要根据项目功能用 axure 设计原型,再根据原型编写前端页面。
3. 页面成绩管理,需要查看学生成绩,所以要有一个表格,展现从后端传来的数据库中 score 数据表的数据,此数据表包含了学生的简单信息与科目成绩,则需要有序号、学号、姓名、 性别、考试类型、科目、是否参加考试、成绩以及三个备用字段。一个搜索框,可以对表格数据进行条件筛选。一个修改成绩按钮,位于表格中,可以修改学生的成绩。一个新增按钮, 可以新增一条数据插入到表格中,即新增一个学生的一门科目考试成绩。一个删除按钮,可以删除一条或多条表格中选择的数据,即删除一个或多个学生的一门或多门科目考试成绩。 一个导出按钮,可以导出表格的所有数据到本地,文件格式为 excel
考试系统中的数据统计模块(基于若依框架)_第1张图片

4.页面考试统计,需要查看学生考试人数和考试通过率,也要有一个表格,展现从后端传来的数据库中statistic数据表的数据,此数据表包含了各个科目的学生考试人数和考试通过率,则需要有序号、考试科目、考试类型、考试人数、考试通过率以及最高分字段。一个搜索框,可以对表格数据进行条件筛选。一个图表按钮,可以根据表格数据,进行数据可视化,用图表来展示数据,便于统计分析学生的各科成绩。一个导出按钮,可以导出表格的所有数据到本地,文件格式为excel。考试系统中的数据统计模块(基于若依框架)_第2张图片 5.前后端的交互接口设计,要能实现前后端数据的交互,使前端能接收来自后端的数据,后端的数据也能根据前端的功能要求进行修改。 

3.任务实现

考试系统中的数据统计模块(基于若依框架)_第3张图片

考试系统中的数据统计模块(基于若依框架)_第4张图片

考试系统中的数据统计模块(基于若依框架)_第5张图片

4.使用说明 (成果展示)

考试系统中的数据统计模块(基于若依框架)_第6张图片

表格,可以条理展示学生的各科成绩,数据来源于后端的score数据表。

搜索框,可以条件选择学号、姓名、考试类型、科目、是否参加考试和成绩对表格的数据进行筛选,点击搜索按钮,相应数据就可以显示在表格上,重置按钮将重置所有搜索条件,score数据表中所有数据都会显示在表格上。

新增按钮,可以新增到一条记录在表格数据的最后一条记录后,同时在后端的数据库的score中也相应增加一条记录。

删除按钮,可以删除选中的一条或多条数据,同时在后端的数据库的score也相应的删除一条数据。

导出按钮,将导出现在的表格的数据到本地,文件格式为excel。

表格上的操作字段下的修改成绩按钮,可以修改该行学生的科目成绩,同时修改后端数据表中的对应成绩。

 考试系统中的数据统计模块(基于若依框架)_第7张图片

搜索框,可以条件选择学号、姓名、考试类型、科目、是否参加考试和成绩对表格的数据进行筛选,点击搜索按钮,相应数据就可以显示在表格上,重置按钮将重置所有搜索条件,statistic数据表中所有数据都会显示在表格上。

考试系统中的数据统计模块(基于若依框架)_第8张图片

图表按钮,可以转到另一个页面成绩数据,展现一张图表,该图表的数据来源于考试统计页面中的所有表格数据。

导出按钮,将导出现在的表格的数据到本地,文件格式为excel。 

你可能感兴趣的:(java,vue.js,node.js,前端)