温馨提示本人主页置顶文章(点我)开头有 CSDN 平台官方提供的学长联系名片一、项目背景与意义随着企业规模扩大和业务迭代加速员工能力培养逐渐从“线下集中授课”转向“线上化、常态化、可量化”的培训体系。传统培训方式普遍存在课程资料分散、学习进度难以追踪、考试组织成本高、成绩统计依赖人工等问题导致培训效果无法形成闭环。本文介绍一套基于Spring Boot Vue3的企业员工培训考试管理系统覆盖课程管理、在线学习、题库维护、在线考试、自动阅卷、成绩分析与权限控制等核心能力帮助企业以较低成本搭建属于自己的培训平台。二、系统总体架构系统采用前后端分离架构后端负责业务逻辑与数据持久化前端负责交互与页面渲染二者通过 RESTful API 通信。flowchart TD A[浏览器 / Vue3 前端] --|HTTP JSON| B[Spring Boot 应用] B -- C[Controller 层] C -- D[Service 层] D -- E[MyBatis-Plus / Mapper] E -- F[(MySQL 数据库)] D -- G[Redis 缓存与 Token] B -- H[文件存储 课程视频与附件] B -- I[定时任务 考试状态流转]层次技术选型职责说明前端Vue3 Vite Element Plus Pinia Axios页面渲染、路由控制、状态管理、接口调用后端Spring Boot 3 Spring Security MyBatis-Plus业务逻辑、鉴权、数据访问数据库MySQL 8用户、课程、题库、考试、成绩等数据存储缓存Redis登录 Token、验证码、热点数据缓存文件存储本地磁盘 / MinIO课程视频、课件、头像等文件三、功能模块设计3.1 角色与权限系统划分为三类角色通过 RBAC 模型进行权限控制管理员管理用户、部门、课程、题库、考试安排查看全局统计报表。讲师维护自己负责的课程与题库发布考试查看所辖学员成绩。员工学员浏览课程、在线学习、参加考试、查看个人成绩与学习记录。3.2 课程与学习管理课程模块支持章节化组织每个课程由若干章节组成章节下可挂载视频、文档、图文等多种学习材料。系统记录学员的学习时长、完成进度与最后学习位置支持断点续学。课程分类与标签管理便于按岗位、技能维度检索。学习进度按章节粒度统计自动计算课程完成率。支持课程评价与学习笔记形成学习反馈闭环。3.3 题库与考试管理题库支持单选、多选、判断、填空、简答等题型题目可绑定知识点与难度等级。考试模块支持固定组卷与随机抽题两种方式并可配置考试时长、及格线、允许考试次数等参数。flowchart LR A[创建考试] -- B[选择组卷方式] B -- C[固定组卷 手动选题] B -- D[随机抽题 按规则抽取] C -- E[发布考试] D -- E E -- F[员工在线作答] F -- G[提交试卷] G -- H[客观题自动阅卷] H -- I[主观题人工评分] I -- J[生成成绩与统计]3.4 成绩与统计分析系统提供多维度统计能力包括个人成绩趋势、部门平均分对比、题目正确率分析、知识点掌握度分析等帮助管理者定位培训薄弱环节。四、数据库核心表设计以下列出系统中最核心的几张表其余表如课程章节、学习记录、考试作答明细等按同样思路扩展。-- 用户表 CREATE TABLE sys_user ( id BIGINT PRIMARY KEY AUTO_INCREMENT, username VARCHAR(50) NOT NULL UNIQUE COMMENT 登录账号, password VARCHAR(100) NOT NULL COMMENT 加密后的密码, real_name VARCHAR(50) NOT NULL COMMENT 真实姓名, dept_id BIGINT COMMENT 所属部门, role_code VARCHAR(20) NOT NULL COMMENT ADMIN/TEACHER/EMPLOYEE, status TINYINT DEFAULT 1 COMMENT 1启用 0禁用, create_time DATETIME DEFAULT CURRENT_TIMESTAMP ) COMMENT 用户表; -- 课程表 CREATE TABLE course ( id BIGINT PRIMARY KEY AUTO_INCREMENT, title VARCHAR(100) NOT NULL COMMENT 课程名称, category_id BIGINT COMMENT 课程分类, teacher_id BIGINT COMMENT 讲师ID, cover_url VARCHAR(255) COMMENT 封面图, description TEXT COMMENT 课程简介, status TINYINT DEFAULT 0 COMMENT 0草稿 1已发布, create_time DATETIME DEFAULT CURRENT_TIMESTAMP ) COMMENT 课程表; -- 题目表 CREATE TABLE question ( id BIGINT PRIMARY KEY AUTO_INCREMENT, course_id BIGINT COMMENT 所属课程, type TINYINT NOT NULL COMMENT 1单选 2多选 3判断 4填空 5简答, content TEXT NOT NULL COMMENT 题干, options JSON COMMENT 选项内容, answer VARCHAR(255) NOT NULL COMMENT 标准答案, score INT DEFAULT 5 COMMENT 分值, difficulty TINYINT DEFAULT 1 COMMENT 1易 2中 3难 ) COMMENT 题目表; -- 考试表 CREATE TABLE exam ( id BIGINT PRIMARY KEY AUTO_INCREMENT, title VARCHAR(100) NOT NULL COMMENT 考试名称, course_id BIGINT COMMENT 关联课程, start_time DATETIME NOT NULL COMMENT 开始时间, end_time DATETIME NOT NULL COMMENT 结束时间, duration INT NOT NULL COMMENT 考试时长(分钟), pass_score INT DEFAULT 60 COMMENT 及格分, max_attempt INT DEFAULT 1 COMMENT 允许考试次数, status TINYINT DEFAULT 0 COMMENT 0未发布 1进行中 2已结束 ) COMMENT 考试表; -- 成绩表 CREATE TABLE exam_record ( id BIGINT PRIMARY KEY AUTO_INCREMENT, exam_id BIGINT NOT NULL, user_id BIGINT NOT NULL, score DECIMAL(5,1) COMMENT 总得分, submit_time DATETIME COMMENT 交卷时间, status TINYINT DEFAULT 0 COMMENT 0进行中 1已交卷 2已批阅, UNIQUE KEY uk_exam_user (exam_id, user_id) ) COMMENT 考试成绩表;五、后端关键实现5.1 项目结构与依赖后端采用标准分层结构依赖管理使用 Maven。dependencies dependency groupIdorg.springframework.boot/groupId artifactIdspring-boot-starter-web/artifactId /dependency dependency groupIdorg.springframework.boot/groupId artifactIdspring-boot-starter-security/artifactId /dependency dependency groupIdcom.baomidou/groupId artifactIdmybatis-plus-spring-boot3-starter/artifactId version3.5.5/version /dependency dependency groupIdcom.mysql/groupId artifactIdmysql-connector-j/artifactId scoperuntime/scope /dependency /dependencies5.2 统一响应与全局异常处理public record ResultT(int code, String message, T data) { public static T ResultT ok(T data) { return new Result(200, success, data); } public static T ResultT fail(String message) { return new Result(500, message, null); } } RestControllerAdvice public class GlobalExceptionHandler { ExceptionHandler(BusinessException.class) public ResultVoid handleBusiness(BusinessException e) { return Result.fail(e.getMessage()); } ExceptionHandler(Exception.class) public ResultVoid handleOther(Exception e) { log.error(系统异常, e); return Result.fail(系统繁忙请稍后重试); } }5.3 考试提交与自动阅卷学员交卷后系统对客观题即时判分主观题标记为待人工批阅。核心逻辑如下Service RequiredArgsConstructor public class ExamSubmitService { private final QuestionMapper questionMapper; private final ExamRecordMapper recordMapper; private final AnswerDetailMapper detailMapper; Transactional(rollbackFor Exception.class) public ExamResult submit(Long examId, Long userId, ListAnswerDTO answers) { ListQuestion questions questionMapper.selectByExamId(examId); MapLong, Question questionMap questions.stream() .collect(Collectors.toMap(Question::getId, q - q)); BigDecimal total BigDecimal.ZERO; boolean needManual false; for (AnswerDTO answer : answers) { Question question questionMap.get(answer.getQuestionId()); if (question null) { continue; } boolean objective question.getType() 3; boolean correct objective isCorrect(question, answer.getContent()); BigDecimal score correct ? BigDecimal.valueOf(question.getScore()) : BigDecimal.ZERO; if (!objective) { needManual true; } total total.add(score); detailMapper.insert(buildDetail(answer, question, score, correct)); } ExamRecord record new ExamRecord(); record.setExamId(examId); record.setUserId(userId); record.setScore(total); record.setSubmitTime(LocalDateTime.now()); record.setStatus(needManual ? 1 : 2); recordMapper.insert(record); return new ExamResult(total, needManual); } private boolean isCorrect(Question question, String userAnswer) { if (userAnswer null) { return false; } String standard question.getAnswer().trim(); String actual userAnswer.trim(); return question.getType() 2 ? sortChars(standard).equals(sortChars(actual)) : standard.equalsIgnoreCase(actual); } private String sortChars(String value) { char[] chars value.replace(,, ).toCharArray(); Arrays.sort(chars); return new String(chars); } }5.4 基于 JWT 的登录鉴权Component RequiredArgsConstructor public class JwtAuthFilter extends OncePerRequestFilter { private final JwtUtil jwtUtil; private final UserDetailsService userDetailsService; Override protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, FilterChain chain) throws ServletException, IOException { String header request.getHeader(Authorization); if (header ! null header.startsWith(Bearer )) { String token header.substring(7); if (jwtUtil.validate(token)) { String username jwtUtil.getUsername(token); UserDetails user userDetailsService.loadUserByUsername(username); UsernamePasswordAuthenticationToken auth new UsernamePasswordAuthenticationToken( user, null, user.getAuthorities()); SecurityContextHolder.getContext().setAuthentication(auth); } } chain.doFilter(request, response); } }六、前端关键实现6.1 请求封装与 Token 注入import axios from axios import { ElMessage } from element-plus import { useUserStore } from /stores/user const request axios.create({ baseURL: import.meta.env.VITE_API_BASE_URL, timeout: 15000 }) request.interceptors.request.use(config { const userStore useUserStore() if (userStore.token) { config.headers.Authorization Bearer ${userStore.token} } return config }) request.interceptors.response.use( response { const { code, message, data } response.data if (code 200) { return data } ElMessage.error(message || 请求失败) return Promise.reject(new Error(message)) }, error { if (error.response?.status 401) { useUserStore().logout() window.location.href /login } ElMessage.error(error.message) return Promise.reject(error) } ) export default request6.2 考试倒计时与自动交卷template div classexam-header span剩余时间{{ formatTime(remainSeconds) }}/span el-button typeprimary clickhandleSubmit交卷/el-button /div /template script setup import { ref, onMounted, onBeforeUnmount } from vue import { submitExam } from /api/exam const props defineProps({ examId: { type: Number, required: true }, duration: { type: Number, required: true } }) const remainSeconds ref(props.duration * 60) let timer null const formatTime seconds { const m String(Math.floor(seconds / 60)).padStart(2, 0) const s String(seconds % 60).padStart(2, 0) return ${m}:${s} } const handleSubmit async () { clearInterval(timer) await submitExam(props.examId, answers.value) ElMessage.success(交卷成功) } onMounted(() { timer setInterval(() { remainSeconds.value-- if (remainSeconds.value 0) { handleSubmit() } }, 1000) }) onBeforeUnmount(() clearInterval(timer)) /script6.3 路由与权限控制import { createRouter, createWebHistory } from vue-router import { useUserStore } from /stores/user const routes [ { path: /login, component: () import(/views/Login.vue) }, { path: /, component: () import(/layout/Index.vue), children: [ { path: course, component: () import(/views/course/List.vue), meta: { roles: [ADMIN, TEACHER, EMPLOYEE] } }, { path: exam, component: () import(/views/exam/List.vue), meta: { roles: [ADMIN, TEACHER, EMPLOYEE] } }, { path: question, component: () import(/views/question/List.vue), meta: { roles: [ADMIN, TEACHER] } }, { path: statistics, component: () import(/views/statistics/Index.vue), meta: { roles: [ADMIN] } } ] } ] const router createRouter({ history: createWebHistory(), routes }) router.beforeEach((to, from, next) { const userStore useUserStore() if (to.path /login) { return next() } if (!userStore.token) { return next(/login) } const roles to.meta.roles if (roles !roles.includes(userStore.role)) { return next(/403) } next() }) export default router七、部署与运行准备 MySQL 8 与 Redis执行建表脚本并初始化管理员账号。后端修改application.yml中的数据源、Redis 与 JWT 密钥配置执行mvn clean package打包。前端修改.env.production中的接口地址执行npm run build生成静态资源。使用 Nginx 托管前端静态资源并将/api反向代理到后端服务。通过 Docker Compose 一键编排 MySQL、Redis、后端与 Nginx便于测试环境快速搭建。八、总结与展望本文从架构设计、功能模块、数据库建模到前后端关键代码完整梳理了一套基于 Spring Boot Vue3 的企业员工培训考试管理系统实现思路。系统通过课程学习与在线考试两条主线配合自动阅卷与统计分析帮助企业把培训过程沉淀为可追踪、可量化的数据资产。后续可在此基础上继续扩展接入大模型实现智能出题与主观题辅助评分、引入消息中心推送学习提醒、结合移动端小程序提升学习便捷性以及通过数据看板实现培训 ROI 的可视化分析。 
长河君 · 2026/10/29 18:12:08 · 阅读 1.2k 基于 Spring Boot + Vue3 的企业员工培训考试管理系统设计与实现
温馨提示本人主页置顶文章(点我)开头有 CSDN 平台官方提供的学长联系名片一、项目背景与意义随着企业规模扩大和业务迭代加速员工能力培养逐渐从“线下集中授课”转向“线上化、常态化、可量化”的培训体系。传统培训方式普遍存在课程资料分散、学习进度难以追踪、考试组织成本高、成绩统计依赖人工等问题导致培训效果无法形成闭环。本文介绍一套基于Spring Boot Vue3的企业员工培训考试管理系统覆盖课程管理、在线学习、题库维护、在线考试、自动阅卷、成绩分析与权限控制等核心能力帮助企业以较低成本搭建属于自己的培训平台。二、系统总体架构系统采用前后端分离架构后端负责业务逻辑与数据持久化前端负责交互与页面渲染二者通过 RESTful API 通信。flowchart TD A[浏览器 / Vue3 前端] --|HTTP JSON| B[Spring Boot 应用] B -- C[Controller 层] C -- D[Service 层] D -- E[MyBatis-Plus / Mapper] E -- F[(MySQL 数据库)] D -- G[Redis 缓存与 Token] B -- H[文件存储 课程视频与附件] B -- I[定时任务 考试状态流转]层次技术选型职责说明前端Vue3 Vite Element Plus Pinia Axios页面渲染、路由控制、状态管理、接口调用后端Spring Boot 3 Spring Security MyBatis-Plus业务逻辑、鉴权、数据访问数据库MySQL 8用户、课程、题库、考试、成绩等数据存储缓存Redis登录 Token、验证码、热点数据缓存文件存储本地磁盘 / MinIO课程视频、课件、头像等文件三、功能模块设计3.1 角色与权限系统划分为三类角色通过 RBAC 模型进行权限控制管理员管理用户、部门、课程、题库、考试安排查看全局统计报表。讲师维护自己负责的课程与题库发布考试查看所辖学员成绩。员工学员浏览课程、在线学习、参加考试、查看个人成绩与学习记录。3.2 课程与学习管理课程模块支持章节化组织每个课程由若干章节组成章节下可挂载视频、文档、图文等多种学习材料。系统记录学员的学习时长、完成进度与最后学习位置支持断点续学。课程分类与标签管理便于按岗位、技能维度检索。学习进度按章节粒度统计自动计算课程完成率。支持课程评价与学习笔记形成学习反馈闭环。3.3 题库与考试管理题库支持单选、多选、判断、填空、简答等题型题目可绑定知识点与难度等级。考试模块支持固定组卷与随机抽题两种方式并可配置考试时长、及格线、允许考试次数等参数。flowchart LR A[创建考试] -- B[选择组卷方式] B -- C[固定组卷 手动选题] B -- D[随机抽题 按规则抽取] C -- E[发布考试] D -- E E -- F[员工在线作答] F -- G[提交试卷] G -- H[客观题自动阅卷] H -- I[主观题人工评分] I -- J[生成成绩与统计]3.4 成绩与统计分析系统提供多维度统计能力包括个人成绩趋势、部门平均分对比、题目正确率分析、知识点掌握度分析等帮助管理者定位培训薄弱环节。四、数据库核心表设计以下列出系统中最核心的几张表其余表如课程章节、学习记录、考试作答明细等按同样思路扩展。-- 用户表 CREATE TABLE sys_user ( id BIGINT PRIMARY KEY AUTO_INCREMENT, username VARCHAR(50) NOT NULL UNIQUE COMMENT 登录账号, password VARCHAR(100) NOT NULL COMMENT 加密后的密码, real_name VARCHAR(50) NOT NULL COMMENT 真实姓名, dept_id BIGINT COMMENT 所属部门, role_code VARCHAR(20) NOT NULL COMMENT ADMIN/TEACHER/EMPLOYEE, status TINYINT DEFAULT 1 COMMENT 1启用 0禁用, create_time DATETIME DEFAULT CURRENT_TIMESTAMP ) COMMENT 用户表; -- 课程表 CREATE TABLE course ( id BIGINT PRIMARY KEY AUTO_INCREMENT, title VARCHAR(100) NOT NULL COMMENT 课程名称, category_id BIGINT COMMENT 课程分类, teacher_id BIGINT COMMENT 讲师ID, cover_url VARCHAR(255) COMMENT 封面图, description TEXT COMMENT 课程简介, status TINYINT DEFAULT 0 COMMENT 0草稿 1已发布, create_time DATETIME DEFAULT CURRENT_TIMESTAMP ) COMMENT 课程表; -- 题目表 CREATE TABLE question ( id BIGINT PRIMARY KEY AUTO_INCREMENT, course_id BIGINT COMMENT 所属课程, type TINYINT NOT NULL COMMENT 1单选 2多选 3判断 4填空 5简答, content TEXT NOT NULL COMMENT 题干, options JSON COMMENT 选项内容, answer VARCHAR(255) NOT NULL COMMENT 标准答案, score INT DEFAULT 5 COMMENT 分值, difficulty TINYINT DEFAULT 1 COMMENT 1易 2中 3难 ) COMMENT 题目表; -- 考试表 CREATE TABLE exam ( id BIGINT PRIMARY KEY AUTO_INCREMENT, title VARCHAR(100) NOT NULL COMMENT 考试名称, course_id BIGINT COMMENT 关联课程, start_time DATETIME NOT NULL COMMENT 开始时间, end_time DATETIME NOT NULL COMMENT 结束时间, duration INT NOT NULL COMMENT 考试时长(分钟), pass_score INT DEFAULT 60 COMMENT 及格分, max_attempt INT DEFAULT 1 COMMENT 允许考试次数, status TINYINT DEFAULT 0 COMMENT 0未发布 1进行中 2已结束 ) COMMENT 考试表; -- 成绩表 CREATE TABLE exam_record ( id BIGINT PRIMARY KEY AUTO_INCREMENT, exam_id BIGINT NOT NULL, user_id BIGINT NOT NULL, score DECIMAL(5,1) COMMENT 总得分, submit_time DATETIME COMMENT 交卷时间, status TINYINT DEFAULT 0 COMMENT 0进行中 1已交卷 2已批阅, UNIQUE KEY uk_exam_user (exam_id, user_id) ) COMMENT 考试成绩表;五、后端关键实现5.1 项目结构与依赖后端采用标准分层结构依赖管理使用 Maven。dependencies dependency groupIdorg.springframework.boot/groupId artifactIdspring-boot-starter-web/artifactId /dependency dependency groupIdorg.springframework.boot/groupId artifactIdspring-boot-starter-security/artifactId /dependency dependency groupIdcom.baomidou/groupId artifactIdmybatis-plus-spring-boot3-starter/artifactId version3.5.5/version /dependency dependency groupIdcom.mysql/groupId artifactIdmysql-connector-j/artifactId scoperuntime/scope /dependency /dependencies5.2 统一响应与全局异常处理public record ResultT(int code, String message, T data) { public static T ResultT ok(T data) { return new Result(200, success, data); } public static T ResultT fail(String message) { return new Result(500, message, null); } } RestControllerAdvice public class GlobalExceptionHandler { ExceptionHandler(BusinessException.class) public ResultVoid handleBusiness(BusinessException e) { return Result.fail(e.getMessage()); } ExceptionHandler(Exception.class) public ResultVoid handleOther(Exception e) { log.error(系统异常, e); return Result.fail(系统繁忙请稍后重试); } }5.3 考试提交与自动阅卷学员交卷后系统对客观题即时判分主观题标记为待人工批阅。核心逻辑如下Service RequiredArgsConstructor public class ExamSubmitService { private final QuestionMapper questionMapper; private final ExamRecordMapper recordMapper; private final AnswerDetailMapper detailMapper; Transactional(rollbackFor Exception.class) public ExamResult submit(Long examId, Long userId, ListAnswerDTO answers) { ListQuestion questions questionMapper.selectByExamId(examId); MapLong, Question questionMap questions.stream() .collect(Collectors.toMap(Question::getId, q - q)); BigDecimal total BigDecimal.ZERO; boolean needManual false; for (AnswerDTO answer : answers) { Question question questionMap.get(answer.getQuestionId()); if (question null) { continue; } boolean objective question.getType() 3; boolean correct objective isCorrect(question, answer.getContent()); BigDecimal score correct ? BigDecimal.valueOf(question.getScore()) : BigDecimal.ZERO; if (!objective) { needManual true; } total total.add(score); detailMapper.insert(buildDetail(answer, question, score, correct)); } ExamRecord record new ExamRecord(); record.setExamId(examId); record.setUserId(userId); record.setScore(total); record.setSubmitTime(LocalDateTime.now()); record.setStatus(needManual ? 1 : 2); recordMapper.insert(record); return new ExamResult(total, needManual); } private boolean isCorrect(Question question, String userAnswer) { if (userAnswer null) { return false; } String standard question.getAnswer().trim(); String actual userAnswer.trim(); return question.getType() 2 ? sortChars(standard).equals(sortChars(actual)) : standard.equalsIgnoreCase(actual); } private String sortChars(String value) { char[] chars value.replace(,, ).toCharArray(); Arrays.sort(chars); return new String(chars); } }5.4 基于 JWT 的登录鉴权Component RequiredArgsConstructor public class JwtAuthFilter extends OncePerRequestFilter { private final JwtUtil jwtUtil; private final UserDetailsService userDetailsService; Override protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, FilterChain chain) throws ServletException, IOException { String header request.getHeader(Authorization); if (header ! null header.startsWith(Bearer )) { String token header.substring(7); if (jwtUtil.validate(token)) { String username jwtUtil.getUsername(token); UserDetails user userDetailsService.loadUserByUsername(username); UsernamePasswordAuthenticationToken auth new UsernamePasswordAuthenticationToken( user, null, user.getAuthorities()); SecurityContextHolder.getContext().setAuthentication(auth); } } chain.doFilter(request, response); } }六、前端关键实现6.1 请求封装与 Token 注入import axios from axios import { ElMessage } from element-plus import { useUserStore } from /stores/user const request axios.create({ baseURL: import.meta.env.VITE_API_BASE_URL, timeout: 15000 }) request.interceptors.request.use(config { const userStore useUserStore() if (userStore.token) { config.headers.Authorization Bearer ${userStore.token} } return config }) request.interceptors.response.use( response { const { code, message, data } response.data if (code 200) { return data } ElMessage.error(message || 请求失败) return Promise.reject(new Error(message)) }, error { if (error.response?.status 401) { useUserStore().logout() window.location.href /login } ElMessage.error(error.message) return Promise.reject(error) } ) export default request6.2 考试倒计时与自动交卷template div classexam-header span剩余时间{{ formatTime(remainSeconds) }}/span el-button typeprimary clickhandleSubmit交卷/el-button /div /template script setup import { ref, onMounted, onBeforeUnmount } from vue import { submitExam } from /api/exam const props defineProps({ examId: { type: Number, required: true }, duration: { type: Number, required: true } }) const remainSeconds ref(props.duration * 60) let timer null const formatTime seconds { const m String(Math.floor(seconds / 60)).padStart(2, 0) const s String(seconds % 60).padStart(2, 0) return ${m}:${s} } const handleSubmit async () { clearInterval(timer) await submitExam(props.examId, answers.value) ElMessage.success(交卷成功) } onMounted(() { timer setInterval(() { remainSeconds.value-- if (remainSeconds.value 0) { handleSubmit() } }, 1000) }) onBeforeUnmount(() clearInterval(timer)) /script6.3 路由与权限控制import { createRouter, createWebHistory } from vue-router import { useUserStore } from /stores/user const routes [ { path: /login, component: () import(/views/Login.vue) }, { path: /, component: () import(/layout/Index.vue), children: [ { path: course, component: () import(/views/course/List.vue), meta: { roles: [ADMIN, TEACHER, EMPLOYEE] } }, { path: exam, component: () import(/views/exam/List.vue), meta: { roles: [ADMIN, TEACHER, EMPLOYEE] } }, { path: question, component: () import(/views/question/List.vue), meta: { roles: [ADMIN, TEACHER] } }, { path: statistics, component: () import(/views/statistics/Index.vue), meta: { roles: [ADMIN] } } ] } ] const router createRouter({ history: createWebHistory(), routes }) router.beforeEach((to, from, next) { const userStore useUserStore() if (to.path /login) { return next() } if (!userStore.token) { return next(/login) } const roles to.meta.roles if (roles !roles.includes(userStore.role)) { return next(/403) } next() }) export default router七、部署与运行准备 MySQL 8 与 Redis执行建表脚本并初始化管理员账号。后端修改application.yml中的数据源、Redis 与 JWT 密钥配置执行mvn clean package打包。前端修改.env.production中的接口地址执行npm run build生成静态资源。使用 Nginx 托管前端静态资源并将/api反向代理到后端服务。通过 Docker Compose 一键编排 MySQL、Redis、后端与 Nginx便于测试环境快速搭建。八、总结与展望本文从架构设计、功能模块、数据库建模到前后端关键代码完整梳理了一套基于 Spring Boot Vue3 的企业员工培训考试管理系统实现思路。系统通过课程学习与在线考试两条主线配合自动阅卷与统计分析帮助企业把培训过程沉淀为可追踪、可量化的数据资产。后续可在此基础上继续扩展接入大模型实现智能出题与主观题辅助评分、引入消息中心推送学习提醒、结合移动端小程序提升学习便捷性以及通过数据看板实现培训 ROI 的可视化分析。