校园健康驿站管理系统

springboot439校园健康驿站管理系统

第1章 绪论

1.1 课题背景

互联网发展至今,无论是其理论还是技术都已经成熟,而且它广泛参与在社会中的方方面面。它让信息都可以通过网络传播,搭配信息管理工具可以很好地为人们提供服务。所以各行业,尤其是规模较大的企业和学校等都开始借助互联网和软件工具管理信息,传播信息,共享信息等等,以此可以增强自身实力,提高在同行业当中的竞争能力,并从各种激烈的竞争中获取发展的机会。针对体检服务信息管理混乱,出错率高,信息安全性差,劳动强度大,费时费力等问题,经过分析和考虑,在目前的情况下,可以引进一款校园健康驿站管理系统这样的现代化管理工具,这个工具就是解决上述问题的最好的解决方案。它不仅可以实时完成信息处理,还缩短体检服务信息管理流程,使其系统化和规范化。同时还可以减少工作量,节约体检服务信息管理需要的人力和资金。所以校园健康驿站管理系统是信息管理环节中不可缺少的工具,它对管理者来说非常重要。

1.2 课题意义

现如今,信息种类变得越来越多,信息的容量也变得越来越大,这就是信息时代的标志。近些年,计算机科学发展得也越来越快,而且软件开发技术也越来越成熟,因此,在生活中的各个领域,只要存在信息管理,几乎都有计算机的影子,可以说很多行业都采用计算机的方式管理信息。信息计算机化处理相比手工操作,有着保密性强,效率高,存储空间大,成本低等诸多优点。针对体检服务信息管理,采用校园健康驿站管理系统可以有效管理,使信息管理能够更加科学和规范。

总之,在实际中使用校园健康驿站管理系统,其意义如下:

第一点:校园健康驿站管理系统的实际运用,可以帮助管理人员在短时间内完成信息处理工作;

第二点:通过系统页面的合理排版布局,可以更加直观的展示系统的内容,并且使用者可以随时阅读页面信息,随时操作系统提供的功能;

第三点:可以实现信息管理计算机化;

第四点:可以降低信息管理成本;

1.3 研究内容

对校园健康驿站管理系统设计制作,不仅需要技术支撑,也需要大量的理论研究。本文在对校园健康驿站管理系统进行介绍时,将按照如下内容进行。

第一部分:介绍校园健康驿站管理系统研究的背景意义,便于用户了解系统;

第二部分:介绍开发校园健康驿站管理系统需要搭建的环境,包括技术和工具;

第三部分:介绍用户对校园健康驿站管理系统的功能要求,以及对校园健康驿站管理系统的性能要求等;

第四部分:介绍数据库的设计方案,以及根据功能要求设计的功能结构;

第五部分:介绍通过编码最终实现的系统功能运行效果;

第六部分:介绍系统的功能测试,对系统进行综合检测,并及时解决系统出现的问题,直至系统运行正常。

第2章 开发环境与技术

校园健康驿站管理系统的编码实现需要搭建一定的环境和使用相应的技术,接下来的内容就是对校园健康驿站管理系统用到的技术和工具进行介绍。

2.1 MYSQL数据库

本课题所开发的应用程序在数据操作方面是不可预知的,是经常变动的,没有办法直接把数据写在文档里,这样不仅仅不安全,也不能实现应用程序的功能。如果要能实现应用程序所需要的数据存储功能,就避免不了要进行专业数据库存储软件的选择。基本上应用程序实现的功能不算太复杂,市面上任何一个关系型数据库软件都可以实现。参考自己的学习进度和操作习惯来讲,Oracle数据库是适合的,但是所需要的的安装软件很大,并且有好多不需要的功能都是开启的状态,十分消耗电脑资源,所以没有选择Oracle数据库,而SQL Server数据库虽然学过,但是安装的时候因为电脑上可能有其他的软件存在,经常性的出问题,而安装问题不好解决就需要重新安装操作系统,这样对已经存在的软件来讲又是一种时间上的浪费。只有MySQL数据库,安装包小,安装速度快,操作简单,哪怕安装出问题也好解决,不用重装操作系统,也不影响电脑上运行的其他软件,消耗资源也少,最重要的是在功能方面完全的符合设计需要,所以最后选择了MySQL数据库作为应用软件开发需要的数据库。

2.2 vue技术

在动态网站的兴起之初,作为高级编程语言的Java自然不会放弃这个领域的蛋糕。Sun公司推出了Servlet作为输出动态网站的一种技术标准,虽然不怎么受当时程序员的喜爱,但是当初也没有太多的选择,随后几个月java语言问世,不考虑性能和效率如何,起码在书写网页所需要的动态代码块和静态代码块方面进行了区分,让书写效率和可读效率大大的提升,所以很多Java程序员以及刚入行的初级程序员都选择了java语言作为自己职业的发展方向,Sun公司为了维护Java语言在高级编程语言上的江湖地位,防止java继续抢走市场份额占有率,Sun公司联合Apache基金会研发了一个关于Java动态网页的一个新型的技术标准,这就是vue技术。vue吸取了java语言在页面书写上面的所有优点,但是又背靠Java EE的庞大后台,又能实现很多通过Java组件就能实现的功能,在vue页面上可以直接引用那些组件,让vue更加的强壮丰富。保证了Java技术纵向的可持续发展,并且在动态网站开发领域终于站稳了脚跟,其他java开发人员可以很快的转移到vue进行开发,不考虑一些特殊组件或者功能的开发,只从动态页面的开发上来讲,完全实现了java程序和vue程序的几乎无成本的转换,vue技术就这样的发展了起来。

2.3 Spring Boot框架

Spring Boot是由Pivotal团队提供的全新框架,其设计目的是用来简化Spring应用的初始搭建以及开发过程。该框架使用了特定的方式来进行配置,从而使开发人员不再需要定义样板化的配置。通过这种方式,Spring Boot致力于在蓬勃发展的快速应用开发领域(rapid application development)成为领导者。

SpringBoot基于Spring4.0设计,不仅继承了Spring框架原有的优秀特性,而且还通过简化配置来进一步简化了Spring应用的整个搭建和开发过程。另外SpringBoot通过集成大量的框架使得依赖包的版本冲突,以及引用的不稳定性等问题得到了很好的解决。

SpringBoot框架中还有两个非常重要的策略:开箱即用和约定优于配置。开箱即用,Outofbox,是指在开发过程中,通过在MAVEN项目的pom文件中添加相关依赖包,然后使用对应注解来代替繁琐的XML配置文件以管理对象的生命周期。这个特点使得开发人员摆脱了复杂的配置工作以及依赖的管理工作,更加专注于业务逻辑。约定优于配置,Convention over configuration,是一种由SpringBoot本身来配置目标结构,由开发者在结构中添加信息的软件设计范式。这一特点虽降低了部分灵活性,增加了BUG定位的复杂性,但减少了开发人员需要做出决定的数量,同时减少了大量的XML配置,并且可以将代码编译、测试和打包等工作自动化。

SpringBoot应用系统开发模板的基本架构设计从前端到后台进行说明:前端常使用模板引擎,主要有FreeMarker和Thymeleaf,它们都是用Java语言编写的,渲染模板并输出相应文本,使得界面的设计与应用的逻辑分离,同时前端开发还会使用到Bootstrap、AngularJS、JQuery等;在浏览器的数据传输格式上采用Json,非xml,同时提供RESTfulAPI;SpringMVC框架用于数据到达服务器后处理请求;到数据访问层主要有Hibernate、MyBatis、JPA等持久层框架;数据库常用MySQL;开发工具推荐IntelliJIDEA。

第3章 系统分析

面对即将开发的系统,进行提前的分析是必要的。这也是开发流程中必须有的环节。通常分析系统期间,主要涉及的内容包括系统开发可行性问题,对系统功能和性能的分析等问题。

3.1 可行性分析

在正式对需要建设的项目进行投资前,有一个比较关键的步骤是不能缺少的,那就是可行性分析。它主要从当前技术,经济等角度去评估系统的可行性,在投资决策中常常采用这种科学的方法来论证项目。

3.1.1 技术可行性

当前,系统开发的技术已经发展成熟,而且通过计算机网络可以获取开发工具的使用方法,以及规范化编写的模块化代码,这些知识可以帮助开发者顺利完成本系统的编码工作。

3.1.2 经济可行性

本系统开发期间需要配置的软件环境,可以免费通过开发类官网下载安装,需要配置的硬件设备也不需要具备很高的性能,通常网吧电脑,或学校计算机机房的电脑都符合要求。因此,从经济方面考虑,校园健康驿站管理系统开发可行。

3.1.3 操作可行性

校园健康驿站管理系统根据用户使用习惯进行开发,设计的界面具有统一性,并具备优秀的导航功能。所以,只要会简单操作电脑的人员,可以无压力操作校园健康驿站管理系统。

总之,从上述的论证来看,本系统可以开发。

3.2 系统流程

流程图这样的工具可以直观反映出系统内部的操作逻辑,可以帮助用户更好的理解系统。

3.2.1 操作流程

进入本系统需要访问者提供验证信息。验证合格的访问者才能获取访问资格。其具体的操作流程见下图。访问者根据登录界面设置的信息项如实填写,待信息通过验证后,访问者可以进入指定的页面享受本系统提供的服务和阅读本系统的相关信息。

图3.1 操作流程图

3.2.2 登录流程

本系统的登录模块,其内部的流程见下图。主要对访问本系统的人员提供的验证信息进行逐个判断,系统面对录入错误的信息会给出提示,比如,提示账号不对,或提示密码不匹配等提示信息。总之,在登录页面填写的所有信息都符合要求,访问者就登录成功了。

图3.2 登录流程图

3.2.3 删除信息流程

本系统在经常性的使用后,会产生很多失去价值的信息,因此就需要及时清理数据,腾出系统的空间。对这些数据进行清理时,其对应的流程见下图。先选中要清理的数据,通过反复确认需要清理的数据,避免操作人员误删。已经删除的数据就不会出现在系统里面。

图3.3 删除信息流程图

3.2.4 添加信息流程

本系统主要用于显示信息,提供服务,其中,数据添加功能就是其中的服务之一,具体流程见下图。让操作者在信息添加的页面录入数据,待这些数据被提交检验合格后,就会在系统指定页面显示出来。

图3.4 添加信息流程图

3.3 性能需求

进行需求分析,包括了根据用户实际需求制定功能,也涵盖了对即将设计的系统进行性能上的需求分析。所以一般分析系统时,一方面要分析系统功能,另一方面也要分析系统的性能。毕竟设计开发出一个好性能的系统可以确保系统的质量可靠。

接下来分析系统的性能,还要从界面友好性,系统的时间特性,系统的可靠性等方面来分析说明。

(1)时间特性要求:系统处理数据都有时间要求,这也是系统的时间特性。通常都会把数据处理的时间进行分析,也会设置用户请求的响应时间,还有系统在满负荷运行时可以偏离的范围数值等都需要提前分析确定。

(2)界面友好性:除了功能上需要考虑用户需求外,在人机交互界面的设计上,也需要考虑用户的使用习惯,包括界面的布局,界面基调选择以及颜色搭配等。尽量做到用户在接受简单的培训之后,可以对系统进行独立操作。

(3)系统可靠性:对于初学者而言,很容易出现一个问题,就是设计开发的系统,因为人为的误操作出现崩溃,有些也会导致电脑死机。这样的现象也说明这种容错能力低下的系统是不可靠的。完全不能作为生活中处理信息的系统。当下,系统开发要保证可靠性,设计时,把模块化和结构化的设计理念也考虑进来。如果遇到对时效性要求比较严格的系统,也需要采取其它的措施,比如双机系统,还有磁盘阵列等方式。还有就是一个可靠性的系统,对设备的供电能力也有要求。

第4章 系统设计

一个成功设计的系统在内容上必定是丰富的,在系统外观或系统功能上必定是对用户友好的。所以为了提升系统的价值,吸引更多的访问者访问系统,以及让来访用户可以花费更多时间停留在系统上,则表明该系统设计得比较专业。

4.1 设计原则

本系统在设计过程中需要依照一定的设计原则进行,目的就是为了让开发的系统具备高质量,齐全完备的功能,方便简单的操作,如此才可以最大限度的满足使用者的要求。系统设计原则除了基本的易操作原则外,还有安全性原则,准确性原则。

第一个设计原则:易操作原则,针对本系统设计的功能要完备齐全,编码时,设计的各个接口要具备友好性,使用者一旦使用本系统时,要能够轻松上手,操作本系统处理数据时,要具备便利性。此外,也需要设计一些必要提示,引导使用者操作系统。

第二个设计原则:安全性原则,本系统在登录模块要对各个访问者进行身份验证,系统会通过访问者输入的信息进行判断,使用提前编写的安全验证代码进行数据比对,引导匹配成功的访问者进入指定的操作界面。这样可以避免无关性访问者窃取系统的数据。

第三个设计原则:准确性原则,为了保证使用者登记的数据是正确的,需要提前设计数据纠错机制,让使用者可以通过系统的报错提示,仔细检查登记的错误信息,并及时纠正错误,填写规范正确的信息。比如设置密码时,要求密码的长度不能低于6个字符,且数据类型要求不能全部是数字等都能进行规范。

4.2 功能结构设计

在前面分析的管理员功能的基础上,进行接下来的设计工作,最终展示设计的管理员结构图(见下图)。管理员增删改查体检服务

结构设计图

4.3 数据库设计

开发一个系统也需要提前设计数据库。这里的数据库是相关数据的集合,存储在一起的这些数据也是按照一定的组织方式进行的。目前,数据库能够服务于多种应用程序,则是源于它存储方式最佳,具备数据冗余率低的优势。虽然数据库为程序提供信息存储服务,但它与程序之间也可以保持较高的独立性。总而言之,数据库经历了很长一段时间的发展,从最初的不为人知,到现在的人尽皆知,其相关技术也越发成熟,同时也拥有着坚实的理论基础。

(1)下图是校园论坛实体和其具备的属性。


校园论坛实体属性图

(2)下图是每日健康填报实体和其具备的属性。


每日健康填报实体属性图

(3)下图是教师实体和其具备的属性。


教师实体属性图

(4)下图是体检服务实体和其具备的属性。


体检服务实体属性图

(5)下图是体检预约实体和其具备的属性。


体检预约实体属性图

(6)下图是服务留言实体和其具备的属性。


服务留言实体属性图

(7)下图是驿站收藏实体和其具备的属性。


驿站收藏实体属性图

(8)下图是校园健康资讯实体和其具备的属性。


校园健康资讯实体属性图

(9)下图是健康驿站实体和其具备的属性。


健康驿站实体属性图

(10)下图是自测异常信息实体和其具备的属性。


自测异常信息实体属性图

(11)下图是学生实体和其具备的属性。


学生实体属性图

(12)下图是服务收藏实体和其具备的属性。


服务收藏实体属性图

(13)下图是驿站留言实体和其具备的属性。


驿站留言实体属性图

(14)下图是学生请假实体和其具备的属性。


学生请假实体属性图

4.3.2 数据库物理设计

本数据库是关系型数据库,因此对二维表的结构设计也比较关键。毕竟二维表格模型就是关系型数据库中的关系模型。而一些常用的关系模型中的概念也需要了解,才可以对关系模型进行设计。下面就简单介绍关系,元组,属性,域,关键字等常用概念的含义。

关系:关系就是数据库中的一张数据表,每张数据表都有命名,也就是每个关系也有名字,那就是数据表名;

元组:元组就是数据表中的一行记录;

属性:属性就是数据表中的字段,也就是数据表中的一列;

域:域就是对数据表中属性的取值进行限定;

关键字:关键字就是数据表中的主键;

在了解了表结构设计的常用概念后,接下来就需要使用前面绘制的E-R模型完成表结构的设计工作,并在数据库中创建数据表,并为各个数据表进行命名。以下就对设计的结果通过表格形式进行展示。

表4.1字典表

序号列名数据类型说明允许空
1IdIntid
2dic_codeString字段
3dic_nameString字段名
4code_indexInteger编码
5index_nameString编码名字
6super_idInteger父字段id
7beizhuString备注
8create_timeDate创建时间
表4.2校园论坛表
序号列名数据类型说明允许空
1IdIntid
2forum_nameString帖子标题
3yonghu_idInteger学生
4jiaoshi_idInteger教师
5users_idInteger管理员
6forum_contentString发布内容
7super_idsInteger父id
8forum_state_typesInteger帖子状态
9insert_timeDate发帖时间
10update_timeDate修改时间
11create_timeDate创建时间
表4.3每日健康填报表
序号列名数据类型说明允许空
1IdIntid
2yonghu_idInteger学生
3jiankangtianbao_nameString填报标题
4jiankangtianbao_tiwenBigDecimal当前体温
5jiankangtianbao_textString填报详情
6insert_timeDate填报时间
7create_timeDate创建时间
表4.4健康驿站表
序号列名数据类型说明允许空
1IdIntid
2jiankangyizhan_nameString驿站名称
3jiankangyizhan_photoString驿站照片
4jiankangyizhan_addressString驿站地址
5jiankangyizhan_fzrString负责人
6jiankangyizhan_phoneString联系方式
7jiankangyizhan_typesInteger驿站类型
8jiankangyizhan_clicknumInteger驿站热度
9jiankangyizhan_contentString驿站介绍
10data_deleteInteger逻辑删除
11insert_timeDate录入时间
12create_timeDate创建时间 homeMain
表4.5驿站收藏表
序号列名数据类型说明允许空
1IdIntid
2jiankangyizhan_idInteger驿站
3yonghu_idInteger学生
4jiankangyizhan_collection_typesInteger类型
5insert_timeDate收藏时间
6create_timeDate创建时间
表4.6驿站留言表
序号列名数据类型说明允许空
1IdIntid
2jiankangyizhan_idInteger驿站
3yonghu_idInteger学生
4jiankangyizhan_liuyan_textString留言内容
5insert_timeDate留言时间
6reply_textString回复内容
7update_timeDate回复时间
8create_timeDate创建时间
表4.7教师表
序号列名数据类型说明允许空
1IdIntid
2jiaoshi_nameString教师名称
3jiaoshi_phoneString教师手机号
4jiaoshi_photoString教师头像
5jiaoshi_emailString教师邮箱
6data_deleteInteger逻辑删除
7insert_timeDate添加时间
8create_timeDate创建时间
表4.8校园健康资讯表
序号列名数据类型说明允许空
1IdIntid
2news_nameString资讯标题
3news_typesInteger资讯类型
4news_photoString资讯图片
5insert_timeDate添加时间
6news_contentString资讯详情
7create_timeDate创建时间
表4.9体检服务表
序号列名数据类型说明允许空
1IdIntid
2jiankangyizhan_idInteger驿站
3tijian_nameString体检服务名称
4tijian_photoString体检服务照片
5tijian_typesInteger体检服务类型
6tijian_priceBigDecimal体检费用
7tijian_clicknumInteger体检服务热度
8tijian_contentString体检服务介绍
9data_deleteInteger逻辑删除
10insert_timeDate录入时间
11create_timeDate创建时间 homeMain
表4.10服务收藏表
序号列名数据类型说明允许空
1IdIntid
2tijian_idInteger体检服务
3yonghu_idInteger学生
4tijian_collection_typesInteger类型
5insert_timeDate收藏时间
6create_timeDate创建时间
表4.11服务留言表
序号列名数据类型说明允许空
1IdIntid
2tijian_idInteger体检服务
3yonghu_idInteger学生
4tijian_liuyan_textString留言内容
5insert_timeDate留言时间
6reply_textString回复内容
7update_timeDate回复时间
8create_timeDate创建时间
表4.12体检预约表
序号列名数据类型说明允许空
1IdIntid
2tijian_yuyue_uuid_numberString预约编号
3tijian_idInteger体检服务
4yonghu_idInteger学生
5tijian_yuyue_timeDate预约时间
6tijian_yuyue_textString预约备注
7tijian_yuyue_yesno_typesInteger预约状态
8tijian_yuyue_yesno_textString审核回复
9tijian_yuyue_shenhe_timeDate审核时间
10insert_timeDate申请时间
11create_timeDate创建时间
表4.13学生表
序号列名数据类型说明允许空
1IdIntid
2yonghu_nameString学生名称
3yonghu_phoneString学生手机号
4yonghu_id_numberString学生身份证号
5yonghu_photoString学生头像
6yonghu_emailString学生邮箱
7data_deleteInteger逻辑删除
8insert_timeDate添加时间
9create_timeDate创建时间
表4.14学生请假表
序号列名数据类型说明允许空
1IdIntid
2yonghu_idInteger学生
3yonghuqingjia_textString请假缘由
4yonghuqingjia_typesInteger请假类型
5insert_timeDate申请时间
6yonghuqingjia_timeDate请假时间
7yonghuqingjia_numberInteger请假天数
8yonghuqingjia_yesno_typesInteger申请状态
9yonghuqingjia_yesno_textString处理意见
10yonghuqingjia_shenhe_timeDate审核时间
11create_timeDate创建时间
表4.15自测异常信息表
序号列名数据类型说明允许空
1IdIntid
2jiankangyizhan_idInteger驿站
3ziceyichang_nameString标题
4ziceyichang_mingcString隔离人名称
5ziceyichang_tiwenBigDecimal体温
6ziceyichang_typesInteger隔离状态
7ziceyichang_textString详情信息
8insert_timeDate记录时间
9create_timeDate创建时间
表4.16管理员表
序号列名数据类型说明允许空
1IdIntid
2usernameString医院名
3passwordString密码
4roleString角色
5addtimeDate新增时间

5.1学生信息管理

如图5.1显示的就是学生信息管理页面,此页面提供给管理员的功能有:学生信息的查询管理,可以删除学生信息、修改学生信息、新增学生信息,

还进行了对用户名称的模糊查询的条件

图5.1 学生信息管理页面

5.2 体检服务管理

如图5.2显示的就是体检服务管理页面,此页面提供给管理员的功能有:查看已发布的体检服务数据,修改体检服务,体检服务作废,即可删除,还进行了对体检服务名称的模糊查询 体检服务信息的类型查询等等一些条件。

图5.2 体检服务管理页面

5.3健康驿站管理

如图5.3显示的就是健康驿站管理页面,此页面提供给管理员的功能有:根据健康驿站进行条件查询,还可以对健康驿站进行新增、修改、查询操作等等。

图5.3 健康驿站管理页面

5.1校园健康资讯管理

如图5.4显示的就是校园健康资讯管理页面,此页面提供给管理员的功能有:根据校园健康资讯进行新增、修改、查询操作等等。

图5.4 校园健康资讯管理页面

CommonUtil.java
package com.utils;

import java.util.*;

/**
 * 公共方法
 */
public class CommonUtil {
	/**
     * 获取随机字符串
     *
     * @param num
     * @return
     */
    public static String getRandomString(Integer num) {
        String base = "abcdefghijklmnopqrstuvwxyz0123456789";
        Random random = new Random();
        StringBuffer sb = new StringBuffer();
        for (int i = 0; i < num; i++) {
            int number = random.nextInt(base.length());
            sb.append(base.charAt(number));
        }
        return sb.toString();
    }


    /**
     * 检查map参数并添加缺失参数
     * @param params
     * @return
     */
    public static void checkMap(Map<String, Object> params) {
        boolean page=true,limit=true,sort=true,order=true;
        Iterator<Map.Entry<String, Object>> iter = params.entrySet().iterator();
        while (iter.hasNext()) {
            Map.Entry<String, Object> info = iter.next();
            Object key = info.getKey();
            Object value = info.getValue();
            if(value==null || "".equals(value) || "null".equals(value)){
                iter.remove();
            }else if("page".equals(key)){page=false;
            }else if("limit".equals(key)){limit=false;
            }else if("sort".equals(key)){sort=false;
            }else if("order".equals(key)){order=false;
            }
        }
        if(page){params.put("page","1");}
        if(limit){params.put("limit","10");}
        if(sort){params.put("sort","id");}
        if(order){params.put("order","desc");}
    }
}

UsersServiceImpl.java

package com.service.impl;


import java.util.List;
import java.util.Map;

import com.service.UsersService;
import org.springframework.stereotype.Service;

import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import com.dao.UsersDao;
import com.entity.UsersEntity;
import com.utils.PageUtils;
import com.utils.Query;


/**
 * 系统用户
 * @author
 */
@Service("userService")
public class UsersServiceImpl extends ServiceImpl<UsersDao, UsersEntity> implements UsersService {

	@Override
	public PageUtils queryPage(Map<String, Object> params) {
		Page<UsersEntity> page = this.selectPage(
                new Query<UsersEntity>(params).getPage(),
                new EntityWrapper<UsersEntity>()
        );
        return new PageUtils(page);
	}

	@Override
	public List<UsersEntity> selectListView(Wrapper<UsersEntity> wrapper) {
		return baseMapper.selectListView(wrapper);
	}

	@Override
	public PageUtils queryPage(Map<String, Object> params,
			Wrapper<UsersEntity> wrapper) {
		 Page<UsersEntity> page =new Query<UsersEntity>(params).getPage();
	        page.setRecords(baseMapper.selectListView(page,wrapper));
	    	PageUtils pageUtil = new PageUtils(page);
	    	return pageUtil;
	}
}

TijianLiuyanServiceImpl.java
package com.service.impl;

import com.utils.StringUtil;
import com.service.DictionaryService;
import com.utils.ClazzDiff;
import org.springframework.beans.BeanUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import java.lang.reflect.Field;
import java.util.*;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import org.springframework.transaction.annotation.Transactional;
import com.utils.PageUtils;
import com.utils.Query;
import org.springframework.web.context.ContextLoader;
import javax.servlet.ServletContext;
import javax.servlet.http.HttpServletRequest;
import org.springframework.lang.Nullable;
import org.springframework.util.Assert;
import com.dao.TijianLiuyanDao;
import com.entity.TijianLiuyanEntity;
import com.service.TijianLiuyanService;
import com.entity.view.TijianLiuyanView;

/**
 * 服务留言 服务实现类
 */
@Service("tijianLiuyanService")
@Transactional
public class TijianLiuyanServiceImpl extends ServiceImpl<TijianLiuyanDao, TijianLiuyanEntity> implements TijianLiuyanService {

    @Override
    public PageUtils queryPage(Map<String,Object> params) {
        Page<TijianLiuyanView> page =new Query<TijianLiuyanView>(params).getPage();
        page.setRecords(baseMapper.selectListView(page,params));
        return new PageUtils(page);
    }


}

list.vue
<template>
    <div class="main-content">
        <!-- 列表页 -->
        <div v-if="showFlag">
            <el-form :inline="true" :model="searchForm" class="form-content">
                <el-row :gutter="20" class="slt" :style="{justifyContent:contents.searchBoxPosition=='1'?'flex-start':contents.searchBoxPosition=='2'?'center':'flex-end'}">
                    <el-form-item label="体检服务类型">
                        <el-input prefix-icon="el-icon-search" v-model="searchForm.indexNameSearch" placeholder="体检服务类型" clearable></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button icon="el-icon-search" type="success" @click="search()">查询</el-button>
                    </el-form-item>
                </el-row>
                <el-row class="ad" :style="{justifyContent:contents.btnAdAllBoxPosition=='1'?'flex-start':contents.btnAdAllBoxPosition=='2'?'center':'flex-end'}">
                    <el-form-item>
                        <el-button
                                v-if="isAuth('dictionaryTijian','新增')"
                                type="success"
                                icon="el-icon-plus"
                                @click="addOrUpdateHandler()"
                        >新增</el-button>
                        <el-button
                                v-if="isAuth('dictionaryTijian','删除')"
                                :disabled="dataListSelections.length <= 0"
                                type="danger"
                                icon="el-icon-delete"
                                @click="deleteHandler()"
                        >删除</el-button>
                    </el-form-item>
                </el-row>
            </el-form>
            <div class="table-content">
                <el-table class="tables" :size="contents.tableSize" :show-header="contents.tableShowHeader"
                          :header-row-style="headerRowStyle" :header-cell-style="headerCellStyle"
                          :border="contents.tableBorder"
                          :fit="contents.tableFit"
                          :stripe="contents.tableStripe"
                          :row-style="rowStyle"
                          :cell-style="cellStyle"
                          :style="{width: '100%',fontSize:contents.tableContentFontSize,color:contents.tableContentFontColor}"
                          v-if="isAuth('dictionaryTijian','查看')"
                          :data="dataList"
                          v-loading="dataListLoading"
                          @selection-change="selectionChangeHandler">
                    <el-table-column  v-if="contents.tableSelection"
                                      type="selection"
                                      header-align="center"
                                      align="center"
                                      width="50">
                    </el-table-column>
                    <el-table-column label="索引" v-if="contents.tableIndex" type="index" width="50" />
                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
                                      prop="codeIndex"
                                      header-align="center"
                                      label="体检服务类型编码">
                        <template slot-scope="scope">
                            {{scope.row.codeIndex}}
                        </template>
                    </el-table-column>
                    <el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
                                      prop="indexName"
                                      header-align="center"
                                      label="体检服务类型名称">
                        <template slot-scope="scope">
                            {{scope.row.indexName}}
                        </template>
                    </el-table-column>
                    <!--<el-table-column  :sortable="contents.tableSortable" :align="contents.tableAlign"
                                      prop="beizhu"
                                      header-align="center"
                                      label="备注">
                        <template slot-scope="scope">
                            {{scope.row.beizhu}}
                        </template>
                    </el-table-column>-->
                    <el-table-column width="300" :align="contents.tableAlign"
                                     header-align="center"
                                     label="操作">
                        <template slot-scope="scope">
                            <el-button v-if="isAuth('dictionaryTijian','查看')" type="success" icon="el-icon-tickets" size="mini" @click="addOrUpdateHandler(scope.row.id,'info')">详情</el-button>
                            <el-button v-if="isAuth('dictionaryTijian','修改')" type="primary" icon="el-icon-edit" size="mini" @click="addOrUpdateHandler(scope.row.id)">修改</el-button>
                            <el-button v-if="isAuth('dictionaryTijian','删除')" type="danger" icon="el-icon-delete" size="mini" @click="deleteHandler(scope.row.id)">删除</el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <el-pagination
                        clsss="pages"
                        :layout="layouts"
                        @size-change="sizeChangeHandle"
                        @current-change="currentChangeHandle"
                        :current-page="pageIndex"
                        :page-sizes="[10, 20, 50, 100]"
                        :page-size="Number(contents.pageEachNum)"
                        :total="totalPage"
                        :small="contents.pageStyle"
                        class="pagination-content"
                        :background="contents.pageBtnBG"
                        :style="{textAlign:contents.pagePosition==1?'left':contents.pagePosition==2?'center':'right'}"
                ></el-pagination>
            </div>
        </div>
        <!-- 添加/修改页面  将父组件的search方法传递给子组件-->
        <add-or-update v-if="addOrUpdateFlag" :parent="this" ref="addOrUpdate"></add-or-update>



    </div>
</template>
<script>
    import AddOrUpdate from "./add-or-update";
    import styleJs from "../../../utils/style.js";
    export default {
        data() {
            return {
                searchForm: {
                    key: ""
                },
                form:{},
                dataList: [],
                pageIndex: 1,
                pageSize: 10,
                totalPage: 0,
                dataListLoading: false,
                dataListSelections: [],
                showFlag: true,
                sfshVisiable: false,
                shForm: {},
                chartVisiable: false,
                addOrUpdateFlag:false,
                contents:null,
                layouts: '',



            };
        },
        created() {
            this.contents = styleJs.listStyle();
            this.init();
            this.getDataList();
            this.contentStyleChange()
        },
        mounted() {

        },
        filters: {
            htmlfilter: function (val) {
                return val.replace(/<[^>]*>/g).replace(/undefined/g,'');
            }
        },
        components: {
            AddOrUpdate,
        },
        methods: {
            contentStyleChange() {
                this.contentSearchStyleChange()
                this.contentBtnAdAllStyleChange()
                this.contentSearchBtnStyleChange()
                this.contentTableBtnStyleChange()
                this.contentPageStyleChange()
            },
            contentSearchStyleChange() {
                this.$nextTick(()=>{
                    document.querySelectorAll('.form-content .slt .el-input__inner').forEach(el=>{
                    let textAlign = 'left'
                    if(this.contents.inputFontPosition == 2) textAlign = 'center'
                if(this.contents.inputFontPosition == 3) textAlign = 'right'
                el.style.textAlign = textAlign
                el.style.height = this.contents.inputHeight
                el.style.lineHeight = this.contents.inputHeight
                el.style.color = this.contents.inputFontColor
                el.style.fontSize = this.contents.inputFontSize
                el.style.borderWidth = this.contents.inputBorderWidth
                el.style.borderStyle = this.contents.inputBorderStyle
                el.style.borderColor = this.contents.inputBorderColor
                el.style.borderRadius = this.contents.inputBorderRadius
                el.style.backgroundColor = this.contents.inputBgColor
            })
                if(this.contents.inputTitle) {
                    document.querySelectorAll('.form-content .slt .el-form-item__label').forEach(el=>{
                        el.style.color = this.contents.inputTitleColor
                    el.style.fontSize = this.contents.inputTitleSize
                    el.style.lineHeight = this.contents.inputHeight
                })
                }
                setTimeout(()=>{
                    document.querySelectorAll('.form-content .slt .el-input__prefix').forEach(el=>{
                    el.style.color = this.contents.inputIconColor
                el.style.lineHeight = this.contents.inputHeight
            })
                document.querySelectorAll('.form-content .slt .el-input__suffix').forEach(el=>{
                    el.style.color = this.contents.inputIconColor
                el.style.lineHeight = this.contents.inputHeight
            })
                document.querySelectorAll('.form-content .slt .el-input__icon').forEach(el=>{
                    el.style.lineHeight = this.contents.inputHeight
            })
            },10)

            })
            },
            // 搜索按钮
            contentSearchBtnStyleChange() {
                this.$nextTick(()=>{
                    document.querySelectorAll('.form-content .slt .el-button--success').forEach(el=>{
                    el.style.height = this.contents.searchBtnHeight
                el.style.color = this.contents.searchBtnFontColor
                el.style.fontSize = this.contents.searchBtnFontSize
                el.style.borderWidth = this.contents.searchBtnBorderWidth
                el.style.borderStyle = this.contents.searchBtnBorderStyle
                el.style.borderColor = this.contents.searchBtnBorderColor
                el.style.borderRadius = this.contents.searchBtnBorderRadius
                el.style.backgroundColor = this.contents.searchBtnBgColor
            })
            })
            },
            // 新增、批量删除
            contentBtnAdAllStyleChange() {
                this.$nextTick(()=>{
                    document.querySelectorAll('.form-content .ad .el-button--success').forEach(el=>{
                    el.style.height = this.contents.btnAdAllHeight
                el.style.color = this.contents.btnAdAllAddFontColor
                el.style.fontSize = this.contents.btnAdAllFontSize
                el.style.borderWidth = this.contents.btnAdAllBorderWidth
                el.style.borderStyle = this.contents.btnAdAllBorderStyle
                el.style.borderColor = this.contents.btnAdAllBorderColor
                el.style.borderRadius = this.contents.btnAdAllBorderRadius
                el.style.backgroundColor = this.contents.btnAdAllAddBgColor
            })
                document.querySelectorAll('.form-content .ad .el-button--danger').forEach(el=>{
                    el.style.height = this.contents.btnAdAllHeight
                el.style.color = this.contents.btnAdAllDelFontColor
                el.style.fontSize = this.contents.btnAdAllFontSize
                el.style.borderWidth = this.contents.btnAdAllBorderWidth
                el.style.borderStyle = this.contents.btnAdAllBorderStyle
                el.style.borderColor = this.contents.btnAdAllBorderColor
                el.style.borderRadius = this.contents.btnAdAllBorderRadius
                el.style.backgroundColor = this.contents.btnAdAllDelBgColor
            })
                document.querySelectorAll('.form-content .ad .el-button--warning').forEach(el=>{
                    el.style.height = this.contents.btnAdAllHeight
                el.style.color = this.contents.btnAdAllWarnFontColor
                el.style.fontSize = this.contents.btnAdAllFontSize
                el.style.borderWidth = this.contents.btnAdAllBorderWidth
                el.style.borderStyle = this.contents.btnAdAllBorderStyle
                el.style.borderColor = this.contents.btnAdAllBorderColor
                el.style.borderRadius = this.contents.btnAdAllBorderRadius
                el.style.backgroundColor = this.contents.btnAdAllWarnBgColor
            })
            })
            },
            // 表格
            rowStyle({ row, rowIndex}) {
                if (rowIndex % 2 == 1) {
                    if(this.contents.tableStripe) {
                        return {color:this.contents.tableStripeFontColor}
                    }
                } else {
                    return ''
                }
            },
            cellStyle({ row, rowIndex}){
                if (rowIndex % 2 == 1) {
                    if(this.contents.tableStripe) {
                        return {backgroundColor:this.contents.tableStripeBgColor}
                    }
                } else {
                    return ''
                }
            },
            headerRowStyle({ row, rowIndex}){
                return {color: this.contents.tableHeaderFontColor}
            },
            headerCellStyle({ row, rowIndex}){
                return {backgroundColor: this.contents.tableHeaderBgColor}
            },
            // 表格按钮
            contentTableBtnStyleChange(){
            },
            // 分页
            contentPageStyleChange(){
                let arr = []
                if(this.contents.pageTotal) arr.push('total')
                if(this.contents.pageSizes) arr.push('sizes')
                if(this.contents.pagePrevNext){
                    arr.push('prev')
                    if(this.contents.pagePager) arr.push('pager')
                    arr.push('next')
                }
                if(this.contents.pageJumper) arr.push('jumper')
                this.layouts = arr.join()
                this.contents.pageEachNum = 10
            },

            init () {
            },
            search() {
                this.pageIndex = 1;
                this.getDataList();
            },
            // 获取数据列表
            getDataList() {
                this.dataListLoading = true;
                let params = {
                    page: this.pageIndex,
                    limit: this.pageSize,
                    sort: 'id',
                }
                if(this.searchForm.indexNameSearch!='' && this.searchForm.indexNameSearch!=undefined){
                    params['indexName'] = this.searchForm.indexNameSearch
                }
                //本表的
                params['dicCode'] = "tijian_types"//编码名字
                params['dicName'] = "体检服务类型",//汉字名字
                this.$http({
                    url: "dictionary/page",
                    method: "get",
                    params: params
                }).then(({ data }) => {
                    if (data && data.code === 0) {
                    this.dataList = data.data.list;
                    this.totalPage = data.data.total;
                } else {
                    this.dataList = [];
                    this.totalPage = 0;
                }
                this.dataListLoading = false;
            });
            },
            // 每页数
            sizeChangeHandle(val) {
                this.pageSize = val;
                this.pageIndex = 1;
                this.getDataList();
            },
            // 当前页
            currentChangeHandle(val) {
                this.pageIndex = val;
                this.getDataList();
            },
            // 多选
            selectionChangeHandler(val) {
                this.dataListSelections = val;
            },
            // 添加/修改
            addOrUpdateHandler(id,type) {
                this.showFlag = false;
                this.addOrUpdateFlag = true;
                this.crossAddOrUpdateFlag = false;
                if(type!='info'){
                    type = 'else';
                }
                this.$nextTick(() => {
                    this.$refs.addOrUpdate.init(id,type);
            });
            },
            // 删除
            deleteHandler(id) {
                var ids = id
                        ? [Number(id)]
                        : this.dataListSelections.map(item => {
                    return Number(item.id);
            });
                this.$confirm(`确定进行[${id ? "删除" : "批量删除"}]操作?`, "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                }).then(() => {
                    this.$http({
                    url: "dictionary/delete",
                    method: "post",
                    data: ids
                }).then(({ data }) => {
                    if (data && data.code === 0) {
                    this.$message({
                        message: "操作成功",
                        type: "success",
                        duration: 1500,
                        onClose: () => {
                        this.search();
                }
                });
                } else {
                    this.$message.error(data.msg);
                }
            });
            });
            },


        }

    };
</script>
<style lang="scss" scoped>
.slt {
    margin: 0 !important;
    display: flex;
  }

  .ad {
    margin: 0 !important;
    display: flex;
  }

  .pages {
    & /deep/ el-pagination__sizes{
      & /deep/ el-input__inner {
        height: 22px;
        line-height: 22px;
      }
    }
  }


  .el-button+.el-button {
    margin:0;
  }

  .tables {
	& /deep/ .el-button--success {
		height: 40px;
		color: #333;
		font-size: 14px;
		border-width: 3px;
		border-style: solid;
		border-color: var(--publicMainColor);
		border-radius: 40px;
		background-color: #fff;
	}

	& /deep/ .el-button--primary {
		height: 40px;
		color: #333;
		font-size: 14px;
		border-width: 3px;
		border-style: solid;
		border-color: var(--publicMainColor);
		border-radius: 40px;
		background-color: #fff;
	}

	& /deep/ .el-button--danger {
		height: 40px;
		color: #333;
		font-size: 14px;
		border-width: 3px;
		border-style: solid;
		border-color: var(--publicMainColor);
		border-radius: 40px;
		background-color: #fff;
	}

    & /deep/ .el-button {
      margin: 4px;
    }
  }
	.form-content {
		background: transparent;
	}
	.table-content {
		background: transparent;
	}

	.tables /deep/ .el-table__body tr {
				background-color: rgba(245, 245, 245, 0) !important;
				color: #606266 !important;
	 }
	.tables /deep/ .el-table__body tr.el-table__row--striped td {
	    background: transparent;
	}
	.tables /deep/ .el-table__body tr.el-table__row--striped {
		background-color: #F5F7FA !important;
		color: #606266 !important;
	}

	 .tables /deep/ .el-table__body tr:hover>td {
	   	   background-color: var(--publicSubColor) !important;
	   	   	   color: #333 !important;
	   	 }</style>



声明

本博客适用于广泛的学术和教育用途,包括但不限于个人学习、开发设计,产品设计。仅供学习参考,旨在为读者提供深入理解和学术研究的材料。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值