简介：本资源是一套面向计算机专业本科生的毕业设计完整交付包，聚焦宠物领养业务场景，解决传统人工管理中信息不规范、审核效率低、数据安全性弱等实际问题。系统采用SpringBoot后端+Vue前端+MySQL数据库的主流技术栈，涵盖用户管理、宠物领养/认领全流程、审核机制、公告与感谢信管理等核心模块，适合作为课程设计、毕设选题及全栈开发学习范例。压缩包共823个文件，70.26MB，包含133个Java后端逻辑文件、64个Vue组件页、158个JS交互脚本、162个SVG图标资源、34个PNG/JPG图片及4个MP4演示视频，另有SQL建库脚本、开题报告、答辩PPT、完整毕业论文与三套批处理部署脚本（install/run/build.bat），结构清晰、开箱即用。目前已有225人学习下载，提供从环境搭建、代码调试到答辩展示的一站式支撑，显著降低毕设实施门槛。
1. 这不是又一个“宠物商城”，而是一套可跑通、可答辩、可延展的毕业设计闭环系统
很多同学拿到毕业设计选题时，第一反应是去 GitHub 搜“宠物领养系统”，结果下载下来发现：前端页面空白、后端启动报ClassNotFoundException、数据库脚本执行失败、Vue 路由跳转 404——更糟的是，开题报告里写的“采用 JWT 鉴权”在代码里根本找不到 token 校验逻辑。这套 SpringBoot + Vue + MySQL 的宠物领养系统，恰恰反其道而行：它把「能跑通」作为第一交付标准，所有资源（源码、建库 SQL、开题报告、论文正文、答辩 PPT、演示视频）全部对齐同一版本分支，且关键路径已预置调试断点和日志埋点。它解决的不是“有没有”，而是“能不能在答辩现场 5 分钟内拉起并演示审核流”；适合需要快速验证业务逻辑、应对导师质询、支撑论文数据章节撰写的本科毕设场景，尤其对 Java Web 基础尚可但 DevOps 经验薄弱的同学，提供了从1-install.bat到3-build.bat的完整本地化构建链路。
2. 从零启动：三步批处理背后的工程结构与环境契约
这套系统没有依赖云服务或外部中间件，所有运行依赖均收敛在本地开发环境内。其启动流程被封装为三个.bat文件，表面是 Windows 批处理，实则隐含了 SpringBoot + Vue 工程的分层契约关系。理解这三步，等于掌握了整套系统的部署拓扑。
2.11-install.bat：初始化数据库与基础配置校验
该脚本并非简单执行 SQL，而是先检查 MySQL 服务是否可用、端口是否监听、默认用户权限是否满足建库需求。核心逻辑如下：
@echo off echo 正在检测MySQL服务... netstat -ano | findstr :3306 >nul if %errorlevel% neq 0 ( echo ERROR: MySQL未运行，请启动MySQL服务后重试 pause exit /b 1 ) echo 正在创建数据库 pet_adoption... mysql -u root -p123456 -e "CREATE DATABASE IF NOT EXISTS pet_adoption DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;" if %errorlevel% neq 0 ( echo ERROR: 数据库创建失败，请检查root密码是否为123456 pause exit /b 1 ) echo 正在导入初始数据... mysql -u root -p123456 pet_adoption < ./sql/pet_adoption_init.sql if %errorlevel% neq 0 ( echo ERROR: 数据表导入失败，请检查SQL文件路径及语法 pause exit /b 1 ) echo 数据库初始化完成。提示：密码
123456是硬编码在脚本中的默认值，实际使用前需确认本地 MySQL root 密码一致；若修改过密码，必须同步更新该脚本中-p后的参数。pet_adoption_init.sql文件位于项目根目录sql/下，包含user,pet,adoption_apply,adopt_review等 12 张表的 DDL 与基础测试数据（如管理员账号admin/admin123），其中pet表的status字段采用 ENUM('available','adopted','reviewing')，直接约束业务状态流转，避免代码层冗余校验。
2.22-run.bat：双进程协同启动的关键参数控制
SpringBoot 后端与 Vue 前端必须独立进程运行，且存在跨域与端口绑定依赖。该脚本通过start命令并发启动两个窗口，并显式指定 JVM 参数与 Vue 开发服务器端口：
@echo off echo 启动后端服务（SpringBoot）... start cmd /k "cd /d %~dp0backend && java -Xms256m -Xmx512m -Dfile.encoding=UTF-8 -jar target/pet-adoption-backend-1.0.jar --server.port=8080" echo 启动前端服务（Vue）... start cmd /k "cd /d %~dp0frontend && npm install && npm run serve -- --port 8081 --host 127.0.0.1"注意：
--port 8081是 Vue CLI 的开发服务器端口，而--host 127.0.0.1强制绑定本地回环地址，避免局域网其他设备误访问；后端--server.port=8080与前端vue.config.js中的devServer.proxy配置严格对应——查看frontend/vue.config.js可见：devServer: { port: 8081, proxy: { '/api': { target: 'http://localhost:8080', changeOrigin: true, pathRewrite: { '^/api': '' } } } }这意味着前端所有以
/api/xxx开头的请求，将被自动代理至http://localhost:8080/xxx，彻底规避浏览器同源策略限制。若本地 8080 端口被占用，必须同步修改后端application.yml中的server.port和此处的target地址。
2.33-build.bat：生产环境打包的静态资源注入逻辑
该脚本生成可部署的最终产物，其核心在于 Vue 构建后将dist/目录内容嵌入 SpringBoot 的static/路径，实现前后端一体部署：
@echo off echo 正在构建前端... cd /d %~dp0frontend npm run build echo 正在清理后端static资源... cd /d %~dp0backend if exist src/main/resources/static rmdir /s /q src/main/resources/static mkdir src/main/resources/static echo 正在复制前端dist到后端static... xcopy /e /y "%~dp0frontend\dist\*.*" "src/main/resources/static\" echo 正在打包后端jar... mvn clean package -Dmaven.test.skip=true echo 构建完成！可执行jar位于 backend\target\pet-adoption-backend-1.0.jar pause关键细节：
xcopy /e /y参数确保递归复制所有子目录（含css/,js/,img/）且不提示覆盖；src/main/resources/static/是 SpringBoot 默认静态资源路径，优先级高于templates/，因此index.html被直接映射为根路径/；此时pet-adoption-backend-1.0.jar已内置全部前端资源，双击即可运行，无需额外 Nginx 或 Tomcat。这也是答辩演示最稳妥的方式——只需一台装有 JRE 的电脑，java -jar xxx.jar即可打开浏览器访问http://localhost:8080。
3. 核心业务模块的代码级实现与可验证路径
系统功能列表看似常规，但每个模块都对应明确的 REST 接口契约与状态机设计。以下以“宠物认领审核”为例，展示从数据库字段定义到前端按钮状态联动的完整链路，所有代码均可在源码中定位验证。
3.1 数据库层：adopt_review表的状态驱动设计
adopt_review表是审核流的核心载体，其结构直接决定业务规则边界：
| 字段名 | 类型 | 说明 |
|---|---|---|
| id | BIGINT PK | 主键 |
| apply_id | BIGINT NOT NULL | 关联adoption_apply.id |
| reviewer_id | BIGINT NOT NULL | 审核人 user.id |
| status | ENUM('pending','approved','rejected') DEFAULT 'pending' | 审核状态，仅允许三种取值 |
| remark | VARCHAR(500) | 审核意见，最大长度约束防 SQL 注入 |
| created_at | DATETIME DEFAULT CURRENT_TIMESTAMP | 创建时间 |
| updated_at | DATETIME DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP | 最后更新时间 |
注意：
status字段使用 ENUM 而非 INT，强制数据库层校验状态合法性；ON UPDATE CURRENT_TIMESTAMP确保每次更新自动刷新updated_at，为“审核时效性统计”提供数据基础。在sql/pet_adoption_init.sql中，已预置一条status='pending'的测试记录，ID 为 1，对应前端审核列表第一条数据。
3.2 后端层：SpringBoot Controller 的幂等性与事务边界
审核操作接口位于backend/src/main/java/com/example/pet/controller/AdoptReviewController.java，关键方法如下：
@PostMapping("/review/{id}") public Result<?> updateReviewStatus(@PathVariable Long id, @RequestBody @Valid ReviewUpdateDTO dto) { // 1. 查询原申请记录，校验是否存在且状态为 pending AdoptionApply apply = applyService.getById(dto.getApplyId()); if (apply == null || !"pending".equals(apply.getStatus())) { return Result.fail("申请不存在或已处理，无法重复审核"); } // 2. 更新审核记录，使用@Transactional保证原子性 AdoptReview review = new AdoptReview(); review.setId(id); review.setStatus(dto.getStatus()); // 'approved' or 'rejected' review.setRemark(dto.getRemark()); review.setReviewerId(SecurityUtils.getCurrentUserId()); // 从JWT解析当前登录用户 boolean updateSuccess = reviewService.updateById(review); // 3. 若审核通过，同步更新申请状态为 'adopted' if ("approved".equals(dto.getStatus())) { apply.setStatus("adopted"); applyService.updateById(apply); } return updateSuccess ? Result.success("审核操作已提交") : Result.fail("审核更新失败"); }逻辑说明：
@Valid触发ReviewUpdateDTO的字段校验（如status必须为枚举值）；SecurityUtils.getCurrentUserId()从 Spring Security 的Authentication对象中提取当前登录用户 ID，确保审核人身份可追溯；事务注解@Transactional包裹整个方法，保证“更新审核记录”与“更新申请状态”要么全成功，要么全回滚。若手动测试此接口，可用 curl 命令：curl -X POST "http://localhost:8080/api/review/1" \ -H "Content-Type: application/json" \ -H "Authorization: Bearer eyJhbGciOiJIUzUxMiJ9.eyJ1c2VySWQiOjEsInVzZXJuYW1lIjoiYWRtaW4iLCJleHAiOjE3MTAwMDAwMDB9.xxxxx" \ -d '{"applyId":1,"status":"approved","remark":"资料齐全，同意领养"}'其中
Authorization头的 JWT token 可从登录接口/api/login获取，applyId必须与数据库中adoption_apply.id一致。
3.3 前端层：Vue 组件的状态同步与按钮禁用控制
审核列表页frontend/src/views/review/ReviewList.vue使用v-if与:disabled实现精准状态控制：
<template> <el-table :data="reviewList"> <el-table-column prop="applyId" label="申请ID"></el-table-column> <el-table-column prop="status" label="当前状态"> <template #default="{ row }"> <el-tag :type="row.status === 'pending' ? 'warning' : row.status === 'approved' ? 'success' : 'danger'"> {{ statusMap[row.status] }} </el-tag> </template> </el-table-column> <el-table-column label="操作"> <template #default="{ row }"> <!-- 仅当状态为 pending 时显示审核按钮 --> <el-button v-if="row.status === 'pending'" size="small" type="primary" @click="handleReview(row.id)">审核</el-button> <!-- 已审核项显示详情 --> <el-button v-else size="small" @click="showDetail(row)">详情</el-button> </template> </el-table-column> </el-table> </template> <script> export default { data() { return { reviewList: [], statusMap: { pending: '待审核', approved: '已通过', rejected: '已拒绝' } } }, methods: { handleReview(id) { this.$prompt('请输入审核意见', '审核操作', { confirmButtonText: '确定', cancelButtonText: '取消', inputPattern: /^.{1,500}$/, inputErrorMessage: '意见不能为空且不超过500字' }).then(({ value }) => { // 调用 API 提交审核 this.$http.post(`/api/review/${id}`, { applyId: id, // 注意：此处 ID 为 review.id，需关联 apply_id status: 'approved', remark: value }).then(res => { this.$message.success('审核成功'); this.loadReviewList(); // 刷新列表 }); }); } } } </script>参数说明：
inputPattern正则/^.{1,500}$/在前端拦截超长输入，减轻后端压力；this.loadReviewList()是列表刷新方法，确保审核后立即看到状态变更；v-if="row.status === 'pending'"保证按钮只在合法状态下出现，杜绝用户误操作。若在浏览器开发者工具中 Network 面板观察，点击“审核”按钮会触发POST /api/review/1请求，响应体为{code:200,msg:"审核操作已提交",data:null}。
4. 论文与答辩支撑：从源码注释到可截图的可视化证据链
毕业论文不是代码说明书，而是技术决策的论证过程。本系统源码中大量嵌入了面向论文写作的注释锚点与可截图节点，直接支撑“系统设计”“关键技术实现”“测试结果分析”等章节。
4.1 源码注释即论文论据：以 JWT 鉴权模块为例
backend/src/main/java/com/example/pet/config/JwtConfig.java中的注释明确指向论文第三章“安全机制设计”：
/** * JWT鉴权配置类 —— 对应论文3.2.3节"基于Token的无状态认证机制" * 优势：① 服务端无需存储Session，降低内存压力；② Token携带用户角色信息，支持RBAC细粒度授权； * ③ 过期时间设为2小时（7200秒），平衡安全性与用户体验。 * 实现要点：使用jjwt-api 0.11.5，密钥存储于application.yml的jwt.secret字段， * 通过OncePerRequestFilter拦截请求并解析Token。 */ @Configuration public class JwtConfig { @Value("${jwt.secret}") private String jwtSecret; @Bean public JwtParser jwtParser() { return Jwts.parserBuilder() .setSigningKey(jwtSecret.getBytes()) .build(); } }应用技巧：在论文“关键技术实现”章节，可直接截图此注释块，并配文字：“如代码清单3-5所示，系统采用JWT实现无状态认证，密钥通过配置中心注入，解析器由Spring容器管理，确保密钥不硬编码于源码”。答辩时打开 IDE 展示该文件，导师可实时验证注释真实性。
4.2 可截图的测试证据：Postman 接口测试集合导出
项目docs/目录下提供PetAdoption-API-Collection.json，这是 Postman 导出的完整接口测试集合，包含 23 个已预置参数与预期响应的请求。例如GET /api/pet?status=available请求，返回 JSON 中data数组长度即为“可领养宠物数量”，可直接截图放入论文“系统测试”章节的“功能测试用例表”。
| 用例编号 | 接口路径 | 输入参数 | 预期响应码 | 预期响应数据特征 |
|---|---|---|---|---|
| TC-07 | GET /api/pet | status=available | 200 | data.length > 0，每条记录含 name, age, image_url |
| TC-12 | POST /api/review/{id} | {"status":"approved","remark":"..."} | 200 | msg="审核操作已提交" |
操作步骤：
- 下载 Postman 客户端（免费版即可）；
- 点击左上角
Import→Upload Files→ 选择docs/PetAdoption-API-Collection.json；- 展开集合，点击
Run按钮，选择环境Local（已预置http://localhost:8080）；- 运行后，右侧
Response面板显示绿色200状态码及 JSON 数据，截图保存即可。
此过程耗时不足 1 分钟，且所有请求均使用真实数据库数据，比“截图 Swagger UI”更具说服力。
4.3 视频演示的剪辑锚点：关键操作帧时间戳标记
video/目录下的demo.mp4并非流水账录像，而是在 00:45、02:18、04:33 等关键节点插入了画外音提示与画面高亮框。例如 02:18 处演示“管理员审核宠物认领”，画面中el-table的“待审核”标签被鼠标悬停，同时右下角弹出审核操作对话框——此帧可截取为论文“系统功能界面”图 4-7。视频已按答辩要求压缩至 120MB 内，兼容 Windows 自带播放器与 VLC，无需额外解码器。
答辩技巧：提前将视频导入 PowerPoint，设置为“单击播放”，在讲到“审核流程”时，单击触发播放，播放至 02:18 自动暂停，此时用激光笔圈出高亮区域，口述：“如图所示，系统通过状态标签与条件按钮实现操作收敛，确保业务规则在 UI 层即被强制执行。” 此举将视频从“辅助材料”升格为“核心论据”。
5. 毕设延展：三个低侵入、高价值的二次开发方向
这套系统的价值不仅在于交付，更在于其架构预留了清晰的扩展入口。无需重写核心，仅修改少量文件即可支撑课程设计升级或实习项目复用。
5.1 添加微信扫码登录：替换LoginController的 3 行代码
当前登录基于账号密码，若需接入微信开放平台，只需修改backend/src/main/java/com/example/pet/controller/LoginController.java：
// 原有方法（第45行） @PostMapping("/login") public Result<?> login(@RequestBody LoginDTO dto) { ... } // 新增方法（插入在下方） @PostMapping("/login/wechat") public Result<?> wechatLogin(@RequestBody WechatLoginDTO dto) { // 调用微信接口校验 code，获取 openid String openid = wechatService.getOpenid(dto.getCode()); // 根据 openid 查询或创建用户 User user = userService.findByOpenid(openid); if (user == null) { user = userService.createWechatUser(openid, dto.getNickname(), dto.getAvatar()); } // 生成 JWT Token 返回 String token = jwtService.generateToken(user.getId(), user.getUsername()); return Result.success(new LoginVO(token, user.getRole())); }关键点：
WechatLoginDTO需新增code（临时登录凭证）、nickname、avatar字段；wechatService调用https://api.weixin.qq.com/sns/jscode2session接口，传入appid,secret,js_code；userService.createWechatUser()方法在UserServiceImpl中实现，插入新用户时password字段设为null或随机字符串，避免空密码漏洞。前端Login.vue中增加微信图标按钮，点击后调用wx.login()获取code，再 POST 至/api/login/wechat。
5.2 宠物健康档案模块：复用现有 CRUD 模板
系统已有PetController与PetService，新增健康档案只需仿照Pet表结构创建pet_health_record表，并复用相同代码生成器：
| 字段 | 类型 | 说明 |
|---|---|---|
| id | BIGINT PK | 主键 |
| pet_id | BIGINT NOT NULL | 关联 pet.id |
| check_date | DATE NOT NULL | 检查日期 |
| vaccine_status | VARCHAR(50) | 疫苗接种情况 |
| medical_history | TEXT | 病史记录 |
| vet_name | VARCHAR(100) | 兽医姓名 |
操作步骤：
- 在
sql/pet_adoption_init.sql末尾追加建表语句；- 使用 MyBatis-Plus 代码生成器（
backend/src/test/java/CodeGenerator.java）重新生成PetHealthRecord实体、Mapper、Service；- 复制
PetController.java为PetHealthRecordController.java，修改@RequestMapping为/api/health-record；- 前端新建
HealthRecord.vue，复用PetList.vue的表格与表单结构，仅调整字段名。
全程无需修改框架代码，2 小时内可交付完整模块。
5.3 管理后台权限细化：修改SecurityConfig的 URL 拦截规则
当前权限仅分为USER与ADMIN，若需增加VET（兽医）角色，可精确控制/api/health-record/**路径：
@Override protected void configure(HttpSecurity http) throws Exception { http.authorizeRequests() .antMatchers("/api/login", "/api/pet/**", "/api/adoption/**").permitAll() // 公共接口 .antMatchers("/api/health-record/**").hasAnyRole("ADMIN", "VET") // 新增：兽医可访问健康档案 .antMatchers("/api/review/**", "/api/notice/**").hasRole("ADMIN") // 原审核/公告仅限管理员 .anyRequest().authenticated(); }验证方式：启动后，用
VET角色账号（数据库user.role='VET'）登录，访问http://localhost:8080/#/health-record/list应正常显示；若访问/api/review/list则返回403 Forbidden。此配置直接体现论文中“基于角色的访问控制（RBAC）模型”的落地细节。
本文还有配套的精品资源，点击获取
