资源保障修改

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

@@ -37,3 +37,14 @@
   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

@@ -58,6 +58,9 @@
       </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">

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

@@ -139,7 +139,7 @@ const test44 = (function () {
             textStyle: {
               fontWeight: "bold",
               color: "#0ab7ff",
-              fontSize: 100,
+              fontSize: 120,
             },
           },
           //仪表盘详情，用于显示数据。
@@ -148,7 +148,7 @@ const test44 = (function () {
             offsetCenter: [0, "-40%"],
             color: "#ffffff",
             textStyle: {
-              fontSize: 120,
+              fontSize: 140,
               color: "#4aca96",
             },
           },

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 {

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 {

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 {
@@ -33,11 +33,32 @@
   border: 1px solid;
   border-color: #bfbfbf #b3b3b3 #9e9e9e;
   border-radius: 1rem;
-  background-image: -webkit-linear-gradient(top, #f0f0f0 0%, #dbdbdb 70%, #cccccc 100%);
-  background-image: -moz-linear-gradient(top, #f0f0f0 0%, #dbdbdb 70%, #cccccc 100%);
-  background-image: -o-linear-gradient(top, #f0f0f0 0%, #dbdbdb 70%, #cccccc 100%);
-  background-image: linear-gradient(to bottom, #f0f0f0 0%, #dbdbdb 70%, #cccccc 100%);
-  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2);
+  background-image: -webkit-linear-gradient(
+    top,
+    #f0f0f0 0%,
+    #dbdbdb 70%,
+    #cccccc 100%
+  );
+  background-image: -moz-linear-gradient(
+    top,
+    #f0f0f0 0%,
+    #dbdbdb 70%,
+    #cccccc 100%
+  );
+  background-image: -o-linear-gradient(
+    top,
+    #f0f0f0 0%,
+    #dbdbdb 70%,
+    #cccccc 100%
+  );
+  background-image: linear-gradient(
+    to bottom,
+    #f0f0f0 0%,
+    #dbdbdb 70%,
+    #cccccc 100%
+  );
+  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.3),
+    0 1px 2px rgba(0, 0, 0, 0.2);
   box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2);
 }
 .box48 .progress > span span {
@@ -48,7 +69,7 @@
   text-shadow: 0 1px rgba(255, 255, 255, 0.4);
 }
 .box48 .progress > span::before {
-  content: '';
+  content: "";
   position: absolute;
   top: 0;
   bottom: 0;
@@ -69,34 +90,114 @@
 .box48 .progress .green {
   background: #85c440;
   border-color: #78b337 #6ba031 #568128;
-  background-image: -webkit-linear-gradient(top, #b7dc8e 0%, #99ce5f 70%, #85c440 100%);
-  background-image: -moz-linear-gradient(top, #b7dc8e 0%, #99ce5f 70%, #85c440 100%);
-  background-image: -o-linear-gradient(top, #b7dc8e 0%, #99ce5f 70%, #85c440 100%);
-  background-image: linear-gradient(to bottom, #b7dc8e 0%, #99ce5f 70%, #85c440 100%);
+  background-image: -webkit-linear-gradient(
+    top,
+    #b7dc8e 0%,
+    #99ce5f 70%,
+    #85c440 100%
+  );
+  background-image: -moz-linear-gradient(
+    top,
+    #b7dc8e 0%,
+    #99ce5f 70%,
+    #85c440 100%
+  );
+  background-image: -o-linear-gradient(
+    top,
+    #b7dc8e 0%,
+    #99ce5f 70%,
+    #85c440 100%
+  );
+  background-image: linear-gradient(
+    to bottom,
+    #b7dc8e 0%,
+    #99ce5f 70%,
+    #85c440 100%
+  );
 }
 .box48 .progress .orange {
   background: #f2b63c;
   border-color: #f0ad24 #eba310 #c5880d;
-  background-image: -webkit-linear-gradient(top, #f8da9c 0%, #f5c462 70%, #f2b63c 100%);
-  background-image: -moz-linear-gradient(top, #f8da9c 0%, #f5c462 70%, #f2b63c 100%);
-  background-image: -o-linear-gradient(top, #f8da9c 0%, #f5c462 70%, #f2b63c 100%);
-  background-image: linear-gradient(to bottom, #f8da9c 0%, #f5c462 70%, #f2b63c 100%);
+  background-image: -webkit-linear-gradient(
+    top,
+    #f8da9c 0%,
+    #f5c462 70%,
+    #f2b63c 100%
+  );
+  background-image: -moz-linear-gradient(
+    top,
+    #f8da9c 0%,
+    #f5c462 70%,
+    #f2b63c 100%
+  );
+  background-image: -o-linear-gradient(
+    top,
+    #f8da9c 0%,
+    #f5c462 70%,
+    #f2b63c 100%
+  );
+  background-image: linear-gradient(
+    to bottom,
+    #f8da9c 0%,
+    #f5c462 70%,
+    #f2b63c 100%
+  );
 }
 .box48 .progress .red {
   background: #db3a27;
   border-color: #c73321 #b12d1e #8e2418;
-  background-image: -webkit-linear-gradient(top, #ea8a7e 0%, #e15a4a 70%, #db3a27 100%);
-  background-image: -moz-linear-gradient(top, #ea8a7e 0%, #e15a4a 70%, #db3a27 100%);
-  background-image: -o-linear-gradient(top, #ea8a7e 0%, #e15a4a 70%, #db3a27 100%);
-  background-image: linear-gradient(to bottom, #ea8a7e 0%, #e15a4a 70%, #db3a27 100%);
+  background-image: -webkit-linear-gradient(
+    top,
+    #ea8a7e 0%,
+    #e15a4a 70%,
+    #db3a27 100%
+  );
+  background-image: -moz-linear-gradient(
+    top,
+    #ea8a7e 0%,
+    #e15a4a 70%,
+    #db3a27 100%
+  );
+  background-image: -o-linear-gradient(
+    top,
+    #ea8a7e 0%,
+    #e15a4a 70%,
+    #db3a27 100%
+  );
+  background-image: linear-gradient(
+    to bottom,
+    #ea8a7e 0%,
+    #e15a4a 70%,
+    #db3a27 100%
+  );
 }
 .box48 .progress .blue {
   background: #5aaadb;
   border-color: #459fd6 #3094d2 #277db2;
-  background-image: -webkit-linear-gradient(top, #aed5ed 0%, #7bbbe2 70%, #5aaadb 100%);
-  background-image: -moz-linear-gradient(top, #aed5ed 0%, #7bbbe2 70%, #5aaadb 100%);
-  background-image: -o-linear-gradient(top, #aed5ed 0%, #7bbbe2 70%, #5aaadb 100%);
-  background-image: linear-gradient(to bottom, #aed5ed 0%, #7bbbe2 70%, #5aaadb 100%);
+  background-image: -webkit-linear-gradient(
+    top,
+    #aed5ed 0%,
+    #7bbbe2 70%,
+    #5aaadb 100%
+  );
+  background-image: -moz-linear-gradient(
+    top,
+    #aed5ed 0%,
+    #7bbbe2 70%,
+    #5aaadb 100%
+  );
+  background-image: -o-linear-gradient(
+    top,
+    #aed5ed 0%,
+    #7bbbe2 70%,
+    #5aaadb 100%
+  );
+  background-image: linear-gradient(
+    to bottom,
+    #aed5ed 0%,
+    #7bbbe2 70%,
+    #5aaadb 100%
+  );
 }
 .box48 .floor-dist {
   width: 100%;

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

@@ -56,7 +56,7 @@
 .box49 #stuTable tbody,
 .box49 #content-stuTable tbody {
     color: #fff;
-    background-color: #205dcf46;
+    /* background-color: #205dcf46; */
 }
 
 .box49 #stuTable .editBtn,

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

@@ -80,6 +80,13 @@
       </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">

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,109 @@
-<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>
+<script>
+  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);
+  };
+</script>

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,8 @@
-.box53 .test-box {
-  padding: 0;
-}
-.box53 .content {
-  margin: 0;
-  padding: 0;
-}
+.box53 .test-box {
+  padding: 0;
+}
+.box53 .content {
+  margin: 0;
+  padding: 0;
+  margin-top: 7%;
+}

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: "center",
+                        margin: 100,
+                        fontSize: 100,
+                        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: 300,
+                            },
+                        },
+                    },
+                },
+                {
+                    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: 40,
+                        fontSize: 100,
+                        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,8 @@
-.box54 .test-box {
-  padding: 0;
-}
-.box54 .content {
-  margin: 0;
-  padding: 0;
-}
+.box54 .test-box {
+  padding: 0;
+}
+.box54 .content {
+  margin: 0;
+  padding: 0;
+  margin-top: 7%;
+}

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>温度</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="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>

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

@@ -1,7 +1,12 @@
+@font-face {
+  font-family: "庞门正道标题体";
+  src: url("../../font/庞门正道标题体.TTF");
+}
 .box62 p {
-  font-size: 0.15rem !important;
+  font-size: 0.25rem !important;
   font-weight: 700;
   color: #75e2fa;
+  font-family: "LESLIE";
 }
 .box62 .concent > div {
   position: absolute;
@@ -31,37 +36,37 @@
   background-size: 100%;
 }
 .box62 .c-left-img-one {
-  left: 11%;
-  top: 14%;
+  left: 9%;
+  top: 12%;
 }
 .box62 .c-left-img-two {
-  left: 16%;
-  top: 8%;
+  left: 15%;
+  top: 7%;
 }
 .box62 .c-center1 {
-  left: 50%;
+  left: 49%;
   top: 35%;
   transform: translate(-50%, -50%);
 }
 .box62 .c-center2 {
-  left: 29%;
-  top: 37%;
+  left: 28%;
+  top: 32%;
 }
 .box62 .c-center3 {
-  left: 36%;
-  top: 16%;
+  left: 34%;
+  top: 9%;
 }
 .box62 .c-center4 {
-  left: 55%;
-  top: 22%;
+  left: 57%;
+  top: 16%;
 }
 .box62 .c-center5 {
-  left: 55%;
+  left: 51%;
   top: 39%;
 }
 .box62 .c-center6 {
-  left: 43%;
-  top: 47%;
+  left: 40%;
+  top: 43%;
 }
 .box62 .c-r-item1 {
   right: 20%;
@@ -72,6 +77,6 @@
   top: 5%;
 }
 .box62 .c-r-item3 {
-  right:11%;
+  right: 11%;
   top: 15%;
 }

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

@@ -5,53 +5,56 @@
   </div>
   <div class="test-box">
     <div class="concent">
-
       <div class="l-bg ex"></div>
       <!-- <div class="x-bg ex"></div> -->
 
-      <div style="width: 120%;" class="c-left-img-one">
-        <img src="../images/zybz/jbq拷贝3.png" alt="">
-        <p>主城区县</p>
+      <div style="width: 6%" class="c-left-img-one">
+        <img src="../images/zybz/jbq拷贝3.png" alt="" />
+        <p style="color: #ffd7aa">主城区县</p>
       </div>
-      <div class="c-left-img-two" style="width: 80%;">
-        <img src="../images/zybz/ybq拷贝2.png" alt="">
-        <p>郊区区县</p>
+      <div class="c-left-img-two" style="width: 5%">
+        <img src="../images/zybz/ybq拷贝2.png" alt="" />
+        <p>远郊区县</p>
       </div>
       <div class="c-center1">
-        <img src="../images/zybz/组240拷贝.png" alt="" style="width:1666px;">
+        <img src="../images/zybz/组240拷贝.png" alt="" style="width: 1666px" />
         <p>指挥大厅</p>
       </div>
       <div class="c-center2">
-        <img src="../images/zybz/icon_jifang拷贝3.png" alt="">
+        <img src="../images/zybz/icon_jifang拷贝3.png" alt="" />
         <p>1号配线间机房</p>
       </div>
       <div class="c-center3">
-        <img src="../images/zybz/icon_jifang拷贝3.png" alt="">
+        <img src="../images/zybz/icon_jifang拷贝3.png" alt="" />
         <p>城管局UPS主供电房</p>
       </div>
       <div class="c-center4">
-        <img src="../images/zybz/icon_jifang拷贝3.png" alt="">
+        <img src="../images/zybz/icon_jifang拷贝3.png" alt="" />
         <p>2号楼中心机房</p>
       </div>
-      <div class="c-center5" style="width: 5%;">
-        <img src="../images/zybz/icon_jifang拷贝3.png" alt="">
+      <div class="c-center5" style="width: 5%">
+        <img src="../images/zybz/icon_jifang拷贝3.png" alt="" />
         <p>档案室库房</p>
       </div>
       <div class="c-center6">
-        <img style="width: 57%;" src="../images/zybz/icon_jifang拷贝3.png" alt="">
+        <img
+          style="width: 50%"
+          src="../images/zybz/icon_jifang拷贝3.png"
+          alt=""
+        />
         <p>城管局网络核心机房</p>
       </div>
 
-      <div class="c-r-item1">
-        <img src="../images/zybz/hwy拷贝.png" alt="">
+      <div style="width: 5%" class="c-r-item1">
+        <img src="../images/zybz/hwy拷贝.png" alt="" />
         <p>华为云</p>
       </div>
-      <div class="c-r-item2" style="width: 6%;">
-        <img src="../images/zybz/xcy拷贝.png" alt="">
-        <p>信创云</p>
+      <div class="c-r-item2" style="width: 6%">
+        <img src="../images/zybz/xcy拷贝.png" alt="" />
+        <p style="color: #ffd7aa">信创云</p>
       </div>
-      <div class="c-r-item3" style="width: 5%;">
-        <img src="../images/zybz/lcy拷贝.png" alt="">
+      <div class="c-r-item3" style="width: 5%">
+        <img src="../images/zybz/lcy拷贝.png" alt="" />
         <p>浪潮云</p>
       </div>
     </div>
@@ -77,4 +80,4 @@
     <button class="fixBtn toolBtn">确定</button>
     <button class="offBtn toolBtn">取消</button>
   </div>
-</div>
+</div>

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

@@ -1,305 +1,307 @@
-const test62 = (function() {
-    function test62(id, domTitle) {
-        if (domTitle) {
-            $(".test62 .title h2").text(domTitle);
-        }
-        $(".test62 .box").css("z-index", ++zIndex);
-        $(".test62 .box").attr("data-id", id);
-        move3(".test62 .test-box");
-        move2(".test62 .containerTool");
-
-        let timer = null;
-
-        $(".test62 .close").click(function() {
-            $(".test62 .box").remove();
-            $(".test62 .containerTool").css("display", "none");
-            $(".test62 .setWidth").val("");
-            $(".test62 .setHeight").val("");
-            moduleIdRemove.push(id);
-        });
-
-        eventClick(".test62");
-
-        const dists = document.querySelectorAll(".test62 .floor-dist");
-        const testDoms = document.querySelectorAll(".test62 .box");
-        for (let i = 0; i < dists.length; i++) {
-            const dom = dists[i];
-            setCharts(dom, testDoms[i]);
-        }
-
-        // 局本级
-        $('.bg-center-img-one').click(function() {
-            $('.sf1').slideDown();
-            $('.sf3').slideUp();
-            $('.sf4').slideUp();
-        })
-
-        // 浪潮
-        $('.bg-center-img-three').click(function() {
-            $('.sf4').slideDown();
-            $('.sf1').slideUp();
-            $('.sf3').slideUp();
-        })
-
-        // 华为
-        $('.bg-center-img-four').click(function() {
-            $('.sf3').slideDown();
-            $('.sf1').slideUp();
-            $('.sf4').slideUp();
-        })
-
-
-
-        window.addEventListener("resize", function() {
-            if (timer) {
-                clearTimeout(timer);
-                timer = null;
-            }
-            timer = setTimeout(() => {
-                move3(".test62 .test-box");
-
-                myChart.resize();
-            }, 500);
-        });
-    }
-
-    function setCharts(echartDom, testDom) {
-        var myChart = echarts.init(echartDom);
-        // 地图背景颜色
-        var highlight = "#03b7c9";
-
-        var demoData = [{
-                name: "平均温度",
-                value: 22,
-                unit: "°",
-                pos: ["25%", "40%"],
-                range: [-40, 100],
-                YS: [
-                    [0.4, "#119eff"],
-                    [0.5, "#30da74"],
-                    [1, "#f3390d"],
-                ],
-            },
-            {
-                name: "平均温度",
-                value: 90,
-                unit: "°",
-                pos: ["75%", "40%"],
-                range: [0, 100],
-                splitNum: 10,
-                YS: [
-                    [0.3, "#f3390d"],
-                    [0.8, "#30da74"],
-                    [1, "#119eff"],
-                ],
-            },
-        ];
-
-        option = {
-            series: (function() {
-                var result = [];
-
-                demoData.forEach(function(item) {
-                    result.push(
-                        // 外围刻度
-                        {
-                            type: "gauge",
-                            center: item.pos,
-                            radius: "50%", // 1行2个
-                            splitNumber: item.splitNum || 10,
-                            min: item.range[0],
-                            max: item.range[1],
-                            startAngle: 225,
-                            endAngle: -45,
-                            axisLine: {
-                                show: true,
-                                lineStyle: {
-                                    width: 2,
-                                    shadowBlur: 0,
-                                    color: [
-                                        [1, highlight]
-                                    ],
-                                },
-                            },
-                            axisTick: {
-                                show: true,
-                                lineStyle: {
-                                    color: highlight,
-                                    width: 1,
-                                },
-                                length: -5,
-                                splitNumber: 10,
-                            },
-                            splitLine: {
-                                show: true,
-                                length: -10,
-                                lineStyle: {
-                                    color: highlight,
-                                },
-                            },
-                            axisLabel: {
-                                distance: -18,
-                                textStyle: {
-                                    color: highlight,
-                                    fontSize: "10",
-                                },
-                            },
-                            pointer: {
-                                show: 0,
-                            },
-                            detail: {
-                                show: 0,
-                            },
-                        }, {
-                            name: "速度",
-                            type: "gauge",
-                            center: item.pos,
-                            splitNumber: item.splitNum || 10,
-                            min: item.range[0],
-                            max: item.range[1],
-                            radius: "45%",
-                            axisLine: {
-                                // 坐标轴线
-                                show: false,
-                                lineStyle: {
-                                    // 属性lineStyle控制线条样式
-                                    color: item.YS,
-                                    shadowColor: "#ccc",
-                                    shadowBlur: 25,
-                                    width: 0,
-                                },
-                            },
-                            axisLabel: {
-                                show: false,
-                            },
-                            axisTick: {
-                                // 坐标轴小标记
-                                // show: false,
-                                length: 20, // 属性length控制线长
-                                lineStyle: {
-                                    // 属性lineStyle控制线条样式
-                                    color: "auto",
-                                    width: 2,
-                                },
-                            },
-                            splitLine: {
-                                // 分隔线
-                                show: false,
-                                length: 20, // 属性length控制线长
-                                lineStyle: {
-                                    // 属性lineStyle（详见lineStyle）控制线条样式
-                                    color: "auto",
-                                },
-                            },
-                            title: {
-                                textStyle: {
-                                    // 其余属性默认使用全局文本样式，详见TEXTSTYLE
-                                    fontWeight: "bolder",
-                                    fontSize: 20,
-                                    fontStyle: "italic",
-                                },
-                            },
-                            detail: {
-                                show: true,
-                                offsetCenter: [0, "100%"],
-                                textStyle: {
-                                    fontSize: 25,
-                                },
-                                formatter: [
-                                    "{value} " + (item.unit || ""),
-                                    "{name|" + item.name + "}",
-                                ].join("\n"),
-                                rich: {
-                                    name: {
-                                        fontSize: 16,
-                                        lineHeight: 30,
-                                        color: "#4be4de",
-                                    },
-                                },
-                            },
-                            data: [{
-                                value: item.value,
-                            }, ],
-                            pointer: {
-                                width: 5,
-                            },
-                        },
-                        // 内侧指针、数值显示
-                        {
-                            name: item.name,
-                            type: "gauge",
-                            center: item.pos,
-                            radius: "40%",
-                            startAngle: 225,
-                            endAngle: -45,
-                            min: item.range[0],
-                            max: item.range[1],
-                            axisLine: {
-                                show: true,
-                                lineStyle: {
-                                    width: 16,
-                                    color: [
-                                        [1, "rgba(75,228,255,.1)"]
-                                    ],
-                                },
-                            },
-                            axisTick: {
-                                show: 0,
-                            },
-                            splitLine: {
-                                show: 0,
-                            },
-                            axisLabel: {
-                                show: 0,
-                            },
-                            pointer: {
-                                show: true,
-                                length: "90%",
-                                width: 3,
-                            },
-                            itemStyle: {
-                                //表盘指针的颜色
-                                color: "rgba(255, 153, 0, 0.31)",
-                                borderColor: "#ff9900",
-                                borderWidth: 1,
-                            },
-                            detail: {
-                                show: false,
-                                offsetCenter: [0, "100%"],
-                                textStyle: {
-                                    fontSize: 20,
-                                    color: "#00eff2",
-                                },
-                                formatter: [
-                                    "{value} " + (item.unit || ""),
-                                    "{name|" + item.name + "}",
-                                ].join("\n"),
-                                rich: {
-                                    name: {
-                                        fontSize: 14,
-                                        lineHeight: 30,
-                                        color: "#00eff2",
-                                    },
-                                },
-                            },
-
-                            data: [{
-                                value: item.value,
-                            }, ],
-                        }
-                    );
-                });
-                return result;
-            })(),
-        };
-        if (option) {
-            myChart.setOption(option);
-        }
-
-        if (!testDom) {
-            testDom = document.querySelectorAll(".test62 .box");
-        }
-        obsDom(testDom, myChart);
-    }
-    return test62;
-})();
+const test62 = (function () {
+  function test62(id, domTitle) {
+    if (domTitle) {
+      $(".test62 .title h2").text(domTitle);
+    }
+    $(".test62 .box").css("z-index", ++zIndex);
+    $(".test62 .box").attr("data-id", id);
+    move3(".test62 .test-box");
+    move2(".test62 .containerTool");
+
+    let timer = null;
+
+    $(".test62 .close").click(function () {
+      $(".test62 .box").remove();
+      $(".test62 .containerTool").css("display", "none");
+      $(".test62 .setWidth").val("");
+      $(".test62 .setHeight").val("");
+      moduleIdRemove.push(id);
+    });
+
+    eventClick(".test62");
+
+    const dists = document.querySelectorAll(".test62 .floor-dist");
+    const testDoms = document.querySelectorAll(".test62 .box");
+    for (let i = 0; i < dists.length; i++) {
+      const dom = dists[i];
+      setCharts(dom, testDoms[i]);
+    }
+
+    // 局本级
+    $(".bg-center-img-one").click(function () {
+      $(".sf1").slideDown();
+      $(".sf3").slideUp();
+      $(".sf4").slideUp();
+    });
+
+    // 浪潮
+    $(".bg-center-img-three").click(function () {
+      $(".sf4").slideDown();
+      $(".sf1").slideUp();
+      $(".sf3").slideUp();
+    });
+
+    // 华为
+    $(".bg-center-img-four").click(function () {
+      $(".sf3").slideDown();
+      $(".sf1").slideUp();
+      $(".sf4").slideUp();
+    });
+
+    let myChart = echarts.init(dists[0]);
+
+    window.addEventListener("resize", function () {
+      if (timer) {
+        clearTimeout(timer);
+        timer = null;
+      }
+      timer = setTimeout(() => {
+        move3(".test62 .test-box");
+
+        myChart.resize();
+      }, 500);
+    });
+  }
+
+  function setCharts(echartDom, testDom) {
+    var myChart = echarts.init(echartDom);
+    // 地图背景颜色
+    var highlight = "#03b7c9";
+
+    var demoData = [
+      {
+        name: "平均温度",
+        value: 22,
+        unit: "°",
+        pos: ["25%", "40%"],
+        range: [-40, 100],
+        YS: [
+          [0.4, "#119eff"],
+          [0.5, "#30da74"],
+          [1, "#f3390d"],
+        ],
+      },
+      {
+        name: "平均温度",
+        value: 90,
+        unit: "°",
+        pos: ["75%", "40%"],
+        range: [0, 100],
+        splitNum: 10,
+        YS: [
+          [0.3, "#f3390d"],
+          [0.8, "#30da74"],
+          [1, "#119eff"],
+        ],
+      },
+    ];
+
+    option = {
+      series: (function () {
+        var result = [];
+
+        demoData.forEach(function (item) {
+          result.push(
+            // 外围刻度
+            {
+              type: "gauge",
+              center: item.pos,
+              radius: "50%", // 1行2个
+              splitNumber: item.splitNum || 10,
+              min: item.range[0],
+              max: item.range[1],
+              startAngle: 225,
+              endAngle: -45,
+              axisLine: {
+                show: true,
+                lineStyle: {
+                  width: 2,
+                  shadowBlur: 0,
+                  color: [[1, highlight]],
+                },
+              },
+              axisTick: {
+                show: true,
+                lineStyle: {
+                  color: highlight,
+                  width: 1,
+                },
+                length: -5,
+                splitNumber: 10,
+              },
+              splitLine: {
+                show: true,
+                length: -10,
+                lineStyle: {
+                  color: highlight,
+                },
+              },
+              axisLabel: {
+                distance: -18,
+                textStyle: {
+                  color: highlight,
+                  fontSize: "10",
+                },
+              },
+              pointer: {
+                show: 0,
+              },
+              detail: {
+                show: 0,
+              },
+            },
+            {
+              name: "速度",
+              type: "gauge",
+              center: item.pos,
+              splitNumber: item.splitNum || 10,
+              min: item.range[0],
+              max: item.range[1],
+              radius: "45%",
+              axisLine: {
+                // 坐标轴线
+                show: false,
+                lineStyle: {
+                  // 属性lineStyle控制线条样式
+                  color: item.YS,
+                  shadowColor: "#ccc",
+                  shadowBlur: 25,
+                  width: 0,
+                },
+              },
+              axisLabel: {
+                show: false,
+              },
+              axisTick: {
+                // 坐标轴小标记
+                // show: false,
+                length: 20, // 属性length控制线长
+                lineStyle: {
+                  // 属性lineStyle控制线条样式
+                  color: "auto",
+                  width: 2,
+                },
+              },
+              splitLine: {
+                // 分隔线
+                show: false,
+                length: 20, // 属性length控制线长
+                lineStyle: {
+                  // 属性lineStyle（详见lineStyle）控制线条样式
+                  color: "auto",
+                },
+              },
+              title: {
+                textStyle: {
+                  // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                  fontWeight: "bolder",
+                  fontSize: 20,
+                  fontStyle: "italic",
+                },
+              },
+              detail: {
+                show: true,
+                offsetCenter: [0, "100%"],
+                textStyle: {
+                  fontSize: 25,
+                },
+                formatter: [
+                  "{value} " + (item.unit || ""),
+                  "{name|" + item.name + "}",
+                ].join("\n"),
+                rich: {
+                  name: {
+                    fontSize: 16,
+                    lineHeight: 30,
+                    color: "#4be4de",
+                  },
+                },
+              },
+              data: [
+                {
+                  value: item.value,
+                },
+              ],
+              pointer: {
+                width: 5,
+              },
+            },
+            // 内侧指针、数值显示
+            {
+              name: item.name,
+              type: "gauge",
+              center: item.pos,
+              radius: "40%",
+              startAngle: 225,
+              endAngle: -45,
+              min: item.range[0],
+              max: item.range[1],
+              axisLine: {
+                show: true,
+                lineStyle: {
+                  width: 16,
+                  color: [[1, "rgba(75,228,255,.1)"]],
+                },
+              },
+              axisTick: {
+                show: 0,
+              },
+              splitLine: {
+                show: 0,
+              },
+              axisLabel: {
+                show: 0,
+              },
+              pointer: {
+                show: true,
+                length: "90%",
+                width: 3,
+              },
+              itemStyle: {
+                //表盘指针的颜色
+                color: "rgba(255, 153, 0, 0.31)",
+                borderColor: "#ff9900",
+                borderWidth: 1,
+              },
+              detail: {
+                show: false,
+                offsetCenter: [0, "100%"],
+                textStyle: {
+                  fontSize: 20,
+                  color: "#00eff2",
+                },
+                formatter: [
+                  "{value} " + (item.unit || ""),
+                  "{name|" + item.name + "}",
+                ].join("\n"),
+                rich: {
+                  name: {
+                    fontSize: 14,
+                    lineHeight: 30,
+                    color: "#00eff2",
+                  },
+                },
+              },
+
+              data: [
+                {
+                  value: item.value,
+                },
+              ],
+            }
+          );
+        });
+        return result;
+      })(),
+    };
+    if (option) {
+      myChart.setOption(option);
+    }
+
+    if (!testDom) {
+      testDom = document.querySelectorAll(".test62 .box");
+    }
+    obsDom(testDom, myChart);
+  }
+  return test62;
+})();

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

@@ -1,260 +1,260 @@
-const test7 = (function () {
-  function test7(id, domTitle) {
-    if (domTitle) {
-      $(".test7 .title h2").text(domTitle);
-    }
-    $(".test7 .box").css("z-index", ++zIndex);
-    $(".test7 .box").attr("data-id", id);
-    move3(".test7 .test-box");
-    move2(".test7 .containerTool");
-
-    let timer = null;
-
-    $(".test7 .close").click(function () {
-      $(".test7 .box").remove();
-      $(".test7 .containerTool").css("display", "none");
-      $(".test7 .setWidth").val("");
-      $(".test7 .setHeight").val("");
-      moduleIdRemove.push(id);
-    });
-
-    eventClick(".test7");
-
-    const dists = document.querySelectorAll(".test7 .floor-dist");
-    const testDoms = document.querySelectorAll(".test7 .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(() => {
-        move3(".test7 .test-box");
-
-        myChart.resize();
-      }, 500);
-    });
-  }
-
-  function setCharts(echartDom, testDom) {
-    var myChart = echarts.init(echartDom);
-
-    // 地图背景颜色
-    option = {
-      //   backgroundColor: "#424956",
-      title: {
-        // text: "请求数",
-        textStyle: {
-          fontWeight: "normal",
-          fontSize: 16,
-          color: "#F1F1F3",
-        },
-        left: "6%",
-      },
-      tooltip: {
-        trigger: "axis",
-        axisPointer: {
-          lineStyle: {
-            color: "#57617B",
-          },
-        },
-      },
-      legend: {
-        icon: "rect",
-        itemWidth: 14,
-        itemHeight: 5,
-        itemGap: 13,
-        data: ["移动", "电信", "联通"],
-        right: "4%",
-        textStyle: {
-          fontSize: 12,
-          color: "#fff",
-        },
-      },
-      grid: {
-        left: "3%",
-        right: "4%",
-        bottom: "3%",
-        containLabel: true,
-      },
-      xAxis: [
-        {
-          type: "category",
-          boundaryGap: false,
-          axisLine: {
-            lineStyle: {
-              color: "#57617B",
-            },
-          },
-          data: [
-            "13:00",
-            "13:05",
-            "13:10",
-            "13:15",
-            "13:20",
-            "13:25",
-            "13:30",
-            "13:35",
-          ],
-        },
-      ],
-      yAxis: [
-        {
-          type: "value",
-          name: "单位（%）",
-          axisTick: {
-            show: false,
-          },
-          axisLine: {
-            lineStyle: {
-              color: "#57617B",
-            },
-          },
-          axisLabel: {
-            margin: 10,
-            textStyle: {
-              fontSize: 14,
-            },
-          },
-          splitLine: {
-            lineStyle: {
-              color: "#57617B",
-            },
-          },
-        },
-      ],
-      series: [
-        {
-          name: "移动",
-          type: "line",
-          smooth: true,
-          symbol: "circle",
-          symbolSize: 5,
-          showSymbol: false,
-          lineStyle: {
-            normal: {
-              width: 3,
-            },
-          },
-          areaStyle: {
-            normal: {
-              color: new echarts.graphic.LinearGradient(
-                0,
-                0,
-                1,
-                0,
-                [
-                  {
-                    offset: 0,
-                    color: "rgba(16,97,204, 0.3)",
-                  },
-                  {
-                    offset: 0.8,
-                    color: "rgba(17,235,210, 0)",
-                  },
-                ],
-                false
-              ),
-              shadowColor: "rgba(0, 0, 0, 0.1)",
-              shadowBlur: 10,
-            },
-          },
-          itemStyle: {
-            normal: {
-              color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
-                {
-                  offset: 0,
-                  color: "rgba(16,97,204,1)",
-                },
-                {
-                  offset: 1,
-                  color: "rgba(17,235,210,1)",
-                },
-              ]),
-            },
-            emphasis: {
-              color: "rgb(0,196,132)",
-              borderColor: "rgba(0,196,132,0.2)",
-              extraCssText: "box-shadow: 8px 8px 8px rgba(0, 0, 0, 1);",
-              borderWidth: 10,
-            },
-          },
-          data: [220, 182, 191, 134, 150, 120, 110, 125],
-        },
-        {
-          name: "电信",
-          type: "line",
-          smooth: true,
-          symbol: "circle",
-          symbolSize: 5,
-          showSymbol: false,
-          lineStyle: {
-            normal: {
-              width: 3,
-            },
-          },
-          areaStyle: {
-            normal: {
-              color: new echarts.graphic.LinearGradient(
-                0,
-                0,
-                0,
-                1,
-                [
-                  {
-                    offset: 0,
-                    color: "rgba(205,52,42, 0.5)",
-                  },
-                  {
-                    offset: 0.8,
-                    color: "rgba(235,235,21, 0)",
-                  },
-                ],
-                false
-              ),
-              shadowColor: "rgba(0, 0, 0, 0.1)",
-              shadowBlur: 10,
-            },
-          },
-          itemStyle: {
-            normal: {
-              color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
-                {
-                  offset: 0,
-                  color: "rgba(205,52,42,1)",
-                },
-                {
-                  offset: 1,
-                  color: "rgba(235,235,21,1)",
-                },
-              ]),
-            },
-            emphasis: {
-              color: "rgb(99,250,235)",
-              borderColor: "rgba(99,250,235,0.2)",
-              extraCssText: "box-shadow: 8px 8px 8px rgba(0, 0, 0, 1);",
-              borderWidth: 10,
-            },
-          },
-          data: [120, 110, 125, 145, 122, 165, 122, 220],
-        },
-      ],
-    };
-
-    if (option) {
-      myChart.setOption(option);
-    }
-
-    if (!testDom) {
-      testDom = document.querySelectorAll(".test7 .box");
-    }
-    obsDom(testDom, myChart);
-  }
-  return test7;
-})();
+const test7 = (function () {
+  function test7(id, domTitle) {
+    if (domTitle) {
+      $(".test7 .title h2").text(domTitle);
+    }
+    $(".test7 .box").css("z-index", ++zIndex);
+    $(".test7 .box").attr("data-id", id);
+    move3(".test7 .test-box");
+    move2(".test7 .containerTool");
+
+    let timer = null;
+
+    $(".test7 .close").click(function () {
+      $(".test7 .box").remove();
+      $(".test7 .containerTool").css("display", "none");
+      $(".test7 .setWidth").val("");
+      $(".test7 .setHeight").val("");
+      moduleIdRemove.push(id);
+    });
+
+    eventClick(".test7");
+
+    const dists = document.querySelectorAll(".test7 .floor-dist");
+    const testDoms = document.querySelectorAll(".test7 .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(() => {
+        move3(".test7 .test-box");
+
+        myChart.resize();
+      }, 500);
+    });
+  }
+
+  function setCharts(echartDom, testDom) {
+    var myChart = echarts.init(echartDom);
+
+    // 地图背景颜色
+    option = {
+      //   backgroundColor: "#424956",
+      title: {
+        // text: "请求数",
+        textStyle: {
+          fontWeight: "normal",
+          fontSize: 16,
+          color: "#F1F1F3",
+        },
+        left: "6%",
+      },
+      tooltip: {
+        trigger: "axis",
+        axisPointer: {
+          lineStyle: {
+            color: "#57617B",
+          },
+        },
+      },
+      legend: {
+        icon: "rect",
+        itemWidth: 14,
+        itemHeight: 5,
+        itemGap: 13,
+        data: ["移动", "电信", "联通"],
+        right: "4%",
+        textStyle: {
+          fontSize: 12,
+          color: "#fff",
+        },
+      },
+      grid: {
+        left: "3%",
+        right: "4%",
+        bottom: "3%",
+        containLabel: true,
+      },
+      xAxis: [
+        {
+          type: "category",
+          boundaryGap: false,
+          axisLine: {
+            lineStyle: {
+              color: "#57617B",
+            },
+          },
+          data: [
+            "13:00",
+            "13:05",
+            "13:10",
+            "13:15",
+            "13:20",
+            "13:25",
+            "13:30",
+            "13:35",
+          ],
+        },
+      ],
+      yAxis: [
+        {
+          type: "value",
+          name: "单位（%）",
+          axisTick: {
+            show: false,
+          },
+          axisLine: {
+            lineStyle: {
+              color: "#57617B",
+            },
+          },
+          axisLabel: {
+            margin: 10,
+            textStyle: {
+              fontSize: 14,
+            },
+          },
+          splitLine: {
+            lineStyle: {
+              color: "#57617B",
+            },
+          },
+        },
+      ],
+      series: [
+        {
+          name: "移动",
+          type: "line",
+          smooth: true,
+          symbol: "circle",
+          symbolSize: 5,
+          showSymbol: false,
+          lineStyle: {
+            normal: {
+              width: 3,
+            },
+          },
+          areaStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(
+                0,
+                0,
+                1,
+                0,
+                [
+                  {
+                    offset: 0,
+                    color: "rgba(16,97,204, 0.3)",
+                  },
+                  {
+                    offset: 0.8,
+                    color: "rgba(17,235,210, 0)",
+                  },
+                ],
+                false
+              ),
+              shadowColor: "rgba(0, 0, 0, 0.1)",
+              shadowBlur: 10,
+            },
+          },
+          itemStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
+                {
+                  offset: 0,
+                  color: "rgba(16,97,204,1)",
+                },
+                {
+                  offset: 1,
+                  color: "rgba(17,235,210,1)",
+                },
+              ]),
+            },
+            emphasis: {
+              color: "rgb(0,196,132)",
+              borderColor: "rgba(0,196,132,0.2)",
+              extraCssText: "box-shadow: 8px 8px 8px rgba(0, 0, 0, 1);",
+              borderWidth: 10,
+            },
+          },
+          data: [220, 182, 191, 134, 150, 120, 110, 125],
+        },
+        {
+          name: "电信",
+          type: "line",
+          smooth: true,
+          symbol: "circle",
+          symbolSize: 5,
+          showSymbol: false,
+          lineStyle: {
+            normal: {
+              width: 3,
+            },
+          },
+          areaStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(
+                0,
+                0,
+                0,
+                1,
+                [
+                  {
+                    offset: 0,
+                    color: "rgba(205,52,42, 0.5)",
+                  },
+                  {
+                    offset: 0.8,
+                    color: "rgba(235,235,21, 0)",
+                  },
+                ],
+                false
+              ),
+              shadowColor: "rgba(0, 0, 0, 0.1)",
+              shadowBlur: 10,
+            },
+          },
+          itemStyle: {
+            normal: {
+              color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
+                {
+                  offset: 0,
+                  color: "rgba(205,52,42,1)",
+                },
+                {
+                  offset: 1,
+                  color: "rgba(235,235,21,1)",
+                },
+              ]),
+            },
+            emphasis: {
+              color: "rgb(99,250,235)",
+              borderColor: "rgba(99,250,235,0.2)",
+              extraCssText: "box-shadow: 8px 8px 8px rgba(0, 0, 0, 1);",
+              borderWidth: 10,
+            },
+          },
+          data: [120, 110, 125, 145, 122, 165, 122, 220],
+        },
+      ],
+    };
+
+    if (option) {
+      myChart.setOption(option);
+    }
+
+    if (!testDom) {
+      testDom = document.querySelectorAll(".test7 .box");
+    }
+    obsDom(testDom, myChart);
+  }
+  return test7;
+})();

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

@@ -1,426 +1,435 @@
 html {
-    user-select: none;
+  user-select: none;
 }
 
 .heaTit {
-    line-height: 1rem;
+  line-height: 1rem;
+}
+@font-face {
+  font-family: "SIMLI";
+  src: url("../font/SIMLI.TTF");
 }
-
 .heaTit h1 {
-    color: #8caaf5;
-    text-shadow: 1px 1px #ffffff, -1px -1px #2205f5;
-    font-size: 0.45rem;
-    letter-spacing: 0.1rem;
+  color: #8caaf5;
+  /* text-shadow: 1px 1px #ffffff, -1px -1px #2205f5; */
+  font-size: 0.75rem;
+  letter-spacing: 0.1rem;
+  background-image: -webkit-linear-gradient(
+    top,
+    rgb(246, 245, 247),
+    rgb(68, 169, 236)
+  );
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  font-family: "SIMLI";
 }
 
 .box {
-    position: absolute;
-    width: 12rem;
-    height: 3rem;
-    left: 0;
-    top: 0;
-    box-sizing: border-box;
-    resize: both;
-    overflow: auto;
-    display: flex;
-    flex-direction: column;
-    max-width: 100%;
-    max-height: 100%;
+  position: absolute;
+  width: 12rem;
+  height: 3rem;
+  left: 0;
+  top: 0;
+  box-sizing: border-box;
+  resize: both;
+  overflow: auto;
+  display: flex;
+  flex-direction: column;
+  max-width: 100%;
+  max-height: 100%;
 }
 
 .test-box {
-    position: relative;
-    width: 100%;
-    height: 100%;
-    padding-top: 0.6rem;
-    box-sizing: border-box;
-    overflow: auto;
+  position: relative;
+  width: 100%;
+  height: 100%;
+  padding-top: 0.6rem;
+  box-sizing: border-box;
+  overflow: auto;
 }
 
 .test-box::-webkit-scrollbar {
-    /*滚动条整体样式*/
-    width: 5px;
-    /*高宽分别对应横竖滚动条的尺寸*/
-    height: 1px;
+  /*滚动条整体样式*/
+  width: 5px;
+  /*高宽分别对应横竖滚动条的尺寸*/
+  height: 1px;
 }
 
 .test-box::-webkit-scrollbar-thumb {
-    /*滚动条里面小方块*/
-    border-radius: 0.02rem;
+  /*滚动条里面小方块*/
+  border-radius: 0.02rem;
 }
 
 .test-box::-webkit-scrollbar-track {
-    /*滚动条里面轨道*/
-    border-radius: 0.02rem;
-    background: #ededed00;
+  /*滚动条里面轨道*/
+  border-radius: 0.02rem;
+  background: #ededed00;
 }
 
 .theme .box .bgTitle {
-    height: 100%;
-    background: url(../images/stationGroup/cbiaoti.png) no-repeat;
-    padding-left: 12%;
-    background-position: -7px;
-    background-size: 99%;
-    margin-left: -0.06rem;
+  height: 100%;
+  background: url(../images/stationGroup/cbiaoti.png) no-repeat;
+  padding-left: 12%;
+  background-position: -7px;
+  background-size: 99%;
+  margin-left: -0.06rem;
 }
 
 .theme .box .bgTitle2 {
-    height: 100%;
-    background: url(../images/stationGroup/title.png) no-repeat;
-    padding-left: 12%;
-    background-position: -7px;
-    background-size: 58%;
-    margin-left: -0.06rem;
+  height: 100%;
+  background: url(../images/stationGroup/title.png) no-repeat;
+  padding-left: 12%;
+  background-position: -7px;
+  background-size: 58%;
+  margin-left: -0.06rem;
 }
 
 .content {
   color: #fff;
-    overflow: auto;
-    height: 100%;
-    box-sizing: border-box;
+  overflow: auto;
+  height: 100%;
+  box-sizing: border-box;
 }
 
 .content::-webkit-scrollbar {
-    /*滚动条整体样式*/
-    width: 0px;
-    /*高宽分别对应横竖滚动条的尺寸*/
-    height: 0px;
+  /*滚动条整体样式*/
+  width: 0px;
+  /*高宽分别对应横竖滚动条的尺寸*/
+  height: 0px;
 }
 
 .content::-webkit-scrollbar-thumb {
-    /*滚动条里面小方块*/
-    border-radius: 0.2rem;
-    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
-    background: rgba(70, 116, 214, 0.452);
+  /*滚动条里面小方块*/
+  border-radius: 0.2rem;
+  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+  background: rgba(70, 116, 214, 0.452);
 }
 
 .content::-webkit-scrollbar-track {
-    /*滚动条里面轨道*/
-    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
-    border-radius: 10px;
-    background: #ededed;
+  /*滚动条里面轨道*/
+  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+  border-radius: 10px;
+  background: #ededed;
 }
 
 .tool {
-    min-height: 0.6rem;
-    padding-right: 6px;
-    padding-left: 6px;
-    flex: 1;
-    display: flex;
-    align-items: center;
-    height: 0.4rem;
+  min-height: 0.6rem;
+  padding-right: 6px;
+  padding-left: 6px;
+  flex: 1;
+  display: flex;
+  align-items: center;
+  height: 0.4rem;
 }
 
 .toolBox {
-    display: flex;
-    font-size: 15px;
-    transition: all 0.2s;
-    position: absolute;
-    bottom: 0rem;
-    left: 50%;
-    transform: translateX(-50%);
-    z-index: 99;
+  display: flex;
+  font-size: 15px;
+  transition: all 0.2s;
+  position: absolute;
+  bottom: 0rem;
+  left: 50%;
+  transform: translateX(-50%);
+  z-index: 99;
 }
 
 .toolBox:hover {
-    opacity: 1;
+  opacity: 1;
 }
 
 .toolBox span {
-    margin: 5px;
-    color: aquamarine;
-    /* font-size: 60px;  */
-    font-size: 0.4rem;
-    border-radius: 50%;
+  margin: 5px;
+  color: aquamarine;
+  /* font-size: 60px;  */
+  font-size: 0.4rem;
+  border-radius: 50%;
 }
 
 .content {
-    flex: 5;
+  flex: 5;
 }
 
-
 /* 弹框 */
 
 .toolTitle {
-    height: 0.6rem;
-    text-align: center;
-    font-size: 0.4rem;
+  height: 0.6rem;
+  text-align: center;
+  font-size: 0.4rem;
 }
 
 .containerTool {
-    color: #fff;
-    position: absolute;
-    text-align: center;
-    padding: 0.2rem;
-    /* width: 300px; */
-    display: none;
-    z-index: 110;
-    left: 50%;
-    top: 50%;
-    background-color: rgba(22, 123, 210, 0.8);
+  color: #fff;
+  position: absolute;
+  text-align: center;
+  padding: 0.2rem;
+  /* width: 300px; */
+  display: none;
+  z-index: 110;
+  left: 50%;
+  top: 50%;
+  background-color: rgba(22, 123, 210, 0.8);
 }
 
 .containerTool ul {
-    margin: 15px 0;
+  margin: 15px 0;
 }
 
 .containerTool ul li {
-    margin: 7px 0;
+  margin: 7px 0;
 }
 
 .containerTool ul li input {
-    border-radius: 10px;
-    color: #fff;
-    background-color: transparent;
+  border-radius: 10px;
+  color: #fff;
+  background-color: transparent;
 }
 
 .toolBtn {
-    background: transparent;
-    opacity: 0.8;
-    padding: 4px;
-    border-radius: 10px;
-    cursor: pointer;
-    color: #fff;
-    /* text-shadow: 1px 1px rgb(108 247 27), -1px -1px #f0f;
+  background: transparent;
+  opacity: 0.8;
+  padding: 4px;
+  border-radius: 10px;
+  cursor: pointer;
+  color: #fff;
+  /* text-shadow: 1px 1px rgb(108 247 27), -1px -1px #f0f;
     box-shadow: 3px 0px 10px #fff, -3px 0px 10px rgb(255 106 106), 0px 3px 10px rgb(117 235 88), 0px -3px 10px rgb(87 84 221); */
 }
 
 .toolBtn i {
-    font-size: 0.56rem;
+  font-size: 0.56rem;
 }
 
 .toolBtn:hover {
-    opacity: 1;
+  opacity: 1;
 }
 
 .header .title {
-    font-size: 0.6rem;
-    text-align: center;
-    box-sizing: border-box;
+  font-size: 0.6rem;
+  text-align: center;
+  box-sizing: border-box;
 }
 
-
 /* 弹框 */
 
 .holdToos,
 .addThemeToos,
 .holdToosLose,
 .cancelToos {
-    font-size: 0.6rem;
-    color: #e3e3e3;
-    position: absolute;
-    top: 18%;
-    left: 50%;
-    transform: translateX(-50%);
-    background-color: rgba(105, 36, 250, 0.5);
-    padding: 0.1rem;
-    box-sizing: border-box;
-    border-radius: 5px;
-    font-weight: bold;
-    transition: all 0.5s;
-    display: none;
-    z-index: 99999;
+  font-size: 0.6rem;
+  color: #e3e3e3;
+  position: absolute;
+  top: 18%;
+  left: 50%;
+  transform: translateX(-50%);
+  background-color: rgba(105, 36, 250, 0.5);
+  padding: 0.1rem;
+  box-sizing: border-box;
+  border-radius: 5px;
+  font-weight: bold;
+  transition: all 0.5s;
+  display: none;
+  z-index: 99999;
 }
 
 .holdToos .succ {
-    color: #0f0;
+  color: #0f0;
 }
 
 .holdToos .lose {
-    color: #f00;
-    display: none;
+  color: #f00;
+  display: none;
 }
 
 .holdToos.loseActive .succ {
-    display: none;
+  display: none;
 }
 
 .cancelToos {
-    height: auto;
-    display: flex;
-    flex-direction: column;
-    display: none;
-    /* opacity: 0; */
+  height: auto;
+  display: flex;
+  flex-direction: column;
+  display: none;
+  /* opacity: 0; */
 }
 
 .cancelToos p {
-    font-size: 20px;
-    margin: 0.16rem;
-    color: red;
-    letter-spacing: 0.16rem;
+  font-size: 20px;
+  margin: 0.16rem;
+  color: red;
+  letter-spacing: 0.16rem;
 }
 
 .cancelToos .btns {
-    display: flex;
+  display: flex;
 }
 
 .cancelToos .btns button {
-    margin-right: 0.68rem;
-    margin-left: 2px;
-    padding: 0 8px;
-    cursor: pointer;
+  margin-right: 0.68rem;
+  margin-left: 2px;
+  padding: 0 8px;
+  cursor: pointer;
 }
 
 .cancelToos .btns button.succBtn {
-    background-color: #0f0;
+  background-color: #0f0;
 }
 
 .cancelToos .btns button.loseBtn {
-    margin-right: 0;
-    background-color: rgba(238, 83, 83, 0.938);
+  margin-right: 0;
+  background-color: rgba(238, 83, 83, 0.938);
 }
 
 .box {
-    background: url(../images/line.png) rgba(255, 255, 255, 0.03);
+  background: url(../images/line.png) rgba(255, 255, 255, 0.03);
 }
 
 .box::after {
-    position: absolute;
-    top: 0;
-    right: 0;
-    width: 0.5rem;
-    height: 0.5rem;
-    content: "";
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 0.5rem;
+  height: 0.5rem;
+  content: "";
 }
 
 .box::before {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 0.5rem;
-    height: 0.5rem;
-    content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 0.5rem;
+  height: 0.5rem;
+  content: "";
 }
 
 .panel-footer {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    width: 100%;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
 }
 
 .panel-footer::before {
-    position: absolute;
-    left: 0;
-    bottom: 0;
-    width: 0.5rem;
-    height: 0.5rem;
-    content: "";
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  width: 0.5rem;
+  height: 0.5rem;
+  content: "";
 }
 
 .panel-footer::after {
-    position: absolute;
-    bottom: 0;
-    right: 0;
-    width: 0.5rem;
-    height: 0.5rem;
-    content: "";
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  width: 0.5rem;
+  height: 0.5rem;
+  content: "";
 }
 
 .title {
-    display: flex;
-    align-items: center;
+  display: flex;
+  align-items: center;
 }
 
 .title img {
-    width: 0.6rem;
-    height: 0.6rem;
-    margin-right: 0.2rem;
-    border-radius: 50%;
+  width: 0.6rem;
+  height: 0.6rem;
+  margin-right: 0.2rem;
+  border-radius: 50%;
 }
 
 .noData {
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    transform: translate(-50%, -50%);
-    color: #fff;
-    font-size: 20px;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  color: #fff;
+  font-size: 20px;
 }
 
 .setNav {
-    height: 80%;
-    overflow: auto;
+  height: 80%;
+  overflow: auto;
 }
 
 .setNav::-webkit-scrollbar {
-    /*滚动条整体样式*/
-    width: 0px;
-    /*高宽分别对应横竖滚动条的尺寸*/
-    height: 0px;
+  /*滚动条整体样式*/
+  width: 0px;
+  /*高宽分别对应横竖滚动条的尺寸*/
+  height: 0px;
 }
 
 .setNav::-webkit-scrollbar-thumb {
-    /*滚动条里面小方块*/
-    border-radius: 0.2rem;
-    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
-    background: rgba(70, 116, 214, 0.452);
+  /*滚动条里面小方块*/
+  border-radius: 0.2rem;
+  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+  background: rgba(70, 116, 214, 0.452);
 }
 
 .setNav::-webkit-scrollbar-track {
-    /*滚动条里面轨道*/
-    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
-    border-radius: 10px;
-    background: #ededed;
+  /*滚动条里面轨道*/
+  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+  border-radius: 10px;
+  background: #ededed;
 }
 
 #stuTable td,
 #stuTable th {
-  white-space:nowrap;
-    font-size: 0.14rem !important;
+  white-space: nowrap;
+  font-size: 0.14rem !important;
 }
 
 #stuTable tr {
-    height: 0.3rem;
+  height: 0.3rem;
 }
 
 h3 {
-    font-size: 0.18rem;
+  font-size: 0.18rem;
 }
 
 p {
-    font-size: 0.15rem;
+  font-size: 0.15rem;
 }
 
 .proDesc {
-    top: -0.25rem !important;
+  top: -0.25rem !important;
 }
 
 .toop {
-    width: 9rem;
+  width: 9rem;
 }
 
 .right img,
 .left img {
-    width: 45%;
+  width: 45%;
 }
 
 .right span,
 .left span {
-    font-size: 0.35rem;
-    margin: 0 0.1rem;
+  font-size: 0.35rem;
+  margin: 0 0.1rem;
 }
 
 .left span,
 .one span,
 .tow span {
-    font-size: 0.5rem;
+  font-size: 0.5rem;
 }
 
 .test31 li {
-    font-size: 0.2rem;
+  font-size: 0.2rem;
 }
 
 .test38 .content .desc {
-    margin-left: 35%;
+  margin-left: 35%;
 }
 
 span {
-    font-size: 0.25rem;
+  font-size: 0.25rem;
 }
 
 .title h2 {
-    top: -0.04rem !important;
+  top: -0.04rem !important;
 }
 
 p,
@@ -430,9 +439,9 @@ h2,
 h3,
 td,
 th {
-    font-size: 0.18rem !important;
+  font-size: 0.18rem !important;
 }
 
 .progress span span {
-    opacity: 0;
-}
+  opacity: 0;
+}

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

@@ -1,4 +1,4 @@
-const basicUrl = 'http://23.37.100.80:8084/basic';
+const basicUrl = 'http://23.37.100.87:8084/basic';
 // const basicUrl = "http://192.168.0.100:8084/basic";
 
 // http://23.37.100.87:8084