专业做足球体彩网站,qifeiye做的网站如何,做销售平台哪个网站好,网站的美观性基于SpringBootvue的在线考试系统-以计算机网络为例#xff0c;可自行录入题库 一、项目简介二、开发环境三、项目技术四、功能结构五、运行截图六、功能实现七、数据库设计八、源码获取 一、项目简介
随着信息技术的迅猛发展#xff0c;教育行业正面临着巨大的变革和挑战。… 基于SpringBootvue的在线考试系统-以计算机网络为例可自行录入题库 一、项目简介二、开发环境三、项目技术四、功能结构五、运行截图六、功能实现七、数据库设计八、源码获取 一、项目简介
随着信息技术的迅猛发展教育行业正面临着巨大的变革和挑战。为了适应当下时代的需求我们开发了一款现代化的在线考试系统旨在提供高效、便捷、安全的考试环境为学生和教师带来更好的考试体验和教学管理。
我们的在线考试系统采用了先进的技术架构其中后端采用了Spring Boot前端则采用Vue2和ElementUI。同时作为数据库我们选择了MySQL以保障数据的可靠性和稳定性。
该系统提供了全面的功能模块涵盖学生管理、教师管理、题库管理、考试管理、留言、在线考试和成绩统计等方面。学生管理模块包含学生信息的录入、查询和修改功能教师管理模块提供了教师信息信息添加、删除功能题库管理模块允许教师对题目进行增加于查看考试管理模块支持考试计划创建、考试计划修改以及删除等操作留言功能方便学生和教师之间的交流而在线考试模块则为学生提供了在线答题和交卷的便捷方式并且提供自动判分。成绩统计模块则帮助教师对学生的考试成绩进行全面统计和分析为教学提供有效参考。
二、开发环境
开发环境版本/工具基础环境Jdk1.8、node.js14开发工具IntelliJ IDEA、WebStorm操作系统Windows 10内存要求8GB 以上浏览器Firefox (推荐)、Google Chrome (推荐)、Edge数据库MySQL 8.0 (推荐)数据库工具Navicat Premium 15 (推荐)项目框架后端SpringBoot、前端ElementUi
三、项目技术
后端SpringBoot、MybatisPlus、MySQL
前端Vue2、ElementUi、vue-router、vuex、JavaScript
四、功能结构
学生管理功能 学生管理模块允许学生进行个人信息的修改和添加保证学生信息的及时更新。学生登录功能为学生提供了便捷的访问入口让他们可以方便地查看考试计划、参加在线考试并随时查询个人的考试成绩。
教师管理功能 教师管理模块为教师提供了个人信息的管理功能教师可以随时修改和添加自己的信息。通过教师登录功能教师可以查看自己负责的考试和班级进行考试的修改和删除等操作实现对教学事务的全面管理。
题库管理功能 题库管理模块为教师提供了方便快捷的试卷题库添加功能支持多种题型的题目录入。教师可以查看已有的题库便于组卷时参考。同时试卷在线组卷功能可以根据需要自动生成试卷减轻了教师的工作负担。
考试管理功能 考试管理模块支持考试计划的添加、修改和删除教师可以根据学习进度和课程需要进行灵活安排。考试的修改功能也让教师在出现变动时能够及时调整考试安排保证教学进度的顺利进行。
成绩查询功能 成绩查询功能允许学生方便地查询自己的考试成绩而且考试分段成绩统计功能可以为教师提供更全面的学生成绩分析辅助教学改进和个性化辅导。
在线考试客户端 在线考试客户端为学生提供了便捷的在线考试体验。学生可以在客户端查看考试计划准时参加在线答题考试并通过自动判分功能快速获取考试成 绩。客户端还支持留言功能学生可以向教师提问或反馈问题促进师生间的有效沟通。
五、运行截图
考试计划查看 在线考试
提交考试
考试成绩查看 留言板
登录页面
考试管理
题库管理
教师管理
学生管理
留言
考试成绩统计
六、功能实现
前端获取当前考试信息 getExamData() { //获取当前试卷所有信息let date new Date()this.startTime this.getTime(date)let examCode this.$route.query.examCode //获取路由传递过来的试卷编号this.$axios(/api/exam/${examCode}).then(res { //通过examCode请求试卷详细信息this.examData { ...res.data.data} //获取考试详情this.index 0this.time this.examData.totalScore //获取分钟数let paperId this.examData.paperIdthis.$axios(/api/paper/${paperId}).then(res { //通过paperId获取试题题目信息this.topic {...res.data}let reduceAnswer this.topic[1][this.index]this.reduceAnswer reduceAnswerlet keys Object.keys(this.topic) //对象转数组keys.forEach(e {let data this.topic[e]this.topicCount.push(data.length)let currentScore 0for(let i 0; i data.length; i) { //循环每种题型,计算出总分currentScore data[i].score}this.score.push(currentScore) //把每种题型总分存入score})let len this.topicCount[1]let father []for(let i 0; i len; i) { //根据填空题数量创建二维空数组存放每道题答案let children [null,null,null,null]father.push(children)}this.fillAnswer fatherlet dataInit this.topic[1]this.number 1this.showQuestion dataInit[0].questionthis.showAnswer dataInit[0]})})}自动判分方法核心代码 commit() { //答案提交计算分数/* 计算选择题总分 */let topic1Answer this.topic1Answerlet finalScore 0topic1Answer.forEach((element,index) { //循环每道选择题根据选项计算分数let right nullif(element ! null) {switch(element) { //选项1,2,3,4 转换为 A,B,C,Dcase 1:right Abreakcase 2:right Bbreakcase 3:right Cbreakcase 4:right D}if(right this.topic[1][index].rightAnswer) { // 当前选项与正确答案对比finalScore this.topic[1][index].score // 计算总分数}console.log(right,this.topic[1][index].rightAnswer)}// console.log(topic1Answer)})/**计算判断题总分 */// console.log(this.fillAnswer${this.fillAnswer})// console.log(this.topic[2][this.index])let fillAnswer this.fillAnswerfillAnswer.forEach((element,index) { //此处index和 this.index数据不一致注意element.forEach((inner) {if(this.topic[2][index].answer.includes(inner)) { //判断填空答案是否与数据库一致console.log(正确)finalScore this.topic[2][this.index].score}})});/** 计算判断题总分 */let topic3Answer this.judgeAnswertopic3Answer.forEach((element,index) {let right nullswitch(element) {case 1:right Tbreakcase 2:right F}if(right this.topic[3][index].answer) { // 当前选项与正确答案对比finalScore this.topic[3][index].score // 计算总分数}})if(this.time ! 0) {this.$confirm(考试结束时间未到,是否提前交卷,友情提示,{confirmButtonText: 立即交卷,cancelButtonText: 再检查一下,type: warning}).then(() {console.log(交卷)let date new Date()this.endTime this.getTime(date)let answerDate this.endTime.substr(0,10)//提交成绩信息this.$axios({url: /api/score,method: post,data: {examCode: this.examData.examCode, //考试编号studentId: this.userInfo.id, //学号subject: this.examData.source, //课程名称etScore: finalScore, //答题成绩answerDate: answerDate, //答题日期}}).then(res {if(res.data.code 200) {this.$router.push({path:/studentScore,query: {score: finalScore,startTime: this.startTime,endTime: this.endTime}})}})}).catch(() {console.log(继续答题)})}},后端获取考试信息接口 GetMapping(/exam/{examCode})public ApiResult findById(PathVariable(examCode) Integer examCode){System.out.println(根据ID查找);ExamManage res examManageService.findById(examCode);if(res null) {return ApiResultHandler.buildApiResult(10000,考试编号不存在,null);}return ApiResultHandler.buildApiResult(200,请求成功,res);}后端获取试题接口 GetMapping(/paper/{paperId})public MapInteger, List? findById(PathVariable(paperId) Integer paperId) {ListMultiQuestion multiQuestionRes multiQuestionService.findByIdAndType(paperId); //选择题题库 1ListFillQuestion fillQuestionsRes fillQuestionService.findByIdAndType(paperId); //填空题题库 2ListJudgeQuestion judgeQuestionRes judgeQuestionService.findByIdAndType(paperId); //判断题题库 3MapInteger, List? map new HashMap();map.put(1,multiQuestionRes);map.put(2,fillQuestionsRes);map.put(3,judgeQuestionRes);return map;}七、数据库设计
表名admin
字段名称数据类型是否必填注释adminIdint(11)是ID号adminNamevarchar(20)否姓名sexvarchar(2)否性别telvarchar(11)否电话号码emailvarchar(20)否电子邮箱pwdvarchar(16)否密码cardIdvarchar(18)否身份证号rolevarchar(1)否角色(0管理员1教师2学生)
表名exam_manage
字段名称数据类型是否必填注释examCodeint(11)是考试编号descriptionvarchar(50)否该次考试介绍sourcevarchar(20)否课程名称paperIdint(11)否试卷编号examDatevarchar(10)否考试日期totalTimeint(11)否持续时长gradevarchar(10)否年级termvarchar(10)否学期majorvarchar(20)否专业institutevarchar(20)否学院totalScoreint(11)否总分typevarchar(255)否考试类型tipsvarchar(255)否考生须知
表名fill_question
字段名称数据类型是否必填注释questionIdint(11)是试题编号subjectvarchar(20)否考试科目questionvarchar(255)否试题内容answervarchar(255)否正确答案analysisvarchar(255)否题目解析scoreint(11)否分数levelvarchar(5)否难度等级sectionvarchar(20)否所属章节
表名judge_question
字段名称数据类型是否必填注释questionIdint(11)是试题编号subjectvarchar(20)否考试科目questionvarchar(255)否试题内容answervarchar(255)否正确答案analysisvarchar(255)否题目解析scoreint(11)否分数levelvarchar(1)否难度等级sectionvarchar(20)否所属章节
表名message
字段名称数据类型是否必填注释idint(11)是留言编号titlevarchar(20)否标题contentvarchar(255)否留言内容timedate否留言时间
八、源码获取
源码、安装教程文档、项目简介文档以及其它相关文档已经上传到是云猿实战官网可以通过下面官网进行获取项目
