基于SpringBoot+Vue的美容美发在线预约系统的设计与实现【附源码】

毕业设计(论文)

题目：基于SpringBoot+Vue的美容美发在线预约系统的设计与实现

      二级学院：             
      专业(方向)：                
      班      级：                    
      学      生：                    
      指导教师：                  

2023年10 月 01 日

摘 要

互联网的快速发展给我们的生活带来了很多的变化，因为网络快速的发展变革，网络已经融入大家的日常中。互联网给生活带来了许多便利，基本上可以达到足不出户就能完成许多事情。互联网的使用基本实现全覆盖，人们越来越体会认识到，计算机已经融入社会的各个的领域，给人们带来了许多便捷。
目前线上美容美发预约的服务方式已经是一种普遍的方式，随着互联网计算机的不断快速发展，很多传统的线下到店的排队预约，现在都是到网上的方式进行预约门店进行服务，且网上预约的技术也较为完善，系统设计较为科学。很多门店机构还有采用到店预约方式和人工辅助预约的方式进行。传统的预约仍然是当前的最主要的预约途径。为了更好的让人们意识到线上的预约能够在节约服务时间、分流服务对象、减轻门店服务压力上的作用，促进美容美发预约系统研究的快速发展，详细介绍了系统的设计开发流程，基于SpringBoot+Vue设计的美容美发在线预约系统网站，以信息预约为切入点，主要使用JAVA这门语言开发系统，通过对门店、相关服务信息的录入、订单信息及管理模块完成对预约系统的信息完善、以及用户注册进行美容美发的预约、缴费管理等功能，让门店通过系统针对用户预约的需求对技师的不同安排，明晰管理，为门店、用户简化了预约流程、避免线下预约的繁琐不便、提高服务效率。

[关键词] 在线预约；后台管理；技师排班；订单处理

Design and implementation of online appointment system for beauty salons based on SpringBoot Add Vue
Student: xxx Teacher: xx
Abstract:The rapid development of the Internet has brought a lot of changes to our lives, because of the rapid development and change of the Internet, the Internet has been integrated into everyone’s daily life. The Internet has brought a lot of convenience to life, and basically it is possible to accomplish many things without leaving home. The use of the Internet has basically achieved full coverage, and people are increasingly aware that computers have been integrated into various fields of society, bringing people a lot of convenience.
At present, the service method of online beauty salon appointment has become a common way, with the continuous and rapid development of Internet computers, many traditional offline queue appointments, are now online to make appointments for store services, and online appointment technology is also more perfect, system design is more scientific. Many store agencies also use in-store appointment and manual assisted appointment method. Traditional appointments are still the most important way to make appointments. In order to better make people aware of the role of online appointment in saving service time, diverting service objects, and reducing the pressure of store service, and promoting the rapid development of beauty salon appointment system research, the design and development process of the system is introduced in detail, based on the SpringBoot Add Vue design of the beauty salon online appointment system website, with information appointment as the entry point, mainly using the JAVA language development system, through the entry of store and related service information, The order information and management module completes the information improvement of the appointment system, as well as the user registration for beauty salon appointment, payment management and other functions, so that the store can clearly manage the different arrangements of technicians according to the user’s appointment needs through the system, simplify the appointment process for stores and users, avoid the cumbersome inconvenience of offline appointment, and improve service efficiency.
Key words：Book an appointment online; Back-office management; Technician scheduling; Order Processing

1绪论
1.1研究背景
随着计算机技术的提高发展，且越来越完善，其强大的计算机功能已经让人们深刻了解到，计算机技术已经进入生活的方方面面并发挥着积极的作用。社会信息化的高速发展下,服务行业信息化水平也在提高,而且对美容美发的正常工作开展也产生积极的影响[1]。
对于传统的线下用户到店的预约服务的方式，需要用户到门店跟工作人员反馈进行预约,便捷性不足,用户需要排队等待而花费大量的不必要时间,而市面上常见的预约服务系统也可能存在排他的、孤立的,使店内管理人员需要在不同系统进行重复操作,降低了用户与预约师的满意度,同时这类产品一般都是以商业目的为开发重心,不能很好地适配各自门店的实际需求,也没有提供合理的优化策略[2]。
预约服务由于各个领域的不同发展形成了多种的且繁杂不同预约模式，很多门店还是采用传统的预约模式，无论是线下的现场的预约还是电话的预约，其效率都十分低下，高峰期的时候一直无法满足用户对预约门店服务的实际诉求及预约师工作人员的服务要求，工作人员在对客户预约的信息填写及核对上都需要花费其许多的时间和精力，同时候在预约信息的核对和整理上非常繁琐，还有各种单子的打印，再加上信息反馈的不及时，不够准确，给门店的管理者会带来无法预测的管理、运营上的风险，带来重复工作的同时也浪费了大量的人力精力。
"十四五"以来,政府积极开展推进全民信息化工作,以计算机技术作为保障支撑,同时随着5G技术、大数据、人工智能新的技术不断推进应用,以信息化规划为远景，2035年远景目标纲要作出“营造良好数字生态”重要部署，全面提升信息化发展[3]。
如何提高这些机构门店的信息化发展，提高门店工作人员的工作效率及客户预约服务的良好体验，一个精心设计实现的基于SpringBoot+Vue设计的美容美发在线预约系统网站就可以解决用户预约服务、线上预约下单到店直接服务、分流服务对象、减轻门店服务压力、降低门店管理决策风险等问题。
1.2目的和意义
因此，为了更好的促进美容美发服务行业信息化的进一步发展，减少门店和客户的工作负担和生活负担，基于SpringBoot+Vue设计的美容美发在线预约系统网站，登录到后台对门店相关服务信息的录入、订单信息及管理模块完成对预约系统的信息完善，让客户注册进行美容美发的预约、选择预约时间等功能，同时预约信息的线上实时同步跟进，以及预约通知信息的展示，都极大的方便了客户预约和门店工作的有序进行，明晰了预约的流程，同时后台展示门店的技师排班、服务项目的一些基本信息，能够让门店一目了然的了解这些基本情况。随着信息科技与生活领域的相互促进和相互融合，互联网这些信息科学技术的高速的发展，还停留在传统手段工作的需要去转变新思维，携手促进信息化的发展。只有能在线上实现对系统结合工作的综合管理和流程的规范，只有这样，我们的信息化网站和信息化技术才能更好的不断优化和落地，才能更好的适应使用者的需要及提供更好的服务。
1.3 本文主要研究内容
本文基于美容美发预约平台的研究，SpringBoot+Vue设计的美容美发在线预约系统网站，系统前台实现预约服务，客户自己的预约管理，登录注册，预约信息的查询管理，后台功能则需要管理员操作，登录到后台网站，可进行技师的排班管理、预约项目及客户预约的信息管理、客户评级管理、广告及会员管理、管理员设置管理、统计分析等，可以对如上模块进行以下的基本添加、编辑、去除等管理操作。本文主要围绕以上的功能内容来介绍。
1.4 本章小结
本章本文重点阐述了病人预约系统的发展现状情况及其目的意义，并对美容美发在线预约系统网站的主要工作进行了初步的阐述，方便我们后期实现的时候有章可循。

2相关技术与开发工具介绍
2.1 相关技术简介
本节主要对本系统所使用到的技术以及这些技术在系统中发挥到的作用进行相关的介绍，主要使用的技术语言有：JAVA、VUE、HTML、CSS、JavaScript、MySQL。其中JAVA作为后端语言，配合各种技术来快速搭建网站。
2.1.1 技术介绍
后台开发语言选用JAVA，采用Maven构建项目，Maven有很多优点，最大得优点就是模块化，依赖自动下载，主要用到SpringBoot框架，SpringBoot框架的有点很多，封装了Servlet，提高了开发效率，集成了Servlet容器，简单的配置，灵活的应用。还用到了MyBatis，MyBatis主要封装了JDBC，提供了灵活的SQL配置文件。界面采用ElementUi，界面美观大方，ElementUi相对其他Vue框架比较成熟。
2.1.2 SpringBoot原理
SpringBoot是一个快速开发的架构，通过Maven的所属关系，简化了相关的配置，内置了代码运行的所需的服务器，例如Tomcat等，最终都是以为Java的程序执行，创建、运行、调试、部署，使用它可以做到专注于Spring应用的开发，而无需过多关注XML的繁琐配置。

图2-1 SpringBoot启动原理运行图

2.2 HTML技术介绍
HTML一种无需编辑就能被浏览器直接使用渲染的标签超文本标记语言。它能够结合多种编程语言完成前端界面的设计。
从技术研究领域来看，HTML是许多语言整合组成的综合类应用技术，例如HTML、CSS 和 JAVA， 2015 年由 W3C 发布了该技术最新的HTML5网络技术标准，目前大部分的主流浏览器版本都支持html5技术[4]。
2.3 CSS技术介绍
CSS技术属于一种表现文本标记和文本扩展文件形式展现出来的计算机语言，是现代计算机技术发展下的一种编程语言产物，也被称之为层叠样式表[4]。它收集了大量的功能库给开发者使用，极大提升了我们制作网页的速度，也极大丰富和渲染了用户的网页，增强用户的体验感。
2.4 MySQL数据库简述
MySQL是对于关系型数据库管理的系统集合，由于是开源架构因此可适用不同的后端及应用程序接口，它的原理是在相异的结构库表存储数据,目的是快速、灵活的进行基本的操作。
2.5 本章小结
本章主要介绍了开发中的相关的技术简单的介绍，并针对关系型数据库管理系统MySQL进行阐述说明，同时介绍了PHP的基本原理及在项目中的应用选型的优势，通过这些技术的结合，使得我们在开发中能够快速定位开发上线，极大降低了一个项目的研发难度。在后续的编写代码过程中能够按照计划进行工作。

3系统详细功能需求
美容美发在线预约系统根据客户的订单预约和技师排班管理的流程入手，改变以前的传统线下的到店预约方式，通过后台对技师信息的添加、项目信息的添加，订单预约及管理员的管理，能够让客户注册登录上平台前台网站，实现项目预约服务、预约信息及订单的管理，信息的线上实时同步跟进，以及预约信息的展示，都极大的方便了客户的实时预约诉求和门店技师工作的有序进行，明晰了服务预约的流程，同时后台展示门店的技师排班、服务项目、客户订单的一些基本信息，能够让门店一目了然的了解这些基本情况。根据系统功能需求列表，系统主要如下2大个模块，分别为前台模块下的登陆注册功能模块、首页模块、服务预约模块、我的预约模块，后台网站下的统计分析模块、分类管理模块、项目管理模块、预约管理模块、技师管理模块、评价管理模块、预约设置模块、管理员管理模块等。
3.1系统流程图

图3-1系统功能结构图
3.2前台网站模块
前台网站的功能模块需要实现的就是用户使用的功能页面，也就是系统需要的东西展现到前台，供用户使用。首先设计模块，我们需要先设计好页面的布局及每个子模块下需要提供给用户什么样的功能，整体来说前台是整套网站系统的门面及网站流程运作的用户操作数据入口，这里面需要设计的子模块为登陆注册功能、首页模块、服务预约模块、我的预约模块。
3.2.1登录注册
登录注册的功能如下。
登录注册模块的主要作用是对用户的基本信息的验证，确保使用系统的用户的真实性，是整个前台网站的入口，同时注册需要用户录入姓名、手机号码身份证这类的信息也保证了后续模块流程使用的唯一性，方便后续服务的展开。
3.2.2首页
首页的功能如下。
首页服务的基本功能是让用户能够看见门店的服务分类，及不同类别下的服务项目，点击不同服务项目可进行预约下单的操作，同时还能勾选预约日期、选择对应的技师，用户在勾选日期、选择对应的技师的下方还会有对于该项目的具体详情介绍和评价，按照实际的需求只需要选择然后支付订单可完成相应的预约，预约成功之后系统会显示预约成功的信息。
3.2.3服务预约
服务预约的功能如下
服务预约的主要功能为展示用户在首页模块的服务进行一个预约的操作，点击不同服务项目可进行预约下单的操作，同时还能勾选预约日期、选择对应的技师，立即预约之后会显示出详细的服务信息，包括项目、技师、预约日期及此次预约时间的不同时间段下的预约人数，方便用户根据预约人数的情况错开高峰到店消费。
3.2.4我的预约
我的预约的功能如下
我的预约的主要功能为展示用户在首页模块预约下单的订单信息，按照待付款、预约中、已完成分类展示，每一个项目会展示订单编号、服务的项目名称、预约的时间以及预约的价格。
3.3后台网站模块
后台网站的功能模块需要实现的就是门店的管理员使用的功能页面，需要管理的一些功能集中在一个平台[5]，也就是系统需要展现到前台的一些供用户使用、展示的信息都是后台完成操作的，因此设计模块上，我们需要先根据整体系统的需求及前台功能模块的设计来开发设计后台模块的功能，提供给前台用户需要的信息，以及内部系统的一些模块管理，整体来说后台是整套网站系统的及网站流程运作的非常重要一环，这里面需要设计的子模块为统计分析模块、分类管理模块、项目管理模块、预约管理模块、技师管理模块、评价管理模块、预约设置模块、管理员管理模块。
3.3.1统计分析
统计分析模块功能如下。
统计分析模块的主要作用是对客户门店预约以及项目的一些基本情况统计的综合展示，管理员能够合理的分配门店的资源以及合理的决策，提升整体的服务水平与效率。
3.3.2分类管理
分类管理模块模块的功能如下。
分类管理的主要功能是对门店项目的进行一个大类的分类添加及展示，方便客户预约项目的时候能够通过这个信息快速找到自己需要的预约项目，添加的主要信息项目大类的名称、排序、创建的时间等，信息展示栏的上方还有对项目大类信息的添加、修改和删除按钮。
3.2.3项目管理
项目管理模块功能如下。
主要的功能分别是服务项目信息的添加、修改删除及项目信息的展示，同时因为不同的服务项目属于不同的类别，在添加项目信息的时候下拉框选择所属的大类的信息，在项目管理的添加这里，先是添加项目相关的图片，再到项目的名称，之后选择类别以及价格，最后写上关于项目的详情信息点击保存，展示栏主要展示项目名称和项目的所属类别信息及价格、创建时间等信息，信息展示栏的上方还有对应添加的信息及修改和删除功能。
3.2.4预约管理
预约管理模块的主要功能如下。
主要功能是未处理订单及订单列表的展示，前台用户预约项目及技师产生订单的时候，未处理订单会有需要后台管理员处理的订单信息，主要的订单信息有订单编号、项目、用户信息、预约的日期、费用等，客户到店项目完成之后管理员可通过操作进行受理操作完成订单的处理，信息展示栏的上方还有对应按照订单编号查询的信息按钮，及勾选信息栏展示的项目更改为已完成的按钮功能。

3.2.5技师管理
技师管理模块的功能如下。
技师管理模块主要展示的是门店的技师相关的信息，前台用户预约项目的时候选择的技师主要是这里模块提供，展示的主要是技师名称、电话、备注特长等相关信息，信息展示栏的上方还有对应按照姓名查询的信息按钮，及新增、修改、删除等操作功能的按钮。
3.2.6评价管理
评价管理模块的功能如下。
评价管理模块主要展示的是用户对于项目服务的评价，主要通过该模块把用户的一些使用上的建议反馈能够及时的告知到门店的管理员，可及时的修改调整。
3.2.7预约设置
预约设置模块的功能如下。
预约设置模块主要展示以及可设定对应的技师的可预约时间段，及该时间段的预约人数，信息展示栏的上方还有对应按照姓名查询的信息按钮，及新增、修改、删除等操作功能的按钮。
3.2.8管理员管理
管理员管理模块的功能如下。
管理员管理是针对后台网站的用户来设计的，由于后台网站所属的是机构内部的人员使用，因此没有对外开发的注册接口功能，因此人员的添加及删除都是通过后台的管理员管理模块来进行的，系统刚刚上线时候则需要开发人员为机构分配初始的管理员，之后则可以用该模块对机构的后台人员使用进行管理，主要的功能是添加及删除功能，添加的信息为管理员名称及管理员密码，管理员列表则展示添加的管理员相关信息，包括管理员编号、用户名等信息，列表的操作栏具有对管理员信息修改和删除的按钮，功能是对后台人员信息的修改及删除。

4数据库设计
4.1数据库ER关系图

图4-1数据库ER图
4.2数据库表结构设计
构造数据库逻辑、物理的结构，作为开发人员对系统认识的共同基础以及开发和维护的文献基础[6]。

表4-2-1 会员表
表名称： base_member 含义： 会员表
创建者： 创建时间： 2023/10/10
表结构：
序号 数据项 数据项类型 数据项长度 是否为主键 不是null 数据项含义 数据项说明
1 id int 11 是 是 编号 自增
2 nickname varchar 45 是 昵称
3 avatar_url varchar 45 是 头像
4 gender char 1 是 性别
5 real_name varchar 50 是 姓名
6 mobile varchar 11 是 号码
7 login_name varchar 60 是 登录账号
8 password varchar 100 是 登录密码
9 integral int 11 否 积分
10 create_time datetime 否 创建时间

表4-2-2 广告表
表名称： appoint_advert 含义： 广告表
创建者： 创建时间： 2023/10/10
表结构：
序号 数据项 数据项类型 数据项长度 是否为主键 不是null 数据项含义 数据项说明
1 id int 11 是 是 编号 自增
2 pic_url varchar 225 是 图片地址
3 enable tinyint 4 否 禁用、启用
4 link varchar 225 否 连接
5 sort int 11 否 排序
6 phone varchar 11 是 手机号
7 create_time datetime 否 创建时间

表4-2-3 分类表
表名称： rappoint_category 含义： 分类表
创建者： 创建时间： 2023/10/10
表结构：
序号 数据项 数据项类型 数据项长度 是否为主键 不是null 数据项含义 数据项说明
1 id int 11 是 是 编号 自增
2 category_name varchar 30 是 分类名称
3 pic_url varchar 225 否 图片地址
4 sort int 11 是 排序
7 create_time datetime 否 创建时间

表4-2-4 项目表
表名称： discate 含义： 项目表
创建者： 许铭杰 创建时间： 2023/10/10
表结构：
序号 数据项 数据项类型 数据项长度 是否为主键 不是null 数据项含义 数据项说明
1 id int 11 是 是 编号 自增
2 project_name varchar 225 否 项目名称
3 category_id int 11 否 分类ID
4 price decimal 10 否 价格
5 pic_url varchar 225 否 图片
6 status tinyint 2 否 上下架
7 describe text 否 描述
8 create_time datetime 否 创建时间

表4-2-5 订单表
表名称： appoint_order 含义： 订单表
创建者： 创建时间： 2023/10/10
表结构：
序号 数据项 数据项类型 数据项长度 是否为主键 不是null 数据项含义 数据项说明
1 id int 11 是 是 编号 自增
2 project_id int 11 否 项目
3 user_id int 11 否 用户
4 teacher_id int 11 否 老师id
5 appoint_time datetime 否 预约时间
6 status tinyint 2 否 状态
7 total_amount decimal 10 否 金额
8 create_time datetime 否 创建时间

表4-2-6 管理员表
表名称： sys_user 含义： 管理员表
创建者： 创建时间： 2023/10/10
表结构：
序号 数据项 数据项类型 数据项长度 是否为主键 不是null 数据项含义 数据项说明
1 id int 11 是 是 编号 自增
5 username varchar 50 否 用户名
3 password varchar 100 否 密码
4 email varchar 100 否 邮箱
5 mobile varchar 11 否 手机号
6 status tinyint 4 否 状态
7 create_time datetime 否 创建时间

表4-2-7 技师表
表名称： appoint_teacher 含义： 技师表
创建者： 创建时间： 2023/10/10
表结构：
序号 数据项 数据项类型 数据项长度 是否为主键 不是null 数据项含义 数据项说明
1 id int 11 是 是 编号 自增
5 pic_url varchar 225 否 图像
3 real_name varchar 225 否 老师名称
4 mobile varchar 11 否 电话
5 specialty text 否 特长
6 remark text 2 否 备注
7 create_time datetime 否 创建时间

5平台详细设计
5.1前台网站
5.1.1登录注册
【操作人群】：
普通用户、客户
【详细设计】：
进入前台网站，网站首页的右侧“登录”即是登录入口，用户在输入框输入用户名和密码，然后点击下方的“登录”字样的按钮即可完成登录，同时登录按钮旁边有注册的按钮。光标移“注册”按钮，点击“注册”子导航按钮网站跳转到注册页面，页面显示有用户名、登陆密码、昵称、姓名、手机号的信息输入框，用户按照真实的信息填写，点击下方的“注册”按钮完成注册。

图5-1-1登录页面

图5-1-2注册页面

5.1.2首页
【操作人群】：
普通用户、客户
【详细设计】：
首页服务的基本功能是让用户能够看见门店的服务分类，页面左侧展示不同类别，点击不同类别展示其类别下的服务项目可进行预约下单的操作，首页上方的轮播图可放入一些近期门店的活动及其宣传海报。

图5-1-3首页

5.1.3服务预约
【操作人群】：
普通用户、客户
【详细设计】：
用户从首页进入左侧选择分类，点击服务项目的区域调整到预约操作页面可进行预约下单的操作，该页面可勾选预约日期、选择对应的技师，页面下方展示该服务项目的“详情”及“评价”两个子模块，点击“立即预约”按钮之后会跳转到显示出详细的服务信息页面，该页面显示服务项目、技师、预约日期及此次预约时间的不同时间段下的预约人数，方便用户根据预约人数的情况错开高峰到店消费，点击右下方的“立即预约”按钮扫描缴费完成订单操作。

图5-1-4服务预约页面

图5-1-5预约详情页面

5.1.4我的预约
【操作人群】：
普通用户、客户
【详细设计】：
进入首页，点击右上方的“用户昵称”区域进去跳转至我的预约页面，我的预约页面有四个子模块可选，分别对应的是“全部”模块、“待付款”模块、“预约中”模块、“已完成”模块，主要功能为展示用户在首页模块预约下单的订单信息，按照待付款、预约中、已完成分类展示，每一个项目会展示订单编号、服务的项目名称、预约的时间以及预约的价格。

						图5-1-6我的预约页面

5.2后台网站
5.2.1统计分析
【操作人群】：
管理员
【详细设计】：
光标移动到左侧菜单栏的“统计分析”并点击进入，展示“项目数量”、“用户数量”、“订单数量”的信息栏，分别显示对应的数量信息。页面下方还有一个页面展示的折现统计图，横坐标显示的是日期，纵坐标显示的是对应的预约统计的数量。

图5-2-1统计分析页面
5.2.2分类管理
【操作人群】：
管理员
【详细设计】：
光标移动到左侧菜单栏的“分类管理”并点击进入，展示“分类名称”、“排序”、“创建时间”的信息表格。页面左上方点击“新增”的按钮跳转进入到添加分类的页面，输入类别的相关信息之后点击保持按钮即可完成信息的添加，添加成功之后页面跳转到分类管理的页面，同时上方还显示“修改”、“删除”的操作按钮，点击“修改”按钮的同时选择下方信息表格前面的勾选框，页面跳转到修改列表页面，修改相关信息之后点击保存按钮即可完成修改操作，点击删除按钮同时选择下方信息表格前面的勾选框即可完成对应类别的操作。

图5-2-2分类管理页面

图5-2-3分类管理新增页面

图5-2-4分类管理修改页面

5.2.3项目管理
【操作人群】：
管理员
【详细设计】：
光标移动到左侧菜单栏的“项目管理”并点击进入，展示“图片”、“项目名称”、“分类”、“价格”、“创建时间”的信息表格。页面左上方在项目名称的输入框输入项目名称点击“查询”按钮即可查询对应的项目信息，点击“新增”的按钮跳转进入到添加项目的页面，添加项目的相关图片信息，输入项目的名称、选择对应的类比、输入价格、最后再填写其项目的详情介绍，之后点击保持按钮即可完成项目信息的添加，添加成功之后页面跳转到项目管理的页面，同时上方还显示“修改”、“删除”的操作按钮，点击“修改”按钮的同时选择下方信息表格前面的勾选框，页面跳转到修改列表页面，修改相关信息之后点击保存按钮即可完成项目的修改操作，点击删除按钮同时选择下方信息表格前面的勾选框即可完成对应项目的删除操作。

图5-2-5项目管理页面

图5-2-6项目管理查询页面

图5-2-7项目管理新增页面

图5-2-8项目管理修改页面

5.2.4预约管理
【操作人群】：
管理员
【详细设计】：

光标移动到左侧菜单栏的“预约管理”并点击进入，展示“订单编号”、“项目名称”、“昵称”、“预约日期”、“预约时间”、“金额”、“状态”的信息表格。页面左上方在项目名称的输入框输入订单编号点击“查询”按钮即可查询对应的项目信息，点击上方“完成”按钮的同时选择下方信息表格前面的勾选框，对应的客户预约的项目会标记为“已完成”状态。

图5-2-9项目预约页面

图5-2-10项目预约查询页面

5.2.5技师管理
【操作人群】：
管理员
【详细设计】：
光标移动到左侧菜单栏的“技师管理”并点击进入，展示“头像”、“老师名称”、“电话”、“创建时间”的信息表格。页面左上方在姓名的输入框输入姓名点击“查询”按钮即可查询对应的技师信息，点击“新增”的按钮跳转进入到添加技师的页面，添加技师的头像图片信息，输入技师的名称、电话号码、输入特长、最后再填写其相关备注，之后点击保持按钮即可完成老师的信息的添加，添加成功之后页面跳转到技师管理的页面，同时上方还显示“修改”、“删除”的操作按钮，点击“修改”按钮的同时选择下方信息表格前面的勾选框，页面跳转到修改技师页面，修改相关信息之后点击保存按钮即可完成项目的修改操作，点击删除按钮同时选择下方信息表格前面的勾选框即可完成对应技师的删除操作。

图5-2-11技师管理页面

图5-2-12技师新增页面

图5-2-13技师查询页面

图5-2-14技师修改页面

5.2.6评价管理
【操作人群】：
管理员
【详细设计】：
光标移动到左侧菜单栏的“评价管理”并点击进入，展示“项目名称”、“用户名称”、“评价内容”、“创建时间”的信息表格。页面左上方在姓名的输入框输入内容点击“查询”按钮即可查询对应的评价信息，同时上方还显示“删除”的操作按钮，点击删除按钮同时选择下方信息表格前面的勾选框即可完成对应的评价删除操作。

图5-2-15评价管理页面

5.2.7预约设置
【操作人群】：
管理员
【详细设计】：
光标移动到左侧菜单栏的“预约设置”并点击进入，展示“技师名称”、“开始时间”、“结束时间”、“预约人数”的信息表格。页面左上方在姓名的输入框输入技师点击“查询”按钮即可查询对应的技师预约时间点的信息，点击“新增”的按钮跳转进入到预约设置添加的页面，下拉框选择门店的技师，输入开始时间、结束时间、最后再填写其预约人数，之后点击保持按钮即可完成预约信息的设置添加，添加成功之后页面跳转到预约设置的页面，同时上方还显示“修改”、“删除”的操作按钮，点击“修改”按钮的同时选择下方信息表格前面的勾选框，页面跳转到修改页面，修改相关信息之后点击保存按钮即可完成项目的修改操作，点击删除按钮同时选择下方信息表格前面的勾选框即可完成对应的删除操作。

图5-2-16预约设置页面

图5-2-17预约设置新增页面

图5-2-18预约设置修改页面
5.2.8管理员管理
【操作人群】：
管理员
【详细设计】：
光标移动到左侧菜单栏的“管理员管理”并点击进入，展示“用户名”、“邮箱”、“手机号”、“状态”、“创建时间”的信息表格。页面左上方在姓名的输入框输入登录名点击“查询”按钮即可查询对应的管理员信息，点击“新增”的按钮跳转进入到管理员添加的页面，输入用户名，密码、邮箱、手机号、最后选择状态栏下的“禁用”和“启用”的两个其中的选项，之后点击保持按钮即可完成管理员信息的添加，添加成功之后页面跳转到管理员管理的页面，同时上方还显示“修改”、“删除”的操作按钮，点击“修改”按钮的同时选择下方信息表格前面的勾选框，页面跳转到修改页面，修改相关信息之后点击保存按钮即可完成项目的修改操作，点击删除按钮同时选择下方信息表格前面的勾选框即可完成对应管理员的删除操作。

图5-2-19管理员管理页面

图5-2-20管理员新增页面

图5-2-21管理员修改页面

6系统功能测试
系统测试工作采用前台后台分模式进行系统的测试，对系统的各项功能一一进行测试，即：前台的登陆注册模块、首页模块、服务预约模块、我的预约模块，以及后台的统计分析模块、分类管理模块、项目管理模块、预约管理模块、技师、评价、预约设置以及管理员相关模块的测试，用例中表格文字皆为操作流程，测试结果均正确。
6.1前台模块功能测试

表6-1前台功能模块测试用例
模块名称 测试描述 预期结果 测试结果
注册 1.点击首页注册按钮进行注册
2.输入相关注册的信息
3.点击注册 1.成功进入注册界面
2.能输入相关的信息
3.注册成功 与预期结果一致
登录 1.进入首页登录进行登录
2.输入登录账号密码信息
3.点击登录 1.成功进入登录界面
2.能输入相关的信息
3.登录成功
无法进行认证登录
服务预约 1.进入首页找到相关服务点击
2.选择预约日期
3.选择技师
4.可立即预约 1.成功进入预约页面
2.能选择预约日期
3.能选择技师
4.能预约成功 1、2点与预期结果一致
3点不能正常展示
我的预约 1.进入我的预约页面
2.展示预约信息
3.点击操作管理 1.成功进入预约管理页面
2.成功展示预约信息
3.能够评价预约 与预期结果一致

6.2后台模块功能测试
表6-2后台模块测试用例
模块名称 测试描述 预期结果 测试结果
登录 1.进入后台登录进行登录
2.输入登录账号密码信息
3.点击登录 1.成功进入登录界面
2.能输入相关的信息
3.登录成功 无法进行认证登录
分类
管理 1.点击分类管理
2.录入分类相关信息
3.点击修改
4.点击删除
1.能够展示分类信息
2.能够进行录入
3.能够修改分类的信息
4.能够删除选中的分类信息 与预期结果一致
统计
分析
1.点击统计分析管理
1.能够跳转到指定页面
2.能够显示对应的统计分析信息 与预期结果一致
项目
管理 1.点击项目管理
2.输入项目名称搜索
3.点击新增按钮
4.选择项目点击修改
5.选择项目点击删除 1.能够跳转到指定页面
2.能展示对应的项目信息
3.能够添加项目信息
4.能修改选择的项目
5.能删对应的项目 与预期结果一致
预约
管理 1.点击预约管理
2.输入订单编号搜索
3.选择的订单进行标记 1.能够跳转到指定页面
2.能展示对应的订单信息
3.能够更改标记的状态 与预期结果一致
技师
管理 1.点击项目管理
2.输入项目名称搜索
3.点击新增按钮
4.选择项目点击修改
5.选择项目点击删除 1.能够跳转到指定页面
2.能展示对应的技师信息
3.能够添加技师信息
4.能修改选择的技师
5.能删对应的技师信息 与预期结果一致
评价
管理 1.点击评价管理
2.输入内容搜索
3.点击删除按钮
1.能够跳转到指定页面
2.能展示对应的评价信息
3.能够删除信息 与预期结果一致
预约
设置 1.点击预约设置管理
2.输入技师名称搜索
3.点击新增按钮
4.选择信息点击修改
5.选择信息点击删除 1.能够跳转到指定页面
2.能展示对应的技师预约设置信息
3.能够添加预约的信息
4.能修改选择的预约信息
5.能删对应的信息 与预期结果一致
管理员
管理 1.点击管理员管理
2.输入登录名搜索
3.点击新增按钮
4.选择信息点击修改
5.选择信息点击删除 1.能够跳转到指定页面
2.能展示对应的管理员信息
3.能够添加管理员的信息
4.能修改选择的管理员信息
5.能删对应的信息 与预期结果一致

6.3 测试分析
线上考试系统的具体功能模块和用户需求已经完全实现，并且进行了大致的系统功能测试，通过测试效果再结合用户需求对系统进行完善，我们可以分析出：
（1）系统前端展示界面经过详细测试，存在的问题需要马上解决。
（2）按照主要功能点进行测试。
待解决的问题原因及方案如下：
(1)无法进行认证登录主要原因是代码逻辑上的问题，变量不对应解决的方案是修改代码逻辑重新运行

6.4本章小结
这一章节主要以系统的部分功能为例进行功能测试，检测在线预约系统是否存在问题，通过测试能够及时的发现问题及时调整完善优化，提高增强用户预约就诊使用的网站体验感。

参考文献
[1]张毅. LM医院挂号预约系统的分析与设计[D].西安理工大学,2020.
[2]戴铭孚. 基于MVC模式的医院预约挂号管理系统的设计与实现[D].广西大学,2019.
[3]韩迎红.基于HTML5技术的移动Web前端设计与开发[J].电子技术与软件工程,2021(22):55-57.
[4]秦秋滢.基于CSS技术的网页设计应用研究[J].电子世秦秋滢.基于CSS技术的网页设计应用研究[J].电子
[5]肖蕾,刘威,黄慧明.[J].多场景环境监测系统的设计与实现信息技术2019,43(06)
[6]刘忠平. 塑料行业电子商务一体化服务平台的设计与实现[D].天津大学,2019.
[7]高彦刚. 基于SSH框架的陕西省省直机关后勤综合服务平台设计与实现[D].西安电子科技大学,2015.
[8]增强现实地图导航系统的设计与实现[D].大连理工大学,2017.
[9]华磊. 基于CCD的图像采集系统设计与实现[D].西安电子科技大学,2018.
[10]黄筱喆. 基于增强现实的智能视频监控研究与设计[D].电子科技大学,2019.
[11]肖婧. 基于WEB的文山学院网络考试系统的设计与实现[D].电子科技大学,2018.
[12]韩迎红.基于HTML5技术的移动Web前端设计与开发[J].电子技术与软件工程,2021(22):55-57.
[13]高达.高职院校信息化考试平台建设研究[J].信息系统工程,2022(04):129-132.
[14]豆娟,傅春瑜,顾翔,朱纯良,胡国勇.基于智慧医院的医技检查预约排程智能系统的实践[J].中国医疗设备,2022,37(12):114-118.