如何使用ssm实现基于web的药品管理系统+vue

最新推荐文章于 2024-10-02 07:55:04 发布
最新推荐文章于 2024-10-02 07:55:04 发布
阅读量567 收藏 21
点赞数 21
分类专栏： ssm 管理系统 计算机毕设 文章标签： ssm 后端 java
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/a253399414/article/details/141528062
版权
管理系统 同时被 3 个专栏收录
237 篇文章 0 订阅
订阅专栏
计算机毕设
237 篇文章 0 订阅
订阅专栏
ssm
133 篇文章 0 订阅
订阅专栏

@TOC

ssm175基于web的药品管理系统+vue

第1章 绪论

1.1 课题背景

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

1.2 课题意义

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

总之，在实际中使用药品管理系统，其意义如下：

第一点：药品管理系统的实际运用，可以帮助管理人员在短时间内完成信息处理工作；

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

第三点：可以实现信息管理计算机化；

第四点：可以降低信息管理成本；

1.3 研究内容

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

第一部分：介绍药品管理系统研究的背景意义，便于用户了解系统；

第二部分：介绍开发药品管理系统需要搭建的环境，包括技术和工具；

第三部分：介绍用户对药品管理系统的功能要求，以及对药品管理系统的性能要求等；

第四部分：介绍数据库的设计方案，以及根据功能要求设计的功能结构；

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

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

第2章 开发环境与技术

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

2.1 MYSQL数据库

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

2.2 JSP技术

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

2.3 SSM框架

SSM框架不是一个框架的名称，而是三个框架的首字母缩写，分别是Spring框架、SpringMVC框架、MyBatis框架。是目前Java开发者中学习的首选框架。

Spring框架继承了JavaEE和EJB框架的优点，在依赖注入方面去掉了臃肿的配置，在面向切面方面也简化了代码数量，提高了代码品质。依赖注解进行配置，让所有的依赖都可以通过程序的自动配置和寻找，减少了代码写作数量，提高了代码阅读性。

SpringMVC框架与Spring只是一个公司的，在底层代码结构上可以复用，但是最主要的功能是对数据提交请求进行过滤，并且对数据的返回进行过滤，不限于页面是JSP技术，也可以是其他的技术，更容易大型开发的集合技术。

MyBatis框架摒弃了Hibernate框架的配置臃肿方面，有时候Hibernate框架业务比较复杂的时候，代码量反而增加，性能下降，无法对底层的数据库语句优化，而MyBatis框架则有效的解决了这个方面，可以通过Java语句，对数据库操作语句进行优化，代码更简洁，执行效率更高，并且可以生产一些模块化代码，解决了开发过程中容易出现的实体映射方面的操作。

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

3.4 功能需求

不同的系统提供的服务也不相同，其对应的功能也不相同，所以，系统开工前，需要明确其用途，确定其功能。由此，才可以进行各个任务的开展。

药品管理系统经过分析，确定了其需要设置管理员的角色，其操作的功能通过用例图展示（见下图）。管理员统计药品销售量，可以导出药品出入库记录，管理药品以及报损信息。

图3.5 管理员用例图

药品管理系统经过分析，确定了其需要设置销售员的角色，其操作的功能通过用例图展示（见下图）。销售员管理药品，对药品进行销售，入库，出库以及报损。

图3.6 销售员用例图

第4章 系统设计

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

4.1 设计原则

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

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

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

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

4.2 功能结构设计

在前面分析的管理员功能的基础上，进行接下来的设计工作，最终展示设计的管理员结构图（见下图）。管理员统计药品销售量，可以导出药品出入库记录，管理药品以及报损信息。

图4.1 管理员功能结构图

在前面分析的销售员功能的基础上，进行接下来的设计工作，最终展示设计的销售员结构图（见下图）。销售员管理药品，对药品进行销售，入库，出库以及报损。

图4.2 销售员功能结构图

4.3 数据库设计

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

4.3.1 数据库概念设计

这部分内容需要借助数据库关系图来完成，也需要使用专门绘制数据库关系图的工具，比如Visio工具就可以设计E-R图（数据库关系图）。设计数据库，也需要按照设计的流程进行，首先还是要根据需求完成实体的确定，分析实体具有的特征，还有对实体间的关联关系进行确定。最后才是使用E-R模型的表示方法，绘制本系统的E-R图。不管是使用亿图软件，还是Visio工具，对于E-R模型的表示符号都一样，通常矩形代表实体，实体间存在的关系用菱形符号表示，实体的属性也就是实体的特征用符号椭圆表示。最后使用直线将矩形，菱形和椭圆等符号连接起来。接下来就开始对本系统的E-R图进行绘制。

（1）下图是出库记录实体和其具备的属性。

图4.4 出库记录实体属性图

（2）下图是药品实体和其具备的属性。

图4.5 药品实体属性图

（3）下图是入库记录实体和其具备的属性。

图4.6 入库记录实体属性图

  1. 下图是药品分类实体和其具备的属性。

图4.7 药品分类实体属性图

  1. 下图为上述各实体间相互之间的关系。

图4.8 实体间关系E-R图

4.3.2 数据库物理设计

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

关系：关系就是数据库中的一张数据表，每张数据表都有命名，也就是每个关系也有名字，那就是数据表名；

元组：元组就是数据表中的一行记录；

属性：属性就是数据表中的字段，也就是数据表中的一列；

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

关键字：关键字就是数据表中的主键；

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

表4.1 报损申报信息表

字段类型空默认注释
id (主键)bigint(20)否主键
addtimetimestamp否CURRENT_TIMESTAMP创建时间
gonghaovarchar(200)是NULL工号
xingmingvarchar(200)是NULL姓名
yaopinbianhaovarchar(200)是NULL药品编号
yaopinmingchengvarchar(200)是NULL药品名称
pinpaivarchar(200)是NULL品牌
baosunshijiandatetime是NULL报损时间
baosunshuliangint(11)是NULL报损数量
yuanyinshuominglongtext是NULL原因说明

表4.2 出库记录信息表

字段类型空默认注释
id (主键)bigint(20)否主键
addtimetimestamp否CURRENT_TIMESTAMP创建时间
shuliangint(11)是NULL数量
chukushuominglongtext是NULL出库说明
yaopinbianhaovarchar(200)是NULL药品编号
yaopinmingchengvarchar(200)是NULL药品名称
leibievarchar(200)是NULL类别
pinpaivarchar(200)是NULL品牌
shengchanchangjiavarchar(200)是NULL生产厂家
gonghaovarchar(200)是NULL工号
xingmingvarchar(200)是NULL姓名
chukushijiandatetime是NULL出库时间

表4.3 入库记录信息表

字段类型空默认注释
id (主键)bigint(20)否主键
addtimetimestamp否CURRENT_TIMESTAMP创建时间
shuliangint(11)是NULL数量
rukushuominglongtext是NULL入库说明
yaopinbianhaovarchar(200)是NULL药品编号
yaopinmingchengvarchar(200)是NULL药品名称
leibievarchar(200)是NULL类别
pinpaivarchar(200)是NULL品牌
shengchanchangjiavarchar(200)是NULL生产厂家
gonghaovarchar(200)是NULL工号
xingmingvarchar(200)是NULL姓名
rukushijiandatetime是NULL入库时间

表4.4 管理员信息表

字段类型空默认注释
id (主键)bigint(20)否主键
usernamevarchar(100)否用户名
passwordvarchar(100)否密码
rolevarchar(100)是管理员角色
addtimetimestamp否CURRENT_TIMESTAMP新增时间

表4.5 销售记录信息表

字段类型空默认注释
id (主键)bigint(20)否主键
addtimetimestamp否CURRENT_TIMESTAMP创建时间
gonghaovarchar(200)是NULL工号
xingmingvarchar(200)是NULL姓名
yaopinbianhaovarchar(200)是NULL药品编号
yaopinmingchengvarchar(200)是NULL药品名称
leibievarchar(200)是NULL类别
pinpaivarchar(200)是NULL品牌
shengchanchangjiavarchar(200)是NULL生产厂家
shuliangint(11)是NULL数量
jiageint(11)是NULL价格
zongjiaint(11)是NULL总价
xiaoshoushuominglongtext是NULL销售说明

表4.6 销售员信息表

字段类型空默认注释
id (主键)bigint(20)否主键
addtimetimestamp否CURRENT_TIMESTAMP创建时间
gonghaovarchar(200)否工号
mimavarchar(200)否密码
xingmingvarchar(200)是NULL姓名
xingbievarchar(200)是NULL性别
shoujivarchar(200)否手机
youxiangvarchar(200)是NULL邮箱
shenfenzhengvarchar(200)否身份证
zhaopianvarchar(200)是NULL照片

表4.7 药品分类信息表

字段类型空默认注释
id (主键)bigint(20)否主键
addtimetimestamp否CURRENT_TIMESTAMP创建时间
leibievarchar(200)是NULL类别

表4.8 药品信息表

字段类型空默认注释
id (主键)bigint(20)否主键
addtimetimestamp否CURRENT_TIMESTAMP创建时间
yaopinbianhaovarchar(200)是NULL药品编号
yaopinmingchengvarchar(200)是NULL药品名称
leibievarchar(200)是NULL类别
pinpaivarchar(200)是NULL品牌
shengchanchangjiavarchar(200)是NULL生产厂家
shuliangint(11)是NULL数量
jiageint(11)是NULL价格
guoqishijiandate是NULL过期时间
tupianvarchar(200)是NULL图片

第5章 系统实现

进入到这个环节，也就可以及时检查出前面设计的需求是否可靠了。一个设计良好的方案在运用于系统实现中，是会帮助系统编制人员节省时间，并提升开发效率的。所以在系统的编程阶段，也就是系统实现阶段，对于一些不合理的设计需求，也是可以及时发现。因为设计的方案是完全指导系统的编码过程的。

5.1 管理员功能实现

5.1.1 销售员管理

管理员进入指定功能操作区之后可以管理销售员。其页面见下图。管理员主要负责销售员信息的增删改查。

图5.1 销售员管理页面

5.1.2 药品信息管理

管理员进入指定功能操作区之后可以管理药品信息。其页面见下图。管理员导出本页面显示的药品信息，修改药品的资料，包括生产厂家，价格，过期时间等信息。

图5.2 药品信息管理页面

5.1.3 药品分类管理

管理员进入指定功能操作区之后可以管理药品分类。其页面见下图。管理员在本页面可以新增药品类别，修改药品类别。

图5.3 药品分类管理页面

5.1.4 入库记录管理

管理员进入指定功能操作区之后可以管理入库记录。其页面见下图。管理员查看药品入库记录，可以导出药品的入库记录信息。

图5.4 入库记录管理页面

5.1.5 销售记录

管理员进入指定功能操作区之后可以查看销售记录的统计报表。其页面见下图。管理员通过柱形图查看各种药品对应的销售数量。

图5.5 销售记录页面

5.2 销售员功能实现

5.2.1 药品信息管理

销售员进入指定功能操作区之后可以管理药品信息。其页面见下图。销售员查询药品，对药品进行入库，销售，出库以及报损操作。

图5.6 药品信息管理页面

5.2.2 药品入库

销售员进入指定功能操作区之后可以对药品进行入库。其页面见下图。销售员核对需要入库的药品信息，登记入库数量以及入库说明信息即可提交。

图5.7 药品入库页面

5.2.3 药品销售

销售员进入指定功能操作区之后可以登记药品销售信息。其页面见下图。销售员核对需要销售的药品信息，登记销售数量还有销售说明即可提交信息。

图5.8 药品销售页面

5.2.4 药品报损

销售员进入指定功能操作区之后可以登记药品报损信息。其页面见下图。销售员核对报损的药品信息，登记报损数量以及原因说明即可提交信息。

图5.9 药品报损页面

TokenServiceImpl.java

package com.service.impl;


import java.util.Calendar;
import java.util.Date;
import java.util.List;
import java.util.Map;

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.TokenDao;
import com.entity.TokenEntity;
import com.entity.TokenEntity;
import com.service.TokenService;
import com.utils.CommonUtil;
import com.utils.PageUtils;
import com.utils.Query;


/**
 * token
 */
@Service("tokenService")
public class TokenServiceImpl extends ServiceImpl<TokenDao, TokenEntity> implements TokenService {

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

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

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

	@Override
	public String generateToken(Long userid,String username, String tableName, String role) {
		TokenEntity tokenEntity = this.selectOne(new EntityWrapper<TokenEntity>().eq("userid", userid).eq("role", role));
		String token = CommonUtil.getRandomString(32);
		Calendar cal = Calendar.getInstance();   
    	cal.setTime(new Date());   
    	cal.add(Calendar.HOUR_OF_DAY, 1);
		if(tokenEntity!=null) {
			tokenEntity.setToken(token);
			tokenEntity.setExpiratedtime(cal.getTime());
			this.updateById(tokenEntity);
		} else {
			this.insert(new TokenEntity(userid,username, tableName, role, token, cal.getTime()));
		}
		return token;
	}

	@Override
	public TokenEntity getTokenEntity(String token) {
		TokenEntity tokenEntity = this.selectOne(new EntityWrapper<TokenEntity>().eq("token", token));
		if(tokenEntity == null || tokenEntity.getExpiratedtime().getTime()<new Date().getTime()) {
			return null;
		}
		return tokenEntity;
	}
}
ConfigController.java

package com.controller;


import java.util.Arrays;
import java.util.Map;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;

import com.annotation.IgnoreAuth;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.entity.ConfigEntity;
import com.service.ConfigService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.ValidatorUtils;

/**
 * 登录相关
 */
@RequestMapping("config")
@RestController
public class ConfigController{
	
	@Autowired
	private ConfigService configService;

	/**
     * 列表
     */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params,ConfigEntity config){
        EntityWrapper<ConfigEntity> ew = new EntityWrapper<ConfigEntity>();
    	PageUtils page = configService.queryPage(params);
        return R.ok().put("data", page);
    }
    
	/**
     * 列表
     */
    @IgnoreAuth
    @RequestMapping("/list")
    public R list(@RequestParam Map<String, Object> params,ConfigEntity config){
        EntityWrapper<ConfigEntity> ew = new EntityWrapper<ConfigEntity>();
    	PageUtils page = configService.queryPage(params);
        return R.ok().put("data", page);
    }

    /**
     * 信息
     */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") String id){
        ConfigEntity config = configService.selectById(id);
        return R.ok().put("data", config);
    }
    
    /**
     * 详情
     */
    @IgnoreAuth
    @RequestMapping("/detail/{id}")
    public R detail(@PathVariable("id") String id){
        ConfigEntity config = configService.selectById(id);
        return R.ok().put("data", config);
    }
    
    /**
     * 根据name获取信息
     */
    @RequestMapping("/info")
    public R infoByName(@RequestParam String name){
        ConfigEntity config = configService.selectOne(new EntityWrapper<ConfigEntity>().eq("name", "faceFile"));
        return R.ok().put("data", config);
    }
    
    /**
     * 保存
     */
    @PostMapping("/save")
    public R save(@RequestBody ConfigEntity config){
//    	ValidatorUtils.validateEntity(config);
    	configService.insert(config);
        return R.ok();
    }

    /**
     * 修改
     */
    @RequestMapping("/update")
    public R update(@RequestBody ConfigEntity config){
//        ValidatorUtils.validateEntity(config);
        configService.updateById(config);//全部更新
        return R.ok();
    }

    /**
     * 删除
     */
    @RequestMapping("/delete")
    public R delete(@RequestBody Long[] ids){
    	configService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
}
RukujiluController.java
package com.controller;

import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Calendar;
import java.util.Map;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Date;
import java.util.List;
import javax.servlet.http.HttpServletRequest;

import com.utils.ValidatorUtils;
import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.format.annotation.DateTimeFormat;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.annotation.IgnoreAuth;

import com.entity.RukujiluEntity;
import com.entity.view.RukujiluView;

import com.service.RukujiluService;
import com.service.TokenService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.MD5Util;
import com.utils.MPUtil;
import com.utils.CommonUtil;


/**
 * 入库记录
 * 后端接口
 * @author 
 * @email 
 * @date 2021-04-12 19:05:57
 */
@RestController
@RequestMapping("/rukujilu")
public class RukujiluController {
    @Autowired
    private RukujiluService rukujiluService;
    


    /**
     * 后端列表
     */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params,RukujiluEntity rukujilu, 
		HttpServletRequest request){

		String tableName = request.getSession().getAttribute("tableName").toString();
		if(tableName.equals("xiaoshouyuan")) {
			rukujilu.setGonghao((String)request.getSession().getAttribute("username"));
		}
        EntityWrapper<RukujiluEntity> ew = new EntityWrapper<RukujiluEntity>();
		PageUtils page = rukujiluService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, rukujilu), params), params));
        return R.ok().put("data", page);
    }
    
    /**
     * 前端列表
     */
    @RequestMapping("/list")
    public R list(@RequestParam Map<String, Object> params,RukujiluEntity rukujilu, HttpServletRequest request){
        EntityWrapper<RukujiluEntity> ew = new EntityWrapper<RukujiluEntity>();
		PageUtils page = rukujiluService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, rukujilu), params), params));
        return R.ok().put("data", page);
    }

	/**
     * 列表
     */
    @RequestMapping("/lists")
    public R list( RukujiluEntity rukujilu){
       	EntityWrapper<RukujiluEntity> ew = new EntityWrapper<RukujiluEntity>();
      	ew.allEq(MPUtil.allEQMapPre( rukujilu, "rukujilu")); 
        return R.ok().put("data", rukujiluService.selectListView(ew));
    }

	 /**
     * 查询
     */
    @RequestMapping("/query")
    public R query(RukujiluEntity rukujilu){
        EntityWrapper< RukujiluEntity> ew = new EntityWrapper< RukujiluEntity>();
 		ew.allEq(MPUtil.allEQMapPre( rukujilu, "rukujilu")); 
		RukujiluView rukujiluView =  rukujiluService.selectView(ew);
		return R.ok("查询入库记录成功").put("data", rukujiluView);
    }
	
    /**
     * 后端详情
     */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id){
        RukujiluEntity rukujilu = rukujiluService.selectById(id);
        return R.ok().put("data", rukujilu);
    }

    /**
     * 前端详情
     */
    @RequestMapping("/detail/{id}")
    public R detail(@PathVariable("id") Long id){
        RukujiluEntity rukujilu = rukujiluService.selectById(id);
        return R.ok().put("data", rukujilu);
    }
    



    /**
     * 后端保存
     */
    @RequestMapping("/save")
    public R save(@RequestBody RukujiluEntity rukujilu, HttpServletRequest request){
    	rukujilu.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    	//ValidatorUtils.validateEntity(rukujilu);

        rukujiluService.insert(rukujilu);
        return R.ok();
    }
    
    /**
     * 前端保存
     */
    @RequestMapping("/add")
    public R add(@RequestBody RukujiluEntity rukujilu, HttpServletRequest request){
    	rukujilu.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    	//ValidatorUtils.validateEntity(rukujilu);

        rukujiluService.insert(rukujilu);
        return R.ok();
    }

    /**
     * 修改
     */
    @RequestMapping("/update")
    public R update(@RequestBody RukujiluEntity rukujilu, HttpServletRequest request){
        //ValidatorUtils.validateEntity(rukujilu);
        rukujiluService.updateById(rukujilu);//全部更新
        return R.ok();
    }
    

    /**
     * 删除
     */
    @RequestMapping("/delete")
    public R delete(@RequestBody Long[] ids){
        rukujiluService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
    
    /**
     * 提醒接口
     */
	@RequestMapping("/remind/{columnName}/{type}")
	public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request, 
						 @PathVariable("type") String type,@RequestParam Map<String, Object> map) {
		map.put("column", columnName);
		map.put("type", type);
		
		if(type.equals("2")) {
			SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
			Calendar c = Calendar.getInstance();
			Date remindStartDate = null;
			Date remindEndDate = null;
			if(map.get("remindstart")!=null) {
				Integer remindStart = Integer.parseInt(map.get("remindstart").toString());
				c.setTime(new Date()); 
				c.add(Calendar.DAY_OF_MONTH,remindStart);
				remindStartDate = c.getTime();
				map.put("remindstart", sdf.format(remindStartDate));
			}
			if(map.get("remindend")!=null) {
				Integer remindEnd = Integer.parseInt(map.get("remindend").toString());
				c.setTime(new Date());
				c.add(Calendar.DAY_OF_MONTH,remindEnd);
				remindEndDate = c.getTime();
				map.put("remindend", sdf.format(remindEndDate));
			}
		}
		
		Wrapper<RukujiluEntity> wrapper = new EntityWrapper<RukujiluEntity>();
		if(map.get("remindstart")!=null) {
			wrapper.ge(columnName, map.get("remindstart"));
		}
		if(map.get("remindend")!=null) {
			wrapper.le(columnName, map.get("remindend"));
		}

		String tableName = request.getSession().getAttribute("tableName").toString();
		if(tableName.equals("xiaoshouyuan")) {
			wrapper.eq("gonghao", (String)request.getSession().getAttribute("username"));
		}

		int count = rukujiluService.selectCount(wrapper);
		return R.ok().put("count", count);
	}
	


}
add-or-update.vue
<template>
  <div class="addEdit-block">
    <el-form
      class="detail-form-content"
      ref="ruleForm"
      :model="ruleForm"
      :rules="rules"
      label-width="80px"
	  :style="{backgroundColor:addEditForm.addEditBoxColor}"
    >
      <el-row>
      <el-col :span="12">
        <el-form-item class="input" v-if="type!='info'"  label="用户名" prop="username">
          <el-input v-model="ruleForm.username" 
              placeholder="用户名" clearable  :readonly="ro.username"></el-input>
        </el-form-item>
        <div v-else>
          <el-form-item class="input" label="用户名" prop="username">
              <el-input v-model="ruleForm.username" 
                placeholder="用户名" readonly></el-input>
          </el-form-item>
        </div>
      </el-col>
      <el-col :span="12">
        <el-form-item class="input" v-if="type!='info'"  label="密码" prop="password">
          <el-input v-model="ruleForm.password" 
              placeholder="密码" clearable  :readonly="ro.password"></el-input>
        </el-form-item>
        <div v-else>
          <el-form-item class="input" label="密码" prop="password">
              <el-input v-model="ruleForm.password" 
                placeholder="密码" readonly></el-input>
          </el-form-item>
        </div>
      </el-col>
      </el-row>
      <el-form-item class="btn">
        <el-button v-if="type!='info'" type="primary" class="btn-success" @click="onSubmit">提交</el-button>
        <el-button v-if="type!='info'" class="btn-close" @click="back()">取消</el-button>
        <el-button v-if="type=='info'" class="btn-close" @click="back()">返回</el-button>
      </el-form-item>
    </el-form>
    

  </div>
</template>
<script>
// 数字，邮件，手机，url，身份证校验
import { isNumber,isIntNumer,isEmail,isPhone, isMobile,isURL,checkIdCard } from "@/utils/validate";
export default {
  data() {
    let self = this
    var validateIdCard = (rule, value, callback) => {
      if(!value){
        callback();
      } else if (!checkIdCard(value)) {
        callback(new Error("请输入正确的身份证号码"));
      } else {
        callback();
      }
    };
    var validateUrl = (rule, value, callback) => {
      if(!value){
        callback();
      } else if (!isURL(value)) {
        callback(new Error("请输入正确的URL地址"));
      } else {
        callback();
      }
    };
    var validateMobile = (rule, value, callback) => {
      if(!value){
        callback();
      } else if (!isMobile(value)) {
        callback(new Error("请输入正确的手机号码"));
      } else {
        callback();
      }
    };
    var validatePhone = (rule, value, callback) => {
      if(!value){
        callback();
      } else if (!isPhone(value)) {
        callback(new Error("请输入正确的电话号码"));
      } else {
        callback();
      }
    };
    var validateEmail = (rule, value, callback) => {
      if(!value){
        callback();
      } else if (!isEmail(value)) {
        callback(new Error("请输入正确的邮箱地址"));
      } else {
        callback();
      }
    };
    var validateNumber = (rule, value, callback) => {
      if(!value){
        callback();
      } else if (!isNumber(value)) {
        callback(new Error("请输入数字"));
      } else {
        callback();
      }
    };
    var validateIntNumber = (rule, value, callback) => {
      if(!value){
        callback();
      } else if (!isIntNumer(value)) {
        callback(new Error("请输入整数"));
      } else {
        callback();
      }
    };
    return {
	  addEditForm: {"btnSaveFontColor":"#fff","selectFontSize":"14px","btnCancelBorderColor":"#DCDFE6","inputBorderRadius":"4px","inputFontSize":"14px","textareaBgColor":"#fff","btnSaveFontSize":"14px","textareaBorderRadius":"4px","uploadBgColor":"#fff","textareaBorderStyle":"solid","btnCancelWidth":"88px","textareaHeight":"120px","dateBgColor":"#fff","btnSaveBorderRadius":"4px","uploadLableFontSize":"14px","textareaBorderWidth":"1px","inputLableColor":"#606266","addEditBoxColor":"#fff","dateIconFontSize":"14px","btnSaveBgColor":"rgba(81, 163, 81, 1)","uploadIconFontColor":"#8c939d","textareaBorderColor":"#DCDFE6","btnCancelBgColor":"#ecf5ff","selectLableColor":"#606266","btnSaveBorderStyle":"solid","dateBorderWidth":"1px","dateLableFontSize":"14px","dateBorderRadius":"4px","btnCancelBorderStyle":"solid","selectLableFontSize":"14px","selectBorderStyle":"solid","selectIconFontColor":"#C0C4CC","btnCancelHeight":"44px","inputHeight":"40px","btnCancelFontColor":"#606266","dateBorderColor":"#DCDFE6","dateIconFontColor":"#C0C4CC","uploadBorderStyle":"solid","dateBorderStyle":"solid","dateLableColor":"#606266","dateFontSize":"14px","inputBorderWidth":"1px","uploadIconFontSize":"28px","selectHeight":"40px","inputFontColor":"#606266","uploadHeight":"148px","textareaLableColor":"#606266","textareaLableFontSize":"14px","btnCancelFontSize":"14px","inputBorderStyle":"solid","btnCancelBorderRadius":"4px","inputBgColor":"#fff","inputLableFontSize":"14px","uploadLableColor":"#606266","uploadBorderRadius":"4px","btnSaveHeight":"44px","selectBgColor":"#fff","btnSaveWidth":"88px","selectIconFontSize":"14px","dateHeight":"40px","selectBorderColor":"#DCDFE6","inputBorderColor":"#DCDFE6","uploadBorderColor":"#DCDFE6","textareaFontColor":"#606266","selectBorderWidth":"1px","dateFontColor":"#606266","btnCancelBorderWidth":"1px","uploadBorderWidth":"1px","textareaFontSize":"14px","selectBorderRadius":"4px","selectFontColor":"#606266","btnSaveBorderColor":"#409EFF","btnSaveBorderWidth":"0px"},
      id: '',
      type: '',
      ro:{
	username : false,
	password : false,
	role : false,
      },
      ruleForm: {
        username: '',
        password: '',
      },
      rules: {
          username: [
                { required: true, message: '用户名不能为空', trigger: 'blur' },
          ],
          password: [
                { required: true, message: '密码不能为空', trigger: 'blur' },
          ],
          role: [
          ],
      }
    };
  },
  props: ["parent"],
  computed: {
  },
  created() {
	this.addEditStyleChange()
	this.addEditUploadStyleChange()
  },
  methods: {
    // 下载
    download(file){
      window.open(`${file}`)
    },
    // 初始化
    init(id,type) {
      if (id) {
        this.id = id;
        this.type = type;
      }
      if(this.type=='info'||this.type=='else'){
        this.info(id);
      }else if(this.type=='cross'){
        var obj = this.$storage.getObj('crossObj');
        for (var o in obj){
          if(o=='username'){
            this.ruleForm.username = obj[o];
	    this.ro.username = true;
            continue;
          }
          if(o=='password'){
            this.ruleForm.password = obj[o];
	    this.ro.password = true;
            continue;
          }
          if(o=='role'){
            this.ruleForm.role = obj[o];
	    this.ro.role = true;
            continue;
          }
        }
      }
    },
    // 多级联动参数
    info(id) {
      this.$http({
        url: `users/info/${id}`,
        method: "get"
      }).then(({ data }) => {
        if (data && data.code === 0) {
        this.ruleForm = data.data;
	//解决前台上传图片后台不显示的问题
	let reg=new RegExp('../../../upload','g')//g代表全部
        } else {
          this.$message.error(data.msg);
        }
      });
    },
    // 提交
    onSubmit() {
      // ${column.compare}
      // ${column.compare}
      // ${column.compare}



      this.$refs["ruleForm"].validate(valid => {
        if (valid) {
          this.$http({
            url: `users/${!this.ruleForm.id ? "save" : "update"}`,
            method: "post",
            data: this.ruleForm
          }).then(({ data }) => {
            if (data && data.code === 0) {
              this.$message({
                message: "操作成功",
                type: "success",
                duration: 1500,
                onClose: () => {
                  this.parent.showFlag = true;
                  this.parent.addOrUpdateFlag = false;
                  this.parent.usersCrossAddOrUpdateFlag = false;
                  this.parent.search();
                  this.parent.contentStyleChange();
                }
              });
            } else {
              this.$message.error(data.msg);
            }
          });
        }
      });
    },
    // 获取uuid
    getUUID () {
      return new Date().getTime();
    },
    // 返回
    back() {
      this.parent.showFlag = true;
      this.parent.addOrUpdateFlag = false;
      this.parent.usersCrossAddOrUpdateFlag = false;
      this.parent.contentStyleChange();
    },
	addEditStyleChange() {
	  this.$nextTick(()=>{
	    // input
	    document.querySelectorAll('.addEdit-block .input .el-input__inner').forEach(el=>{
	      el.style.height = this.addEditForm.inputHeight
	      el.style.color = this.addEditForm.inputFontColor
	      el.style.fontSize = this.addEditForm.inputFontSize
	      el.style.borderWidth = this.addEditForm.inputBorderWidth
	      el.style.borderStyle = this.addEditForm.inputBorderStyle
	      el.style.borderColor = this.addEditForm.inputBorderColor
	      el.style.borderRadius = this.addEditForm.inputBorderRadius
	      el.style.backgroundColor = this.addEditForm.inputBgColor
	    })
	    document.querySelectorAll('.addEdit-block .input .el-form-item__label').forEach(el=>{
	      el.style.lineHeight = this.addEditForm.inputHeight
	      el.style.color = this.addEditForm.inputLableColor
	      el.style.fontSize = this.addEditForm.inputLableFontSize
	    })
	    // select
	    document.querySelectorAll('.addEdit-block .select .el-input__inner').forEach(el=>{
	      el.style.height = this.addEditForm.selectHeight
	      el.style.color = this.addEditForm.selectFontColor
	      el.style.fontSize = this.addEditForm.selectFontSize
	      el.style.borderWidth = this.addEditForm.selectBorderWidth
	      el.style.borderStyle = this.addEditForm.selectBorderStyle
	      el.style.borderColor = this.addEditForm.selectBorderColor
	      el.style.borderRadius = this.addEditForm.selectBorderRadius
	      el.style.backgroundColor = this.addEditForm.selectBgColor
	    })
	    document.querySelectorAll('.addEdit-block .select .el-form-item__label').forEach(el=>{
	      el.style.lineHeight = this.addEditForm.selectHeight
	      el.style.color = this.addEditForm.selectLableColor
	      el.style.fontSize = this.addEditForm.selectLableFontSize
	    })
	    document.querySelectorAll('.addEdit-block .select .el-select__caret').forEach(el=>{
	      el.style.color = this.addEditForm.selectIconFontColor
	      el.style.fontSize = this.addEditForm.selectIconFontSize
	    })
	    // date
	    document.querySelectorAll('.addEdit-block .date .el-input__inner').forEach(el=>{
	      el.style.height = this.addEditForm.dateHeight
	      el.style.color = this.addEditForm.dateFontColor
	      el.style.fontSize = this.addEditForm.dateFontSize
	      el.style.borderWidth = this.addEditForm.dateBorderWidth
	      el.style.borderStyle = this.addEditForm.dateBorderStyle
	      el.style.borderColor = this.addEditForm.dateBorderColor
	      el.style.borderRadius = this.addEditForm.dateBorderRadius
	      el.style.backgroundColor = this.addEditForm.dateBgColor
	    })
	    document.querySelectorAll('.addEdit-block .date .el-form-item__label').forEach(el=>{
	      el.style.lineHeight = this.addEditForm.dateHeight
	      el.style.color = this.addEditForm.dateLableColor
	      el.style.fontSize = this.addEditForm.dateLableFontSize
	    })
	    document.querySelectorAll('.addEdit-block .date .el-input__icon').forEach(el=>{
	      el.style.color = this.addEditForm.dateIconFontColor
	      el.style.fontSize = this.addEditForm.dateIconFontSize
	      el.style.lineHeight = this.addEditForm.dateHeight
	    })
	    // upload
	    let iconLineHeight = parseInt(this.addEditForm.uploadHeight) - parseInt(this.addEditForm.uploadBorderWidth) * 2 + 'px'
	    document.querySelectorAll('.addEdit-block .upload .el-upload--picture-card').forEach(el=>{
	      el.style.width = this.addEditForm.uploadHeight
	      el.style.height = this.addEditForm.uploadHeight
	      el.style.borderWidth = this.addEditForm.uploadBorderWidth
	      el.style.borderStyle = this.addEditForm.uploadBorderStyle
	      el.style.borderColor = this.addEditForm.uploadBorderColor
	      el.style.borderRadius = this.addEditForm.uploadBorderRadius
	      el.style.backgroundColor = this.addEditForm.uploadBgColor
	    })
	    document.querySelectorAll('.addEdit-block .upload .el-form-item__label').forEach(el=>{
	      el.style.lineHeight = this.addEditForm.uploadHeight
	      el.style.color = this.addEditForm.uploadLableColor
	      el.style.fontSize = this.addEditForm.uploadLableFontSize
	    })
	    document.querySelectorAll('.addEdit-block .upload .el-icon-plus').forEach(el=>{
	      el.style.color = this.addEditForm.uploadIconFontColor
	      el.style.fontSize = this.addEditForm.uploadIconFontSize
	      el.style.lineHeight = iconLineHeight
	      el.style.display = 'block'
	    })
	    // 多文本输入框
	    document.querySelectorAll('.addEdit-block .textarea .el-textarea__inner').forEach(el=>{
	      el.style.height = this.addEditForm.textareaHeight
	      el.style.color = this.addEditForm.textareaFontColor
	      el.style.fontSize = this.addEditForm.textareaFontSize
	      el.style.borderWidth = this.addEditForm.textareaBorderWidth
	      el.style.borderStyle = this.addEditForm.textareaBorderStyle
	      el.style.borderColor = this.addEditForm.textareaBorderColor
	      el.style.borderRadius = this.addEditForm.textareaBorderRadius
	      el.style.backgroundColor = this.addEditForm.textareaBgColor
	    })
	    document.querySelectorAll('.addEdit-block .textarea .el-form-item__label').forEach(el=>{
	      // el.style.lineHeight = this.addEditForm.textareaHeight
	      el.style.color = this.addEditForm.textareaLableColor
	      el.style.fontSize = this.addEditForm.textareaLableFontSize
	    })
	    // 保存
	    document.querySelectorAll('.addEdit-block .btn .btn-success').forEach(el=>{
	      el.style.width = this.addEditForm.btnSaveWidth
	      el.style.height = this.addEditForm.btnSaveHeight
	      el.style.color = this.addEditForm.btnSaveFontColor
	      el.style.fontSize = this.addEditForm.btnSaveFontSize
	      el.style.borderWidth = this.addEditForm.btnSaveBorderWidth
	      el.style.borderStyle = this.addEditForm.btnSaveBorderStyle
	      el.style.borderColor = this.addEditForm.btnSaveBorderColor
	      el.style.borderRadius = this.addEditForm.btnSaveBorderRadius
	      el.style.backgroundColor = this.addEditForm.btnSaveBgColor
	    })
	    // 返回
	    document.querySelectorAll('.addEdit-block .btn .btn-close').forEach(el=>{
	      el.style.width = this.addEditForm.btnCancelWidth
	      el.style.height = this.addEditForm.btnCancelHeight
	      el.style.color = this.addEditForm.btnCancelFontColor
	      el.style.fontSize = this.addEditForm.btnCancelFontSize
	      el.style.borderWidth = this.addEditForm.btnCancelBorderWidth
	      el.style.borderStyle = this.addEditForm.btnCancelBorderStyle
	      el.style.borderColor = this.addEditForm.btnCancelBorderColor
	      el.style.borderRadius = this.addEditForm.btnCancelBorderRadius
	      el.style.backgroundColor = this.addEditForm.btnCancelBgColor
	    })
	  })
	},
	addEditUploadStyleChange() {
		this.$nextTick(()=>{
		  document.querySelectorAll('.addEdit-block .upload .el-upload-list--picture-card .el-upload-list__item').forEach(el=>{
			el.style.width = this.addEditForm.uploadHeight
			el.style.height = this.addEditForm.uploadHeight
			el.style.borderWidth = this.addEditForm.uploadBorderWidth
			el.style.borderStyle = this.addEditForm.uploadBorderStyle
			el.style.borderColor = this.addEditForm.uploadBorderColor
			el.style.borderRadius = this.addEditForm.uploadBorderRadius
			el.style.backgroundColor = this.addEditForm.uploadBgColor
		  })
	  })
	},
  }
};
</script>
<style lang="scss">
.editor{
  height: 500px;
  
  & /deep/ .ql-container {
	  height: 310px;
  }
}
.amap-wrapper {
  width: 100%;
  height: 500px;
}
.search-box {
  position: absolute;
}
.addEdit-block {
	margin: -10px;
}
.detail-form-content {
	padding: 12px;
}
.btn .el-button {
  padding: 0;
}
</style>

声明

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

赐你岁月如歌
关注
专栏目录
基于SSM+VUE的药品销售管理系统的设计与实现
斗罗程序猿的博客
08-17 2832
研究的背景与意义 随着互联网技术的快速发展，网络时代的到来，网络信息也将会改变当今社会。各行各业在日常企业经营管理等方面也在慢慢的向规范化和网络化趋势汇合。药店药品销售系统的信息化程度体现在将互联网与信息技术应用于经营与管理，以现代化工具代替传统手工作业。无疑，使用网络信息化管理使信息管理更先进、更高效、更科学，信息交流更迅速。 对于之前药店系统的管理，大部分都是使用传统的人工方式去管理，这样导致了管理效率低下、出错频率高。而且，时间一长的话，积累下来的数据信息不容易保存，对于查询、更新还有维护会带来不少问
毕业设计javassm基于web的药品管理系统+vue源码含文档含教程
07-18
毕业设计javassm基于web的药品管理系统+vue源码含文档含教程 后台是ssm框架，后台的页面是vue，前端页面是html，数据库mysql，jdk1.8，开发工具用ecplise、myecplise、sts、idea都可以 药品管理系统在Eclipse环境中...
基于ssm+vue+Mysql的药品商超管理系统
老卓爱爪哇 的博客
04-02 797
随着科学技术的飞速发展，各行各业都在努力与现代先进技术接轨，通过科技手段提高自身的优势；对于药品管理系统当然也不能排除在外，随着网络技术的不断成熟，带动了药品管理系统，它彻底改变了过去传统的管理方式，不仅使服务管理难度变低了，还提升了管理的灵活性。这种个性化的平台特别注重交互协调与管理的相互配合，激发了管理人员的创造性与主动性，对药品管理系统而言非常有利。 本系统采用的数据库是Mysql，使用SSM框架开发，运行环境使用Tomcat服务器，ECLIPSE 是本系统的开发平台。在设计过程中，充分保证了系统代
ssm基于Java web的住院管理系统+vue
V+Zsffbb211
08-23 562
身处网络时代，随着网络系统体系发展的不断成熟和完善，人们的生活也随之发生了很大的变化，人们在追求较高物质生活的同时，也在想着如何使自身的精神内涵得到提升，而读书就是人们获得精神享受非常重要的途径。为了满足人们随时随地只要有网络就可以看书的要求，住院管理系统被开发研究了出来。本文主要描述了该住院管理系统的具体开发过程，在SSM框架的基础上，采用vue技术和MYSQL数据库，使该住院管理系统具有很好的稳定性和安全性。
基于Java+SpringBoot+Vue前后端分离仓库管理系统设计实现
Java 技术专栏，从入门到精通，熟悉企业级开发
05-02 9975
信息内容数据从传统到当今，一直在改变，忽然互联网技术让传统信息内容管理见到划时代的黎明，由于传统信息内容管理从时效性、安全系数、可执行性等多个方面，碰到互联网时代发觉弥补了从古至今的缺陷，有效提升管理效率工作能力。在传统的管理模式中，时间越长，管理具体内容越大，需要更多人梳理数据，数据归纳查看高效率非常低，数据安全性从来不会确保安全系数。融合数据具体内容管理的缺陷，在互联网时代能够得到很好的填补。
基于SSM+VUE毕业设计源代码合集（235-500）有源码+调试运行
u013374864的博客
11-19 636
SSM（Spring+SpringMVC+MyBatis）+Vue 项目技术栈主要包括以下技术：1. 前端技术：- Vue.js：一款用于构建用户界面的渐进式框架，易于上手，且具有良好的性能。- Vuex：Vue 的状态管理工具，用于管理应用的全局状态。- Vue Router：Vue 的路由管理器，实现单页面应用（SPA）的导航功能。2. 后端技术：- Spring：一个开放源的 Java 平台，用于实现企业级应用的开发。
基于SpringBoot+Vue的医疗服务系统设计与实现
weixin_54828627的博客
06-03 1420
医疗服务系统，主要的模块包括查看管理员；首页、个人中心、普通村民管理、乡村医生管理、公告信息管理、乡村诊室管理、健康档案管理、学习培训管理、考核信息管理、医疗地图管理、医疗药品管理、类型信息管理、购买信息管理、留言板管理、管理员管理、系统管理等功能。系统中管理员主要是为了安全有效地存储和管理各类信息，还可以对系统进行管理与更新维护等操作，并且对后台有相应的操作权限。
基于SpringBoot+Vue+SSM居家养老系统+vue的设计与实现资源下载
ITbiyesheji的博客
04-24 892
管理员功能有个人中心，老人账号管理，工作人员管理，老人档案管理，订单申请管理，检查检验项目管理，维修服务管理，订单信息管理，转诊信息管理，生活服务管理，服务记录管理，生活用品信息管理，药品信息管理，食物信息管理，系统管理等。在spring容器启动的时候，spring会把你在配置文件中配置的bean都初始化好，然后在你需要调用的时候，就把它已经初始化好的那些bean分配给你需要调用这些bean的类（假设这个类名是A），分配的方法就是调用A的setter方法来注入，而不需要你在A里面new这些bean了。
计算机毕业设计 SSM与Vue的在线药品商城管理系统(源码+论文)
mojikopi的博客
12-21 217
Hi，各位同学好呀，这里是M学姐！今天向大家分享一个今年(2022)最新完成的毕业设计项目作品，【基于SSM的药品管理系统】学姐根据实现的难度和等级对项目进行评分(最低0分，满分5分)难度系数：3分工作量：5分创新点：3分界面美化：5分界面美化的补充说明：使用vue的基本都能达到5分本项目完成于2022年6月份，包含内容 : 源码 + 论文 + 答辩PPT本系统采用的数据库是Mysql，使用SSM框架开发，运行环境使用Tomcat服务器，ECLIPSE 是本系统的开发平台。
基于SpringBoot+Vue+SSM医院住院管理系统+vue的设计与实现资源下载
ITbiyesheji的博客
04-01 857
MyEclipse可以帮助我们进行数据库的研发和J2EE的使用，除此之外，还可以提高系统的运营能力，这突出表现在服务器的整合过程中。可操作性主要是对医院住院管理系统设计完成后，用户的使用体验度，以及管理员可以通过系统随时管理相关的数据信息，并且对于管理员、病人、医护人员三个权限角色，都可以简单明了的进入到自己的系统界面，通过界面导航菜单可以简单明了地操作功能模块，方便用户信息的操作需求和管理员管理数据信息，对于系统的操作，不需要专业人员都可以直接进行功能模块的操作管理，所以在系统的可操作性是完全可以的。
基于java+ssm+vue毕业设计源码合集（1-100）源码+文档+调试+讲解
u013374864的博客
11-18 536
SSM（Spring、SpringMVC、MyBatis）框架搭配 Vue 前端框架是当前较为流行的项目开发技术栈。以下是详细的技術列表：1. 后端技术：- Spring：一个开源的 Java 平台，提供了用于构建企业级应用程序的全面解决方案。- SpringMVC：Spring 框架的一个子项目，用于构建 Web 应用程序，提供了处理请求、数据验证、视图解析等功能的模块。- MyBatis：一个优秀的持久层框架，支持定制化 SQL、存储过程以及高级映射。
ssm175基于web的药品管理系统+vue.zip
06-24
【标题】"ssm175基于web的药品管理系统+vue.zip" 提示我们这是一个采用SSM（Spring、SpringMVC、MyBatis）框架与Vue.js前端技术结合的Web应用项目。SSM是Java领域常用的后端开发框架，而Vue.js则是一种轻量级的前端...
ssm9175基于web的药品管理系统+vue.zip
09-28
【框架】：ssm 【前端】：vue/jsp 【JDK版本】：JDK1.8 【服务器】：tomcat7+ 【数据库】：mysql 5.7+ 包含：项目源码、数据库脚本、项目功能介绍文档等，该项目源码可作为毕设使用。 项目都经过严格调试，确保可以...
Java毕设项目-ssm框架基于web的药品管理系统+vue+源代码+数据库+论文.zip
06-30
本项目是一个基于Web的药品管理系统，专为计算机相关专业的学生设计，可作为毕业设计或课程设计的实践项目。它采用了前后端分离的设计理念，前端使用Vue框架进行开发，提供了直观易用的用户界面；后端则采用Spring ...
【C#生态园】后端服务与网络库：选择适合你游戏开发的利器
最新发布
记录我的学习历程
10-02 1272
本文将重点介绍PlayFab、Photon、Lidgren.Network、Mirror、DarkRift Networking和Lidgren.Lite这六个提供后端服务或网络通信功能的库。通过简要介绍它们的核心功能、使用场景、安装与配置方法以及API概览，读者可以更好地了解并选择适合自己项目的后端服务和网络库。
基于Hive和Hadoop的哔哩哔哩网站分析系统
图南的博客
09-27 664
本项目是一个基于大数据技术的哔哩哔哩平台分析系统，旨在为用户提供全面的哔哩哔哩视频数据和深入的用户行为分析。系统采用 Hadoop 平台进行大规模数据存储和处理，利用 MapReduce 进行数据分析和处理，通过 Sqoop 实现数据的导入导出，以 Spark 为核心进行高效的数据处理。整个系统结合了大数据处理技术，为用户提供精准的内容推荐和深入的用户兴趣分析，帮助平台更好地了解视频趋势和用户需求。
SpringBoot--为什么Controller是串行的？怎样才能并行？
IT利刃出鞘的博客
09-29 449
本文介绍SpringBoot为什么Controller是串行的？在什么场景下才能并行执行？
第13讲 实践：设计SLAM系统
weixin_42391513的博客
09-26 785
设计一个视觉里程计，理解SLAM软件框架如何搭建，理解视觉里程计设计容易出现的问题以及解决方法。
Vue.js与Flask/Django后端的协同开发研究
vvvae1234的博客
09-29 1645
前后端分离是指将客户端（前端）和服务器端（后端）进行逻辑上的分离。前端使用现代JavaScript框架（如Vue.js、React、Angular等）进行用户界面开发，后端则使用如Node.js、Flask、Django等技术提供API服务。这种架构有助于提高开发效率，使得前后端团队可以独立开发、协作，并加速项目迭代。Vue.js：一个渐进式JavaScript框架，专注于构建用户界面。Vue.js的核心库只关注视图层，易于与第三方库或既有项目进行整合。Flask。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值