SpringBoot+Vue框架程序设计|基于Spring Boot + Vue的宠物医院管理系统的设计与实现(功能演示+说明文档)
引言
随着城市养宠人群不断扩大,宠物医疗、流浪动物救助与社会捐赠等需求日益集中,传统电话预约与纸质登记方式已难以支撑挂号分流、病历留存与领养信息发布。许多中小型宠物医院仍依赖表格记录医生排班与就诊信息,救助机构发布领养信息也缺乏统一展示渠道,导致信息更新滞后、用户查询不便。
本课题设计并实现了一套宠物医疗与公益领养管理系统,将在线挂号、就诊结果录入、流浪动物领养审核、社会捐赠记录与统计报表整合在同一 Web 平台。系统面向管理员、医生与注册宠物主人三类角色,既解决医院日常业务数字化问题,也为公益领养与爱心捐赠提供可追溯的信息闭环,适合作为 Spring Boot 与 Vue 前后端分离架构的学习与实践案例。
系统概述
本系统采用管理端与用户端双门户设计。管理员通过后台维护医生档案、用户账号、救助信息、系统公告,并审核领养申请、查看捐赠与挂号全量数据;医生登录后可处理待就诊挂号、填写诊断结果与富文本病历;注册用户在门户浏览医生与可领养宠物,完成在线挂号、提交领养申请与社会捐赠,并在个人中心跟踪业务进度。
主要业务链路为:用户注册登录 → 选择医生在线挂号 → 医生就诊并录入病例 → 管理员统计分析;并行链路包括救助信息发布 → 用户提交领养申请 → 管理员审核并更新领养状态,以及用户提交捐款或物资捐赠 → 系统记录并纳入统计报表。
技术架构
系统采用 Spring Boot 2.5.3 作为服务端框架,Vue 3.2.13 构建单页应用交互界面,MySQL 存储业务数据,MyBatis 2.2.0 完成持久层映射。整体分为表现层、业务层与数据层:表现层由 Element Plus 与 Bootstrap 承担表单、表格与门户展示;业务层通过 Controller 与 Service 处理权限分流、挂号状态流转与领养审核;数据层由 Mapper XML 访问八张核心业务表。
| 层次 | 技术选型 | 说明 |
|---|---|---|
| 表现层 | Vue 3 + Element Plus + ECharts | 后台管理与前台门户页面、统计图表 |
| 业务层 | Spring Boot 2.5.3 | REST 接口、文件上传与统一响应封装 |
| 数据层 | MySQL + MyBatis | 挂号、领养、捐赠等业务持久化 |
核心功能
用户门户与医生展示
宠物主人在未登录状态下即可访问门户首页,浏览四位医生的挂号费用卡片与最新系统公告摘要。点击医生可进入详情页,查看姓名、联系方式、擅长领域与挂号费用,并通过「预约挂号」按钮跳转至在线挂号流程。该模块将医生档案与用户预约入口自然衔接,减少线下咨询成本。


在线挂号与就诊管理
登录用户在个人中心选择医生、预约日期,填写宠物名称、年龄与病情描述后提交挂号单,系统自动关联医生挂号费并生成唯一挂号单号。医生或管理员在待就诊列表中处理预约,就诊完成后填写诊断结果与富文本病历,状态由「待就诊」更新为「已就诊」。用户在「我的挂号」中可按状态查看记录、浏览详情,对待就诊订单还可取消预约。


流浪动物救助与领养
管理员在后台发布救助宠物信息,包含疫苗情况、照片与富文本描述,并维护「领养中」「已领养」状态。前台以卡片形式展示最新可领养宠物,用户登录后提交领养申请并填写理由,管理员审核通过后系统记录回复内容并更新宠物状态,形成从救助发布到领养闭环的完整流程。

社会捐赠与统计报表
注册用户可在前台提交捐款或物资捐赠,系统生成捐赠单号并归档至个人捐赠记录。管理端提供日捐款、月捐款、日挂号、月挂号及医生挂号量五类 ECharts 统计图,便于管理者从时间与医生维度观察业务趋势,为活动运营与排班决策提供数据支撑。
系统公告与后台管理
管理员通过后台富文本编辑器发布医院通知、系统升级说明与养宠温馨提示,前台同步展示公告列表。后台登录页支持管理员与医生角色切换,侧边栏集中管理用户、医生、挂号、领养、捐赠与报表模块,保证多角色在同一系统中的权限隔离与操作便捷。


数据库设计
系统数据库包含八张核心业务表,主要包括:
- doctors:医生编号、姓名、挂号费、擅长领域与照片路径
- member:注册用户账号、联系方式与注册时间
- registration:挂号单号、预约医生、宠物信息、就诊状态、诊断结果与病例富文本
- socialassistance:救助宠物档案、疫苗情况、领养状态与描述
- adoptionrequests:领养申请、审核状态与管理员回复
- socialdonations:捐赠单号、捐款或物品分类与捐赠时间
- systemnotices:公告标题、富文本内容与发布时间
- admin:后台管理员账号与角色
关键状态字段方面,registration.visitstatus 区分「待就诊」与「已就诊」;socialassistance.pstatus 标识「领养中」或「已领养」;adoptionrequests.status 记录领养审核结果。各表通过医生编号、用户名与宠物 id 建立业务关联。
界面与交互展示
下图补充展示系统登录入口与门户视觉风格。管理端采用紫色主题与左侧菜单布局,用户端以轮播横幅与卡片列表呈现公益领养信息,双端风格统一而场景分明。

部署与运行
运行环境建议:JDK 1.8、Maven 3.6、MySQL 5.7 或 8.0、Node.js 14 及以上。部署时先在 MySQL 中执行 DB 目录下 SQL 脚本初始化库表,修改 application.yml 中的数据源配置后启动 Spring Boot 服务(默认端口 8088,上下文路径 /VeterinaryHospital),再于前端工程执行 npm install 与 npm run serve 启动 Vue 开发服务。生产环境部署后请自行修改默认管理员、医生与用户账号密码,勿沿用演示环境弱口令。
更多推荐
所有评论(0)