【付费资源预览A03】基于Vue和SpringBoot的医院门诊预约挂号系统

[Designer 小郑]

本帖是用于对付费资源《基于Vue和SpringBoot的超市账单管理系统（源码+数据库+项目文档+答辩PPT）》进行预览，有兴趣的朋友可以下载。

---

基于Vue和SpringBoot的医院门诊预约挂号管理系统，采用Redis作菜单缓存，MyBatis读写MySQL数据，业务上包含登录注册、科室管理、医生管理、医生放号、预约挂号、我的挂号、用户留言和新闻资讯功能，模拟了患者从零开始挂号就医的过程。

基于 Vue 的医院门诊预约挂号管理系统，主要包含数据中心、科室医生模块、预约挂号模块、医院时政这四大模块。

预约挂号系统采用了基于角色的访问控制，角色和菜单关联，一个角色可以配置多个菜单权限；然后再将用户和角色关联，一位用户可以赋予多个角色。这样用户就可以根据角色拿到该有的菜单权限，更方便医院管理人员进行权限管控。

患者去医院都是排队挂号，但随着科技的发展，预约挂号脱颖而出，医院门诊预约挂号管理系统操作简单明了与互联网紧密相关、适应时代发展的潮流。通过医院门诊预约挂号系统，可以极大的方便挂号者进行预约挂号，同事还能是医院更加合理的安排排号者就医并提供更优质的医疗服务。既能适当解决当前中国面临的医院门诊挂号排队时间长、挂号环境乱的问题，又能方便广大预约者挂号预约自己相对满意的医生和专家。

本系统前端采用了国内流行的 Vue 技术，采用了 View UI 作为组件库；后端采用 Java 语言编写，采用 SpringBoot 整合 MybatisPlus，采用 maven 构建项目，采用 Mysql 数据库，使用了 Redis 用于缓存加密的用户临时数据。

开题报告

安装部署文档

功能文档

 

答辩PPT 

技术栈

前端

Vue：Vue 是构建前端界面的核心框架，本系统采用 2.6.14 版本。

View UI：基于 Vue.js2.0 的组件库，本系统采用 4.7.0 版本。

后端

Spring Boot：构建系统核心逻辑的后端框架，本系统采用 2.7.0 版本。

MyBatis / MyBatis Plus：后端连接数据库的框架，本系统采用 3.5.2 版本。

数据库

MySQL：本项目的主数据库，本系统采用 8.0.29 版本。

Redis：本系统采用基于 Windows 版本的 Redis，用于图形验证码和用户菜单权限的临时存储，采用了 5.0.14 版本。

开发环境

VsCode：项目前端的开发工具，使用版本为 1.68.0。

IntelliJ IDEA ：项目后端的开发工具，使用版本为 2021.3.2。

Jdk：Java 的开发环境，使用版本为 17.0.3.1。

Maven：后端项目的打包工具，使用版本为 3.6.2。

NodeJs：前端项目的开发环境，使用版本为 16.13.0。

 

登陆界面

主页

注册

系统开放了用户注册的功能，患者可以自助注册患者账户，进入系统后，点击登陆按钮上方的“注册账号”绿色超链接，跳转到注册界面。

注册界面如下图所示，用户需要输入自己的手机号、用户名、密码和图形验证码，完成患者用户注册。然后使用注册时填入的手机号和密码，完成系统登陆。

科室管理模块

管理员登陆系统后，可以进入科室管理模块，查询科室档案的详细数据，如下图所示：

用户可以浏览医院新闻资讯等信息，并能查询科室、医生等相关信息。

科室的信息包括：

- 科室名称

- 科室代码

- 科室人数

- 主任医师人数

- 科室介绍

- 责任医师

- 备注

管理员可以单击顶部的“添加”按钮，进入科室的添加界面，后输入科室的名称、科室代码、科室介绍、科室成立日期、责任医师、备注，完成科室的添加。

管理员可以点击每一行的“编辑”按钮，进入科室编辑模块，如下图所示：

进入科室编辑模块后，完成现有数据的修改，点击“提交并保存”按钮即可完成编辑操作。

同理，点击每一行科室的“删除”按钮，即可完成对科室的删除功能。

管理员可以点击顶部的“导出”按钮，完成科室的 Excel 导出功能。

导出结果如下图所示：

医院科室的数据库设计如下图所示：

医生管理模块

管理员登陆系统后，可以进入医生管理模块，查询医生档案的详细数据，如下图所示：

医生的信息包括

- 医生姓名

- 医生年龄

- 学历学位

- 开始工作时间

- 毕业院校

- 职称

- 专业

- 所属科室

- 医生介绍

医生档案的增加、编辑、删除、导出操作步骤同科室模块。

可以根据科室查询医生，如在科室搜索框内输入“口腔”，点击搜索按钮，即可查询口腔科的医生列表，如下图所示：

医生的数据库设计如下图所示：

医生放号模块

为了模拟真实的预约挂号流程，本系统设计了医生放号模块。

管理员进入医生放号模块，界面如下图所示：

点击每一行医生的“放号”按钮，系统弹出放号交互弹框，如下图所示：

管理员需要填入放号日期、放号时段、放号个数，完成放号功能。

如填入放号日期为“2022-09-12”，放号时段为上午，放号个数为 10 个，点击“确认放号”按钮，即可完成对罗文文医生的放号操作。

管理员可点击每一行医生的“查询”按钮，完成对放号结果的查询，如下图所示：

医生号源的数据库设计如下图所示：

预约挂号模块

患者账号登陆系统后，可以进入到预约挂号模块，如下图所示：

在预约挂号模块中，可以查询需要挂号的医生。

可以根据科室查询，可以筛选是否今日的号，可以搜索医生的姓名、职称，该搜索功能在左上角顶部的搜索框实现。

如筛选了口腔科的科室，点击搜索按钮，即可完成口腔科医生的搜索，如下图所示：

患者点击每一行医生的红色的“挂号”按钮，系统弹出挂号弹框，患者可以查询该为医生的号源，如下图所示：

点击每一行的橙色“挂号”按钮，系统弹出再次确认弹框。

点击“确定”按钮，即可完成预约挂号操作。

挂号的数据库设计如下图所示：

我的挂号模块

患者登陆系统后，可以进入我的挂号模块。

该模块用于展示个人的挂号详情，界面如下图所示：

患者可以点击每一行红色的“取消点我”按钮，取消该次预约挂号，取消后号源恢复为未挂号状态。

患者可以点击红色的“付款”按钮，完成预约订单的付款功能。付款仅为模拟，支付宝/微信/银联支付必须要企业认证，个人没权限测试开发支付功能。

患者预约到医生的号后，可在我的订单模块模拟付款。付款后预约订单状态为已付款。

患者点击“付款”后，系统将弹出二次确认弹框，如下图所示：

用户留言模块

医院的预约挂号标准化流程，一定会存在有需要改进的点，或者现有功能不能被患者理解学会，所以需要设计留言板功能，实现患者和医院的信息交互功能。

患者进入到用户留言模块，界面如下图所示：

患者可点击顶部蓝色的“添加”按钮，打开添加留言弹框，如下图所示。

患者点击弹框底部的“确认留言”按钮后，完成留言操作。

留言完成后界面如下图所示：

管理员可以对留言进行回复操作，如下图所示。

回复成功后，管理员可以双击每一条评论行，查看该条评论的回复列表，如下图所示：

医院新闻模块

管理员可以进入医院新闻模块，界面如下图所示：

新闻的信息包括：

- 新闻名称

- 新闻描述

- 图片

- 新闻时效

- 是否公开

- 是否置顶

支持对医院的新闻进行添加、编辑、删除、公开、置顶，操作过程同科室管理模块。

系统采用了 ViewerJs 依赖，对指定 URL 的图片进行预览。

系统采用了 View UI 组件库，在表格内嵌了 Switch 开关组件。

普通患者只能进入的医院新闻留言模块，只保留了新闻的查看功能，界面如下图所示：

医院新闻的数据库设计如下图所示：

 

[Designer 小郑]

@一盏风雨灯 前端代码字段配置错误，如果你的目录在views下只有两级，那就是patient/index就可以了

[一盏风雨灯]

你好！ 我尝试利用了里面的的代码生成器写的代码放入了前端源代码的文件夹中

然后新建二级菜单，导入三级菜单

也授予了管理员该菜单的权限，但是现在仍然打不开三级菜单，请问少了什么步骤吗，还需要做些什么