如何使用ssm实现基于Java的高校物业工程报修系统

news2024/9/30 1:04:09

@TOC

ssm736基于Java的高校物业工程报修系统+jsp

绪论

1.1研究背景与意义

信息化管理模式是将行业中的工作流程由人工服务,逐渐转换为使用计算机技术的信息化管理服务。这种管理模式发展迅速,使用起来非常简单容易,用户甚至不用掌握相关的专业知识,根据教程指导即可正常使用相关的系统,因而被越来越多的用户所使用。由于相关行业管理信息化,这就使得管理工作不在受到时间和区域的限制,随时随地即可完成相关的工作任务和结果[1]。就目前而言,管理信息化在现代社会中非常流行,使用比较广泛。早在20世纪70年代末,就出现了早期的电子商务,相关的公司企业使用计算机建立专用的内部网络,通过内部网络完成相应的采购、销售等活动,加快相关的企业之间的交易速度,提高了工作效率[2]。

当下,许多行业采用互联网技术将工作流程信息化、数字化,提高了相关人员的服务质量和效率,节约了相关行业的人力、财力、物力等资源,与此同时,人们获取外界的相关信息主要依赖于主流的信息化技术和工具。人们对生活的需求也在不断的发生着变化,为了应对用户的多样化需求,许多相关的第三产业应运而生,管理信息化也逐渐的流行起来,比如电子商务行业。本人通过查询大量学习资料,了解基本的开发系统的基本背景和关键任务,学习与掌握Java语言、web技术、AJAX技术、HTML语言等开发技术,设计系统功能模块,以及MySQL数据库的相关语法和工具,创建和存储数据表格,反映和关联表格之间相互存在的关系,由此对高校物业工程报修系统进行研发和实现。

1.2国内外研究现状

大概在20世纪90年代,我国才开始研发高校物业工程报修系统,与一些发达国家相比,系统研发起步比较晚。当时的计算机技术刚开始发展起来,国家经济力量比较薄弱,各地区的经济发展水平不平衡,再加上相关的网络应用技术不太先进,我国也使用了一段较长的时间对网络信息化管理进行探索[3]。近些年,因为国家非常重视和支持第三产业的发展,以及人们的日常生活需求越来越离不开信息管理技术的使用,所以我国的信息管理系统行业发展速度非常快,并且相关的体制法规也正在不断地被完善和改进。新时代背景下,根据人们的相关需求,不断地促进着相关产业的产生与发展,一系列电子产品、应用软件、信息管理系统等新时代的产物逐渐出现在人们的视野中,并且在近几年发展迅速,日渐趋于成熟[4]。

与国内相比,国外高校物业工程报修系统领域发展较早。国外的计算机技术发展比较成熟,所以系统相关的设计也比较完善。19世纪60年代左右,国外就开始研发高校物业工程报修系统,并且不久之后,迅速将其投入市场进行使用。美国、英国等一些发达国家快速发展计算机技术,促进了高校物业工程报修系统管理行业信息化建设[5]。而后随着相关的技术不断地发展,覆盖面非常广泛,应用领域比较多,促进着高校物业工程报修系统等相关的信息管理系统不断地发展和完善,并且其所设计的系统功能结构也比较合理、全面。相对而言,国外系统的研发在相关领域上还是占据着较大的优势[6]。因此,我们需要吸收国外系统开发领域中的较好的技术精华,发展我国的信息化管理系统,使得其面向大众,能够更好的、更全面的服务于相关的工作人员。

1.3研究内容

现今,互联网在我们的日常生活占据着日益重要的地位,我们也越来越离不开对移动设备、电脑等上网设备的使用。传统的高校物业工程报修系统模式主要依靠管理人员纯手工记录的相关信息,比较繁琐,不方便查找,也非常容易出现错误。如今,如果再通过手工记录报修,将大大不利于高校物业工程报修系统行业管理相关的高校物业工程报修系统信息,严重影响高校物业工程报修系统行业的发展。因此,本人结合传统的高校物业工程报修系统业务模式和先进的电子信息管理模式,使用Java语言编程设计功能模块,AJAX实现前台和后台之间的交互,MySQL数据库创建和存储数据表格,对高校物业工程报修系统进行设计和开发。本系统的设计有利于相关行业实现最大化的资源管理与共享,促进相关行业的信息交流、分工合作,提高相关工作人员的工作效率,最终实现整个高校物业工程报修系统行业服务的信息化管理。

1.4论文结构

本文围绕着高校物业工程报修系统的整个开发过程,展开了详细的描述和说明,设计和实现本系统的主要工作有:首先分析研究背景、研究状态,其次介绍设计系统时使用到的相关技术,然后通过系统分析确定系统的功能需求,接着通过编码工作详细设计和实现系统,最后再通过系统测试,找出系统存在的问题和解决问题的方法,不断地修改和完善系统。论文内容的组织结构设计如下。

第一章绪论,通过介绍本系统的研究背景、研究现状等内容,帮助用户了解和认识本系统的发展过程。

第二章相关技术介绍,主要介绍了Java语言、B/S模式、MySQL数据库等相关的开发技术,为后期系统的功能实现提供技术上的支持。

第三章系统分析,分析用户的使用需求,以及系统实现的可行性,最后通过用例建模分析与系统相关的参与者及其用例之间的关系。

第四章系统设计,主要根据系统总体功能设计,确定将要设计的系统功能模块,设计相关的数据表格。

第五章系统实现,通过相关的功能模块运行图,展现出系统的主要功能模块操作流程。

第六章系统测试,主要使用功能测试的方式,测试系统的相关功能运行和使用的具体情况。

第七章总结与展望,通过本文的各章节描述总结得出,基本上完成了系统的设计,展望未来将学习和使用更加先进的技术,提高系统的实用性,使得系统更好的服务于使用人员。

1.5本章小结

本章主要介绍了课题的研究背景与意义,研究现状,研究内容等内容,最后介绍了本论文的组织结构设计。信息化管理模式顺应了信息化时代的变化,本人以现在主流的管理模式为前提,根据使用者的相关需求,设计出一款符合大众需求的高校物业工程报修系统。

2理论基础

2.1 B/S模式

B/S模式(Browser/Server)是一种比较常用的网络结构模式[7]。B/S模式是由模型、视图、控制器(Model-View-Controller,MVC)结构组成[8]。模型主要是指业务模型,视图主要是指用户界面,控制器主要是控制保证视图和模型的同步执行。B/S模式的三层结构是相互独立的,换句话说,当某一个模块发生修改和更新,其不会对其他模块产生影响。根据B/S的这一特点,可以将对业务逻辑的处理以及约束条件集中到中间层中,便于前端增加对模型和方法的调用和复用。并且可以直接通过中间层对数据库进行相关的操作处理,大大减少了数据库的连接数,节省了计算机的对相关的资源配置空间。

使用B/S模式可以节省系统资源配置,提高研发工作效率,减少开发时间,因而大大提高了我们开发软件的可能性。B/S模式有针对性的改变了传统的客户端/服务器模式(Client/Server,C/S模式),也可以说这是对C/S模式进行了扩展。在这种结构模式中,用户不用再向使用C/S模式一样,下载客户端,其可以直接通过使用浏览器的方式,打开网站地址,即可访问和使用相关的系统功能服务。

2.2 IDEA开发环境

软件开发使用的编程语言有许多种,而每种编程语言需要通过与其相对应的开发平台进行编译和运行。IDEA平台都是目前比较常用的开发环境。IDEA平台是开源的,具有功能强大、可扩展性强等特点,可以应用于C/S模式软件的开发,但是它所占据的内存容量比较大,运行较慢,并且其并未提供Tomcat服务器,运行过程中需要将代码发布到Tomcat服务器中,测试使用的时间较长,故而不太适用于B/S模式软件的开发。

IDEA平台是建立在IDEA平台的基础之上,增加了许多的应用插件,比如Tomcat插件、mail组件等。IDEA平台增加了Tomcat插件,代码编写完成或者更新完成时,程序员无需将代码发布到Tomcat服务器中,可以直接通过调试实现程序的运行。IDEA平台增加了Mail组件,该组件可以为本程序提供标准的邮件方法,便于开发人员完成与邮件功能相关的编译工作。IDEA平台占据的内存空间较小,同时其也具有较高的可扩展性,编程人员可以根据需要添加和使用相关的插件。可以支持主流的开源产品和相关的开发框架,被广泛运用到相关的移动系统、web应用系统等开发中。相比于IDEA平台,本系统比较适合使用IDEA平台进行编程和开发。

2.3 MySQL数据库

MySQL是一种小型的关系型数据库管理系统,因为其运行速度快,占用内存空间小,并且源代码也是开源的,运行和维护成本低,系统性能稳定,受到了许多开发人员的喜爱[9]。考虑到MySQL数据库开发成本低,功能齐全等因素,大多中小型网站选择使用MySQL数据库管理数据信息。

SQL Server也是近几年使用较多的关系型数据库,其与MySQL数据库存在的不同之处主要有,在环境方面,SQL Server数据库比较适合于.NET环境,而MySQL数据库适用于几乎所有的语言;在成本方面,SQL Server数据库是商业化的,其运行多个数据库可许证,虽然有一个免费版,但是只能让你对关系型数据库管理系统有一定的认识与了解,熟悉相关的使用流程。如果要想使用SQL Server数据库的话,就需要支付相关费用,而MySQL数据库是开源的,其对于用户来说,使用是完全免费;在实际应用方面,SQL Server数据库和MySQL数据库均支持Java语言、PHP语言、C++语言等多种编程语言,但是MySQL数据库除了支持上述SQL Server数据库能支持的编程语言外,还支持Scheme、Eiffel等其他编程语言,故而MySQL数据库受欢迎程度比SQL Server数据库更高。

2.4 Java语言

Java语言是一种面向对象的编程语言,其主要具有继承、封装、多态等特征,从而提高编程工作效率,实现软件的设计和开发[10]。继承机制可以继承相关的类和方法,新的类可以在继承已经定义的类的相关特性基础上,扩展自己新的数据和功能,进而提高自身的能力。封装机制可以提高程序的安全性,其隐藏对象的相关属性和行为,对外只提供一个接口,用户直接通过访问相应的接口来实现自己需要的功能操作。多态机制可以描述对象的多样性,简单的来说就是引用相同的对象做不同的事务。Java语言具有安全高效的优点,并且其通过依靠Java虚拟机,可以实现跨平台操作[11]。Java语言比较容易学习和掌握,就目前软件开发所使用的开发类语言而言,Java语言比较受程序员喜爱,应用比较广泛。

2.5本章小结

本章主要介绍了实现高校物业工程报修系统的相关理论基础以及开发工具。本系统采用B/S模式,使用Java语言、AJAX技术、MySQL数据库等工具,设计系统功能、页面布局、后台数据等。开发本系统所使用的相关技术操作简单、容易掌握,Java语言具有跨平台性,可以支持在不同的浏览器使用本系统,MySQL数据库是开源的,减少了本系统的开发成本。

3需求分析

3.1功能需求分析

需求分析过程是系统能否成功投入市场,也能否被用户所接受和使用的非常关键的一个步骤。功能需求分析是通过设计系统功能来实现相关的业务事项,详细分析用户的实际需要,确定需要设计的相关业务事项,其是系统实现的关键,本系统存在的主要功能需求包括用户注册管理、用户信息管理、客房信息管理等。

3.2技术需求分析

本系统需要使用Java语言编码设计相关的功能模块,MySQL数据库创建和存储数据表格,AJAX实现前台和后台之间的交互,并且需要在IDEA开发环境中,编写相关的Java代码等系统程序文件,使用MySQL数据库存储数据信息,然后通过使用连接代码完成与MySQL数据库的搭建工作,再通过使用开发环境中的Tomcat插件,完成与Tomcat服务器的发布工作,最后通过与Tomcat服务器的交互行为可以实现代码调试工作。满足以上相关的技术需求,本系统才可以在浏览器上进行访问和使用。

3.3数据需求分析

在设计系统功能模块时,需要收集与系统有关的数据信息,并且对采集的数据信息进行组织和存储,分析系统功能设计,筛选有价值的数据,而后形成数据字典。其中,从庞大的数据信息中筛选出有价值的数据是比较耗时,也是非常重要的一步,主要依据信息的来源、信息的有效性、信息的扩充性、信息的真实性等内容筛选数据。数据需求分析阶段,为系统的开发工作做好进一步准备,便于更好的设计和完成系统。

3.4安全需求分析

安全需求分析是在系统使用过程中对性能的具体要求,对功能需求的一个补充内容,也是对功能需求的一个补充内容,主要包括响应需求、安全性需求、稳定性需求、可扩展性需求等内容。安全需求是在系统功能需求以外的其他必要的需求内容,其不论在系统设计过程,还是在系统投入市场过程,都起到了极其重要的作用。

3.5可行性分析

3.5.1经济可行性

经济可行性是决定是否研发系统的关键性因素。我们主要通过比较实际的收益和成本的方法,来确定一个系统是否具有经济可行性。在使用系统的过程中,当获得的收益大于开发的成本时,说明此系统的研发在经济上是可行的。由于本系统的开发使用的技术基本上是开源的,获得技术上的支持是没有多少问题的,在软件实现方面所花费的成本是很低的,甚至不需要花费成本。研发系统的成本主要是来自调研、硬件和技术人员等方面。如果系统中需要存储的数据量不是很大,仅需要配置一台普通的服务器,即可满足相关需求。如果需要存储的数据量很大,则需要配置一台具有独立功能的服务器,比如管理数据库需要单独的数据库服务器,负责接入网站需要web服务器等等,但是一台服务器的价格是比较贵的。考虑到数据量和成本,我们使用小型集群服务器,这样既可以充分利用相关的资源,又可以让系统正常访问服务器。

3.5.2技术可行性

Java语言具有跨平台性,本系统主要通过Java语言进行编码实现的,所以本系统可以支持在多个操作系统或者多个浏览器上运行和使用[14]。MySQL数据库是可以被免费使用的,并且MySQL数据库的日常运行和维护工作比较简单,这样有利于降低本系统的开发成本[15]。在学校期间,本人已经学习和掌握了Java语言、MySQL数据库、AJAX技术等相关的技术相关知识以及用法,因此在技术可行性方面,本系统是可以实现被设计与实现的。

3.5.3操作可行性

本系统所采用网络结构是B/S模式,对于开发人员来说,可以直接复用相关的代码,或者稍微对原代码进行修改,使得其满足于本系统的相关需求,如此便可大大节约了开发时间,在最优最短的时间内完成对系统的设计。对于用户来说,在传统的模式下,需要下载客户端才可使用系统。现在,在新型的模式下,使用本系统,就不需要下载,直接选择浏览器打开网址,即可访问和使用本系统。并且,用户可以根据自身的工作需要,选择相关的菜单按钮操作本系统。在系统的一些功能模块中,本人还添加了相关的使用提示信息,方便用户更好更快的了解和使用本系统。因此,本系统的设计和实现是具备操作可行性的。

3.6本章小结

需求分析在软件开发周期中是耗时最长的一个环节,系统的整个设计和实现过程主要依赖于需求分析报告。调查收集出不同用户对本系统的相关使用需求,由此设计相关的功能模块,从而期望实现用户满意度较高的实用型系统。本章主要从功能需求、技术需求、数据需求、安全需求、可行性分析等方面,对系统进行需求分析,确保设计出一款实用价值比较高的管理系统。

4系统设计

4.1系统功能设计

本系统主要通过使用Java语言编码设计系统功能,MySQL数据库管理数据,AJAX技术设计简洁的、友好的网址页面,然后在IDEA开发平台中,编写相关的Java代码文件,接着通过连接语言完成与数据库的搭建工作,再通过平台提供的Tomcat插件完成信息的交互,最后在浏览器中打开系统网址便可使用本系统。本系统的使用角色可以被分为用户和管理员,用户具有注册、查看信息、留言信息等功能,管理员具有修改用户信息,发布新闻等功能,系统总体功能设计图如图4-1所示。

高校物业工程报修系统

系统设置管理

公告管理

用户管理

公告类型管理

报修管理

个人信息设置

密码信息设置管理

报修添加

报修删除

报修修改

用户添加

用户删除

公告类型添加

公告类型修改

公告类型删除

公告添加

公告修改

公告删除

图4-1系统总体功能设计图

4.2 数据库设计

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

4.2.1 数据库概念设计

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

(1)下图是用户实体和其具备的属性。

C:\Users\Administrator\Desktop\img\gaoxiaowuyegongchengbaoxiu\用户.jpg 图4.1 用户实体属性图

(2)下图是公告实体和其具备的属性。

C:\Users\Administrator\Desktop\img\gaoxiaowuyegongchengbaoxiu\公告.jpg 图4.2 公告实体属性图

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

C:\Users\Administrator\Desktop\img\gaoxiaowuyegongchengbaoxiu\报修.jpg 图4.3 报修实体属性图

(4)下图是工程师实体和其具备的属性。

C:\Users\Administrator\Desktop\img\gaoxiaowuyegongchengbaoxiu\工程师.jpg 图4.4 工程师实体属性图

4.2.2逻辑设计

本系统使用MySQL数据库管理与系统相关的数据信息。逻辑设计阶段是将上一个阶段中的概念数据模型,转换为方便数据库进行存储的关系模型,即基本表的形式,方便开发人员后期对数据模型进行优化和管理[20]。逻辑设计阶段是整个数据库设计设计的关键,与系统有关的信息将会在这一阶段中被存储在数据库中,当用户使用本系统进行相关的功能操作时,与之有关的数据信息所在的基本表会发生相应的更新变化。数据库的逻辑设计阶段主要任务是将与系统相关的数据信息,设计成为方便数据库存储和管理的基本表格的形式,具体内容如下。

表4.1报修表

序号列名数据类型说明允许空
1IdIntid
2yonghu_idInteger用户
3gongchengshi_idInteger工程师
4baoxiu_uuid_numberString报修编号
5baoxiu_nameString报修名称
6baoxiu_wupin_nameString报修物品
7baoxiu_addressString报修地点
8baoxiu_typesInteger报修类型
9insert_timeDate报修时间
10baoxiu_contentString报修详情
11baoxiu_zhuangtai_typesInteger报修状态
12create_timeDate创建时间

表4.2字典表

序号列名数据类型说明允许空
1IdIntid
2dic_codeString字段
3dic_nameString字段名
4code_indexInteger编码
5index_nameString编码名字
6super_idInteger父字段id
7beizhuString备注
8create_timeDate创建时间

表4.3公告表

序号列名数据类型说明允许空
1IdIntid
2gonggao_nameString公告名称
3gonggao_photoString公告图片
4gonggao_typesInteger公告类型
5insert_timeDate公告发布时间
6gonggao_contentString公告详情
7create_timeDate创建时间

表4.4用户表

序号列名数据类型说明允许空
1IdIntid
2yonghu_nameString用户姓名
3yonghu_phoneString用户手机号
4yonghu_id_numberString用户身份证号
5yonghu_photoString用户头像
6yonghu_emailString电子邮箱
7create_timeDate创建时间

表4.5工程师表

序号列名数据类型说明允许空
1IdIntid
2gongchengshi_nameString工程师姓名
3gongchengshi_phoneString工程师手机号
4gongchengshi_id_numberString工程师身份证号
5gongchengshi_photoString工程师头像
6gongchengshi_emailString电子邮箱
7create_timeDate创建时间

表4.6管理员表

序号列名数据类型说明允许空
1IdIntid
2usernameString用户名
3passwordString密码
4roleString角色
5addtimeDate新增时间

4.3本章小结

本章主要介绍了系统功能设计、数据库设计等内容。通过设计系统的总体功能框架,确定系统的功能设计主要包括报修等模块。数据库设计主要分为概念设计阶段和逻辑设计阶段,其中,概念设计是将现实世界中的数据转变为信息世界中的概念模型,逻辑设计是将概念设计中的概念模型转变成可以被数据库存储的数据表格。系统功能设计好坏是系统得以被编码实现的重要依据。数据库设计是否符合规范,是系统能够成功运行的基本保障,也是用户和系统实现交互处理的重要前提。

5系统实现

5.1管理员功能模块实现

5.1.1管理员登录

管理员可以选择任一浏览器打开网址,输入信息无误后,以管理员的身份行使相关的管理权限,管理员登录界面设计如图5-1所示。

图5-1管理员登录界面

5.1.2报修管理

管理员可以通过选择报修管理,管理相关的报修信息记录,比如进行查看报修信息标题,修改报修信息来源等操作,报修管理界面设计如图5-2所示。

图5-2报修管理界面

5.1.3公告管理

管理员可以通过选择公告管理,管理相关的公告信息记录,比如进行查看公告详情,删除错误的公告信息,发布公告等操作,公告管理界面如图5-3所示。

图5-3 公告管理界面

5.1.4公告类型管理

管理员可以通过选择公告类型管理,管理相关的公告类型信息,比如查看所有公告类型,删除无用公告类型,修改公告类型,添加公告类型等操作,公告类型管理界面设计如图5-4所示。

图5-4公告类型管理界面

YonghuServiceImpl.java
package com.service.impl;

import com.utils.StringUtil;
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 com.dao.YonghuDao;
import com.entity.YonghuEntity;
import com.service.YonghuService;
import com.entity.view.YonghuView;

/**
 * 用户 服务实现类
 */
@Service("yonghuService")
@Transactional
public class YonghuServiceImpl extends ServiceImpl<YonghuDao, YonghuEntity> implements YonghuService {

    @Override
    public PageUtils queryPage(Map<String,Object> params) {
        if(params != null && (params.get("limit") == null || params.get("page") == null)){
            params.put("page","1");
            params.put("limit","10");
        }
        Page<YonghuView> page =new Query<YonghuView>(params).getPage();
        page.setRecords(baseMapper.selectListView(page,params));
        return new PageUtils(page);
    }


}

BaoxiuController.java

package com.controller;

import java.io.File;
import java.math.BigDecimal;
import java.net.URL;
import java.text.SimpleDateFormat;
import com.alibaba.fastjson.JSONObject;
import java.util.*;
import org.springframework.beans.BeanUtils;
import javax.servlet.http.HttpServletRequest;
import org.springframework.web.context.ContextLoader;
import javax.servlet.ServletContext;
import com.service.TokenService;
import com.utils.*;
import java.lang.reflect.InvocationTargetException;

import com.service.DictionaryService;
import org.apache.commons.lang3.StringUtils;
import com.annotation.IgnoreAuth;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.entity.*;
import com.entity.view.*;
import com.service.*;
import com.utils.PageUtils;
import com.utils.R;
import com.alibaba.fastjson.*;

/**
 * 报修
 * 后端接口
 * @author
 * @email
*/
@RestController
@Controller
@RequestMapping("/baoxiu")
public class BaoxiuController {
    private static final Logger logger = LoggerFactory.getLogger(BaoxiuController.class);

    @Autowired
    private BaoxiuService baoxiuService;


    @Autowired
    private TokenService tokenService;
    @Autowired
    private DictionaryService dictionaryService;

    //级联表service
    @Autowired
    private YonghuService yonghuService;
    @Autowired
    private GongchengshiService gongchengshiService;



    /**
    * 后端列表
    */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params, HttpServletRequest request){
        logger.debug("page方法:,,Controller:{},,params:{}",this.getClass().getName(),JSONObject.toJSONString(params));
        String role = String.valueOf(request.getSession().getAttribute("role"));
        if(false)
            return R.error(511,"永不会进入");
        else if("用户".equals(role))
            params.put("yonghuId",request.getSession().getAttribute("userId"));
        else if("工程师".equals(role))
            params.put("gongchengshiId",request.getSession().getAttribute("userId"));
        if(params.get("orderBy")==null || params.get("orderBy")==""){
            params.put("orderBy","id");
        }
        PageUtils page = baoxiuService.queryPage(params);

        //字典表数据转换
        List<BaoxiuView> list =(List<BaoxiuView>)page.getList();
        for(BaoxiuView c:list){
            //修改对应字典表字段
            dictionaryService.dictionaryConvert(c, request);
        }
        return R.ok().put("data", page);
    }

    /**
    * 后端详情
    */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id, HttpServletRequest request){
        logger.debug("info方法:,,Controller:{},,id:{}",this.getClass().getName(),id);
        BaoxiuEntity baoxiu = baoxiuService.selectById(id);
        if(baoxiu !=null){
            //entity转view
            BaoxiuView view = new BaoxiuView();
            BeanUtils.copyProperties( baoxiu , view );//把实体数据重构到view中

                //级联表
                YonghuEntity yonghu = yonghuService.selectById(baoxiu.getYonghuId());
                if(yonghu != null){
                    BeanUtils.copyProperties( yonghu , view ,new String[]{ "id", "createTime", "insertTime", "updateTime"});//把级联的数据添加到view中,并排除id和创建时间字段
                    view.setYonghuId(yonghu.getId());
                }
                //级联表
                GongchengshiEntity gongchengshi = gongchengshiService.selectById(baoxiu.getGongchengshiId());
                if(gongchengshi != null){
                    BeanUtils.copyProperties( gongchengshi , view ,new String[]{ "id", "createTime", "insertTime", "updateTime"});//把级联的数据添加到view中,并排除id和创建时间字段
                    view.setGongchengshiId(gongchengshi.getId());
                }
            //修改对应字典表字段
            dictionaryService.dictionaryConvert(view, request);
            return R.ok().put("data", view);
        }else {
            return R.error(511,"查不到数据");
        }

    }

    /**
    * 后端保存
    */
    @RequestMapping("/save")
    public R save(@RequestBody BaoxiuEntity baoxiu, HttpServletRequest request){
        logger.debug("save方法:,,Controller:{},,baoxiu:{}",this.getClass().getName(),baoxiu.toString());

        String role = String.valueOf(request.getSession().getAttribute("role"));
        if(false)
            return R.error(511,"永远不会进入");
        else if("用户".equals(role)){
            baoxiu.setYonghuId(Integer.valueOf(String.valueOf(request.getSession().getAttribute("userId"))));
            baoxiu.setBaoxiuZhuangtaiTypes(1);
        }
        else if("工程师".equals(role))
            baoxiu.setGongchengshiId(Integer.valueOf(String.valueOf(request.getSession().getAttribute("userId"))));

        Wrapper<BaoxiuEntity> queryWrapper = new EntityWrapper<BaoxiuEntity>()
            .eq("yonghu_id", baoxiu.getYonghuId())
            .eq("gongchengshi_id", baoxiu.getGongchengshiId())
            .eq("baoxiu_uuid_number", baoxiu.getBaoxiuUuidNumber())
            .eq("baoxiu_name", baoxiu.getBaoxiuName())
            .eq("baoxiu_wupin_name", baoxiu.getBaoxiuWupinName())
            .eq("baoxiu_address", baoxiu.getBaoxiuAddress())
            .eq("baoxiu_types", baoxiu.getBaoxiuTypes())
            .eq("baoxiu_zhuangtai_types", baoxiu.getBaoxiuZhuangtaiTypes())
            ;

        logger.info("sql语句:"+queryWrapper.getSqlSegment());
        BaoxiuEntity baoxiuEntity = baoxiuService.selectOne(queryWrapper);
        if(baoxiuEntity==null){
            baoxiu.setInsertTime(new Date());
            baoxiu.setCreateTime(new Date());
            baoxiuService.insert(baoxiu);
            return R.ok();
        }else {
            return R.error(511,"表中有相同数据");
        }
    }

    /**
    * 后端修改
    */
    @RequestMapping("/update")
    public R update(@RequestBody BaoxiuEntity baoxiu, HttpServletRequest request){
        logger.debug("update方法:,,Controller:{},,baoxiu:{}",this.getClass().getName(),baoxiu.toString());

        String role = String.valueOf(request.getSession().getAttribute("role"));
//        if(false)
//            return R.error(511,"永远不会进入");
//        else if("用户".equals(role))
//            baoxiu.setYonghuId(Integer.valueOf(String.valueOf(request.getSession().getAttribute("userId"))));
//        else if("工程师".equals(role))
//            baoxiu.setGongchengshiId(Integer.valueOf(String.valueOf(request.getSession().getAttribute("userId"))));
        //根据字段查询是否有相同数据
        Wrapper<BaoxiuEntity> queryWrapper = new EntityWrapper<BaoxiuEntity>()
            .notIn("id",baoxiu.getId())
            .andNew()
            .eq("yonghu_id", baoxiu.getYonghuId())
            .eq("gongchengshi_id", baoxiu.getGongchengshiId())
            .eq("baoxiu_uuid_number", baoxiu.getBaoxiuUuidNumber())
            .eq("baoxiu_name", baoxiu.getBaoxiuName())
            .eq("baoxiu_wupin_name", baoxiu.getBaoxiuWupinName())
            .eq("baoxiu_address", baoxiu.getBaoxiuAddress())
            .eq("baoxiu_types", baoxiu.getBaoxiuTypes())
            .eq("baoxiu_zhuangtai_types", baoxiu.getBaoxiuZhuangtaiTypes())
            ;

        logger.info("sql语句:"+queryWrapper.getSqlSegment());
        BaoxiuEntity baoxiuEntity = baoxiuService.selectOne(queryWrapper);
        if(baoxiuEntity==null){
            baoxiuService.updateById(baoxiu);//根据id更新
            return R.ok();
        }else {
            return R.error(511,"表中有相同数据");
        }
    }



    /**
    * 删除
    */
    @RequestMapping("/delete")
    public R delete(@RequestBody Integer[] ids){
        logger.debug("delete:,,Controller:{},,ids:{}",this.getClass().getName(),ids.toString());
        baoxiuService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }


    /**
     * 批量上传
     */
    @RequestMapping("/batchInsert")
    public R save( String fileName, HttpServletRequest request){
        logger.debug("batchInsert方法:,,Controller:{},,fileName:{}",this.getClass().getName(),fileName);
        Integer yonghuId = Integer.valueOf(String.valueOf(request.getSession().getAttribute("userId")));
        SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
        try {
            List<BaoxiuEntity> baoxiuList = new ArrayList<>();//上传的东西
            Map<String, List<String>> seachFields= new HashMap<>();//要查询的字段
            Date date = new Date();
            int lastIndexOf = fileName.lastIndexOf(".");
            if(lastIndexOf == -1){
                return R.error(511,"该文件没有后缀");
            }else{
                String suffix = fileName.substring(lastIndexOf);
                if(!".xls".equals(suffix)){
                    return R.error(511,"只支持后缀为xls的excel文件");
                }else{
                    URL resource = this.getClass().getClassLoader().getResource("../../upload/" + fileName);//获取文件路径
                    File file = new File(resource.getFile());
                    if(!file.exists()){
                        return R.error(511,"找不到上传文件,请联系管理员");
                    }else{
                        List<List<String>> dataList = PoiUtil.poiImport(file.getPath());//读取xls文件
                        dataList.remove(0);//删除第一行,因为第一行是提示
                        for(List<String> data:dataList){
                            //循环
                            BaoxiuEntity baoxiuEntity = new BaoxiuEntity();
//                            baoxiuEntity.setYonghuId(Integer.valueOf(data.get(0)));   //用户 要改的
//                            baoxiuEntity.setGongchengshiId(Integer.valueOf(data.get(0)));   //工程师 要改的
//                            baoxiuEntity.setBaoxiuUuidNumber(data.get(0));                    //报修编号 要改的
//                            baoxiuEntity.setBaoxiuName(data.get(0));                    //报修名称 要改的
//                            baoxiuEntity.setBaoxiuWupinName(data.get(0));                    //报修物品 要改的
//                            baoxiuEntity.setBaoxiuAddress(data.get(0));                    //报修地点 要改的
//                            baoxiuEntity.setBaoxiuTypes(Integer.valueOf(data.get(0)));   //报修类型 要改的
//                            baoxiuEntity.setInsertTime(date);//时间
//                            baoxiuEntity.setBaoxiuContent("");//详情和图片
//                            baoxiuEntity.setBaoxiuZhuangtaiTypes(Integer.valueOf(data.get(0)));   //报修状态 要改的
//                            baoxiuEntity.setCreateTime(date);//时间
                            baoxiuList.add(baoxiuEntity);


                            //把要查询是否重复的字段放入map中
                                //报修编号
                                if(seachFields.containsKey("baoxiuUuidNumber")){
                                    List<String> baoxiuUuidNumber = seachFields.get("baoxiuUuidNumber");
                                    baoxiuUuidNumber.add(data.get(0));//要改的
                                }else{
                                    List<String> baoxiuUuidNumber = new ArrayList<>();
                                    baoxiuUuidNumber.add(data.get(0));//要改的
                                    seachFields.put("baoxiuUuidNumber",baoxiuUuidNumber);
                                }
                        }

                        //查询是否重复
                         //报修编号
                        List<BaoxiuEntity> baoxiuEntities_baoxiuUuidNumber = baoxiuService.selectList(new EntityWrapper<BaoxiuEntity>().in("baoxiu_uuid_number", seachFields.get("baoxiuUuidNumber")));
                        if(baoxiuEntities_baoxiuUuidNumber.size() >0 ){
                            ArrayList<String> repeatFields = new ArrayList<>();
                            for(BaoxiuEntity s:baoxiuEntities_baoxiuUuidNumber){
                                repeatFields.add(s.getBaoxiuUuidNumber());
                            }
                            return R.error(511,"数据库的该表中的 [报修编号] 字段已经存在 存在数据为:"+repeatFields.toString());
                        }
                        baoxiuService.insertBatch(baoxiuList);
                        return R.ok();
                    }
                }
            }
        }catch (Exception e){
            e.printStackTrace();
            return R.error(511,"批量插入数据异常,请联系管理员");
        }
    }






}

BaiduUtil.java
package com.utils;

import java.io.BufferedReader;
import java.io.InputStreamReader;
import java.net.HttpURLConnection;
import java.net.URL;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import org.json.JSONObject;


/**
* 类说明 : 
*/

public class BaiduUtil {
	
    /**
     * 根据经纬度获得省市区信息
     * @param lon 纬度
     * @param lat 经度
     * @param coordtype 经纬度坐标系
     * @return
     */
    public static Map<String, String> getCityByLonLat(String key, String lng, String lat) {
        String location = lat + "," + lng;
        try {
            //拼装url
            String url = "http://api.map.baidu.com/reverse_geocoding/v3/?ak="+key+"&output=json&coordtype=wgs84ll&location="+location;
            String result = HttpClientUtils.doGet(url);
            JSONObject o = new JSONObject(result);
            Map<String, String> area = new HashMap<>();
			area.put("province", o.getJSONObject("result").getJSONObject("addressComponent").getString("province"));
			area.put("city", o.getJSONObject("result").getJSONObject("addressComponent").getString("city"));
			area.put("district", o.getJSONObject("result").getJSONObject("addressComponent").getString("district"));
			area.put("street", o.getJSONObject("result").getJSONObject("addressComponent").getString("street"));
            return area;
        }catch (Exception e) {
            e.printStackTrace();
        }
        return null;
    }

    /**
	     * 获取API访问token
	     * 该token有一定的有效期,需要自行管理,当失效时需重新获取.
	     * @param ak - 百度云官网获取的 API Key
	     * @param sk - 百度云官网获取的 Securet Key
	     * @return assess_token
	     */
    public static String getAuth(String ak, String sk) {
        // 获取token地址
        String authHost = "https://aip.baidubce.com/oauth/2.0/token?";
        String getAccessTokenUrl = authHost
                // 1. grant_type为固定参数
                + "grant_type=client_credentials"
                // 2. 官网获取的 API Key
                + "&client_id=" + ak
                // 3. 官网获取的 Secret Key
                + "&client_secret=" + sk;
        try {
            URL realUrl = new URL(getAccessTokenUrl);
            // 打开和URL之间的连接
            HttpURLConnection connection = (HttpURLConnection) realUrl.openConnection();
            connection.setRequestMethod("GET");
            connection.connect();
            // 获取所有响应头字段
            Map<String, List<String>> map = connection.getHeaderFields();
            // 遍历所有的响应头字段
            for (String key : map.keySet()) {
                System.err.println(key + "--->" + map.get(key));
            }
            // 定义 BufferedReader输入流来读取URL的响应
            BufferedReader in = new BufferedReader(new InputStreamReader(connection.getInputStream()));
            String result = "";
            String line;
            while ((line = in.readLine()) != null) {
                result += line;
            }
            /**
             * 返回结果示例
             */
            System.err.println("result:" + result);
            org.json.JSONObject jsonObject = new org.json.JSONObject(result);
            String access_token = jsonObject.getString("access_token");
            return access_token;
        } catch (Exception e) {
            System.err.printf("获取token失败!");
            e.printStackTrace(System.err);
        }
        return null;
    }

}

bootstrap-colorpicker.min.js
/*!
 * Bootstrap Colorpicker
 * (c) 2012 Stefan Petre
 * http://mjaalnir.github.io/bootstrap-colorpicker/
 * http://www.apache.org/licenses/LICENSE-2.0.txt
 */(function(d){var k=function(a){this.value={h:1,s:1,b:1,a:1};this.setColor(a)};k.prototype={constructor:k,setColor:function(a){a=a.toLowerCase();var b=this;d.each(e.stringParsers,function(c,d){var f=d.re.exec(a),f=f&&d.parse(f),g=d.space||"rgba";return f?(b.value="hsla"===g?e.RGBtoHSB.apply(null,e.HSLtoRGB.apply(null,f)):e.RGBtoHSB.apply(null,f),!1):!0})},setHue:function(a){this.value.h=1-a},setSaturation:function(a){this.value.s=a},setLightness:function(a){this.value.b=1-a},setAlpha:function(a){this.value.a=
parseInt(100*(1-a),10)/100},toRGB:function(a,b,c,d){a||(a=this.value.h,b=this.value.s,c=this.value.b);var f,g,e;a=360*a%360/60;e=c*b;b=e*(1-Math.abs(a%2-1));c=f=g=c-e;a=~~a;c+=[e,b,0,0,b,e][a];f+=[b,e,e,b,0,0][a];g+=[0,0,b,e,e,b][a];return{r:Math.round(255*c),g:Math.round(255*f),b:Math.round(255*g),a:d||this.value.a}},toHex:function(a,b,c,d){a=this.toRGB(a,b,c,d);return"#"+(16777216|parseInt(a.r)<<16|parseInt(a.g)<<8|parseInt(a.b)).toString(16).substr(1)},toHSL:function(a,b,c,d){a||(a=this.value.h,
b=this.value.s,c=this.value.b);var f=(2-b)*c;b*=c;b=0<f&&1>=f?b/f:b/(2-f);1<b&&(b=1);return{h:a,s:b,l:f/2,a:d||this.value.a}}};var l=0,h=function(a,b){l++;this.element=d(a).attr("data-colorpicker-guid",l);var c=b.format||this.element.data("color-format")||"hex";this.format=e.translateFormats[c];this.isInput=this.element.is("input");this.component=this.element.is(".colorpicker-component")?this.element.find(".add-on, .input-group-addon"):!1;this.picker=d(e.template).attr("data-colorpicker-guid",l).appendTo("body").on("mousedown.colorpicker",
d.proxy(this.mousedown,this));if(this.isInput)this.element.on({"focus.colorpicker":d.proxy(this.show,this),"keyup.colorpicker":d.proxy(this.update,this)});else if(this.component)this.component.on({"click.colorpicker":d.proxy(this.show,this)});else this.element.on({"click.colorpicker":d.proxy(this.show,this)});if("rgba"===c||"hsla"===c)this.picker.addClass("alpha"),this.alpha=this.picker.find(".colorpicker-alpha")[0].style;this.component?(this.picker.find(".colorpicker-color").hide(),this.preview=
this.element.find("i")[0].style):this.preview=this.picker.find("div:last")[0].style;this.base=this.picker.find("div:first")[0].style;this.update();d(d.proxy(function(){this.element.trigger("create",[this])},this))};h.prototype={constructor:h,show:function(a){this.picker.show();this.height=this.component?this.component.outerHeight():this.element.outerHeight();this.place();d(window).on("resize.colorpicker",d.proxy(this.place,this));!this.isInput&&a&&(a.stopPropagation(),a.preventDefault());d(document).on({"mousedown.colorpicker":d.proxy(this.hide,
this)});this.element.trigger({type:"showPicker",color:this.color})},update:function(){var a=this.isInput?this.element.prop("value"):this.element.data("color");if("undefined"===typeof a||null===a)a="#ffffff";this.color=new k(a);this.picker.find("i").eq(0).css({left:100*this.color.value.s,top:100-100*this.color.value.b}).end().eq(1).css("top",100*(1-this.color.value.h)).end().eq(2).css("top",100*(1-this.color.value.a));this.previewColor()},hide:function(){this.picker.hide();d(window).off("resize",this.place);
d(document).off({mousedown:this.hide});this.isInput?""!==this.element.val()&&this.element.prop("value",this.format.call(this)).trigger("change"):(this.component&&""!==this.element.find("input").val()&&this.element.find("input").prop("value",this.format.call(this)).trigger("change"),this.element.data("color",this.format.call(this)));this.element.trigger({type:"hidePicker",color:this.color})},place:function(){var a=this.component?this.component.offset():this.element.offset();this.picker.css({top:a.top+
this.height,left:a.left})},destroy:function(){d(".colorpicker[data-colorpicker-guid="+this.element.attr("data-colorpicker-guid")+"]").remove();this.element.removeData("colorpicker").removeAttr("data-colorpicker-guid").off(".colorpicker");!1!==this.component&&this.component.off(".colorpicker");this.element.trigger("destroy",[this])},setValue:function(a){this.isInput?this.element.prop("value",a):(this.element.find("input").val(a),this.element.data("color",a));this.update();this.element.trigger({type:"changeColor",
color:this.color})},previewColor:function(){try{this.preview.backgroundColor=this.format.call(this)}catch(a){this.preview.backgroundColor=this.color.toHex()}this.base.backgroundColor=this.color.toHex(this.color.value.h,1,1,1);this.alpha&&(this.alpha.backgroundColor=this.color.toHex())},pointer:null,slider:null,mousedown:function(a){a.stopPropagation();a.preventDefault();var b=d(a.target).closest("div");if(!b.is(".colorpicker")){if(b.is(".colorpicker-saturation"))this.slider=d.extend({},e.sliders.saturation);
else if(b.is(".colorpicker-hue"))this.slider=d.extend({},e.sliders.hue);else if(b.is(".colorpicker-alpha"))this.slider=d.extend({},e.sliders.alpha);else return!1;var c=b.offset();this.slider.knob=b.find("i")[0].style;this.slider.left=a.pageX-c.left;this.slider.top=a.pageY-c.top;this.pointer={left:a.pageX,top:a.pageY};d(document).on({"mousemove.colorpicker":d.proxy(this.mousemove,this),"mouseup.colorpicker":d.proxy(this.mouseup,this)}).trigger("mousemove")}return!1},mousemove:function(a){a.stopPropagation();
a.preventDefault();var b=Math.max(0,Math.min(this.slider.maxLeft,this.slider.left+((a.pageX||this.pointer.left)-this.pointer.left)));a=Math.max(0,Math.min(this.slider.maxTop,this.slider.top+((a.pageY||this.pointer.top)-this.pointer.top)));this.slider.knob.left=b+"px";this.slider.knob.top=a+"px";this.slider.callLeft&&this.color[this.slider.callLeft].call(this.color,b/100);this.slider.callTop&&this.color[this.slider.callTop].call(this.color,a/100);this.previewColor();if(this.isInput)try{this.element.val(this.format.call(this)).trigger("change")}catch(c){this.element.val(this.color.toHex()).trigger("change")}else try{this.element.find("input").val(this.format.call(this)).trigger("change")}catch(d){this.element.find("input").val(this.color.toHex()).trigger("change")}this.element.trigger({type:"changeColor",
color:this.color});return!1},mouseup:function(a){a.stopPropagation();a.preventDefault();d(document).off({mousemove:this.mousemove,mouseup:this.mouseup});return!1}};d.fn.colorpicker=function(a,b){return this.each(function(){var c=d(this),e=c.data("colorpicker"),f="object"===typeof a&&a;if(!e)"destroy"!==a&&c.data("colorpicker",new h(this,d.extend({},d.fn.colorpicker.defaults,f)));else if("string"===typeof a)e[a](b)})};d.fn.colorpicker.defaults={};d.fn.colorpicker.Constructor=h;var e={translateFormats:{rgb:function(){var a=
this.color.toRGB();return"rgb("+a.r+","+a.g+","+a.b+")"},rgba:function(){var a=this.color.toRGB();return"rgba("+a.r+","+a.g+","+a.b+","+a.a+")"},hsl:function(){var a=this.color.toHSL();return"hsl("+Math.round(360*a.h)+","+Math.round(100*a.s)+"%,"+Math.round(100*a.l)+"%)"},hsla:function(){var a=this.color.toHSL();return"hsla("+Math.round(360*a.h)+","+Math.round(100*a.s)+"%,"+Math.round(100*a.l)+"%,"+a.a+")"},hex:function(){return this.color.toHex()}},sliders:{saturation:{maxLeft:100,maxTop:100,callLeft:"setSaturation",
callTop:"setLightness"},hue:{maxLeft:0,maxTop:100,callLeft:!1,callTop:"setHue"},alpha:{maxLeft:0,maxTop:100,callLeft:!1,callTop:"setAlpha"}},RGBtoHSB:function(a,b,c,d){a/=255;b/=255;c/=255;var f,e;f=Math.max(a,b,c);e=f-Math.min(a,b,c);a=60*(((0===e?0:f===a?(b-c)/e:f===b?(c-a)/e+2:(a-b)/e+4)+360)%6)/360;return{h:a||1,s:0===e?0:e/f,b:f,a:d||1}},HueToRGB:function(a,b,c){0>c?c+=1:1<c&&(c-=1);return 1>6*c?a+6*(b-a)*c:1>2*c?b:2>3*c?a+6*(b-a)*(2/3-c):a},HSLtoRGB:function(a,b,c,d){0>b&&(b=0);b=0.5>=c?c*(1+
b):c+b-c*b;var f=2*c-b,g=a-1/3;c=Math.round(255*e.HueToRGB(f,b,a+1/3));a=Math.round(255*e.HueToRGB(f,b,a));b=Math.round(255*e.HueToRGB(f,b,g));return[c,a,b,d||1]},stringParsers:[{re:/rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*(\d+(?:\.\d+)?)\s*)?\)/,parse:function(a){return[a[1],a[2],a[3],a[4]]}},{re:/rgba?\(\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*(?:,\s*(\d+(?:\.\d+)?)\s*)?\)/,parse:function(a){return[2.55*a[1],2.55*a[2],2.55*a[3],a[4]]}},{re:/#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/,
parse:function(a){return[parseInt(a[1],16),parseInt(a[2],16),parseInt(a[3],16)]}},{re:/#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])/,parse:function(a){return[parseInt(a[1]+a[1],16),parseInt(a[2]+a[2],16),parseInt(a[3]+a[3],16)]}},{re:/hsla?\(\s*(\d+(?:\.\d+)?)\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*(?:,\s*(\d+(?:\.\d+)?)\s*)?\)/,space:"hsla",parse:function(a){return[a[1]/360,a[2]/100,a[3]/100,a[4]]}}],template:'<div class="colorpicker dropdown-menu"><div class="colorpicker-saturation"><i><b></b></i></div><div class="colorpicker-hue"><i></i></div><div class="colorpicker-alpha"><i></i></div><div class="colorpicker-color"><div /></div></div>'}})(window.jQuery);

声明

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

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

一行命令将Cmder添加到系统右键菜单中----配置环境

第一步&#xff0c;去官网下载一个简版的文件 ** 第二步&#xff0c;将下载的文件解压后如图&#xff0c;找到Cmder.exe右键以管理员身份运行 第三步&#xff0c;在窗口输入cmder /register all然后回车 第四步&#xff0c;OK!不管在哪里都可以使用了&#xff0c;直接右键即可

vscode环境迁移

关注B站可以观看更多实战教学视频&#xff1a;hallo128的个人空间 vscode环境迁移 Setting 即可打开settings.json {"python.pythonPath": "/Users/apple/opt/anaconda3/bin/python","cmake.cmakePath": "/usr/local/bin/cmake",&qu…

[c++高阶]模版进阶

1.前言 在我们学习c的时候&#xff0c;常常会遇见要使用函数重载的情况。而当使用函数重载时&#xff0c;通常会使得我们编写很多重复的代码&#xff0c;这样就显得非常臃肿&#xff0c;并且效率非常的低下。 重载的函数仅仅只是类型不同&#xff0c;代码的复用率比较低&#x…

浮点数的这些特性你了解吗

问题1:下面的代码&#xff0c;输出结果是什么&#xff1a; public class CaclTest{public void test1(){float f 1.0F / 0.0F;System.out.println("f:" f)}public static void main(String[] args){CaclTest ct new CaclTest();ct.test1();}} A. 运行抛出异常:j…

7.数据结构与算法-循环链表

如果经常对首位元素进行操作&#xff0c;用尾元素更方便更快捷 两个循环链表合并

信息安全工程师(21)安全协议

前言 安全协议是建立在密码体制基础上的一种交互通信协议&#xff0c;它运用密码算法和协议逻辑来实现认证、密钥分配、数据机密性、完整性和抗否认性等安全目标。 一、定义与目的 安全协议旨在确保网络环境中信息交换的安全性&#xff0c;通过密码技术和协议逻辑来保护数据的机…

第八届蓝桥杯嵌入式省赛程序设计题解析(基于HAL库)

一.题目分析 &#xff08;1&#xff09;.题目 &#xff08;2&#xff09;.题目分析 1.按键功能分析----过程控制 a. 选择按键按下的个数和目标层数&#xff08;每个按键都要在一秒之内按下&#xff0c;否则就结束&#xff09; b. 当升降机到达目标平台&#xff0c;LED灯熄灭 c.…

负载均衡(Load Balancing)是一种计算机技术,用于在网络应用中分配工作负载,以优化资源使用、最大化吞吐量、减少响应时间以及避免过载。

负载均衡&#xff08;Load Balancing&#xff09;是一种计算机技术&#xff0c;用于在网络应用中分配工作负载&#xff0c;以优化资源使用、最大化吞吐量、减少响应时间以及避免过载。通过将任务均匀地分布在多个组件上&#xff0c;如服务器、网络链接、CPU、硬盘等&#xff0c…

【AG 创新工坊】探索存内计算的未来,共话 AGI 时代

目录 ⚛️1. 会议详情 ☪️2. 会议回顾 ♋2.1 多模态时代&#xff0c;存内计算架构的应用与发展 ♏2.2 分布式环境下深度学习任务的高效可靠执行研究 ♐2.3 IGZO在后道单片三维集成中的机遇与挑战 ♑2.4 witin-nn:神经网络算法模型在存内开发板上的应用开发 ♉2.5 茶歇交…

讯飞星火编排创建智能体学习(一)最简单的智能体构建

目录 开篇 智能体的概念 编排创建智能体 创建第一个智能体 ​编辑 大模型节点 测试与调试 开篇 前段时间在华为全联接大会上看到讯飞星火企业级智能体平台的演示&#xff0c;对于拖放的可视化设计非常喜欢&#xff0c;刚开始以为是企业用户才有的&#xff0c;回来之后查…

X86架构(九)——保护模式的进入

全局描述符表 全局描述符表(Global Descriptor Table,GDT)是保护模式下非常重要的一个数据结构。 在保护模式下&#xff0c;对内存的访问仍然使用段地址和偏移地址&#xff0c;在每个段能够访问之前&#xff0c;必须先行设置好 GDT 的地址&#xff0c;并加载全局描述符表寄存…

推荐4款2024年大家都在用的高质量翻译器。

翻译器在我们的生活中有着很重要的作用&#xff0c;不管是我们在学习还是工作&#xff0c;生活娱乐&#xff0c;出国旅游等场合都会派上用场&#xff0c;它是我们解决沟通的障碍&#xff0c;提高阅读效率的好帮手。我自己使用的翻译器有很多&#xff0c;可以给大家列举几款特别…

依赖倒置原则(学习笔记)

抽象不应该依赖细节&#xff0c;细节应该依赖抽象。简单的说就是要求对抽象进行编程&#xff0c;不要对实现进行编程&#xff0c;这样就降低了客户与实现模块间的耦合。 依赖倒转原则是基于这样的设计理念&#xff1a;相对于细节的多变性&#xff0c;抽象的东西要稳定的多。 以…

了解输出电源优先级

主要又SUB&#xff0c;SBU以及USB三种模式。 调试10kW逆变器存在的输出电源优先级的问题&#xff0c;当优先级为SUB时&#xff0c;利用电压源模拟电池&#xff0c;当电池电压超过58.4V&#xff0c;即过压&#xff0c;在接入市电&#xff0c;市电继电器仍然闭合&#xff0c;仍然…

pyboard405意外故障,micropython OLED例程无法运行,折腾了大半天。

thonny报告&#xff1a; Traceback (most recent call last): File "<stdin>", line 3, in <module> RuntimeError: name too mode # main.py -- put your code here! from machine import I2C,Pin #从machine模块导入I2C、Pin子模块 from ss…

javascript:监听浏览器页签切换

监听页面的可见性变化&#xff0c;在很多场景下非常实用&#xff0c;比如跟踪用户行为、节省资源、优化性能等。 1 代码示例 document.addEventListener("visibilitychange", () > {if (document.visibilityState "visible") {alert("当前页面已…

上交所系统被股民买崩了?原因竟然是...

在A股市场迎来久违的牛市之际&#xff0c;上海证券交易所&#xff08;上交所&#xff09;却在关键时刻遭遇了技术挑战。9月27日&#xff0c;上交所的交易系统出现了罕见的宕机现象&#xff0c;持续时间长达两个小时&#xff0c;导致投资者在火热的交易期间无法正常进行交易操作…

通信工程学习:什么是OFDM正交频分复用

OFDM&#xff1a;正交频分复用 OFDM&#xff08;Orthogonal Frequency Division Multiplexing&#xff0c;正交频分复用&#xff09;是一种在通信领域中广泛应用的多载波调制技术。该技术通过将高速数据流分割成多个低速子流&#xff0c;并在不同频率上同时传输这些子流&#x…

论文笔记:Gradient Episodic Memory for Continual Learning

1. Contribution 提出了一组指标来评估模型在连续数据上的学习情况。这些指标不仅通过测试准确性来表征模型&#xff0c;还通过其跨任务迁移知识的能力来表征模型。针对持续学习任务&#xff0c;提出了GEM模型&#xff08;Gradient Episodic Memory&#xff09;&#xff0c;它…

【预备理论知识——1】深度学习:概率论概述

简单地说&#xff0c;机器学习就是做出预测。 概率论 掷骰子 假设我们掷骰子&#xff0c;想知道看到1的几率有多大&#xff0c;而不是看到另一个数字。 如果骰子是公平的&#xff0c;那么所有六个结果{1,…, 6}都有相同的可能发生&#xff0c; 因此我们可以说 1 发生的概率为1…