企业官网建设流程全解析

一、项目简介

本系统是一套基于 Spring Boot 3 + Vue 3 前后端分离架构的教学管理平台，覆盖课程管理、在线选课、作业发布与提交、考勤记录、成绩管理、公告发布、轮播图配置等核心教学业务，贯穿教学管理全流程。系统采用前后端分离架构，后端提供 RESTful API，前端通过 Vue Router 管理页面路由并携带 JWT Token 调用接口。系统内置管理员、教师、学生三种角色，分别对应系统运维、教学执行、学习参与三个层面的操作权限，适合作为毕业设计、课程设计或教学管理类项目的二次开发基础。

二、技术栈

三、功能模块

管理员端

• 系统总览仪表盘：统计教师数、学生数、课程数、有效选课记录数，以卡片形式展示核心运营数据。
• 用户管理（分页查询）：支持按用户名/真实姓名关键词搜索，按角色筛选，分页展示用户列表。
• 用户管理（新增用户）：设置用户名、角色、状态，初始密码默认 123456，创建后可通过重置密码恢复默认值。
• 用户管理（编辑用户）：修改真实姓名、手机、邮箱、性别、角色等基本信息。
• 用户管理（删除用户）：逻辑删除，保留数据记录但不可登录。
• 用户管理（重置密码）：将指定用户密码重置为 123456。
• 用户管理（启用/禁用）：通过修改 status 字段控制账号是否可登录系统。
• 课程管理（分页查询）：按课程名称/课程编号关键词搜索课程列表。
• 课程管理（新增课程）：填写课程名称、编号、授课教师、学分、容量、学期、上课时间地点等字段。
• 课程管理（编辑课程）：修改课程全部字段，包括封面图片与上下架状态。
• 课程管理（删除课程）：逻辑删除课程，关联选课记录保留。
• 公告管理：分页查看平台公告（按发布时间倒序），支持新增（自动记录发布人）、编辑、删除。
• 轮播图管理：分页查看轮播图（按排序字段升序），支持新增（设置标题、图片链接、跳转链接、排序值、启用状态）、编辑、删除。

普通用户端（登录与通用能力）

• 浏览首页轮播图：仅展示已启用且按排序字段升序排列的轮播图。
• 查看公开课程列表：显示课程名称、封面、授课教师、学分、学期、当前人数/最大人数。
• 查看课程详情：包含课程描述、授课教师姓名、上课时间与地点。
• 浏览平台公告：仅显示类型为平台公告且已启用的公告，按发布时间倒序排列。
• 查看平台统计数据：展示教师总数、学生总数、课程总数。
• 用户登录：支持用户名+密码认证，登录成功后返回 JWT Token、用户ID、角色、头像信息。
• 获取当前登录用户信息：前端在 Authorization 请求头携带 Token，后端解析后返回用户详情。
• 文件上传：支持上传图片/文档，返回可访问的 URL 路径，供其他模块引用。

教师端

• 我的课程列表：仅显示当前教师负责的课程，按创建时间倒序排列。
• 学生名单管理：查看某门课程下所有已选课且状态为有效的学生列表。
• 作业管理（查看）：查看某课程全部作业，显示标题、截止时间、总分、已提交人数。
• 作业管理（新增/编辑/删除）：填写标题、描述、附件、截止时间、总分，支持修改与删除。
• 作业提交管理：查看某作业的所有学生提交记录（含提交内容、附件、提交时间）。
• 作业批改：为提交记录打分、填写评语，并标记为已批改状态。
• 课程考勤管理：查看某课程考勤记录，支持按日期筛选，显示学生姓名、考勤状态、备注。
• 考勤录入：支持新增单条考勤记录（选择学生、日期、状态），也支持批量新增（一次为多个学生记录同一日期考勤）。
• 课程成绩管理：查看某课程下所有学生成绩（平时成绩、考试成绩、总成绩、等级），支持录入/更新（存在则更新，不存在则新增）。
• 课程资料管理：查看教学资料列表（标题、描述、文件大小、上传时间），支持上传（填写标题、描述、文件 URL 和文件名）、删除。
• 课程公告管理：查看课程公告列表（按发布时间倒序），支持发布（自动记录发布人）、编辑、删除。

学生端

• 在线选课（查看可选课程）：自动过滤已选课程，显示课程名称、授课教师、容量。
• 在线选课（选课操作）：校验是否已选、课程是否存在、人数是否已满，选课后更新课程当前人数。
• 在线选课（退选操作）：将选课记录状态置为无效，同时减少课程当前人数。
• 我的课程列表：显示已选且状态为有效的课程。
• 查看课程作业列表：显示作业标题、截止时间、总分。
• 查看我的提交记录：显示某作业下自己的提交内容、附件、得分、评语、批改状态。
• 提交作业：填写作业内容、附件，自动记录学生 ID 和提交时间。
• 查看我的考勤记录：支持按课程筛选，显示课程名称、日期、考勤状态。
• 查看我的成绩列表：显示课程名称、平时成绩、考试成绩、总成绩、等级。

四、项目总结

本项目的技术亮点集中在三个方面：一是采用 Spring Boot 3 + Vue 3 的前后端分离架构，接口与页面完全解耦，便于独立部署和团队分工开发；二是权限设计清晰，基于 Spring Security + JWT 实现三种角色的接口级访问控制，前端配合路由守卫做页面级拦截；三是业务覆盖完整，从选课到成绩发布的教学闭环均有对应功能实现，且包含分页搜索、批量操作、逻辑删除等企业级常见需求。该项目适合作为教学管理、在线教育类系统的初始版本，也适合作为学习 Spring Boot 3 与 Vue 3 整合开发的实战参考，二次开发时可在此基础上扩展消息通知、课程评价、在线考试等模块。

界面展示

交付内容

本项目为完整交付，包含：

• 完整后端源码
• 完整前端源码
• 数据库初始化脚本（SQL）
• 万字项目文档（设计文档 / 论文，可作课程设计、毕业设计参考）

获取完整源码

完整前后端源码 + 数据库脚本 + 万字项目文档见 Gitee 仓库：https://gitee.com/kangxihuang/src-K284