基于Java的小区物业管理系统设计与实现

@TOC

springboot596基于Java的小区物业管理系统设计与实现--论文

研究背景

小区物业管理系统主要通过计算机网络,对小区物业管理系统所需的信息进行统一管理,方便用户随时随地进行增添、修改、查询、删除各类信息。本系统极大的促进了系统与数据库管理系统软件之间的配合,满足了绝大部分用户的需求,给用户带来了很大的便利。以现在计算机的技术的应用,使计算机成为人们使用现代发达技术的桥梁。计算机可以有效的解决信息,十分方便的获取信息,从而提高工作的效率。

1.2 课题研究目的

全球经济在快速的发展,中国更是进步飞速,这使得国内的互联网技术进入了发展的高峰时期,这让中外资本不断转向互联网这个大市场。在这个信息高度发达的现在,利用网络进行信息管理改革已经成为了人们追捧的一种趋势。“小区物业管理系统”是运用java语言和SpringBoot框架,以Mysql数据库为基础而发出来的。为保证我国经济的持续性发展,必须要让互联网信息时代在我国日益壮大,蓬勃发展。伴随着信息社会的飞速发展,小区物业管理系统所面临的问题也一个接一个的出现,所以现在最该解决的问题就是信息的实时查询和访问需求的问题,以及如何利用快捷便利的方式让访问者在广大信息系统中进行查询、分享、储存和管理。这对我们的现实生活中具有非常重要的意义,所以小区物业管理系统诞生了。

1.3 课题的研究意义

现在还有许多人用纸质工具存储并管理信息,网络仅仅起到一般的辅助性作用。以我对人们常用软件的了解程度,大家仍然把传统的Office软件当成主要工具,小区物业管理系统相比Office软件来说会更全面更专业。本系统通过标签分类等方式,使管理人员对各项功能信息实现高效的管理,可以极大的提高管理人员的工作效率。

1.4 研究现状

在国外线上管理发展较早。相对应的软件的开发设计和保护也有所增加[4]。由于长時间的技术积累,产品研发工作更是持续推动,最终获得了较大的发展。如今,向着智能化,数字化和信息化的方位快速发展。各行各业都使用了相似的规章制度,推动发展,获得了较好的经济效益[5]。

在国内,因起步较晚,目前的管理还不够完善,发展不平衡,对小区物业的管理过程中应用电子计算机和网上的领域以及外部状况信息存有很大差别。技术性简易地取代了过去的形式或方式,但根据更科学的方式再次设计方案管理的这一环节中,大家必须舍弃传统的管理方式,尽早更改管理方法,变化管理理念合理操纵,使系统更细腻,控制成本、提升管理效益。

计算机作为信息科学的媒介和关键,它的出现和发展对人类社会的繁荣起着至关重要的作用。无论是政府机构还是公共机构,都会根据工作内容选择一套优秀的通信技术和专业的办公设备,利用这些技术和设备快速收集、解决和存储信息,使管理工作变得方便快捷,达到科学合理的管理目标。

总之,小区物业管理系统的发展呈不断上升的发展趋势,现在传统的手工制作和半手工管理的方法进入到信息化管理的转变过程中,必须使用和融合新的信息技术来完成传统的系统设计方法,才能保证系统的效果和质量。

2 系统开发技术

小区物业管理系统采用B/S(Browser/Server)架构和MVC模型进行设计开发。在B/S架构下,用户在浏览器端进行使用,主要工作通过服务器端进行实现,用户通过网站进行访问大大节约了成本。本系统使用Java等语言同时运用了Springboot框架进行开发,使用MySQL进行数据存储。

2.1 Java技术

Java是一种面向对象的静态式编程语言。Java编程语言具有多线程和对象定向的特点。其特点是根据方案的属性将方案分为几个不同的模块,这些模块是封闭的和多样化的,在申请过程中具有很强的独立性。Java语言在计算机软件开发过程中的运用可以达到交互操作的目的,通过各种形式的交换,可以有效地处理所需的数据,从而确保计算机软件开发的可控性和可见性。开发Java语言时,保留了网络接口,Java保留的缺省网络接口可以与web应用程序编程所依赖的类别库相匹配。为了使Java开发的应用程序更加稳定和强健,Java会自动收集程序中的垃圾,并处理程序中存在的异常。Java语言是日常开发过程中广泛使用的通用基本语言。其中Java语言课程库、句子、语法规则和关键字经常用于计算机软件的开发和编程。

面向对象编程是Java语言最显着的特点。它具有原始接口和补充接口以及继承,不仅可以实现相同类型的单个继承,而且还支持接口之间的多个继承,从而实现类、接口和接口之间以及类和接口之间的有效通信。Java的面向对象特性主要包括三个方面:继承、多态性和封装。封装是Java的核心,可以封装所有数据操作。多态性是指由面向对象行为派生的相关行为。继承作为特殊编程模式有两种类型:父类和子类,这两种类型的属性具有相同的功能和特性。对于父类的属性特性,子类可以实现继承和优化。

2.2 Springboot框架

Spring框架是Java平台上的一种开源应用框架,提供具有控制反转特性的容器。尽管Spring框架自身对编程模型没有限制,但其在Java应用中的频繁使用让它备受青睐,以至于后来让它作为EJB(EnterpriseJavaBeans)模型的补充,甚至是替补。Spring框架为开发提供了一系列的解决方案,比如利用控制反转的核心特性,并通过依赖注入实现控制反转来实现管理对象生命周期容器化,利用面向切面编程进行声明式的事务管理,整合多种持久化技术管理数据访问,提供大量优秀的Web框架方便开发等等。Spring框架具有控制反转(IOC)特性,IOC旨在方便项目维护和测试,它提供了一种通过Java的反射机制对Java对象进行统一的配置和管理的方法。Spring框架利用容器管理对象的生命周期,容器可以通过扫描XML文件或类上特定Java注解来配置对象,开发者可以通过依赖查找或依赖注入来获得对象。Spring框架具有面向切面编程(AOP)框架,SpringAOP框架基于代理模式,同时运行时可配置;AOP框架主要针对模块之间的交叉关注点进行模块化。Spring框架的AOP框架仅提供基本的AOP特性,虽无法与AspectJ框架相比,但通过与AspectJ的集成,也可以满足基本需求。

2.3 MySQL数据库

MySql做为瑞典公司MySql AB开发的中小型开源数据库智能管理系统,具备配备低、低成本、运作速度更快的优势。与此同时,因为社区版的开源系统性,变成了许多网址减少开发成本费的最佳选择。被甲骨文回收后,MySQL也发布了商业版。另外Mysql具有以下特性:

(1)使用C和C++编写,并使用了多种编译器进行测试,保证源代码的可移植性。

(2)为C、C++、Eiffel、Java、Perl、PHP、Python、Ruby和Tcl等多种编程语言提供了API。

(3)采用多线程并行的方法提高了CPU的利用率。

(4)改善算法,有效地提高查询速度。

2.4 B/S结构

B/S结构(Browser/Server,浏览器/服务器模式),是WEB兴起后的一种网络结构模式,WEB浏览器是客户端最主要的应用软件。这种模式统一了客户端,将系统功能实现的核心部分集中到服务器上,简化了系统的开发、维护和使用。客户机上只要安装一个浏览器,如Chrome、Safari、Microsoft Edge、Netscape Navigator或Internet Explorer,服务器安装SQL Server、Oracle、MYSQL等数据库。浏览器通过Web Server同数据库进行数据交互。

2.5 Tomcat服务器

Tomcat服务器属于轻量级应用服务器,在访问用户数量不是很大的中小型应用中经常被使用。Tomcat服务器主要由三个核心组件Web容器、servlet容器、JSP容器组成。其中,Web容器主要用于完成Web服务器的功能,servlet容器主要用于处理servlet代码,JSP容器主要用于将JSP动态网页翻译成servlet代码。Tomcat作为Web服务器和APP容器,其核心功能主要包括负责接受和反馈外部请求的连接器Connector和负责处理请求的容器Container。二者相辅相成,共同构成了基本的Web服务。Tomcat支持管理多个服务。Tomcat因其技术先进、性能也较为稳定,最重要的是因为其价格免费,故而收到了大量Java爱好者的偏爱,成为比较流行的Web应用服务器。

3 系统需求分析

需求分析在系统开发中有着十分重要的作用。软件项目凭借软件工程的思想和步骤可以大大的提高开发效率,缩短软件开发周期,保证了软件项目的质量。需求分析作为软件工程方法中的一步是至关重要的。软件需求工程是一门分析并记录软件需求的学科。需求分析简单的来说就是用户需要什么,系统需要什么,对此进行问题的列举,等级的排列,需要缜密的思分析和大量的调研。

2.1 可行性分析

根据小区物业管理系统的功能,通过对经济可行性、技术可行性和法律可行性分析进行全面的分析,提供准确的可行性依据。以下是本系统的可行性分析:

  1. 经济可行性

就是分析在现有经济情况下能否完成本小区物业管理系统的开发。下面对本系统开发、运行、维护的相关费用评估,以及投入到实际运用中完成小区物业管理可能费用进行估算。网络资源丰富,本小区物业管理系统只需使用任选一开源服务器即可,此方面无需投入费用。开发阶段,由于本小区物业管理系统不属于大型系统,常规的电脑就可完成开发,不用购置相关硬件设备。软件方面,本小区物业管理系统只需使用网上免费下载的软件即可完成开发,这些软件在使用时简单易懂,无需培训,因此在开发方面也无需投入费用。由于本小区物业管理系统不属于大型系统,运行时候电费可以忽略不记。小区物业管理系统作为自己毕设,由本人开发即可完成,无需人力费用。综上,整个系统开发花费很少,所以本小区物业管理系统在经济上可行。

  1. 技术可行性

本系统的开发使用java作为系统开发的开发语言,开发工具选择 Eclipse,而 B/S架构决定了本系统的兼容性和多用户可操作性,此外选择MySql作为数据库不仅提高了数据安全性更保障了数据的可操作性。

  1. 法律可行性分析

法律可行性分析,即分析本校小区物业管理系统是否与各类法律相悖。本校小区物业管理系统使用市面开源免费软件开发,且作为个人毕设,无商用,均为本人自主开发,并且页面设计合理,发布的信息要求符合常规。整个系统无抵触法律法规的问题。因此在法律上,本校小区物业管理系统可行。

3.2 功能需求分析

小区物业管理系统综合网络空间开发设计要求。目的是将小区物业通过网络平台将传统管理方式转换为在网上管理,完成小区物业的方便快捷、安全性高障,目标明确。小区物业管理系统可以将功能划分为管理员的使用功能和用户使用的功能。

(1)管理员的功能是最高的,可以对系统所在功能进行查看,修改和删除,包括业主功能。管理员用例如下:

图3-1管理员用例图

(2)业主关键功能包含个人中心、业主车辆管理、业主宠物管理、购买车位管理、缴费通知管理等进行详细操作。业主用例如下:

图3-2 业主用例图

3.3 系统流程分析

3.3.1系统开发流程图:

图3-3 系统开发流程图

3.3.2管理员模块总体流程图:

图3-4 管理员模块总体流程图

3.3.3小区物业管理流程图:

图3-5 小区物业管理流程图

4 系统设计

4.1 功能模块设计

小区物业管理系统按照权限的类型进行划分,分为管理员和业主共两个模块。系统实现个人中心、业主管理、小区信息管理、资产信息管理、业主车辆管理、业主宠物管理、车位信息管理、购买车位管理、缴费通知管理、留言板管理、系统管理等功能进行操作,增强了使用者的操作体验。管理员模块主要针对整个系统的管理进行设计,提高了管理的效率和标准。系统的总体模块设计如下图所示:

图4-1 系统总体模块设计

4.2 系统数据库设计

4.2.1 数据库系统

本系统采用MySQL来进行数据库的管理。MySQL数据库具有体积小、速度快、成本低等优点。具备同时处理数千万条记录,实现大型数据库的高并发读写和高效读写需求[9]。

4.2.2 数据库概念设计

概念模型用于对信息世界建模,并与指定的数据库管理系统分离。它有助于将真实世界的事物抽象为适合于数据库管理系统的数据库模型。人们倾向于将现实世界抽象为信息世界,再把信息世界变成机器世界。也就是说,将现实世界的目标抽象成独立于专用计算机软件和专用数据库管理系统的信息结构的数据模型,然后将物理模型转化为适合电子计算机的数据库管理系统。事实上,数据模型是从真实世界到机器世界的中间层。

信息世界的基本要素包括实体和关联。现实存在且彼此可区别的事物称为实体。实体可以是实际的人、事或物,还可以是抽象化的概念或联络。以下是对部分主要的关键实体如下:

业主实体属性如图4-2所示。

图4-2业主实体属性图

小区信息实体属性如图4-3所示。

图4-3小区信息实体属性图

车位信息实体属性如图4-4所示。

图4-4车位信息实体属性图

资产信息实体属性如图4-5所示。

图4-5资产信息实体属性图

购买车位实体属性如图4-6所示。

图4-6购买车位实体属性图

4.2.3 数据表设计

本设计根据数据表管理系统的具体流程进行管理,方便用户对数据的添加、删除、修改和查询等操作。

4.2.4 数据表的建立

系统采用Navicat Premium对数据库进行操作,数据库管理操作简单,数据处理能力强。数据表建立如下:

表4-1:缴费通知

字段名称类型长度字段说明主键默认值
idbigint主键主键
addtimetimestamp创建时间CURRENT_TIMESTAMP
zhanghaovarchar200账号
xingmingvarchar200姓名
loufanghaovarchar200楼房号
xiaoqumingchengvarchar200小区名称
shoufeixiangmuvarchar200收费项目
feiyongfloat费用
feiyongxiangqinglongtext4294967295费用详情
tongzhishijiandatetime通知时间
wuyegonghaovarchar200物业工号
wuyexingmingvarchar200物业姓名
ispayvarchar200是否支付未支付

表4-2:购买车位

字段名称类型长度字段说明主键默认值
idbigint主键主键
addtimetimestamp创建时间CURRENT_TIMESTAMP
dingdanbianhaovarchar200订单编号
cheweibianhaovarchar200车位编号
cheweimingchengvarchar200车位名称
jiagefloat价格
goumairiqidate购买日期
zhanghaovarchar200账号
xingmingvarchar200姓名
shoujivarchar200手机
loufanghaovarchar200楼房号
xiaoqumingchengvarchar200小区名称
sfshvarchar200是否审核待审核
shhflongtext4294967295审核回复
ispayvarchar200是否支付未支付

表4-3:业主

字段名称类型长度字段说明主键默认值
idbigint主键主键
addtimetimestamp创建时间CURRENT_TIMESTAMP
zhanghaovarchar200账号
mimavarchar200密码
xingmingvarchar200姓名
nianlingint年龄
xingbievarchar200性别
shoujivarchar200手机
touxianglongtext4294967295头像
loudongvarchar200楼栋
loufanghaovarchar200楼房号
xiaoqumingchengvarchar200小区名称

表4-4:配置文件

字段名称类型长度字段说明主键默认值
idbigint主键主键
namevarchar100配置参数名称
valuevarchar100配置参数值

表4-5:小区信息

字段名称类型长度字段说明主键默认值
idbigint主键主键
addtimetimestamp创建时间CURRENT_TIMESTAMP
xiaoqumingchengvarchar200小区名称
xiaoqufengmianlongtext4294967295小区封面
xiaoqumianjivarchar200小区面积
xiaoquweizhivarchar200小区位置
xiaoqudongshuvarchar200小区栋数
fuzerenvarchar200负责人
lianxidianhuavarchar200联系电话
chengliriqidate成立日期
xiaoquxiangqinglongtext4294967295小区详情
clicktimedatetime最近点击时间
clicknumint点击次数0

表4-6:车位信息

字段名称类型长度字段说明主键默认值
idbigint主键主键
addtimetimestamp创建时间CURRENT_TIMESTAMP
cheweibianhaovarchar200车位编号
cheweimingchengvarchar200车位名称
tupianlongtext4294967295图片
cheweiweizhivarchar200车位位置
zhuangtaivarchar200状态
jiagefloat价格
mianjivarchar200面积
shishishijiandatetime实时时间
xiangxijieshaolongtext4294967295详细介绍
clicktimedatetime最近点击时间
clicknumint点击次数0

表4-7:物业人员

字段名称类型长度字段说明主键默认值
idbigint主键主键
addtimetimestamp创建时间CURRENT_TIMESTAMP
wuyegonghaovarchar200物业工号
mimavarchar200密码
wuyexingmingvarchar200物业姓名
nianlingint年龄
xingbievarchar200性别
touxianglongtext4294967295头像
lianxidianhuavarchar200联系电话
xiaoqumingchengvarchar200小区名称

表4-8:用户表

字段名称类型长度字段说明主键默认值
idbigint主键主键
usernamevarchar100用户名
passwordvarchar100密码
rolevarchar100角色管理员
addtimetimestamp新增时间CURRENT_TIMESTAMP

表4-9:token表

字段名称类型长度字段说明主键默认值
idbigint主键主键
useridbigint用户id
usernamevarchar100用户名
tablenamevarchar100表名
rolevarchar100角色
tokenvarchar200密码
addtimetimestamp新增时间CURRENT_TIMESTAMP
expiratedtimetimestamp过期时间CURRENT_TIMESTAMP

表4-10:资产信息

字段名称类型长度字段说明主键默认值
idbigint主键主键
addtimetimestamp创建时间CURRENT_TIMESTAMP
zichanbianhaovarchar200资产编号
zichanmingchengvarchar200资产名称
zichanleixingvarchar200资产类型
zichanjiazhifloat资产价值
zhaopianlongtext4294967295照片
xiaoqumingchengvarchar200小区名称
dengjishijiandatetime登记时间
xiangxijieshaolongtext4294967295详细介绍
wuyegonghaovarchar200物业工号
wuyexingmingvarchar200物业姓名

表4-11:关于我们

字段名称类型长度字段说明主键默认值
idbigint主键主键
addtimetimestamp创建时间CURRENT_TIMESTAMP
titlevarchar200标题
subtitlevarchar200副标题
contentlongtext4294967295内容
picture1longtext4294967295图片1
picture2longtext4294967295图片2
picture3longtext4294967295图片3

表4-12:业主宠物

字段名称类型长度字段说明主键默认值
idbigint主键主键
addtimetimestamp创建时间CURRENT_TIMESTAMP
chongwumingchengvarchar200宠物名称
chongwuzhongleivarchar200宠物种类
xingbievarchar200性别
tupianlongtext4294967295图片
nianlingvarchar200年龄
shifoujueyuvarchar200是否绝育
faburiqidate发布日期
chongwuxiangqinglongtext4294967295宠物详情
zhanghaovarchar200账号
xingmingvarchar200姓名
loufanghaovarchar200楼房号
xiaoqumingchengvarchar200小区名称

表4-13:收藏表

字段名称类型长度字段说明主键默认值
idbigint主键主键
addtimetimestamp创建时间CURRENT_TIMESTAMP
useridbigint用户id
refidbigint商品id
tablenamevarchar200表名
namevarchar200名称
picturelongtext4294967295图片
typevarchar200类型(1:收藏,21:赞,22:踩,31:竞拍参与,41:关注)1
inteltypevarchar200推荐类型
remarkvarchar200备注

表4-14:业主车辆

字段名称类型长度字段说明主键默认值
idbigint主键主键
addtimetimestamp创建时间CURRENT_TIMESTAMP
chepaihaovarchar200车牌号
cheliangpinpaivarchar200车辆品牌
cheliangleixingvarchar200车辆类型
yansevarchar200颜色
huandangfangshivarchar200换挡方式
zhaopianlongtext4294967295照片
zuoweishuliangint座位数量
dengjiriqidate登记日期
cheliangxiangqinglongtext4294967295车辆详情
zhanghaovarchar200账号
xingmingvarchar200姓名
loufanghaovarchar200楼房号
xiaoqumingchengvarchar200小区名称

表4-15:小区公告

字段名称类型长度字段说明主键默认值
idbigint主键主键
addtimetimestamp创建时间CURRENT_TIMESTAMP
titlevarchar200标题
introductionlongtext4294967295简介
picturelongtext4294967295图片
contentlongtext4294967295内容

表4-16:留言板

字段名称类型长度字段说明主键默认值
idbigint主键主键
addtimetimestamp创建时间CURRENT_TIMESTAMP
useridbigint留言人id
usernamevarchar200用户名
avatarurllongtext4294967295头像
contentlongtext4294967295留言内容
cpicturelongtext4294967295留言图片
replylongtext4294967295回复内容
rpicturelongtext4294967295回复图片

5 系统实现

5.1系统功能实现

当人们打开系统的网址后,首先看到的就是首页界面。在这里,人们能够看到系统的导航条,通过导航条导航进入各功能展示页面进行操作。系统首页界面如图5-1所示:

图5-1 系统首页界面

系统注册:在系统注册页面的输入栏中输入用户注册信息进行注册操作,系统注册页面如图5-2所示:

图5-2系统注册页面

小区信息:在小区信息页面的输入栏中输入小区名称、小区位置和负责人进行查询,可以查看到小区详细信息;小区信息页面如图5-3所示:

图5-3小区信息详细页面

车位信息:在车位信息页面的输入栏中输入车位名称、车位位置和选择状态进行查询,可以查看到车位详细信息,并进行购买车位或收藏操作,车位信息页面如图5-4所示:

图5-4车位信息详细页面

留言板:在留言板页面通过填写留言内容、上传图片并立即提交或重置进行在线留言,还可以对留言信息进行回复操作,留言板页面如图5-5所示:

图5-5留言板详细页面

个人中心:在个人中心页面通过填写个人详细信息进行信息更新操作;还可以对我的收藏进行详细操作;如图5-6所示:

图5-6个人中心界面

5.2后台模块实现

后台用户登录,在登录页面选择需要登录的角色,在正确输入用户名和密码后,进入操作系统进行操作;如图5-7所示。

图5-7 后台登录界面

5.2.1管理员模块实现

管理员进入主页面,主要功能包括对个人中心、业主管理、小区信息管理、资产信息管理、业主车辆管理、业主宠物管理、车位信息管理、购买车位管理、缴费通知管理、留言板管理、系统管理等进行操作。管理员主页面如图5-8所示:

图5-8 管理员主界面

管理员点击业主管理。在业主页面输入账号、姓名、楼栋、楼房号和选择小区名称进行查询、新增或删除业主列表,并根据需要对业主详情信息进行详情、修改或删除操作;如图5-9所示:

图5-9业主管理界面

管理员点击小区信息管理。在小区信息页面输入小区名称、小区位置和负责人进行查询、新增或删除小区信息列表,并根据需要对小区详情信息进行详情、修改或删除操作;如图5-10所示:

图5-10小区信息管理界面

管理员点击资产信息管理。在资产信息页面输入资产名称、资产类型和选择小区名称进行查询、新增、删除或统计报表资产信息列表,并根据需要对资产详情信息进行详情、修改或删除操作;如图5-11所示:

图5-11资产信息管理界面

管理员点击业主车辆管理。在业主车辆页面输入车牌号、车辆品牌、姓名和选择换挡方式进行查询或删除业主车辆列表,并根据需要对业主车辆详情信息进行详情、修改或删除操作;如图5-12所示:

图5-12业主车辆管理界面

管理员点击业主宠物管理。在业主宠物页面输入宠物名称、宠物种类、姓名和楼房号进行查询或删除业主宠物列表,并根据需要对业主宠物详情信息进行详情、修改或删除操作;如图5-13所示:

图5-13业主宠物管理界面

管理员点击车位信息管理。在车位信息页面输入车位名称、车位位置和选择状态进行查询、新增、删除或统计报表车位信息列表,并根据需要对车位详情信息进行详情、修改或删除操作;如图5-14所示:

图5-14车位信息管理界面

管理员点击购买车位管理。在购买车位页面输入车位名称、姓名、楼房号、小区名称和选择是否通过进行查询、删除或统计报表购买车位列表,并根据需要对购买车位详情信息进行详情、修改或删除操作;如图5-15所示:

图5-15购买车位管理界面

管理员点击缴费通知管理。在缴费通知页面输入姓名、楼房号和选择收费项目进行查询、新增、删除或统计报表缴费通知列表,并根据需要对缴费通知详情信息进行详情、修改或删除操作;如图5-16所示:

图5-16缴费通知管理界面

管理员点击留言板管理。在留言板页面输入用户名进行查询或删除留言板列表,并根据需要对留言板详情信息进行详情、修改、回复或删除操作;如图5-17所示:

图5-17留言板管理界面

管理员点击系统管理。在小区公告页面输入标题进行查询、新增或删除小区公告列表,并根据需要对小区公告详情信息进行详情、修改或删除操作;还可以对关于我们、系统简介和轮播图管理进行详细操作;如图5-18所示:

图5-18系统管理界面

5.2.2业主模块实现

业主进入系统可以对个人中心、业主车辆管理、业主宠物管理、购买车位管理、缴费通知管理等功能进行操作。业主主页面如图5-19所示:

图5-19 业主主界面

业主点击业主车辆管理。在业主车辆页面输入车牌号、车辆品牌、姓名和选择换挡方式进行查询、新增或删除业主车辆列表,并根据需要对业主车辆详情信息进行详情、修改或删除操作;如图5-20所示:

图5-20业主车辆管理界面

业主点击业主宠物管理。在业主宠物页面输入宠物名称、宠物种类、姓名和楼房号进行查询、新增或删除业主宠物列表,并根据需要对业主宠物详情信息进行详情、修改或删除操作;如图5-21所示:

图5-21业主宠物管理界面

系统测试

WuyerenyuanController.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.transaction.annotation.Transactional;
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.WuyerenyuanEntity;
import com.entity.view.WuyerenyuanView;import com.service.WuyerenyuanService;
import com.service.TokenService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.MD5Util;
import com.utils.MPUtil;
import com.utils.CommonUtil;
import java.io.IOException;/*** 物业人员* 后端接口* @author * @email * @date 2023-01-26 18:34:57*/
@RestController
@RequestMapping("/wuyerenyuan")
public class WuyerenyuanController {@Autowiredprivate WuyerenyuanService wuyerenyuanService;@Autowiredprivate TokenService tokenService;/*** 登录*/@IgnoreAuth@RequestMapping(value = "/login")public R login(String username, String password, String captcha, HttpServletRequest request) {WuyerenyuanEntity u = wuyerenyuanService.selectOne(new EntityWrapper<WuyerenyuanEntity>().eq("wuyegonghao", username));if(u==null || !u.getMima().equals(password)) {return R.error("账号或密码不正确");}String token = tokenService.generateToken(u.getId(), username,"wuyerenyuan",  "物业人员" );return R.ok().put("token", token);}/*** 注册*/@IgnoreAuth@RequestMapping("/register")public R register(@RequestBody WuyerenyuanEntity wuyerenyuan){//ValidatorUtils.validateEntity(wuyerenyuan);WuyerenyuanEntity u = wuyerenyuanService.selectOne(new EntityWrapper<WuyerenyuanEntity>().eq("wuyegonghao", wuyerenyuan.getWuyegonghao()));if(u!=null) {return R.error("注册用户已存在");}Long uId = new Date().getTime();wuyerenyuan.setId(uId);wuyerenyuanService.insert(wuyerenyuan);return R.ok();}/*** 退出*/@RequestMapping("/logout")public R logout(HttpServletRequest request) {request.getSession().invalidate();return R.ok("退出成功");}/*** 获取用户的session用户信息*/@RequestMapping("/session")public R getCurrUser(HttpServletRequest request){Long id = (Long)request.getSession().getAttribute("userId");WuyerenyuanEntity u = wuyerenyuanService.selectById(id);return R.ok().put("data", u);}/*** 密码重置*/@IgnoreAuth@RequestMapping(value = "/resetPass")public R resetPass(String username, HttpServletRequest request){WuyerenyuanEntity u = wuyerenyuanService.selectOne(new EntityWrapper<WuyerenyuanEntity>().eq("wuyegonghao", username));if(u==null) {return R.error("账号不存在");}u.setMima("123456");wuyerenyuanService.updateById(u);return R.ok("密码已重置为:123456");}/*** 后端列表*/@RequestMapping("/page")public R page(@RequestParam Map<String, Object> params,WuyerenyuanEntity wuyerenyuan,HttpServletRequest request){EntityWrapper<WuyerenyuanEntity> ew = new EntityWrapper<WuyerenyuanEntity>();PageUtils page = wuyerenyuanService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, wuyerenyuan), params), params));return R.ok().put("data", page);}/*** 前端列表*/@IgnoreAuth@RequestMapping("/list")public R list(@RequestParam Map<String, Object> params,WuyerenyuanEntity wuyerenyuan, HttpServletRequest request){EntityWrapper<WuyerenyuanEntity> ew = new EntityWrapper<WuyerenyuanEntity>();PageUtils page = wuyerenyuanService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, wuyerenyuan), params), params));return R.ok().put("data", page);}/*** 列表*/@RequestMapping("/lists")public R list( WuyerenyuanEntity wuyerenyuan){EntityWrapper<WuyerenyuanEntity> ew = new EntityWrapper<WuyerenyuanEntity>();ew.allEq(MPUtil.allEQMapPre( wuyerenyuan, "wuyerenyuan")); return R.ok().put("data", wuyerenyuanService.selectListView(ew));}/*** 查询*/@RequestMapping("/query")public R query(WuyerenyuanEntity wuyerenyuan){EntityWrapper< WuyerenyuanEntity> ew = new EntityWrapper< WuyerenyuanEntity>();ew.allEq(MPUtil.allEQMapPre( wuyerenyuan, "wuyerenyuan")); WuyerenyuanView wuyerenyuanView =  wuyerenyuanService.selectView(ew);return R.ok("查询物业人员成功").put("data", wuyerenyuanView);}/*** 后端详情*/@RequestMapping("/info/{id}")public R info(@PathVariable("id") Long id){WuyerenyuanEntity wuyerenyuan = wuyerenyuanService.selectById(id);return R.ok().put("data", wuyerenyuan);}/*** 前端详情*/@IgnoreAuth@RequestMapping("/detail/{id}")public R detail(@PathVariable("id") Long id){WuyerenyuanEntity wuyerenyuan = wuyerenyuanService.selectById(id);return R.ok().put("data", wuyerenyuan);}/*** 后端保存*/@RequestMapping("/save")public R save(@RequestBody WuyerenyuanEntity wuyerenyuan, HttpServletRequest request){wuyerenyuan.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());//ValidatorUtils.validateEntity(wuyerenyuan);WuyerenyuanEntity u = wuyerenyuanService.selectOne(new EntityWrapper<WuyerenyuanEntity>().eq("wuyegonghao", wuyerenyuan.getWuyegonghao()));if(u!=null) {return R.error("用户已存在");}wuyerenyuan.setId(new Date().getTime());wuyerenyuanService.insert(wuyerenyuan);return R.ok();}/*** 前端保存*/@RequestMapping("/add")public R add(@RequestBody WuyerenyuanEntity wuyerenyuan, HttpServletRequest request){wuyerenyuan.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());//ValidatorUtils.validateEntity(wuyerenyuan);WuyerenyuanEntity u = wuyerenyuanService.selectOne(new EntityWrapper<WuyerenyuanEntity>().eq("wuyegonghao", wuyerenyuan.getWuyegonghao()));if(u!=null) {return R.error("用户已存在");}wuyerenyuan.setId(new Date().getTime());wuyerenyuanService.insert(wuyerenyuan);return R.ok();}/*** 修改*/@RequestMapping("/update")@Transactionalpublic R update(@RequestBody WuyerenyuanEntity wuyerenyuan, HttpServletRequest request){//ValidatorUtils.validateEntity(wuyerenyuan);wuyerenyuanService.updateById(wuyerenyuan);//全部更新return R.ok();}/*** 删除*/@RequestMapping("/delete")public R delete(@RequestBody Long[] ids){wuyerenyuanService.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<WuyerenyuanEntity> wrapper = new EntityWrapper<WuyerenyuanEntity>();if(map.get("remindstart")!=null) {wrapper.ge(columnName, map.get("remindstart"));}if(map.get("remindend")!=null) {wrapper.le(columnName, map.get("remindend"));}int count = wuyerenyuanService.selectCount(wrapper);return R.ok().put("count", count);}}
ZichanxinxiServiceImpl.java
package com.service.impl;import org.springframework.stereotype.Service;
import java.util.Map;
import java.util.List;import com.baomidou.mybatisplus.mapper.Wrapper;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import com.utils.PageUtils;
import com.utils.Query;import com.dao.ZichanxinxiDao;
import com.entity.ZichanxinxiEntity;
import com.service.ZichanxinxiService;
import com.entity.vo.ZichanxinxiVO;
import com.entity.view.ZichanxinxiView;@Service("zichanxinxiService")
public class ZichanxinxiServiceImpl extends ServiceImpl<ZichanxinxiDao, ZichanxinxiEntity> implements ZichanxinxiService {@Overridepublic PageUtils queryPage(Map<String, Object> params) {Page<ZichanxinxiEntity> page = this.selectPage(new Query<ZichanxinxiEntity>(params).getPage(),new EntityWrapper<ZichanxinxiEntity>());return new PageUtils(page);}@Overridepublic PageUtils queryPage(Map<String, Object> params, Wrapper<ZichanxinxiEntity> wrapper) {Page<ZichanxinxiView> page =new Query<ZichanxinxiView>(params).getPage();page.setRecords(baseMapper.selectListView(page,wrapper));PageUtils pageUtil = new PageUtils(page);return pageUtil;}@Overridepublic List<ZichanxinxiVO> selectListVO(Wrapper<ZichanxinxiEntity> wrapper) {return baseMapper.selectListVO(wrapper);}@Overridepublic ZichanxinxiVO selectVO(Wrapper<ZichanxinxiEntity> wrapper) {return baseMapper.selectVO(wrapper);}@Overridepublic List<ZichanxinxiView> selectListView(Wrapper<ZichanxinxiEntity> wrapper) {return baseMapper.selectListView(wrapper);}@Overridepublic ZichanxinxiView selectView(Wrapper<ZichanxinxiEntity> wrapper) {return baseMapper.selectView(wrapper);}@Overridepublic List<Map<String, Object>> selectValue(Map<String, Object> params, Wrapper<ZichanxinxiEntity> wrapper) {return baseMapper.selectValue(params, wrapper);}@Overridepublic List<Map<String, Object>> selectTimeStatValue(Map<String, Object> params, Wrapper<ZichanxinxiEntity> wrapper) {return baseMapper.selectTimeStatValue(params, wrapper);}@Overridepublic List<Map<String, Object>> selectGroup(Map<String, Object> params, Wrapper<ZichanxinxiEntity> wrapper) {return baseMapper.selectGroup(params, wrapper);}}
NewsController.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.transaction.annotation.Transactional;
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.NewsEntity;
import com.entity.view.NewsView;import com.service.NewsService;
import com.service.TokenService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.MD5Util;
import com.utils.MPUtil;
import com.utils.CommonUtil;
import java.io.IOException;/*** 小区公告* 后端接口* @author * @email * @date 2023-01-26 18:34:58*/
@RestController
@RequestMapping("/news")
public class NewsController {@Autowiredprivate NewsService newsService;/*** 后端列表*/@RequestMapping("/page")public R page(@RequestParam Map<String, Object> params,NewsEntity news,HttpServletRequest request){EntityWrapper<NewsEntity> ew = new EntityWrapper<NewsEntity>();PageUtils page = newsService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, news), params), params));return R.ok().put("data", page);}/*** 前端列表*/@IgnoreAuth@RequestMapping("/list")public R list(@RequestParam Map<String, Object> params,NewsEntity news, HttpServletRequest request){EntityWrapper<NewsEntity> ew = new EntityWrapper<NewsEntity>();PageUtils page = newsService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, news), params), params));return R.ok().put("data", page);}/*** 列表*/@RequestMapping("/lists")public R list( NewsEntity news){EntityWrapper<NewsEntity> ew = new EntityWrapper<NewsEntity>();ew.allEq(MPUtil.allEQMapPre( news, "news")); return R.ok().put("data", newsService.selectListView(ew));}/*** 查询*/@RequestMapping("/query")public R query(NewsEntity news){EntityWrapper< NewsEntity> ew = new EntityWrapper< NewsEntity>();ew.allEq(MPUtil.allEQMapPre( news, "news")); NewsView newsView =  newsService.selectView(ew);return R.ok("查询小区公告成功").put("data", newsView);}/*** 后端详情*/@RequestMapping("/info/{id}")public R info(@PathVariable("id") Long id){NewsEntity news = newsService.selectById(id);return R.ok().put("data", news);}/*** 前端详情*/@IgnoreAuth@RequestMapping("/detail/{id}")public R detail(@PathVariable("id") Long id){NewsEntity news = newsService.selectById(id);return R.ok().put("data", news);}/*** 后端保存*/@RequestMapping("/save")public R save(@RequestBody NewsEntity news, HttpServletRequest request){news.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());//ValidatorUtils.validateEntity(news);newsService.insert(news);return R.ok();}/*** 前端保存*/@RequestMapping("/add")public R add(@RequestBody NewsEntity news, HttpServletRequest request){news.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());//ValidatorUtils.validateEntity(news);newsService.insert(news);return R.ok();}/*** 修改*/@RequestMapping("/update")@Transactionalpublic R update(@RequestBody NewsEntity news, HttpServletRequest request){//ValidatorUtils.validateEntity(news);newsService.updateById(news);//全部更新return R.ok();}/*** 删除*/@RequestMapping("/delete")public R delete(@RequestBody Long[] ids){newsService.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<NewsEntity> wrapper = new EntityWrapper<NewsEntity>();if(map.get("remindstart")!=null) {wrapper.ge(columnName, map.get("remindstart"));}if(map.get("remindend")!=null) {wrapper.le(columnName, map.get("remindend"));}int count = newsService.selectCount(wrapper);return R.ok().put("count", count);}}
add-or-update.vue
<template><div class="addEdit-block" style="width: 100%;"><el-form:style='{"border":"1px solid #FF8C51","padding":"30px","boxShadow":"0px 4px 10px 0px rgba(0,0,0,0.3020)","borderRadius":"0","flexWrap":"wrap","background":"#fff","display":"flex"}'class="add-update-preview"ref="ruleForm":model="ruleForm":rules="rules"label-width="100px"><template ><el-form-item :style='{"width":"50%","margin":"0 0 20px 0"}' 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><el-form-item :style='{"width":"50%","margin":"0 0 20px 0"}' v-else class="input" label="用户名" prop="username"><el-input v-model="ruleForm.username" placeholder="用户名" readonly></el-input></el-form-item><el-form-item :style='{"width":"50%","margin":"0 0 20px 0"}' 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><el-form-item :style='{"width":"50%","margin":"0 0 20px 0"}' v-else class="input" label="密码" prop="password"><el-input v-model="ruleForm.password" placeholder="密码" readonly></el-input></el-form-item></template><el-form-item :style='{"width":"100%","padding":"0","margin":"0"}' class="btn"><el-button :style='{"border":"0","cursor":"pointer","padding":"0","margin":"0 20px 0 0","outline":"none","color":"rgba(255, 255, 255, 1)","borderRadius":"0","background":"#FF8C51","width":"128px","lineHeight":"40px","fontSize":"14px","height":"40px"}'  v-if="type!='info'" type="primary" class="btn-success" @click="onSubmit">提交</el-button><el-button :style='{"border":"0px solid rgba(64, 158, 255, 1)","cursor":"pointer","padding":"0","margin":"0","outline":"none","color":"#fff","borderRadius":"0","background":"#FF8C51","width":"128px","lineHeight":"40px","fontSize":"14px","height":"40px"}' v-if="type!='info'" class="btn-close" @click="back()">取消</el-button><el-button :style='{"border":"0px solid rgba(64, 158, 255, 1)","cursor":"pointer","padding":"0","margin":"0","outline":"none","color":"#fff","borderRadius":"0","background":"#FF8C51","width":"128px","lineHeight":"40px","fontSize":"14px","height":"40px"}' 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 = thisvar 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 {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() {},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=='logistics'){this.logistics=false;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() {var objcross = this.$storage.getObj('crossObj');//更新跨表属性var crossuserid;var crossrefid;var crossoptnum;if(this.type=='cross'){var statusColumnName = this.$storage.get('statusColumnName');var statusColumnValue = this.$storage.get('statusColumnValue');if(statusColumnName!='') {var obj = this.$storage.getObj('crossObj');if(statusColumnName && !statusColumnName.startsWith("[")) {for (var o in obj){if(o==statusColumnName){obj[o] = statusColumnValue;}}var table = this.$storage.get('crossTable');this.$http({url: `${table}/update`,method: "post",data: obj}).then(({ data }) => {});} else {crossuserid=this.$storage.get('userid');crossrefid=obj['id'];crossoptnum=this.$storage.get('statusColumnName');crossoptnum=crossoptnum.replace(/\[/,"").replace(/\]/,"");}}}this.$refs["ruleForm"].validate(valid => {if (valid) {if(crossrefid && crossuserid) {this.ruleForm.crossuserid = crossuserid;this.ruleForm.crossrefid = crossrefid;let params = { page: 1, limit: 10, crossuserid:this.ruleForm.crossuserid,crossrefid:this.ruleForm.crossrefid,} this.$http({ url: "users/page", method: "get", params: params }).then(({ data }) => { if (data && data.code === 0) { if(data.data.total>=crossoptnum) {this.$message.error(this.$storage.get('tips'));return false;} else {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);}});}} else { } });} else {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);}});}}});},// 获取uuidgetUUID () {return new Date().getTime();},// 返回back() {this.parent.showFlag = true;this.parent.addOrUpdateFlag = false;this.parent.usersCrossAddOrUpdateFlag = false;this.parent.contentStyleChange();},}
};
</script>
<style lang="scss" scoped>.amap-wrapper {width: 100%;height: 500px;}.search-box {position: absolute;}.el-date-editor.el-input {width: auto;}.add-update-preview .el-form-item /deep/ .el-form-item__label {padding: 0 10px 0 0;color: #666;font-weight: 500;width: 100px;font-size: 14px;line-height: 40px;text-align: right;}.add-update-preview .el-form-item /deep/ .el-form-item__content {margin-left: 100px;}.add-update-preview .el-input /deep/ .el-input__inner {border: 2px solid #797979;border-radius: 0;padding: 0 12px;box-shadow: 0 0 0px rgba(64, 158, 255, .5);outline: none;color: #000;width: 400px;font-size: 14px;height: 40px;}.add-update-preview .el-select /deep/ .el-input__inner {border: 2px solid #797979;border-radius: 0;padding: 0 10px;box-shadow: 0 0 0px rgba(64, 158, 255, .5);outline: none;color: #000;width: 200px;font-size: 14px;height: 40px;}.add-update-preview .el-date-editor /deep/ .el-input__inner {border: 2px solid #797979;border-radius: 0;padding: 0 10px 0 30px;box-shadow: 0 0 0px rgba(64, 158, 255, .5);outline: none;color: #000;width: 200px;font-size: 14px;height: 40px;}.add-update-preview /deep/ .el-upload--picture-card {background: transparent;border: 0;border-radius: 0;width: auto;height: auto;line-height: initial;vertical-align: middle;}.add-update-preview /deep/ .upload .upload-img {border: 1px dashed #797979;cursor: pointer;border-radius: 6px;color: #797979;width: 90px;font-size: 32px;line-height: 90px;text-align: center;height: 90px;}.add-update-preview /deep/ .el-upload-list .el-upload-list__item {border: 1px dashed #797979;cursor: pointer;border-radius: 6px;color: #797979;width: 90px;font-size: 32px;line-height: 90px;text-align: center;height: 90px;}.add-update-preview /deep/ .el-upload .el-icon-plus {border: 1px dashed #797979;cursor: pointer;border-radius: 6px;color: #797979;width: 90px;font-size: 32px;line-height: 90px;text-align: center;height: 90px;}.add-update-preview .el-textarea /deep/ .el-textarea__inner {border: 2px solid #797979;border-radius: 0;padding: 12px;box-shadow: 0 0 0px rgba(64, 158, 255, .5);outline: none;color: #000;width: 400px;font-size: 14px;height: 120px;}
</style>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/406081.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【Kubernetes】k8s集群之包管理器Helm

目录 一.Helm概述 1.Helm的简介 2.Helm的三个重要概念 3.Helm2与Helm3的的区别 二.Helm 部署 1.安装 helm 2.使用 helm 安装 Chart 3.Helm 自定义模板 4.Helm 仓库 每个成功的软件平台都有一个优秀的打包系统&#xff0c;比如Debian、Ubuntu 的 apt&#xff0c;RedH…

如何构建和使用“无审查”模型

一些已经构建好的“无审查”模型 https://huggingface.co/ehartford/WizardLM-30B-Uncensored https://huggingface.co/ehartford/WizardLM-13B-Uncensored https://huggingface.co/ehartford/WizardLM-7B-Uncensored https://huggingface.co/ehartford/Wizard-Vicuna-13B-…

3.js - 使用着色器实现各种图形

有更多案例&#xff0c;私我 main.js import * as THREE from three import { OrbitControls } from three/examples/jsm/controls/OrbitControls import * as dat from dat.gui import { GUI } from three/examples/jsm/libs/lil-gui.module.min.js// ts-ignore import basi…

Prometheus3: 监控CPU

1. 查看监控CPU所需的key [rootlocalhost node_exporter]# curl http://localhost:9100/metrics | grep -i node_cpu | head% Total % Received % Xferd Average Speed Time Time Time CurrentDload Upload Total Spent Left Speed0 0 0 0 …

03、Redis实战:商户查询缓存、缓存更新策略、缓存穿透、缓存雪崩、缓存击穿

2、商户查询缓存 2.1 什么是缓存? 什么是缓存? 就像自行车,越野车的避震器 举个例子:越野车,山地自行车,都拥有"避震器",防止车体加速后因惯性,在酷似"U"字母的地形上飞跃,硬着陆导致的损害,像个弹簧一样; 同样,实际开发中,系统也需要"避震器&qu…

初阶数据结构之计数排序

非比较排序 计数排序 计数排序⼜称为鸽巢原理&#xff0c;是对哈希直接定址法的变形应⽤。 操作步骤&#xff1a; 1&#xff09;统计相同元素出现次数 2&#xff09;根据统计的结果将序列回收到原来的序列中 #include "CountSort.h" void Count(int* arr, int n)…

线段树-点修区查

翻博客的时候突然发现线段树好像一个没有&#xff0c;我就准备把线段树给讲一下 分三个章节 点修区查 区修区查 区修区查&#xff08;带乘法&#xff09; 今天这一章比较简单&#xff0c;最多就区查稍微要动一点脑子 题目简介 输入n和m&#xff0c;n代表数的个数&#x…

读软件开发安全之道:概念、设计与实施05模式(上)

1. 模式 1.1. 模式分类 1.1.1. 设计属性 1.1.2. 暴露最少信息 1.1.3. 冗余 1.1.4. 强力执行 1.1.5. 信任与责任 1.1.6. 反模式 1.2. 模式可以缓解或者避免很多种类的风险&#xff0c;它们可以形成一个重要的工具箱&#xff0c;帮我们解决潜在的安全威胁 1.3. 不需要为…

学习设置echarts 折线图使用相关参数的方法整理

学习设置echarts 折线图使用相关参数的方法整理 折线图堆叠设置为不堆叠的方法 折线图堆叠设置为不堆叠的方法 官网是这样的&#xff0c;但是不需要这种堆叠形式的如下图&#xff1a; 第2条数据值 第1条数据值 第2条数据值 第3条数据值 第2条数据值 第3条数据值 需要改成…

C语言高手参考手册:函数进阶技巧

[大师C语言]合集&#xff3b;大师C语言(第一篇)&#xff3d;C语言栈溢出背后的秘密&#xff3b;大师C语言(第二十五篇)&#xff3d;C语言字符串探秘&#xff3b;大师C语言(第二篇)&#xff3d;C语言main函数背后的秘密&#xff3b;大师C语言(第二十六篇)&#xff3d;C语言结构体…

汽车管理 API 接口:开启高效车辆运营新时代

API&#xff08;Application Programming Interface&#xff09;是一种接口&#xff0c;用于不同软件之间的通信。在汽车管理领域&#xff0c;API的应用可以帮助提升车辆运营的效率&#xff0c;让车主和车辆管理者更方便地获取车辆相关信息&#xff0c;进行保养和维修等工作。本…

Linux yum提示Error downloading packages

很明显的错误&#xff0c;没有考虑过磁盘空间&#xff0c;记录一下。 Error downloading packages:gcc-4.8.5-44.el7.x86_64: Insufficient space in download directory /var/cache/yum/x86_64/7/base/packages* free 0 * needed 16 M使用du查看当前目录下所有文件大小 du …

黑马头条vue2.0项目实战(十一)——功能优化(组件缓存、响应拦截器、路由跳转与权限管理)

1. 组件缓存 1.1 介绍 先来看一个问题&#xff1f; 从首页切换到我的&#xff0c;再从我的回到首页&#xff0c;我们发现首页重新渲染原来的状态没有了。 首先&#xff0c;这是正常的状态&#xff0c;并非问题&#xff0c;路由在切换的时候会销毁切出去的页面组件&#xff…

HBase原理和操作

目录 一、HBase在Zookeeper中的存储元数据信息集群状态信息 二、HBase的操作Web Console命令行操作 三、HBase中数据的保存过程 一、HBase在Zookeeper中的存储 元数据信息 HBase的元数据信息是HBase集群运行所必需的关键数据&#xff0c;它存储在Zookeeper的"/hbase&quo…

数据结构——链式队列和循环队列

目录 引言 队列的定义 队列的分类 1.单链表实现 2.数组实现 队列的功能 队列的声明 1.链式队列 2.循环队列 队列的功能实现 1.队列初始化 (1)链式队列 (2)循环队列 (3)复杂度分析 2.判断队列是否为空 (1)链式队列 (2)循环队列 (3)复杂度分析 3.判断队列是否…

【具体数学 Concrete Mathematics】1.1.2 平面上的直线

【具体数学 Concrete Mathematics】1.1.2 平面上的直线

Django 第一课 -- 简介

目录 一. 基本介绍 二. 特点 三. MVC 与 MTV 模型 3.1. MVC 模型 3.2. MTV 模型 一. 基本介绍 Django 是一个由 Python 编写的一个开放源代码的 Web 应用框架。 Django 是一个高级的 Python Web 框架&#xff0c;用于快速开发可维护和可扩展的 Web 应用程序。 使用 Dja…

计算机毕业设计Python深度学习房价预测 房价可视化 链家爬虫 房源爬虫 房源可视化 卷积神经网络 大数据毕业设计 机器学习 人工智能 AI

基于python一/二手房数据爬虫分析预测系统可视化 商品房数据Flask框架&#xff08;附源码&#xff09; 项目介绍 技术栈&#xff1a; python语言、Flask框架、MySQL数据库、Echarts可视化 sklearn机器学习 多元线性回归预测模型、requests爬虫框架 链家一手房 一手房数据商品房…

docker连接宿主机redis,提示Connection refused

目录 一、测试环境 二、问题现象 三、问题总结 一、测试环境 centos 7 redis-5.0.14 docker-26.0.1 二、问题现象 服务器重启后docker连接宿主机redis&#xff0c;提示Connection refused Reconnecting, last destination was /172.25.xxx.x:6379 …

VMware vSphere Client无法访问和连接ESXi虚拟主机解决思路

文章目录 前言1. 问题现象2. 问题原因3. 解决方法4. 参考文章 前言 注意 : 可以先看看参考文章那里&#xff0c;在回过来看 1 、 2 、3 1. 问题现象 版本&#xff1a;VMware vCenter Server 5.5.0 build-2442329 问题描述&#xff1a;用VMware vSphere Client 登录ESXI主机出…