Ver Fonte

冲突解决

yhd há 3 anos atrás
pai
commit
4482027d27
49 ficheiros alterados com 2344 adições e 2148 exclusões
  1. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test1/test1.html
  2. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test1/test1.js
  3. 79 59
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test2/test2.css
  4. 88 90
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test2/test2.html
  5. 28 27
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test2/test2.js
  6. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test2/test2.less
  7. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test27/test27.js
  8. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test29/test29.js
  9. 6 4
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test3/test3.css
  10. 1 34
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test31/test31.js
  11. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test34/test34 copy.js
  12. 197 95
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test39/test39.css
  13. 74 26
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test39/test39.js
  14. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test43/test43.css
  15. 230 223
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test44/test44.js
  16. 13 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test45/test45.css
  17. 4 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test46/test46.css
  18. 57 60
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test46/test46.html
  19. 99 50
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test46/test46.js
  20. 4 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test47/test47.css
  21. 60 62
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test47/test47.html
  22. 110 99
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test47/test47.js
  23. 4 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test48/test48.css
  24. 60 62
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test48/test48.html
  25. 110 99
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test48/test48.js
  26. 26 25
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test49/test49.css
  27. 2 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test50/test50.css
  28. 160 81
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test50/test50.html
  29. 258 370
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test50/test50.js
  30. 0 50
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test51/test51.js
  31. 3 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test54/test54.css
  32. 3 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test55/test55.html
  33. 0 30
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test6/test6.js
  34. 1 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test60/test60.css
  35. 3 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test60/test60.html
  36. 137 137
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test61/test61.css
  37. 2 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test61/test61.html
  38. 4 47
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test61/test61.js
  39. 10 14
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test9/test9.js
  40. 227 223
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/css/coom.css
  41. 1 12
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/index.css
  42. 9 9
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/js/common.js
  43. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/js/common.js
  44. 23 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/js/setCharts.js
  45. 4 6
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/main.html
  46. 6 20
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame1.html
  47. 7 7
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame3.html
  48. 6 6
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame4.html
  49. 220 92
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame5.html

+ 1 - 1
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test1/test1.html

@@ -28,7 +28,7 @@
                             <img src="../images/img_01.jpg" alt="">
                         </div>
                         <div class="explain">
-                            <h3>大熊猫“新星”,38岁生日快乐!</h3>
+                            <h3>sd大熊猫“新星”,38岁生日快乐!</h3>
                             <p>“新星”38岁生日之际,重庆动物园为它准备了开心的生日会,现场游客、现场嘉宾</p>
                             <div class="timer">2022-01-17</div>
                         </div>

+ 1 - 1
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test1/test1.js

@@ -13,7 +13,7 @@ const test1 = (function() {
                  * 成功的回调,失败回调 */
                 url: ZQURL + '/getNews_Top10',
                 data: {
-                    dateType: 0
+                    dateType: 3
                 },
                 type: 'GET',
                 dataType: 'JSON',

+ 79 - 59
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test2/test2.css

@@ -1,94 +1,114 @@
 @keyframes news {
-  0% {
-    transform: translateY(0%);
-  }
-  100% {
-    transform: translateY(-50%);
-  }
-}
+    0% {
+        transform: translateY(0%);
+    }
+    100% {
+        transform: translateY(-50%);
+    }
+}
+
 .visits {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
+    display: flex;
+    flex-direction: column;
+    height: 100%;
 }
+
 .visits .vis-top {
-  display: flex;
-  height: 40%;
+    display: flex;
+    height: 40%;
 }
+
 .visits .vis-top .left {
-  display: flex;
-  flex: 2;
-  background: url(../../images/2bg.png) center;
-  background-repeat: no-repeat;
-  background-size: 100%;
-  position: relative;
-}
+    display: flex;
+    flex: 2;
+    background: url(../../images/2bg.png) center;
+    background-repeat: no-repeat;
+    background-size: 100%;
+    position: relative;
+}
+
 .visits .vis-top .left .vis h4 {
-  border-radius: 0.26rem;
-  color: aqua;
-  padding: 0.2rem;
+    border-radius: 0.26rem;
+    color: aqua;
+    padding: 0.2rem;
 }
+
 .visits .vis-top .left .vis p {
-  width: 1rem;
-  height: 1rem;
-  color: #fff;
-  position: absolute;
-  left: 50%;
-  top: 50%;
-  transform: translate(-50%, -50%);
-}
+    width: 1rem;
+    height: 1rem;
+    color: #fff;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+}
+
 .visits .vis-top .left .vis h4 {
-  position: absolute;
-  top: 0%;
+    position: absolute;
+    top: 0%;
 }
+
 .visits .vis-top .left .one h4 {
-  left: 31%;
-  top: -18%;
+    left: 28%;
+    top: -12%;
 }
+
 .visits .vis-top .left .one p {
-  left: 62%;
-  top: 80%;
+    left: 62%;
+    top: 80%;
 }
+
 .visits .vis-top .left .two h4 {
-  left: -4%;
+    left: -4%;
+    top: 5%;
 }
+
 .visits .vis-top .left .two p {
-  left: 32%;
-  top: -14%;
-  transform: translate(-50%, 80%);
+    left: 32%;
+    top: -2%;
+    transform: translate(-50%, 80%);
 }
+
 .visits .vis-top .left .three h4 {
-  left: 68%;
+    left: 68%;
+    top: 20%;
 }
+
 .visits .vis-top .left .three p {
-  left: 93%;
-  top: 103%;
+    left: 93%;
+    top: 95%;
 }
+
 .visits .vis-top .right {
-  flex: 3;
-  overflow-y: auto;
-  background-color: #0e61b263;
+    flex: 3;
+    overflow: hidden;
+    background-color: #0e61b263;
 }
+
 .visits .vis-top .right .table {
-  width: 100%;
-  color: #fff;
+    width: 100%;
+    color: #fff;
 }
+
 .visits .vis-top .right .table thead {
-  position: relative;
-  z-index: 1000;
-  background-color: #266adc52;
+    position: relative;
+    z-index: 1000;
+    background-color: #266adc52;
 }
+
 .visits .vis-top .right .table tr {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  text-align: center;
-  margin: 4px 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    margin: 4px 0;
 }
+
 .visits .vis-top .right .table tr th,
 .visits .vis-top .right .table tr td {
-  flex: 1;
+    flex: 1;
 }
+
 .visits .vis-bottom {
-  height: 60%;
-}
+    height: 60%;
+}

+ 88 - 90
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test2/test2.html

@@ -1,97 +1,95 @@
-<div class="box2 box" data-name='test2' draggable="true">
-    <div class="toolBox">
-        <span class="fit"></span>
-        <span class="close"></span>
+<div class="box2 box" data-name="test2" draggable="true">
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="tool">
+    <div class="title bgTitle2">
+      <h2>网站访问量排行</h2>
     </div>
-    <div class="tool">
-        <div class="title bgTitle2">
-            <h2>网站访问量排行</h2>
-        </div>
-    </div>
-    <div class="test-box">
-        <div class="content">
-            <!-- <div class="noData">暂无信息</div> -->
-            <!-- 网站访问量排行 -->
-            <div class="visits">
-                <div class="vis-top">
-                    <div class="left">
-                        <div class="one vis">
-                            <h4>重庆动物园</h4>
-                            <p>01</p>
-                        </div>
-                        <div class="two vis">
-                            <h4>南山植物园</h4>
-                            <p>02</p>
-                        </div>
-                        <div class="three vis">
-                            <h4>规划院</h4>
-                            <p>03</p>
-                        </div>
-                    </div>
-                    <div class="right hiddenScroll">
-                        <table class="table">
-                            <thead>
-                                <tr>
-                                    <th>排名</th>
-                                    <th>名称</th>
-                                </tr>
-                            </thead>
-                            <tbody>
-                                <tr>
-                                    <td>01</td>
-                                    <td>重庆环卫</td>
-                                </tr>
-                                <tr>
-                                    <td>02</td>
-                                    <td>重庆环卫</td>
-                                </tr>
-                                <tr>
-                                    <td>03</td>
-                                    <td>重庆环卫</td>
-                                </tr>
-                                <tr>
-                                    <td>04</td>
-                                    <td>重庆环卫</td>
-                                </tr>
-                                <tr>
-                                    <td>05</td>
-                                    <td>重庆环卫</td>
-                                </tr>
-                                <tr>
-                                    <td>06</td>
-                                    <td>重庆环卫</td>
-                                </tr>
-                            </tbody>
-                        </table>
-                    </div>
-                </div>
-                <div class="vis-bottom">
-                    <div class="floor-dist">
-                    </div>
-                </div>
+  </div>
+  <div class="test-box">
+    <div class="content">
+      <!-- <div class="noData">暂无信息</div> -->
+      <!-- 网站访问量排行 -->
+      <div class="visits">
+        <div class="vis-top">
+          <div class="left">
+            <div class="one vis">
+              <h4>重庆动物园</h4>
+              <p>01</p>
+            </div>
+            <div class="two vis">
+              <h4>南山植物园</h4>
+              <p>02</p>
+            </div>
+            <div class="three vis">
+              <h4>规划院</h4>
+              <p>03</p>
             </div>
+          </div>
+          <div class="right">
+            <table class="table">
+              <thead>
+                <tr>
+                  <th>排名</th>
+                  <th>名称</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr>
+                  <td>01</td>
+                  <td>重庆环卫</td>
+                </tr>
+                <tr>
+                  <td>02</td>
+                  <td>重庆环卫</td>
+                </tr>
+                <tr>
+                  <td>03</td>
+                  <td>重庆环卫</td>
+                </tr>
+                <tr>
+                  <td>04</td>
+                  <td>重庆环卫</td>
+                </tr>
+                <tr>
+                  <td>05</td>
+                  <td>重庆环卫</td>
+                </tr>
+                <tr>
+                  <td>06</td>
+                  <td>重庆环卫</td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
         </div>
+        <div class="vis-bottom">
+          <div class="floor-dist"></div>
+        </div>
+      </div>
     </div>
-    <div class="panel-footer"></div>
+  </div>
+  <div class="panel-footer"></div>
 </div>
 
-
 <!-- 工具弹框 -->
-<div class="tools" style="display: none;">
-    <div class="containerTool test2Toll">
-        <ul>
-            <li>
-                <span>宽度:</span>
-                <input class="setWidth" type="text">
-                <span id="validateAge" class="regValidate"></span>
-            </li>
-            <li>
-                <span>高度:</span>
-                <input class="setHeight" type="text">
-            </li>
-        </ul>
-        <!-- 确定 -->
-        <button class="fixBtn toolBtn">确定</button>
-        <button class="offBtn toolBtn">取消</button>
-    </div>
-</div>
+<div class="tools" style="display: none">
+  <div class="containerTool test2Toll">
+    <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>

+ 28 - 27
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test2/test2.js

@@ -13,7 +13,7 @@ const test2 = (function() {
                  * 成功的回调,失败回调 */
                 url: ZQURL + '/getVisitRank',
                 data: {
-                    dateType: 0
+                    dateType: 3
                 },
                 type: 'POST',
                 dataType: 'JSON',
@@ -25,10 +25,6 @@ const test2 = (function() {
                         obj: dataArr
                     } = data;
                     if (dataArr.length == 0) {
-                      $('.test2 .box2 .content').html('暂无数据')
-                      $('.test2 .box2 .content').css('text-align','center')
-                      $('.test2 .box2 .content').css('justify-content','center')
-                      $('.test2 .box2 .content').css('fontSize','0.2rem')
                         return
                     }
                     This.createRanking(dataArr);
@@ -40,14 +36,10 @@ const test2 = (function() {
         },
 
         createRanking(dataArr) {
-          let names = [];
-          let values = [];
           $('.test2 .box2 .one h4').html(dataArr[0].name);
           $('.test2 .box2 .two h4').html(dataArr[1].name);
           $('.test2 .box2 .three h4').html(dataArr[2].name);
            const html = dataArr.map((item,index) => {
-             names.push(item.name);
-             values.push(+item.cnts);
               return `
               <tr>
                 <td>${index+1}</td>
@@ -56,9 +48,6 @@ const test2 = (function() {
               `
             }).join('')
             $('.test2 .box2 tbody').html(html)
-            const dom = document.querySelector('.test2 .floor-dist');
-            const testDom = document.querySelector('.test2 .box');
-            setCharts(dom, testDom,names,values);
         }
     }
 
@@ -73,6 +62,8 @@ const test2 = (function() {
         move3('.test2 .test-box')
         move2('.test2 .containerTool')
 
+        let timer = null;
+
 
         $('.test2 .close').click(function() {
             $('.test2 .box').remove();
@@ -89,12 +80,33 @@ const test2 = (function() {
         if ($('.test2 .box .content .noData').length !== 0) {
             return
         }
+
+        const dists = document.querySelectorAll('.test2 .floor-dist');
+        const testDoms = document.querySelectorAll('.test2 .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('.test2 .test-box')
+
+                myChart.resize();
+            }, 500);
+        })
     }
 
 
-    function setCharts(echartDom, testDom,names,values) {
+    function setCharts(echartDom, testDom) {
         var myChart = echarts.init(echartDom);
-let timer = null;
+
         const offsetX = 20;
         const offsetY = 10;
         // 绘制左侧面
@@ -148,7 +160,7 @@ let timer = null;
         echarts.graphic.registerShape('CubeRight', CubeRight);
         echarts.graphic.registerShape('CubeTop', CubeTop);
 
-        const VALUE = values;
+        const VALUE = [100, 200, 300, 400, 300, 200, 100];
 
         option = {
             // backgroundColor: '#012366',
@@ -171,7 +183,7 @@ let timer = null;
             },
             xAxis: {
                 type: 'category',
-                data: names,
+                data: ['1001', '1002', '1003', '1004', '1005', '1006', '1007'],
                 axisLine: {
                     show: true,
                     lineStyle: {
@@ -319,17 +331,6 @@ let timer = null;
             ],
         };
         myChart.setOption(option);
-        window.addEventListener('resize', function() {
-          if (timer) {
-              clearTimeout(timer);
-              timer = null;
-          }
-          timer = setTimeout(() => {
-              move3('.test2 .test-box')
-
-              myChart.resize();
-          }, 500);
-      })
         if (!testDom) {
             testDom = document.querySelectorAll('.test8 .box');
         }

+ 1 - 1
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test2/test2.less

@@ -97,7 +97,7 @@
 
     .right {
       flex: 3;
-      overflow-y: auto;
+      overflow: hidden;
       background-color: #0e61b263;
 
       .table {

+ 1 - 1
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test27/test27.js

@@ -34,7 +34,7 @@ const test27 = (function() {
     }
 
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/RiskType/getSysRiskType",
+        url: "http://23.37.100.80:8084" + "/basic/RiskType/getSysRiskType",
         data: {
             orgType: 1,
             riskClassify: 1

+ 1 - 1
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test29/test29.js

@@ -24,7 +24,7 @@ const test29 = (function() {
         eventClick('.test29');
         // setCharts(`.test29 .floor-dist`);
         $.ajax({
-            url: "http://23.37.100.87:8084" + "/basic/AttackType/getAttackTypeBymonth",
+            url: "http://23.37.100.80:8084" + "/basic/AttackType/getAttackTypeBymonth",
             data: {
                 orgType: 1
             },

+ 6 - 4
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test3/test3.css

@@ -5,7 +5,7 @@
   margin: 0;
 }
 .overall {
-  color: #5C96FF;
+  color: #5c96ff;
   padding: 0.16rem;
 }
 .overall ul {
@@ -27,7 +27,7 @@
   font-size: 0.22rem;
   font-family: Source Han Sans SC;
   font-weight: 400;
-  color: #677EA1;
+  color: #677ea1;
 }
 .overall ul li .num {
   font-size: 0.25rem !important;
@@ -35,9 +35,11 @@
   font-weight: 400;
 }
 .overall ul li .details p {
-  color: #5C96FF;
+  color: #5c96ff;
 }
 .title h2 {
   position: relative;
-  top: -0.1rem;
+  left: -4%;
+  /* top: -0.1rem; */
+  font-weight: bold;
 }

+ 1 - 34
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test31/test31.js

@@ -18,45 +18,12 @@ const test31 = (function() {
             }),
             $(".box31 li").click(function() {
                 $(".company-details").show();
+
                 if (con++ % 2 === 1) {
                     $('.box31-two').css('height', '0')
                 } else {
                     $('.box31-two').css('height', '100%')
                 }
-                $.ajax({
-                  url: basicUrl +
-                      "/SystemRisk/GetSystemRiskList",
-                  data: {},
-                  success: function(res) {
-                      console.log('安全等级弹框', res);
-                      const {result} = res;
-                     const html = result.map((item,index) => {
-                       const high = item.high_risk_number;
-                       const middle = item.middle_risk_number;
-                       let sum = high + middle;
-                       if(isNaN(sum)){
-                         sum = 0;
-                       }
-                      return `
-                          <tr class="tbody-box">
-                            <td class="tbody-details">${index+1}</td>
-                            <td class="tbody-details">${item.office_name}</td>
-                            <td class="tbody-details">${item.system_name}</td>
-                            <td class="tbody-details">${high||'-'}</td>
-                            <td class="tbody-details">${middle || '-'}</td>
-                            <td class="tbody-details">-</td>
-                            <td class="tbody-details">${sum}</td>
-                            <td class="tbody-details"></td>
-                          </tr>
-                      `
-                      }).join('');
-                      $('.box31-two .company-details tbody').html(html);
-                  },
-                  error: function(err) {
-                      console.log("----安全等级弹框--------超时");
-                  },
-              });
-
             });
 
 

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

@@ -21,7 +21,7 @@ const test34 = (function() {
 
 
         $.ajax({
-            url: "http://23.37.100.87:8084" + "/basic/RiskNews/getRiskNewsByInfo",
+            url: "http://23.37.100.80:8084" + "/basic/RiskNews/getRiskNewsByInfo",
             data: {},
             success: function(res) {
                 console.log('漏洞情报', res);

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

@@ -1,137 +1,239 @@
 .box39 .container {
-    margin: 50px auto;
-    width: 80%;
+  margin: 50px auto;
+  width: 80%;
 }
 
-.box39 .container>div {
-    margin-bottom: 7%;
+.box39 .container > div {
+  margin-bottom: 7%;
 }
 
 .box39 .progress {
-    height: 0.1rem;
-    background: #ebebeb;
-    border-left: 1px solid transparent;
-    border-right: 1px solid transparent;
-    border-radius: 1rem;
-    position: relative;
+  height: 0.1rem;
+  background: #ebebeb;
+  border-left: 1px solid transparent;
+  border-right: 1px solid transparent;
+  border-radius: 1rem;
+  position: relative;
 }
 
 .box39 .progress:nth-child(1) {
-    margin-top: 0.2rem;
+  margin-top: 0.2rem;
 }
 
 .box39 .progress .proDesc {
-    position: absolute;
-    top: -0.2rem !important;
-    left: 0.3rem;
-    color: #fff;
-    font-size: 0.11rem !important;
+  position: absolute;
+  top: -0.2rem !important;
+  left: 0.3rem;
+  color: #fff;
+  font-size: 0.11rem !important;
 }
 
 .box39 .progress .proDesc i {
-    content: "";
-    width: 0.12rem;
-    height: 0.12rem;
-    border-radius: 50%;
-    position: absolute;
-    left: -0.3rem;
-    top: 68%;
-    transform: translateY(-50%);
+  content: "";
+  width: 0.12rem;
+  height: 0.12rem;
+  border-radius: 50%;
+  position: absolute;
+  left: -0.3rem;
+  top: 68%;
+  transform: translateY(-50%);
 }
 
-.box39 .progress>span {
-    position: relative;
-    float: left;
-    margin: 0 -1px;
-    min-width: 30px;
-    height: 0.1rem;
-    line-height: 0.2rem;
-    text-align: right;
-    background: #cccccc;
-    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);
-    box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2);
+.box39 .progress > span {
+  position: relative;
+  float: left;
+  margin: 0 -1px;
+  min-width: 30px;
+  height: 0.1rem;
+  line-height: 0.2rem;
+  text-align: right;
+  background: #cccccc;
+  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);
+  box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2);
 }
 
-.box39 .progress>span span {
-    padding: 0 8px;
-    font-weight: bold;
-    color: #404040;
-    color: rgba(0, 0, 0, 0.7);
-    text-shadow: 0 1px rgba(255, 255, 255, 0.4);
+.box39 .progress > span span {
+  padding: 0 8px;
+  font-weight: bold;
+  color: #404040;
+  color: rgba(0, 0, 0, 0.7);
+  text-shadow: 0 1px rgba(255, 255, 255, 0.4);
 }
 
-.box39 .progress>span::before {
-    content: '';
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    z-index: 1;
-    height: 0.2rem;
-    background: url(../../images/progress.png) 0 0 repeat-x;
-    border-radius: 1rem;
+.box39 .progress > span::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 1;
+  height: 0.2rem;
+  background: url(../../images/progress.png) 0 0 repeat-x;
+  border-radius: 1rem;
 }
 
 .box39 .progress .txt {
-    position: absolute;
-    right: -12%;
-    top: -60%;
-    font-size: 0.14rem !important;
-    background: none;
-    border: none;
-    color: #fff;
-    box-shadow: none;
+  position: absolute;
+  right: -12%;
+  top: -60%;
+  font-size: 0.14rem !important;
+  background: none;
+  border: none;
+  color: #fff;
+  box-shadow: none;
 }
 
 .box39 .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: #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%
+  );
 }
 
 .box39 .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: #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%
+  );
 }
 
 .box39 .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: #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%
+  );
 }
 
 .box39 .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: #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%
+  );
 }
 
 .box39 .floor-dist {
-    width: 100%;
+  width: 100%;
 }
 
 .tool {
-    position: absolute;
-    width: 100%;
-}
+  position: absolute;
+  /* top: -6%; */
+  width: 100%;
+}

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

@@ -9,6 +9,7 @@ const test39 = (function() {
         move2('.test39 .containerTool')
 
 
+        let timer = null;
 
 
         $('.test39 .close').click(function() {
@@ -21,35 +22,82 @@ const test39 = (function() {
 
         eventClick('.test39');
 
+        const dists = document.querySelectorAll('.test39 .floor-dist');
+        const testDoms = document.querySelectorAll('.test39 .box');
+        for (let i = 0; i < dists.length; i++) {
+            const dom = dists[i];
+            // setCharts(dom, testDoms[i]);
+        }
 
-        // 攻击类型
-        $.ajax({
-          url: FLAT_PATH_THREE +'/apiUrl/sendApiUrlAndParam',
-          type:'GET',
-          data: {
-            urlCode:'AQZX_011',
-            params:'{"startTime":"2020-06-23 00:00:00","endTime":"2022-04-29 19:41:58","size":5}'
-          },
-          success: function(res) {
-            const result = JSON.parse(res.data);
-            console.log('攻击类型', result);
-             const html = result.data.map((item,index) => {
-              return `
-              <div class="progress">
-                <div class="proDesc"><i style="background-color: #ccc;"></i> 远程控制 》 恶意IP</div>
-                <span style="width: 20%;"><span>20%</span></span>
-                <span class="txt"><i style="color: #ccc;">202</i> 条</span>
-              </div>
-              `
-              }).join('');
-              $('.test39 .box39 .container').html(html ? html : '暂无数据')
-          },
-          error: function(err) {
-              console.log("----攻击类型--------超时");
-          },
-      });
+        // let myChart = echarts.init(dists[0]);
 
+        window.addEventListener('resize', function() {
+            if (timer) {
+                clearTimeout(timer);
+                timer = null;
+            }
+            timer = setTimeout(() => {
+                // myChart.resize();
+            }, 500);
+        })
     }
 
+    function setCharts(echartDom, testDom) {
+        // 1实例化对象
+        myChart = echarts.init(echartDom);
+        let option = {
+            tooltip: {
+                trigger: 'item'
+            },
+            legend: {
+                orient: 'vertical',
+                left: 'right',
+                top: "center",
+                textStyle: {
+                    color: "rgba(255,255,255,.5)",
+                    fontSize: "12",
+                },
+            },
+            series: [{
+                name: 'Access From',
+                type: 'pie',
+                radius: ['40%', '70%'],
+                avoidLabelOverlap: false,
+                itemStyle: {
+                    borderRadius: 10,
+                    borderColor: '#fff',
+                    borderWidth: 2
+                },
+                label: {
+                    show: false,
+                    position: 'center'
+                },
+                emphasis: {
+                    label: {
+                        show: true,
+                        fontSize: '40',
+                        fontWeight: 'bold'
+                    }
+                },
+                labelLine: {
+                    show: false
+                },
+                data: [
+                    { value: 1048, name: 'Search' },
+                    { value: 735, name: 'Direct' },
+                    { value: 580, name: 'Email' },
+                    { value: 484, name: 'U Ads' },
+                    { value: 300, name: 'V Ads' }
+                ]
+            }]
+        };
+        myChart.setOption(option);
+        // obsDom(`.test39 .box`, myChart)
+
+        if (!testDom) {
+            testDom = document.querySelectorAll('.test39 .box');
+        }
+        obsDom(testDom, myChart)
+    }
     return test39
 })();

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

@@ -12,7 +12,7 @@
   position: relative;
 }
 .box43 ul li img {
-  width: 52%;
+  width: 100%;
 }
 .box43 ul li .desc {
   position: relative;

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

@@ -1,241 +1,248 @@
-const test44 = (function() {
-    let allHealth = 80;
+const test44 = (function () {
+  let allHealth = 80;
 
-    function test44(id, domTitle) {
-        if (domTitle) {
-            $(".test44 .title h2").text(domTitle);
-        }
-        $(".test44 .box").css("z-index", ++zIndex);
-        $(".test44 .box").attr("data-id", id);
-        move3(".test44 .test-box");
-        move2(".test44 .containerTool");
-
-        $(".test44 .close").click(function() {
-            $(".test44 .box").remove();
-            $(".test44 .containerTool").css("display", "none");
-            $(".test44 .setWidth").val("");
-            $(".test44 .setHeight").val("");
-            moduleIdRemove.push(id);
-        });
+  function test44(id, domTitle) {
+    if (domTitle) {
+      $(".test44 .title h2").text(domTitle);
+    }
+    $(".test44 .box").css("z-index", ++zIndex);
+    $(".test44 .box").attr("data-id", id);
+    move3(".test44 .test-box");
+    move2(".test44 .containerTool");
 
-        eventClick(".test44");
+    $(".test44 .close").click(function () {
+      $(".test44 .box").remove();
+      $(".test44 .containerTool").css("display", "none");
+      $(".test44 .setWidth").val("");
+      $(".test44 .setHeight").val("");
+      moduleIdRemove.push(id);
+    });
 
-        myAjax44();
+    eventClick(".test44");
+    const dists = document.querySelectorAll(".test44 .floor-dist");
+    const testDoms = document.querySelectorAll(".test44 .box");
+    for (let i = 0; i < dists.length; i++) {
+      const dom = dists[i];
+      setCharts(dom, testDoms[i], allHealth);
     }
+    // myAjax44();
+  }
 
-    function setCharts(echartDom, testDom, allHealth) {
-        let timer = null;
+  function setCharts(echartDom, testDom, allHealth) {
+    let timer = null;
 
-        // 1实例化对象
-        let myChart = echarts.init(echartDom);
-        if (allHealth > 180) {
-            allHealth = 180;
-        } else if (allHealth < 0) {
-            allHealth = -parseInt(allHealth);
-        }
+    // 1实例化对象
+    let myChart = echarts.init(echartDom);
+    if (allHealth > 180) {
+      allHealth = 180;
+    } else if (allHealth < 0) {
+      allHealth = -parseInt(allHealth);
+    }
 
-        // obsDom(`.test7 .box`, myChart)
+    // obsDom(`.test7 .box`, myChart)
 
-        var normal = 100,
-            all = 100;
-        option = {
-            series: [{
-                    name: "刻度",
-                    type: "gauge",
-                    center: ["50%", "70%"],
-                    radius: "110%",
-                    min: 0, //最小刻度
-                    max: 100, //最大刻度
-                    splitNumber: 10, //刻度数量
-                    startAngle: 180,
-                    endAngle: 0,
-                    axisLine: {
-                        show: true,
-                        lineStyle: {
-                            width: 1,
-                            color: [
-                                [1, "rgba(0,0,0,0)"]
-                            ],
-                        },
-                    }, //仪表盘轴线
-                    axisLabel: {
-                        show: true,
-                        color: "#fff",
-                        fontSize: 30,
-                        distance: -50,
-                        formatter: function(v) {
-                            return v;
-                        },
-                    }, //刻度标签。
-                    axisTick: {
-                        show: true,
-                        splitNumber: 5,
-                        lineStyle: {
-                            color: "#263b35",
-                            width: 1,
-                            // length:10
-                        },
-                        length: -20,
-                    }, //刻度样式
-                    splitLine: {
-                        show: true,
-                        length: -20,
-                        lineStyle: {
-                            color: "#4aca96",
-                            width: 2,
-                        },
-                    }, //分隔线样式
-                },
-                {
-                    type: "gauge",
-                    radius: "100%",
-                    center: ["50%", "70%"],
-                    splitNumber: 0, //刻度数量
-                    startAngle: 180,
-                    endAngle: 0,
-                    axisLine: {
-                        show: true,
-                        lineStyle: {
-                            width: 50,
-                            color: [
-                                [
-                                    1,
-                                    new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
-                                            offset: 0,
-                                            color: "#fcfe92",
-                                        },
-                                        {
-                                            offset: 1,
-                                            color: "#4ccb96",
-                                        },
-                                    ]),
-                                ],
-                            ],
-                        },
-                    },
-                    //分隔线样式。
-                    splitLine: {
-                        show: false,
-                    },
-                    axisLabel: {
-                        show: false,
-                    },
-                    axisTick: {
-                        show: false,
-                    },
-                    pointer: {
-                        show: true,
-                        length: "80%",
-                        width: "2%",
-                    },
-                    title: {
-                        show: true,
-                        offsetCenter: [0, "60%"], // x, y,单位px
-                        textStyle: {
-                            fontWeight: "bold",
-                            color: "#0ab7ff",
-                            fontSize: 30,
-                        },
+    var normal = 100,
+      all = 100;
+    option = {
+      series: [
+        {
+          name: "刻度",
+          type: "gauge",
+          center: ["50%", "70%"],
+          radius: "110%",
+          min: 0, //最小刻度
+          max: 100, //最大刻度
+          splitNumber: 10, //刻度数量
+          startAngle: 180,
+          endAngle: 0,
+          axisLine: {
+            show: true,
+            lineStyle: {
+              width: 1,
+              color: [[1, "rgba(0,0,0,0)"]],
+            },
+          }, //仪表盘轴线
+          axisLabel: {
+            show: true,
+            color: "#fff",
+            fontSize: 80,
+            distance: -50,
+            formatter: function (v) {
+              return v;
+            },
+          }, //刻度标签。
+          axisTick: {
+            show: true,
+            splitNumber: 5,
+            lineStyle: {
+              color: "#263b35",
+              width: 1,
+              // length:10
+            },
+            length: -20,
+          }, //刻度样式
+          splitLine: {
+            show: true,
+            length: -20,
+            lineStyle: {
+              color: "#4aca96",
+              width: 2,
+            },
+          }, //分隔线样式
+        },
+        {
+          type: "gauge",
+          radius: "100%",
+          center: ["50%", "70%"],
+          splitNumber: 0, //刻度数量
+          startAngle: 180,
+          endAngle: 0,
+          axisLine: {
+            show: true,
+            lineStyle: {
+              width: 50,
+              color: [
+                [
+                  1,
+                  new echarts.graphic.LinearGradient(0, 0, 1, 0, [
+                    {
+                      offset: 0,
+                      color: "#fcfe92",
                     },
-                    //仪表盘详情,用于显示数据。
-                    detail: {
-                        show: true,
-                        offsetCenter: [0, "-40%"],
-                        color: "#ffffff",
-                        textStyle: {
-                            fontSize: 40,
-                            color: "#4aca96",
-                        },
+                    {
+                      offset: 1,
+                      color: "#4ccb96",
                     },
-                    data: [{
-                        value: allHealth,
-                    }, ],
-                },
-            ],
-        };
+                  ]),
+                ],
+              ],
+            },
+          },
+          //分隔线样式。
+          splitLine: {
+            show: false,
+          },
+          axisLabel: {
+            show: false,
+          },
+          axisTick: {
+            show: false,
+          },
+          pointer: {
+            show: true,
+            length: "80%",
+            width: "2%",
+          },
+          title: {
+            show: true,
+            offsetCenter: [0, "60%"], // x, y,单位px
+            textStyle: {
+              fontWeight: "bold",
+              color: "#0ab7ff",
+              fontSize: 100,
+            },
+          },
+          //仪表盘详情,用于显示数据。
+          detail: {
+            show: true,
+            offsetCenter: [0, "-40%"],
+            color: "#ffffff",
+            textStyle: {
+              fontSize: 150,
+              color: "#4aca96",
+            },
+          },
+          data: [
+            {
+              value: allHealth,
+            },
+          ],
+        },
+      ],
+    };
 
-        // setInterval(function() {
-        //     currentOption = currentOption === scatterOption ? barOption : scatterOption;
-        //     myChart.setOption(currentOption, true);
-        // }, 2000);
-        myChart.setOption(option);
-        // obsDom(`.test7 .box`, myChart)
-        window.addEventListener("resize", function() {
-            if (timer) {
-                clearTimeout(timer);
-                timer = null;
-            }
-            timer = setTimeout(() => {
-                move3(".test44 .test-box");
+    // setInterval(function() {
+    //     currentOption = currentOption === scatterOption ? barOption : scatterOption;
+    //     myChart.setOption(currentOption, true);
+    // }, 2000);
+    myChart.setOption(option);
+    // obsDom(`.test7 .box`, myChart)
+    window.addEventListener("resize", function () {
+      if (timer) {
+        clearTimeout(timer);
+        timer = null;
+      }
+      timer = setTimeout(() => {
+        move3(".test44 .test-box");
 
-                myChart.resize();
-            }, 500);
-        });
-        if (!testDom) {
-            testDom = document.querySelectorAll(".test7 .box");
-        }
-        obsDom(testDom, myChart);
+        myChart.resize();
+      }, 500);
+    });
+    if (!testDom) {
+      testDom = document.querySelectorAll(".test7 .box");
     }
+    obsDom(testDom, myChart);
+  }
 
-    function myAjax44() {
-        $.ajax({
-            url: baseURL + "/getHealthOfAll",
-            data: {
-                orgIds: "200",
-            },
-            type: "GET",
-            dataType: "JSON",
-            success: function(data) {
-                if (data.code != 0) {
-                    console.log("健康度------------------------code!=0");
-                    return;
-                }
-                // const result = eval('(' + data.data + ')');
-                console.log("健康度------------------------", data);
+  //   function myAjax44() {
+  //     $.ajax({
+  //       url: baseURL + "/getHealthOfAll",
+  //       data: {
+  //         orgIds: "200",
+  //       },
+  //       type: "GET",
+  //       dataType: "JSON",
+  //       success: function (data) {
+  //         if (data.code != 0) {
+  //           console.log("健康度------------------------code!=0");
+  //           return;
+  //         }
+  //         // const result = eval('(' + data.data + ')');
+  //         console.log("健康度------------------------", data);
 
-                const res = data.data.params;
-                allHealth = data.data.allHealth; // 网络设备维修度
-                setContent(res);
+  //         const res = data.data.params;
+  //         allHealth = data.data.allHealth; // 网络设备维修度
+  //         setContent(res);
 
-                const dists = document.querySelectorAll(".test44 .floor-dist");
-                const testDoms = document.querySelectorAll(".test44 .box");
-                for (let i = 0; i < dists.length; i++) {
-                    const dom = dists[i];
-                    setCharts(dom, testDoms[i], allHealth);
-                }
-            },
-            timeout: 6000,
-            error: function() {
-                console.log("健康度------------------------超时了");
-            },
-        });
+  //         const dists = document.querySelectorAll(".test44 .floor-dist");
+  //         const testDoms = document.querySelectorAll(".test44 .box");
+  //         for (let i = 0; i < dists.length; i++) {
+  //           const dom = dists[i];
+  //           // setCharts(dom, testDoms[i], allHealth);
+  //         }
+  //       },
+  //       timeout: 6000,
+  //       error: function () {
+  //         console.log("健康度------------------------超时了");
+  //       },
+  //     });
 
-        // 设计文本内容
-        function setContent(Data) {
-            for (let i = 0; i < Data.length; i++) {
-                switch (Data[i].TYPE) {
-                    case "1": // 服务器
-                        $(".server_prec").html(Math.ceil(Data[i].average) + "%");
-                        break;
-                    case "2": // 数据库
-                        $(".database_prec").html(Math.ceil(Data[i].average) + "%");
-                        break;
-                    case "3": // 应用服务器
-                        $(".app_server_prec").html(Math.ceil(Data[i].average) + "%");
-                        break;
-                    case "4": // 网络设备
-                        $(".network_prec").html(Math.ceil(Data[i].average) + "%");
-                        break;
-                    case "5": // 应用系统
-                        $(".app_system_prec").html(Math.ceil(Data[i].average) + "%");
-                        break;
-                    case "6": // 第三方应用系统
-                        $(".other_prec").html(Math.ceil(Data[i].average) + "%");
-                        break;
-                }
-            }
-        }
-    }
+  //     // 设计文本内容
+  //     function setContent(Data) {
+  //       for (let i = 0; i < Data.length; i++) {
+  //         switch (Data[i].TYPE) {
+  //           case "1": // 服务器
+  //             $(".server_prec").html(Math.ceil(Data[i].average) + "%");
+  //             break;
+  //           case "2": // 数据库
+  //             $(".database_prec").html(Math.ceil(Data[i].average) + "%");
+  //             break;
+  //           case "3": // 应用服务器
+  //             $(".app_server_prec").html(Math.ceil(Data[i].average) + "%");
+  //             break;
+  //           case "4": // 网络设备
+  //             $(".network_prec").html(Math.ceil(Data[i].average) + "%");
+  //             break;
+  //           case "5": // 应用系统
+  //             $(".app_system_prec").html(Math.ceil(Data[i].average) + "%");
+  //             break;
+  //           case "6": // 第三方应用系统
+  //             $(".other_prec").html(Math.ceil(Data[i].average) + "%");
+  //             break;
+  //         }
+  //       }
+  //     }
+  //   }
 
-    return test44;
-})();
+  return test44;
+})();

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

@@ -3,6 +3,10 @@
 }
 .box45 .content {
   margin: 0;
+  width: 90%;
+  height: 90%;
+  margin-top: 2%;
+  margin-left: 6%;
 }
 .box45 .left,
 .box45 .right {
@@ -68,3 +72,12 @@
 .box45 .commonly {
   background-color: #66650c;
 }
+.box45 .success {
+  background-color: #4162ce;
+}
+.box45 .commonly {
+  background-color: #66650c;
+}
+.box45 .commonly {
+  background-color: #66650c;
+}

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

@@ -4,7 +4,8 @@
   margin-left: 1.8rem;
 }
 .box46 .container > div {
-  margin-bottom: 5%;
+  margin-top: 8%;
+  /* margin-bottom: 5%; */
 }
 .box46 .progress {
   height: 0.09rem;
@@ -16,8 +17,8 @@
 }
 .box46 .progress .proDesc {
   position: absolute;
-  top: -10% !important;
-  left: -36%;
+  top: -70% !important;
+  left: -43%;
   color: #fff;
 }
 .box46 .progress > span {

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

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

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

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

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

@@ -4,7 +4,8 @@
   margin-left: 1.8rem;
 }
 .box47 .container > div {
-  margin-bottom: 5%;
+  margin-top: 8%;
+  /* margin-bottom: 5%; */
 }
 .box47 .progress {
   height: 0.09rem;
@@ -16,8 +17,8 @@
 }
 .box47 .progress .proDesc {
   position: absolute;
-  top: -10% !important;
-  left: -36%;
+  top: -70% !important;
+  left: -43%;
   color: #fff;
 }
 .box47 .progress > span {

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

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

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

@@ -1,103 +1,114 @@
-const test47 = (function() {
+const test47 = (function () {
     function test47(id, domTitle) {
-        if (domTitle) {
-            $('.test47 .title h2').text(domTitle)
-        }
-        $('.test47 .box').css('z-index', ++zIndex)
-        $('.test47 .box').attr('data-id', id)
-        move3('.test47 .test-box')
-        move2('.test47 .containerTool')
-
-
-        let timer = null;
-
-
-        $('.test47 .close').click(function() {
-            $('.test47 .box').remove();
-            $('.test47 .containerTool').css('display', 'none');
-            $('.test47 .setWidth').val('')
-            $('.test47 .setHeight').val('')
-            moduleIdRemove.push(id)
-        })
-
-        eventClick('.test47');
-
-        const dists = document.querySelectorAll('.test47 .floor-dist');
-        const testDoms = document.querySelectorAll('.test47 .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(() => {
-                // myChart.resize();
-            }, 500);
-        })
+      if (domTitle) {
+        $(".test47 .title h2").text(domTitle);
+      }
+      $(".test47 .box").css("z-index", ++zIndex);
+      $(".test47 .box").attr("data-id", id);
+      move3(".test47 .test-box");
+      move2(".test47 .containerTool");
+  
+      $(".test47 .close").click(function () {
+        $(".test47 .box").remove();
+        $(".test47 .containerTool").css("display", "none");
+        $(".test47 .setWidth").val("");
+        $(".test47 .setHeight").val("");
+        moduleIdRemove.push(id);
+      });
+  
+      eventClick(".test47");
+      function sucTimer() {
+        var num = 0;
+        var num1 = 0;
+  
+        var num2 = 0;
+  
+        var num3 = 0;
+  
+        var num4 = 0;
+  
+        var timer = setInterval(function () {
+          $("#OA").css("width", num + "%");
+          if (num == 20) {
+            clearInterval(timer);
+          } else {
+            num += 5;
+          }
+        }, 30);
+        var timer1 = setInterval(function () {
+          $("#core").css("width", num1 + "%");
+          if (num1 == 40) {
+            clearInterval(timer1);
+          } else {
+            num1 += 5;
+          }
+        }, 30);
+        var timer2 = setInterval(function () {
+          $("#Anti-Virus").css("width", num2 + "%");
+          if (num2 == 60) {
+            clearInterval(timer2);
+          } else {
+            num2 += 5;
+          }
+        }, 30);
+        var timer3 = setInterval(function () {
+          $("#Electronic-seal").css("width", num3 + "%");
+          if (num3 == 80) {
+            clearInterval(timer3);
+          } else {
+            num3 += 5;
+          }
+        }, 30);
+        var timer4 = setInterval(function () {
+          $("#office").css("width", num4 + "%");
+          if (num4 == 100) {
+            clearInterval(timer4);
+          } else {
+            num4 += 5;
+          }
+        }, 30);
+      }
+      sucTimer();
     }
-
-    function setCharts(echartDom, testDom) {
-        // 1实例化对象
-        myChart = echarts.init(echartDom);
-        let option = {
-            tooltip: {
-                trigger: 'item'
-            },
-            legend: {
-                orient: 'vertical',
-                left: 'right',
-                top: "center",
-                textStyle: {
-                    color: "rgba(255,255,255,.5)",
-                    fontSize: "12",
-                },
-            },
-            series: [{
-                name: 'Access From',
-                type: 'pie',
-                radius: ['40%', '70%'],
-                avoidLabelOverlap: false,
-                itemStyle: {
-                    borderRadius: 10,
-                    borderColor: '#fff',
-                    borderWidth: 2
-                },
-                label: {
-                    show: false,
-                    position: 'center'
-                },
-                emphasis: {
-                    label: {
-                        show: true,
-                        fontSize: '40',
-                        fontWeight: 'bold'
-                    }
-                },
-                labelLine: {
-                    show: false
-                },
-                data: [
-                    { value: 1048, name: 'Search' },
-                    { value: 735, name: 'Direct' },
-                    { value: 580, name: 'Email' },
-                    { value: 484, name: 'U Ads' },
-                    { value: 300, name: 'V Ads' }
-                ]
-            }]
-        };
-        myChart.setOption(option);
-        // obsDom(`.test47 .box`, myChart)
-
-        if (!testDom) {
-            testDom = document.querySelectorAll('.test47 .box');
+  
+    function myAjax() {
+      $.ajax({
+        url: baseURL + "/selectMgtServerTop5",
+        data: {
+          orgIds: "323598b4196341b6a73969cfe7162209",
+        },
+        type: "GET",
+        dataType: "JSON",
+        success: function (data) {
+          const { data: res } = data;
+          if (data.code != 0) {
+            return alert("请求数据失败");
+          }
+          // topData = eval('(' + data.data + ')');
+          setCPU(res.cpu);
+        },
+        timeout: 6000,
+        error: function () {
+          console.log("超时了");
+        },
+      });
+  
+      function setCPU(res) {
+        let str = "";
+        for (let i = 0; i < res.length; i++) {
+          const prog = res[i];
+          str += `
+          <div class="progress">
+            <div class="proDesc">${prog.RESNAME}</div>
+            <span class="green" style="width: 19%;"></span>
+            <span class="txt">40%</span>
+          </div>`;
         }
-        obsDom(testDom, myChart)
+  
+        $(".container").html(str);
+      }
     }
-    return test47
-})();
+  
+    return test47;
+  })();
+  

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

@@ -4,7 +4,8 @@
   margin-left: 1.8rem;
 }
 .box48 .container > div {
-  margin-bottom: 5%;
+  margin-top: 8%;
+  /* margin-bottom: 5%; */
 }
 .box48 .progress {
   height: 0.09rem;
@@ -16,8 +17,8 @@
 }
 .box48 .progress .proDesc {
   position: absolute;
-  top: -10% !important;
-  left: -36%;
+  top: -70% !important;
+  left: -43%;
   color: #fff;
 }
 .box48 .progress > span {

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

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

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

@@ -1,103 +1,114 @@
-const test48 = (function() {
+const test48 = (function () {
     function test48(id, domTitle) {
-        if (domTitle) {
-            $('.test48 .title h2').text(domTitle)
-        }
-        $('.test48 .box').css('z-index', ++zIndex)
-        $('.test48 .box').attr('data-id', id)
-        move3('.test48 .test-box')
-        move2('.test48 .containerTool')
-
-
-        let timer = null;
-
-
-        $('.test48 .close').click(function() {
-            $('.test48 .box').remove();
-            $('.test48 .containerTool').css('display', 'none');
-            $('.test48 .setWidth').val('')
-            $('.test48 .setHeight').val('')
-            moduleIdRemove.push(id)
-        })
-
-        eventClick('.test48');
-
-        const dists = document.querySelectorAll('.test48 .floor-dist');
-        const testDoms = document.querySelectorAll('.test48 .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(() => {
-                // myChart.resize();
-            }, 500);
-        })
+      if (domTitle) {
+        $(".test48 .title h2").text(domTitle);
+      }
+      $(".test48 .box").css("z-index", ++zIndex);
+      $(".test48 .box").attr("data-id", id);
+      move3(".test48 .test-box");
+      move2(".test48 .containerTool");
+  
+      $(".test48 .close").click(function () {
+        $(".test48 .box").remove();
+        $(".test48 .containerTool").css("display", "none");
+        $(".test48 .setWidth").val("");
+        $(".test48 .setHeight").val("");
+        moduleIdRemove.push(id);
+      });
+  
+      eventClick(".test48");
+      function sucTimer() {
+        var num = 0;
+        var num1 = 0;
+  
+        var num2 = 0;
+  
+        var num3 = 0;
+  
+        var num4 = 0;
+  
+        var timer = setInterval(function () {
+          $("#OA").css("width", num + "%");
+          if (num == 20) {
+            clearInterval(timer);
+          } else {
+            num += 5;
+          }
+        }, 30);
+        var timer1 = setInterval(function () {
+          $("#core").css("width", num1 + "%");
+          if (num1 == 40) {
+            clearInterval(timer1);
+          } else {
+            num1 += 5;
+          }
+        }, 30);
+        var timer2 = setInterval(function () {
+          $("#Anti-Virus").css("width", num2 + "%");
+          if (num2 == 60) {
+            clearInterval(timer2);
+          } else {
+            num2 += 5;
+          }
+        }, 30);
+        var timer3 = setInterval(function () {
+          $("#Electronic-seal").css("width", num3 + "%");
+          if (num3 == 80) {
+            clearInterval(timer3);
+          } else {
+            num3 += 5;
+          }
+        }, 30);
+        var timer4 = setInterval(function () {
+          $("#office").css("width", num4 + "%");
+          if (num4 == 100) {
+            clearInterval(timer4);
+          } else {
+            num4 += 5;
+          }
+        }, 30);
+      }
+      sucTimer();
     }
-
-    function setCharts(echartDom, testDom) {
-        // 1实例化对象
-        myChart = echarts.init(echartDom);
-        let option = {
-            tooltip: {
-                trigger: 'item'
-            },
-            legend: {
-                orient: 'vertical',
-                left: 'right',
-                top: "center",
-                textStyle: {
-                    color: "rgba(255,255,255,.5)",
-                    fontSize: "12",
-                },
-            },
-            series: [{
-                name: 'Access From',
-                type: 'pie',
-                radius: ['40%', '70%'],
-                avoidLabelOverlap: false,
-                itemStyle: {
-                    borderRadius: 10,
-                    borderColor: '#fff',
-                    borderWidth: 2
-                },
-                label: {
-                    show: false,
-                    position: 'center'
-                },
-                emphasis: {
-                    label: {
-                        show: true,
-                        fontSize: '40',
-                        fontWeight: 'bold'
-                    }
-                },
-                labelLine: {
-                    show: false
-                },
-                data: [
-                    { value: 1048, name: 'Search' },
-                    { value: 735, name: 'Direct' },
-                    { value: 580, name: 'Email' },
-                    { value: 484, name: 'U Ads' },
-                    { value: 300, name: 'V Ads' }
-                ]
-            }]
-        };
-        myChart.setOption(option);
-        // obsDom(`.test48 .box`, myChart)
-
-        if (!testDom) {
-            testDom = document.querySelectorAll('.test48 .box');
+  
+    function myAjax() {
+      $.ajax({
+        url: baseURL + "/selectMgtServerTop5",
+        data: {
+          orgIds: "323598b4196341b6a73969cfe7162209",
+        },
+        type: "GET",
+        dataType: "JSON",
+        success: function (data) {
+          const { data: res } = data;
+          if (data.code != 0) {
+            return alert("请求数据失败");
+          }
+          // topData = eval('(' + data.data + ')');
+          setCPU(res.cpu);
+        },
+        timeout: 6000,
+        error: function () {
+          console.log("超时了");
+        },
+      });
+  
+      function setCPU(res) {
+        let str = "";
+        for (let i = 0; i < res.length; i++) {
+          const prog = res[i];
+          str += `
+          <div class="progress">
+            <div class="proDesc">${prog.RESNAME}</div>
+            <span class="green" style="width: 19%;"></span>
+            <span class="txt">40%</span>
+          </div>`;
         }
-        obsDom(testDom, myChart)
+  
+        $(".container").html(str);
+      }
     }
-    return test48
-})();
+  
+    return test48;
+  })();
+  

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

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

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

@@ -37,8 +37,8 @@
   position: relative;
 }
 .box50 .content .item .item-box .temp p {
-  font-size: 0.25rem;
-  margin: 0.2rem 0;
+  font-size: 0.15rem !important;
+  /* margin: 0.2rem 0; */
 }
 .box50 .content .item .item-box .temp::after {
   content: "";

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

@@ -1,89 +1,168 @@
-<div class="box50 box" data-name='test50'>
-    <div class="toolBox">
-        <span class="fit"></span>
-        <span class="close"></span>
+<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 class="tool">
-        <div class="title bgTitle">
-            <h2>受攻击最严重业务系统</h2>
+  </div>
+  <div class="test-box">
+    <!-- <div class="content">
+      <div id="show" style="overflow: scroll; height: 210px">
+        rrrrrrrrrrrrrrrrrrrrrrrrrrrrr r r
+        <div
+          style="
+            width: 100px;
+            height: 10px;
+            border: 1px solid red;
+            top: 0px;
+            left: -10px;
+            position: relative;
+          "
+        >
+          dd
         </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
+          style="
+            width: 100px;
+            height: 10px;
+            border: 1px solid red;
+            top: 50px;
+            postion: absolute;
+            margin-top: -40;
+            margin-left: -20;
+            folat: left;
+          "
+        >
+          ddddddd
         </div>
-    </div>
-    <div class="panel-footer"></div>
+        <div
+          style="width: 100px; height: 10px; border: 1px solid red; folat: left"
+        >
+          ddddddd
+        </div>
+        r r
+        <p>1</p>
+        <p>2</p>
+        <p>2</p>
+        <p>3</p>
+        <p>4</p>
+        <p>5</p>
+        <p>6</p>
+        <p>7</p>
+        <p>r8</p>
+        <p>9</p>
+        <p>r0</p>
+        <p> </p>
+      </div>
+    </div> -->
+    <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="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>
+  function startmarquee(lh, speed, delay) {
+    var t;
+    var oHeight = 200; /**/ /** div的高度 **/
+    var p = false;
+    var o = document.getElementById("show");
+    var preTop = 0;
+    o.scrollTop = 0;
+    function start() {
+      t = setInterval(scrolling, speed);
+      //  o.scrollTop += 1;
+    }
+    function scrolling() {
+      //  alert()
+      //   if(o.scrollTop%lh!=0 && o.scrollTop%(o.scrollHeight-oHeight-1)!=0){
 
-    <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>
+      if (o.scrollHeight - o.offsetHeight < o.scrollTop) {
+        preTop = o.scrollTop;
+        o.scrollTop += 1;
+        if (preTop >= o.scrollHeight || preTop == o.scrollTop) {
+          o.scrollTop = 0;
+        }
+      } else {
+        // clearInterval(t);
+        // setTimeout(start,delay);
+      }
+      o.scrollTop += 1;
+    }
+    setTimeout(start, delay);
+  }
+  startmarquee(20, 20, 500); /**startmarquee(一次滚动高度,速度,停留时间);**/
+</script> -->

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

@@ -1,545 +1,433 @@
 const test50 = (function () {
-  function test50 (id, domTitle) {
+  function test50(id, domTitle) {
     if (domTitle) {
-      $('.test50 .title h2').text(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)
-    })
+    $(".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');
+    eventClick(".test50");
 
-      // 二号楼中心机房
+    // 二号楼中心机房
     $.ajax({
-      url: ROOM + '/api/devicesignaltable/listByName',
+      url: ROOM + "/api/devicesignaltable/listByName",
       data: {
-        "deviceName": '八楼'
+        deviceName: "八楼",
       },
       success: function ({ data }) {
         // 温度
-        let temperature = data.filter(item => {
-          return item.signalname==='温度'
+        let temperature = data.filter((item) => {
+          return item.signalname === "温度";
         })[0].signalvalue;
-        // 湿度 
-        let humidity = data.filter(item => {
-          return item.signalname==='湿度'
+        // 湿度
+        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 +'℃');
+        $(".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('--机房接口八楼,二号楼-------------超时');
-      }
+        console.log("--机房接口八楼,二号楼-------------超时");
+      },
     });
 
-
     // 网络核心机房
     $.ajax({
-      url: ROOM + '/api/devicesignaltable/listByName',
+      url: ROOM + "/api/devicesignaltable/listByName",
       data: {
-        "deviceName": '四楼'
+        deviceName: "四楼",
       },
       success: function ({ data }) {
         // 温度
-        let temperature = data.filter(item => {
-          return item.signalname==='温度'
+        let temperature = data.filter((item) => {
+          return item.signalname === "温度";
         })[0].signalvalue;
-        // 湿度 
-        let humidity = data.filter(item => {
-          return item.signalname==='湿度'
+        // 湿度
+        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 +'℃');
+
+        $(".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('--网络核心机房-------------超时');
-      }
+        console.log("--网络核心机房-------------超时");
+      },
     });
 
-
     // 配线间机房
     $.ajax({
-      url: ROOM + '/api/devicesignaltable/listByName',
+      url: ROOM + "/api/devicesignaltable/listByName",
       data: {
-        "deviceName": '九楼'
+        deviceName: "九楼",
       },
       success: function ({ data }) {
         // 温度
-        let temperature = data.filter(item => {
-          return item.signalname==='温度'
+        let temperature = data.filter((item) => {
+          return item.signalname === "温度";
         })[0].signalvalue;
-        // 湿度 
-        let humidity = data.filter(item => {
-          return item.signalname==='湿度'
+        // 湿度
+        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 +'℃');
+        $(".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'
+        console.log("--配线间机房-------------超时");
       },
-      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'){ // 网络核心机房
+    $(".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号楼中心机房
+      } else if (typeId === "2") {
+        // 2号楼中心机房
         eighthFloor();
-      }else if(typeId === '3'){ // 配线间机房
-        ninthFloor()
-      }else if(typeId === '4'){ // 档案库房
+      } else if (typeId === "3") {
+        // 配线间机房
+        ninthFloor();
+      } else if (typeId === "4") {
+        // 档案库房
         dasRoom();
-      }else{ // UPS供电机房
+      } else {
+        // UPS供电机房
         upsOf();
       }
 
       // 二号楼中心机房
       function eighthFloor() {
         $.ajax({
-          url: ROOM + '/api/devicesignaltable/listByName',
+          url: ROOM + "/api/devicesignaltable/listByName",
           data: {
-            "deviceName": '八楼'
+            deviceName: "八楼",
           },
           success: function ({ data }) {
-            console.log('机房接口八楼,二号楼', data);
+            console.log("机房接口八楼,二号楼", data);
             // 温度
-            let temperature = data.filter(item => {
-              return item.signalname==='温度'
+            let temperature = data.filter((item) => {
+              return item.signalname === "温度";
             })[0].signalvalue;
-            // 湿度 
-            let humidity = data.filter(item => {
-              return item.signalname==='湿度'
+            // 湿度
+            let humidity = data.filter((item) => {
+              return item.signalname === "湿度";
             })[0].signalvalue;
-            
+
             // 漏水位置/米
-            let leackgePosition = data.filter(item => {
-              return item.signalname==='漏水1位置'
+            let leackgePosition = data.filter((item) => {
+              return item.signalname === "漏水1位置";
             })[0].signalvalue;
             // 电阻率
             let eleRes = data[3].signalvalue;
-            if(isNaN(eleRes)){
+            if (isNaN(eleRes)) {
               eleRes = 0;
             }
             // 机房水浸状态
-            let waterStauts = data.filter(item => {
-              return item.signalname==='水浸1状态'
+            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)
+            $(".springFrame5 .box58 .text1").html(comStatus);
+            $(".springFrame5 .box58 .text2").html(waterStauts);
+            setCharts52(dom52, testDom52, temperature, humidity);
+            setCharts59(dom59, testDom59, temperature, humidity);
+            setCharts58(dom58, testDom58, leackgePosition, eleRes);
           },
           error: function (err) {
-            console.log('--机房接口八楼,二号楼-------------超时');
-          }
+            console.log("--机房接口八楼,二号楼-------------超时");
+          },
         });
       }
 
       // 网络核心机房
       function fourthFloor() {
         $.ajax({
-          url: ROOM + '/api/devicesignaltable/listByName',
+          url: ROOM + "/api/devicesignaltable/listByName",
           data: {
-            "deviceName": '四楼'
+            deviceName: "四楼",
           },
           success: function ({ data }) {
-            console.log('网络核心机房', data);
+            console.log("网络核心机房", data);
             // 温度
-            let temperature = data.filter(item => {
-              return item.signalname==='温度'
+            let temperature = data.filter((item) => {
+              return item.signalname === "温度";
             })[0].signalvalue;
-            // 湿度 
-            let humidity = data.filter(item => {
-              return item.signalname==='湿度'
+            // 湿度
+            let humidity = data.filter((item) => {
+              return item.signalname === "湿度";
             })[0].signalvalue;
-            
+
             // 漏水位置/米
-            let leackgePosition = data.filter(item => {
-              return item.signalname==='漏水1位置'
+            let leackgePosition = data.filter((item) => {
+              return item.signalname === "漏水1位置";
             })[0].signalvalue;
             // 电阻率
             let eleRes = data[3].signalvalue;
-            if(isNaN(eleRes)){
+            if (isNaN(eleRes)) {
               eleRes = 0;
             }
             // 机房温湿度状态
-            let waterStauts = data.filter(item => {
-              return item.devicename==="四楼机房温湿度1" && item.signalname==='通信状态'
+            let waterStauts = data.filter((item) => {
+              return (
+                item.devicename === "四楼机房温湿度1" &&
+                item.signalname === "通信状态"
+              );
             })[0].signalvalue;
 
             // 机房水浸通信状态
-            let comStatus = data.filter(item => {
-              return item.devicename==="四楼机房水浸1" && item.signalname==='通信状态'
+            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状态"
+            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==='通信状态'
+            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#消防主机状态"
+            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"
+            // 消防状态模块-开关量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)
+            $(".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('--网络核心机房-------------超时');
-          }
+            console.log("--网络核心机房-------------超时");
+          },
         });
       }
 
       // 配线间机房
       function ninthFloor() {
         $.ajax({
-          url: ROOM + '/api/devicesignaltable/listByName',
+          url: ROOM + "/api/devicesignaltable/listByName",
           data: {
-            "deviceName": '九楼'
+            deviceName: "九楼",
           },
           success: function ({ data }) {
-            console.log('配线间机房', data);
+            console.log("配线间机房", data);
             // 温度
-            let temperature = data.filter(item => {
-              return item.signalname==='温度'
+            let temperature = data.filter((item) => {
+              return item.signalname === "温度";
             })[0].signalvalue;
-            // 湿度 
-            let humidity = data.filter(item => {
-              return item.signalname==='湿度'
+            // 湿度
+            let humidity = data.filter((item) => {
+              return item.signalname === "湿度";
             })[0].signalvalue;
-            
+
             // 漏水位置/米
-            let leackgePosition = data.filter(item => {
-              return item.signalname==='漏水1位置'
+            let leackgePosition = data.filter((item) => {
+              return item.signalname === "漏水1位置";
             })[0].signalvalue;
             // 电阻率
             let eleRes = data[3].signalvalue; // d
-            if(isNaN(eleRes)){
+            if (isNaN(eleRes)) {
               eleRes = 0;
             }
             // 机房温湿度状态
-            let waterStauts = data.filter(item => {
-              return item.devicename==="九楼机房温湿度4" && item.signalname==='通信状态'
+            let waterStauts = data.filter((item) => {
+              return (
+                item.devicename === "九楼机房温湿度4" &&
+                item.signalname === "通信状态"
+              );
             })[0].signalvalue;
 
             // 机房水浸通信状态
-            let comStatus = data.filter(item => {
-              return item.devicename==="九楼机房水浸3" && item.signalname==='通信状态'
+            let comStatus = data.filter((item) => {
+              return (
+                item.devicename === "九楼机房水浸3" &&
+                item.signalname === "通信状态"
+              );
             })[0].signalvalue;
 
             // 机房水浸1状态
-            let sStatus = data.filter(item => {
-              return item.signalname==="水浸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)
+            $(".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('--配线间机房-------------超时');
-          }
+            console.log("--配线间机房-------------超时");
+          },
         });
       }
 
-     
-
       // 档案室库房
       function dasRoom() {
         $.ajax({
           /** url,data参数,
            * type请求类型,响应体结果,超时时间
            * 成功的回调,失败回调 */
-          url: DH + 'queryData/queryDeviceParam',
+          url: DH + "apiUrl/sendApiUrl",
           data: {
-              "urlCode": 'DH_002'
+            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)
+          type: "GET",
+          dataType: "JSON",
+          success: function ({ data }) {
+            console.log("档案室库房", data);
           },
           timeout: 6000,
-          error: function() {
-              console.log('档案室库房超时了');
+          error: function () {
+            console.log("档案室库房超时了");
           },
-      });
+        });
       }
 
       // UPS供电机房
       function upsOf() {
         $.ajax({
-          url: ROOM + '/api/devicesignaltable/listByName',
+          url: ROOM + "/api/devicesignaltable/listByName",
           data: {
-            "deviceName": 'UPS'
+            deviceName: "UPS",
           },
-          success:function ({data}) {
-            console.log('UPS供电机房',data);
+          success: function ({ data }) {
+            console.log("UPS供电机房", data);
           },
           error: function (err) {
-            console.log('--UPS供电机房-------------超时');
-          }
+            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
+      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');
+        $(".springFrame5 .roomThree62").css("visibility", "inherit");
+        $(".springFrame5 .roomThree63").css("visibility", "hidden");
+        $(".springFrame5 .roomThree64").css("visibility", "hidden");
+        $(".springFrame5 .roomThree65").css("visibility", "hidden");
+        $(".springFrame5 .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');
+        $(".springFrame5 .roomThree62").css("visibility", "hidden");
+        $(".springFrame5 .roomThree63").css("visibility", "inherit");
+        $(".springFrame5 .roomThree64").css("visibility", "hidden");
+        $(".springFrame5 .roomThree65").css("visibility", "hidden");
+        $(".springFrame5 .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');
+        $(".springFrame5 .roomThree62 ").css("visibility", "hidden");
+        $(".springFrame5 .roomThree63").css("visibility", "hidden");
+        $(".springFrame5 .roomThree64").css("visibility", "inherit");
+        $(".springFrame5 .roomThree65").css("visibility", "hidden");
+        $(".springFrame5 .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');
+        $(".springFrame5 .roomThree62").css("visibility", "hidden");
+        $(".springFrame5 .roomThree63").css("visibility", "hidden");
+        $(".springFrame5 .roomThree64").css("visibility", "hidden");
+        $(".springFrame5 .roomThree65").css("visibility", "inherit");
+        $(".springFrame5 .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');
+        // $('.springFrame5 .roomThree62').css('visibility', 'hidden');
+        // $('.springFrame5 .roomThree63').css('visibility', 'hidden');
+        // $('.springFrame5 .roomThree64').css('visibility', 'hidden');
+        // $('.springFrame5 .roomThree65').css('visibility', 'hidden');
+        // $('.springFrame5 .roomThree66').css('visibility', 'inherit');
         // module66();
       }
       $(".sf5").slideToggle();
-    })
+    });
   }
 
-  return test50
+  return test50;
 })();

+ 0 - 50
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test51/test51.js

@@ -18,56 +18,6 @@ const test51 = (function() {
         })
 
         eventClick('.test51');
-
-           // 告警信息
-   $.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('')
-      $('.test51 .box51 tbody').html(html)
-    },
-    timeout: 6000,
-    error: function() {
-        console.log('告警信息超时了');
-    },
-});
     }
 
     return test51

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

@@ -5,3 +5,6 @@
   margin: 0;
   padding: 0;
 }
+.floor-dist {
+  margin-top: 5%;
+}

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

@@ -49,8 +49,9 @@
             version="1.1"
             xmlns="http://www.w3.org/2000/svg"
             p-id="2773"
-            width="20"
-            height="20"
+            width="200"
+            height="200"
+            style="margin-top: -35px"
           >
             <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"

+ 0 - 30
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test6/test6.js

@@ -25,35 +25,6 @@ const test6 = (function() {
         eventClick('.test6');
         // setCharts(`.test6 .floor-dist`);
 
-
-        //地图
-        $.ajax({
-          /** url,data参数,
-           * type请求类型,响应体结果,超时时间
-           * 成功的回调,失败回调 */
-          url: ZQURL + '/getHotMap',
-          data: {
-              dateType: 0
-          },
-          type: 'POST',
-          dataType: 'JSON',
-          contentType: 'application/x-www-form-urlencoded',
-          success: function(data) {
-              console.log('地图', data);
-              if (data.success != 'true') return
-              const {
-                  obj: dataArr
-              } = data;
-              if (dataArr.length == 0) {
-                  return
-              }
-              This.createRanking(dataArr);
-          },
-          error: function() {
-              console.log('地图超时了');
-          },
-      });
-
         const dists = document.querySelectorAll('.test6 .floor-dist');
         const testDoms = document.querySelectorAll('.test6 .box');
         for (let i = 0; i < dists.length; i++) {
@@ -74,7 +45,6 @@ const test6 = (function() {
                 myChart.resize();
             }, 500);
         })
-
     }
 
     function setCharts(echartDom, testDom) {

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

@@ -28,6 +28,7 @@
   border-radius: 20%;
   text-align: center;
   margin-left: 5%;
+  margin-top: 0.4rem;
 }
 .Water-immersion-box-title {
   margin: auto;

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

@@ -21,8 +21,8 @@
                 version="1.1"
                 xmlns="http://www.w3.org/2000/svg"
                 p-id="1578"
-                width="20"
-                height="20"
+                width="200"
+                height="200"
               >
                 <path
                   d="M478.462882 476.972344L304.069869 973.321689h496.349345L626.026201 475.481805z"
@@ -46,7 +46,7 @@
                 ></path>
               </svg>
             </div>
-            <div>通信状态</div>
+            <div style="font-size: 0.1rem !important">通信状态</div>
           </div>
           <div class="Water-immersion-text">正常</div>
         </div>

+ 137 - 137
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test61/test61.css

@@ -1,244 +1,244 @@
 .box61 .test-box {
-  width: 100%;
-  height: 100%;
-  padding: 0;
+    width: 100%;
+    height: 100%;
+    padding: 0;
 }
 
 .box61 .content {
-  margin: 0;
-  padding: 0;
+    margin: 0;
+    padding: 0;
 }
 
 .bg-center {
-  width: 100%;
-  height: 50%;
-  background: url("../../css/modules/layer/default/组69拷贝.png") no-repeat;
-  background-size: 100%;
-  position: absolute;
+    width: 100%;
+    height: 50%;
+    background: url("../../css/modules/layer/default/组69拷贝.png") no-repeat;
+    background-size: 100%;
+    position: absolute;
 }
 
 .bg-center-img-one {
-  position: absolute;
-  top: 30%;
-  left: 46%;
-  width: 10%;
-  text-align: center;
+    position: absolute;
+    top: 30%;
+    left: 46%;
+    width: 10%;
+    text-align: center;
 }
 
 .bg-center-img-one-text {
-  font-size: 0.2rem !important;
-  font-weight: 700;
-  color: #75e2fa;
+    font-size: 0.2rem !important;
+    font-weight: 700;
+    color: #75e2fa;
 }
 
 .bg-center-img-one img {
-  width: 100%;
-  height: 100%;
+    width: 100%;
+    height: 100%;
 }
 
 .bg-center-img-two {
-  position: absolute;
-  top: 12%;
-  width: 5%;
-  left: 22%;
-  text-align: center;
+    position: absolute;
+    top: 12%;
+    width: 5%;
+    left: 22%;
+    text-align: center;
 }
 
 .bg-center-img-two-text {
-  font-size: 0.15 !important;
-  font-weight: 700;
-  color: #75e2fa;
+    font-size: 0.15 !important;
+    font-weight: 700;
+    color: #75e2fa;
 }
 
 .bg-center-img-three {
-  position: absolute;
-  width: 6%;
-  top: 47%;
-  left: 13%;
-  text-align: center;
+    position: absolute;
+    width: 6%;
+    top: 47%;
+    left: 13%;
+    text-align: center;
 }
 
 .bg-center-img-three-text {
-  font-size: 0.15rem !important;
-  font-weight: 700;
-  color: #75e2fa;
+    font-size: 0.15rem !important;
+    font-weight: 700;
+    color: #75e2fa;
 }
 
 .bg-center-img-four {
-  position: absolute;
-  top: 40%;
-  right: 10%;
-  width: 5%;
-  text-align: center;
+    position: absolute;
+    top: 40%;
+    right: 10%;
+    width: 5%;
+    text-align: center;
 }
 
 .bg-center-img-four-text {
-  font-size: 0.15rem !important;
-  font-weight: 700;
-  color: #fff;
+    font-size: 0.15rem !important;
+    font-weight: 700;
+    color: #fff;
 }
 
 .bg-center-img-three img {
-  width: 100%;
-  height: 100%;
+    width: 100%;
+    height: 100%;
 }
 
 .bg-center-img-two img {
-  width: 100%;
-  height: 100%;
+    width: 100%;
+    height: 100%;
 }
 
 .bg-center-img-four img {
-  width: 100%;
-  height: 100%;
+    width: 100%;
+    height: 100%;
 }
 
 .bg-botton {
-  margin: auto;
-  width: 25%;
-  height: 50%;
-  position: absolute;
-  top: 50%;
-  left: 38%;
+    margin: auto;
+    width: 25%;
+    height: 50%;
+    position: absolute;
+    top: 50%;
+    left: 38%;
 }
 
 .bg-botton img {
-  width: 100%;
-  height: 100%;
+    width: 100%;
+    height: 100%;
 }
 
 .bg-botton-two {
-  width: 100%;
-  height: 50%;
-  background: url("../../css/modules/layer/default/传送带拷贝.png") no-repeat;
-  background-size: 100%;
-  position: absolute;
-  top: 80%;
-  display: flex;
-  justify-content: space-between;
-  color: #9fdbf0;
-  text-align: center;
+    width: 100%;
+    height: 50%;
+    background: url("../../css/modules/layer/default/传送带拷贝.png") no-repeat;
+    background-size: 100%;
+    position: absolute;
+    top: 80%;
+    display: flex;
+    justify-content: space-between;
+    color: #9fdbf0;
+    text-align: center;
 }
 
 .left-box {
-  width: 50%;
-  height: 100%;
-  display: flex;
+    width: 50%;
+    height: 100%;
+    display: flex;
 }
 
 .right-box {
-  width: 50%;
-  height: 100%;
-  display: flex;
-  justify-content: center;
-  position: absolute;
-  left: 53%;
+    width: 50%;
+    height: 100%;
+    display: flex;
+    justify-content: center;
+    position: absolute;
+    left: 53%;
 }
 
 .left-box-one {
-  width: 25%;
-  height: 100%;
-  background: url("../../css/modules/layer/default/组58.png") no-repeat;
-  background-size: 100%;
-  margin-top: -34%;
-  margin-left: 3%;
+    width: 25%;
+    height: 100%;
+    background: url("../../css/modules/layer/default/组58.png") no-repeat;
+    background-size: 100%;
+    margin-top: -34%;
+    margin-left: 3%;
 }
 
 .left-box-two {
-  width: 25%;
-  height: 100%;
-  background: url("../../css/modules/layer/default/业务系统.png") no-repeat;
-  background-size: 100%;
-  margin-top: -34%;
-  margin-left: 3%;
+    width: 25%;
+    height: 100%;
+    background: url("../../css/modules/layer/default/业务系统.png") no-repeat;
+    background-size: 100%;
+    margin-top: -34%;
+    margin-left: 3%;
 }
 
 .left-box-one-title {
-  margin-top: 20%;
+    margin-top: 20%;
 }
 
 .number-img {
-  width: 10%;
-  height: 30%;
-  margin: auto;
-  position: absolute;
-  top: 40%;
-  left: 46%;
+    width: 10%;
+    height: 30%;
+    margin: auto;
+    position: absolute;
+    top: 40%;
+    left: 46%;
 }
 
 .number-img img {
-  width: 100%;
-  height: 100%;
+    width: 100%;
+    height: 100%;
 }
 
 
 /* 弹窗样式 */
 
 .Popup {
-  width: 35%;
-  height: 30%;
-  /* font-size: 1rem !important; */
-  position: absolute;
-  top: 60%;
-  left: 20%;
-  background: url("../../css/modules/layer/default/色相饱和度1854.png") no-repeat;
-  background-size: 100% 100%;
+    width: 35%;
+    height: 30%;
+    /* font-size: 1rem !important; */
+    position: absolute;
+    top: 60%;
+    left: 20%;
+    background: url("../../css/modules/layer/default/色相饱和度1854.png") no-repeat;
+    background-size: 100% 100%;
 }
 
 .close-Popup {
-  color: #4decfd;
-  position: absolute;
-  top: 20%;
-  left: 49%;
-  font-size: 0.15rem !important;
+    color: #4decfd;
+    position: absolute;
+    top: 20%;
+    left: 49%;
+    font-size: 0.15rem !important;
 }
 
 .box61 .Popup #stuTable {
-  overflow: hidden;
-  width: 90%;
-  height: 55%;
-  text-align: center;
-  font-size: 0.15rem !important;
-  position: absolute;
-  top: 21%;
-  left: 5%;
+    overflow: hidden;
+    width: 90%;
+    height: 55%;
+    text-align: center;
+    font-size: 0.15rem !important;
+    position: absolute;
+    top: 21%;
+    left: 5%;
 }
 
 .number-box {
-  color: #fff;
-  position: relative;
-  top: 70%;
-  left: 37.5%;
+    color: #fff;
+    position: relative;
+    top: 70%;
+    left: 37.5%;
 }
 
 .Popup-name {
-  position: relative;
-  top: 5.5%;
-  left: 44%;
-  font-size: 0.15rem !important;
-  color: #4decfd;
+    position: relative;
+    top: 5.5%;
+    left: 44%;
+    font-size: 0.15rem !important;
+    color: #4decfd;
 }
 
 .box61 .Tr-td {
-  height: 20% !important;
+    height: 20% !important;
 }
 
 .box61 .Tr-td:nth-child(1) {
-  width: 20%;
+    width: 20%;
 }
 
 .box61 #stuTable thead {
-  color: #eee;
-  background-color: #205dcf83;
+    color: #eee;
+    background-color: #205dcf83;
 }
 
 .box61 #stuTable tbody {
-  color: #fff;
-  height: 80%;
-  background-color: #205dcf46;
+    color: #fff;
+    height: 80%;
+    background-color: #205dcf46;
 }
 
 .box61 .stuTableTr {
-  min-width: 20%;
-  height: 50%;
+    min-width: 20%;
+    height: 50%;
 }

+ 2 - 2
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test61/test61.html

@@ -61,7 +61,7 @@
       </div>
     </div>
     <!-- 感染病毒详情弹窗 -->
-    <div class="Popup hiddenScroll" style="display: none">
+    <div class="Popup" style="display: none">
       <div class="Popup-name">市环卫中心<span class="close-Popup">X</span></div>
       <table id="stuTable" class="table">
         <thead>
@@ -90,7 +90,7 @@
           </tr>
         </tbody>
       </table>
-      <div class="number-box" style="display: none;">病毒感染总数:<span>5</span>台</div>
+      <div class="number-box">病毒感染总数:<span>5</span>台</div>
     </div>
   </div>
   <div class="panel-footer"></div>

+ 4 - 47
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test61/test61.js

@@ -30,6 +30,8 @@ const test61 = (function() {
             $(".sf1").slideDown();
             $(".sf3").slideUp();
             $(".sf4").slideUp();
+            setCharts13(dom13, testDom13);
+            setCharts14(dom14, testDom14);
         });
 
 
@@ -40,8 +42,8 @@ const test61 = (function() {
             $(".sf1").slideUp();
             $(".sf3").slideUp();
 
-            // setCharts27(dom27, testDom27);
-            // setCharts29(dom29, testDom29);
+            setCharts27(dom27, testDom27);
+            setCharts29(dom29, testDom29);
         });
 
         // 华为
@@ -58,51 +60,6 @@ const test61 = (function() {
             $(".test61 .Popup").css("display", "none");
         });
         $(".test61 .left-box-three").click(function() {
-
-          $.ajax({
-            url: basicUrl +
-                "/SystemRisk/GetSystemRiskList",
-            data: {},
-            success: function(res) {
-                console.log('安全等级弹框', res);
-                const {result} = res;
-               const html = result.map((item,index) => {
-                 const high = item.high_risk_number;
-                 const middle = item.middle_risk_number;
-                 let sum = high + middle;
-                 if(isNaN(sum)){
-                   sum = 0;
-                 }
-                 let status = '中';
-                 switch (item.safety_status) {
-                   case 1:
-                    status = '低'
-                     break;
-                     case 2:
-                      status = '中'
-                      break;
-                   default:
-                    status = '高'
-                     break;
-                 }
-                return `
-                    <tr class="Tr-td">
-                      <td>${item.system_name}</td>
-                      <td>${high}</td>
-                      <td>${middle}</td>
-                      <td>${status}</td>
-                      <td>${item.update_time ||item.create_time }</td>
-                    </tr>
-                `
-                }).join('');
-                $('.box61 .Popup tbody').html(html);
-            },
-            error: function(err) {
-                console.log("----安全等级弹框--------超时");
-            },
-        });
-
-
             $(".test61 .Popup").css("display", "block");
         });
     }

+ 10 - 14
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test9/test9.js

@@ -5,7 +5,6 @@ const test9 = (function() {
     // 热门文章排行
     const RankingOfPopularArticles = {
         init() {
-          const This = this;
             $.ajax({
                 /** url,data参数,
                  * type请求类型,响应体结果,超时时间
@@ -31,7 +30,7 @@ const test9 = (function() {
                       })
                         return
                     }
-                    This.createRankingPopularArticles(dataArr);
+                    // This.createRankingPopularArticles(dataArr);
                 },
                 error: function() {
                     console.log('热门文章排行超时了');
@@ -45,19 +44,16 @@ const test9 = (function() {
                 return item.titlepic != '' && item.summary != '';
             })
             newDataArr.forEach((d, i) => {
-                  html+=`
-                  <li>
-                  <div>
-                      <img src="${imgURL + d.titlepic}" alt="">
-                  </div>
-                  <div class="info">
-                      <h5>${d.title}</h5>
-                      <p>${d.summary}</p>
-                  </div>
-              </li>
-                   `
+                html += `
+            <div>
+                <img src="${imgURL + d.titlepic}" alt="">
+            </div>
+                <div class="info">
+              <h5>${d.title}</h5>
+            <p>${d.summary}</p>
+          </div>
+        `
             })
-            $('.test9 .box9 ul').html(html);
         }
     }
 

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

@@ -1,426 +1,430 @@
 html {
-    user-select: none;
+  user-select: none;
 }
 
 .heaTit {
-    line-height: 1rem;
+  line-height: 1rem;
 }
 
 .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.45rem;
+  letter-spacing: 0.1rem;
+  background-image: -webkit-linear-gradient(
+    bottom,
+    rgb(111, 48, 143),
+    rgb(206, 130, 68)
+  );
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
 }
 
 .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.3rem;
+  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.4rem;
+  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.19rem !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 +434,9 @@ h2,
 h3,
 td,
 th {
-    font-size: 0.18rem !important;
+  font-size: 0.18rem !important;
 }
 
 .progress span span {
-    opacity: 0;
-}
+  opacity: 0;
+}

+ 1 - 12
spring-cloud/server-page/src/main/resources/static/testEcharts/test/index.css

@@ -109,7 +109,7 @@ iframe {
     justify-content: center;
     align-items: center;
     cursor: pointer;
-    z-index: 999999;
+    z-index: 99;
 }
 
 .springFrameTitle {
@@ -126,15 +126,4 @@ iframe {
 .springFrameTitle h2 {
     font-size: 00.3rem !important;
     line-height: 0.7rem;
-}
-
-.roomThree{
-  /* width: 50%;
-  height: 80%; */
-  /* width: 50%;
-  height: 50%; */
-  position: absolute;
-  left: 0;
-  top: 0;
-  z-index: 9999;
 }

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

@@ -1,17 +1,17 @@
-let baseURL = 'http://23.37.100.87:8088/itsm/openInterface'; // 资源保障管理专题(运维)
+let baseURL = 'http://23.37.100.80:8088/itsm/openInterface'; // 资源保障管理专题(运维)
 
 
-const FLAT_PATH_THREE = "http://23.37.100.87:8084/threeapi";
+const FLAT_PATH_THREE = "http://23.37.100.80:8084/threeapi";
 
-const ZQURL = 'http://23.37.100.87:8181/InterfaceController.asmx'; // 站群
-const imgURL = 'http://23.37.100.87:8182'; // 站群
+const ZQURL = 'http://23.37.100.80:81/InterfaceController.asmx'; // 站群
+const imgURL = 'http://23.37.100.80:82'; // 站群
 
-// const FLAT_PATH_THREE = "http://23.37.100.87:8084/threeapi"
-// 23.37.100.87
+// const FLAT_PATH_THREE = "http://23.37.100.80:8084/threeapi"
+// 23.37.100.80
 // 机房 - DH
-const ROOM = 'http://23.37.100.87:7002';
-// const DH = 'http://23.37.100.87:8084/threeapi/';
-const DH = 'http://23.37.100.87:8084/imcp-api/';
+const ROOM = 'http://23.37.100.80:7002';
+const DH = 'http://23.37.100.80:8084/threeapi/';
+// const DH = 'http://23.37.100.80:8084/imcp-api/';
 
 function getDateString(date) {
     const dt = new Date(date)

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

@@ -1,7 +1,7 @@
 const basicUrl = 'http://23.37.100.87:8084/basic';
 // const basicUrl = "http://192.168.0.100:8084/basic";
 
-// http://23.37.100.87:8084
+// http://23.37.100.80:8084
 
 let pages = [];
 let themeId; // 主题id

+ 23 - 3
spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/js/setCharts.js

@@ -75,6 +75,26 @@ function setChartsDom(echartDom) {
                             )
                         ]
                     ],
+                    // color: [
+                    //     [0.3, '#00ed03'],
+                    //     [0.7, '#ffb800'],
+                    //     [1, '#af00a9']
+                    // ]
+                    /*color: [
+                        [1, new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
+                                offset: 0.3,
+                                color: "#00ed03"
+                            },
+                            {
+                                offset: 0.7,
+                                color: "#ffb800"
+                            },
+                            {
+                                offset: 1,
+                                color: "#af00a9"
+                            }
+                        ])]
+                    ]*/
                 }
             },
             // radius: '50%',
@@ -179,7 +199,7 @@ function setCharts52(echartDom, testDom,temperature,humidity) {
             axisLine: {
               show: true,
               lineStyle: {
-                width: 20,
+                width: 52,
                 shadowBlur: 0,
                 color: [[1, highlight]],
               },
@@ -188,7 +208,7 @@ function setCharts52(echartDom, testDom,temperature,humidity) {
               show: true,
               lineStyle: {
                 color: highlight,
-                width: 20,
+                width: 50,
               },
               length: -5,
               splitNumber: 10,
@@ -243,7 +263,7 @@ function setCharts52(echartDom, testDom,temperature,humidity) {
               lineStyle: {
                 // 属性lineStyle控制线条样式
                 color: "auto",
-                width: 20,
+                width: 50,
               },
             },
             splitLine: {

+ 4 - 6
spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/main.html

@@ -328,11 +328,7 @@
         </div>
     </div>
 
-    <div id="ThreeJS62" class="roomThree roomThree62" style="visibility:hidden"></div>
-    <div id="ThreeJS63" class="roomThree roomThree63" style="visibility:hidden"></div>
-    <div id="ThreeJS64" class="roomThree roomThree64" style="visibility:hidden"></div>
-    <div id="ThreeJS65" class="roomThree roomThree65" style="visibility:hidden"></div>
-    <div id="ThreeJS66" class="roomThree roomThree66" style="visibility:hidden"></div> 
+
 
     <div class="bossMeng"></div>
     <script src="../components/test8/graphData.js"></script>
@@ -386,7 +382,9 @@
     <script src="../main/js/setCharts.js"></script>
     <script src="./js/main.js" type="module"></script>
 
-    <script src="./js/netWorkDevOps.js"></script></script>
+    <script src="./js/netWorkDevOps.js"></script>
+
+    </script>
 
 
 </body>

+ 6 - 20
spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame1.html

@@ -326,7 +326,7 @@
     const testDom14 = document.querySelector(".springFrame1 .box14");
     // 数据统计
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getSafetyInfoByMonth",
+        url: "http://23.37.100.80:8084" + "/basic/safetyInfor/getSafetyInfoByMonth",
         data: {
             orgType: 3
         },
@@ -349,7 +349,7 @@
 
     // 局本级门户网站
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/safetyInfo/getWebSafetyStatusByOrg",
+        url: "http://23.37.100.80:8084" + "/basic/safetyInfo/getWebSafetyStatusByOrg",
         data: {
             orgType: 3
         },
@@ -392,6 +392,7 @@
                     name: item.attack_type
                 }
             });
+
             setCharts13(dom13, testDom13, newArr);
 
         },
@@ -403,7 +404,7 @@
 
     // 终端安全态势
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/OfficeVirus/getOfficeSafetyInfo",
+        url: "http://23.37.100.80:8084" + "/basic/OfficeVirus/getOfficeSafetyInfo",
         data: {
             orgType: 3
         },
@@ -426,7 +427,6 @@
                     name: item.virus_name
                 }
             });
-            console.log(newArr);
             setCharts14(dom14, testDom14, newArr);
 
         },
@@ -438,7 +438,7 @@
 
 // 攻击类型
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/AttackType/getTopAttackType",
+        url: "http://23.37.100.80:8084" + "/basic/AttackType/getTopAttackType",
         data: {
             orgType: 3
         },
@@ -468,26 +468,13 @@
 
     // 应急保障组成员信息
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/GuaranteeGroup/getAllGuaranteeGroup",
+        url: "http://23.37.100.80:8084" + "/basic/GuaranteeGroup/getAllGuaranteeGroup",
         success: function(res) {
             const result = res.result;
             console.log('应急保障组成员信息', result);
             if (!result) {
                 return
             }
-
-           const html = result.map(item => {
-              return `
-                    <li>
-                        <img src="../images/networkSecurity/kuang.png" alt="">
-                        <div class="desc">
-                            <h3>${item.office_name}</h3>
-                            <p>联系人:${item.name}</p>
-                        </div>
-                    </li>
-              `
-            }).join('')
-            $('.springFrame1 .box17 .content ul').html(html); 
         },
         error: function(err) {
             console.log("----应急保障组成员信息------------超时");
@@ -592,7 +579,6 @@
         if (data === undefined || data.length === 0) {
             data = defaultData;
         }
-        console.log(data);
         // 1实例化对象
         myChart = echarts.init(echartDom);
         let option = {

+ 7 - 7
spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame3.html

@@ -370,7 +370,7 @@
     const testDom23 = document.querySelector(".springFrame3 .box23");
     // 数据统计
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getSafetyInfoByMonth",
+        url: "http://23.37.100.80:8084" + "/basic/safetyInfor/getSafetyInfoByMonth",
         data: {
             orgType: 2
         },
@@ -384,7 +384,7 @@
     });
     //   漏洞数据
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getRiskInfoByOrg",
+        url: "http://23.37.100.80:8084" + "/basic/safetyInfor/getRiskInfoByOrg",
         data: {
             orgType: 2
         },
@@ -425,7 +425,7 @@
 
     function myAjax1() {
         $.ajax({
-            url: "http://23.37.100.87:8084" +
+            url: "http://23.37.100.80:8084" +
                 "/basic/SystemRisk/analyzeSystemRiskByMonth",
             data: {},
             success: function(res) {
@@ -446,7 +446,7 @@
 
     //   业务系统
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getSysStatusByOrg",
+        url: "http://23.37.100.80:8084" + "/basic/safetyInfor/getSysStatusByOrg",
         data: {
             orgType: 2
         },
@@ -463,7 +463,7 @@
     });
     //   高危系统列表
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/SystemRisk/getHighStatus",
+        url: "http://23.37.100.80:8084" + "/basic/SystemRisk/getHighStatus",
         data: {
             orgType: 2,
             Status: 1
@@ -494,7 +494,7 @@
     //   高危业务系统趋势
     function myAjax2() {
         $.ajax({
-            url: "http://23.37.100.87:8084" + "/basic/SystemRisk/getHighStatusByMonth",
+            url: "http://23.37.100.80:8084" + "/basic/SystemRisk/getHighStatusByMonth",
             data: {
                 orgType: 2
             },
@@ -514,7 +514,7 @@
     //   攻击事件类型
     function myAjax3() {
         $.ajax({
-            url: "http://23.37.100.87:8084" + "/basic/AttackEvent/getAttackEventByInfo",
+            url: "http://23.37.100.80:8084" + "/basic/AttackEvent/getAttackEventByInfo",
             data: {
                 orgType: 2
             },

+ 6 - 6
spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame4.html

@@ -264,7 +264,7 @@
 <script>
     // 数据统计
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getSafetyInfoByMonth",
+        url: "http://23.37.100.80:8084" + "/basic/safetyInfor/getSafetyInfoByMonth",
         data: {
             orgType: 1
         },
@@ -292,7 +292,7 @@
 
     // 漏洞数据 
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getRiskInfoByOrg",
+        url: "http://23.37.100.80:8084" + "/basic/safetyInfor/getRiskInfoByOrg",
         data: {
             orgType: 1
         },
@@ -330,7 +330,7 @@
     const dom27 = document.querySelector('.springFrame4 .box27 .floor-dist');
     const testDom27 = document.querySelector('.springFrame4 .box27');
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/RiskType/getSysRiskType",
+        url: "http://23.37.100.80:8084" + "/basic/RiskType/getSysRiskType",
         data: {
             orgType: 1,
             riskClassify: 1
@@ -361,7 +361,7 @@
 
     // 业务系统
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getSysStatusByOrg",
+        url: "http://23.37.100.80:8084" + "/basic/safetyInfor/getSysStatusByOrg",
         data: {
             orgType: 1
         },
@@ -390,7 +390,7 @@
 
     // 攻击拦截类型
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/AttackType/getAttackTypeByMonth",
+        url: "http://23.37.100.80:8084" + "/basic/AttackType/getAttackTypeByMonth",
         data: {
             orgType: 1
         },
@@ -423,7 +423,7 @@
 
     // 受攻击最严重业务统计
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/SystemAttacked/getSystemAttackedByInfo",
+        url: "http://23.37.100.80:8084" + "/basic/SystemAttacked/getSystemAttackedByInfo",
         data: {
             orgType: 1
         },

+ 220 - 92
spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame5.html

@@ -2,12 +2,18 @@
   .springFrame5 .box62 .test-box,
   .springFrame5 .box63 .test-box,
   .springFrame5 .box64 .test-box,
-  .springFrame5 .box65 .test-box,  
+  .springFrame5 .box65 .test-box,
   .springFrame5 .box66 .test-box {
     padding: 0.5rem;
   }
 
-  .springFrame5 .box57 .content{
+  .springFrame5 .roomThree {
+    width: 50%;
+    height: 80%;
+    position: absolute;
+    z-index: 99;
+  }
+  .springFrame5 .box57 .content {
     padding-top: 0.7rem;
   }
 </style>
@@ -15,8 +21,11 @@
   <div class="springFrameTitle">
     <h2>城管局网络核心机房</h2>
   </div>
-  <div class="box52 box" data-name="test52" style="width: 4356px;height:1615px;left:0;top:967px;">
-
+  <div
+    class="box52 box"
+    data-name="test52"
+    style="width: 4356px; height: 1615px; left: 0; top: 967px"
+  >
     <div class="tool">
       <div class="title bgTitle">
         <h2>机房温湿度</h2>
@@ -30,8 +39,11 @@
     <div class="panel-footer"></div>
   </div>
 
-  <div class="box53 box" data-name="test53" style="width: 4356px;height:1615px;left:0;top:2708px;">
-
+  <div
+    class="box53 box"
+    data-name="test53"
+    style="width: 4356px; height: 1615px; left: 0; top: 2708px"
+  >
     <div class="tool">
       <div class="title bgTitle">
         <h2>监控分类统计</h2>
@@ -45,8 +57,11 @@
     <div class="panel-footer"></div>
   </div>
 
-  <div class="box54 box" data-name="test54" style="width: 4328px;height:1764px;left:0;top:4528px;">
-
+  <div
+    class="box54 box"
+    data-name="test54"
+    style="width: 4328px; height: 1764px; left: 0; top: 4528px"
+  >
     <div class="tool">
       <div class="title bgTitle">
         <h2>资产分类统计</h2>
@@ -60,8 +75,11 @@
     <div class="panel-footer"></div>
   </div>
 
-  <div class="box55 box" data-name="test55" style="width: 2608px;height:1332px;left:7472px;top:1300px;">
-
+  <div
+    class="box55 box"
+    data-name="test55"
+    style="width: 2608px; height: 1332px; left: 7472px; top: 1300px"
+  >
     <div class="test-box">
       <div class="content">
         <div class="floor-dist"></div>
@@ -101,11 +119,21 @@
             </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">
+            <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>
+                p-id="2774"
+                fill="#d81e06"
+              ></path>
             </svg>
             <div class="text-one">温度过高</div>
           </div>
@@ -115,8 +143,11 @@
     <div class="panel-footer"></div>
   </div>
 
-  <div class="box56 box" data-name="test56" style="width: 6784px;height:2112px;left:4436px;top:4164px;">
-
+  <div
+    class="box56 box"
+    data-name="test56"
+    style="width: 6784px; height: 2112px; left: 4436px; top: 4164px"
+  >
     <div class="test-box">
       <div class="content">
         <div class="test-box">
@@ -177,8 +208,11 @@
     <div class="panel-footer"></div>
   </div>
 
-  <div class="box57 box" data-name="test57" style="width: 3940px;height:1343px;left:11384px;top:936px;">
-
+  <div
+    class="box57 box"
+    data-name="test57"
+    style="width: 3940px; height: 1343px; left: 11384px; top: 936px"
+  >
     <div class="tool">
       <div class="title bgTitle">
         <h2>监控画面</h2>
@@ -186,37 +220,27 @@
     </div>
     <div class="test-box">
       <div class="content">
-
         <div class="img-box">
-
           <div class="img-box-one">
-
-            <img
-            src="../images/room.webp"
-            alt=""
-          />
+            <img src="../images/room.webp" alt="" />
           </div>
           <div class="img-box-one">
-            <img
-            src="../images/room.webp"
-            alt=""
-          />
+            <img src="../images/room.webp" alt="" />
           </div>
           <div class="img-box-one">
-            <img
-            src="../images/room.webp"
-            alt=""
-          />
+            <img src="../images/room.webp" alt="" />
           </div>
-
         </div>
       </div>
     </div>
     <div class="panel-footer"></div>
   </div>
 
-  <div class="box58 box" data-name="test58" style="width: 3960px;height:1232px;left:11384px;top:5014px;">
-
+  <div
+    class="box58 box"
+    data-name="test58"
+    style="width: 3960px; height: 1232px; left: 11384px; top: 5014px"
+  >
     <div class="tool">
       <div class="title bgTitle">
         <h2>机房水浸</h2>
@@ -228,22 +252,39 @@
           <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>
+                <svg
+                  t="1650283656534"
+                  class="icon"
+                  viewBox="0 0 1024 1024"
+                  version="1.1"
+                  xmlns="http://www.w3.org/2000/svg"
+                  p-id="1578"
+                  width="200"
+                  height="200"
+                >
                   <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>
+                    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="1581"></path>
+                    fill="#1296db"
+                    p-id="1601"
+                  ></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>
+                    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 style="font-size: 0.1rem !important">通信状态</div>
             </div>
             <div class="Water-immersion-text text1">正常</div>
           </div>
@@ -263,8 +304,11 @@
     <div class="panel-footer"></div>
   </div>
 
-  <div class="box59 box" data-name="test59" style="width: 3956px;height:1252px;left:11384px;top:3704px;">
-
+  <div
+    class="box59 box"
+    data-name="test59"
+    style="width: 3956px; height: 1252px; left: 11384px; top: 3704px"
+  >
     <div class="tool">
       <div class="title bgTitle">
         <h2>机房温湿度</h2>
@@ -276,19 +320,36 @@
           <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>
+                <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>
+                    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>
+                    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>
+                    fill="#1296db"
+                    p-id="1592"
+                  ></path>
                 </svg>
               </div>
               <div>通信状态</div>
@@ -301,20 +362,40 @@
     </div>
     <div class="panel-footer"></div>
   </div>
-    <!-- 机房 -->
+  <!-- 机房 -->
   <div class="frameClose">X</div>
 
-
-
-  <!-- <div id="ThreeJS62" class="roomThree roomThree62" style="visibility:hidden"></div>
-  <div id="ThreeJS63" class="roomThree roomThree63" style="visibility:hidden"></div>
-  <div id="ThreeJS64" class="roomThree roomThree64" style="visibility:hidden"></div>
-  <div id="ThreeJS65" class="roomThree roomThree65" style="visibility:hidden"></div>
-  <div id="ThreeJS66" class="roomThree roomThree66" style="visibility:hidden"></div> -->
-
-
-  <div class="box60 box" data-name="test60" style="width: 3972px;height:1260px;left:11384px;top:2356px;">
-
+  <div
+    id="ThreeJS62"
+    class="roomThree roomThree62"
+    style="visibility: hidden"
+  ></div>
+  <div
+    id="ThreeJS63"
+    class="roomThree roomThree63"
+    style="visibility: hidden"
+  ></div>
+  <div
+    id="ThreeJS64"
+    class="roomThree roomThree64"
+    style="visibility: hidden"
+  ></div>
+  <div
+    id="ThreeJS65"
+    class="roomThree roomThree65"
+    style="visibility: hidden"
+  ></div>
+  <div
+    id="ThreeJS66"
+    class="roomThree roomThree66"
+    style="visibility: hidden"
+  ></div>
+
+  <div
+    class="box60 box"
+    data-name="test60"
+    style="width: 3972px; height: 1260px; left: 11384px; top: 2356px"
+  >
     <div class="tool">
       <div class="title bgTitle">
         <h2>消防状态模块</h2>
@@ -326,19 +407,36 @@
           <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>
+                <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>
+                    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>
+                    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>
+                    fill="#1296db"
+                    p-id="1602"
+                  ></path>
                 </svg>
               </div>
               <div>通信状态</div>
@@ -349,19 +447,36 @@
           <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>
+                <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>
+                    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>
+                    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>
+                    fill="#1296db"
+                    p-id="1602"
+                  ></path>
                 </svg>
               </div>
               <div>消防主机状态</div>
@@ -372,19 +487,36 @@
           <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>
+                <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>
+                    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>
+                    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>
+                    fill="#1296db"
+                    p-id="1602"
+                  ></path>
                 </svg>
               </div>
               <div>开关量</div>
@@ -396,10 +528,6 @@
     </div>
     <div class="panel-footer"></div>
   </div>
-
-  
-
-
 </div>
 
 <script>
@@ -409,4 +537,4 @@
   // const testDom53 = document.querySelector('.springFrame5 .box53');
   // const dom54 = document.querySelector('.springFrame5 .box54 .floor-dist');
   // const testDom54 = document.querySelector('.springFrame5 .box54');
-</script>
+</script>