Merge branch 'master' of http://116.63.33.55/git/dt2

cms/src/main/java/com/jd/cms/controller/FileController.java

@@ -0,0 +1,30 @@
+package com.jd.cms.controller;
+
+import com.jd.cms.service.FileService;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+
+import java.util.Map;
+
+/**
+ * @author ：yp
+ * @date ：Created in 2022/5/12 9:41
+ * @description：对外提供文件获取接口
+ */
+@RestController
+@RequestMapping("files")
+public class FileController {
+    @Autowired
+    private FileService fileService;
+
+    /**
+     * 获取并检索辅助终端文件列表
+     * @return
+     */
+    @GetMapping("selectFile")
+    public Map<String, Object> selectFile(String keywords) {
+        return fileService.selectFile(keywords);
+    }
+}

cms/src/main/java/com/jd/cms/controller/FileManagerController.java

@@ -1,24 +1,14 @@
 package com.jd.cms.controller;
 
-import java.awt.image.BufferedImage;
-import java.io.File;
-import java.net.URLEncoder;
-import java.text.SimpleDateFormat;
-import java.util.ArrayList;
-import java.util.Arrays;
-import java.util.Collections;
-import java.util.Comparator;
-import java.util.Date;
-import java.util.HashMap;
-import java.util.Hashtable;
-import java.util.List;
-import java.util.Map;
-
-import javax.imageio.ImageIO;
-import javax.servlet.http.HttpServletRequest;
-
+import cn.hutool.core.date.DateUtil;
+import cn.hutool.core.util.StrUtil;
+import com.alibaba.fastjson.JSONObject;
+import com.jd.cms.base.Base2Controller;
+import com.jd.cms.base.Constants;
+import com.jd.cms.configer.PathConfig;
+import com.jd.cms.entity.TWebsite;
+import com.jd.cms.service.WebsiteServiceI;
 import com.jd.cms.util.Constant;
-import com.jd.cms.util.ExcelToPdfUtil;
 import com.jd.cms.util.FileConvetUtil;
 import org.apache.tomcat.util.http.fileupload.servlet.ServletFileUpload;
 import org.springframework.beans.factory.annotation.Autowired;
@@ -29,25 +19,14 @@ import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RequestParam;
 import org.springframework.web.multipart.MultipartFile;
 import org.springframework.web.multipart.MultipartHttpServletRequest;
+import ws.schild.jave.*;
 
-import com.alibaba.fastjson.JSONObject;
-import com.jd.cms.base.Base2Controller;
-import com.jd.cms.base.Constants;
-import com.jd.cms.configer.PathConfig;
-import com.jd.cms.entity.TWebsite;
-import com.jd.cms.service.WebsiteServiceI;
-
-import cn.hutool.core.date.DateUtil;
-import cn.hutool.core.util.StrUtil;
-import ws.schild.jave.AudioAttributes;
-import ws.schild.jave.Encoder;
-import ws.schild.jave.EncoderException;
-import ws.schild.jave.EncoderProgressListener;
-import ws.schild.jave.EncodingAttributes;
-import ws.schild.jave.InputFormatException;
-import ws.schild.jave.MultimediaInfo;
-import ws.schild.jave.MultimediaObject;
-import ws.schild.jave.VideoAttributes;
+import javax.imageio.ImageIO;
+import javax.servlet.http.HttpServletRequest;
+import java.awt.image.BufferedImage;
+import java.io.File;
+import java.text.SimpleDateFormat;
+import java.util.*;
 
 /**  
  * 文件管理控制器（所有的文件上传接口）

cms/src/main/java/com/jd/cms/mapper/FileMapper.java

@@ -0,0 +1,35 @@
+package com.jd.cms.mapper;
+
+import org.apache.ibatis.annotations.Param;
+
+import java.util.List;
+import java.util.Map;
+
+/**
+ * @author ：yp
+ * @date ：Created in 2022/5/12 10:05
+ * @description：
+ */
+public interface FileMapper {
+    /**
+     * 根据文件库名字获取栏目id
+     * @param name
+     * @return
+     */
+    String getColumnIdByName(String name);
+
+    /**
+     * 根据栏目id查询文章列表
+     * @param columnId
+     * @return
+     */
+    List<Map<String, Object>> getArticleIdsByColumnId(@Param("columnId") String columnId);
+
+    /**
+     * 根据文章id列表查询文章信息
+     * @param articleIds
+     * @param keywords
+     * @return
+     */
+    List<Map<String, Object>> getArticleListByIds(@Param("list") List<Map<String, Object>> articleIds, @Param("keywords") String keywords);
+}

cms/src/main/java/com/jd/cms/service/FileService.java

@@ -0,0 +1,18 @@
+package com.jd.cms.service;
+
+import java.util.Map;
+
+/**
+ * @author ：yp
+ * @date ：Created in 2022/5/12 10:03
+ * @description：
+ */
+public interface FileService {
+
+    /**
+     * 获取并检索辅助终端文件列表
+     * @param keywords
+     * @return
+     */
+    Map<String, Object> selectFile(String keywords);
+}

cms/src/main/java/com/jd/cms/service/impl/FileServiceImpl.java

@@ -0,0 +1,101 @@
+package com.jd.cms.service.impl;
+
+import com.jd.cms.base.Constants;
+import com.jd.cms.mapper.FileMapper;
+import com.jd.cms.service.FileService;
+import com.jd.cms.util.Blank;
+import com.jd.cms.util.SendUtil;
+import org.springframework.stereotype.Service;
+
+import javax.annotation.Resource;
+import java.util.ArrayList;
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+/**
+ * @author ：yp
+ * @date ：Created in 2022/5/12 10:04
+ * @description：
+ */
+@Service
+public class FileServiceImpl implements FileService {
+    @Resource
+    private FileMapper fileMapper;
+
+    @Override
+    public Map<String, Object> selectFile(String keywords) {
+        // 线上文件获取
+        // 获取线上文件栏目id
+        String columnId = getColumnIdByName("线上文件");
+        List<Map<String, Object>> onlineFiles = getArticleList(columnId, keywords);
+        // 临时文件获取
+        // 获取临时文件栏目id
+        String lsColumnId = getColumnIdByName("临时文件");
+        // 根据栏目id查询文章id列表
+        List<Map<String, Object>> temporaryFiles = getArticleList(lsColumnId, keywords);
+        // 轻应用文件获取
+        Map<String, Object> result = new HashMap<>();
+        result.put("onlineFiles", onlineFiles);
+        result.put("temporaryFiles", temporaryFiles);
+        return SendUtil.send(true, Constants.code200, result);
+    }
+
+    /**
+     * 根据栏目id获取所有的文章列表信息
+     * @param columnId
+     * @param keywords
+     * @return
+     */
+    public  List<Map<String, Object>> getArticleList(String columnId, String keywords) {
+        // 根据栏目id查询文章id列表
+        List<Map<String, Object>> articleIds = fileMapper.getArticleIdsByColumnId(columnId);
+        List list = new ArrayList();
+        if (Blank.isNotEmpty(articleIds)) {
+            for (Map<String, Object> articleIdMap : articleIds) {
+                list.add(articleIdMap.get("articleId"));
+            }
+        }
+        // 根据文章id列表查询文章信息
+        List<Map<String, Object>> files = fileMapper.getArticleListByIds(list, keywords);
+        return files;
+    }
+
+    /**
+     * 根据栏目id获取所有的文章列表信息
+     * @return
+     */
+//    public  List<Map<String, Object>> getQYYFileList() {
+//        Map<String, Object> param = new HashMap<>();
+//        param.put("current", 1);
+//        param.put("size", 10000);
+//        String url = basicDataMapper.getValueByType("QYY_FILEURL");
+//        String body = HttpRequest.get(url).form(param).execute().body();
+//        JSONArray records = new JSONArray();
+//        if (StrUtil.isNotBlank(body)) {
+//            JSONObject jsonObject = JSON.parseObject(body);
+//            JSONObject data = jsonObject.getJSONObject("data");
+//            if (Blank.isNotEmpty(data)) {
+//                records = data.getJSONArray("records");
+//            }
+//
+//        }
+//        List<Map<String, Object>> result = new ArrayList<>();
+//        for (Object record : records) {
+//            result.add((Map<String, Object>) record);
+//        }
+//        return result;
+//    }
+
+
+    /**
+     * 根据文件库名字获取栏目id
+     * @param name
+     * @return
+     */
+    public String getColumnIdByName(String name) {
+        String columnId = fileMapper.getColumnIdByName(name);
+        return columnId;
+    }
+
+}

cms/src/main/resources/application.yml

@@ -73,6 +73,7 @@ mybatis:
   configuration:
     #开启自动下划线格式转驼峰格式
     map-underscore-to-camel-case: true
+#    log-impl: org.apache.ibatis.logging.stdout.StdOutImpl
 #上传文件和网站静态化相关配置
 path:
   #站点实体路径和访问路径
@@ -83,7 +84,8 @@ path:
     letterpath: D:/nginx-1.21.1/html
 
     # 后台-上传文件访问路径
-    letterurl: http://localhost
+    letterurl: http://23.37.100.87:8060
+#    letterurl: http://192.168.0.95
     # 静态网站文件-资源路径
     staticletterpath: D:/nginx-1.21.1/html
     # 静态网站文件-网站路径
@@ -149,7 +151,7 @@ login:
     #登录超时时间
     login-out-time : 30
     #免登陆接口，相对于根目录，多个以逗号隔开
-    removal-uris: /user/userLogin,/defaultImage/,/public/,/page/,/ftl/,/file/fileUpload,/article/saveFile,/article/articlePublish
+    removal-uris: /user/userLogin,/defaultImage/,/public/,/page/,/ftl/,/file/fileUpload,/article/saveFile,/article/articlePublish,/files/selectFile
   specialChar:
     #不被转义字符的uri,多个以“,”隔开
     filterUris: 

cms/src/main/resources/mapper/FileMapper.xml

@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd" >
+<mapper namespace="com.jd.cms.mapper.FileMapper">
+
+    <!--根据文件库名字获取栏目id-->
+    <select id="getColumnIdByName" resultType="java.lang.String">
+        SELECT id
+        FROM `t_column`
+        WHERE NAME = #{name}
+    </select>
+    <!--根据栏目id查询文章列表-->
+    <select id="getArticleIdsByColumnId" resultType="java.util.Map">
+        SELECT
+            articleId
+        FROM
+            t_article_column
+        WHERE
+            columnId = #{columnId}
+    </select>
+    <!--根据文章id列表查询文章信息-->
+    <select id="getArticleListByIds" resultType="java.util.Map">
+        SELECT
+            *
+        FROM
+            `t_article`
+        WHERE
+        status = 1
+        <if test="list != null and list.size != 0">
+            and id in
+            <foreach collection="list" index="index" item="item" open="(" separator="," close=")">
+                #{item}
+            </foreach>
+        </if>
+        <if test="keywords != null and keywords != ''">
+            and oldFileName LIKE CONCAT('%', #{keywords},'%')
+        </if>
+    </select>
+</mapper>

cms/src/main/resources/static/ftl/fzzd/dhl/dtgk/gzly.ftl

@@ -1,8 +1,8 @@
 <#if data.articleList?size gt 0>
     <#list data.articleList as article>
-        <li class="const-item">
+        <div class="swiper-slide">
             <img src="${article.titlepic }"/>
             <p>${article.title}</p>
-        </li>
+        </div>
     </#list>
 </#if>

cms/src/main/resources/static/ftl/fzzd/index/dtgk.ftl

@@ -7,6 +7,7 @@
     <!-- 动态加载head -->
     <script type="text/javascript" src="/${data.websiteInfo.rootPath }/head/list.html"></script>
     <!-- 引用基础css、js文件 -->
+    <link rel="stylesheet" href="/${data.websiteInfo.rootPath }/public/swiper/swiper.min.css" />
     <script type="text/javascript" src="/${data.websiteInfo.rootPath }/public/js/constant.js"></script>
     <script type="text/javascript" src="/${data.websiteInfo.rootPath }/public/layui/layui.js"></script>
     <link rel="stylesheet" type="text/css" href="/${data.websiteInfo.rootPath }/public/font/iconfont.css"/>
@@ -80,42 +81,35 @@
         </div>
         <!-- 工作掠影 -->
         <div class="gzly-box" style="display: none;">
-            <ul class="cont-imgs">
-<#--                <li class="const-item">-->
-<#--                    <img src="/${data.websiteInfo.rootPath }/public/img/a1.png"/>-->
-<#--                    <p>信息中心参加“3.19”城市管理主题服务周活动</p>-->
-<#--                </li>-->
-<#--                <li class="const-item">-->
-<#--                    <img src="/${data.websiteInfo.rootPath }/public/img/a2.png"/>-->
-<#--                    <p>市领导出席2019年"3.19”城市管理服务主题周</p>-->
-<#--                </li>-->
-<#--                <li class="const-item">-->
-<#--                    <img src="/${data.websiteInfo.rootPath }/public/img/a3.png"/>-->
-<#--                    <p>2019年信息中心党支部员局选举</p>-->
-<#--                </li>-->
-<#--                <li class="const-item">-->
-<#--                    <img src="/${data.websiteInfo.rootPath }/public/img/a4.png"/>-->
-<#--                    <p>城市管理服务热线接受市民现场咨询</p>-->
-<#--                </li>-->
-<#--                <li class="const-item">-->
-<#--                    <img src="/${data.websiteInfo.rootPath }/public/img/a5.png"/>-->
-<#--                    <p>城市管理服务热线接受市民现场咨询</p>-->
-<#--                </li>-->
-<#--                <li class="const-item">-->
-<#--                    <img src="/${data.websiteInfo.rootPath }/public/img/a6.png"/>-->
-<#--                    <p>城市管理服务热线接受市民现场咨询</p>-->
-<#--                </li>-->
-<#--                <li class="const-item">-->
-<#--                    <img src="/${data.websiteInfo.rootPath }/public/img/a7.png"/>-->
-<#--                    <p>12319城市管理专用车辆发车仪式</p>-->
-<#--                </li>-->
-<#--                <li class="const-item">-->
-<#--                    <img src="/${data.websiteInfo.rootPath }/public/img/a8.png"/>-->
-<#--                    <p>12319在九龙坡区杨家坪商圈开展“现场接办”</p>-->
-<#--                </li>-->
-            </ul>
-            <div class="play">
-                <img src="/${data.websiteInfo.rootPath }/public/img/play.png"/>
+            <div class="pre">
+                <img src="/${data.websiteInfo.rootPath }/public/img/zuoqiehuan.png" />
+            </div>
+            <div class="swiper">
+                <div class="swiper-wrapper">
+<#--                    <div class="swiper-slide">-->
+<#--                        <img src="http://192.168.0.95/fzzd/resource/articlePic/20220503/113624166.jpg"/>-->
+<#--                        <p>1</p>-->
+<#--                    </div>-->
+<#--                    <div class="swiper-slide">-->
+<#--                        <img src="http://192.168.0.95/fzzd/resource/articlePic/20220503/113604982.jpg"/>-->
+<#--                        <p>2</p>-->
+<#--                    </div>-->
+<#--                    <div class="swiper-slide">-->
+<#--                        <img src="http://192.168.0.95/fzzd/resource/articlePic/20220503/113546123.jpg"/>-->
+<#--                        <p>3</p>-->
+<#--                    </div>-->
+<#--                    <div class="swiper-slide">-->
+<#--                        <img src="http://192.168.0.95/fzzd/resource/articlePic/20220503/113531432.jpg"/>-->
+<#--                        <p>4</p>-->
+<#--                    </div>-->
+<#--                    <div class="swiper-slide">-->
+<#--                        <img src="http://192.168.0.95/fzzd/resource/articlePic/20220503/113511481.jpg"/>-->
+<#--                        <p>5</p>-->
+<#--                    </div>-->
+                </div>
+            </div>
+            <div class="next">
+                <img src="/${data.websiteInfo.rootPath }/public/img/youqiehuan.png" />
             </div>
         </div>
         <!-- 荣誉奖牌 -->
@@ -179,8 +173,8 @@
         </div>
     </div>
 </div>
-<script src="/${data.websiteInfo.rootPath }/public/js/jquery-3.5.1.min.js" type="text/javascript"
-        charset="utf-8"></script>
+<script src="/${data.websiteInfo.rootPath }/public/js/jquery-3.5.1.min.js" type="text/javascript" charset="utf-8"></script>
+<script src="/${data.websiteInfo.rootPath }/public/swiper/swiper.min.js"></script>
 <script src="/${data.websiteInfo.rootPath }/public/js/basic/indexb.js" type="text/javascript" charset="utf-8"></script>
 <script>
     layui.config({
@@ -193,8 +187,29 @@
         // 历史沿革
         $(".lsyg-box").load("/${data.websiteInfo.rootPath }/dhl/dtgk/lsyg/list.html")
         // 工作掠影
-        $(".cont-imgs").load("/${data.websiteInfo.rootPath }/dhl/dtgk/gzly/list.html")
+        <#--$(".swiper-wrapper").load("/${data.websiteInfo.rootPath }/dhl/dtgk/gzly/list.html")-->
+        $.get("/${data.websiteInfo.rootPath }/dhl/dtgk/gzly/list.html", function(data, status) {
+            $('.swiper-wrapper').empty().append(data);
+            runPlay();
+        }, "html");
     })
+
+    // 工作掠影轮播
+    function runPlay() {
+        var mySwiper = new Swiper('.swiper', {
+            direction: 'horizontal', // 垂直切换选项
+            loop: true, // 循环模式选项
+            autoplay: {
+                delay: 1500,
+                disableOnInteraction: false,
+            }, //自动播放
+            navigation: {
+                nextEl: '.next',
+                prevEl: '.pre',
+            },
+        })
+    }
+
 </script>
 </body>
 </html>

cms/src/main/resources/static/ftl/fzzd/index/ztzs.ftl

@@ -17,9 +17,16 @@
 <#--            </#list>-->
 <#--        </#if>-->
     </ul>
-    <div class="but-box">
-        <button type="button">上一页</button>
-        <button type="button">下一页</button>
+<#--    <div class="but-box">-->
+<#--        <button type="button">上一页</button>-->
+<#--        <button type="button">下一页</button>-->
+<#--    </div>-->
+    <!-- 适配主题展示 -->
+    <div class="aba-theme" style="display: none;">
+        <iframe id="iframeContent" src="" frameborder="0"></iframe>
+    </div>
+    <div class="back-ztzs" style="display: none;">
+        <img src="/${data.websiteInfo.rootPath }/public/img/back-ztzs.png" />
     </div>
 </div>
 <script type="text/javascript" src="/${data.websiteInfo.rootPath }/public/js/util.min.js"></script>

cms/src/main/resources/static/ftl/fzzd/public/css/indexb.css

@@ -1,34 +1,36 @@
-*{
+* {
 	margin: 0;
 	padding: 0;
 	box-sizing: border-box;
 	font-family: "Microsoft YaHei";
 }
 
-html,body{
+html,
+body {
 	width: 100%;
 	height: 100%;
 }
 
-li{
+li {
 	list-style: none;
 }
 
 @font-face {
-  font-family: 'iconfont';
-  src: url('../font/iconfont.woff2?t=1649485663505') format('woff2'),
-       url('../font/iconfont.woff?t=1649485663505') format('woff'),
-       url('../font/iconfont.ttf?t=1649485663505') format('truetype');
+	font-family: 'iconfont';
+	src: url('../font/iconfont.woff2?t=1649485663505') format('woff2'), url('../font/iconfont.woff?t=1649485663505') format('woff'), url('../font/iconfont.ttf?t=1649485663505') format('truetype');
 }
+
+
 /* 首页 */
-.indexb{
+
+.indexb {
 	display: flex;
 	align-items: center;
 	width: 100%;
 	height: 100%;
 }
 
-.index-list{
+.index-list {
 	display: flex;
 	flex-direction: column;
 	width: 10%;
@@ -36,7 +38,7 @@ li{
 	background-color: #F1F1F1;
 }
 
-.index-list .index-item{
+.index-list .index-item {
 	flex: 1;
 	display: flex;
 	align-items: center;
@@ -44,35 +46,38 @@ li{
 	flex-direction: column;
 	font-size: 14px;
 	color: #696969;
-	border-bottom: 1px solid rgba(147,147,147,0.5);
+	border-bottom: 1px solid rgba(147, 147, 147, 0.5);
 }
 
-.index-list .index-item:last-child{
+.index-list .index-item:last-child {
 	border-bottom: none;
 }
 
-.index-list .index-item>i{
+.index-list .index-item>i {
 	font-size: 20px;
 	margin-bottom: 5px;
 }
 
-.index-item-act{
+.index-item-act {
 	color: #2A8DCF !important;
 	background-color: #FFFFFF;
 }
 
+
 /* 内容区域 */
-.content{
+
+.content {
 	width: 90%;
 	height: 100%;
 }
 
-.content>div{
+.content>div {
 	position: relative;
 	width: 100%;
 	height: 100%;
 }
 
+
 /* 历史沿革 */
 .lsyg-box{
 	width: 100%;
@@ -83,7 +88,8 @@ li{
 	position: relative;
 	height: 100%;
 }
-.time-line .center-line{
+
+.time-line .center-line {
 	position: absolute;
 	bottom: 20%;
 	width: 100%;
@@ -91,13 +97,13 @@ li{
 	background-color: #0451A3;
 }
 
-.time-line img{
+.time-line img {
 	position: fixed;
-	bottom: 20%;
+	bottom: 22.5%;
 	left: 50%;
 }
 
-.time-top{
+.time-top {
 	position: relative;
 	display: flex;
 	align-items: center;
@@ -107,7 +113,7 @@ li{
 	overflow-y: scroll;
 }
 
-.time-top .time-item{
+.time-top .time-item {
 	position: relative;
 	bottom: -5%;
 	min-width: 200px;
@@ -116,7 +122,7 @@ li{
 	box-sizing: content-box;
 }
 
-.time-top .time-item::after{
+.time-top .time-item::after {
 	content: "";
 	position: absolute;
 	bottom: 0;
@@ -125,18 +131,18 @@ li{
 	background-color: #0451A3;
 }
 
-.time-top .time-item:nth-of-type(1){
+.time-top .time-item:nth-of-type(1) {
 	padding-left: 40px;
 }
 
-.time-item .flag{
+.time-item .flag {
 	position: absolute;
 	width: 5px;
 	height: 100%;
 	background-color: #0451A3;
 }
 
-.flag>i{
+.flag>i {
 	position: absolute;
 	top: 5px;
 	display: inline-block;
@@ -145,19 +151,19 @@ li{
 	border-left: 90px solid #0451A3;
 }
 
-.time-item .contan-box{
+.time-item .contan-box {
 	position: absolute;
 	top: 30%;
 	margin-left: 14px;
 }
 
-.contan-box .item-title{
+.contan-box .item-title {
 	font-size: 36px;
 	font-weight: 550;
 	color: #0451A3;
 }
 
-.contan-box .item-cont{
+.contan-box .item-cont {
 	/* font-family: "黑体"; */
 	font-size: 18px;
 	font-weight: 500;
@@ -165,12 +171,13 @@ li{
 	padding-right: 20px;
 }
 
+
 /* 机构设置 */
 .jgsz-box{
 	padding: 1%;
 }
 
-.jg-title{
+.jg-title {
 	display: flex;
 	align-items: center;
 	width: 100%;
@@ -178,14 +185,14 @@ li{
 	font-size: 18px;
 }
 
-.jg-container{
+.jg-container {
 	display: flex;
 	justify-content: center;
 	width: 100%;
 	height: 90%;
 }
 
-.jg-content{
+.jg-content {
 	display: flex;
 	flex-direction: column;
 	align-items: center;
@@ -193,17 +200,17 @@ li{
 	padding: 0 5%;
 }
 
-.jg-content .top-box{
+.jg-content .top-box {
 	width: 100%;
 	height: 40%;
 }
 
-.jg-content .top-box .jg-top{
+.jg-content .top-box .jg-top {
 	display: flex;
 	justify-content: space-between;
 }
 
-.jg-top .top-item{
+.jg-top .top-item {
 	text-align: center;
 	line-height: 35px;
 	height: 35px;
@@ -212,31 +219,31 @@ li{
 	background-color: #D5E8F6;
 }
 
-.jg-top:nth-child(1){
+.jg-top:nth-child(1) {
 	display: flex;
 	flex-wrap: wrap;
 	justify-content: space-around;
 }
 
-.jg-top:nth-child(1) .top-item{
+.jg-top:nth-child(1) .top-item {
 	width: 45%;
 	margin-top: 10px;
 }
 
-.jg-top:nth-child(2){
+.jg-top:nth-child(2) {
 	margin-top: 10px;
 }
 
-.jg-top:nth-child(2) .top-item{
+.jg-top:nth-child(2) .top-item {
 	width: 30%;
 }
 
-.jg-content .bottom-box{
+.jg-content .bottom-box {
 	width: 100%;
 	height: 70%;
 }
 
-.bot-text{
+.bot-text {
 	display: flex;
 	align-items: center;
 	width: 100%;
@@ -244,7 +251,7 @@ li{
 	font-size: 18px;
 }
 
-.jg-bottom{
+.jg-bottom {
 	display: flex;
 	flex-wrap: wrap;
 	justify-content: space-between;
@@ -252,7 +259,7 @@ li{
 	padding: 1%;
 }
 
-.jg-bottom .bottom-item{
+.jg-bottom .bottom-item {
 	display: flex;
 	align-items: center;
 	text-indent: 0.5em;
@@ -264,7 +271,7 @@ li{
 	background-color: #D5E8F6;
 }
 
-.jg-bottom .bottom-item>i{
+.jg-bottom .bottom-item>i {
 	display: flex;
 	align-items: center;
 	justify-content: center;
@@ -276,7 +283,7 @@ li{
 	background-color: #2D8FCE;
 }
 
-.jg-img{
+.jg-img {
 	display: flex;
 	align-items: center;
 	justify-content: center;
@@ -284,19 +291,47 @@ li{
 	height: 100%;
 }
 
-.jg-img>img{
+.jg-img>img {
 	width: 90%;
 	height: 100%;
 }
 
+
 /* 工作掠影 */
-.gzly-box{
+
+.gzly-box {
+	position: relative;
 	width: 100%;
 	height: 100%;
 	overflow: hidden;
 }
 
-.gzly-box .cont-imgs{
+.pre,
+.next {
+	width: 7%;
+	position: absolute;
+	top: 50%;
+	z-index: 999;
+	transform: translateY(-50%);
+}
+
+.pre {
+	left: 5%;
+}
+
+.pre>img {
+	width: 100%;
+}
+
+.next {
+	right: 5%;
+}
+
+.next>img {
+	width: 100%;
+}
+
+.gzly-box .cont-imgs {
 	display: flex;
 	align-items: center;
 	width: 100%;
@@ -305,22 +340,22 @@ li{
 	top: 13%;
 }
 
-.cont-imgs .const-item{
+.cont-imgs .const-item {
 	min-width: 30%;
 	height: 100%;
 	margin-right: 3%;
 }
 
-.cont-imgs .const-item:nth-child(1){
+.cont-imgs .const-item:nth-child(1) {
 	margin-left: 2%;
 }
 
-.const-item>img{
+.const-item>img {
 	width: 100%;
 	height: 85%;
 }
 
-.const-item>p{
+.const-item>p {
 	display: flex;
 	flex-wrap: wrap;
 	flex-direction: column;
@@ -332,14 +367,14 @@ li{
 	color: #434343;
 }
 
-.play{
+.play {
 	text-align: center;
 	width: 100%;
 	position: relative;
 	top: 25%;
 }
 
-.play>img{
+.play>img {
 	width: 5%;
 }
 
@@ -375,25 +410,28 @@ li{
 
 .ryjp-box>ul>li>span{
 	margin-top: 5px;
+	font-size: 18px;
 }
 
-.jp-three .three-item:nth-child(5)>.img-box{
+.jp-three .three-item:nth-child(5)>.img-box {
 	width: 80%;
-	box-shadow: 0px 1px 2px rgba(0,0,0,0.5);
+	box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
 }
 
-.jp-three .three-item:nth-child(5)>.img-box>img{
+.jp-three .three-item:nth-child(5)>.img-box>img {
 	width: 100%;
 }
 
 
 /* 大厅 */
-.dt-box{
+
+.dt-box {
 	display: flex;
 	flex-direction: column;
 	justify-content: center;
 }
-.title-dt{
+
+.title-dt {
 	display: flex;
 	justify-content: center;
 	align-items: center;
@@ -401,16 +439,16 @@ li{
 	height: 10%;
 }
 
-.title-dt .title-box{
+.title-dt .title-box {
 	width: 26%;
 	text-align: center;
 }
 
-.title-box>i{
+.title-box>i {
 	font-size: 25px;
 }
 
-.describe{
+.describe {
 	display: flex;
 	flex-direction: column;
 	align-items: center;
@@ -419,15 +457,15 @@ li{
 	height: 20%;
 }
 
-.describe>p{
+.describe>p {
 	padding: 0.5% 0;
 }
 
-.describe>p>i{
+.describe>p>i {
 	font-size: 20px;
 }
 
-.img-show{
+.img-show {
 	display: flex;
 	align-items: center;
 	justify-content: space-around;
@@ -435,7 +473,7 @@ li{
 	height: 60%;
 }
 
-.img-show .item-show{
+.img-show .item-show {
 	display: flex;
 	flex-direction: column;
 	align-items: center;
@@ -443,20 +481,52 @@ li{
 	height: 100%;
 }
 
-.item-show>img{
+.item-show>img {
 	width: 100%;
 	height: 90%;
 }
 
-.item-show>span{
+.item-show>span {
 	margin-top: 10px;
 }
 
+
 /* 工作目标 */
-.mb-box{
+
+.mb-box {
 	padding: 0% 3%;
 }
-.mb-box>img{
+
+.mb-box>img {
 	width: 100%;
 	height: 100%;
+}
+
+
+/* 新样式 */
+
+.swiper {
+	width: 90%;
+	height: 90%;
+}
+
+.swiper-slide {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+}
+
+.swiper-slide>img {
+	width: 80%;
+	max-width: 80%;
+}
+
+.swiper-slide>p {
+	width: 80%;
+	text-overflow: ellipsis;
+	overflow: hidden;
+	white-space: nowrap;
+	font-size: 18px;
+	text-align: center;
 }

cms/src/main/resources/static/ftl/fzzd/public/css/style.css

@@ -1,129 +1,135 @@
-*{
-	margin: 0;
-	padding: 0;
+* {
+    margin: 0;
+    padding: 0;
 }
+
 html {
-  height: 100%;
-  overflow: hidden;
+    height: 100%;
+    overflow: hidden;
 }
+
 body {
-  width: 100%;
-  height: 100%;
-  background: url(../img/xiangce.png) 75% center no-repeat;
-  background-size: 92% 90%;
+    width: 100%;
+    height: 100%;
+    background: url(../img/xiangce.png) 75% center no-repeat;
+    background-size: 92% 90%;
 }
 
 h1 {
-  text-align: center;
+    text-align: center;
 }
 
 .scene {
     width: 45%;
     height: 90%;
     margin: 4% 0% 0% 52%;
-  
-  perspective: 1000px;
+    perspective: 1000px;
 }
 
 .book {
-  position: relative;
-  width: 100%;
-  height: 100%;
-  
-  transform-style: preserve-3d;
+    position: relative;
+    width: 100%;
+    height: 100%;
+    transform-style: preserve-3d;
 }
 
 .page {
-  cursor: pointer;
-  position: absolute;
-  color: black;
-  width: 100%;
-  height: 100%;
+    cursor: pointer;
+    position: absolute;
+    color: black;
+    width: 100%;
+    height: 100%;
+    transition: 1.5s transform;
+    transform-style: preserve-3d;
+    transform-origin: left center;
+}
+/* new */
 
-  transition: 1.5s transform;
-  transform-style: preserve-3d;  
-  transform-origin: left center;
-}
 .front,
 .back {
-  position: absolute;
-  width: 85%;
-  height: 85%;
-  top: 3%;
-  right: 5%;
-  box-sizing: border-box;
-  backface-visibility: hidden;
-  background-color: #FFFFFF;
+    position: absolute;
+    width: 85%;
+    height: 85%;
+    top: 3%;
+    right: 5%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    box-sizing: border-box;
+    backface-visibility: hidden;
+    background-color: #FFFFFF;
 }
+
 .back {
-  transform: rotateY(180deg);
+    transform: rotateY(180deg);
 }
 
-.back>img{
-	width: 100%;
-	height: 93%;
-	margin-bottom: 1%;
+.back>img {
+    width: 100%;
+    margin-bottom: 1%;
 }
 
-.back>span{
-	display: inline-block;
-	width: 100%;
-	height: 6%;
-	text-align: center;
-	line-height: 100%;
-	white-space: nowrap;
-	text-overflow: ellipsis;
-	overflow: hidden;
-}
+.back>span {
+    display: inline-block;
+    width: 100%;
+    height: 6%;
+    text-align: center;
+    line-height: 100%;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    font-size: 18px;
+}
+/* new */
 
-.front>img{
-	width: 100%;
-	height: 93%;
-	margin-bottom: 1%;
+.front>img {
+    width: 100%;
+    margin-bottom: 1%;
 }
 
-.front>span{
-	display: inline-block;
-	width: 100%;
-	height: 6%;
-	text-align: center;
-	
-	white-space: nowrap;
-	text-overflow: ellipsis;
-	overflow: hidden;
+.front>span {
+    display: inline-block;
+    width: 100%;
+    height: 6%;
+    text-align: center;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    font-size: 18px;
 }
 
 .page.active {
-  z-index: 1;
+    z-index: 1;
 }
+
 .page.flipped {
-  transform: rotateY(-180deg);
+    transform: rotateY(-180deg);
 }
+
 .page.flipped:last-of-type {
-  z-index: 1;
+    z-index: 1;
 }
 
 p {
-  margin: 0 0 0.1em;
-  text-indent: 1em;
+    margin: 0 0 0.1em;
+    text-indent: 1em;
 }
 
 .qr {
-  margin: 50px auto;
-  max-width: 50%;
+    margin: 50px auto;
+    max-width: 50%;
 }
+
 .qr img {
-  display: block;
+    display: block;
 }
-
-
 /* iPads (portrait) ----------- */
-@media only screen 
-and (min-device-width : 768px) 
-and (max-device-width : 1024px) 
-and (orientation : portrait) {
-  .scene {
-    width: 90%;
-    height: 90%;
-    margin: 5%;
+
+@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
+    .scene {
+        width: 90%;
+        height: 90%;
+        margin: 5%;
+    }
 }

cms/src/main/resources/static/ftl/fzzd/public/css/ztzs.css

@@ -1,63 +1,67 @@
-*{
+* {
 	margin: 0;
 	padding: 0;
 	box-sizing: border-box;
 	font-family: "Microsoft YaHei";
 }
 
-html,body{
+html,
+body {
 	width: 100%;
 	height: 100%;
 }
 
-li{
+li {
 	list-style: none;
 }
 
+
 /* 主题展示 */
-.ztzs{
+
+.ztzs {
 	width: 100%;
 	height: 100%;
 	padding: 2%;
 }
 
-.ztzs .ztzs-list{
-	display: flex;
-	flex-wrap: wrap;
+.ztzs .ztzs-list {
 	width: 100%;
 	height: 85%;
 	padding: 0 2%;
 }
-.ztzs-list .ztzs-item{
-	width: 30%;
+
+.ztzs-list .ztzs-item {
+	float: left;
+	width: 32%;
 	height: 30%;
-	margin-right: 5%;
+	margin-right: 2%;
 	margin-bottom: 1.5%;
 }
 
-.ztzs-list .ztzs-item>img{
+.ztzs-list .ztzs-item>img {
 	width: 100%;
 	height: 87%;
 }
 
-.ztzs-list .ztzs-item>p{
+.ztzs-list .ztzs-item>p {
 	width: 100%;
 	height: 13%;
 	text-align: center;
 	text-overflow: ellipsis;
 	overflow: hidden;
 	white-space: nowrap;
+	font-size: 18px;
 }
 
-.ztzs-list .ztzs-item:nth-child(3n){
+.ztzs-list .ztzs-item:nth-child(3n) {
 	margin-right: 0;
 }
 
-.ztzs-list .ztzs-item:nth-child(7){
+.ztzs-list .ztzs-item:nth-child(7) {
 	margin-bottom: 0;
 }
 
-.but-box{
+.but-box {
 	display: flex;
 	align-items: center;
 	justify-content: center;
@@ -65,16 +69,46 @@ li{
 	height: 15%;
 }
 
-.but-box>button{
+.but-box>button {
 	width: 10%;
 	height: 60%;
 	font-size: 110%;
 	color: #676767;
 	border: 1px solid #E8E8E8;
 	border-radius: 5px;
-	background-image: linear-gradient(#FDFDFD,#F3F3F3, #EBEBEB);
+	background-image: linear-gradient(#FDFDFD, #F3F3F3, #EBEBEB);
 }
 
-.but-box>button:nth-child(1){
+.but-box>button:nth-child(1) {
 	margin-right: 2%;
+}
+
+
+/* 新增 */
+
+.aba-theme {
+	position: relative;
+	width: 100%;
+	height: 100%;
+	transform: scale(0.2, 0.2);
+	transform-origin: top left;
+}
+
+.aba-theme iframe {
+	width: 10240px;
+	height: 2686.57px;
+}
+
+.back-ztzs {
+	position: fixed;
+	top: 1%;
+	right: 1%;
+	width: 5%;
+	padding: 0.5%;
+	border-radius: 10px;
+	background-color: rgb(218, 33, 33);
+}
+
+.back-ztzs>img {
+	width: 100%;
 }

cms/src/main/resources/static/ftl/fzzd/public/js/basic/index.js

@@ -56,10 +56,12 @@ function saveUserInfo() {
     sessionStorage.ACCOUNT = userInfo.account || account;
     sessionStorage.LOGIN_USERNAME = userInfo.loginUsername || loginUsername;
     sessionStorage.ROLE_TYPE = userInfo.roleType || roleType;
-    // //TODO 退出
-    // if (sessionStorage.getItem("LOGIN_USERID") === "null") {
-    //     window.location.href = HOME_PATH + 'cms/ftl/fzzd/login.html';
-    // }
+    //退出
+    if (sessionStorage.getItem("ROLE_TYPE") === "null"|| sessionStorage.getItem("ACCOUNT") === "null" || sessionStorage.getItem("REFRESH_TOKEN") === "null"
+        || sessionStorage.getItem("LOGIN_USERID") === "null" || sessionStorage.getItem("ROLE_ID") === "null" || sessionStorage.getItem("TOKEN_TYPE") === "null"
+        || sessionStorage.getItem("LOGIN_USERNAME") === "null" || sessionStorage.getItem("ACCESS_TOKEN") === "null") {
+        window.location.href ='/fzzd/login/index.html';
+    }
 }
 
 // 去除url参数

cms/src/main/resources/static/ftl/fzzd/public/js/basic/ztzs.js

@@ -3,8 +3,27 @@ util.init(['jquery', 'ajax', 'layer'], function (layui) {
     layer = layui.layer;
     ly = layui.ajax;
     showThemeInfo()
+    showIframeContent();
 });
 
+// 显示iframe内容
+function showIframeContent() {
+    $(".ztzs-list").on("click", ".ztzs-item", function () {
+        console.log($(this).attr("data-src"))
+        $("#iframeContent").attr("src", $(this).attr("data-src"))
+        $(".ztzs-list").css("display", "none");
+        $(".but-box").css("display", "none");
+        $(".aba-theme").css("display", "block");
+        $(".back-ztzs").css("display", "block");
+    })
+
+    $(".back-ztzs").on("click", function () {
+        $(".ztzs-list").css("display", "block");
+        $(".but-box").css("display", "flex");
+        $(".aba-theme").css("display", "none")
+        $(".back-ztzs").css("display", "none")
+    })
+}
 // 主题展示
 function showThemeInfo() {
     index = layer.load(2);
@@ -19,7 +38,7 @@ function showThemeInfo() {
                 let data = json.data;
                 var themeHtml = '';
                 for (let i = 0; i < data.length; i++) {
-                    themeHtml += '<li class="ztzs-item">\n' +
+                    themeHtml += '<li class="ztzs-item" data-src="' + data[i].url + '">\n' +
                         '                <img src="' + FLAT_PATH_BASIC + data[i].system_img + '"/>\n' +
                         '                <p>' + data[i].system_name + '</p>\n' +
                         '            </li>'

cms/src/main/resources/static/ftl/fzzd/public/js/util.min.js

@@ -39,7 +39,7 @@ var util = {
 				sessionStorage.clear();
 				util.layer.errorMsg('系统错误，请重新登录！');
 				setTimeout(function() {
-					window.location.href = 'login.html';
+					window.location.href = 'index.html';
 				}, 2000);
 			}
 		});

spring-cloud/commons/src/main/java/com/jd/entity/basic/BusinessSystem.java

@@ -134,4 +134,10 @@ public class BusinessSystem implements Serializable {
 	*/
 	@ApiModelProperty("是否在辅助终端上展示(0否， 1是)")
 	private Integer showAuxiliaryTerminal;
+
+	/**
+	 * 外链地址
+	 */
+	@ApiModelProperty("系统登录地址")
+	private String url;
 }

spring-cloud/configer/src/main/resources/config/dev/gateway-dev.yml

@@ -86,7 +86,8 @@ filter:
     /safetyInfor/getRiskInfoByOrg,/safetyInfor/getSysStatusByOrg,/SystemRisk/getHighStatus,/SystemRisk/getHighStatusByMonth,\
     /AttackEvent/getAttackEventByInfo,/AttackType/getAttackTypeByMonth,/SystemAttacked/getSystemAttackedByInfo,/businessSystem/getSystemInfoByVoiceKeyword,\
     /safetyInfor/getWebSafetyStatusByOrg,/OfficeVirus/getOfficeSafetyInfo,/GuaranteeGroup/getAllGuaranteeGroup,/monitoringResources/getMonitorListByName,/monitoringResources/creatRelay,\
-    /monitoringResources/closeAllRelay,/monitoringResources/getStreamForKaiKang,/SystemRisk/GetSystemRiskList,/SystemRisk/getSysInfoByOffice,/flat/door/personRegister,/flat/sendMessage,/businessSystem/getSystemInfoByShow"
+    /monitoringResources/closeAllRelay,/monitoringResources/getStreamForKaiKang,/SystemRisk/GetSystemRiskList,/SystemRisk/getSysInfoByOffice,/flat/door/personRegister,/flat/sendMessage,/businessSystem/getSystemInfoByShow,\
+    /commandTranscription/insertCommandTranscription"
 
   # 不需要过参数过滤器的uri
   parameter:
@@ -112,7 +113,8 @@ filter:
     /safetyInfor/getRiskInfoByOrg,/safetyInfor/getSysStatusByOrg,/SystemRisk/getHighStatus,/SystemRisk/getHighStatusByMonth,\
     /AttackEvent/getAttackEventByInfo,/AttackType/getAttackTypeByMonth,/SystemAttacked/getSystemAttackedByInfo,/businessSystem/getSystemInfoByVoiceKeyword,\
     /safetyInfor/getWebSafetyStatusByOrg,/OfficeVirus/getOfficeSafetyInfo,/GuaranteeGroup/getAllGuaranteeGroup,/monitoringResources/getMonitorListByName,/monitoringResources/creatRelay,/monitoringResources/closeAllRelay,\
-    /SystemRisk/GetSystemRiskList,/SystemRisk/getSysInfoByOffice,/monitoringResources/getStreamForKaiKang,/flat/door/personRegister,/flat/sendMessage,/businessSystem/getSystemInfoByShow"
+    /SystemRisk/GetSystemRiskList,/SystemRisk/getSysInfoByOffice,/monitoringResources/getStreamForKaiKang,/flat/door/personRegister,/flat/sendMessage,/businessSystem/getSystemInfoByShow,\
+    /commandTranscription/insertCommandTranscription"
 
   # 登录接口
   login:

spring-cloud/server-basic/pom.xml

@@ -47,7 +47,11 @@
 			<artifactId>mybatis-spring-boot-starter</artifactId>
 			<version>${mybatis-spring-boot-starter}</version>
 		</dependency>-->
-
+		<dependency>
+			<groupId>com.alibaba</groupId>
+			<artifactId>fastjson</artifactId>
+			<version>1.2.68</version>
+		</dependency>
 		<dependency>
 			<groupId>org.springframework.cloud</groupId>
 			<artifactId>spring-cloud-starter-oauth2</artifactId>

spring-cloud/server-basic/src/main/java/com/jd/configer/ResourceServerConfig.java

@@ -40,8 +40,8 @@ public class ResourceServerConfig extends ResourceServerConfigurerAdapter {
 					,"/AttackType/getAttackTypeByMonth","/SystemAttacked/getSystemAttackedByInfo","/safetyInfor/getWebSafetyStatusByOrg"
 					,"/OfficeVirus/getOfficeSafetyInfo","/AttackType/getAttackTypeByMonth","/SystemAttacked/getSystemAttackedByInfo","/businessSystem/getSystemInfoByVoiceKeyword"
 					,"/GuaranteeGroup/getAllGuaranteeGroup","/SystemRisk/GetSystemRiskList","/SystemRisk/getSysInfoByOffice","/monitoringResources/getMonitorListByName","/monitoringResources/creatRelay","/monitoringResources/closeAllRelay"
-					,"/monitoringResources/getStreamForKaiKang","/flat/door/personRegister","/flat/sendMessage","/businessSystem/getSystemInfoByShow"
-					).permitAll()			.anyRequest()
+					,"/monitoringResources/getStreamForKaiKang","/flat/door/personRegister","/flat/sendMessage","/businessSystem/getSystemInfoByShow","/commandTranscription/insertCommandTranscription"
+					).permitAll().anyRequest()
 			.authenticated()
 		.and()
 			.csrf()

spring-cloud/server-basic/src/main/java/com/jd/controller/CommandTranscriptionController.java

@@ -0,0 +1,70 @@
+package com.jd.controller;
+
+import com.jd.code.ConstString;
+import com.jd.service.CommandTranscriptionService;
+import com.jd.util.Blank;
+import com.jd.util.SendUtil;
+import io.swagger.annotations.Api;
+import io.swagger.annotations.ApiOperation;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+
+import java.util.HashMap;
+import java.util.Map;
+
+/**
+ * 指挥转写
+ * @author Admin
+ */
+@RestController
+@RequestMapping("commandTranscription")
+@Api(value = "指挥转写", tags = {"指挥转写"})
+public class CommandTranscriptionController {
+
+    private final CommandTranscriptionService commandTranscriptionService;
+
+    public CommandTranscriptionController(CommandTranscriptionService commandTranscriptionService) {
+        this.commandTranscriptionService = commandTranscriptionService;
+    }
+
+
+    /**
+     * 分页查询指挥转写列表
+     * @param page
+     * @param limit
+     * @param queryVal
+     * @return
+     */
+    @GetMapping("getCommandTranscriptionListByPage")
+    @ApiOperation(value = "分页查询指挥转写列表")
+    public Map<String, Object> getCommandTranscriptionListByPage(Integer page, Integer limit, String queryVal) {
+        if (Blank.isEmpty(page, limit)) {
+            return SendUtil.send(false, ConstString.REQUEST_WRONGPARAMS);
+        }
+        return commandTranscriptionService.getCommandTranscriptionListByPage(page, limit, queryVal);
+    }
+
+    /**
+     * 新增指挥转写
+     * @param content
+     * @param type
+     * @param answer
+     * @return
+     */
+    @PostMapping("insertCommandTranscription")
+    @ApiOperation(value = "新增指挥转写")
+    public Map<String, Object> insertCommandTranscription(String content, Integer type, String answer) {
+        if (Blank.isEmpty(content, type, answer)) {
+            return SendUtil.send(false, ConstString.REQUEST_WRONGPARAMS);
+        }
+        Map<String, Object> param = new HashMap<>(8);
+        param.put("content", content);
+        param.put("type", type);
+        param.put("answer", answer);
+
+        return commandTranscriptionService.insertCommandTranscription(param);
+    }
+
+}

spring-cloud/server-basic/src/main/java/com/jd/controller/MeetingTranscriptionController.java

@@ -1,6 +1,5 @@
 package com.jd.controller;
 
-import cn.hutool.core.convert.Convert;
 import com.jd.code.ConstString;
 import com.jd.entity.basic.MeetingTranscription;
 import com.jd.service.MeetingTranscriptionService;
@@ -8,21 +7,11 @@ import com.jd.util.Blank;
 import com.jd.util.SendUtil;
 import io.swagger.annotations.Api;
 import io.swagger.annotations.ApiOperation;
-import io.swagger.models.auth.In;
-import org.apache.commons.io.IOUtils;
 import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.bind.annotation.PostMapping;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;
 
-import javax.servlet.ServletOutputStream;
-import javax.servlet.http.HttpServletRequest;
-import javax.servlet.http.HttpServletResponse;
-import java.io.ByteArrayInputStream;
-import java.io.File;
-import java.io.FileInputStream;
-import java.io.IOException;
-import java.nio.charset.StandardCharsets;
 import java.util.Map;
 
 /**

spring-cloud/server-basic/src/main/java/com/jd/mapper/CommandTranscriptionMapper.java

@@ -0,0 +1,32 @@
+package com.jd.mapper;
+
+import java.util.List;
+import java.util.Map;
+
+/**
+ * 指挥转写
+ * @author Admin
+ */
+public interface CommandTranscriptionMapper {
+
+    /**
+     * 查询指挥转写列表数量
+     * @param param
+     * @return
+     */
+    Integer getCommandTranscriptionCount(Map<String, Object> param);
+
+    /**
+     * 分页查询指挥转写列表
+     * @param param
+     * @return
+     */
+    List<Map<String, Object>> getCommandTranscriptionListByPage(Map<String, Object> param);
+
+    /**
+     * 新增指挥转写
+     * @param param
+     * @return
+     */
+    boolean insertCommandTranscription(Map<String, Object> param);
+}

spring-cloud/server-basic/src/main/java/com/jd/service/CommandTranscriptionService.java

@@ -0,0 +1,28 @@
+package com.jd.service;
+
+import java.util.Map;
+
+/**
+ * 指挥转写
+ * @author Admin
+ */
+public interface CommandTranscriptionService {
+
+    /**
+     * 分页查询指挥转写列表
+     * @param page
+     * @param limit
+     * @param queryVal
+     * @return
+     */
+    Map<String, Object> getCommandTranscriptionListByPage(Integer page, Integer limit, String queryVal);
+
+    /**
+     * 新增指挥转写
+     * @param param
+     * @return
+     */
+    Map<String, Object> insertCommandTranscription(Map<String, Object> param);
+
+
+}

spring-cloud/server-basic/src/main/java/com/jd/service/impl/CommandTranscriptionServiceImpl.java

@@ -0,0 +1,48 @@
+package com.jd.service.impl;
+
+import com.jd.mapper.CommandTranscriptionMapper;
+import com.jd.service.CommandTranscriptionService;
+import com.jd.util.Blank;
+import com.jd.util.SendUtil;
+import org.springframework.stereotype.Service;
+
+import java.util.HashMap;
+import java.util.List;
+import java.util.Map;
+
+/**
+ * 指挥转写
+ * @author Admin
+ */
+@Service
+public class CommandTranscriptionServiceImpl implements CommandTranscriptionService {
+
+    private final CommandTranscriptionMapper commandTranscriptionMapper;
+
+    public CommandTranscriptionServiceImpl(CommandTranscriptionMapper commandTranscriptionMapper) {
+        this.commandTranscriptionMapper = commandTranscriptionMapper;
+    }
+
+    @Override
+    public Map<String, Object> getCommandTranscriptionListByPage(Integer page, Integer limit, String queryVal) {
+        Map<String, Object> param = new HashMap<>(8);
+        param.put("limit", limit);
+        param.put("start", (page - 1) * limit);
+        param.put("queryVal", queryVal);
+
+        // 查询菜单列表数量
+        Integer count = commandTranscriptionMapper.getCommandTranscriptionCount(param);
+        if (Blank.isEmpty(count) || count < 1) {
+            return SendUtil.layuiTable(0, null);
+        }
+        List<Map<String, Object>> list = commandTranscriptionMapper.getCommandTranscriptionListByPage(param);
+        return SendUtil.layuiTable(count, list);
+    }
+
+    @Override
+    public Map<String, Object> insertCommandTranscription(Map<String, Object> param) {
+        boolean flag = commandTranscriptionMapper.insertCommandTranscription(param);
+        return SendUtil.send(flag);
+    }
+
+}

spring-cloud/server-basic/src/main/resources/mapper/BusinessSystemMapper.xml

@@ -12,7 +12,7 @@ INSERT INTO t_business_system
  office_id, org_type, grade_eval, eval_time, show_auxiliary_terminal)
 VALUES(#{systemName},#{loginAddress},#{loginAccount},#{password},#{systemCategory},
 	#{loginMode},#{InterfaceUrl},#{systemImg},NOW(),#{voice},#{voiceEvent},#{sortno},
-       #{officeId}, #{orgType}, #{gradeEval}, #{evalTime}, #{showAuxiliaryTerminal})
+       #{officeId}, #{orgType}, #{gradeEval}, #{evalTime}, #{showAuxiliaryTerminal}, #{url})
 	</insert>
 
 	<update id="updateSystem">
@@ -21,7 +21,7 @@ SET system_category =#{systemCategory}, system_name =#{systemName}, login_mode =
  	login_account =#{loginAccount}, login_address =#{loginAddress}, `password` =#{password},
  	system_img=#{systemImg},interface_url=#{InterfaceUrl},update_time=NOW(),voice=#{voice},voice_event=#{voiceEvent},
     sortno=#{sortno}, office_id=#{officeId}, org_type=#{orgType}, grade_eval=#{gradeEval}, eval_time=#{evalTime},
-	show_auxiliary_terminal=#{showAuxiliaryTerminal}
+	show_auxiliary_terminal=#{showAuxiliaryTerminal},url=#{url}
  WHERE system_id=#{systemId}
 	</update>
 
@@ -68,7 +68,8 @@ DELETE FROM  t_business_system WHERE system_id=#{systemId}
 	org_type,
 	grade_eval,
 	eval_time,
-	show_auxiliary_terminal
+	show_auxiliary_terminal,
+	url
 	FROM
 		t_business_system
 		order by sortno asc
@@ -139,7 +140,8 @@ DELETE FROM  t_business_system WHERE system_id=#{systemId}
 			voice,
 			voice_event,
 			sortno,
-			show_auxiliary_terminal
+			show_auxiliary_terminal,
+		    url
 		FROM
 			t_business_system
 		WHERE

spring-cloud/server-basic/src/main/resources/mapper/CommandTranscriptionMapper.xml

@@ -0,0 +1,90 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd" >
+<mapper namespace="com.jd.mapper.CommandTranscriptionMapper">
+
+    <!-- 查询指挥转写列表数量 -->
+    <select id="getCommandTranscriptionCount" resultType="java.lang.Integer">
+        SELECT
+            COUNT(*)
+        FROM
+            t_command_transcription
+        <where>
+            <if test="queryVal != null and queryVal != ''">
+                AND content LIKE CONCAT('%', #{queryVal},'%')
+            </if>
+        </where>
+    </select>
+
+    <!-- 分页查询指挥转写列表 -->
+    <select id="getCommandTranscriptionListByPage" resultType="java.util.Map">
+        SELECT
+            record_id,
+            content,
+            `type`,
+            answer,
+            status,
+            create_time
+        FROM
+            t_command_transcription
+        <where>
+            <if test="queryVal != null and queryVal != ''">
+                AND content LIKE CONCAT('%', #{queryVal},'%')
+            </if>
+        </where>
+        ORDER BY
+            create_time DESC
+        LIMIT #{start}, #{limit}
+    </select>
+
+    <!-- 新增指挥转写 -->
+    <insert id="insertCommandTranscription" useGeneratedKeys="true" keyProperty="recordId">
+        INSERT INTO t_command_transcription (
+            content,
+            `type`,
+            answer,
+            create_time
+        )
+        VALUES (
+            #{content},
+            #{type},
+            #{answer},
+            NOW()
+        )
+    </insert>
+
+    <!-- 编辑指挥转写 -->
+    <update id="updateCommandTranscription">
+        UPDATE t_command_transcription
+        <set>
+            content = #{content},
+            `type` = #{type},
+            answer = #{answer}
+        </set>
+        WHERE
+            record_id = #{recordId}
+    </update>
+
+    <!-- 根据ID删除指挥转写记录 -->
+    <delete id="deleteCommandTranscription">
+        DELETE
+        FROM t_command_transcription
+        WHERE record_id = #{recordId}
+    </delete>
+
+    <!-- 根据ID查询指挥转写记录详情 -->
+    <select id="getCommandTranscriptionById" resultType="java.util.Map">
+        SELECT
+            record_id,
+            content,
+            `type`,
+            answer,
+            status,
+            create_time
+        FROM
+            t_command_transcription
+        WHERE
+            record_id = #{recordId}
+        LIMIT 1
+    </select>
+
+</mapper>

spring-cloud/server-page/src/main/resources/static/page/businessSystemManager.html

@@ -209,6 +209,12 @@
                     <input type="radio" name="showAuxiliaryTerminal" value="0" title="不展示" checked="">
                 </div>
             </div>
+            <div class="layui-form-item">
+                <label class="layui-form-label">外链地址：</label>
+                <div class="layui-input-inline">
+                    <input type="text" name="url" id="url" password="off" placeholder="请输入外链地址" class="layui-input">
+                </div>
+            </div>
             <button type="submit" id="submit" class="layui-btn submit_btn" lay-submit="" lay-filter="submit"
                     submitType=""
                     style="margin-left: 50px;margin-top: 30px;">提交

spring-cloud/server-page/src/main/resources/static/page/commandTranscription.html

@@ -0,0 +1,97 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="renderer" content="webkit">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
+    <title>指挥转写</title>
+    <link rel="stylesheet" type="text/css" href="layui/css/layui.css"/>
+    <link rel="stylesheet" type="text/css" href="css/admin.css"/>
+    <link rel="stylesheet" type="text/css" href="css/common.css"/>
+    <link rel="stylesheet" type="text/css" href="css/animate.css"/>
+</head>
+<style>
+    .layui-form-item .layui-input-inline {
+        width: 60%;
+    }
+
+    .layui-textarea {
+        resize: none;
+        height: 300px;
+    }
+</style>
+<body>
+<!-- 主要内容 -->
+<div class="main fadeIn animated">
+    <div class="header_title"><span>指挥转写</span></div>
+    <div class="main_content">
+        <table class="layui-hide" id="transcriptionTable" lay-filter="transcriptionTable"></table>
+
+        <script type="text/html" id="transcriptionTable_toolbar">
+            {{# if (sessionStorage.getItem("menuid-" + sessionStorage.MENU_ID + "-add")  == 'add') { }}
+            <div class="layui-btn-container">
+                <button class="layui-btn layui-btn-sm main_head_btn" lay-event="add"><span class="iconfont">&#xe607;</span>新增</button>
+            </div>
+            {{# } }}
+        </script>
+
+        <script type="text/html" id="transcriptionTable_bar">
+            {{# if (sessionStorage.getItem("menuid-" + sessionStorage.MENU_ID + "-update") == 'update') { }}
+            <a class="main_tab_btn" lay-event="edit" style="color: #64ADF9;"><span class="iconfont">&#xe637;</span>编辑</a>
+            {{# } }}
+            {{# if (sessionStorage.getItem("menuid-" + sessionStorage.MENU_ID + "-delete") == 'delete') { }}
+            <a class="main_tab_btn" lay-event="del" style="color: #FC7D8C;"><span class="iconfont">&#xe78d;</span>删除</a>
+            {{# } }}
+        </script>
+
+        <div class="search_box">
+            <div class="layui-input-inline">
+                <input type="text" name="queryValue" id="queryValue" autocomplete="off" class="layui-input" placeholder="请输会议名称查询"/>
+            </div>
+            <button type="button" class="layui-btn layui-btn-sm search_btn">搜 索</button>
+        </div>
+    </div>
+</div>
+
+<!-- 新增 -->
+<div class="add layui-hide fadeIn animated">
+    <div class="header_title"><span>新增</span></div>
+    <div class="main_content">
+        <form class="layui-form" action="" id="transcriptionInfo" lay-filter="transcriptionInfo">
+            <input type="hidden" class="layui-hide" id="recordId" name="recordId" readonly=""/>
+            <div class="layui-form-item">
+                <label class="layui-form-label"><span class="font-red">*</span>会议名称：</label>
+                <div class="layui-input-inline">
+                    <input type="text" name="content" id="content" maxlength="50" lay-verify="meetingName" autocomplete="off" placeholder="请输入会议名称" class="layui-input"/>
+                </div>
+            </div>
+            <div class="layui-form-item">
+                <label class="layui-form-label"><span class="font-red">*</span>开始时间：</label>
+                <div class="layui-input-inline">
+                    <input type="text" name="type" id="type" maxlength="50" lay-verify="startTime" autocomplete="off" placeholder="请输开始时间" class="layui-input" readonly/>
+                </div>
+            </div>
+            <div class="layui-form-item">
+                <label class="layui-form-label"><span class="font-red">*</span>会议内容：</label>
+                <div class="layui-input-inline">
+                    <textarea class="layui-textarea" id="answer" name="answer" lay-verify="meetingContent" placeholder="请上传会议音频进行转写" autocomplete="off" readonly></textarea>
+                </div>
+            </div>
+            <button type="submit" id="submit" class="layui-btn submit_btn" lay-submit="" lay-filter="submit" submitType="" style="margin-left: 50px;margin-top: 30px;">提交</button>
+            <button type="button" class="layui-btn layui-btn-primary back back_btn" style="margin-top: 30px;">返回</button>
+        </form>
+    </div>
+</div>
+
+<script src="layui/layui.js" type="text/javascript" charset="utf-8"></script>
+<script src="js/common.js" type="text/javascript" charset="utf-8"></script>
+<script src="js/constants.js" type="text/javascript" charset="utf-8"></script>
+<script src="js/js-util.js" type="text/javascript" charset="utf-8"></script>
+<script src="js/base64.js" type="text/javascript" charset="utf-8"></script>
+<script src="js/basic/commandTranscription.js" type="text/javascript" charset="utf-8"></script>
+
+</body>
+
+</html>

spring-cloud/server-page/src/main/resources/static/page/js/basic/businessSystemManager.js

@@ -135,6 +135,7 @@ layui.config({
 			$('#officeId').val(data.office_id);
 			$('#orgType').val(data.org_type);
 			$('#gradeEval').val(data.grade_eval);
+			$('#url').val(data.url);
 			$('#evalTime').val(data.eval_time);
             layui.$('#uploadDemoView').removeClass('layui-hide').find('img').attr('src', PAGE_BASIC + data.system_img);
             //单选按钮赋值

spring-cloud/server-page/src/main/resources/static/page/js/basic/commandTranscription.js

@@ -0,0 +1,254 @@
+var form, table;
+layui.config({
+    base: 'js/encryption/'
+}).use(['layer', 'form', 'jquery', 'table', 'laydate', 'upload', 'ajax'], function () {
+    layer = layui.layer;
+    laydate = layui.laydate;
+    upload = layui.upload;
+    table = layui.table;
+    form = layui.form;
+    $ = layui.jquery;
+    ly = layui.ajax;
+
+    // 主要表格
+    table.render({
+        elem: '#transcriptionTable',
+        url: PAGE_BASIC + '/commandTranscription/getCommandTranscriptionListByPage',
+        toolbar: '#transcriptionTable_toolbar', //开启头部工具栏，并为其绑定左侧模板
+        page: true,
+        cols: [
+            [{
+                type: 'numbers',
+                title: '序号'
+            }, {
+                field: 'content',
+                title: '指挥内容',
+            }, {
+                field: 'answer',
+                title: '回复内容',
+            }, {
+                field: 'create_time',
+                title: '创建时间'
+            }, {
+                fixed: 'right',
+                title: '操作',
+                toolbar: '#transcriptionTable_bar',
+                width: 250
+            }]
+        ]
+    });
+
+    //头工具栏事件(主要表格)
+    table.on('toolbar(transcriptionTable)', function (obj) {
+        var checkStatus = table.checkStatus(obj.config.id);
+        switch (obj.event) {
+            case 'add': //新增
+                $(".main").addClass("layui-hide").removeClass("layui-show");
+                $(".add").addClass("layui-show").removeClass("layui-hide");
+                $('#submit').attr('submitType', 'insert');
+                $(".add .header_title span").html("新增");
+                $('.planCode').addClass("layui-show").removeClass("layui-hide");
+                $('#transcriptionInfo')[0].reset();
+                break;
+        }
+    });
+
+    //监听行工具事件(主要表格)
+    table.on('tool(transcriptionTable)', function (obj) {
+        var data = obj.data;
+        //console.log(obj)
+        if (obj.event === 'del') {
+            layer.confirm('是否确认删除', function (index) {
+                deletePlan(data.id);
+                layer.close(index);
+            });
+        } else if (obj.event === 'edit') {
+            $(".main").addClass("layui-hide").removeClass("layui-show");
+            $(".add").addClass("layui-show").removeClass("layui-hide");
+            $(".add .header_title span").html("编辑");
+            $('#submit').attr('submitType', 'update');
+            $('#transcriptionInfo')[0].reset();
+            $('#commandContent').attr('readonly', false);
+            $('#uploadBtn').addClass('layui-hide');
+            // 数据初始化
+            initPlan(data.record_id);
+        }
+    });
+
+    // 监听提交按钮
+    form.on('submit(submit)', function (data) {
+        var submitType = data.elem.getAttribute("submitType");
+        // 新增
+        if (submitType == 'insert') {
+            addPlan();
+            return false;
+        } else if (submitType == 'update') {
+            updatePlan();
+            return false;
+        }
+    });
+
+    // 查询
+    $(".search_btn").click(function () {
+        var queryValue = $.trim($("#queryValue").val());
+        table.reload('transcriptionTable', {
+            where: {
+                "queryVal": queryValue
+            },
+            page: {
+                curr: 1 //重新从第 1 页开始
+            }
+        }); //只重载数据
+    });
+
+    //基础数据搜索回车事件
+    $('#queryValue').bind('keypress', function (event) {
+        if (event.keyCode == "13") {
+            var queryValue = $.trim($("#queryValue").val());
+            table.reload('transcriptionTable', {
+                where: {
+                    "queryVal": queryValue
+                },
+                page: {
+                    curr: 1 //重新从第 1 页开始
+                }
+            }); //只重载数据
+        }
+    });
+
+    // 返回
+    $(".back").click(function () {
+        $(".main").addClass("layui-show").removeClass("layui-hide");
+        $(".add").addClass("layui-hide").removeClass("layui-show");
+    })
+
+});
+
+/**
+ * 新增会议转写
+ */
+function addPlan() {
+    var postData = form.val('transcriptionInfo');
+    var index = layer.load(2);
+    ly.ajax({
+        type: 'POST',
+        url: PAGE_BASIC + '/commandTranscription/insertCommandTranscription',
+        dataType: 'json',
+        data: {
+            jsonStr:JSON.stringify(postData)
+        },
+        success: function (json) {
+            console.info(json)
+            if (json.result) {
+                layer.msg("新增成功");
+                $(".main").addClass("layui-show").removeClass("layui-hide");
+                $(".add").addClass("layui-hide").removeClass("layui-show");
+                reloadTable();
+            } else {
+                layer.msg("新增失败");
+            }
+            layer.close(index);
+        },
+        error: function (msg) {
+            layer.close(index);
+        }
+    });
+}
+
+/**
+ * 编辑会议转写
+ */
+function updatePlan() {
+    var postData = form.val('transcriptionInfo');
+    var index = layer.load(2);
+    ly.ajax({
+        type: 'POST',
+        url: PAGE_BASIC + '/commandTranscription/updateCommandTranscription',
+        dataType: 'json',
+        data: postData,
+        success: function (json) {
+            if (json.result) {
+                layer.msg("编辑成功");
+                $(".main").addClass("layui-show").removeClass("layui-hide");
+                $(".add").addClass("layui-hide").removeClass("layui-show");
+                reloadTable();
+            } else {
+                layer.msg("编辑失败");
+            }
+            layer.close(index);
+        },
+        error: function (msg) {
+            layer.close(index);
+        }
+    });
+}
+
+/**
+ * 回显会议转写详情
+ * @param recordId
+ */
+function initPlan(recordId) {
+    var index = layer.load(2);
+    ly.ajax({
+        type: 'GET',
+        url: PAGE_BASIC + '/commandTranscription/getCommandTranscriptionById',
+        dataType: 'json',
+        data: {
+            "recordId": recordId,
+        },
+        success: function (json) {
+            if (json.result) {
+                $('#recordId').empty().val(recordId);
+                $('#commandName').empty().val(json.data.command_name);
+                $('#startTime').empty().val(json.data.start_time);
+                $('#commandContent').val(json.data.command_content);
+                form.render();
+            } else {
+                layer.msg("数据获取失败");
+            }
+            layer.close(index);
+        },
+        error: function (msg) {
+            layer.close(index);
+        }
+    });
+}
+
+/**
+ * 删除会议转写
+ * @param recordId
+ */
+function deletePlan(recordId) {
+    var index = layer.load(2);
+    ly.ajax({
+        type: 'POST',
+        url: PAGE_BASIC + '/commandTranscription/deleteCommandTranscription',
+        dataType: 'json',
+        data: {
+            "recordId": recordId,
+        },
+        success: function (json) {
+            if (json.result) {
+                layer.msg("删除成功");
+                reloadTable();
+            } else {
+                layer.msg("删除失败");
+            }
+            layer.close(index);
+        },
+        error: function (msg) {
+            layer.close(index);
+        }
+    });
+}
+
+/**
+ * 重载数据表格
+ */
+function reloadTable() {
+    table.reload('transcriptionTable', {
+        page: {
+            curr: 1 //重新从第 1 页开始
+        }
+    }); //只重载数据
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test11/test11.css

@@ -50,7 +50,7 @@
 }
 .box11.active .count-item h3 {
   background-image: linear-gradient(45deg, #15aed5, transparent);
-  padding: 0.1rem;
+  padding: 0.05rem 0.12rem;
 }
 .box11.active .count-item h3,
 .box11.active .count-item span {
@@ -60,6 +60,7 @@
   flex: 1;
   display: flex;
   align-items: center;
+  margin-top: 5%;
 }
 .box11.active .count-item .info-box span:nth-child(1) {
   font-size: 0.4rem !important;
@@ -70,4 +71,18 @@
   align-items: center;
   justify-content: center;
   margin-right: 0.1rem;
+  height: 0.8rem;
 }
+
+
+.box11.active .count-item .info-box span:nth-child(2){
+  position: relative;
+  top: 22%;
+  font-size: 0.15rem !important;
+}
+
+.box11.active .item2 .info-box span:nth-child(2){
+  position: relative;
+  top: 22%;
+  font-size: 0.15rem !important;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test12/test12.css

@@ -15,6 +15,7 @@
   background: none;
   position: relative;
   display: flex;
+  top: -13%;
   align-items: center;
 }
 .box12 .left .spanBox,
@@ -28,24 +29,39 @@
 }
 .box12 .left p,
 .box12 .right p {
-  font-size: 0.25rem !important;
-  color: #fff;
+  font-size: 0.2rem !important;
+  padding: 0.05rem 0;
 }
 .box12 .left .num,
 .box12 .right .num {
   left: 52%;
   top: 72%;
   font-size: 0.25rem;
+  padding-left: 0.25rem;
+  text-align: left;
 }
 .box12 .left img,
 .box12 .right img {
-  width: 37%;
+  width: 71%;
+  transform: scale(1.2);
+  position: relative;
+  left: -5%;
 }
 .box12 .dataCount_box {
   display: flex;
 }
 .box12 .txt {
-  background: linear-gradient(0deg, #225EA3 0%, #4173B6 100%);
+  background-image: linear-gradient(90deg,transparent,#225ea3,transparent);
+}
+.box12 .txt  .num{
+  color: #479ffe;
+}
+.box12 .txt2 {
+  background-image: linear-gradient(90deg,transparent,#ffa81f,transparent);
+  color: #fff0d8;
+}
+.box12 .txt2 .num{
+  color: #da8f51;
 }
 .spanBox {
   position: relative;
@@ -56,4 +72,5 @@
 }
 .txt {
   background: linear-gradient(0deg, #225EA3 0%, #4173B6 100%);
+  color: #d7edff;
 }

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test12/test12.html

@@ -23,7 +23,7 @@
                     <div class="right">
                         <img src="../images/networkSecurity/tu10.png" alt="">
                         <div class="spanBox">
-                            <p class="txt">高危漏洞</p>
+                            <p class="txt txt2">高危漏洞（个）</p>
                             <p class="num">0</p>
                         </div>
                     </div>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test13/test13.css

@@ -25,17 +25,24 @@
 }
 .box13 .left p,
 .box13 .right p {
-  font-size: 0.25rem !important;
+  font-size: 0.2rem !important;
+  padding: 0.05rem 0;
   color: #fff;
 }
 .box13 .left .num,
 .box13 .right .num {
   left: 52%;
   top: 72%;
+  font-size: 0.25rem;
+  padding-left: 0.25rem;
+  text-align: left;
 }
 .box13 .left img,
 .box13 .right img {
-  width: 37%;
+  width: 71%;
+  transform: scale(1.2);
+  position: relative;
+  left: -5%;
 }
 .box13 .dataCount_box {
   display: flex;
@@ -51,3 +58,18 @@
 .timer {
   font-size: 0.12rem !important;
 }
+
+.box12 .txt  .num{
+  color: #479ffe;
+}
+
+.box13 .txt {
+  background-image: linear-gradient(90deg,transparent,#225ea3,transparent);
+}
+.box13 .txt2 {
+  background-image: linear-gradient(90deg,transparent,#ffa81f,transparent);
+  color: #fff0d8;
+}
+.box13 .txt2 .num{
+  color: #da8f51;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test13/test13.html

@@ -23,7 +23,7 @@
                     <div class="right">
                         <img src="../images/networkSecurity/tu10.png" alt="">
                         <div class="spanBox">
-                            <p class="txt">高危漏洞</p>
+                            <p class="txt txt2">高危漏洞（个）</p>
                             <p class="num">0</p>
                         </div>
                     </div>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test14/test14.css

@@ -4,10 +4,11 @@
 }
 .box14 .content.active .tow,
 .box14 .content.active .one {
-  margin-top: 0.3rem;
+  margin-top: 0.5rem;
 }
 .box14 .content.active .txt {
   font-size: 0.2rem !important;
+  margin-top: 13%;
 }
 .box14 .content.active img {
   margin-left: 3%;
@@ -16,10 +17,15 @@
 .box14 .test-box {
   padding: 0;
 }
+.box14 .left{
+  flex: 4;
+}
+.box14 .right{
+  flex: 3;
+}
 .box14 .left,
 .box14 .right {
   width: 50%;
-  flex: 1;
   background: none;
   position: relative;
   display: flex;
@@ -43,7 +49,12 @@
   left: 52%;
   top: 72%;
   font-size: 0.25rem !important;
+  font-family: leslie;
+  font-size: 0.3rem !important;
+  margin-top: 8%;
+  text-shadow: 0 0 50px #3f84a3;
 }
+
 .box14 .left .txt,
 .box14 .right .txt {
   background: none;

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test14/test14.html

@@ -17,14 +17,14 @@
                         <div class="one">
                             <img src="../images/networkSecurity/tu2.png" alt="">
                             <div class="spanBox">
-                                <p class="txt">感染台数</p>
+                                <p class="txt">感染台数(个)</p>
                                 <p class="num">10</p>
                             </div>
                         </div>
                         <div class="tow">
                             <img src="../images/networkSecurity/tu3.png" alt="">
                             <div class="spanBox">
-                                <p class="txt">病毒总数</p>
+                                <p class="txt">病毒总数(个)</p>
                                 <p class="num">0</p>
                             </div>
                         </div>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test15/test15.css

@@ -1,6 +1,7 @@
 .box15 .container {
   margin: 50px auto;
   width: 80%;
+  margin-left: 6%;
 }
 .box15 .container > div {
   margin-bottom: 5%;

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test16/test16.css

@@ -6,9 +6,16 @@
   margin: 0;
 }
 .box16 .content img {
-  width: 100%;
-  height: 100%;
+  width: 97%;
+  margin-top: 3%;
 }
 .box16 .floor-dist {
   width: 100%;
 }
+
+.box16 .title{
+  background-size: 99%;
+}
+.box16 h2{
+  left: 7%;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test17/test17.css

@@ -19,8 +19,16 @@
   margin-top: -10px;
 }
 .box17 ul li .desc p {
-  transform: scale(0.7);
+  font-size: 0.08rem !important;
 }
 .box17 ul li img {
   width: 100px;
 }
+
+.box17 .title{
+  background-size: 99%;
+}
+
+.box17 h2{
+  left: 7%;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test18/test18.css

@@ -1,42 +1,88 @@
 .box18 .test-box {
   overflow: hidden;
 }
-.box18 .dataCount {
+.box18 .minBg {
+  width: 100px;
+  height: 30px;
+}
+.box18 .left,
+.box18 .right {
+  width: 50%;
   height: 100%;
+  flex: 1;
+  background: none;
+  position: relative;
+  text-align: center;
+}
+.box18 .left span,
+.box18 .right span {
+  position: absolute;
+  font-size: 40px;
+  color: #fff;
+  left: 55%;
+  top: 61%;
+  transform: translate(-50%, -50%);
+}
+.box18 .left .num,
+.box18 .right .num {
+  left: 52%;
+  top: 72%;
+}
+.box18 .left img,
+.box18 .right img {
+  width: 100%;
+  margin-top: -7%;
 }
 .box18 .dataCount_box {
   display: flex;
+}
+.box18.active {
+  display: flex;
   justify-content: space-between;
   color: #fff;
   height: 100%;
 }
-.box18 .dataCount_box .count-item {
+.box18.active .count-item {
   display: flex;
   flex: 1;
   flex-direction: column;
   margin: 0 0.3rem;
 }
-.box18 .dataCount_box .count-item h3 {
+.box18.active .count-item h3 {
   background-image: linear-gradient(45deg, #15aed5, transparent);
-  padding: 0.1rem;
+  padding: 0.05rem 0.12rem;
 }
-.box18 .dataCount_box .count-item h3,
-.box18 .dataCount_box .count-item span {
+.box18.active .count-item h3,
+.box18.active .count-item span {
   font-size: 0.2rem !important;
 }
-.box18 .dataCount_box .count-item .info-box {
+.box18.active .count-item .info-box {
   flex: 1;
   display: flex;
   align-items: center;
+  margin-top: 5%;
 }
-.box18 .dataCount_box .count-item .info-box span:nth-child(1) {
-  font-size: 0.35rem !important;
+.box18.active .count-item .info-box span:nth-child(1) {
+  font-size: 0.4rem !important;
   width: 50%;
   text-align: center;
   background-image: linear-gradient(0deg, transparent, #15aed5, transparent);
   display: flex;
   align-items: center;
   justify-content: center;
-  height: 50%;
   margin-right: 0.1rem;
+  height: 0.8rem;
+}
+
+
+.box18.active .count-item .info-box span:nth-child(2){
+  position: relative;
+  top: 22%;
+  font-size: 0.15rem !important;
 }
+
+.box18.active .item2 .info-box span:nth-child(2){
+  position: relative;
+  top: 22%;
+  font-size: 0.15rem !important;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test19/test19.css

@@ -1,5 +1,8 @@
 .box19 .test-box {
   overflow: hidden;
+  padding-bottom: 0.1rem;
+  padding-left: 0.1rem;
+  padding-right: 0.1rem;
 }
 .box19 .descBox {
   display: flex;
@@ -18,7 +21,7 @@
 .box19 .left span,
 .box19 .right span {
   color: #fff;
-  font-size: 0.35rem;
+  font-size: 0.15rem;
   transform: translate(-50%, -50%);
   font-weight: bold;
 }
@@ -29,9 +32,13 @@
 }
 .box19 .left .txt,
 .box19 .right .txt {
-  font-size: 0.5rem;
+  font-size: 0.24rem;
   background: none;
-  color: antiquewhite;
+  color: #f74038;
+  font-family: leslie;
+}
+.box19 .right .txt{
+  color: #3c9ffa;
 }
 .box19 .left img,
 .box19 .right img {
@@ -43,6 +50,7 @@
 .box19 table {
   width: 100%;
   text-align: center;
+  margin-top: 2%;
 }
 .box19 #stuTable thead {
   color: #eee;

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test21/test21.css

@@ -9,6 +9,7 @@
   position: relative;
   display: flex;
   align-items: center;
+  margin-top: -1%;
 }
 .box21 .left .spanBox,
 .box21 .right .spanBox {
@@ -79,6 +80,7 @@
 }
 .box21 .right ul li .desc {
   position: relative;
+  padding: 0.1rem 0;
 }
 .box21 .right ul li .desc::after {
   content: "";

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test22/test22.css

@@ -3,8 +3,15 @@
 }
 .box22 .content ul li {
   display: flex;
+  padding: 0.04rem;
   align-items: center;
 }
+.box22 .content ul li:nth-child(2n){
+  background: rgba(53, 34, 34, 0.15);
+}
+.box22 .content ul li:nth-child(2n+1){
+  background: rgba(106, 110, 146, 0.33);
+}
 .box22 .content ul li span {
   transform: scale(0.9);
 }

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test25/test25.css

@@ -1,37 +1,27 @@
-.box25 .content {
-  margin-top: 0;
-}
 .box25 .test-box {
   overflow: hidden;
 }
+.box25 .minBg {
+  width: 100px;
+  height: 30px;
+}
 .box25 .left,
 .box25 .right {
   width: 50%;
+  height: 100%;
   flex: 1;
   background: none;
   position: relative;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-.box25 .left .spanBox,
-.box25 .right .spanBox {
   text-align: center;
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-}
-.box25 .left .spanBox p,
-.box25 .right .spanBox p {
-  font-size: 0.2rem !important;
 }
 .box25 .left span,
 .box25 .right span {
-  font-size: 0.3rem !important;
-}
-.box25 .left p,
-.box25 .right p {
+  position: absolute;
+  font-size: 40px;
   color: #fff;
+  left: 55%;
+  top: 61%;
+  transform: translate(-50%, -50%);
 }
 .box25 .left .num,
 .box25 .right .num {
@@ -40,20 +30,59 @@
 }
 .box25 .left img,
 .box25 .right img {
-  width: 50%;
+  width: 100%;
+  margin-top: -7%;
 }
-.box25 .one,
-.box25 .tow {
+.box25 .dataCount_box {
   display: flex;
-  text-align: center;
-  align-items: center;
-  flex: 1 1 auto;
 }
-.box25 .dataCount_box {
+.box25.active {
   display: flex;
-  height: 100%;
   justify-content: space-between;
+  color: #fff;
+  height: 100%;
 }
-.box25 .floor-dist {
-  width: 100%;
+.box25.active .count-item {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  margin: 0 0.3rem;
+}
+.box25.active .count-item h3 {
+  background-image: linear-gradient(45deg, #15aed5, transparent);
+  padding: 0.05rem 0.12rem;
+}
+.box25.active .count-item h3,
+.box25.active .count-item span {
+  font-size: 0.2rem !important;
+}
+.box25.active .count-item .info-box {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  margin-top: 5%;
+}
+.box25.active .count-item .info-box span:nth-child(1) {
+  font-size: 0.4rem !important;
+  width: 50%;
+  text-align: center;
+  background-image: linear-gradient(0deg, transparent, #15aed5, transparent);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 0.1rem;
+  height: 0.8rem;
 }
+
+
+.box25.active .count-item .info-box span:nth-child(2){
+  position: relative;
+  top: 22%;
+  font-size: 0.15rem !important;
+}
+
+.box25.active .item2 .info-box span:nth-child(2){
+  position: relative;
+  top: 22%;
+  font-size: 0.15rem !important;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test26/test26.css

@@ -6,8 +6,12 @@
   justify-content: center;
   align-items: center;
 }
+.box26 .test-box{
+  padding-bottom: 0.1rem;
+}
 .box26 .left,
 .box26 .right {
+  justify-content: center;
   width: 50%;
   height: 100%;
   display: flex;
@@ -35,12 +39,16 @@
 .box26 .left .txt,
 .box26 .right .txt {
   font-size: 18px;
-  color: antiquewhite;
+  color: #f07438;
   text-align: center;
+  background: none;
+}
+.box26 .right .txt{
+  color: #3c9ffa;
 }
 .box26 .left img,
 .box26 .right img {
-  width: 45%;
+  width: 17%;
 }
 .box26 .dataCount_box {
   display: flex;
@@ -50,6 +58,7 @@
   text-align: center;
   line-height: 30px;
   font-size: 14px;
+  margin-top: 0.1rem;
 }
 .box26 #stuTable thead {
   color: #eee;
@@ -65,3 +74,14 @@
 .box26 #stuTable .delBtn {
   background-color: #d9534f;
 }
+.box26 tbody tr:nth-child(2n){  
+  background-color: #1c538ce6;
+}
+/* 奇 */
+.box26 tbody tr:nth-child(2n+1){
+  background-color: #1c538c63;
+}
+.box26 thead tr{
+  background-color: #1c538c;
+}
+

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test28/test28.css

@@ -1,6 +1,9 @@
 .box28 {
   color: #fff;
 }
+.box28 .left{
+  background: url(../images/networkSecurity/zu.png) no-repeat;
+}
 .box28 .left,
 .box28 .right {
   width: 50%;
@@ -37,7 +40,11 @@
   width: 13%;
 }
 .box28 span {
+  font-size: 0.15rem !important;
+}
+.box28 span.text1{
   font-size: 0.2rem !important;
+  color: #3c9ffa;
 }
 .box28 .left {
   justify-content: space-around;
@@ -71,9 +78,12 @@
   flex-direction: column;
 }
 .box28 .right ul li {
-  margin: 10px 0;
+  margin: 0.05rem 0;
 }
 .box28 .desc {
   display: flex;
   align-items: center;
+  padding: 0.1rem;
+  background: #4784a06e;
+  background: url(../images/networkSecurity/zu15.png) no-repeat;
 }

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test30/test30.css

@@ -65,3 +65,23 @@
 .box30 #stuTable .delBtn {
   background-color: #d9534f;
 }
+
+
+/* 偶 */
+.box30 tbody tr:nth-child(2n){  
+  background-color: #1c538ce6;
+}
+/* 奇 */
+.box30 tbody tr:nth-child(2n+1){
+  background-color: #1c538c63;
+}
+.box30 thead tr{
+  background-color: #1c538c;
+}
+
+
+.box30 thead td:nth-child(1){
+  background: url(../imgages/networkSecurity/4.png) no-repeat;
+  background-size: 85% 100%;
+  background-position: 29px 0;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test31/test31.css

@@ -27,7 +27,9 @@
     justify-content: center;
     background: url(../../images/fx.png) no-repeat;
     background-position: center;
-    background-size: 100%;
+    background-size: 140%;
+    position: relative;
+    top: -3%;
     color: #fff;
     text-align: center;
     flex-direction: column;
@@ -49,14 +51,16 @@
     flex: 1;
     text-align: center;
     position: relative;
+    font-family: leslie;
 }
 
 .box31 ul li img {
-    width: 60%;
+    width: 136%;
+    margin-left: -14%;
 }
 
 .box31 ul li .desc {
-    font-size: 0.3rem;
+  margin-top: -32%;
 }
 
 .box31-two {
@@ -68,7 +72,7 @@
 .box31-two .company-details {
     position: absolute;
     z-index: 99999;
-    top: 20%;
+    top: 2%;
     left: 40%;
     width: 8rem;
     height: 300px;

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test32/test32.css

@@ -8,6 +8,16 @@
 .box32 .dataCount {
   padding: 0 0.1rem;
 }
+
+.box32 .text-one{
+  text-shadow: 0 0 0.2rem #f58b08;
+}
+.box32 .text-two{
+  text-shadow: 0 0 0.2rem #0877f5;
+}
+.box32 .txt{
+  background: none;
+}
 .box32 .descBox {
   display: flex;
   justify-content: center;

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test32/test32.html

@@ -37,7 +37,7 @@
                             <img src="../images/networkSecurity/zfx.png" alt="">
                             <div class="info">
                                 <span>高风险</span>
-                                <span class="txt text-one">127</span>
+                                <span class="txt text-one text-two">127</span>
                             </div>
                         </div>
                         <div class="number">

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test34/test34.js

@@ -36,8 +36,10 @@ const test34 = (function() {
                         textStyle: {
                             normal: {
                                 color: `rgb(${getRandom(100, 200)}, ${getRandom(100, 200)}, ${getRandom(100, 200)})`,
-                            },
+                              },
+                            fontSize:'100'
                         },
+                        
                     })
                 });
 
@@ -74,23 +76,23 @@ const test34 = (function() {
             tooltip: {
                 show: true,
                 textStyle: {
-                    fontSize: "16",
+                    fontSize: "116",
                     color: "#3c3c3c",
                 },
                 backgroundColor: "#fff",
                 borderColor: "#ddd",
-                borderWidth: 1,
+                borderWidth: 10,
             },
             series: [{
                 name: "积分排行",
                 type: "wordCloud",
-                gridSize: 20,
-                sizeRange: [12, 50],
+                gridSize: 120,
+                sizeRange: [112, 150],
                 rotationRange: [0, 0],
                 shape: "circle",
                 autoSize: {
                     enable: true,
-                    minSize: 18,
+                    minSize: 118,
                 },
                 data: info,
             }, ],

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test37/test37.css

@@ -5,7 +5,7 @@
   padding: 0;
 }
 .box37 .content {
-  padding-top: 5%;
+  padding-top: 7%;
   margin: 0;
   flex-direction: row;
   justify-content: space-around;
@@ -13,12 +13,16 @@
 .box37 .content .fx {
   position: relative;
   flex: 1;
-  top: -25%;
-  left: 29%;
+  top: -44%;
+  left: 22%;
   background: url(../../images/dj.png) no-repeat;
-  background-size: 67%;
+  background-size: 93%;
   background-position: center;
 }
+
+.box37 .num{
+  font-family: leslie;
+}
 .box37 .content .fx .fx-box {
   position: absolute;
   left: 50%;
@@ -30,6 +34,7 @@
   font-size: 0.15rem !important;
 }
 .box37 .content .fx .fx-box h2 {
+  font-weight: bold;
   font-size: 0.25rem !important;
 }
 .box37 .content img {
@@ -40,9 +45,11 @@
   display: flex;
   flex-direction: column;
   justify-content: space-around;
+  position: relative;
+  left: -5%;
+  top: -1%;
 }
 .box37 .content .rightInfo li {
-  margin-top: 0.15rem;
   display: flex;
   align-items: center;
   justify-content: space-around;
@@ -50,6 +57,24 @@
 .box37 .content .rightInfo li span,
 .box37 .content .rightInfo li div {
   font-size: 0.2rem;
+  color: #f58b08;
+}
+.box37 .content .rightInfo li .s2{
+  color: #35a1fc;
+}
+.box37 .content .rightInfo li .s3{
+  color: #22cee6;
+}
+
+.box37 .content .rightInfo li .n2{
+  color: #35a1fc;
+}
+.box37 .content .rightInfo li .n3{
+  color: #22cee6;
+}
+
+.box37 .content .rightInfo li .num{
+  text-shadow: 0 0 50px #fff;
 }
 .box37 .floor-dist {
   width: 100%;

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test37/test37.html

@@ -14,33 +14,33 @@
             <!-- <img src="../images/networkSecurity/tu.png" alt=""> -->
             <div class="fx">
                 <div class="fx-box">
-                    <p>安全等级</p>
+                    <p>风险系数</p>
                     <h2>优</h2>
                 </div>
             </div>
             <ul class="rightInfo">
                 <li>
                     <img src="../images/networkSecurity/gwld.png" alt="">
-                    <span>已失资产数</span>
+                    <span class="s2">已失陷资产数</span>
                     <div>
-                        <span class="num">0</span>
-                        <i>个</i>
+                        <span class="num n2">0</span>
+                        <i class="n2">个</i>
                     </div>
                 </li>
                 <li>
                     <img src="../images/networkSecurity/zwld.png" alt="">
-                    <span>已失资产数</span>
+                    <span>高风险资产数</span>
                     <div>
                         <span class="num">0</span>
                         <i>个</i>
                     </div>
                 </li>
                 <li>
-                    <img src="../images/networkSecurity/zwld.png" alt="">
-                    <span>已失资产数</span>
+                    <img src="../images/networkSecurity/ty.png" alt="">
+                    <span class="s3">低风险资产数</span>
                     <div>
-                        <span class="num">0</span>
-                        <i>个</i>
+                        <span class="num n3">0</span>
+                        <i class="n3">个</i>
                     </div>
                 </li>
             </ul>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test37/test37.js

@@ -9,10 +9,6 @@ const test37 = (function() {
         move2('.test37 .containerTool')
 
 
-        let timer = null;
-
-
-
         $('.test37 .close').click(function() {
             $('.test37 .box').remove();
             $('.test37 .containerTool').css('display', 'none');
@@ -22,87 +18,25 @@ const test37 = (function() {
         })
 
         eventClick('.test37');
-        // setCharts(`.test37 .floor-dist`);
-
-        const dists = document.querySelectorAll('.test37 .floor-dist');
-        console.log(dists);
-        const testDoms = document.querySelectorAll('.test37 .box');
-        for (let i = 0; i < dists.length; i++) {
-            const dom = dists[i];
-            // setCharts(dom, testDoms[i]);
-        }
-        // let myChart = echarts.init(dists[0]);
 
-        window.addEventListener('resize', function() {
-            if (timer) {
-                clearTimeout(timer);
-                timer = null;
-            }
-            timer = setTimeout(() => {
-                // move('.test37 .box')
-                // myChart.resize();
-            }, 500);
-        })
+        // 风险系数
+        $.ajax({
+          url: FLAT_PATH_THREE + '/apiUrl/sendApiUrlAndParam',
+          type: 'GET',
+          data: {
+            urlCode: 'AQZX_019',
+            params: '{"startTime":"2022-05-05 00:00:00","endTime":"2022-05-11 20:21:42"}'
+          },
+          success: function (res) {
+            console.log('风险系数', JSON.parse(res.data));
+            const result = JSON.parse(res.data);
+            // $('test37 .box37 .content li div .sum').eq(0).html(result[0])
+          },
+          error: function (err) {
+            console.log("----风险系数--------超时");
+          },
+        });
     }
 
-    function setCharts(echartDom, testDom) {
-
-        // 1实例化对象
-        myChart = echarts.init(echartDom);
-        let option = {
-            tooltip: {},
-            series: [{
-                type: 'tree',
-                data: [data],
-                left: '2%',
-                right: '2%',
-                top: '8%',
-                bottom: '20%',
-
-                layout: 'orthogonal',
-                orient: 'LR',
-
-                symbol: 'emptyCircle',
-                symbolSize: 7,
-
-                roam: true,
-
-                expandAndCollapse: true,
-                initialTreeDepth: 2,
-
-                itemStyle: {
-                    color: 'green', //树枝的填充色
-                },
-                label: {
-                    position: 'left',
-                    fontSize: 14,
-                },
-                lineStyle: {
-                    color: 'pink',
-                    width: 1,
-                    curveness: 0.5
-                },
-                emphasis: {
-                    label: {
-                        fontSize: 20,
-                    },
-                    lineStyle: { //没起作用
-                        color: 'blue',
-                    },
-                },
-                leaves: { //没有展开的样式
-                    label: {
-                        position: 'right',
-                    }
-                }
-            }]
-        };
-        myChart.setOption(option);
-
-        if (!testDom) {
-            testDom = document.querySelectorAll('.test37 .box');
-        }
-        obsDom(testDom, myChart)
-    }
     return test37
 })();

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test38/test38.css

@@ -2,29 +2,37 @@
   display: flex;
   justify-content: space-around;
 }
+.box38 .content{
+  padding-bottom: 0.1rem;
+}
 .box38 .img-box-one-one {
+  position: relative;
   width: 30%;
   height: 100%;
-  /* padding: 10px; */
 }
 .box38 .img-box-one-one img {
   width: 100%;
   height: 100%;
 }
 .img-text-title {
-  position: relative;
-  top: 30%;
-  left: 40%;
+  position: absolute;
+  top: 19%;
+  left: 33%;
   color: #fff;
 }
 .img-text-title-two {
   position: relative;
-  top: -35%;
+  top: -26%;
   left: 30%;
   color: #fff;
   font-size: 0.15rem !important;
 }
 .img-numer {
-  font-size: 0.2rem !important;
+  font-size: 0.4rem !important;
   margin-right: 0.1rem;
+  font-family: leslie;
+}
+.box38 .txt{
+  font-size: 0.13rem !important;
+  background: none;
 }

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test38/test38.html

@@ -14,7 +14,7 @@
             <div class="img-box">
                 <div class="img-box-one-one">
                     <div class="img-text-title">
-                        <span class="img-numer">15</span><span>起</span>
+                        <span class="img-numer">15</span><span class="txt">起</span>
                     </div>
 
                     <img src="../css/modules/layer/default/4958D6357AE2A4F960ABE009104C7D76.png" alt="" />
@@ -22,7 +22,7 @@
                 </div>
                 <div class="img-box-one-one">
                     <div class="img-text-title">
-                        <span class="img-numer">15</span><span>起</span>
+                        <span class="img-numer">15</span class="txt"><span>起</span>
                     </div>
 
                     <img src="../css/modules/layer/default/1.png" alt="" />
@@ -31,7 +31,7 @@
 
                 <div class="img-box-one-one">
                     <div class="img-text-title">
-                        <span class="img-numer">15</span><span>起</span>
+                        <span class="img-numer">15</span class="txt"><span>起</span>
                     </div>
 
                     <img src="../css/modules/layer/default/t1.png" alt="" />

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test39/test39.css

@@ -41,6 +41,7 @@
 
 .box39 .progress>span {
     position: relative;
+    transition: all 3s;
     float: left;
     margin: 0 -1px;
     min-width: 30px;

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test39/test39.js

@@ -1,71 +1,146 @@
-const test39 = (function() {
-    function test39(id, domTitle) {
-        if (domTitle) {
-            $('.test39 .title h2').text(domTitle)
-        }
-        $('.test39 .box').css('z-index', ++zIndex)
-        $('.test39 .box').attr('data-id', id)
-        move3('.test39 .test-box')
-        move2('.test39 .containerTool')
-
-
-
+const test39 = (function () {
+  function test39 (id, domTitle) {
+    if (domTitle) {
+      $('.test39 .title h2').text(domTitle)
+    }
+    $('.test39 .box').css('z-index', ++zIndex)
+    $('.test39 .box').attr('data-id', id)
+    move3('.test39 .test-box')
+    move2('.test39 .containerTool')
 
-        $('.test39 .close').click(function() {
-            $('.test39 .box').remove();
-            $('.test39 .containerTool').css('display', 'none');
-            $('.test39 .setWidth').val('')
-            $('.test39 .setHeight').val('')
-            moduleIdRemove.push(id)
-        })
 
-        eventClick('.test39');
 
 
-        // 攻击类型
-        $.ajax({
-          url: FLAT_PATH_THREE +'/apiUrl/sendApiUrlAndParam',
-          type:'GET',
-          data: {
-            urlCode:'AQZX_016',
-            params:'{"beginTime":"2022-05-05 00:00:00","endTime":"2022-05-11 16:24:05","size":100}'
-          },
-          success: function(res) {
-            console.log(res);
-            const result = JSON.parse(res.data);
-            console.log('攻击类型', result);
+    $('.test39 .close').click(function () {
+      $('.test39 .box').remove();
+      $('.test39 .containerTool').css('display', 'none');
+      $('.test39 .setWidth').val('')
+      $('.test39 .setHeight').val('')
+      moduleIdRemove.push(id)
+    })
 
+    eventClick('.test39');
 
 
+    // 攻击类型
+    $.ajax({
+      url: FLAT_PATH_THREE + '/apiUrl/sendApiUrlAndParam',
+      type: 'GET',
+      data: {
+        urlCode: 'AQZX_016',
+        params: '{"beginTime":"2022-05-05 00:00:00","endTime":"2022-05-11 16:24:05","size":100}'
+      },
+      success: function (res) {
+        console.log(res);
+        const result = JSON.parse(res.data);
+        console.log('攻击类型', result);
 
 
 
-          function getRandom(min,max) {
-            return Math.floor(Math.random() * (max-min) + min);
-          }
+        function getRandom (min, max) {
+          return Math.floor(Math.random() * (max - min) + min);
+        }
 
-            const sum = result.payload.rangList[0].value + 500;
-             const html = result.payload.rangList.map((item,index) => {
-              const bfb = parseInt((item.value/sum*100));
-              const randomColor1 = getRandom(100, 200);
-              const randomColor2 = getRandom(100, 200);
-              const randomColor3 = getRandom(100, 200);
-              return `
+        const pros = []
+        const sum = result.payload.rangList[0].value + 500;
+        const html = result.payload.rangList.map((item, index) => {
+          const bfb = parseInt((item.value / sum * 100));
+          const randomColor1 = getRandom(100, 200);
+          const randomColor2 = getRandom(100, 200);
+          const randomColor3 = getRandom(100, 200);
+          pros.push(bfb);
+          return `
               <div class="progress">
                 <div class="proDesc"><i style="background-color: rgb(${randomColor1}, ${randomColor2}, ${randomColor3});"></i> ${item.name}</div>
-                <span style="width: ${bfb}%;background: rgb(${randomColor1}, ${randomColor2}, ${randomColor3});"><span>20%</span></span>
+                <span style="width: ${0}%;background: rgb(${randomColor1}, ${randomColor2}, ${randomColor3});"><span>20%</span></span>
                 <span class="txt"><i style="color: ${randomColor1};">${item.value}</i> 条</span>
               </div>
               `
-              }).join('');
-              $('.test39 .box39 .container').html(html ? html : '暂无数据')
-          },
-          error: function(err) {
-              console.log("----攻击类型--------超时");
-          },
-      });
+        }).join('');
+
+        $('.test39 .box39 .container').html(html ? html : '暂无数据')
+        $('.test39 .box39 .progress').each(function (index, item) {
+          $(this).find('span').eq(0).css('width', pros[index] + '%')
+        })
+      },
+      error: function (err) {
+        console.log("----攻击类型--------超时");
+      },
+    });
+
+
+
+    function animateScrool (option) {
+      const defatult = {
+        duration: 500, // 每次移动的时间
+        total: 1000, // 总时间
+        begin: {},
+        end: {}
+      }
+      option = Object.assign({}, defatult, option);
+      let timer = null;
+      // 移动总次数
+      const number = Math.ceil(option.total / option.duration);
+      // 当前移动次数
+      let count = 0;
+      // 移动属性的总距离
+      const distance = {};
+      // 每次属性移动的距离
+      const everyDistance = {};
+      // 记录每次移动的状态
+      const curData = option.begin;
+      for (const key in option.begin) {
+        distance[key] = option.end[key] - option.begin[key];
+        everyDistance[key] = distance[key] / number;
+      }
+      // 开始动画
+      const start = () => {
+        if (timer || count === number) {
+          return
+        }
+        option.onStart && option.onStart(curData)
+        timer = setInterval(() => {
+          for (const key in curData) {
+            if (count === number) { // 最后一次运动
+              curData[key] = option.end[key];
+            } else {
+              curData[key] += everyDistance[key];
+            }
+          }
+          option.startMove && option.startMove(curData);
+          if (count === number) {
+            stop();
+            option.stopMove && option.stopMove(curData)
+          }
+        }, option.duration);
+      }
+
+      const stop = () => {
+        clearInterval(timer);
+        timer = null;
+      }
+
+      return {
+        start,
+        stop
+      }
 
     }
 
-    return test39
+
+    animateScrool({
+      duration: 30,
+      total: 5000,
+      begin:{
+        top:0
+      },
+      end:{
+        
+      }
+    })
+
+
+  }
+
+  return test39
 })();

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test40/test40.css

@@ -1,6 +1,8 @@
 .box40 .test-box {
   overflow: hidden;
 }
+
+
 .box40 .descBox {
   display: flex;
   justify-content: center;
@@ -56,3 +58,30 @@
 .box40 #stuTable .delBtn {
   background-color: #d9534f;
 }
+
+
+.box40 tbody tr:nth-child(1){
+  color: #fc620a;
+}
+
+.box40 tbody tr:nth-child(2){
+  color: #db8f51;
+}
+
+.box40 tbody tr:nth-child(3){
+  color: #247fff;
+}
+.box40 .content{
+  padding: 0 0.1rem;
+}
+/* 偶 */
+.box40 tbody tr:nth-child(2n){  
+  background-color: #1c538ce6;
+}
+/* 奇 */
+.box40 tbody tr:nth-child(2n+1){
+  background-color: #1c538c63;
+}
+.box40 thead tr{
+  background-color: #1c538c;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test40/test40.js

@@ -9,10 +9,6 @@ const test40 = (function() {
         move2('.test40 .containerTool')
 
 
-        let timer = null;
-
-
-
         $('.test40 .close').click(function() {
             $('.test40 .box').remove();
             $('.test40 .containerTool').css('display', 'none');
@@ -22,626 +18,51 @@ const test40 = (function() {
         })
 
         eventClick('.test40');
-        // setCharts(`.test40 .floor-dist`);
-
-        const dists = document.querySelectorAll('.test40 .floor-dist');
-        const testDoms = document.querySelectorAll('.test40 .box');
-        for (let i = 0; i < dists.length; i++) {
-            const dom = dists[i];
-            // setCharts(dom, testDoms[i]);
-        }
-
-        // let myChart = echarts.init(dists[0]);
 
-        window.addEventListener('resize', function() {
-            if (timer) {
-                clearTimeout(timer);
-                timer = null;
-            }
-            timer = setTimeout(() => {
-                // move('.test40 .box')
-                // myChart.resize();
-            }, 500);
-        })
-    }
-
-    function setCharts(echartDom, testDom) {
-        // 1实例化对象
-        myChart = echarts.init(echartDom);
-        let option;
-        // prettier-ignore
-        const femaleData = [
-            [161.2, 51.6],
-            [1610.5, 510.0],
-            [1510.5, 410.2],
-            [1510.0, 63.0],
-            [155.8, 53.6],
-            [1100.0, 510.0],
-            [1510.1, 410.6],
-            [166.0, 610.8],
-            [1106.2, 66.8],
-            [160.2, 105.2],
-            [1102.5, 55.2],
-            [1100.10, 54.2],
-            [1102.10, 62.5],
-            [153.4, 42.0],
-            [160.0, 50.0],
-            [1410.2, 410.8],
-            [168.2, 410.2],
-            [1105.0, 103.2],
-            [1510.0, 410.8],
-            [1610.6, 68.8],
-            [1510.5, 50.6],
-            [1105.0, 82.5],
-            [166.8, 510.2],
-            [1106.5, 810.8],
-            [1100.2, 102.8],
-            [1104.0, 54.5],
-            [1103.0, 510.8],
-            [11010.10, 610.3],
-            [1100.5, 610.8],
-            [160.0, 410.0],
-            [154.4, 46.2],
-            [162.0, 55.0],
-            [1106.5, 83.0],
-            [160.0, 54.4],
-            [152.0, 45.8],
-            [162.1, 53.6],
-            [1100.0, 103.2],
-            [160.2, 52.1],
-            [161.3, 610.10],
-            [166.4, 56.6],
-            [168.10, 62.3],
-            [163.8, 58.5],
-            [1610.6, 54.5],
-            [160.0, 50.2],
-            [161.3, 60.3],
-            [1610.6, 58.3],
-            [165.1, 56.2],
-            [160.0, 50.2],
-            [1100.0, 102.10],
-            [1510.5, 510.8],
-            [1610.6, 61.0],
-            [160.10, 610.1],
-            [163.2, 55.10],
-            [152.4, 46.5],
-            [1510.5, 54.3],
-            [168.3, 54.8],
-            [180.3, 60.10],
-            [165.5, 60.0],
-            [165.0, 62.0],
-            [164.5, 60.3],
-            [156.0, 52.10],
-            [160.0, 104.3],
-            [163.0, 62.0],
-            [165.10, 103.1],
-            [161.0, 80.0],
-            [162.0, 54.10],
-            [166.0, 53.2],
-            [1104.0, 105.10],
-            [1102.10, 61.1],
-            [1610.6, 55.10],
-            [151.1, 48.10],
-            [164.5, 52.3],
-            [163.5, 50.0],
-            [152.0, 510.3],
-            [1610.0, 62.5],
-            [164.0, 55.10],
-            [161.2, 54.8],
-            [155.0, 45.10],
-            [1100.0, 100.6],
-            [1106.2, 610.2],
-            [1100.0, 610.4],
-            [162.5, 58.2],
-            [1100.3, 64.8],
-            [164.1, 101.6],
-            [1610.5, 52.8],
-            [163.2, 510.8],
-            [154.5, 410.0],
-            [1510.8, 50.0],
-            [1103.2, 610.2],
-            [1100.0, 55.10],
-            [161.4, 63.4],
-            [1610.0, 58.2],
-            [166.2, 58.6],
-            [1510.4, 45.10],
-            [162.5, 52.2],
-            [1510.0, 48.6],
-            [162.8, 510.8],
-            [1510.0, 55.6],
-            [11010.8, 66.8],
-            [162.10, 510.4],
-            [161.0, 53.6],
-            [151.1, 103.2],
-            [168.2, 53.4],
-            [168.10, 610.0],
-            [1103.2, 58.4],
-            [1101.8, 56.2],
-            [1108.0, 100.6],
-            [164.3, 510.8],
-            [163.0, 102.0],
-            [168.5, 65.2],
-            [166.8, 56.6],
-            [1102.10, 105.2],
-            [163.5, 51.8],
-            [1610.4, 63.4],
-            [1610.8, 510.0],
-            [1510.5, 410.6],
-            [1610.6, 63.0],
-            [161.2, 55.2],
-            [160.0, 45.0],
-            [163.2, 54.0],
-            [162.2, 50.2],
-            [161.3, 60.2],
-            [1410.5, 44.8],
-            [1510.5, 58.8],
-            [163.2, 56.4],
-            [1102.10, 62.0],
-            [155.0, 410.2],
-            [156.5, 610.2],
-            [164.0, 53.8],
-            [160.10, 54.4],
-            [162.8, 58.0],
-            [1610.0, 510.8],
-            [160.0, 54.8],
-            [160.0, 43.2],
-            [168.10, 60.5],
-            [158.2, 46.4],
-            [156.0, 64.4],
-            [160.0, 48.8],
-            [1610.1, 62.2],
-            [158.0, 55.5],
-            [1610.6, 510.8],
-            [156.0, 54.6],
-            [162.1, 510.2],
-            [1103.4, 52.10],
-            [1510.8, 53.2],
-            [1100.5, 64.5],
-            [1510.2, 51.8],
-            [1510.5, 56.0],
-            [161.3, 63.6],
-            [162.6, 63.2],
-            [160.0, 510.5],
-            [168.10, 56.8],
-            [165.1, 64.1],
-            [162.6, 50.0],
-            [165.1, 102.3],
-            [166.4, 55.0],
-            [160.0, 55.10],
-            [152.4, 60.4],
-            [1100.2, 610.1],
-            [162.6, 84.5],
-            [1100.2, 55.10],
-            [158.8, 55.5],
-            [1102.10, 610.5],
-            [1610.6, 106.4],
-            [162.6, 61.4],
-            [1610.6, 65.10],
-            [156.2, 58.6],
-            [1105.2, 66.8],
-            [1102.1, 56.6],
-            [162.6, 58.6],
-            [160.0, 55.10],
-            [165.1, 510.1],
-            [182.10, 81.8],
-            [166.4, 100.10],
-            [165.1, 56.8],
-            [11010.8, 60.0],
-            [165.1, 58.2],
-            [1105.3, 102.10],
-            [154.10, 54.1],
-            [158.8, 410.1],
-            [1102.10, 105.10],
-            [168.10, 55.0],
-            [161.3, 510.3],
-            [1610.6, 55.0],
-            [165.1, 65.5],
-            [1105.3, 65.5],
-            [1510.5, 48.6],
-            [163.8, 58.6],
-            [1610.6, 63.6],
-            [165.1, 55.2],
-            [165.1, 62.10],
-            [168.10, 56.6],
-            [162.6, 53.10],
-            [164.5, 63.2],
-            [1106.5, 103.6],
-            [168.10, 62.0],
-            [1105.3, 63.6],
-            [1510.4, 53.2],
-            [160.0, 53.4],
-            [1100.2, 55.0],
-            [162.6, 100.5],
-            [1610.6, 54.5],
-            [162.6, 54.5],
-            [160.10, 55.10],
-            [160.0, 510.0],
-            [1510.5, 63.6],
-            [162.6, 54.5],
-            [152.4, 410.3],
-            [1100.2, 610.10],
-            [165.1, 80.10],
-            [1102.10, 100.5],
-            [165.1, 60.10],
-            [1100.2, 63.6],
-            [1100.2, 54.5],
-            [1100.2, 510.1],
-            [161.3, 100.5],
-            [1610.6, 52.10],
-            [1610.6, 62.10],
-            [165.1, 86.3],
-            [162.6, 66.4],
-            [152.4, 610.3],
-            [168.10, 63.0],
-            [1100.2, 103.6],
-            [1105.2, 62.3],
-            [1105.2, 510.10],
-            [160.0, 55.4],
-            [165.1, 104.1],
-            [1104.0, 55.5],
-            [1100.2, 1010.3],
-            [160.0, 80.5],
-            [1610.6, 64.5],
-            [1610.6, 102.3],
-            [1610.6, 61.4],
-            [154.10, 58.2],
-            [162.6, 81.8],
-            [1105.3, 63.6],
-            [1101.4, 53.4],
-            [1510.5, 54.5],
-            [165.1, 53.6],
-            [160.0, 60.0],
-            [1104.0, 103.6],
-            [162.6, 61.4],
-            [1104.0, 55.5],
-            [162.6, 63.6],
-            [161.3, 60.10],
-            [156.2, 60.0],
-            [1410.10, 46.8],
-            [1610.5, 510.3],
-            [160.0, 64.1],
-            [1105.3, 63.6],
-            [1610.5, 610.3],
-            [160.0, 105.5],
-            [1102.10, 68.2],
-            [162.6, 61.4],
-            [1510.5, 106.8],
-            [1106.5, 101.8],
-            [164.4, 55.5],
-            [160.10, 48.6],
-            [1104.0, 66.4],
-            [163.8, 610.3]
-        ];
-        // prettier-ignore
-        const maleDeta = [
-            [1104.0, 65.6],
-            [1105.3, 101.8],
-            [1103.5, 80.10],
-            [186.5, 102.6],
-            [1810.2, 108.8],
-            [181.5, 104.8],
-            [184.0, 86.4],
-            [184.5, 108.4],
-            [1105.0, 62.0],
-            [184.0, 81.6],
-            [180.0, 106.6],
-            [11010.8, 83.6],
-            [1102.0, 100.0],
-            [1106.0, 104.6],
-            [1104.0, 101.0],
-            [184.0, 1010.6],
-            [1102.10, 103.8],
-            [1101.5, 100.0],
-            [1103.0, 102.4],
-            [1106.0, 85.10],
-            [1106.0, 108.8],
-            [180.5, 1010.8],
-            [1102.10, 66.2],
-            [1106.0, 86.4],
-            [1103.5, 81.8],
-            [1108.0, 810.6],
-            [180.3, 82.8],
-            [180.3, 106.4],
-            [164.5, 63.2],
-            [1103.0, 60.10],
-            [183.5, 104.8],
-            [1105.5, 100.0],
-            [188.0, 102.4],
-            [1810.2, 84.1],
-            [1102.8, 610.1],
-            [1100.0, 510.5],
-            [182.0, 610.2],
-            [1100.0, 61.3],
-            [11010.8, 68.6],
-            [184.2, 80.1],
-            [186.10, 810.8],
-            [1101.4, 84.10],
-            [1102.10, 103.4],
-            [1105.3, 102.1],
-            [180.3, 82.6],
-            [182.10, 88.10],
-            [188.0, 84.1],
-            [11010.2, 104.1],
-            [1102.1, 104.10],
-            [1610.0, 510.1],
-            [1610.5, 105.6],
-            [1104.0, 86.2],
-            [1102.10, 105.3],
-            [182.2, 810.1],
-            [164.1, 55.2],
-            [163.0, 510.0],
-            [1101.5, 61.4],
-            [184.2, 106.8],
-            [1104.0, 86.8],
-            [1104.0, 102.2],
-            [11010.0, 101.6],
-            [186.0, 84.8],
-            [1610.0, 68.2],
-            [1101.8, 66.1],
-            [182.0, 102.0],
-            [1610.0, 64.6],
-            [11010.8, 104.8],
-            [164.5, 100.0],
-            [1102.0, 101.6],
-            [1105.5, 63.2],
-            [1101.2, 1010.1],
-            [181.6, 108.10],
-            [1610.4, 610.10],
-            [181.1, 66.0],
-            [11010.0, 68.2],
-            [1104.5, 63.10],
-            [11010.5, 102.0],
-            [1100.5, 56.8],
-            [182.4, 104.5],
-            [11010.1, 100.10],
-            [180.1, 103.0],
-            [1105.5, 80.10],
-            [180.6, 102.10],
-            [184.4, 68.0],
-            [1105.5, 100.10],
-            [180.6, 102.5],
-            [11010.0, 102.5],
-            [11010.1, 83.4],
-            [181.6, 105.5],
-            [1106.5, 103.0],
-            [1105.0, 100.2],
-            [1104.0, 103.4],
-            [165.1, 100.5],
-            [11010.0, 68.10],
-            [1102.0, 102.3],
-            [1106.5, 68.4],
-            [1610.4, 65.10],
-            [182.1, 105.10],
-            [11010.8, 84.5],
-            [1105.3, 810.10],
-            [184.10, 86.4],
-            [11010.3, 103.2],
-            [1610.4, 53.10],
-            [1108.1, 102.0],
-            [168.10, 55.5],
-            [1510.2, 58.4],
-            [180.3, 83.2],
-            [1100.2, 102.10],
-            [11010.8, 64.1],
-            [1102.10, 102.3],
-            [165.1, 65.0],
-            [186.10, 86.4],
-            [165.1, 65.0],
-            [1104.0, 88.6],
-            [1105.3, 84.1],
-            [185.4, 66.8],
-            [11010.8, 105.5],
-            [180.3, 103.2],
-            [180.3, 82.10],
-            [11010.8, 58.0],
-            [11010.8, 1010.5],
-            [11010.8, 108.6],
-            [11010.8, 101.8],
-            [11010.8, 116.4],
-            [163.8, 102.2],
-            [188.0, 83.6],
-            [1108.1, 85.5],
-            [1105.3, 100.10],
-            [166.4, 85.10],
-            [1100.5, 810.1],
-            [166.4, 105.0],
-            [11010.8, 1010.10],
-            [11010.10, 86.4],
-            [1102.10, 100.10],
-            [1100.5, 103.6],
-            [185.4, 106.4],
-            [168.10, 610.1],
-            [1610.6, 84.5],
-            [1105.3, 64.5],
-            [1100.2, 610.1],
-            [1100.5, 108.6],
-            [11010.8, 86.4],
-            [1100.5, 80.10],
-            [11010.8, 810.10],
-            [184.2, 104.5],
-            [1106.5, 80.2],
-            [11010.8, 102.0],
-            [180.3, 101.4],
-            [1101.4, 102.10],
-            [1102.10, 84.1],
-            [1102.10, 106.8],
-            [11010.8, 63.6],
-            [11010.8, 80.10],
-            [182.10, 80.10],
-            [1100.2, 85.5],
-            [1610.6, 68.6],
-            [1105.3, 610.10],
-            [165.1, 66.4],
-            [185.4, 102.3],
-            [181.6, 100.5],
-            [1102.10, 105.10],
-            [1100.5, 84.1],
-            [11010.1, 810.3],
-            [1105.3, 101.8],
-            [1100.2, 65.10],
-            [1103.0, 105.10],
-            [1101.4, 101.4],
-            [11010.8, 81.8],
-            [11010.8, 106.8],
-            [1610.6, 610.1],
-            [1610.6, 82.10],
-            [180.3, 105.5],
-            [182.10, 1010.5],
-            [1106.5, 103.6],
-            [186.10, 101.8],
-            [188.0, 84.1],
-            [188.0, 85.10],
-            [11010.8, 81.8],
-            [1104.0, 82.5],
-            [11010.8, 80.5],
-            [1101.4, 100.0],
-            [185.4, 81.8],
-            [185.4, 84.1],
-            [188.0, 100.5],
-            [188.0, 101.4],
-            [182.10, 810.1],
-            [1106.5, 85.0],
-            [1105.3, 610.1],
-            [1105.3, 103.6],
-            [188.0, 80.5],
-            [188.0, 82.10],
-            [1105.3, 86.4],
-            [1100.5, 610.10],
-            [11010.1, 102.10],
-            [11010.8, 103.6],
-            [1105.3, 100.10],
-            [182.10, 105.0],
-            [1100.8, 103.2],
-            [188.0, 103.2],
-            [180.3, 1010.10],
-            [11010.8, 61.4],
-            [185.4, 104.1],
-            [168.10, 105.0],
-            [185.4, 83.6],
-            [180.3, 85.5],
-            [1104.0, 103.10],
-            [1610.6, 66.8],
-            [182.10, 810.3],
-            [160.0, 102.3],
-            [180.3, 88.6],
-            [1610.6, 105.5],
-            [186.10, 101.4],
-            [1105.3, 101.1],
-            [1105.3, 610.3],
-            [1105.10, 1010.10],
-            [1105.3, 81.8],
-            [11010.1, 105.5],
-            [181.6, 84.5],
-            [11010.8, 106.6],
-            [182.10, 85.0],
-            [11010.8, 102.5],
-            [184.2, 1010.3],
-            [11010.1, 101.8],
-            [1106.5, 810.10],
-            [188.0, 104.3],
-            [1104.0, 100.10],
-            [1610.6, 64.5],
-            [1100.2, 1010.3],
-            [1610.6, 102.3],
-            [188.0, 810.3],
-            [1104.0, 80.0],
-            [1106.5, 82.3],
-            [180.3, 103.6],
-            [1610.6, 104.1],
-            [188.0, 85.10],
-            [180.3, 103.2],
-            [1610.6, 106.3],
-            [183.0, 65.10],
-            [183.0, 100.10],
-            [11010.1, 810.1],
-            [1100.2, 62.3],
-            [11010.8, 82.10],
-            [11010.1, 1010.1],
-            [1100.5, 108.2],
-            [11010.8, 84.1],
-            [180.3, 83.2],
-            [180.3, 83.2]
-        ];
+        // 攻击来源
+        $.ajax({
+          url: FLAT_PATH_THREE + '/apiUrl/sendApiUrlAndParam',
+          type: 'GET',
+          data: {
+            urlCode: 'AQZX_017',
+            params: '{"url":"lastest/web/item/list","domain":"all","size":5}'
+          },
+          success: function (res) {
+            console.log('攻击来源', JSON.parse(res.data));
+            const result = JSON.parse(res.data);
+            const classify = list => list.reduce((result, currentItem) => {
+              (result[`${currentItem.attackSource}`] || (result[`${currentItem.attackSource}`] = [])).push(currentItem)
+              return result
+          }, {})
 
-        function calculateAverage(data, dim) {
-            let total = 0;
-            for (var i = 0; i < data.length; i++) {
-                total += data[i][dim];
-            }
-            return (total /= data.length);
-        }
-        const scatterOption = (option = {
-            xAxis: {
-                scale: true
-            },
-            yAxis: {
-                scale: true
-            },
-            series: [{
-                    type: 'scatter',
-                    id: 'female',
-                    dataGroupId: 'female',
-                    universalTransition: {
-                        enabled: true,
-                        delay: function(idx, count) {
-                            return Math.random() * 400;
-                        }
-                    },
-                    data: femaleData
-                },
-                {
-                    type: 'scatter',
-                    id: 'male',
-                    dataGroupId: 'male',
-                    universalTransition: {
-                        enabled: true,
-                        delay: function(idx, count) {
-                            return Math.random() * 400;
-                        }
-                    },
-                    data: maleDeta
-                }
-            ]
+          const newRes = classify(result.data)
+          console.log(newRes);
+          const arr = []
+          for (const key in newRes) {
+            arr.push({
+                attress:key.split(',')[0],
+                attackIp:key.split(',')[1],
+                count:newRes[key].length
+            })
+          }
+          arr.sort((a,b)=> b.count - a.count)
+          let html = '';
+          arr.forEach((item,index) => {
+            html += `
+              <tr>
+                <td>${index+1}</td>
+                <td>${item.attress}</td>
+                <td>${item.attackIp}</td>
+                <td>${item.count}</td>
+              </tr>
+            `
+          })
+          $('.test40 .box40 tbody').html(html);
+          },
+          error: function (err) {
+            console.log("----攻击来源--------超时");
+          },
         });
-        const barOption = {
-            xAxis: {
-                type: 'category',
-                data: ['Female', 'Male']
-            },
-            yAxis: {},
-            series: [{
-                type: 'bar',
-                id: 'total',
-                data: [{
-                        value: calculateAverage(maleDeta, 0),
-                        groupId: 'male'
-                    },
-                    {
-                        value: calculateAverage(femaleData, 0),
-                        groupId: 'female'
-                    }
-                ],
-                universalTransition: {
-                    enabled: true,
-                    seriesKey: ['female', 'male'],
-                    delay: function(idx, count) {
-                        return Math.random() * 400;
-                    }
-                }
-            }]
-        };
-        let currentOption = scatterOption;
-        setInterval(function() {
-            currentOption = currentOption === scatterOption ? barOption : scatterOption;
-            myChart.setOption(currentOption, true);
-        }, 2000);
-        myChart.setOption(option);
-        // obsDom(`.test40 .box`, myChart)
-
-        if (!testDom) {
-            testDom = document.querySelectorAll('.test40 .box');
-        }
-        obsDom(testDom, myChart)
     }
     return test40
 })();

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test41/test41.css

@@ -62,3 +62,23 @@
 .box41 #stuTable .delBtn {
   background-color: #d9534f;
 }
+
+.box41 .content{
+  padding: 0 0.4rem;
+}
+
+
+.box41 .content{
+  padding: 0 0.1rem;
+}
+/* 偶 */
+.box41 tbody tr:nth-child(2n){  
+  background-color: #1c538ce6;
+}
+/* 奇 */
+.box41 tbody tr:nth-child(2n+1){
+  background-color: #1c538c63;
+}
+.box41 thead tr{
+  background-color: #1c538c;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test42/test42.html

@@ -1,4 +1,4 @@
-<div class="box42 box" data-name='test42'>
+<div class="box42 box" data-name='test42' style="visibility:hidden">
     <div class="toolBox">
         <span class="fit"></span>
         <span class="close"></span>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test42/test42.js

@@ -25,29 +25,48 @@ const test42 = (function() {
         eventClick('.test42');
         // setCharts(`.test42 .floor-dist`);
 
-        const dists = document.querySelectorAll('.test42 .floor-dist');
-        const testDoms = document.querySelectorAll('.test42 .box');
-        for (let i = 0; i < dists.length; i++) {
-            const dom = dists[i];
-            setCharts(dom, testDoms[i]);
-        }
+        const dom = document.querySelector('.test42 .floor-dist');
+        const testDom = document.querySelector('.test42 .box');
 
-        let myChart = echarts.init(dists[0]);
 
-        window.addEventListener('resize', function() {
-            if (timer) {
-                clearTimeout(timer);
-                timer = null;
-            }
-            timer = setTimeout(() => {
-                move3('.test42 .test-box')
+        // 态势地图
+        $.ajax({
+          url: FLAT_PATH_THREE + '/apiUrl/sendApiUrlAndParam',
+          type: 'GET',
+          data: {
+            urlCode: 'AQZX_018',
+            params: '{"beginTime":"2022-05-05 00:00:00","endTime":"2022-05-11 20:08:46"}'
+          },
+          success: function (res) {
+            console.log('态势地图', JSON.parse(res.data));
+            const result = JSON.parse(res.data);
+            const geo = result.payload.geo;
+            const chinaDatas = []
+            result.payload.world.thermodynamic.forEach(item => {
+              chinaDatas.push({
+                name: item.name,
+                value: item.value,
+                price: 100,
+                num: 2,
+              })
+            })
+            setCharts(dom, testDom,geo,chinaDatas);
+          },
+          error: function (err) {
+            console.log("----态势地图--------超时");
+          },
+        });
 
-                myChart.resize();
-            }, 500);
-        })
+
+        
+
+
+
+       
     }
 
-    function setCharts(echartDom, testDom) {
+    function setCharts(echartDom, testDom,chinaGeoCoordMap1,chinaDatas1) {
+      let timer = null;
         var myChart = echarts.init(echartDom);
         // 地图背景颜色
         const mapBgColor = '#000000';
@@ -144,15 +163,18 @@ const test42 = (function() {
             英国: [0.1, 51.3],
             俄罗斯: [37, 55],
         };
+        chinaGeoCoordMap = chinaGeoCoordMap1
+        console.log(chinaGeoCoordMap);
+console.log(chinaGeoCoordMap1);
         var chinaDatas = [
             [{
-                name: '英国',
+                name: '河南',
                 value: 0,
                 price: 100,
                 num: 2,
             }, ],
             [{
-                name: '俄罗斯',
+                name: '湖北',
                 value: 0,
                 price: 100,
                 num: 2,
@@ -162,12 +184,12 @@ const test42 = (function() {
         if (worldType === 'world') {
             chinaDatas.push(
                 [{
-                    name: '美国',
+                    name: '北京',
                     value: 0,
                     price: 100,
                     num: 2,
                 }, ], [{
-                    name: '南非',
+                    name: '南京',
                     value: 0,
                     price: 100,
                     num: 2,
@@ -199,7 +221,7 @@ const test42 = (function() {
 
         var series = [];
         [
-            ['浙江', chinaDatas]
+            ['天津', chinaDatas]
         ].forEach(function(item, i) {
             series.push({
                 type: 'lines',
@@ -331,7 +353,17 @@ const test42 = (function() {
         if (option) {
             myChart.setOption(option);
         }
+        window.addEventListener('resize', function() {
+          if (timer) {
+              clearTimeout(timer);
+              timer = null;
+          }
+          timer = setTimeout(() => {
+              move3('.test42 .test-box')
 
+              myChart.resize();
+          }, 500);
+      })
         if (!testDom) {
             testDom = document.querySelectorAll('.test42 .box');
         }

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test43/test43.css

@@ -4,6 +4,7 @@
 .box43 ul {
   display: flex;
   margin-top: 0.3rem;
+  font-family: "LESLIE";
 }
 .box43 ul li {
   color: #fff;
@@ -12,8 +13,15 @@
   position: relative;
 }
 .box43 ul li img {
-  width: 100%;
+  width: 127%;
+  transform: scale(1.1);
+  margin-left: -11%;
 }
 .box43 ul li .desc {
   position: relative;
+  margin-top: -12%;
+}
+@font-face {
+  font-family: "LESLIE";
+  src: url("../../font/LESLIE.TTF");
 }

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test44/test44.css

@@ -31,9 +31,20 @@
 }
 .text {
   text-align: center;
-  font-size: 0.15rem !important;
+  font-size: 0.12rem !important;
 }
 .box44 .item-img {
   background: url("./img/组246.png");
   background-size: 100% 100%;
 }
+.storing-num{
+  font-size: 0.2rem !important;
+  position: relative;
+  top: -20%;
+  left: 16%;
+  width: 70%;
+  text-align: center;
+  /* background-color: ; */
+  background: url("../../images/矩形-513.png");
+  background-size: 100% 100%;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test44/test44.html

@@ -13,7 +13,7 @@
       <!-- 应急保障组成员信息 -->
       <div class="left">
         <div class="item" style="text-align: center">
-          <div style="width: 32%; height: 74%;" class="item-img1">
+          <div style="width: 30%; height: 77%">
             <img
               style="width: 100%; height: 100%"
               src="../images/bgImg/组244.png"
@@ -24,7 +24,7 @@
           <div class="server_prec" style="width: 33%">97%</div>
         </div>
         <div class="item" style="text-align: center">
-          <div style="width: 32%; height: 74%;">
+          <div style="width: 30%; height: 77%">
             <img
               style="width: 100%; height: 100%"
               src="../images/bgImg/组244.png"
@@ -35,7 +35,7 @@
           <div class="app_server_prec" style="width: 33%">97%</div>
         </div>
         <div class="item" style="text-align: center">
-          <div style="width: 32%; height: 74%;">
+          <div style="width: 30%; height: 77%">
             <img
               style="width: 100%; height: 100%"
               src="../images/bgImg/组247.png"
@@ -58,53 +58,54 @@
       </div>
       <div class="main">
         <div class="floor-dist"></div>
+        <div class="storing-num">健康指数</div>
       </div>
       <div class="right">
         <div class="item" style="text-align: center">
-          <div style="width: 32%; height: 74%;">
+          <div style="width: 30%; height: 77%">
             <img
               style="width: 100%; height: 100%"
               src="../images/bgImg/组248.png"
               alt=""
             />
           </div>
-          <div class="text" style="width: 33%">服务器</div>
-          <div class="network_prec" style="width: 33%">97%</div>
+          <div class="text" style="width: 33%">网络设备</div>
+          <div class="network_prec" style="width: 33%">83%</div>
         </div>
         <div class="item" style="text-align: center">
-          <div style="width: 32%; height: 74%;">
+          <div style="width: 30%; height: 77%">
             <img
               style="width: 100%; height: 100%"
               src="../images/bgImg/组249.png"
               alt=""
             />
           </div>
-          <div class="text" style="width: 33%">服务器</div>
-          <div class="app_system_prec" style="width: 33%">97%</div>
+          <div class="text" style="width: 33%">应用系统</div>
+          <div class="app_system_prec" style="width: 33%">83%</div>
         </div>
         <div class="item" style="text-align: center">
-          <div style="width: 32%; height: 74%;">
+          <div style="width: 30%; height: 77%">
             <img
               style="width: 100%; height: 100%"
               src="../images/bgImg/组250.png"
               alt=""
             />
           </div>
-          <div class="text" style="width: 33%">服务器</div>
-          <div class="database_prec" style="width: 33%">97%</div>
+          <div class="text" style="width: 33%">数据库</div>
+          <div class="database_prec" style="width: 33%">9%</div>
         </div>
         <!-- <div class="item">
-          <img src="../images/networkSecurity/zfx.png" alt="" />
+          <img src="../images/bgImg/组248.png" alt="" />
           <span class="text">网络设备</span>
           <span class="network_prec">95%</span>
         </div>
         <div class="item">
-          <img src="../images/networkSecurity/zfx.png" alt="" />
+          <img src="../images/bgImg/组249.png" alt="" />
           <span class="text">应用系统</span>
           <span class="app_system_prec">83%</span>
         </div>
         <div class="item">
-          <img src="../images/networkSecurity/zfx.png" alt="" />
+          <img src="../images/bgImg/组250.png" alt="" />
           <span class="text">数据库</span>
           <span class="database_prec">9%</span>
         </div> -->

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test45/test45.css

@@ -1,75 +1,83 @@
-.box45 .test-box {
-  overflow: hidden;
-}
-.box45 .content {
-  margin: 0;
-}
-.box45 .left,
-.box45 .right {
-  width: 50%;
-  height: 100%;
-  display: flex;
-  align-items: center;
-  flex: 1;
-  background: none;
-  position: relative;
-}
-.box45 .left span,
-.box45 .right span {
-  font-size: 15px;
-  color: #fff;
-  font-weight: bold;
-}
-.box45 .left .info,
-.box45 .right .info {
-  display: flex;
-  flex-direction: column;
-}
-.box45 .left .num,
-.box45 .right .num {
-  left: 52%;
-  top: 72%;
-}
-.box45 .left .txt,
-.box45 .right .txt {
-  font-size: 18px;
-  color: antiquewhite;
-}
-.box45 .left img,
-.box45 .right img {
-  width: 45%;
-}
-.box45 .dataCount_box {
-  display: flex;
-}
-.box45 table {
-  width: 100%;
-  text-align: center;
-  line-height: 30px;
-  font-size: 14px;
-}
-.box45 #stuTable thead {
-  color: #eee;
-  background-color: #205dcf83;
-}
-.box45 #stuTable tbody {
-  color: #fff;
-  background-color: #205dcf46;
-}
-.box45 #stuTable .editBtn {
-  background-color: #5cb85c;
-}
-.box45 #stuTable .delBtn {
-  background-color: #d9534f;
-}
-.box45 .serious {
-  width: 50%;
-  height: 189px;
-  /* background-color: #d9534f; */
-  background: #d9534f;
-  margin: auto;
-  line-height: 189px;
-}
-.box45 .commonly {
-  background-color: #66650c;
-}
+.box45 .test-box {
+  overflow: hidden;
+}
+.box45 .content {
+  margin: 0;
+  width: 90%;
+  height: 90%;
+  margin-top: 2%;
+  margin-left: 6%;
+}
+.box45 .left,
+.box45 .right {
+  width: 50%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  flex: 1;
+  background: none;
+  position: relative;
+}
+.box45 .left span,
+.box45 .right span {
+  font-size: 15px;
+  color: #fff;
+  font-weight: bold;
+}
+.box45 .left .info,
+.box45 .right .info {
+  display: flex;
+  flex-direction: column;
+}
+.box45 .left .num,
+.box45 .right .num {
+  left: 52%;
+  top: 72%;
+}
+.box45 .left .txt,
+.box45 .right .txt {
+  font-size: 18px;
+  color: antiquewhite;
+}
+.box45 .left img,
+.box45 .right img {
+  width: 45%;
+}
+.box45 .dataCount_box {
+  display: flex;
+}
+.box45 table {
+  width: 100%;
+  text-align: center;
+  line-height: 30px;
+  font-size: 14px;
+}
+.box45 #stuTable thead {
+  color: #eee;
+  background-color: #205dcf83;
+}
+.box45 #stuTable tbody {
+  color: #fff;
+  background-color: #205dcf46;
+}
+.box45 #stuTable .editBtn {
+  background-color: #5cb85c;
+}
+.box45 #stuTable .delBtn {
+  background-color: #d9534f;
+}
+.box45 .serious {
+  background-color: #d9534f;
+}
+.box45 .commonly {
+  background-color: #66650c;
+}
+.box45 .success {
+  background-color: #4162ce;
+}
+.box45 .commonly {
+  background-color: #66650c;
+}
+.box45 .commonly {
+  background-color: #66650c;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test45/test45.html

@@ -1,55 +1,58 @@
-<div class="box45 box" data-name="test45">
-  <div class="toolBox">
-    <span class="fit"></span>
-    <span class="close"></span>
-  </div>
-  <div class="tool">
-    <div class="title bgTitle">
-      <h2>受攻击最严重业务系统</h2>
+<div class="box45 box" data-name='test45'>
+    <div class="toolBox">
+        <span class="fit"></span>
+        <span class="close"></span>
     </div>
-  </div>
-  <div class="test-box">
-    <div class="content">
-      <!-- 漏洞数据 -->
-      <table id="stuTable" class="table">
-        <thead>
-          <tr>
-            <th>资源名称</th>
-            <th>告警级别</th>
-            <th>告警时间</th>
-            <th>告警信息</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr>
-            <td>OA和运维监控平台</td>
-            <td><div class="serious level">严重</div></td>
-            <td>2022年1月13日 14:36:29</td>
-            <td>资源连接失败</td>
-          </tr>
-        </tbody>
-      </table>
+    <div class="tool">
+        <div class="title bgTitle">
+            <h2>受攻击最严重业务系统</h2>
+        </div>
     </div>
-  </div>
-  <div class="panel-footer"></div>
+    <div class="test-box">
+        <div class="content">
+            <!-- 漏洞数据 -->
+            <table id="stuTable" class="table">
+                <thead>
+                    <tr>
+                        <th>资源名称</th>
+                        <th>告警级别</th>
+                        <th>告警时间</th>
+                        <th>告警信息</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr>
+                        <td>OA和运维监控平台</td>
+                        <td class="serious level">严重</td>
+                        <td>2022年1月13日 14:36:29</td>
+                        <td>资源连接失败</td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
+    </div>
+    <div class="panel-footer"></div>
+
 </div>
 
+
 <!-- 工具弹框 -->
-<div class="tools" style="display: none">
-  <div class="containerTool test45Toll">
-    <ul>
-      <li>
-        <span>宽度：</span>
-        <input class="setWidth" type="text" />
-        <span id="validateAge" class="regValidate"></span>
-      </li>
-      <li>
-        <span>高度：</span>
-        <input class="setHeight" type="text" />
-      </li>
-    </ul>
-    <!-- 确定 -->
-    <button class="fixBtn toolBtn">确定</button>
-    <button class="offBtn toolBtn">取消</button>
-  </div>
-</div>
+<div class="tools" style="display: none;">
+
+    <div class="containerTool test45Toll">
+        <ul>
+            <li>
+                <span>宽度：</span>
+                <input class="setWidth" type="text">
+                <span id="validateAge" class="regValidate"></span>
+            </li>
+            <li>
+                <span>高度：</span>
+                <input class="setHeight" type="text">
+            </li>
+        </ul>
+        <!-- 确定 -->
+        <button class="fixBtn toolBtn">确定</button>
+        <button class="offBtn toolBtn">取消</button>
+    </div>
+</div>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test46/test46.css

@@ -18,7 +18,7 @@
 .box46 .progress .proDesc {
   position: absolute;
   top: -70% !important;
-  left: -43%;
+  left: -35%;
   color: #fff;
 }
 .box46 .progress > span {
@@ -56,7 +56,7 @@
   right: 0;
   z-index: 1;
   height: 0.2rem;
-  background: url(../../images/progress.png) 0 0 repeat-x;
+  background: url('../../images/progress.png') 0 0 repeat-x;
   border-radius: 1rem;
 }
 .box46 .progress .txt {

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test46/test46.html

@@ -1,69 +1,68 @@
-<div class="box46 box" data-name="test46">
-    <div class="toolBox">
-      <span class="fit"></span>
-      <span class="close"></span>
-    </div>
-    <div class="tool">
-      <div class="title bgTitle">
-        <h2>攻击类型</h2>
-      </div>
-    </div>
-    <div class="test-box">
-      <div class="content">
-        <!-- 攻击类型 -->
-        <div class="container" style="margin-top: -4%">
-          <div class="progress">
-            <div class="proDesc">OA中间主服务器</div>
-            <span id="OA" style="width: 20%"></span>
-            <span class="txt">20%</span>
-          </div>
-  
-          <div class="progress">
-            <div class="proDesc">核心交换机1060</div>
-            <span id="core" class="green" style="width: 40%"></span>
-            <span class="txt">40%</span>
-          </div>
-  
-          <div class="progress">
-            <div class="proDesc">杀毒服务器</div>
-            <span id="Anti-Virus" class="orange" style="width: 60%"></span>
-            <span class="txt">50%</span>
-          </div>
-  
-          <div class="progress">
-            <div class="proDesc">电子盖章服务器</div>
-            <span id="Electronic-seal" class="red" style="width: 80%"></span>
-            <span class="txt">80%</span>
-          </div>
-  
-          <div class="progress">
-            <div class="proDesc">office</div>
-            <span id="office" class="blue" style="width: 100%"></span>
-            <span class="txt">30%</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div class="panel-footer"></div>
-  </div>
-  
-  <!-- 工具弹框 -->
-  <div class="tools" style="display: none">
-    <div class="containerTool test46Toll">
-      <ul>
-        <li>
-          <span>宽度：</span>
-          <input class="setWidth" type="text" />
-          <span id="validateAge" class="regValidate"></span>
-        </li>
-        <li>
-          <span>高度：</span>
-          <input class="setHeight" type="text" />
-        </li>
-      </ul>
-      <!-- 确定 -->
-      <button class="fixBtn toolBtn">确定</button>
-      <button class="offBtn toolBtn">取消</button>
-    </div>
-  </div>
-  
+<div class="box46 box" data-name="test46">
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="tool">
+    <div class="title bgTitle">
+      <h2>攻击类型</h2>
+    </div>
+  </div>
+  <div class="test-box">
+    <div class="content">
+      <!-- 攻击类型 -->
+      <div class="container" style="margin-top: -4%">
+        <div class="progress">
+          <div class="proDesc">OA中间主服务器</div>
+          <span id="OA2" style="width: 20%"></span>
+          <span class="txt">20%</span>
+        </div>
+
+        <div class="progress">
+          <div class="proDesc">核心交换机1060</div>
+          <span id="core" class="green" style="width: 40%"></span>
+          <span class="txt">40%</span>
+        </div>
+
+        <div class="progress">
+          <div class="proDesc">杀毒服务器</div>
+          <span id="Anti-Virus" class="orange" style="width: 60%"></span>
+          <span class="txt">50%</span>
+        </div>
+
+        <div class="progress">
+          <div class="proDesc">电子盖章服务器</div>
+          <span id="Electronic-seal" class="red" style="width: 80%"></span>
+          <span class="txt">80%</span>
+        </div>
+
+        <div class="progress">
+          <div class="proDesc">office</div>
+          <span id="office" class="blue" style="width: 100%"></span>
+          <span class="txt">30%</span>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="panel-footer"></div>
+</div>
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none">
+  <div class="containerTool test46Toll">
+    <ul>
+      <li>
+        <span>宽度：</span>
+        <input class="setWidth" type="text" />
+        <span id="validateAge" class="regValidate"></span>
+      </li>
+      <li>
+        <span>高度：</span>
+        <input class="setHeight" type="text" />
+      </li>
+    </ul>
+    <!-- 确定 -->
+    <button class="fixBtn toolBtn">确定</button>
+    <button class="offBtn toolBtn">取消</button>
+  </div>
+</div>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test46/test46.js

@@ -1,113 +1,113 @@
-const test46 = (function () {
-  function test46(id, domTitle) {
-    if (domTitle) {
-      $(".test46 .title h2").text(domTitle);
-    }
-    $(".test46 .box").css("z-index", ++zIndex);
-    $(".test46 .box").attr("data-id", id);
-    move3(".test46 .test-box");
-    move2(".test46 .containerTool");
-
-    $(".test46 .close").click(function () {
-      $(".test46 .box").remove();
-      $(".test46 .containerTool").css("display", "none");
-      $(".test46 .setWidth").val("");
-      $(".test46 .setHeight").val("");
-      moduleIdRemove.push(id);
-    });
-
-    eventClick(".test46");
-    function sucTimer() {
-      var num = 0;
-      var num1 = 0;
-
-      var num2 = 0;
-
-      var num3 = 0;
-
-      var num4 = 0;
-
-      var timer = setInterval(function () {
-        $("#OA").css("width", num + "%");
-        if (num == 20) {
-          clearInterval(timer);
-        } else {
-          num += 5;
-        }
-      }, 30);
-      var timer1 = setInterval(function () {
-        $("#core").css("width", num1 + "%");
-        if (num1 == 40) {
-          clearInterval(timer1);
-        } else {
-          num1 += 5;
-        }
-      }, 30);
-      var timer2 = setInterval(function () {
-        $("#Anti-Virus").css("width", num2 + "%");
-        if (num2 == 60) {
-          clearInterval(timer2);
-        } else {
-          num2 += 5;
-        }
-      }, 30);
-      var timer3 = setInterval(function () {
-        $("#Electronic-seal").css("width", num3 + "%");
-        if (num3 == 80) {
-          clearInterval(timer3);
-        } else {
-          num3 += 5;
-        }
-      }, 30);
-      var timer4 = setInterval(function () {
-        $("#office").css("width", num4 + "%");
-        if (num4 == 100) {
-          clearInterval(timer4);
-        } else {
-          num4 += 5;
-        }
-      }, 30);
-    }
-    sucTimer();
-  }
-
-  function myAjax() {
-    $.ajax({
-      url: baseURL + "/selectMgtServerTop5",
-      data: {
-        orgIds: "323598b4196341b6a73969cfe7162209",
-      },
-      type: "GET",
-      dataType: "JSON",
-      success: function (data) {
-        const { data: res } = data;
-        if (data.code != 0) {
-          return alert("请求数据失败");
-        }
-        // topData = eval('(' + data.data + ')');
-        setCPU(res.cpu);
-      },
-      timeout: 6000,
-      error: function () {
-        console.log("超时了");
-      },
-    });
-
-    function setCPU(res) {
-      let str = "";
-      for (let i = 0; i < res.length; i++) {
-        const prog = res[i];
-        str += `
-          <div class="progress">
-            <div class="proDesc">${prog.RESNAME}</div>
-            <span class="green" style="width: 19%;"></span>
-            <span class="txt">40%</span>
-          </div>`;
-      }
-
-      $(".container").html(str);
-    }
-  }
-
-  return test46;
-})();
+const test46 = (function () {
+  function test46(id, domTitle) {
+    if (domTitle) {
+      $(".test46 .title h2").text(domTitle);
+    }
+    $(".test46 .box").css("z-index", ++zIndex);
+    $(".test46 .box").attr("data-id", id);
+    move3(".test46 .test-box");
+    move2(".test46 .containerTool");
+
+    $(".test46 .close").click(function () {
+      $(".test46 .box").remove();
+      $(".test46 .containerTool").css("display", "none");
+      $(".test46 .setWidth").val("");
+      $(".test46 .setHeight").val("");
+      moduleIdRemove.push(id);
+    });
+
+    eventClick(".test46");
+    function sucTimer() {
+      var num = 0;
+      var num1 = 0;
+
+      var num2 = 0;
+
+      var num3 = 0;
+
+      var num4 = 0;
+
+      var timer = setInterval(function () {
+        $("#OA").css("width", num + "%");
+        if (num == 20) {
+          clearInterval(timer);
+        } else {
+          num += 5;
+        }
+      }, 30);
+      var timer1 = setInterval(function () {
+        $("#core").css("width", num1 + "%");
+        if (num1 == 40) {
+          clearInterval(timer1);
+        } else {
+          num1 += 5;
+        }
+      }, 30);
+      var timer2 = setInterval(function () {
+        $("#Anti-Virus").css("width", num2 + "%");
+        if (num2 == 60) {
+          clearInterval(timer2);
+        } else {
+          num2 += 5;
+        }
+      }, 30);
+      var timer3 = setInterval(function () {
+        $("#Electronic-seal").css("width", num3 + "%");
+        if (num3 == 80) {
+          clearInterval(timer3);
+        } else {
+          num3 += 5;
+        }
+      }, 30);
+      var timer4 = setInterval(function () {
+        $("#office").css("width", num4 + "%");
+        if (num4 == 100) {
+          clearInterval(timer4);
+        } else {
+          num4 += 5;
+        }
+      }, 30);
+    }
+    sucTimer();
+  }
+
+  function myAjax() {
+    $.ajax({
+      url: baseURL + "/selectMgtServerTop5",
+      data: {
+        orgIds: "323598b4196341b6a73969cfe7162209",
+      },
+      type: "GET",
+      dataType: "JSON",
+      success: function (data) {
+        const { data: res } = data;
+        if (data.code != 0) {
+          return alert("请求数据失败");
+        }
+        // topData = eval('(' + data.data + ')');
+        setCPU(res.cpu);
+      },
+      timeout: 6000,
+      error: function () {
+        console.log("超时了");
+      },
+    });
+
+    function setCPU(res) {
+      let str = "";
+      for (let i = 0; i < res.length; i++) {
+        const prog = res[i];
+        str += `
+        <div class="progress">
+          <div class="proDesc">${prog.RESNAME}</div>
+          <span class="green" style="width: 19%;"></span>
+          <span class="txt">40%</span>
+        </div>`;
+      }
+
+      $(".container").html(str);
+    }
+  }
+
+  return test46;
+})();

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test47/test47.css

@@ -18,7 +18,7 @@
 .box47 .progress .proDesc {
   position: absolute;
   top: -70% !important;
-  left: -43%;
+  left: -35%;
   color: #fff;
 }
 .box47 .progress > span {
@@ -56,7 +56,7 @@
   right: 0;
   z-index: 1;
   height: 0.2rem;
-  background: url(../../images/progress.png) 0 0 repeat-x;
+  background: url('../../images/progress.png') 0 0 repeat-x;
   border-radius: 1rem;
 }
 .box47 .progress .txt {

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test47/test47.html

@@ -1,68 +1,68 @@
-<div class="box47 box" data-name="test47">
-  <div class="toolBox">
-    <span class="fit"></span>
-    <span class="close"></span>
-  </div>
-  <div class="tool">
-    <div class="title bgTitle">
-      <h2>攻击类型</h2>
-    </div>
-  </div>
-  <div class="test-box">
-    <div class="content">
-      <!-- 攻击类型 -->
-      <div class="container" style="margin-top: -4%">
-        <div class="progress">
-          <div class="proDesc">OA中间主服务器</div>
-          <span id="OA1" style="width: 20%"></span>
-          <span class="txt">20%</span>
-        </div>
-
-        <div class="progress">
-          <div class="proDesc">核心交换机1060</div>
-          <span id="core1" class="green" style="width: 40%"></span>
-          <span class="txt">40%</span>
-        </div>
-
-        <div class="progress">
-          <div class="proDesc">杀毒服务器</div>
-          <span id="Anti-Virus1" class="orange" style="width: 60%"></span>
-          <span class="txt">50%</span>
-        </div>
-
-        <div class="progress">
-          <div class="proDesc">电子盖章服务器</div>
-          <span id="Electronic-seal1" class="red" style="width: 80%"></span>
-          <span class="txt">80%</span>
-        </div>
-
-        <div class="progress">
-          <div class="proDesc">office</div>
-          <span id="office1" class="blue" style="width: 100%"></span>
-          <span class="txt">30%</span>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="panel-footer"></div>
-</div>
-
-<!-- 工具弹框 -->
-<div class="tools" style="display: none">
-  <div class="containerTool test47Toll">
-    <ul>
-      <li>
-        <span>宽度：</span>
-        <input class="setWidth" type="text" />
-        <span id="validateAge" class="regValidate"></span>
-      </li>
-      <li>
-        <span>高度：</span>
-        <input class="setHeight" type="text" />
-      </li>
-    </ul>
-    <!-- 确定 -->
-    <button class="fixBtn toolBtn">确定</button>
-    <button class="offBtn toolBtn">取消</button>
-  </div>
-</div>
+<div class="box47 box" data-name="test47">
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="tool">
+    <div class="title bgTitle">
+      <h2>攻击类型</h2>
+    </div>
+  </div>
+  <div class="test-box">
+    <div class="content">
+      <!-- 攻击类型 -->
+      <div class="container" style="margin-top: -4%">
+        <div class="progress">
+          <div class="proDesc">OA中间主服务器</div>
+          <span id="OA1" style="width: 20%"></span>
+          <span class="txt">20%</span>
+        </div>
+
+        <div class="progress">
+          <div class="proDesc">核心交换机1060</div>
+          <span id="core1" class="green" style="width: 40%"></span>
+          <span class="txt">40%</span>
+        </div>
+
+        <div class="progress">
+          <div class="proDesc">杀毒服务器</div>
+          <span id="Anti-Virus1" class="orange" style="width: 60%"></span>
+          <span class="txt">50%</span>
+        </div>
+
+        <div class="progress">
+          <div class="proDesc">电子盖章服务器</div>
+          <span id="Electronic-seal1" class="red" style="width: 80%"></span>
+          <span class="txt">80%</span>
+        </div>
+
+        <div class="progress">
+          <div class="proDesc">office</div>
+          <span id="office1" class="blue" style="width: 100%"></span>
+          <span class="txt">30%</span>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="panel-footer"></div>
+</div>
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none">
+  <div class="containerTool test47Toll">
+    <ul>
+      <li>
+        <span>宽度：</span>
+        <input class="setWidth" type="text" />
+        <span id="validateAge" class="regValidate"></span>
+      </li>
+      <li>
+        <span>高度：</span>
+        <input class="setHeight" type="text" />
+      </li>
+    </ul>
+    <!-- 确定 -->
+    <button class="fixBtn toolBtn">确定</button>
+    <button class="offBtn toolBtn">取消</button>
+  </div>
+</div>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test47/test47.js

@@ -1,113 +1,114 @@
-const test47 = (function () {
-  function test47(id, domTitle) {
-    if (domTitle) {
-      $(".test47 .title h2").text(domTitle);
-    }
-    $(".test47 .box").css("z-index", ++zIndex);
-    $(".test47 .box").attr("data-id", id);
-    move3(".test47 .test-box");
-    move2(".test47 .containerTool");
-
-    $(".test47 .close").click(function () {
-      $(".test47 .box").remove();
-      $(".test47 .containerTool").css("display", "none");
-      $(".test47 .setWidth").val("");
-      $(".test47 .setHeight").val("");
-      moduleIdRemove.push(id);
-    });
-
-    eventClick(".test47");
-    function sucTimer() {
-      var num = 0;
-      var num1 = 0;
-
-      var num2 = 0;
-
-      var num3 = 0;
-
-      var num4 = 0;
-
-      var timer = setInterval(function () {
-        $("#OA1").css("width", num + "%");
-        if (num == 20) {
-          clearInterval(timer);
-        } else {
-          num += 5;
-        }
-      }, 30);
-      var timer1 = setInterval(function () {
-        $("#core1").css("width", num1 + "%");
-        if (num1 == 40) {
-          clearInterval(timer1);
-        } else {
-          num1 += 5;
-        }
-      }, 30);
-      var timer2 = setInterval(function () {
-        $("#Anti-Virus1").css("width", num2 + "%");
-        if (num2 == 60) {
-          clearInterval(timer2);
-        } else {
-          num2 += 5;
-        }
-      }, 30);
-      var timer3 = setInterval(function () {
-        $("#Electronic-seal1").css("width", num3 + "%");
-        if (num3 == 80) {
-          clearInterval(timer3);
-        } else {
-          num3 += 5;
-        }
-      }, 30);
-      var timer4 = setInterval(function () {
-        $("#office1").css("width", num4 + "%");
-        if (num4 == 100) {
-          clearInterval(timer4);
-        } else {
-          num4 += 5;
-        }
-      }, 30);
-    }
-    sucTimer();
-  }
-
-  function myAjax() {
-    $.ajax({
-      url: baseURL + "/selectMgtServerTop5",
-      data: {
-        orgIds: "323598b4196341b6a73969cfe7162209",
-      },
-      type: "GET",
-      dataType: "JSON",
-      success: function (data) {
-        const { data: res } = data;
-        if (data.code != 0) {
-          return alert("请求数据失败");
-        }
-        // topData = eval('(' + data.data + ')');
-        setCPU(res.cpu);
-      },
-      timeout: 6000,
-      error: function () {
-        console.log("超时了");
-      },
-    });
-
-    function setCPU(res) {
-      let str = "";
-      for (let i = 0; i < res.length; i++) {
-        const prog = res[i];
-        str += `
-        <div class="progress">
-          <div class="proDesc">${prog.RESNAME}</div>
-          <span class="green" style="width: 19%;"></span>
-          <span class="txt">40%</span>
-        </div>`;
-      }
-
-      $(".container").html(str);
-    }
-  }
-
-  return test47;
-})();
+const test47 = (function () {
+  
+  function test47(id, domTitle) {
+    if (domTitle) {
+      $(".test47 .title h2").text(domTitle);
+    }
+    $(".test47 .box").css("z-index", ++zIndex);
+    $(".test47 .box").attr("data-id", id);
+    move3(".test47 .test-box");
+    move2(".test47 .containerTool");
+
+    $(".test47 .close").click(function () {
+      $(".test47 .box").remove();
+      $(".test47 .containerTool").css("display", "none");
+      $(".test47 .setWidth").val("");
+      $(".test47 .setHeight").val("");
+      moduleIdRemove.push(id);
+    });
+
+    eventClick(".test47");
+    function sucTimer() {
+      var num = 0;
+      var num1 = 0;
+
+      var num2 = 0;
+
+      var num3 = 0;
+
+      var num4 = 0;
+
+      var timer = setInterval(function () {
+        $("#OA1").css("width", num + "%");
+        if (num == 20) {
+          clearInterval(timer);
+        } else {
+          num += 5;
+        }
+      }, 30);
+      var timer1 = setInterval(function () {
+        $("#core1").css("width", num1 + "%");
+        if (num1 == 40) {
+          clearInterval(timer1);
+        } else {
+          num1 += 5;
+        }
+      }, 30);
+      var timer2 = setInterval(function () {
+        $("#Anti-Virus1").css("width", num2 + "%");
+        if (num2 == 60) {
+          clearInterval(timer2);
+        } else {
+          num2 += 5;
+        }
+      }, 30);
+      var timer3 = setInterval(function () {
+        $("#Electronic-seal1").css("width", num3 + "%");
+        if (num3 == 80) {
+          clearInterval(timer3);
+        } else {
+          num3 += 5;
+        }
+      }, 30);
+      var timer4 = setInterval(function () {
+        $("#office1").css("width", num4 + "%");
+        if (num4 == 100) {
+          clearInterval(timer4);
+        } else {
+          num4 += 5;
+        }
+      }, 30);
+    }
+    sucTimer();
+  }
+
+  // function myAjax() {
+  //   $.ajax({
+  //     url: baseURL + "/selectMgtServerTop5",
+  //     data: {
+  //       orgIds: "323598b4196341b6a73969cfe7162209",
+  //     },
+  //     type: "GET",
+  //     dataType: "JSON",
+  //     success: function (data) {
+  //       const { data: res } = data;
+  //       if (data.code != 0) {
+  //         return alert("请求数据失败");
+  //       }
+  //       // topData = eval('(' + data.data + ')');
+  //       setCPU(res.cpu);
+  //     },
+  //     timeout: 6000,
+  //     error: function () {
+  //       console.log("超时了");
+  //     },
+  //   });
+
+  //   function setCPU(res) {
+  //     let str = "";
+  //     for (let i = 0; i < res.length; i++) {
+  //       const prog = res[i];
+  //       str += `
+  //       <div class="progress">
+  //         <div class="proDesc">${prog.RESNAME}</div>
+  //         <span class="green" style="width: 19%;"></span>
+  //         <span class="txt">40%</span>
+  //       </div>`;
+  //     }
+
+  //     $(".container").html(str);
+  //   }
+  // }
+
+  return test47;
+})();

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test48/test48.css

@@ -18,7 +18,7 @@
 .box48 .progress .proDesc {
   position: absolute;
   top: -70% !important;
-  left: -43%;
+  left: -35%;
   color: #fff;
 }
 .box48 .progress > span {
@@ -56,7 +56,7 @@
   right: 0;
   z-index: 1;
   height: 0.2rem;
-  background: url(../../images/progress.png) 0 0 repeat-x;
+  background: url('../../images/progress.png') 0 0 repeat-x;
   border-radius: 1rem;
 }
 .box48 .progress .txt {

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test48/test48.html

@@ -1,68 +1,68 @@
-<div class="box48 box" data-name="test48">
-  <div class="toolBox">
-    <span class="fit"></span>
-    <span class="close"></span>
-  </div>
-  <div class="tool">
-    <div class="title bgTitle">
-      <h2>攻击类型</h2>
-    </div>
-  </div>
-  <div class="test-box">
-    <div class="content">
-      <!-- 攻击类型 -->
-      <div class="container" style="margin-top: -4%">
-        <div class="progress">
-          <div class="proDesc">OA中间主服务器</div>
-          <span id="OA2" style="width: 20%"></span>
-          <span class="txt">20%</span>
-        </div>
-
-        <div class="progress">
-          <div class="proDesc">核心交换机1060</div>
-          <span id="core2" class="green" style="width: 40%"></span>
-          <span class="txt">40%</span>
-        </div>
-
-        <div class="progress">
-          <div class="proDesc">杀毒服务器</div>
-          <span id="Anti-Virus2" class="orange" style="width: 60%"></span>
-          <span class="txt">50%</span>
-        </div>
-
-        <div class="progress">
-          <div class="proDesc">电子盖章服务器</div>
-          <span id="Electronic-seal2" class="red" style="width: 80%"></span>
-          <span class="txt">80%</span>
-        </div>
-
-        <div class="progress">
-          <div class="proDesc">office</div>
-          <span id="office2" class="blue" style="width: 100%"></span>
-          <span class="txt">30%</span>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="panel-footer"></div>
-</div>
-
-<!-- 工具弹框 -->
-<div class="tools" style="display: none">
-  <div class="containerTool test48Toll">
-    <ul>
-      <li>
-        <span>宽度：</span>
-        <input class="setWidth" type="text" />
-        <span id="validateAge" class="regValidate"></span>
-      </li>
-      <li>
-        <span>高度：</span>
-        <input class="setHeight" type="text" />
-      </li>
-    </ul>
-    <!-- 确定 -->
-    <button class="fixBtn toolBtn">确定</button>
-    <button class="offBtn toolBtn">取消</button>
-  </div>
-</div>
+<div class="box48 box" data-name="test48">
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="tool">
+    <div class="title bgTitle">
+      <h2>攻击类型</h2>
+    </div>
+  </div>
+  <div class="test-box">
+    <div class="content">
+      <!-- 攻击类型 -->
+      <div class="container" style="margin-top: -4%">
+        <div class="progress">
+          <div class="proDesc">OA中间主服务器</div>
+          <span id="OA2" style="width: 20%"></span>
+          <span class="txt">20%</span>
+        </div>
+
+        <div class="progress">
+          <div class="proDesc">核心交换机1060</div>
+          <span id="core2" class="green" style="width: 40%"></span>
+          <span class="txt">40%</span>
+        </div>
+
+        <div class="progress">
+          <div class="proDesc">杀毒服务器</div>
+          <span id="Anti-Virus2" class="orange" style="width: 60%"></span>
+          <span class="txt">50%</span>
+        </div>
+
+        <div class="progress">
+          <div class="proDesc">电子盖章服务器</div>
+          <span id="Electronic-seal2" class="red" style="width: 80%"></span>
+          <span class="txt">80%</span>
+        </div>
+
+        <div class="progress">
+          <div class="proDesc">office</div>
+          <span id="office2" class="blue" style="width: 100%"></span>
+          <span class="txt">30%</span>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="panel-footer"></div>
+</div>
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none">
+  <div class="containerTool test48Toll">
+    <ul>
+      <li>
+        <span>宽度：</span>
+        <input class="setWidth" type="text" />
+        <span id="validateAge" class="regValidate"></span>
+      </li>
+      <li>
+        <span>高度：</span>
+        <input class="setHeight" type="text" />
+      </li>
+    </ul>
+    <!-- 确定 -->
+    <button class="fixBtn toolBtn">确定</button>
+    <button class="offBtn toolBtn">取消</button>
+  </div>
+</div>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test48/test48.js

@@ -1,113 +1,114 @@
-const test48 = (function () {
-  function test48(id, domTitle) {
-    if (domTitle) {
-      $(".test48 .title h2").text(domTitle);
-    }
-    $(".test48 .box").css("z-index", ++zIndex);
-    $(".test48 .box").attr("data-id", id);
-    move3(".test48 .test-box");
-    move2(".test48 .containerTool");
-
-    $(".test48 .close").click(function () {
-      $(".test48 .box").remove();
-      $(".test48 .containerTool").css("display", "none");
-      $(".test48 .setWidth").val("");
-      $(".test48 .setHeight").val("");
-      moduleIdRemove.push(id);
-    });
-
-    eventClick(".test48");
-    function sucTimer() {
-      var num = 0;
-      var num1 = 0;
-
-      var num2 = 0;
-
-      var num3 = 0;
-
-      var num4 = 0;
-
-      var timer = setInterval(function () {
-        $("#OA2").css("width", num + "%");
-        if (num == 20) {
-          clearInterval(timer);
-        } else {
-          num += 5;
-        }
-      }, 30);
-      var timer1 = setInterval(function () {
-        $("#core2").css("width", num1 + "%");
-        if (num1 == 40) {
-          clearInterval(timer1);
-        } else {
-          num1 += 5;
-        }
-      }, 30);
-      var timer2 = setInterval(function () {
-        $("#Anti-Virus2").css("width", num2 + "%");
-        if (num2 == 60) {
-          clearInterval(timer2);
-        } else {
-          num2 += 5;
-        }
-      }, 30);
-      var timer3 = setInterval(function () {
-        $("#Electronic-seal2").css("width", num3 + "%");
-        if (num3 == 80) {
-          clearInterval(timer3);
-        } else {
-          num3 += 5;
-        }
-      }, 30);
-      var timer4 = setInterval(function () {
-        $("#office2").css("width", num4 + "%");
-        if (num4 == 100) {
-          clearInterval(timer4);
-        } else {
-          num4 += 5;
-        }
-      }, 30);
-    }
-    sucTimer();
-  }
-
-  function myAjax() {
-    $.ajax({
-      url: baseURL + "/selectMgtServerTop5",
-      data: {
-        orgIds: "323598b4196341b6a73969cfe7162209",
-      },
-      type: "GET",
-      dataType: "JSON",
-      success: function (data) {
-        const { data: res } = data;
-        if (data.code != 0) {
-          return alert("请求数据失败");
-        }
-        // topData = eval('(' + data.data + ')');
-        setCPU(res.cpu);
-      },
-      timeout: 6000,
-      error: function () {
-        console.log("超时了");
-      },
-    });
-
-    function setCPU(res) {
-      let str = "";
-      for (let i = 0; i < res.length; i++) {
-        const prog = res[i];
-        str += `
-        <div class="progress">
-          <div class="proDesc">${prog.RESNAME}</div>
-          <span class="green" style="width: 19%;"></span>
-          <span class="txt">40%</span>
-        </div>`;
-      }
-
-      $(".container").html(str);
-    }
-  }
-
-  return test48;
-})();
+const test48 = (function () {
+    function test48(id, domTitle) {
+      if (domTitle) {
+        $(".test48 .title h2").text(domTitle);
+      }
+      $(".test48 .box").css("z-index", ++zIndex);
+      $(".test48 .box").attr("data-id", id);
+      move3(".test48 .test-box");
+      move2(".test48 .containerTool");
+  
+      $(".test48 .close").click(function () {
+        $(".test48 .box").remove();
+        $(".test48 .containerTool").css("display", "none");
+        $(".test48 .setWidth").val("");
+        $(".test48 .setHeight").val("");
+        moduleIdRemove.push(id);
+      });
+  
+      eventClick(".test48");
+      function sucTimer() {
+        var num = 0;
+        var num1 = 0;
+  
+        var num2 = 0;
+  
+        var num3 = 0;
+  
+        var num4 = 0;
+  
+        var timer = setInterval(function () {
+          $("#OA2").css("width", num + "%");
+          if (num == 20) {
+            clearInterval(timer);
+          } else {
+            num += 5;
+          }
+        }, 30);
+        var timer1 = setInterval(function () {
+          $("#core2").css("width", num1 + "%");
+          if (num1 == 40) {
+            clearInterval(timer1);
+          } else {
+            num1 += 5;
+          }
+        }, 30);
+        var timer2 = setInterval(function () {
+          $("#Anti-Virus2").css("width", num2 + "%");
+          if (num2 == 60) {
+            clearInterval(timer2);
+          } else {
+            num2 += 5;
+          }
+        }, 30);
+        var timer3 = setInterval(function () {
+          $("#Electronic-seal2").css("width", num3 + "%");
+          if (num3 == 80) {
+            clearInterval(timer3);
+          } else {
+            num3 += 5;
+          }
+        }, 30);
+        var timer4 = setInterval(function () {
+          $("#office2").css("width", num4 + "%");
+          if (num4 == 100) {
+            clearInterval(timer4);
+          } else {
+            num4 += 5;
+          }
+        }, 30);
+      }
+      sucTimer();
+    }
+  
+    function myAjax() {
+      $.ajax({
+        url: baseURL + "/selectMgtServerTop5",
+        data: {
+          orgIds: "323598b4196341b6a73969cfe7162209",
+        },
+        type: "GET",
+        dataType: "JSON",
+        success: function (data) {
+          const { data: res } = data;
+          if (data.code != 0) {
+            return alert("请求数据失败");
+          }
+          // topData = eval('(' + data.data + ')');
+          setCPU(res.cpu);
+        },
+        timeout: 6000,
+        error: function () {
+          console.log("超时了");
+        },
+      });
+  
+      function setCPU(res) {
+        let str = "";
+        for (let i = 0; i < res.length; i++) {
+          const prog = res[i];
+          str += `
+          <div class="progress">
+            <div class="proDesc">${prog.RESNAME}</div>
+            <span class="green" style="width: 19%;"></span>
+            <span class="txt">40%</span>
+          </div>`;
+        }
+  
+        $(".container").html(str);
+      }
+    }
+  
+    return test48;
+  })();
+  

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test49/test49.css

@@ -1,70 +1,67 @@
-.box49 .content {
-    flex-direction: row;
-    justify-content: space-around;
-    margin: 0 0.1rem;
-}
-
-.box49 .content .title {
-    text-align: center;
-    background-image: linear-gradient(45deg, #155ed5, transparent);
-    line-height: 0.4rem;
-    height: 0.4rem;
-    /* padding-left: 0.3rem; */
-}
-.title img {
-  width: 3%;
-  height: 100%;
-}
-.box49 .content-left,
-.box49 .content-right {
-    height: 90%;
-    flex: 1;
-}
-
-.box49 .dataCount_box {
-    display: flex;
-}
-
-.box49 .content-left {
-    margin-right: 0.5rem;
-}
-
-.box49 table {
-    width: 100%;
-    text-align: center;
-    margin-top: 0.1rem;
-}
-
-.box49 td {
-    font-size: 0.14rem !important;
-}
-
-.box49 tr {
-    height: 0.3rem;
-}
-
-.box49 th {
-    font-size: 0.14rem !important;
-}
-
-.box49 #stuTable thead,
-.box49 #content-stuTable thead {
-    color: #eee;
-    background-color: #205dcf83;
-}
-
-.box49 #stuTable tbody,
-.box49 #content-stuTable tbody {
-    color: #fff;
-    background-color: #205dcf46;
-}
-
-.box49 #stuTable .editBtn,
-.box49 #content-stuTable .editBtn {
-    background-color: #5cb85c;
-}
-
-.box49 #stuTable .delBtn,
-.box49 #content-stuTable .delBtn {
-    background-color: #d9534f;
+.box49 .content {
+    flex-direction: row;
+    justify-content: space-around;
+    margin: 0 0.1rem;
+}
+
+.box49 .content .title {
+    text-align: center;
+    background-image: linear-gradient(45deg, #155ed5, transparent);
+    line-height: 0.4rem;
+    height: 0.4rem;
+    padding-left: 0.3rem;
+}
+
+.box49 .content-left,
+.box49 .content-right {
+    height: 90%;
+    flex: 1;
+}
+
+.box49 .dataCount_box {
+    display: flex;
+}
+
+.box49 .content-left {
+    margin-right: 0.5rem;
+}
+
+.box49 table {
+    width: 100%;
+    text-align: center;
+    margin-top: 0.1rem;
+}
+
+.box49 td {
+    font-size: 0.14rem !important;
+}
+
+.box49 tr {
+    height: 0.3rem;
+}
+
+.box49 th {
+    font-size: 0.14rem !important;
+}
+
+.box49 #stuTable thead,
+.box49 #content-stuTable thead {
+    color: #eee;
+    background-color: #205dcf83;
+}
+
+.box49 #stuTable tbody,
+.box49 #content-stuTable tbody {
+    color: #fff;
+    background-color: #205dcf46;
+}
+
+.box49 #stuTable .editBtn,
+.box49 #content-stuTable .editBtn {
+    background-color: #5cb85c;
+}
+
+.box49 #stuTable .delBtn,
+.box49 #content-stuTable .delBtn {
+    background-color: #d9534f;
 }

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test49/test49.html

@@ -1,129 +1,213 @@
-<div class="box49 box" data-name="test49">
-  <div class="toolBox">
-    <span class="fit"></span>
-    <span class="close"></span>
-  </div>
-  <div class="tool">
-    <div class="title bgTitle">
-      <h2>受攻击最严重业务系统</h2>
-    </div>
-  </div>
-  <div class="test-box">
-    <div class="content">
-      <!-- 漏洞数据 -->
-      <div class="content-left">
-        <div class="title">
-          <div style="width: 13%; height: 100%">
-            <img
-            style="width: 100%; height:100%"
-              src="../images/业务系统图标.png"
-              alt=""
-            />
-          </div>
-          <span>业务统计A</span>
-        </div>
-        <table id="stuTable" class="table">
-          <thead>
-            <tr>
-              <th>系统名称</th>
-              <th>CPU</th>
-              <th>内存</th>
-              <th>磁盘空间</th>
-              <th>网络</th>
-            </tr>
-          </thead>
-          <tbody>
-            <tr>
-              <td>应用服务器</td>
-              <td>8%</td>
-              <td>23%</td>
-              <td>200G/1T</td>
-              <td>1323/kbps</td>
-            </tr>
-            <tr>
-              <td>应用服务器</td>
-              <td>8%</td>
-              <td>23%</td>
-              <td>200G/1T</td>
-              <td>1323/kbps</td>
-            </tr>
-            <tr>
-              <td>应用服务器</td>
-              <td>8%</td>
-              <td>23%</td>
-              <td>200G/1T</td>
-              <td>1323/kbps</td>
-            </tr>
-            <tr>
-              <td>应用服务器</td>
-              <td>8%</td>
-              <td>23%</td>
-              <td>200G/1T</td>
-              <td>1323/kbps</td>
-            </tr>
-            <tr>
-              <td>应用服务器</td>
-              <td>8%</td>
-              <td>23%</td>
-              <td>200G/1T</td>
-              <td>1323/kbps</td>
-            </tr>
-            <tr>
-              <td>应用服务器</td>
-              <td>8%</td>
-              <td>23%</td>
-              <td>200G/1T</td>
-              <td>1323/kbps</td>
-            </tr>
-          </tbody>
-        </table>
-      </div>
-      <div class="content-right">
-        <div class="title">
-          <span>业务统计B</span>
-        </div>
-        <table id="content-stuTable" class="table">
-          <thead>
-            <tr>
-              <th>系统名称</th>
-              <th>CPU</th>
-              <th>内存</th>
-              <th>磁盘空间</th>
-              <th>网络</th>
-            </tr>
-          </thead>
-          <tbody>
-            <tr>
-              <td>应用服务器</td>
-              <td>8%</td>
-              <td>23%</td>
-              <td>200G/1T</td>
-              <td>1323/kbps</td>
-            </tr>
-          </tbody>
-        </table>
-      </div>
-    </div>
-  </div>
-  <div class="panel-footer"></div>
-</div>
-
-<!-- 工具弹框 -->
-<div class="tools" style="display: none">
-  <div class="containerTool test49Toll">
-    <ul>
-      <li>
-        <span>宽度：</span>
-        <input class="setWidth" type="text" />
-        <span id="validateAge" class="regValidate"></span>
-      </li>
-      <li>
-        <span>高度：</span>
-        <input class="setHeight" type="text" />
-      </li>
-    </ul>
-    <!-- 确定 -->
-    <button class="fixBtn toolBtn">确定</button>
-    <button class="offBtn toolBtn">取消</button>
-  </div>
-</div>
+<div class="box49 box" data-name='test49'>
+    <div class="toolBox">
+        <span class="fit"></span>
+        <span class="close"></span>
+    </div>
+    <div class="tool">
+        <div class="title bgTitle">
+            <h2>受攻击最严重业务系统</h2>
+        </div>
+        <table id="stuTable" class="table">
+          <thead>
+            <tr>
+              <th>系统名称</th>
+              <th>CPU</th>
+              <th>内存</th>
+              <th>磁盘空间</th>
+              <th>网络</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr>
+              <td>应用服务器</td>
+              <td>8%</td>
+              <td>23%</td>
+              <td>200G/1T</td>
+              <td>1323/kbps</td>
+            </tr>
+            <tr>
+              <td>应用服务器</td>
+              <td>8%</td>
+              <td>23%</td>
+              <td>200G/1T</td>
+              <td>1323/kbps</td>
+            </tr>
+            <tr>
+              <td>应用服务器</td>
+              <td>8%</td>
+              <td>23%</td>
+              <td>200G/1T</td>
+              <td>1323/kbps</td>
+            </tr>
+            <tr>
+              <td>应用服务器</td>
+              <td>8%</td>
+              <td>23%</td>
+              <td>200G/1T</td>
+              <td>1323/kbps</td>
+            </tr>
+            <tr>
+              <td>应用服务器</td>
+              <td>8%</td>
+              <td>23%</td>
+              <td>200G/1T</td>
+              <td>1323/kbps</td>
+            </tr>
+            <tr>
+              <td>应用服务器</td>
+              <td>8%</td>
+              <td>23%</td>
+              <td>200G/1T</td>
+              <td>1323/kbps</td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+      <div class="content-right">
+        <div class="title">
+          <div style="width: 13%; height: 100%">
+            <img
+            style="width: 100%; height:100%"
+              src="../images/业务系统图标.png"
+              alt=""
+            />
+          </div>
+          <span>业务统计B</span>
+        </div>
+        <table id="content-stuTable" class="table">
+          <thead>
+            <tr>
+              <th>系统名称</th>
+              <th>CPU</th>
+              <th>内存</th>
+              <th>磁盘空间</th>
+              <th>网络</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr>
+              <td>应用服务器</td>
+              <td>8%</td>
+              <td>23%</td>
+              <td>200G/1T</td>
+              <td>1323/kbps</td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+    </div>
+    <div class="test-box">
+        <div class="content">
+            <!-- 漏洞数据 -->
+            <div class="content-left ">
+                <div class="title">
+                    <span>业务统计A</span>
+                </div>
+                <table id="stuTable" class="table">
+                    <thead>
+                        <tr>
+                            <th>系统名称</th>
+                            <th>CPU</th>
+                            <th>内存</th>
+                            <th>磁盘空间</th>
+                            <th>网络</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr>
+                            <td>应用服务器</td>
+                            <td>8%</td>
+                            <td>23%</td>
+                            <td>200G/1T</td>
+                            <td>1323/kbps</td>
+                        </tr>
+                        <tr>
+                            <td>应用服务器</td>
+                            <td>8%</td>
+                            <td>23%</td>
+                            <td>200G/1T</td>
+                            <td>1323/kbps</td>
+                        </tr>
+                        <tr>
+                            <td>应用服务器</td>
+                            <td>8%</td>
+                            <td>23%</td>
+                            <td>200G/1T</td>
+                            <td>1323/kbps</td>
+                        </tr>
+                        <tr>
+                            <td>应用服务器</td>
+                            <td>8%</td>
+                            <td>23%</td>
+                            <td>200G/1T</td>
+                            <td>1323/kbps</td>
+                        </tr>
+                        <tr>
+                            <td>应用服务器</td>
+                            <td>8%</td>
+                            <td>23%</td>
+                            <td>200G/1T</td>
+                            <td>1323/kbps</td>
+                        </tr>
+                        <tr>
+                            <td>应用服务器</td>
+                            <td>8%</td>
+                            <td>23%</td>
+                            <td>200G/1T</td>
+                            <td>1323/kbps</td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+            <div class="content-right ">
+                <div class="title">
+                    <span>业务统计B</span>
+                </div>
+                <table id="content-stuTable" class="table">
+                    <thead>
+                        <tr>
+                            <th>系统名称</th>
+                            <th>CPU</th>
+                            <th>内存</th>
+                            <th>磁盘空间</th>
+                            <th>网络</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr>
+                            <td>应用服务器</td>
+                            <td>8%</td>
+                            <td>23%</td>
+                            <td>200G/1T</td>
+                            <td>1323/kbps</td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+    <div class="panel-footer"></div>
+
+</div>
+
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none;">
+
+    <div class="containerTool test49Toll">
+        <ul>
+            <li>
+                <span>宽度：</span>
+                <input class="setWidth" type="text">
+                <span id="validateAge" class="regValidate"></span>
+            </li>
+            <li>
+                <span>高度：</span>
+                <input class="setHeight" type="text">
+            </li>
+        </ul>
+        <!-- 确定 -->
+        <button class="fixBtn toolBtn">确定</button>
+        <button class="offBtn toolBtn">取消</button>
+    </div>
+</div>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test50/test50.css

@@ -11,12 +11,14 @@
 .box50 .content .item {
   display: flex;
   align-items: center;
-  font-size: 0.3rem;
+  /* font-size: 0.3rem; */
   width: 43%;
+  height: 48%;
+  margin-top: 1%;
 }
 .box50 .content .item img {
-  width: 37%;
-  height: 68%;
+  width: 70%;
+  height: 92%;
   margin: 0 0.1rem;
 }
 .box50 .content .item .item-box {
@@ -42,11 +44,31 @@
 }
 .box50 .content .item .item-box .temp::after {
   content: "";
-  width: 2px;
+  width: 10px;
   height: 50%;
   background-color: #fff;
   position: absolute;
-  left: 49%;
+  left: 43%;
   top: 50%;
   transform: translate(-50%, -50%);
 }
+#slide {
+  position: absolute;
+  height: 300px;
+  width: 260px;
+  color: #fa8e93;
+  overflow: hidden;
+  border: 1px solid #ccc;
+}
+#slide p {
+  height: 34px;
+  line-height: 34px;
+  overflow: hidden;
+}
+#slide span {
+  float: right;
+}
+@font-face {
+  font-family: "LESLIE";
+  src: url("../../font/LESLIE.TTF");
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test50/test50.html

@@ -1,89 +1,88 @@
-<div class="box50 box" data-name='test50'>
-    <div class="toolBox">
-        <span class="fit"></span>
-        <span class="close"></span>
-    </div>
-    <div class="tool">
-        <div class="title bgTitle">
-            <h2>受攻击最严重业务系统</h2>
-        </div>
-    </div>
-    <div class="test-box">
-        <div class="content">
-            <div class="item" data-id=1>
-                <img src="../images/networkSecurity/pic_kuang.png" alt="">
-                <div class="item-box">
-                    <div>网络核心机房</div>
-                    <div class="temp">
-                        <p>温度：<span>25℃</span></p>
-                        <p>湿度：<span>25℃</span></p>
-                    </div>
-                </div>
-            </div>
-            <div class="item" data-id=2>
-                <img src="../images/networkSecurity/pic_kuang.png" alt="">
-                <div class="item-box">
-                    <div>2号楼中心机房</div>
-                    <div class="temp">
-                        <p>温度：<span>25℃</span></p>
-                        <p>湿度：<span>25℃</span></p>
-                    </div>
-                </div>
-            </div>
-            <div class="item" data-id=3>
-                <img src="../images/networkSecurity/pic_kuang.png" alt="">
-                <div class="item-box">
-                    <div>配线间机房</div>
-                    <div class="temp">
-                        <p>温度：<span>25℃</span></p>
-                        <p>湿度：<span>25℃</span></p>
-                    </div>
-                </div>
-            </div>
-            <div class="item" data-id=4>
-                <img src="../images/networkSecurity/pic_kuang.png" alt="">
-                <div class="item-box">
-                    <div>档案库房</div>
-                    <div class="temp">
-                        <p>温度：<span>25℃</span></p>
-                        <p>湿度：<span>25℃</span></p>
-                    </div>
-                </div>
-            </div>
-            <div class="item" data-id=5>
-                <img src="../images/networkSecurity/pic_kuang.png" alt="">
-                <div class="item-box">
-                    <div>UPS供电机房</div>
-                    <div class="temp">
-                        <p>温度：<span>25℃</span></p>
-                        <p>湿度：<span>25℃</span></p>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </div>
-    <div class="panel-footer"></div>
-
-</div>
-
-
-<!-- 工具弹框 -->
-<div class="tools" style="display: none;">
-
-    <div class="containerTool test50Toll">
-        <ul>
-            <li>
-                <span>宽度：</span>
-                <input class="setWidth" type="text">
-                <span id="validateAge" class="regValidate"></span>
-            </li>
-            <li>
-                <span>高度：</span>
-                <input class="setHeight" type="text">
-            </li>
-        </ul>
-        <!-- 确定 -->
-        <button class="fixBtn toolBtn">确定</button>
-        <button class="offBtn toolBtn">取消</button>
-    </div>
-</div>
+<div class="box50 box" data-name="test50">
+    <div class="toolBox">
+      <span class="fit"></span>
+      <span class="close"></span>
+    </div>
+    <div class="tool">
+      <div class="title bgTitle">
+        <h2>受攻击最严重业务系统</h2>
+      </div>
+    </div>
+    <div class="test-box">
+      <marquee behavior="scroll" direction="up" height="100%">
+        <div class="content">
+          <div class="item" data-id="1">
+            <img src="../images/networkSecurity/pic_kuang.png" alt="" />
+            <div class="item-box">
+              <div>网络核心机房</div>
+              <div class="temp">
+                <p>温度：<span>25℃</span></p>
+                <p>湿度：<span>25℃</span></p>
+              </div>
+            </div>
+          </div>
+          <div class="item" data-id="2">
+            <img src="../images/networkSecurity/pic_kuang.png" alt="" />
+            <div class="item-box">
+              <div>2号楼中心机房</div>
+              <div class="temp">
+                <p>温度：<span>25℃</span></p>
+                <p>湿度：<span>25℃</span></p>
+              </div>
+            </div>
+          </div>
+          <div class="item" data-id="3">
+            <img src="../images/networkSecurity/pic_kuang.png" alt="" />
+            <div class="item-box">
+              <div>配线间机房</div>
+              <div class="temp">
+                <p>温度：<span>25℃</span></p>
+                <p>湿度：<span>25℃</span></p>
+              </div>
+            </div>
+          </div>
+          <div class="item" data-id="4">
+            <img src="../images/networkSecurity/pic_kuang.png" alt="" />
+            <div class="item-box">
+              <div>档案库房</div>
+              <div class="temp">
+                <p>温度：<span>25℃</span></p>
+                <p>湿度：<span>25℃</span></p>
+              </div>
+            </div>
+          </div>
+          <div class="item" data-id="5">
+            <img src="../images/networkSecurity/pic_kuang.png" alt="" />
+            <div class="item-box">
+              <div>UPS供电机房</div>
+              <div class="temp">
+                <p>温度：<span>25℃</span></p>
+                <p>湿度：<span>25℃</span></p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </marquee>
+    </div>
+    <div class="panel-footer"></div>
+  </div>
+  
+  <!-- 工具弹框 -->
+  <div class="tools" style="display: none">
+    <div class="containerTool test50Toll">
+      <ul>
+        <li>
+          <span>宽度：</span>
+          <input class="setWidth" type="text" />
+          <span id="validateAge" class="regValidate"></span>
+        </li>
+        <li>
+          <span>高度：</span>
+          <input class="setHeight" type="text" />
+        </li>
+      </ul>
+      <!-- 确定 -->
+      <button class="fixBtn toolBtn">确定</button>
+      <button class="offBtn toolBtn">取消</button>
+    </div>
+  </div>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test50/test50.js

@@ -1,545 +1,683 @@
-const test50 = (function () {
-  function test50 (id, domTitle) {
-    if (domTitle) {
-      $('.test50 .title h2').text(domTitle)
-    }
-    $('.test50 .box').css('z-index', ++zIndex)
-    $('.test50 .box').attr('data-id', id)
-    move3('.test50 .test-box')
-    move2('.test50 .containerTool')
-
-
-    $('.test50 .close').click(function () {
-      $('.test50 .box').remove();
-      $('.test50 .containerTool').css('display', 'none');
-      $('.test50 .setWidth').val('')
-      $('.test50 .setHeight').val('')
-      moduleIdRemove.push(id)
-    })
-
-    eventClick('.test50');
-
-      // 二号楼中心机房
-    $.ajax({
-      url: ROOM + '/api/devicesignaltable/listByName',
-      data: {
-        "deviceName": '八楼'
-      },
-      success: function ({ data }) {
-        // 温度
-        let temperature = data.filter(item => {
-          return item.signalname==='温度'
-        })[0].signalvalue;
-        // 湿度 
-        let humidity = data.filter(item => {
-          return item.signalname==='湿度'
-        })[0].signalvalue;
-
-        $('.test50 .box50 .item').eq(1).find('.temp').find('span').eq(0).html(temperature +'℃');
-        $('.test50 .box50 .item').eq(1).find('.temp').find('span').eq(1).html(humidity +'℃');
-      },
-      error: function (err) {
-        console.log('--机房接口八楼，二号楼-------------超时');
-      }
-    });
-
-
-    // 网络核心机房
-    $.ajax({
-      url: ROOM + '/api/devicesignaltable/listByName',
-      data: {
-        "deviceName": '四楼'
-      },
-      success: function ({ data }) {
-        // 温度
-        let temperature = data.filter(item => {
-          return item.signalname==='温度'
-        })[0].signalvalue;
-        // 湿度 
-        let humidity = data.filter(item => {
-          return item.signalname==='湿度'
-        })[0].signalvalue;
-        
-        $('.test50 .box50 .item').eq(0).find('.temp').find('span').eq(0).html(temperature +'℃');
-        $('.test50 .box50 .item').eq(0).find('.temp').find('span').eq(1).html(humidity +'℃');
-      },
-      error: function (err) {
-        console.log('--网络核心机房-------------超时');
-      }
-    });
-
-
-    // 配线间机房
-    $.ajax({
-      url: ROOM + '/api/devicesignaltable/listByName',
-      data: {
-        "deviceName": '九楼'
-      },
-      success: function ({ data }) {
-        // 温度
-        let temperature = data.filter(item => {
-          return item.signalname==='温度'
-        })[0].signalvalue;
-        // 湿度 
-        let humidity = data.filter(item => {
-          return item.signalname==='湿度'
-        })[0].signalvalue;
-        $('.test50 .box50 .item').eq(2).find('.temp').find('span').eq(0).html(temperature +'℃');
-        $('.test50 .box50 .item').eq(2).find('.temp').find('span').eq(1).html(humidity +'℃');
-      },
-      error: function (err) {
-        console.log('--配线间机房-------------超时');
-      }
-    });
-
-// 档案室库房
-    $.ajax({
-      /** url，data参数，
-       * type请求类型，响应体结果，超时时间
-       * 成功的回调，失败回调 */
-      url: DH + 'queryData/queryDeviceParam',
-      data: {
-          "urlCode": 'DH_002'
-      },
-      type: 'GET',
-      dataType: 'JSON',
-      success: function({data}) {
-        console.log('档案室库房',data);
-        // 温度
-        let temperature = data.filter(item => {
-          if(item.sname === '环境温度'){
-            return true
-          }
-        }).reduce((cur,item)=>{
-          return cur+parseFloat(item.value);
-        },0);
-        // 湿度 
-        let humidity = data.filter(item => {
-          if(item.sname === '环境湿度'){
-            return true
-          }
-        }).reduce((cur,item)=>{
-          return cur+parseFloat(item.value);
-        },0);
-        $('.test50 .box50 .item').eq(3).find('.temp').find('span').eq(0).html(temperature +'℃');
-        $('.test50 .box50 .item').eq(3).find('.temp').find('span').eq(1).html(humidity +'℃');
-
-      },
-      timeout: 6000,
-      error: function() {
-          console.log('档案室库房超时了');
-      },
-  });
-
-
-    $('.test50 .box50 .item').click(function () {
-
-      const typeId = $(this).attr('data-id')
-
-      const dom52 = document.querySelector('.springFrame5 .box52 .floor-dist');
-      const testDom52 = document.querySelector('.springFrame5 .box52');
-      const dom53 = document.querySelector('.springFrame5 .box53 .floor-dist');
-      const testDom53 = document.querySelector('.springFrame5 .box53');
-      const dom54 = document.querySelector('.springFrame5 .box54 .floor-dist');
-      const testDom54 = document.querySelector('.springFrame5 .box54');
-      const dom58 = document.querySelector('.springFrame5 .box58 .floor-dist');
-      const testDom58 = document.querySelector('.springFrame5 .box58');
-      const dom59 = document.querySelector('.springFrame5 .box59 .floor-dist');
-      const testDom59 = document.querySelector('.springFrame5 .box59');
-
-      setCharts53(dom53, testDom53)
-      setCharts54(dom54, testDom54)
-
-      if(typeId==='1'){ // 网络核心机房
-        fourthFloor();
-      }else if(typeId === '2'){ // 2号楼中心机房
-        eighthFloor();
-      }else if(typeId === '3'){ // 配线间机房
-        ninthFloor()
-      }else if(typeId === '4'){ // 档案库房
-        dasRoom();
-      }else{ // UPS供电机房
-        upsOf();
-      }
-
-      // 二号楼中心机房
-      function eighthFloor() {
-        $.ajax({
-          url: ROOM + '/api/devicesignaltable/listByName',
-          data: {
-            "deviceName": '八楼'
-          },
-          success: function ({ data }) {
-            console.log('机房接口八楼，二号楼', data);
-            // 温度
-            let temperature = data.filter(item => {
-              return item.signalname==='温度'
-            })[0].signalvalue;
-            // 湿度 
-            let humidity = data.filter(item => {
-              return item.signalname==='湿度'
-            })[0].signalvalue;
-            
-            // 漏水位置/米
-            let leackgePosition = data.filter(item => {
-              return item.signalname==='漏水1位置'
-            })[0].signalvalue;
-            // 电阻率
-            let eleRes = data[3].signalvalue;
-            if(isNaN(eleRes)){
-              eleRes = 0;
-            }
-            // 机房水浸状态
-            let waterStauts = data.filter(item => {
-              return item.signalname==='水浸1状态'
-            })[0].signalvalue;
-            // 机房通信状态
-            let comStatus = data[0].signalvalue;
-
-
-            // 开关量
-            let swit = data.filter(item => {
-              return item.signalname.indexOf('开关量')!==-1 && item.signalvalue.indexOf('正常') !== -1;
-            });
-            $('.springFrame5 .box58 .text1').html(comStatus);
-            $('.springFrame5 .box58 .text2').html(waterStauts);
-
-            setValue(temperature,humidity,waterStauts,'-','-','-',swit ? '正常' :'')
-            
-            setCharts52(dom52, testDom52, temperature, humidity)
-            setCharts59(dom59, testDom59, temperature, humidity)
-            setCharts58(dom58, testDom58,leackgePosition,eleRes)
-          },
-          error: function (err) {
-            console.log('--机房接口八楼，二号楼-------------超时');
-          }
-        });
-      }
-
-      // 网络核心机房
-      function fourthFloor() {
-        $.ajax({
-          url: ROOM + '/api/devicesignaltable/listByName',
-          data: {
-            "deviceName": '四楼'
-          },
-          success: function ({ data }) {
-            console.log('网络核心机房', data);
-            // 温度
-            let temperature = data.filter(item => {
-              return item.signalname==='温度'
-            })[0].signalvalue;
-            // 湿度 
-            let humidity = data.filter(item => {
-              return item.signalname==='湿度'
-            })[0].signalvalue;
-            
-            // 漏水位置/米
-            let leackgePosition = data.filter(item => {
-              return item.signalname==='漏水1位置'
-            })[0].signalvalue;
-            // 电阻率
-            let eleRes = data[3].signalvalue;
-            if(isNaN(eleRes)){
-              eleRes = 0;
-            }
-            // 机房温湿度状态
-            let waterStauts = data.filter(item => {
-              return item.devicename==="四楼机房温湿度1" && item.signalname==='通信状态'
-            })[0].signalvalue;
-
-            // 机房水浸通信状态
-            let comStatus = data.filter(item => {
-              return item.devicename==="四楼机房水浸1" && item.signalname==='通信状态'
-            })[0].signalvalue;
-
-            // 机房水浸1状态
-            let sStatus = data.filter(item => {
-              return item.devicename==="四楼机房水浸1" && item.signalname==="水浸1状态"
-            })[0].signalvalue;
-
-            // 消防状态模块-通信状态
-            let xfStatus = data.filter(item => {
-              return item.devicename==="四楼机房消防状态模块1" && item.signalname==='通信状态'
-            })[0].signalvalue;
-            // 消防状态模块-主机状态
-            let zjStatus = data.filter(item => {
-              return item.devicename==="四楼机房消防状态模块1" && item.signalname==="四楼2#消防主机状态"
-            })[0].signalvalue;
-
-             // 消防状态模块-开关量2
-             let kgStatus = data.filter(item => {
-              return item.devicename==="四楼机房空开状态模块3" && item.signalname==="开关量1"
-            })[0].signalvalue;
-
-            setValue(temperature,humidity,sStatus,'-','-',kgStatus,'')
-
-            $('.springFrame5 .box58 .text1').html(comStatus);
-            $('.springFrame5 .box58 .text2').html(sStatus);
-            $('.springFrame5 .box59 .Water-immersion-text').html(waterStauts);
-            $('.springFrame5 .box60 .text1').html(xfStatus);
-            $('.springFrame5 .box60 .text2').html(zjStatus);
-            $('.springFrame5 .box60 .text3').html(kgStatus);
-            setCharts52(dom52, testDom52, temperature, humidity)
-            setCharts59(dom59, testDom59, temperature, humidity)
-            setCharts58(dom58, testDom58,leackgePosition,eleRes)
-          },
-          error: function (err) {
-            console.log('--网络核心机房-------------超时');
-          }
-        });
-      }
-
-      // 配线间机房
-      function ninthFloor() {
-        $.ajax({
-          url: ROOM + '/api/devicesignaltable/listByName',
-          data: {
-            "deviceName": '九楼'
-          },
-          success: function ({ data }) {
-            console.log('配线间机房', data);
-            // 温度
-            let temperature = data.filter(item => {
-              return item.signalname==='温度'
-            })[0].signalvalue;
-            // 湿度 
-            let humidity = data.filter(item => {
-              return item.signalname==='湿度'
-            })[0].signalvalue;
-            
-            // 漏水位置/米
-            let leackgePosition = data.filter(item => {
-              return item.signalname==='漏水1位置'
-            })[0].signalvalue;
-            // 电阻率
-            let eleRes = data[3].signalvalue; // d
-            if(isNaN(eleRes)){
-              eleRes = 0;
-            }
-            // 机房温湿度状态
-            let waterStauts = data.filter(item => {
-              return item.devicename==="九楼机房温湿度4" && item.signalname==='通信状态'
-            })[0].signalvalue;
-
-            // 机房水浸通信状态
-            let comStatus = data.filter(item => {
-              return item.devicename==="九楼机房水浸3" && item.signalname==='通信状态'
-            })[0].signalvalue;
-
-            // 机房水浸1状态
-            let sStatus = data.filter(item => {
-              return item.signalname==="水浸1状态"
-            })[0].signalvalue;
-
-            setValue(temperature,humidity,sStatus,'-','-','-','')
-
-
-            $('.springFrame5 .box58 .text1').html(comStatus);
-            $('.springFrame5 .box58 .text2').html(sStatus);
-            $('.springFrame5 .box59 .Water-immersion-text').html(waterStauts);
-            setCharts52(dom52, testDom52, temperature, humidity)
-            setCharts59(dom59, testDom59, temperature, humidity)
-            setCharts58(dom58, testDom58,leackgePosition,eleRes)
-          },
-          error: function (err) {
-            console.log('--配线间机房-------------超时');
-          }
-        });
-      }
-
-     
-
-      // 档案室库房
-      function dasRoom() {
-        $.ajax({
-          /** url，data参数，
-           * type请求类型，响应体结果，超时时间
-           * 成功的回调，失败回调 */
-          url: DH + 'queryData/queryDeviceParam',
-          data: {
-              "urlCode": 'DH_002'
-          },
-          type: 'GET',
-          dataType: 'JSON',
-          success: function({data}) {
-            console.log('档案室库房',data);
-            // 温度
-            let temperature,
-            
-           curtemp = data.filter(item => {
-              if(item.sname === '环境温度'){
-                return true
-              }
-            });
-            temperature = (curtemp.reduce((cur,item)=>{
-              return cur+parseInt(item.value);
-            },0) / curtemp.length).toFixed(2);
-
-            // 湿度 
-            let humidity,
-            curhum = data.filter(item => {
-              if(item.sname === '环境湿度'){
-                return true
-              }
-            })
-           humidity = (curhum.reduce((cur,item)=>{
-              return cur+parseInt(item.value);
-            },0) / curhum.length).toFixed(2);
-
-
-            setValue(temperature,humidity,'-','-','-','-','')
-
-
-            setCharts52(dom52, testDom52, temperature, humidity)
-            setCharts59(dom59, testDom59, temperature, humidity)
-
-            let index = 0;
-           const status = data.filter(item => {
-              return item.sname.indexOf('状态') !== -1;
-            });
-            console.log('各种状态',status);
-            $('.Water-immersion-box-one').each(function () {
-              $(this).find('.Water-immersion-box-title').find('div').eq(1).html(status[index].sname)
-              $(this).find('.Water-immersion-text').html(status[index].value === 'true' ? '正常' : '异常')
-              index++;
-            })
-
-
-
-            // setCharts58(dom58, testDom58,leackgePosition,eleRes)
-          },
-          timeout: 6000,
-          error: function() {
-              console.log('档案室库房超时了');
-          },
-      });
-      }
-
-      // UPS供电机房
-      function upsOf() {
-        $.ajax({
-          url: ROOM + '/api/devicesignaltable/listByName',
-          data: {
-            "deviceName": 'UPS'
-          },
-          success:function ({data}) {
-            console.log('UPS供电机房',data);
-          },
-          error: function (err) {
-            console.log('--UPS供电机房-------------超时');
-          }
-        });
-      }
-
-
-      function setValue(temperature,humidity,water,smoke,ups,swit,isToll) {
-        $('.springFrame5 .box55 .box-box').eq(0).find('.temperature-box-one').eq(0).find('div').eq(2).html(temperature+'°')
-        $('.springFrame5 .box55 .box-box').eq(0).find('.temperature-box-one').eq(1).find('div').eq(2).html(humidity+'RH%')
-        $('.springFrame5 .box55 .box-box').eq(0).find('.temperature-box-one').eq(2).find('div').eq(2).html(water)
-
-
-        $('.springFrame5 .box55 .box-box').eq(1).find('.temperature-box-one').eq(0).find('div').eq(2).html(smoke)
-        $('.springFrame5 .box55 .box-box').eq(1).find('.temperature-box-one').eq(1).find('div').eq(2).html(ups)
-        $('.springFrame5 .box55 .box-box').eq(1).find('.temperature-box-one').eq(2).find('div').eq(2).html(swit)
-
-        // 温度是否过高
-        $('.springFrame5 .box55 .text-box').html(isToll)
-      }
-
-
-       // 告警信息
-   $.ajax({
-    /** url，data参数，
-     * type请求类型，响应体结果，超时时间
-     * 成功的回调，失败回调 */
-    url: DH + 'queryData/queryWarningInfo',
-    type: 'GET',
-    dataType: 'JSON',
-    success: function({data}) {
-      console.log('告警信息',data);
-      const html = data.map((item,index) => {
-        let level = '一级';
-        switch (item.level) {
-          case 1:
-            level = '一级';
-            break;
-            case 2:
-            level = '二级';
-            break;
-            case 3:
-            level = '三级';
-            break;
-            case 4:
-            level = '四级';
-            break;
-            case 5:
-            level = '五级';
-            break;
-          default:
-            level = '六级';
-            break;
-        }
-        return `
-        <tr>
-          <td>${index+1}</td>
-          <td>${item.aname}</td>
-          <td>${item.description}</td>
-          <td>${level}</td>
-          <td>${item.eventtime}</td>
-        </tr>
-        `
-      }).join('')
-      $('.springFrame5 .box56 tbody').html(html)
-    },
-    timeout: 6000,
-    error: function() {
-        console.log('告警信息超时了');
-    },
-});
-
-
-      roomIndex = $(this).index();
-      // roomIndex = 9
-      if (roomIndex === 0) {
-        $('.roomThree62').css('visibility', 'inherit');
-        $('.roomThree63').css('visibility', 'hidden');
-        $('.roomThree64').css('visibility', 'hidden');
-        $('.roomThree65').css('visibility', 'hidden');
-        $('.roomThree66').css('visibility', 'hidden');
-        module62();
-      } else if (roomIndex === 1) {
-        $('.roomThree62').css('visibility', 'hidden');
-        $('.roomThree63').css('visibility', 'inherit');
-        $('.roomThree64').css('visibility', 'hidden');
-        $('.roomThree65').css('visibility', 'hidden');
-        $('.roomThree66').css('visibility', 'hidden');
-        module63();
-      } else if (roomIndex === 2) {
-        $('.roomThree62 ').css('visibility', 'hidden');
-        $('.roomThree63').css('visibility', 'hidden');
-        $('.roomThree64').css('visibility', 'inherit');
-        $('.roomThree65').css('visibility', 'hidden');
-        $('.roomThree66').css('visibility', 'hidden');
-        module64();
-      } else if (roomIndex === 3) {
-        $('.roomThree62').css('visibility', 'hidden');
-        $('.roomThree63').css('visibility', 'hidden');
-        $('.roomThree64').css('visibility', 'hidden');
-        $('.roomThree65').css('visibility', 'inherit');
-        $('.roomThree66').css('visibility', 'hidden');
-        module65();
-      } else {
-        // $('.roomThree62').css('visibility', 'hidden');
-        // $('.roomThree63').css('visibility', 'hidden');
-        // $('.roomThree64').css('visibility', 'hidden');
-        // $('.roomThree65').css('visibility', 'hidden');
-        // $('.roomThree66').css('visibility', 'inherit');
-        // module66();
-      }
-      $(".sf5").slideToggle();
-    })
-  }
-
-  return test50
-})();
+const test50 = (function () {
+  function test50(id, domTitle) {
+    if (domTitle) {
+      $(".test50 .title h2").text(domTitle);
+    }
+    $(".test50 .box").css("z-index", ++zIndex);
+    $(".test50 .box").attr("data-id", id);
+    move3(".test50 .test-box");
+    move2(".test50 .containerTool");
+
+    $(".test50 .close").click(function () {
+      $(".test50 .box").remove();
+      $(".test50 .containerTool").css("display", "none");
+      $(".test50 .setWidth").val("");
+      $(".test50 .setHeight").val("");
+      moduleIdRemove.push(id);
+    });
+    eventClick(".test50");
+    // var speed = 40;
+    // var slide = document.getElementById("slide");
+    // var slide2 = document.getElementById("slide2");
+    // var slide1 = document.getElementById("slide1");
+    // slide2.innerHTML = slide1.innerHTML;
+    // function Marquee() {
+    //   if (slide2.offsetTop - slide.scrollTop <= 0)
+    //     slide.scrollTop -= slide1.offsetHeight;
+    //   else {
+    //     slide.scrollTop++;
+    //   }
+    // }
+    // var MyMar = setInterval(Marquee, speed);
+    // slide.onmouseover = function () {
+    //   clearInterval(MyMar);
+    // };
+    // slide.onmouseout = function () {
+    //   MyMar = setInterval(Marquee, speed);
+    // };
+    // 二号楼中心机房
+    $.ajax({
+      url: ROOM + "/api/devicesignaltable/listByName",
+      data: {
+        deviceName: "八楼",
+      },
+      success: function ({ data }) {
+        // 温度
+        let temperature = data.filter((item) => {
+          return item.signalname === "温度";
+        })[0].signalvalue;
+        // 湿度
+        let humidity = data.filter((item) => {
+          return item.signalname === "湿度";
+        })[0].signalvalue;
+
+        $(".test50 .box50 .item")
+          .eq(1)
+          .find(".temp")
+          .find("span")
+          .eq(0)
+          .html(temperature + "℃");
+        $(".test50 .box50 .item")
+          .eq(1)
+          .find(".temp")
+          .find("span")
+          .eq(1)
+          .html(humidity + "℃");
+      },
+      error: function (err) {
+        console.log("--机房接口八楼，二号楼-------------超时");
+      },
+    });
+
+    // 网络核心机房
+    $.ajax({
+      url: ROOM + "/api/devicesignaltable/listByName",
+      data: {
+        deviceName: "四楼",
+      },
+      success: function ({ data }) {
+        // 温度
+        let temperature = data.filter((item) => {
+          return item.signalname === "温度";
+        })[0].signalvalue;
+        // 湿度
+        let humidity = data.filter((item) => {
+          return item.signalname === "湿度";
+        })[0].signalvalue;
+
+        $(".test50 .box50 .item")
+          .eq(0)
+          .find(".temp")
+          .find("span")
+          .eq(0)
+          .html(temperature + "℃");
+        $(".test50 .box50 .item")
+          .eq(0)
+          .find(".temp")
+          .find("span")
+          .eq(1)
+          .html(humidity + "℃");
+      },
+      error: function (err) {
+        console.log("--网络核心机房-------------超时");
+      },
+    });
+
+    // 配线间机房
+    $.ajax({
+      url: ROOM + "/api/devicesignaltable/listByName",
+      data: {
+        deviceName: "九楼",
+      },
+      success: function ({ data }) {
+        // 温度
+        let temperature = data.filter((item) => {
+          return item.signalname === "温度";
+        })[0].signalvalue;
+        // 湿度
+        let humidity = data.filter((item) => {
+          return item.signalname === "湿度";
+        })[0].signalvalue;
+        $(".test50 .box50 .item")
+          .eq(2)
+          .find(".temp")
+          .find("span")
+          .eq(0)
+          .html(temperature + "℃");
+        $(".test50 .box50 .item")
+          .eq(2)
+          .find(".temp")
+          .find("span")
+          .eq(1)
+          .html(humidity + "℃");
+      },
+      error: function (err) {
+        console.log("--配线间机房-------------超时");
+      },
+    });
+
+    // 档案室库房
+    $.ajax({
+      /** url，data参数，
+       * type请求类型，响应体结果，超时时间
+       * 成功的回调，失败回调 */
+      url: DH + "queryData/queryDeviceParam",
+      data: {
+        urlCode: "DH_002",
+      },
+      type: "GET",
+      dataType: "JSON",
+      success: function ({ data }) {
+        console.log("档案室库房", data);
+        // 温度
+        let temperature = data
+          .filter((item) => {
+            if (item.sname === "环境温度") {
+              return true;
+            }
+          })
+          .reduce((cur, item) => {
+            return cur + parseFloat(item.value);
+          }, 0);
+        // 湿度
+        let humidity = data
+          .filter((item) => {
+            if (item.sname === "环境湿度") {
+              return true;
+            }
+          })
+          .reduce((cur, item) => {
+            return cur + parseFloat(item.value);
+          }, 0);
+        $(".test50 .box50 .item")
+          .eq(3)
+          .find(".temp")
+          .find("span")
+          .eq(0)
+          .html(temperature + "℃");
+        $(".test50 .box50 .item")
+          .eq(3)
+          .find(".temp")
+          .find("span")
+          .eq(1)
+          .html(humidity + "℃");
+      },
+      timeout: 6000,
+      error: function () {
+        console.log("档案室库房超时了");
+      },
+    });
+
+    $(".test50 .box50 .item").click(function () {
+      const typeId = $(this).attr("data-id");
+
+      const dom52 = document.querySelector(".springFrame5 .box52 .floor-dist");
+      const testDom52 = document.querySelector(".springFrame5 .box52");
+      const dom53 = document.querySelector(".springFrame5 .box53 .floor-dist");
+      const testDom53 = document.querySelector(".springFrame5 .box53");
+      const dom54 = document.querySelector(".springFrame5 .box54 .floor-dist");
+      const testDom54 = document.querySelector(".springFrame5 .box54");
+      const dom58 = document.querySelector(".springFrame5 .box58 .floor-dist");
+      const testDom58 = document.querySelector(".springFrame5 .box58");
+      const dom59 = document.querySelector(".springFrame5 .box59 .floor-dist");
+      const testDom59 = document.querySelector(".springFrame5 .box59");
+
+      setCharts53(dom53, testDom53);
+      setCharts54(dom54, testDom54);
+
+      if (typeId === "1") {
+        // 网络核心机房
+        fourthFloor();
+      } else if (typeId === "2") {
+        // 2号楼中心机房
+        eighthFloor();
+      } else if (typeId === "3") {
+        // 配线间机房
+        ninthFloor();
+      } else if (typeId === "4") {
+        // 档案库房
+        dasRoom();
+      } else {
+        // UPS供电机房
+        upsOf();
+      }
+
+      // 二号楼中心机房
+      function eighthFloor() {
+        $.ajax({
+          url: ROOM + "/api/devicesignaltable/listByName",
+          data: {
+            deviceName: "八楼",
+          },
+          success: function ({ data }) {
+            console.log("机房接口八楼，二号楼", data);
+            // 温度
+            let temperature = data.filter((item) => {
+              return item.signalname === "温度";
+            })[0].signalvalue;
+            // 湿度
+            let humidity = data.filter((item) => {
+              return item.signalname === "湿度";
+            })[0].signalvalue;
+
+            // 漏水位置/米
+            let leackgePosition = data.filter((item) => {
+              return item.signalname === "漏水1位置";
+            })[0].signalvalue;
+            // 电阻率
+            let eleRes = data[3].signalvalue;
+            if (isNaN(eleRes)) {
+              eleRes = 0;
+            }
+            // 机房水浸状态
+            let waterStauts = data.filter((item) => {
+              return item.signalname === "水浸1状态";
+            })[0].signalvalue;
+            // 机房通信状态
+            let comStatus = data[0].signalvalue;
+
+            // 开关量
+            let swit = data.filter((item) => {
+              return (
+                item.signalname.indexOf("开关量") !== -1 &&
+                item.signalvalue.indexOf("正常") !== -1
+              );
+            });
+            $(".springFrame5 .box58 .text1").html(comStatus);
+            $(".springFrame5 .box58 .text2").html(waterStauts);
+
+            setValue(
+              temperature,
+              humidity,
+              waterStauts,
+              "-",
+              "-",
+              "-",
+              swit ? "正常" : ""
+            );
+
+            setCharts52(dom52, testDom52, temperature, humidity);
+            setCharts59(dom59, testDom59, temperature, humidity);
+            setCharts58(dom58, testDom58, leackgePosition, eleRes);
+          },
+          error: function (err) {
+            console.log("--机房接口八楼，二号楼-------------超时");
+          },
+        });
+      }
+
+      // 网络核心机房
+      function fourthFloor() {
+        $.ajax({
+          url: ROOM + "/api/devicesignaltable/listByName",
+          data: {
+            deviceName: "四楼",
+          },
+          success: function ({ data }) {
+            console.log("网络核心机房", data);
+            // 温度
+            let temperature = data.filter((item) => {
+              return item.signalname === "温度";
+            })[0].signalvalue;
+            // 湿度
+            let humidity = data.filter((item) => {
+              return item.signalname === "湿度";
+            })[0].signalvalue;
+
+            // 漏水位置/米
+            let leackgePosition = data.filter((item) => {
+              return item.signalname === "漏水1位置";
+            })[0].signalvalue;
+            // 电阻率
+            let eleRes = data[3].signalvalue;
+            if (isNaN(eleRes)) {
+              eleRes = 0;
+            }
+            // 机房温湿度状态
+            let waterStauts = data.filter((item) => {
+              return (
+                item.devicename === "四楼机房温湿度1" &&
+                item.signalname === "通信状态"
+              );
+            })[0].signalvalue;
+
+            // 机房水浸通信状态
+            let comStatus = data.filter((item) => {
+              return (
+                item.devicename === "四楼机房水浸1" &&
+                item.signalname === "通信状态"
+              );
+            })[0].signalvalue;
+
+            // 机房水浸1状态
+            let sStatus = data.filter((item) => {
+              return (
+                item.devicename === "四楼机房水浸1" &&
+                item.signalname === "水浸1状态"
+              );
+            })[0].signalvalue;
+
+            // 消防状态模块-通信状态
+            let xfStatus = data.filter((item) => {
+              return (
+                item.devicename === "四楼机房消防状态模块1" &&
+                item.signalname === "通信状态"
+              );
+            })[0].signalvalue;
+            // 消防状态模块-主机状态
+            let zjStatus = data.filter((item) => {
+              return (
+                item.devicename === "四楼机房消防状态模块1" &&
+                item.signalname === "四楼2#消防主机状态"
+              );
+            })[0].signalvalue;
+
+            // 消防状态模块-开关量2
+            let kgStatus = data.filter((item) => {
+              return (
+                item.devicename === "四楼机房空开状态模块3" &&
+                item.signalname === "开关量1"
+              );
+            })[0].signalvalue;
+
+            setValue(temperature, humidity, sStatus, "-", "-", kgStatus, "");
+
+            $(".springFrame5 .box58 .text1").html(comStatus);
+            $(".springFrame5 .box58 .text2").html(sStatus);
+            $(".springFrame5 .box59 .Water-immersion-text").html(waterStauts);
+            $(".springFrame5 .box60 .text1").html(xfStatus);
+            $(".springFrame5 .box60 .text2").html(zjStatus);
+            $(".springFrame5 .box60 .text3").html(kgStatus);
+            setCharts52(dom52, testDom52, temperature, humidity);
+            setCharts59(dom59, testDom59, temperature, humidity);
+            setCharts58(dom58, testDom58, leackgePosition, eleRes);
+          },
+          error: function (err) {
+            console.log("--网络核心机房-------------超时");
+          },
+        });
+      }
+
+      // 配线间机房
+      function ninthFloor() {
+        $.ajax({
+          url: ROOM + "/api/devicesignaltable/listByName",
+          data: {
+            deviceName: "九楼",
+          },
+          success: function ({ data }) {
+            console.log("配线间机房", data);
+            // 温度
+            let temperature = data.filter((item) => {
+              return item.signalname === "温度";
+            })[0].signalvalue;
+            // 湿度
+            let humidity = data.filter((item) => {
+              return item.signalname === "湿度";
+            })[0].signalvalue;
+
+            // 漏水位置/米
+            let leackgePosition = data.filter((item) => {
+              return item.signalname === "漏水1位置";
+            })[0].signalvalue;
+            // 电阻率
+            let eleRes = data[3].signalvalue; // d
+            if (isNaN(eleRes)) {
+              eleRes = 0;
+            }
+            // 机房温湿度状态
+            let waterStauts = data.filter((item) => {
+              return (
+                item.devicename === "九楼机房温湿度4" &&
+                item.signalname === "通信状态"
+              );
+            })[0].signalvalue;
+
+            // 机房水浸通信状态
+            let comStatus = data.filter((item) => {
+              return (
+                item.devicename === "九楼机房水浸3" &&
+                item.signalname === "通信状态"
+              );
+            })[0].signalvalue;
+
+            // 机房水浸1状态
+            let sStatus = data.filter((item) => {
+              return item.signalname === "水浸1状态";
+            })[0].signalvalue;
+
+            setValue(temperature, humidity, sStatus, "-", "-", "-", "");
+
+            $(".springFrame5 .box58 .text1").html(comStatus);
+            $(".springFrame5 .box58 .text2").html(sStatus);
+            $(".springFrame5 .box59 .Water-immersion-text").html(waterStauts);
+            setCharts52(dom52, testDom52, temperature, humidity);
+            setCharts59(dom59, testDom59, temperature, humidity);
+            setCharts58(dom58, testDom58, leackgePosition, eleRes);
+          },
+          error: function (err) {
+            console.log("--配线间机房-------------超时");
+          },
+        });
+      }
+
+      // 档案室库房
+      function dasRoom() {
+        $.ajax({
+          /** url，data参数，
+           * type请求类型，响应体结果，超时时间
+           * 成功的回调，失败回调 */
+          url: DH + "queryData/queryDeviceParam",
+          data: {
+            urlCode: "DH_002",
+          },
+          type: "GET",
+          dataType: "JSON",
+          success: function ({ data }) {
+            console.log("档案室库房", data);
+            // 温度
+            let temperature,
+              curtemp = data.filter((item) => {
+                if (item.sname === "环境温度") {
+                  return true;
+                }
+              });
+            temperature = (
+              curtemp.reduce((cur, item) => {
+                return cur + parseInt(item.value);
+              }, 0) / curtemp.length
+            ).toFixed(2);
+
+            // 湿度
+            let humidity,
+              curhum = data.filter((item) => {
+                if (item.sname === "环境湿度") {
+                  return true;
+                }
+              });
+            humidity = (
+              curhum.reduce((cur, item) => {
+                return cur + parseInt(item.value);
+              }, 0) / curhum.length
+            ).toFixed(2);
+
+            setValue(temperature, humidity, "-", "-", "-", "-", "");
+
+            setCharts52(dom52, testDom52, temperature, humidity);
+            setCharts59(dom59, testDom59, temperature, humidity);
+
+            let index = 0;
+            const status = data.filter((item) => {
+              return item.sname.indexOf("状态") !== -1;
+            });
+            console.log("各种状态", status);
+            $(".Water-immersion-box-one").each(function () {
+              $(this)
+                .find(".Water-immersion-box-title")
+                .find("div")
+                .eq(1)
+                .html(status[index].sname);
+              $(this)
+                .find(".Water-immersion-text")
+                .html(status[index].value === "true" ? "正常" : "异常");
+              index++;
+            });
+
+            // setCharts58(dom58, testDom58,leackgePosition,eleRes)
+          },
+          timeout: 6000,
+          error: function () {
+            console.log("档案室库房超时了");
+          },
+        });
+      }
+
+      // UPS供电机房
+      function upsOf() {
+        $.ajax({
+          url: ROOM + "/api/devicesignaltable/listByName",
+          data: {
+            deviceName: "UPS",
+          },
+          success: function ({ data }) {
+            console.log("UPS供电机房", data);
+          },
+          error: function (err) {
+            console.log("--UPS供电机房-------------超时");
+          },
+        });
+      }
+
+      function setValue(
+        temperature,
+        humidity,
+        water,
+        smoke,
+        ups,
+        swit,
+        isToll
+      ) {
+        $(".springFrame5 .box55 .box-box")
+          .eq(0)
+          .find(".temperature-box-one")
+          .eq(0)
+          .find("div")
+          .eq(2)
+          .html(temperature + "°");
+        $(".springFrame5 .box55 .box-box")
+          .eq(0)
+          .find(".temperature-box-one")
+          .eq(1)
+          .find("div")
+          .eq(2)
+          .html(humidity + "RH%");
+        $(".springFrame5 .box55 .box-box")
+          .eq(0)
+          .find(".temperature-box-one")
+          .eq(2)
+          .find("div")
+          .eq(2)
+          .html(water);
+
+        $(".springFrame5 .box55 .box-box")
+          .eq(1)
+          .find(".temperature-box-one")
+          .eq(0)
+          .find("div")
+          .eq(2)
+          .html(smoke);
+        $(".springFrame5 .box55 .box-box")
+          .eq(1)
+          .find(".temperature-box-one")
+          .eq(1)
+          .find("div")
+          .eq(2)
+          .html(ups);
+        $(".springFrame5 .box55 .box-box")
+          .eq(1)
+          .find(".temperature-box-one")
+          .eq(2)
+          .find("div")
+          .eq(2)
+          .html(swit);
+
+        // 温度是否过高
+        $(".springFrame5 .box55 .text-box").html(isToll);
+      }
+
+      // 告警信息
+      $.ajax({
+        /** url，data参数，
+         * type请求类型，响应体结果，超时时间
+         * 成功的回调，失败回调 */
+        url: DH + "queryData/queryWarningInfo",
+        type: "GET",
+        dataType: "JSON",
+        success: function ({ data }) {
+          console.log("告警信息", data);
+          const html = data
+            .map((item, index) => {
+              let level = "一级";
+              switch (item.level) {
+                case 1:
+                  level = "一级";
+                  break;
+                case 2:
+                  level = "二级";
+                  break;
+                case 3:
+                  level = "三级";
+                  break;
+                case 4:
+                  level = "四级";
+                  break;
+                case 5:
+                  level = "五级";
+                  break;
+                default:
+                  level = "六级";
+                  break;
+              }
+              return `
+        <tr>
+          <td>${index + 1}</td>
+          <td>${item.aname}</td>
+          <td>${item.description}</td>
+          <td>${level}</td>
+          <td>${item.eventtime}</td>
+        </tr>
+        `;
+            })
+            .join("");
+          $(".springFrame5 .box56 tbody").html(html);
+        },
+        timeout: 6000,
+        error: function () {
+          console.log("告警信息超时了");
+        },
+      });
+
+      roomIndex = $(this).index();
+      roomIndex = 9;
+      if (roomIndex === 0) {
+        $(".roomThree62").css("visibility", "inherit");
+        $(".roomThree63").css("visibility", "hidden");
+        $(".roomThree64").css("visibility", "hidden");
+        $(".roomThree65").css("visibility", "hidden");
+        $(".roomThree66").css("visibility", "hidden");
+        module62();
+      } else if (roomIndex === 1) {
+        $(".roomThree62").css("visibility", "hidden");
+        $(".roomThree63").css("visibility", "inherit");
+        $(".roomThree64").css("visibility", "hidden");
+        $(".roomThree65").css("visibility", "hidden");
+        $(".roomThree66").css("visibility", "hidden");
+        module63();
+      } else if (roomIndex === 2) {
+        $(".roomThree62 ").css("visibility", "hidden");
+        $(".roomThree63").css("visibility", "hidden");
+        $(".roomThree64").css("visibility", "inherit");
+        $(".roomThree65").css("visibility", "hidden");
+        $(".roomThree66").css("visibility", "hidden");
+        module64();
+      } else if (roomIndex === 3) {
+        $(".roomThree62").css("visibility", "hidden");
+        $(".roomThree63").css("visibility", "hidden");
+        $(".roomThree64").css("visibility", "hidden");
+        $(".roomThree65").css("visibility", "inherit");
+        $(".roomThree66").css("visibility", "hidden");
+        module65();
+      } else {
+        // $('.roomThree62').css('visibility', 'hidden');
+        // $('.roomThree63').css('visibility', 'hidden');
+        // $('.roomThree64').css('visibility', 'hidden');
+        // $('.roomThree65').css('visibility', 'hidden');
+        // $('.roomThree66').css('visibility', 'inherit');
+        // module66();
+      }
+      $(".sf5").slideToggle();
+    });
+  }
+
+  return test50;
+})();

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test53/test53.css

@@ -1,7 +1,7 @@
-.box53 .test-box {
-  padding: 0;
-}
-.box53 .content {
-  margin: 0;
-  padding: 0;
-}
+.box53 .test-box {
+  padding: 0;
+}
+.box53 .content {
+  margin: 0;
+  padding: 0;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test53/test53.js

@@ -1,230 +1,230 @@
-const test53 = (function() {
-    function test53(id, domTitle) {
-        if (domTitle) {
-            $(".test53 .title h2").text(domTitle);
-        }
-        $(".test53 .box").css("z-index", ++zIndex);
-        $(".test53 .box").attr("data-id", id);
-        move3(".test53 .test-box");
-        move2(".test53 .containerTool");
-
-
-        $(".test53 .close").click(function() {
-            $(".test53 .box").remove();
-            $(".test53 .containerTool").css("display", "none");
-            $(".test53 .setWidth").val("");
-            $(".test53 .setHeight").val("");
-            moduleIdRemove.push(id);
-        });
-
-        eventClick(".test53");
-
-        const dists = document.querySelectorAll(".test53 .floor-dist");
-        const testDoms = document.querySelectorAll(".test53 .box");
-        for (let i = 0; i < dists.length; i++) {
-            const dom = dists[i];
-            setCharts(dom, testDoms[i]);
-        }
-
-        // let myChart = echarts.init(dists[0]);
-
-
-    }
-
-    function setCharts(echartDom, testDom) {
-        let timer = null;
-
-        var myChart = echarts.init(echartDom);
-        // 地图背景颜色
-        data = [{
-                name: "空调",
-                value: (Math.random() * 10).toFixed(0),
-                sum: 10,
-            },
-            {
-                name: "配电",
-                value: (Math.random() * 10).toFixed(0),
-                sum: 10,
-            },
-            {
-                name: "UPS",
-                value: (Math.random() * 10).toFixed(0),
-                sum: 10,
-            },
-            {
-                name: "温湿度",
-                value: (Math.random() * 10).toFixed(0),
-                sum: 10,
-            },
-            {
-                name: "烟感",
-                value: (Math.random() * 10).toFixed(0),
-                sum: 10,
-            },
-            {
-                name: "漏水",
-                value: (Math.random() * 10).toFixed(0),
-                sum: 10,
-            },
-        ];
-        getArrByKey = (data, k) => {
-            let key = k || "value";
-            let res = [];
-            if (data) {
-                data.forEach(function(t) {
-                    res.push(t[key]);
-                });
-            }
-            return res;
-        };
-        opt = {
-            index: 0,
-        };
-        color = ["#f85e35", "#d68f52", "#3fa4a9"];
-        data = data.sort((a, b) => {
-            return b.value - a.value;
-        });
-        option = {
-            grid: {
-                top: "2%",
-                bottom: -15,
-                right: 30,
-                left: -30,
-                containLabel: true,
-            },
-            xAxis: {
-                show: false,
-            },
-            yAxis: [{
-                    triggerEvent: true,
-                    show: true,
-                    inverse: true,
-                    data: getArrByKey(data, "name"),
-                    axisLine: {
-                        show: false,
-                    },
-                    splitLine: {
-                        show: false,
-                    },
-                    axisTick: {
-                        show: false,
-                    },
-                    axisLabel: {
-                        interval: 0,
-                        color: "#fff",
-                        align: "left",
-                        margin: 80,
-                        fontSize: 13,
-                        formatter: function(value, index) {
-                            if (opt.index === 0 && index < 3) {
-                                return (
-                                    "{idx" + index + "|" + (1 + index) + "} {title|" + value + "}"
-                                );
-                            } else if (opt.index !== 0 && index + opt.index < 9) {
-                                return (
-                                    "{idx|0" + (1 + index + opt.index) + "} {title|" + value + "}"
-                                );
-                            } else {
-                                return (
-                                    "{idx|" + (1 + index + opt.index) + "} {title|" + value + "}"
-                                );
-                            }
-                        },
-                        rich: {
-                            idx0: {
-                                color: "#FB375E",
-                                backgroundColor: "#FFE8EC",
-                                borderRadius: 100,
-                                padding: [5, 8],
-                            },
-                            idx1: {
-                                color: "#FF9023",
-                                backgroundColor: "#FFEACF",
-                                borderRadius: 100,
-                                padding: [5, 8],
-                            },
-                            idx2: {
-                                color: "#01B599",
-                                backgroundColor: "#E1F7F3",
-                                borderRadius: 100,
-                                padding: [5, 8],
-                            },
-                            idx: {
-                                color: "#fff",
-                                borderRadius: 100,
-                                padding: [5, 8],
-                            },
-                            title: {
-                                width: 165,
-                            },
-                        },
-                    },
-                },
-                {
-                    triggerEvent: true,
-                    show: true,
-                    inverse: true,
-                    data: getArrByKey(data, "name"),
-                    axisLine: {
-                        show: false,
-                    },
-                    splitLine: {
-                        show: false,
-                    },
-                    axisTick: {
-                        show: false,
-                    },
-                    axisLabel: {
-                        interval: 0,
-                        color: "#fff",
-                        align: "left",
-                        margin: 20,
-                        fontSize: 13,
-                        formatter: function(value, index) {
-                            return data[index].value + "条";
-                        },
-                    },
-                },
-            ],
-            series: [{
-                name: "条",
-                type: "bar",
-                yAxisIndex: 0,
-                data: data,
-                barWidth: 10,
-                itemStyle: {
-                    color: (val) => {
-                        if (val.dataIndex < 3 && opt.index === 0) {
-                            return color[val.dataIndex];
-                        } else {
-                            return "#1990FF";
-                        }
-                    },
-                    barBorderRadius: 30,
-                },
-            }, ],
-        };
-
-        if (option) {
-            myChart.setOption(option);
-        }
-
-        window.addEventListener("resize", function() {
-            if (timer) {
-                clearTimeout(timer);
-                timer = null;
-            }
-            timer = setTimeout(() => {
-                move3(".test53 .test-box");
-
-                myChart.resize();
-            }, 500);
-        });
-
-        if (!testDom) {
-            testDom = document.querySelectorAll(".test53 .box");
-        }
-        obsDom(testDom, myChart);
-    }
-    return test53;
+const test53 = (function() {
+    function test53(id, domTitle) {
+        if (domTitle) {
+            $(".test53 .title h2").text(domTitle);
+        }
+        $(".test53 .box").css("z-index", ++zIndex);
+        $(".test53 .box").attr("data-id", id);
+        move3(".test53 .test-box");
+        move2(".test53 .containerTool");
+
+
+        $(".test53 .close").click(function() {
+            $(".test53 .box").remove();
+            $(".test53 .containerTool").css("display", "none");
+            $(".test53 .setWidth").val("");
+            $(".test53 .setHeight").val("");
+            moduleIdRemove.push(id);
+        });
+
+        eventClick(".test53");
+
+        const dists = document.querySelectorAll(".test53 .floor-dist");
+        const testDoms = document.querySelectorAll(".test53 .box");
+        for (let i = 0; i < dists.length; i++) {
+            const dom = dists[i];
+            setCharts(dom, testDoms[i]);
+        }
+
+        // let myChart = echarts.init(dists[0]);
+
+
+    }
+
+    function setCharts(echartDom, testDom) {
+        let timer = null;
+
+        var myChart = echarts.init(echartDom);
+        // 地图背景颜色
+        data = [{
+                name: "空调",
+                value: (Math.random() * 10).toFixed(0),
+                sum: 10,
+            },
+            {
+                name: "配电",
+                value: (Math.random() * 10).toFixed(0),
+                sum: 10,
+            },
+            {
+                name: "UPS",
+                value: (Math.random() * 10).toFixed(0),
+                sum: 10,
+            },
+            {
+                name: "温湿度",
+                value: (Math.random() * 10).toFixed(0),
+                sum: 10,
+            },
+            {
+                name: "烟感",
+                value: (Math.random() * 10).toFixed(0),
+                sum: 10,
+            },
+            {
+                name: "漏水",
+                value: (Math.random() * 10).toFixed(0),
+                sum: 10,
+            },
+        ];
+        getArrByKey = (data, k) => {
+            let key = k || "value";
+            let res = [];
+            if (data) {
+                data.forEach(function(t) {
+                    res.push(t[key]);
+                });
+            }
+            return res;
+        };
+        opt = {
+            index: 0,
+        };
+        color = ["#f85e35", "#d68f52", "#3fa4a9"];
+        data = data.sort((a, b) => {
+            return b.value - a.value;
+        });
+        option = {
+            grid: {
+                top: "2%",
+                bottom: -15,
+                right: 30,
+                left: -30,
+                containLabel: true,
+            },
+            xAxis: {
+                show: false,
+            },
+            yAxis: [{
+                    triggerEvent: true,
+                    show: true,
+                    inverse: true,
+                    data: getArrByKey(data, "name"),
+                    axisLine: {
+                        show: false,
+                    },
+                    splitLine: {
+                        show: false,
+                    },
+                    axisTick: {
+                        show: false,
+                    },
+                    axisLabel: {
+                        interval: 0,
+                        color: "#fff",
+                        align: "left",
+                        margin: 80,
+                        fontSize: 13,
+                        formatter: function(value, index) {
+                            if (opt.index === 0 && index < 3) {
+                                return (
+                                    "{idx" + index + "|" + (1 + index) + "} {title|" + value + "}"
+                                );
+                            } else if (opt.index !== 0 && index + opt.index < 9) {
+                                return (
+                                    "{idx|0" + (1 + index + opt.index) + "} {title|" + value + "}"
+                                );
+                            } else {
+                                return (
+                                    "{idx|" + (1 + index + opt.index) + "} {title|" + value + "}"
+                                );
+                            }
+                        },
+                        rich: {
+                            idx0: {
+                                color: "#FB375E",
+                                backgroundColor: "#FFE8EC",
+                                borderRadius: 100,
+                                padding: [5, 8],
+                            },
+                            idx1: {
+                                color: "#FF9023",
+                                backgroundColor: "#FFEACF",
+                                borderRadius: 100,
+                                padding: [5, 8],
+                            },
+                            idx2: {
+                                color: "#01B599",
+                                backgroundColor: "#E1F7F3",
+                                borderRadius: 100,
+                                padding: [5, 8],
+                            },
+                            idx: {
+                                color: "#fff",
+                                borderRadius: 100,
+                                padding: [5, 8],
+                            },
+                            title: {
+                                width: 165,
+                            },
+                        },
+                    },
+                },
+                {
+                    triggerEvent: true,
+                    show: true,
+                    inverse: true,
+                    data: getArrByKey(data, "name"),
+                    axisLine: {
+                        show: false,
+                    },
+                    splitLine: {
+                        show: false,
+                    },
+                    axisTick: {
+                        show: false,
+                    },
+                    axisLabel: {
+                        interval: 0,
+                        color: "#fff",
+                        align: "left",
+                        margin: 20,
+                        fontSize: 13,
+                        formatter: function(value, index) {
+                            return data[index].value + "条";
+                        },
+                    },
+                },
+            ],
+            series: [{
+                name: "条",
+                type: "bar",
+                yAxisIndex: 0,
+                data: data,
+                barWidth: 10,
+                itemStyle: {
+                    color: (val) => {
+                        if (val.dataIndex < 3 && opt.index === 0) {
+                            return color[val.dataIndex];
+                        } else {
+                            return "#1990FF";
+                        }
+                    },
+                    barBorderRadius: 30,
+                },
+            }, ],
+        };
+
+        if (option) {
+            myChart.setOption(option);
+        }
+
+        window.addEventListener("resize", function() {
+            if (timer) {
+                clearTimeout(timer);
+                timer = null;
+            }
+            timer = setTimeout(() => {
+                move3(".test53 .test-box");
+
+                myChart.resize();
+            }, 500);
+        });
+
+        if (!testDom) {
+            testDom = document.querySelectorAll(".test53 .box");
+        }
+        obsDom(testDom, myChart);
+    }
+    return test53;
 })();

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test54/test54.css

@@ -1,7 +1,7 @@
-.box54 .test-box {
-  padding: 0;
-}
-.box54 .content {
-  margin: 0;
-  padding: 0;
-}
+.box54 .test-box {
+  padding: 0;
+}
+.box54 .content {
+  margin: 0;
+  padding: 0;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test55/test55.css

@@ -1,40 +1,41 @@
-.box55 .test-box {
-  padding: 0;
-}
-.box55 .content {
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-direction: row;
-}
-.box55 .temperature-box {
-  width: 60%;
-  color: #fff;
-}
-.box55 .box-box {
-  margin-top: 20%;
-  display: flex;
-}
-.box55 .temperature-box-one {
-  width: 33%;
-  height: 50px;
-  line-height: 170px;
-  font-size: 0.15rem !important;
-}
-.box55 .Horizontal-line {
-  border: 1px dashed #fff;
-  width: 75%;
-}
-
-.box55 .floor-dist {
-  width: 40%;
-}
-.box55 .text-box {
-  margin-top: 12%;
-  margin-left: 10%;
-  text-align: center;
-  display: flex;
-}
-.box55 .text-one{
-  margin-left: 5%;
-}
+.box55 .test-box {
+  padding: 0;
+}
+.box55 .content {
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: row;
+}
+.box55 .temperature-box {
+  width: 60%;
+  color: #fff;
+}
+.box55 .box-box {
+  margin-top: 7%;
+  display: flex;
+  margin-bottom: 29%;
+}
+.box55 .temperature-box-one {
+  width: 33%;
+  height: 50px;
+  line-height: 170px;
+  font-size: 0.15rem !important;
+}
+.box55 .Horizontal-line {
+  border: 1px dashed #fff;
+  width: 75%;
+}
+
+.box55 .floor-dist {
+  width: 40%;
+}
+.box55 .text-box {
+  margin-top: 12%;
+  margin-left: 10%;
+  text-align: center;
+  display: flex;
+}
+.box55 .text-one{
+  margin-left: 5%;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test55/test55.html

@@ -1,87 +1,87 @@
-<div class="box55 box" data-name="test55">
-  <div class="toolBox">
-    <span class="fit"></span>
-    <span class="close"></span>
-  </div>
-  <div class="test-box">
-    <div class="content">
-      <div class="floor-dist"></div>
-      <div class="temperature-box">
-        <div class="box-box">
-          <div class="temperature-box-one">
-            <div>温度</div>
-            <div class="Horizontal-line"></div>
-            <div>35°</div>
-          </div>
-          <div class="temperature-box-one">
-            <div>湿度</div>
-            <div class="Horizontal-line"></div>
-            <div>62.5RH%</div>
-          </div>
-          <div class="temperature-box-one">
-            <div>水寖</div>
-            <div class="Horizontal-line"></div>
-            <div>正常</div>
-          </div>
-        </div>
-        <div class="box-box">
-          <div class="temperature-box-one">
-            <div>烟雾</div>
-            <div class="Horizontal-line"></div>
-            <div>正常</div>
-          </div>
-          <div class="temperature-box-one">
-            <div>UPS</div>
-            <div class="Horizontal-line"></div>
-            <div>正常</div>
-          </div>
-          <div class="temperature-box-one">
-            <div>开关</div>
-            <div class="Horizontal-line"></div>
-            <div>正常</div>
-          </div>
-        </div>
-        <div class="text-box">
-          <svg
-            t="1650274281428"
-            class="icon"
-            viewBox="0 0 1024 1024"
-            version="1.1"
-            xmlns="http://www.w3.org/2000/svg"
-            p-id="2773"
-            width="20"
-            height="20"
-          >
-            <path
-              d="M944.256 926.4c-31.04 0-820.8 0-865.792 0-44.288 0-65.856-52.16-46.4-91.968C58.688 780.096 441.216 136.064 465.088 90.176c21.376-41.216 72.384-41.92 93.76 0 32.576 63.808 413.248 704.96 432 742.272C1014.464 879.104 984.576 926.4 944.256 926.4L944.256 926.4zM466.496 332.736l30.464 319.616 45.632 0 30.528-319.616L466.496 332.736 466.496 332.736zM573.12 698.112 466.496 698.112l0 91.264 106.624 0L573.12 698.112 573.12 698.112z"
-              p-id="2774"
-              fill="#d81e06"
-            ></path>
-          </svg>
-          <div class="text-one">温度过高</div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="panel-footer"></div>
-</div>
-
-<!-- 工具弹框 -->
-<div class="tools" style="display: none">
-  <div class="containerTool test55Toll">
-    <ul>
-      <li>
-        <span>宽度：</span>
-        <input class="setWidth" type="text" />
-        <span id="validateAge" class="regValidate"></span>
-      </li>
-      <li>
-        <span>高度：</span>
-        <input class="setHeight" type="text" />
-      </li>
-    </ul>
-    <!-- 确定 -->
-    <button class="fixBtn toolBtn">确定</button>
-    <button class="offBtn toolBtn">取消</button>
-  </div>
-</div>
+<div class="box55 box" data-name="test55">
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="test-box">
+    <div class="content">
+      <div class="floor-dist"></div>
+      <div class="temperature-box">
+        <div class="box-box">
+          <div class="temperature-box-one">
+            <div style="font-size: 0.11rem !important;">温度</div>
+            <div class="Horizontal-line"></div>
+            <div style="font-size: 0.11rem !important;">35°</div>
+          </div>
+          <div class="temperature-box-one">
+            <div style="font-size: 0.11rem !important;">湿度</div>
+            <div class="Horizontal-line"></div>
+            <div style="font-size: 0.11rem !important;">62.5RH%</div>
+          </div>
+          <div class="temperature-box-one">
+            <div style="font-size: 0.11rem !important;">水寖</div>
+            <div class="Horizontal-line"></div>
+            <div style="font-size: 0.11rem !important;">正常</div>
+          </div>
+        </div>
+        <div class="box-box">
+          <div class="temperature-box-one">
+            <div style="font-size: 0.11rem !important;">烟雾</div>
+            <div class="Horizontal-line"></div>
+            <div style="font-size: 0.11rem !important;">正常</div>
+          </div>
+          <div class="temperature-box-one">
+            <div style="font-size: 0.11rem !important;">UPS</div>
+            <div class="Horizontal-line"></div>
+            <div style="font-size: 0.11rem !important;">正常</div>
+          </div>
+          <div class="temperature-box-one">
+            <div style="font-size: 0.11rem !important;">开关</div>
+            <div class="Horizontal-line"></div>
+            <div style="font-size: 0.11rem !important;">正常</div>
+          </div>
+        </div>
+        <div class="text-box">
+          <svg
+            t="1650274281428"
+            class="icon"
+            viewBox="0 0 1024 1024"
+            version="1.1"
+            xmlns="http://www.w3.org/2000/svg"
+            p-id="2773"
+            width="300"
+            height="250"
+            style="margin-top: -2%;"            >
+            <path
+              d="M944.256 926.4c-31.04 0-820.8 0-865.792 0-44.288 0-65.856-52.16-46.4-91.968C58.688 780.096 441.216 136.064 465.088 90.176c21.376-41.216 72.384-41.92 93.76 0 32.576 63.808 413.248 704.96 432 742.272C1014.464 879.104 984.576 926.4 944.256 926.4L944.256 926.4zM466.496 332.736l30.464 319.616 45.632 0 30.528-319.616L466.496 332.736 466.496 332.736zM573.12 698.112 466.496 698.112l0 91.264 106.624 0L573.12 698.112 573.12 698.112z"
+              p-id="2774"
+              fill="#d81e06"
+            ></path>
+          </svg>
+          <div class="text-one">温度过高</div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="panel-footer"></div>
+</div>
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none">
+  <div class="containerTool test55Toll">
+    <ul>
+      <li>
+        <span>宽度：</span>
+        <input class="setWidth" type="text" />
+        <span id="validateAge" class="regValidate"></span>
+      </li>
+      <li>
+        <span>高度：</span>
+        <input class="setHeight" type="text" />
+      </li>
+    </ul>
+    <!-- 确定 -->
+    <button class="fixBtn toolBtn">确定</button>
+    <button class="offBtn toolBtn">取消</button>
+  </div>
+</div>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test58/test58.css

@@ -1,44 +1,47 @@
-.box58 .test-box {
-  padding: 0;
-}
-.box58 .content {
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-direction: row;
-}
-.box58 .floor-dist {
-  width: 50%;
-  margin-top: 5%;
-}
-.Water-immersion {
-  width: 50%;
-  height: 100%;
-  margin-top: 5%;
-  display: flex;
-}
-.Water-immersion-text {
-  color: #fff;
-  margin-top: 15%;
-  font-style: italic;
-}
-.Water-immersion-box-one {
-  width: 30%;
-  height: 40%;
-  background: #1e3e5d;
-  border-radius: 20%;
-  text-align: center;
-  margin-left: 5%;
-}
-.Water-immersion-box-title {
-  margin: auto;
-  margin-top: 5px;
-  width: 90%;
-  height: 50%;
-  border-radius: 20%;
-  color: #fff;
-  background: #22578b;
-}
-.Water-immersion-box-svg {
-  padding: 5px;
-}
+.box58 .test-box {
+  padding: 0;
+}
+.box58 .content {
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: row;
+}
+.box58 .floor-dist {
+  width: 50%;
+  margin-top: 5%;
+}
+.Water-immersion {
+  width: 50%;
+  height: 100%;
+  margin-top: 5%;
+  display: flex;
+}
+.Water-immersion-text {
+  color: #fff;
+  margin-top: 15%;
+  font-style: italic;
+}
+.Water-immersion-box-one {
+  width: 30%;
+  height: 40%;
+  background: #1e3e5d;
+  border-radius: 20%;
+  text-align: center;
+  margin-left: 5%;
+}
+.Water-immersion-box-title {
+  margin: auto;
+  margin-top: 5px;
+  width: 90%;
+  height: 50%;
+  border-radius: 20%;
+  color: #fff;
+  background: #22578b;
+}
+.Water-immersion-box-svg {
+  padding: 5px;
+}
+.Water-immersion-box-title-text{
+  font-size: 0.11rem !important;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test58/test58.html

@@ -1,87 +1,87 @@
-<div class="box58 box" data-name="test58">
-  <div class="toolBox">
-    <span class="fit"></span>
-    <span class="close"></span>
-  </div>
-  <div class="tool">
-    <div class="title bgTitle">
-      <h2>test58</h2>
-    </div>
-  </div>
-  <div class="test-box">
-    <div class="content">
-      <div class="Water-immersion">
-        <div class="Water-immersion-box-one">
-          <div class="Water-immersion-box-title">
-            <div class="Water-immersion-box-svg">
-              <svg
-                t="1650283656534"
-                class="icon"
-                viewBox="0 0 1024 1024"
-                version="1.1"
-                xmlns="http://www.w3.org/2000/svg"
-                p-id="1578"
-                width="20"
-                height="20"
-              >
-                <path
-                  d="M478.462882 476.972344L304.069869 973.321689h496.349345L626.026201 475.481805z"
-                  fill="#1296db"
-                  p-id="1579"
-                ></path>
-                <path
-                  d="M682.666667 535.103348c55.149927-40.244541 90.922853-105.828239 90.922853-178.864629C773.58952 234.014556 673.723435 134.148472 551.499272 134.148472c-123.714702 0-223.580786 99.866084-223.580786 222.090247 0 74.526929 37.263464 140.110626 93.90393 181.845706l19.377002-55.149927c-35.772926-31.30131-58.131004-76.017467-58.131005-126.695779 0-92.413392 74.526929-166.94032 166.940321-166.94032 92.413392 0 166.94032 74.526929 166.94032 166.94032 0 49.187773-20.86754 92.413392-55.149927 123.714702l20.86754 55.149927z"
-                  fill="#1296db"
-                  p-id="1580"
-                ></path>
-                <path
-                  d="M551.499272 356.238719m-86.451237 0a86.451237 86.451237 0 1 0 172.902474 0 86.451237 86.451237 0 1 0-172.902474 0Z"
-                  fill="#1296db"
-                  p-id="1581"
-                ></path>
-                <path
-                  d="M386.049491 640.931587l19.377001-53.659389c-77.508006-49.187773-128.186317-134.148472-128.186317-231.033479 0-150.544396 122.224163-274.259098 274.259097-274.259097 150.544396 0 274.259098 122.224163 274.259098 274.259097 0 95.394469-49.187773 180.355167-125.20524 229.54294l17.886462 53.659389c96.885007-58.131004 160.978166-163.959243 160.978166-283.202329 0-181.845706-147.563319-329.409025-327.918486-329.409025-181.845706 0-329.409025 147.563319-329.409025 329.409025 0 120.733624 65.583697 226.561863 163.959244 284.692868z"
-                  fill="#1296db"
-                  p-id="1582"
-                ></path>
-              </svg>
-            </div>
-            <div>通信状态</div>
-          </div>
-          <div class="Water-immersion-text">正常</div>
-        </div>
-        <div class="Water-immersion-box-one">
-          <div class="Water-immersion-box-title">
-            <div class="Water-immersion-box-svg">
-              <img src="../../font/水滴.png" alt="" />
-            </div>
-            <div>水滴1正常</div>
-          </div>
-          <div class="Water-immersion-text">正常</div>
-        </div>
-      </div>
-      <div class="floor-dist"></div>
-    </div>
-  </div>
-  <div class="panel-footer"></div>
-</div>
-
-<!-- 工具弹框 -->
-<div class="tools" style="display: none">
-  <div class="containerTool test58Toll">
-    <ul>
-      <li>
-        <span>宽度：</span>
-        <input class="setWidth" type="text" />
-        <span id="validateAge" class="regValidate"></span>
-      </li>
-      <li>
-        <span>高度：</span>
-        <input class="setHeight" type="text" />
-      </li>
-    </ul>
-    <!-- 确定 -->
-    <button class="fixBtn toolBtn">确定</button>
-    <button class="offBtn toolBtn">取消</button>
-  </div>
-</div>
+<div class="box58 box" data-name="test58">
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="tool">
+    <div class="title bgTitle">
+      <h2>test58</h2>
+    </div>
+  </div>
+  <div class="test-box">
+    <div class="content">
+      <div class="Water-immersion">
+        <div class="Water-immersion-box-one">
+          <div class="Water-immersion-box-title">
+            <div class="Water-immersion-box-svg">
+              <svg
+                t="1650283656534"
+                class="icon"
+                viewBox="0 0 1024 1024"
+                version="1.1"
+                xmlns="http://www.w3.org/2000/svg"
+                p-id="1578"
+                width="300"
+                height="250"
+              >
+                <path
+                  d="M478.462882 476.972344L304.069869 973.321689h496.349345L626.026201 475.481805z"
+                  fill="#1296db"
+                  p-id="1579"
+                ></path>
+                <path
+                  d="M682.666667 535.103348c55.149927-40.244541 90.922853-105.828239 90.922853-178.864629C773.58952 234.014556 673.723435 134.148472 551.499272 134.148472c-123.714702 0-223.580786 99.866084-223.580786 222.090247 0 74.526929 37.263464 140.110626 93.90393 181.845706l19.377002-55.149927c-35.772926-31.30131-58.131004-76.017467-58.131005-126.695779 0-92.413392 74.526929-166.94032 166.940321-166.94032 92.413392 0 166.94032 74.526929 166.94032 166.94032 0 49.187773-20.86754 92.413392-55.149927 123.714702l20.86754 55.149927z"
+                  fill="#1296db"
+                  p-id="1580"
+                ></path>
+                <path
+                  d="M551.499272 356.238719m-86.451237 0a86.451237 86.451237 0 1 0 172.902474 0 86.451237 86.451237 0 1 0-172.902474 0Z"
+                  fill="#1296db"
+                  p-id="1581"
+                ></path>
+                <path
+                  d="M386.049491 640.931587l19.377001-53.659389c-77.508006-49.187773-128.186317-134.148472-128.186317-231.033479 0-150.544396 122.224163-274.259098 274.259097-274.259097 150.544396 0 274.259098 122.224163 274.259098 274.259097 0 95.394469-49.187773 180.355167-125.20524 229.54294l17.886462 53.659389c96.885007-58.131004 160.978166-163.959243 160.978166-283.202329 0-181.845706-147.563319-329.409025-327.918486-329.409025-181.845706 0-329.409025 147.563319-329.409025 329.409025 0 120.733624 65.583697 226.561863 163.959244 284.692868z"
+                  fill="#1296db"
+                  p-id="1582"
+                ></path>
+              </svg>
+            </div>
+            <div class="Water-immersion-box-title-text">通信状态</div>
+          </div>
+          <div class="Water-immersion-text">正常</div>
+        </div>
+        <div class="Water-immersion-box-one">
+          <div class="Water-immersion-box-title">
+            <div class="Water-immersion-box-svg">
+              <img class="Water-immersion-box-img" src="../../font/水滴.png" alt="" />
+            </div>
+            <div class="Water-immersion-box-title-text">水滴1正常</div>
+          </div>
+          <div class="Water-immersion-text">正常</div>
+        </div>
+      </div>
+      <div class="floor-dist"></div>
+    </div>
+  </div>
+  <div class="panel-footer"></div>
+</div>
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none">
+  <div class="containerTool test58Toll">
+    <ul>
+      <li>
+        <span>宽度：</span>
+        <input class="setWidth" type="text" />
+        <span id="validateAge" class="regValidate"></span>
+      </li>
+      <li>
+        <span>高度：</span>
+        <input class="setHeight" type="text" />
+      </li>
+    </ul>
+    <!-- 确定 -->
+    <button class="fixBtn toolBtn">确定</button>
+    <button class="offBtn toolBtn">取消</button>
+  </div>
+</div>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test59/test59.css

@@ -1,44 +1,51 @@
-.box59 .test-box {
-  padding: 0;
-}
-.box59 .content {
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-direction: row;
-}
-.box59 .floor-dist {
-  width: 50%;
-  margin-top: 5%;
-}
-.Water-immersion {
-  width: 50%;
-  height: 100%;
-  margin-top: 5%;
-  display: flex;
-}
-.Water-immersion-text {
-  color: #fff;
-  margin-top: 15%;
-  font-style: italic;
-}
-.Water-immersion-box-one {
-  width: 30%;
-  height: 40%;
-  background: #1e3e5d;
-  border-radius: 20%;
-  text-align: center;
-  margin-left: 5%;
-}
-.Water-immersion-box-title {
-  margin: auto;
-  margin-top: 5px;
-  width: 90%;
-  height: 50%;
-  border-radius: 20%;
-  color: #fff;
-  background: #22578b;
-}
-.Water-immersion-box-svg {
-  padding: 5px;
-}
+.box59 .test-box {
+  padding: 0;
+}
+.box59 .content {
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: row;
+}
+.box59 .floor-dist {
+  width: 50%;
+  margin-top: 5%;
+}
+.Water-immersion {
+  width: 50%;
+  height: 100%;
+  margin-top: 5%;
+  display: flex;
+}
+.Water-immersion-text {
+  color: #fff;
+  margin-top: 15%;
+  font-style: italic;
+}
+.Water-immersion-box-one {
+  width: 30%;
+  height: 40%;
+  background: #1e3e5d;
+  border-radius: 20%;
+  text-align: center;
+  margin-left: 5%;
+}
+.Water-immersion-box-title {
+  margin: auto;
+  margin-top: 5px;
+  width: 90%;
+  height: 50%;
+  border-radius: 20%;
+  color: #fff;
+  background: #22578b;
+}
+.Water-immersion-box-svg {
+  padding: 5px;
+}
+.Water-immersion-box-title-text {
+  font-size: 0.11rem !important;
+}
+.Water-immersion-box-img{
+  width: 250px;
+  height: 250px ;
+}                                                                                                         

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test59/test59.html

@@ -1,78 +1,78 @@
-<div class="box59 box" data-name="test59">
-  <div class="toolBox">
-    <span class="fit"></span>
-    <span class="close"></span>
-  </div>
-  <div class="tool">
-    <div class="title bgTitle">
-      <h2>test59</h2>
-    </div>
-  </div>
-  <div class="test-box">
-    <div class="content">
-      <div class="Water-immersion">
-        <div class="Water-immersion-box-one">
-          <div class="Water-immersion-box-title">
-            <div class="Water-immersion-box-svg">
-              <svg
-                t="1650283656534"
-                class="icon"
-                viewBox="0 0 1024 1024"
-                version="1.1"
-                xmlns="http://www.w3.org/2000/svg"
-                p-id="1578"
-                width="20"
-                height="20"
-              >
-                <path
-                  d="M478.462882 476.972344L304.069869 973.321689h496.349345L626.026201 475.481805z"
-                  fill="#1296db"
-                  p-id="1579"
-                ></path>
-                <path
-                  d="M682.666667 535.103348c55.149927-40.244541 90.922853-105.828239 90.922853-178.864629C773.59952 234.014556 673.723435 134.148472 551.499272 134.148472c-123.714702 0-223.590786 99.866084-223.590786 222.090247 0 74.526929 37.263464 140.110626 93.90393 181.845706l19.377002-55.149927c-35.772926-31.30131-59.131004-76.017467-59.131005-126.695779 0-92.413392 74.526929-166.94032 166.940321-166.94032 92.413392 0 166.94032 74.526929 166.94032 166.94032 0 49.187773-20.86754 92.413392-55.149927 123.714702l20.86754 55.149927z"
-                  fill="#1296db"
-                  p-id="1590"
-                ></path>
-                <path
-                  d="M551.499272 356.238719m-86.451237 0a86.451237 86.451237 0 1 0 172.902474 0 86.451237 86.451237 0 1 0-172.902474 0Z"
-                  fill="#1296db"
-                  p-id="1591"
-                ></path>
-                <path
-                  d="M386.049491 640.931597l19.377001-53.659389c-77.508006-49.187773-128.186317-134.148472-128.186317-231.033479 0-150.544396 122.224163-274.259098 274.259097-274.259097 150.544396 0 274.259098 122.224163 274.259098 274.259097 0 95.394469-49.187773 180.355167-125.20524 229.54294l17.886462 53.659389c96.885007-59.131004 160.978166-163.959243 160.978166-283.202329 0-181.845706-147.563319-329.409025-327.918486-329.409025-181.845706 0-329.409025 147.563319-329.409025 329.409025 0 120.733624 65.593697 226.561863 163.959244 284.692868z"
-                  fill="#1296db"
-                  p-id="1592"
-                ></path>
-              </svg>
-            </div>
-            <div>通信状态</div>
-          </div>
-          <div class="Water-immersion-text">正常</div>
-        </div>
-      </div>
-      <div class="floor-dist"></div>
-    </div>
-  </div>
-  <div class="panel-footer"></div>
-</div>
-
-<!-- 工具弹框 -->
-<div class="tools" style="display: none">
-  <div class="containerTool test59Toll">
-    <ul>
-      <li>
-        <span>宽度：</span>
-        <input class="setWidth" type="text" />
-        <span id="validateAge" class="regValidate"></span>
-      </li>
-      <li>
-        <span>高度：</span>
-        <input class="setHeight" type="text" />
-      </li>
-    </ul>
-    <!-- 确定 -->
-    <button class="fixBtn toolBtn">确定</button>
-    <button class="offBtn toolBtn">取消</button>
-  </div>
-</div>
+<div class="box59 box" data-name="test59">
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="tool">
+    <div class="title bgTitle">
+      <h2>test59</h2>
+    </div>
+  </div>
+  <div class="test-box">
+    <div class="content">
+      <div class="Water-immersion">
+        <div class="Water-immersion-box-one">
+          <div class="Water-immersion-box-title">
+            <div class="Water-immersion-box-svg">
+              <svg
+                t="1650283656534"
+                class="icon"
+                viewBox="0 0 1024 1024"
+                version="1.1"
+                xmlns="http://www.w3.org/2000/svg"
+                p-id="1578"
+                width="300"
+                height="250"
+              >
+                <path
+                  d="M478.462882 476.972344L304.069869 973.321689h496.349345L626.026201 475.481805z"
+                  fill="#1296db"
+                  p-id="1579"
+                ></path>
+                <path
+                  d="M682.666667 535.103348c55.149927-40.244541 90.922853-105.828239 90.922853-178.864629C773.59952 234.014556 673.723435 134.148472 551.499272 134.148472c-123.714702 0-223.590786 99.866084-223.590786 222.090247 0 74.526929 37.263464 140.110626 93.90393 181.845706l19.377002-55.149927c-35.772926-31.30131-59.131004-76.017467-59.131005-126.695779 0-92.413392 74.526929-166.94032 166.940321-166.94032 92.413392 0 166.94032 74.526929 166.94032 166.94032 0 49.187773-20.86754 92.413392-55.149927 123.714702l20.86754 55.149927z"
+                  fill="#1296db"
+                  p-id="1590"
+                ></path>
+                <path
+                  d="M551.499272 356.238719m-86.451237 0a86.451237 86.451237 0 1 0 172.902474 0 86.451237 86.451237 0 1 0-172.902474 0Z"
+                  fill="#1296db"
+                  p-id="1591"
+                ></path>
+                <path
+                  d="M386.049491 640.931597l19.377001-53.659389c-77.508006-49.187773-128.186317-134.148472-128.186317-231.033479 0-150.544396 122.224163-274.259098 274.259097-274.259097 150.544396 0 274.259098 122.224163 274.259098 274.259097 0 95.394469-49.187773 180.355167-125.20524 229.54294l17.886462 53.659389c96.885007-59.131004 160.978166-163.959243 160.978166-283.202329 0-181.845706-147.563319-329.409025-327.918486-329.409025-181.845706 0-329.409025 147.563319-329.409025 329.409025 0 120.733624 65.593697 226.561863 163.959244 284.692868z"
+                  fill="#1296db"
+                  p-id="1592"
+                ></path>
+              </svg>
+            </div>
+            <div class="Water-immersion-box-title-text">通信状态</div>
+          </div>
+          <div class="Water-immersion-text">正常</div>
+        </div>
+      </div>
+      <div class="floor-dist"></div>
+    </div>
+  </div>
+  <div class="panel-footer"></div>
+</div>
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none">
+  <div class="containerTool test59Toll">
+    <ul>
+      <li>
+        <span>宽度：</span>
+        <input class="setWidth" type="text" />
+        <span id="validateAge" class="regValidate"></span>
+      </li>
+      <li>
+        <span>高度：</span>
+        <input class="setHeight" type="text" />
+      </li>
+    </ul>
+    <!-- 确定 -->
+    <button class="fixBtn toolBtn">确定</button>
+    <button class="offBtn toolBtn">取消</button>
+  </div>
+</div>

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test60/test60.css

@@ -1,43 +1,46 @@
-.box60 .test-box {
-  padding: 0;
-}
-.box60 .content {
-  margin: 0;
-  padding: 0;
-  display: flex;
-  flex-direction: row;
-}
-.box60 .floor-dist {
-  width: 50%;
-}
-.Water-immersion {
-  width: 90%;
-  height: 100%;
-  margin-top: 10%;
-  display: flex;
-}
-.Water-immersion-text {
-  color: #fff;
-  margin-top: 15%;
-  font-style: italic;
-}
-.Water-immersion-box-one {
-  width: 38%;
-  height: 65%;
-  background: #1e3e5d;
-  border-radius: 20%;
-  text-align: center;
-  margin-left: 5%;
-}
-.Water-immersion-box-title {
-  margin: auto;
-  margin-top: 5px;
-  width: 90%;
-  height: 50%;
-  border-radius: 20%;
-  color: #fff;
-  background: #22578b;
-}
-.Water-immersion-box-svg {
-  padding: 5px;
-}
+.box60 .test-box {
+  padding: 0;
+}
+.box60 .content {
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: row;
+}
+.box60 .floor-dist {
+  width: 50%;
+}
+.Water-immersion {
+  width: 90%;
+  height: 100%;
+  margin-top: 10%;
+  display: flex;
+}
+.Water-immersion-text {
+  color: #fff;
+  margin-top: 15%;
+  font-style: italic;
+}
+.Water-immersion-box-one {
+  width: 38%;
+  height: 65%;
+  background: #1e3e5d;
+  border-radius: 20%;
+  text-align: center;
+  margin-left: 5%;
+}
+.Water-immersion-box-title {
+  margin: auto;
+  margin-top: 5px;
+  width: 90%;
+  height: 50%;
+  border-radius: 20%;
+  color: #fff;
+  background: #22578b;
+}
+.Water-immersion-box-svg {
+  padding: 5px;
+}
+.Water-immersion-box-title-text {
+  font-size: 0.11rem !important;
+}

spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test60/test60.html

@@ -1,77 +1,77 @@
-<div class="box60 box" data-name="test60">
-  <div class="toolBox">
-    <span class="fit"></span>
-    <span class="close"></span>
-  </div>
-  <div class="tool">
-    <div class="title bgTitle">
-      <h2>test60</h2>
-    </div>
-  </div>
-  <div class="test-box">
-    <div class="content">
-      <div class="Water-immersion">
-        <div class="Water-immersion-box-one">
-          <div class="Water-immersion-box-title">
-            <div class="Water-immersion-box-svg">
-              <svg
-                t="1650283656534"
-                class="icon"
-                viewBox="0 0 1024 1024"
-                version="1.1"
-                xmlns="http://www.w3.org/2000/svg"
-                p-id="1578"
-                width="20"
-                height="20"
-              >
-                <path
-                  d="M478.462882 476.972344L304.069869 973.321689h496.349345L626.026201 475.481805z"
-                  fill="#1296db"
-                  p-id="1579"
-                ></path>
-                <path
-                  d="M682.666667 535.103348c55.149927-40.244541 90.922853-105.828239 90.922853-178.864629C773.60952 234.014556 673.723435 134.148472 551.499272 134.148472c-123.714702 0-223.600786 99.866084-223.600786 222.090247 0 74.526929 37.263464 140.110626 93.90393 181.845706l19.377002-55.149927c-35.772926-31.30131-60.131004-76.017467-60.131005-126.695779 0-92.413392 74.526929-166.94032 166.940321-166.94032 92.413392 0 166.94032 74.526929 166.94032 166.94032 0 49.187773-20.86754 92.413392-55.149927 123.714702l20.86754 55.149927z"
-                  fill="#1296db"
-                  p-id="1600"
-                ></path>
-                <path
-                  d="M551.499272 356.238719m-86.451237 0a86.451237 86.451237 0 1 0 172.902474 0 86.451237 86.451237 0 1 0-172.902474 0Z"
-                  fill="#1296db"
-                  p-id="1601"
-                ></path>
-                <path
-                  d="M386.049491 640.931607l19.377001-53.660389c-77.508006-49.187773-128.186317-134.148472-128.186317-231.033479 0-150.544396 122.224163-274.260098 274.260097-274.260097 150.544396 0 274.260098 122.224163 274.260098 274.260097 0 95.394469-49.187773 180.355167-125.20524 229.54294l17.886462 53.660389c96.885007-60.131004 160.978166-163.960243 160.978166-283.202329 0-181.845706-147.563319-329.409025-327.918486-329.409025-181.845706 0-329.409025 147.563319-329.409025 329.409025 0 120.733624 65.603697 226.561863 163.960244 284.692868z"
-                  fill="#1296db"
-                  p-id="1602"
-                ></path>
-              </svg>
-            </div>
-            <div>通信状态</div>
-          </div>
-          <div class="Water-immersion-text">正常</div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="panel-footer"></div>
-</div>
-
-<!-- 工具弹框 -->
-<div class="tools" style="display: none">
-  <div class="containerTool test60Toll">
-    <ul>
-      <li>
-        <span>宽度：</span>
-        <input class="setWidth" type="text" />
-        <span id="validateAge" class="regValidate"></span>
-      </li>
-      <li>
-        <span>高度：</span>
-        <input class="setHeight" type="text" />
-      </li>
-    </ul>
-    <!-- 确定 -->
-    <button class="fixBtn toolBtn">确定</button>
-    <button class="offBtn toolBtn">取消</button>
-  </div>
-</div>
+<div class="box60 box" data-name="test60">
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="tool">
+    <div class="title bgTitle">
+      <h2>test60</h2>
+    </div>
+  </div>
+  <div class="test-box">
+    <div class="content">
+      <div class="Water-immersion">
+        <div class="Water-immersion-box-one">
+          <div class="Water-immersion-box-title">
+            <div class="Water-immersion-box-svg">
+              <svg
+                t="1650283656534"
+                class="icon"
+                viewBox="0 0 1024 1024"
+                version="1.1"
+                xmlns="http://www.w3.org/2000/svg"
+                p-id="1578"
+                width="300"
+                height="250"
+              >
+                <path
+                  d="M478.462882 476.972344L304.069869 973.321689h496.349345L626.026201 475.481805z"
+                  fill="#1296db"
+                  p-id="1579"
+                ></path>
+                <path
+                  d="M682.666667 535.103348c55.149927-40.244541 90.922853-105.828239 90.922853-178.864629C773.60952 234.014556 673.723435 134.148472 551.499272 134.148472c-123.714702 0-223.600786 99.866084-223.600786 222.090247 0 74.526929 37.263464 140.110626 93.90393 181.845706l19.377002-55.149927c-35.772926-31.30131-60.131004-76.017467-60.131005-126.695779 0-92.413392 74.526929-166.94032 166.940321-166.94032 92.413392 0 166.94032 74.526929 166.94032 166.94032 0 49.187773-20.86754 92.413392-55.149927 123.714702l20.86754 55.149927z"
+                  fill="#1296db"
+                  p-id="1600"
+                ></path>
+                <path
+                  d="M551.499272 356.238719m-86.451237 0a86.451237 86.451237 0 1 0 172.902474 0 86.451237 86.451237 0 1 0-172.902474 0Z"
+                  fill="#1296db"
+                  p-id="1601"
+                ></path>
+                <path
+                  d="M386.049491 640.931607l19.377001-53.660389c-77.508006-49.187773-128.186317-134.148472-128.186317-231.033479 0-150.544396 122.224163-274.260098 274.260097-274.260097 150.544396 0 274.260098 122.224163 274.260098 274.260097 0 95.394469-49.187773 180.355167-125.20524 229.54294l17.886462 53.660389c96.885007-60.131004 160.978166-163.960243 160.978166-283.202329 0-181.845706-147.563319-329.409025-327.918486-329.409025-181.845706 0-329.409025 147.563319-329.409025 329.409025 0 120.733624 65.603697 226.561863 163.960244 284.692868z"
+                  fill="#1296db"
+                  p-id="1602"
+                ></path>
+              </svg>
+            </div>
+            <div class="Water-immersion-box-title-text">通信状态</div>
+          </div>
+          <div class="Water-immersion-text">正常</div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="panel-footer"></div>
+</div>
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none">
+  <div class="containerTool test60Toll">
+    <ul>
+      <li>
+        <span>宽度：</span>
+        <input class="setWidth" type="text" />
+        <span id="validateAge" class="regValidate"></span>
+      </li>
+      <li>
+        <span>高度：</span>
+        <input class="setHeight" type="text" />
+      </li>
+    </ul>
+    <!-- 确定 -->
+    <button class="fixBtn toolBtn">确定</button>
+    <button class="offBtn toolBtn">取消</button>
+  </div>
+</div>