这篇文章从软件工程和项目实战角度,整理一个基于 SpringBoot + Vue + MySQL 的校园疫情防控系统。系统主要面向校园日常健康信息管理场景,覆盖用户注册登录、场所打卡、数据上报、通行验证、公告资讯、后台管理和数据报表等模块。

说明

本文只讨论系统设计、后端接口、数据库建模和后台管理实现,不涉及疾病诊断、治疗建议或用药指导。

项目适合作为 Java Web、SpringBoot 毕设、校园管理系统和后台管理系统的学习参考。

1. 项目亮点:为什么这个系统适合写成 CSDN 项目文?

原论文内容比较完整,但论文写法偏学术,读者打开后不一定能快速看到“项目能做什么”。改成 CSDN 文章时,重点要把项目价值前置。

  • 技术关键词明确:SpringBoot、Vue、MySQL、Ajax、Element UI、ECharts,适合被搜索。
  • 业务闭环完整:用户注册登录 -> 场所打卡 -> 数据上报 -> 通行验证 -> 后台审核 -> 报表统计。
  • 模块适合拆解:后续可以继续写成系列文章,例如登录权限、文件上传、ECharts 报表、数据库设计。
  • 毕设参考价值高:有需求分析、系统设计、数据库表、核心代码和测试结果,内容结构比较完整。

2. 系统效果预览

先放项目截图,可以让读者快速判断文章是不是自己需要的内容。建议首图使用系统首页或后台管理界面,正文中再插入核心业务页面。

图1 系统首页与公告资讯展示

图2 登录/注册相关页面预览

图3 后台管理界面预览

图4 数据报表或列表管理界面预览

3. 技术栈说明

层级

技术选型

作用

前端

Vue、Vue-Router、Vuex、Element UI、Ajax

页面渲染、路由管理、状态管理、表单交互和接口请求

后端

SpringBoot、Java、MyBatis

提供 REST 接口、业务处理和数据持久化

数据库

MySQL

存储用户、打卡、上报、通行验证、报表等业务数据

可视化

ECharts

实现数据报表、统计图和后台数据分析

架构模式

B/S 架构、MVVM 思想

浏览器访问系统,前后端通过接口交互

整体采用 B/S 架构,用户通过浏览器访问系统。前端负责页面展示和表单交互,后端负责接口、权限、业务规则和数据库操作,MySQL 用来保存核心业务数据。

4. 功能模块设计

4.1 前台用户功能

  • 注册账号:填写用户编号、姓名、身份类型等基础信息。
  • 登录系统:通过账号密码进入系统,后续可维护个人信息。
  • 场所打卡:记录打卡场地、打卡时间、到访原因、健康码等信息。
  • 数据上报:提交健康状态、体温、健康码、行程码等信息。
  • 通行验证:填写通行原因和通行时间,等待后台审核。
  • 浏览公告与校园资讯:查看学校发布的公告信息和资讯内容。

4.2 后台管理员功能

  • 用户管理:查看注册用户信息,并进行审核或维护。
  • 场所打卡管理:对打卡记录进行查询、新增、修改和删除。
  • 数据上报管理:管理用户提交的上报信息和附件数据。
  • 通行验证管理:审核用户通行申请,记录审核状态和审核回复。
  • 公告资讯管理:发布公告栏内容和校园资讯。
  • 数据报表与数据分析:通过统计接口生成可视化报表。

5. 系统架构设计

系统可以拆成 Web 层、业务层和数据层:Web 层接收浏览器请求,Controller 调用 Service 完成业务处理,Service 再通过 Mapper/DAO 操作 MySQL 数据库。

图5 系统数据流/业务流程示意图

// Mermaid 架构图,可复制到 CSDN Markdown
graph TD
    A[浏览器/前端Vue页面] --> B[SpringBoot Controller]
    B --> C[Service业务层]
    C --> D[MyBatis Mapper]
    D --> E[(MySQL数据库)]
    C --> F[ECharts统计数据]
    F --> A

这种分层结构的好处是职责清晰:前端只关心页面和交互,后端统一处理业务逻辑,数据库负责数据持久化,后期维护和扩展都更方便。

6. 数据库核心表设计

系统围绕“用户、打卡、上报、通行、报表、分析”设计数据表。下面保留最核心的数据表,发文时不用把所有字段堆出来,优先展示读者最关心的业务结构。

数据表

主要字段

说明

registered_user

registered_user_id、user_no、full_name、gender、identity_type、examine_state、user_id

注册用户信息表,用于保存用户基础资料和审核状态

place_punch

place_punch_id、user_no、full_name、clock_in_area、clock_in_time、reason_for_visit、health_code

场所打卡表,用于记录用户到访地点和打卡信息

data_reporting

data_reporting_id、user_no、full_name、reporting_time、health、measure_body_temperature、health_code、trip_code

数据上报表,用于保存用户每日或阶段性上报数据

passage_verification

passage_verification_id、user_no、full_name、time_of_passage、reasons_for_access、examine_state、examine_reply

通行验证表,用于保存通行申请与审核结果

data_report

data_report_id、title、date、number_of_reported_persons、number_of_persons_not_reported、total_number_of_people

数据报表表,用于统计已上报、未上报和合计人数

data_analysis

data_analysis_id、title、date、analysis_content、analysis_results、remarks

数据分析表,用于保存分析内容与分析结果

7. 接口设计思路

项目接口不需要写得太复杂,CSDN 读者更关心“这个模块怎么跑起来”。可以用表格列出主要接口,既清楚又方便收藏。

模块

接口示例

请求方式

说明

用户注册

/api/user/register

POST

校验用户是否存在,保存加密后的密码

用户登录

/api/user/login

POST

支持用户名、邮箱或手机号登录

场所打卡

/api/place_punch/get_obj

GET

查询打卡详情或列表数据

数据上报

/api/upload

POST

上传健康码、行程码等附件

数据报表

/api/data_report/count

GET

按条件统计数据,用于 ECharts 图表展示

8. 核心代码整理

8.1 数据库连接配置

论文中的配置可以直接放到文章里,但建议把数据库密码改成占位符,不要把真实密码公开。

// application.yml
server:
  port: 5000
  servlet:
    context-path: /api

spring:
  datasource:
    url: jdbc:mysql://127.0.0.1:3306/campus_epidemic?serverTimezone=GMT%2B8&useSSL=false&characterEncoding=utf-8
    username: root
    password: ${DB_PASSWORD}
    driver-class-name: com.mysql.cj.jdbc.Driver
  jackson:
    time-zone: GMT+8
    date-format: yyyy-MM-dd HH:mm:ss
  servlet:
    multipart:
      max-file-size: 100MB
      max-request-size: 100MB

8.2 用户注册接口

注册时先根据用户名查询是否已存在,如果存在则返回错误提示;如果不存在,则对密码进行加密后保存用户信息。

// Java
@PostMapping("register")
public Map<String, Object> signUp(@RequestBody User user) {
    Map<String, String> query = new HashMap<>();
    query.put("username", user.getUsername());

    List list = service.select(query, new HashMap<>()).getResultList();
    if (list.size() > 0) {
        return error(30000, "用户已存在");
    }

    user.setUserId(null);
    user.setPassword(service.encryption(user.getPassword()));
    service.save(user);
    return success(1);
}

8.3 用户登录接口

登录模块可以支持用户名、邮箱或手机号三种方式。实际项目中建议结合 Token、Session 或 Spring Security 做权限控制。

// Java
@PostMapping("login")
public Map<String, Object> login(@RequestBody Map<String, String> data,
                                 HttpServletRequest request) {
    String username = data.get("username");
    String email = data.get("email");
    String phone = data.get("phone");
    String password = data.get("password");

    Map<String, String> query = new HashMap<>();
    if (username != null && !username.isEmpty()) {
        query.put("username", username);
    } else if (email != null && !email.isEmpty()) {
        query.put("email", email);
    } else if (phone != null && !phone.isEmpty()) {
        query.put("phone", phone);
    }

    // 查询用户、校验密码、写入登录状态
    // return success(userInfo);
    return success(1);
}

8.4 文件上传接口

数据上报模块会用到文件上传,例如上传健康码、行程码等图片。发文时可以顺手提示:正式项目要增加文件类型校验、文件大小限制、文件名清洗和访问权限控制。

// Java
@PostMapping("/upload")
public Map<String, Object> upload(@RequestParam("file") MultipartFile file) {
    if (file.isEmpty()) {
        return error(30000, "没有选择文件");
    }

    try {
        String filePath = System.getProperty("user.dir")
                + "\target\classes\static\upload\";
        File targetDir = new File(filePath);
        if (!targetDir.exists()) {
            targetDir.mkdirs();
        }

        String fileName = file.getOriginalFilename();
        File dest = new File(filePath + fileName);
        file.transferTo(dest);

        JSONObject result = new JSONObject();
        result.put("url", "/api/upload/" + fileName);
        return success(result);
    } catch (IOException e) {
        return error(30000, "上传失败");
    }
}

8.5 数据报表统计接口

后台数据报表使用 ECharts 展示,后端只需要返回统计后的分类和数量,前端负责图表渲染。

// Java
@RequestMapping(value = {"/count_group", "/count"})
public Map<String, Object> count(HttpServletRequest request) {
    Query count = service.count(
            service.readQuery(request),
            service.readConfig(request)
    );
    return success(count.getResultList());
}

9. 测试结果与性能分析

系统测试主要分为功能测试和性能测试。功能测试覆盖登录、注册、场所打卡、数据上报等常用模块。

测试模块

测试内容

结果

登录

用户名、密码为空或错误时给出提示;输入正确时进入系统

通过

注册

检测账号是否重复,验证基础字段格式

通过

场所打卡

新增、查询、修改、删除打卡信息

通过

数据上报

新增、查询、修改、删除上报信息,并支持附件上传

通过

数据报表

统计已上报人数、未上报人数和合计人数

通过

性能测试中,线上服务器环境为 1 核 CPU、1G 内存、1Mbps 公网带宽、CentOS 7。使用 2 台并发机器,每台 20 个用户并发访问主页、登录、查询和数据维护模块。测试中 CPU 使用率约为 8%,但出网流量达到峰值,说明在该环境下主要瓶颈是公网带宽。

优化建议

如果部署到正式环境,可以优先升级带宽、开启静态资源压缩、增加分页查询、优化 SQL 索引。

后台权限建议接入 Spring Security 或 JWT,文件上传建议加入白名单校验与独立对象存储。

10. 项目可优化方向

  • 权限控制:从简单角色判断升级为 RBAC 权限模型,区分管理员、教师、学生等角色。
  • 数据安全:敏感字段脱敏展示,密码使用更安全的哈希方案,重要操作记录审计日志。
  • 报表能力:增加按日期、身份类型、区域、上报状态等维度筛选。
  • 用户体验:表单校验前置,错误提示更明确,移动端页面做响应式优化。
  • 部署运维:使用 Nginx 反向代理,后端服务容器化,日志集中管理。

11. 总结

本文基于 SpringBoot + Vue + MySQL 实现了一个校园疫情防控系统,系统覆盖注册登录、场所打卡、数据上报、通行验证、公告资讯、数据报表和后台管理等核心功能。相比论文格式,CSDN 文章更适合把项目亮点、页面截图、技术栈、数据库设计和核心代码放在前面,这样读者可以快速判断项目是否值得收藏。

如果你正在做 Java Web、SpringBoot 毕设或后台管理系统,可以参考这个结构继续扩展:下一篇可以单独拆解“SpringBoot + Vue 登录注册模块如何实现”,或者继续讲“ECharts 数据报表接口设计”。

更多推荐