xinagyan 3 лет назад
Родитель
Сommit
ca9c38a3f2
93 измененных файлов с 3457 добавлено и 1139 удалено
  1. 16 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test11/test11.css
  2. 21 4
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test12/test12.css
  3. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test12/test12.html
  4. 24 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test13/test13.css
  5. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test13/test13.html
  6. 13 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test14/test14.css
  7. 2 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test14/test14.html
  8. 1 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test15/test15.css
  9. 9 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test16/test16.css
  10. 9 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test17/test17.css
  11. 56 10
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test18/test18.css
  12. 11 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test19/test19.css
  13. 2 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test21/test21.css
  14. 7 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test22/test22.css
  15. 59 30
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test25/test25.css
  16. 22 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test26/test26.css
  17. 11 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test28/test28.css
  18. 20 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test30/test30.css
  19. 8 4
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test31/test31.css
  20. 10 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test32/test32.css
  21. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test32/test32.html
  22. 8 6
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test34/test34.js
  23. 30 5
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test37/test37.css
  24. 8 8
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test37/test37.html
  25. 14 6
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test38/test38.css
  26. 3 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test38/test38.html
  27. 1 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test39/test39.css
  28. 7 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test39/test39.js
  29. 29 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test40/test40.css
  30. 20 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test41/test41.css
  31. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test42/test42.html
  32. 7 6
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test42/test42.js
  33. 22 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test43/test43.css
  34. 7 16
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test44/test44.css
  35. 0 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test44/test44.html
  36. 2 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test44/test44.js
  37. 14 9
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test45/test45.css
  38. 53 50
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test45/test45.html
  39. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test46/test46.css
  40. 61 62
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test46/test46.html
  41. 5 7
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test46/test46.js
  42. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test47/test47.css
  43. 2 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test47/test47.html
  44. 38 14
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test47/test47.js
  45. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test48/test48.css
  46. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test48/test48.html
  47. 108 108
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test48/test48.js
  48. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test49/test49.css
  49. 3 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test49/test49.html
  50. 5 27
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test50/test50.css
  51. 81 60
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test50/test50.html
  52. 548 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test50/test50.js
  53. 0 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test53/test53.css
  54. 6 6
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test53/test53.js
  55. 0 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test54/test54.css
  56. 1 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test55/test55.css
  57. 3 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test55/test55.html
  58. 0 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test58/test58.css
  59. 5 5
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test58/test58.html
  60. 0 7
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test59/test59.css
  61. 3 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test59/test59.html
  62. 0 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test60/test60.css
  63. 3 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test60/test60.html
  64. 14 6
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test61/test61.css
  65. 20 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test62 copy/test62.css
  66. 36 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test62 copy/test62.html
  67. 305 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test62 copy/test62.js
  68. 0 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test62 copy/test62.less
  69. 77 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test62/test62.css
  70. 26 24
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test62/test62.html
  71. 286 288
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test62/test62.js
  72. 20 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test66 copy/test66.css
  73. 631 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test66 copy/test66.html
  74. 305 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test66 copy/test66.js
  75. 0 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test66 copy/test66.less
  76. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test7/test7.js
  77. 223 232
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/css/coom.css
  78. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/1.png
  79. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/2.png
  80. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/3.png
  81. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/4.png
  82. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/bjaq.png
  83. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/ty.png
  84. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/zdwx.png
  85. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/zu.png
  86. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/zu15.png
  87. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/numBg.png
  88. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/room.webp
  89. 27 7
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/css/main.css
  90. 0 5
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/js/main.js
  91. 4 4
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame1.html
  92. 26 26
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame3.html
  93. 49 41
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame4.html

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@@ -44,21 +44,27 @@ const test39 = (function() {
             return Math.floor(Math.random() * (max-min) + min);
           }
 
+          const pros = []
             const sum = result.payload.rangList[0].value + 500;
              const html = result.payload.rangList.map((item,index) => {
               const bfb = parseInt((item.value/sum*100));
               const randomColor1 = getRandom(100, 200);
               const randomColor2 = getRandom(100, 200);
               const randomColor3 = getRandom(100, 200);
+              pros.push(bfb);
               return `
               <div class="progress">
                 <div class="proDesc"><i style="background-color: rgb(${randomColor1}, ${randomColor2}, ${randomColor3});"></i> ${item.name}</div>
-                <span style="width: ${bfb}%;background: rgb(${randomColor1}, ${randomColor2}, ${randomColor3});"><span>20%</span></span>
+                <span style="width: ${0}%;background: rgb(${randomColor1}, ${randomColor2}, ${randomColor3});"><span>20%</span></span>
                 <span class="txt"><i style="color: ${randomColor1};">${item.value}</i> 条</span>
               </div>
               `
               }).join('');
+
               $('.test39 .box39 .container').html(html ? html : '暂无数据')
+              $('.test39 .box39 .progress').each(function (index,item) {
+                $(this).find('span').eq(0).css('width',pros[index]+'%')
+              })
           },
           error: function(err) {
               console.log("----攻击类型--------超时");

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

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

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

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

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

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

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

@@ -163,17 +163,18 @@ const test42 = (function() {
             英国: [0.1, 51.3],
             俄罗斯: [37, 55],
         };
+        chinaGeoCoordMap = chinaGeoCoordMap1
         console.log(chinaGeoCoordMap);
-
+console.log(chinaGeoCoordMap1);
         var chinaDatas = [
             [{
-                name: '英国',
+                name: '河南',
                 value: 0,
                 price: 100,
                 num: 2,
             }, ],
             [{
-                name: '俄罗斯',
+                name: '湖北',
                 value: 0,
                 price: 100,
                 num: 2,
@@ -183,12 +184,12 @@ const test42 = (function() {
         if (worldType === 'world') {
             chinaDatas.push(
                 [{
-                    name: '美国',
+                    name: '北京',
                     value: 0,
                     price: 100,
                     num: 2,
                 }, ], [{
-                    name: '南',
+                    name: '南',
                     value: 0,
                     price: 100,
                     num: 2,
@@ -220,7 +221,7 @@ const test42 = (function() {
 
         var series = [];
         [
-            ['浙江', chinaDatas]
+            ['天津', chinaDatas]
         ].forEach(function(item, i) {
             series.push({
                 type: 'lines',

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

@@ -1,3 +1,4 @@
+<<<<<<< HEAD
 .box43 .content {
   margin: 0;
 }
@@ -25,3 +26,24 @@
   font-family: "LESLIE";
   src: url("../../font/LESLIE.TTF");
 }
+=======
+.box43 .content {
+  margin: 0;
+}
+.box43 ul {
+  display: flex;
+  margin-top: 0.3rem;
+}
+.box43 ul li {
+  color: #fff;
+  flex: 1;
+  text-align: center;
+  position: relative;
+}
+.box43 ul li img {
+  width: 52%;
+}
+.box43 ul li .desc {
+  position: relative;
+}
+>>>>>>> 06a129e7dbcdf8e387e3e2c0d942a52175d47a33

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

@@ -21,9 +21,12 @@
   justify-content: space-around;
   align-items: center;
   width: 100%;
-  height: 25%;
   /* background-image: linear-gradient(45deg, #155ed5, transparent); */
+<<<<<<< HEAD
   background: url("../../css/modules/layer/default/组245.png");
+=======
+  background: url("../../css/modules/layer/bgImg/组245.png");
+>>>>>>> 06a129e7dbcdf8e387e3e2c0d942a52175d47a33
   background-size: 100% 100%;
 }
 .box44 .item img {
@@ -31,20 +34,8 @@
 }
 .text {
   text-align: center;
+<<<<<<< HEAD
   font-size: 0.12rem !important;
+=======
+>>>>>>> 06a129e7dbcdf8e387e3e2c0d942a52175d47a33
 }
-.box44 .item-img {
-  background: url("./img/组246.png");
-  background-size: 100% 100%;
-}
-.storing-num{
-  font-size: 0.2rem !important;
-  position: relative;
-  top: -20%;
-  left: 16%;
-  width: 70%;
-  text-align: center;
-  /* background-color: ; */
-  background: url("../../images/矩形-513.png");
-  background-size: 100% 100%;
-}

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

@@ -58,9 +58,6 @@
       </div>
       <div class="main">
         <div class="floor-dist"></div>
-        <div class="storing-num">
-          健康指数
-        </div>
       </div>
       <div class="right">
         <div class="item" style="text-align: center">

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

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

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

@@ -3,8 +3,10 @@
 }
 .box45 .content {
   margin: 0;
-
-
+  width: 90%;
+  height: 90%;
+  margin-top: 2%;
+  margin-left: 6%;
 }
 .box45 .left,
 .box45 .right {
@@ -65,13 +67,16 @@
   background-color: #d9534f;
 }
 .box45 .serious {
-  width: 50%;
-  height: 160px;
-  font-size: 0.13rem !important;
-  /* background-color: #d9534f; */
-  background: #d9534f;
-  margin: auto;
-  line-height: 160px;
+  background-color: #d9534f;
+}
+.box45 .commonly {
+  background-color: #66650c;
+}
+.box45 .success {
+  background-color: #4162ce;
+}
+.box45 .commonly {
+  background-color: #66650c;
 }
 .box45 .commonly {
   background-color: #66650c;

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

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

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

@@ -18,7 +18,7 @@
 .box46 .progress .proDesc {
   position: absolute;
   top: -70% !important;
-  left: -35%;
+  left: -43%;
   color: #fff;
 }
 .box46 .progress > span {

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

@@ -1,69 +1,68 @@
 <div class="box46 box" data-name="test46">
-    <div class="toolBox">
-      <span class="fit"></span>
-      <span class="close"></span>
-    </div>
-    <div class="tool">
-      <div class="title bgTitle">
-        <h2>攻击类型</h2>
-      </div>
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="tool">
+    <div class="title bgTitle">
+      <h2>攻击类型</h2>
     </div>
-    <div class="test-box">
-      <div class="content">
-        <!-- 攻击类型 -->
-        <div class="container" style="margin-top: -4%">
-          <div class="progress">
-            <div class="proDesc">OA中间主服务器</div>
-            <span id="OA" style="width: 20%"></span>
-            <span class="txt">20%</span>
-          </div>
-  
-          <div class="progress">
-            <div class="proDesc">核心交换机1060</div>
-            <span id="core" class="green" style="width: 40%"></span>
-            <span class="txt">40%</span>
-          </div>
-  
-          <div class="progress">
-            <div class="proDesc">杀毒服务器</div>
-            <span id="Anti-Virus" class="orange" style="width: 60%"></span>
-            <span class="txt">50%</span>
-          </div>
-  
-          <div class="progress">
-            <div class="proDesc">电子盖章服务器</div>
-            <span id="Electronic-seal" class="red" style="width: 80%"></span>
-            <span class="txt">80%</span>
-          </div>
-  
-          <div class="progress">
-            <div class="proDesc">office</div>
-            <span id="office" class="blue" style="width: 100%"></span>
-            <span class="txt">30%</span>
-          </div>
+  </div>
+  <div 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 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 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 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>

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

@@ -98,13 +98,11 @@ const test46 = (function () {
       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 class="progress">
+          <div class="proDesc">${prog.RESNAME}</div>
+          <span class="green" style="width: 19%;"></span>
+          <span class="txt">40%</span>
+        </div>`;
       }
 
       $(".container").html(str);

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

@@ -18,7 +18,7 @@
 .box47 .progress .proDesc {
   position: absolute;
   top: -70% !important;
-  left: -35%;
+  left: -43%;
   color: #fff;
 }
 .box47 .progress > span {

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

@@ -11,7 +11,7 @@
   <div class="test-box">
     <div class="content">
       <!-- 攻击类型 -->
-      <div class="container" style="margin-top: -4%">
+      <div class="container" style="margin-top: 0%">
         <div class="progress">
           <div class="proDesc">OA中间主服务器</div>
           <span id="OA1" style="width: 20%"></span>
@@ -31,7 +31,7 @@
         </div>
 
         <div class="progress">
-          <div class="proDesc">电子盖章服务器</div>
+          <div class="proDesc1">电子盖章服务器</div>
           <span id="Electronic-seal1" class="red" style="width: 80%"></span>
           <span class="txt">80%</span>
         </div>

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

@@ -72,6 +72,7 @@ const test47 = (function () {
     sucTimer();
   }
 
+<<<<<<< HEAD
   function myAjax() {
     $.ajax({
       url: baseURL + "/selectMgtServerTop5",
@@ -93,22 +94,45 @@ const test47 = (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 += `
-        <div class="progress">
-          <div class="proDesc">${prog.RESNAME}</div>
-          <span class="green" style="width: 19%;"></span>
-          <span class="txt">40%</span>
-        </div>`;
-      }
+  //   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>`;
+  //     }
+>>>>>>> 06a129e7dbcdf8e387e3e2c0d942a52175d47a33
 
-      $(".container").html(str);
-    }
-  }
+  //     $(".container").html(str);
+  //   }
+  // }
 
   return test47;
 })();

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

@@ -18,7 +18,7 @@
 .box48 .progress .proDesc {
   position: absolute;
   top: -70% !important;
-  left: -35%;
+  left: -43%;
   color: #fff;
 }
 .box48 .progress > span {

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

@@ -11,7 +11,7 @@
   <div class="test-box">
     <div class="content">
       <!-- 攻击类型 -->
-      <div class="container" style="margin-top: -4%">
+      <div class="container" style="margin-top: 0%">
         <div class="progress">
           <div class="proDesc">OA中间主服务器</div>
           <span id="OA2" style="width: 20%"></span>

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

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

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

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

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

@@ -7,6 +7,7 @@
         <div class="title bgTitle">
             <h2>受攻击最严重业务系统</h2>
         </div>
+<<<<<<< HEAD
         <table id="stuTable" class="table">
           <thead>
             <tr>
@@ -95,6 +96,8 @@
           </tbody>
         </table>
       </div>
+=======
+>>>>>>> 06a129e7dbcdf8e387e3e2c0d942a52175d47a33
     </div>
     <div class="test-box">
         <div class="content">

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

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

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

@@ -1,73 +1,74 @@
-<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 class="box50 box" data-name='test50'>
+    <div class="toolBox">
+        <span class="fit"></span>
+        <span class="close"></span>
     </div>
-  </div>
-  <div class="test-box">
-    <marquee behavior="scroll" direction="up" height="100%">
-      <div class="content">
-        <div class="item" data-id="1">
-          <img src="../images/networkSecurity/pic_kuang.png" alt="" />
-          <div class="item-box">
-            <div>网络核心机房</div>
-            <div class="temp">
-              <p>温度:<span>25℃</span></p>
-              <p>湿度:<span>25℃</span></p>
-            </div>
-          </div>
+    <div class="tool">
+        <div class="title bgTitle">
+            <h2>受攻击最严重业务系统</h2>
         </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 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>
-        </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 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>
-        </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 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>
-        </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 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>
-    </marquee>
-  </div>
-  <div class="panel-footer"></div>
+    </div>
+    <div class="panel-footer"></div>
+
 </div>
 
+
 <!-- 工具弹框 -->
+<<<<<<< HEAD
 <div class="tools" style="display: none">
   <div class="containerTool test50Toll">
     <ul>
@@ -85,4 +86,24 @@
     <button class="fixBtn toolBtn">确定</button>
     <button class="offBtn toolBtn">取消</button>
   </div>
+=======
+<div class="tools" style="display: none;">
+
+    <div class="containerTool test50Toll">
+        <ul>
+            <li>
+                <span>宽度:</span>
+                <input class="setWidth" type="text">
+                <span id="validateAge" class="regValidate"></span>
+            </li>
+            <li>
+                <span>高度:</span>
+                <input class="setHeight" type="text">
+            </li>
+        </ul>
+        <!-- 确定 -->
+        <button class="fixBtn toolBtn">确定</button>
+        <button class="offBtn toolBtn">取消</button>
+    </div>
+>>>>>>> 06a129e7dbcdf8e387e3e2c0d942a52175d47a33
 </div>

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

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

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

@@ -4,5 +4,4 @@
 .box53 .content {
   margin: 0;
   padding: 0;
-  margin-top: 7%;
 }

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

@@ -112,9 +112,9 @@ const test53 = (function() {
                     axisLabel: {
                         interval: 0,
                         color: "#fff",
-                        align: "center",
-                        margin: 100,
-                        fontSize: 100,
+                        align: "left",
+                        margin: 80,
+                        fontSize: 13,
                         formatter: function(value, index) {
                             if (opt.index === 0 && index < 3) {
                                 return (
@@ -155,7 +155,7 @@ const test53 = (function() {
                                 padding: [5, 8],
                             },
                             title: {
-                                width: 300,
+                                width: 165,
                             },
                         },
                     },
@@ -178,8 +178,8 @@ const test53 = (function() {
                         interval: 0,
                         color: "#fff",
                         align: "left",
-                        margin: 40,
-                        fontSize: 100,
+                        margin: 20,
+                        fontSize: 13,
                         formatter: function(value, index) {
                             return data[index].value + "条";
                         },

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

@@ -4,5 +4,4 @@
 .box54 .content {
   margin: 0;
   padding: 0;
-  margin-top: 7%;
 }

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

@@ -12,9 +12,8 @@
   color: #fff;
 }
 .box55 .box-box {
-  margin-top: 7%;
+  margin-top: 20%;
   display: flex;
-  margin-bottom: 29%;
 }
 .box55 .temperature-box-one {
   width: 33%;

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

@@ -49,9 +49,9 @@
             version="1.1"
             xmlns="http://www.w3.org/2000/svg"
             p-id="2773"
-            width="300"
-            height="250"
-            style="margin-top: -2%;"            >
+            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"

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

@@ -42,6 +42,3 @@
 .Water-immersion-box-svg {
   padding: 5px;
 }
-.Water-immersion-box-title-text{
-  font-size: 0.11rem !important;
-}

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

@@ -21,8 +21,8 @@
                 version="1.1"
                 xmlns="http://www.w3.org/2000/svg"
                 p-id="1578"
-                width="300"
-                height="250"
+                width="20"
+                height="20"
               >
                 <path
                   d="M478.462882 476.972344L304.069869 973.321689h496.349345L626.026201 475.481805z"
@@ -46,16 +46,16 @@
                 ></path>
               </svg>
             </div>
-            <div class="Water-immersion-box-title-text">通信状态</div>
+            <div>通信状态</div>
           </div>
           <div class="Water-immersion-text">正常</div>
         </div>
         <div class="Water-immersion-box-one">
           <div class="Water-immersion-box-title">
             <div class="Water-immersion-box-svg">
-              <img class="Water-immersion-box-img" src="../../font/水滴.png" alt="" />
+              <img src="../../font/水滴.png" alt="" />
             </div>
-            <div class="Water-immersion-box-title-text">水滴1正常</div>
+            <div>水滴1正常</div>
           </div>
           <div class="Water-immersion-text">正常</div>
         </div>

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

@@ -42,10 +42,3 @@
 .Water-immersion-box-svg {
   padding: 5px;
 }
-.Water-immersion-box-title-text {
-  font-size: 0.11rem !important;
-}
-.Water-immersion-box-img{
-  width: 250px;
-  height: 250px ;
-}                                                                                                         

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

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

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

@@ -41,6 +41,3 @@
 .Water-immersion-box-svg {
   padding: 5px;
 }
-.Water-immersion-box-title-text {
-  font-size: 0.11rem !important;
-}

+ 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="300"
-                height="250"
+                width="20"
+                height="20"
               >
                 <path
                   d="M478.462882 476.972344L304.069869 973.321689h496.349345L626.026201 475.481805z"
@@ -46,7 +46,7 @@
                 ></path>
               </svg>
             </div>
-            <div class="Water-immersion-box-title-text">通信状态</div>
+            <div>通信状态</div>
           </div>
           <div class="Water-immersion-text">正常</div>
         </div>

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

@@ -1,3 +1,9 @@
+.test61 .box61{
+  box-shadow: none;
+  background: none;
+}
+
+
 .box61 .test-box {
   width: 100%;
   height: 100%;
@@ -132,15 +138,15 @@
   display: flex;
   justify-content: center;
   position: absolute;
-  left: 53%;
+  left: 57%;
 }
 
 .left-box-one {
   width: 25%;
   height: 100%;
   background: url("../../css/modules/layer/default/组58.png") no-repeat;
-  background-size: 100%;
-  margin-top: -34%;
+  background-size: 64%;
+  margin-top: -18%;
   margin-left: 3%;
 }
 
@@ -148,13 +154,15 @@
   width: 25%;
   height: 100%;
   background: url("../../css/modules/layer/default/业务系统.png") no-repeat;
-  background-size: 100%;
-  margin-top: -34%;
+  background-size: 64%;
+  margin-top: -18%;
   margin-left: 3%;
 }
 
 .left-box-one-title {
-  margin-top: 20%;
+  margin-left: 0.23rem;
+  width: 0.9rem;
+  margin-top: 7%;
 }
 
 .number-img {

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

@@ -0,0 +1,20 @@
+.box62 * {
+  margin: 0;
+  padding: 0;
+}
+
+.box62 body {
+  margin: 0;
+  border: 0;
+  padding: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+
+.box62 #ThreeJS {
+  width: 100%;
+  height: 100%;
+  background: url("./images/bg.png") no-repeat;
+  background-size: 100% 100%;
+}

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

@@ -0,0 +1,36 @@
+<div class="box62 box" data-name="test61">
+    <div class="toolBox">
+        <span class="fit"></span>
+        <span class="close"></span>
+    </div>
+    <div class="test-box">
+        <div class="concent">
+            <div id="ThreeJS"></div>
+
+        </div>
+    </div>
+    <div class="panel-footer"></div>
+</div>
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none">
+    <div class="containerTool test61Toll">
+        <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>
+
+
+

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

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

+ 0 - 0
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test62 copy/test62.less


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

@@ -1,3 +1,4 @@
+<<<<<<< HEAD
 @font-face {
   font-family: "庞门正道标题体";
   src: url("../../font/庞门正道标题体.TTF");
@@ -84,3 +85,79 @@
   right: 11%;
   top: 15%;
 }
+=======
+.box62 p {
+  font-size: 0.15rem !important;
+  font-weight: 700;
+  color: #75e2fa;
+}
+.box62 .concent > div {
+  position: absolute;
+}
+.box62 {
+  text-align: center;
+  right: 12%;
+}
+.box62 > div {
+  position: absolute;
+}
+.box62 > div :not(.ex) img {
+  width: 75%;
+}
+.box62 .l-bg {
+  width: 100%;
+  height: 100%;
+  background: url("../../images/zybz/背景.png") no-repeat center;
+  background-size: 100%;
+}
+.box62 .x-bg {
+  width: 100%;
+  height: 100%;
+  background: url("../../images/zybz/线.png") no-repeat center;
+  background-size: 100%;
+}
+.box62 .c-left-img-one {
+  left: 5%;
+  top: 26%;
+}
+.box62 .c-left-img-two {
+  left: 16%;
+  top: 6%;
+}
+.box62 .c-center1 {
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+}
+.box62 .c-center2 {
+  left: 32%;
+  top: 56%;
+}
+.box62 .c-center3 {
+  left: 36%;
+  top: 20%;
+}
+.box62 .c-center4 {
+  left: 60%;
+  top: 25%;
+}
+.box62 .c-center5 {
+  left: 64%;
+  top: 54%;
+}
+.box62 .c-center6 {
+  left: 50%;
+  top: 67%;
+}
+.box62 .c-r-item1 {
+  right: 22%;
+  top: 25%;
+}
+.box62 .c-r-item2 {
+  right: 12%;
+}
+.box62 .c-r-item3 {
+  right: 4%;
+  top: 25%;
+}
+>>>>>>> 06a129e7dbcdf8e387e3e2c0d942a52175d47a33

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

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

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

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

+ 20 - 0
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test66 copy/test66.css

@@ -0,0 +1,20 @@
+.box66 * {
+  margin: 0;
+  padding: 0;
+}
+
+.box66 body {
+  margin: 0;
+  border: 0;
+  padding: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+
+.box66 #ThreeJS {
+  width: 100%;
+  height: 100%;
+  background: url("./images/bg.png") no-repeat;
+  background-size: 100% 100%;
+}

+ 631 - 0
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test66 copy/test66.html

@@ -0,0 +1,631 @@
+<div class="box66 box" data-name="test61">
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="test-box">
+    <div class="concent">
+      <div id="ThreeJS"></div>
+    </div>
+  </div>
+  <div class="panel-footer"></div>
+</div>
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none">
+  <div class="containerTool test61Toll">
+    <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 src="js/three.js"></script>
+<script src="js/GLTFLoader.js"></script>
+<script src="js/FBXLoader.js"></script>
+<script src="js/inflate.min.js"></script>
+<script src="js/OrbitControls.js"></script>
+<script src="js/Stats.js"></script>
+<script src="js/Detector.js"></script>
+<script src="js/ThreeBSP.js"></script>
+
+<script type="module">
+  const boxcontanier = document.getElementById("ThreeJS");
+
+  let scene, camera, renderer, controls, stats;
+  const SCREEN_WIDTH = window.innerWidth;
+  const SCREEN_HEIGHT = window.innerHeight;
+
+  //加载贴图模型
+  let textureLoader = new THREE.TextureLoader();
+  var mixer = null;
+  var clock = new THREE.Clock();
+
+  init();
+  animate();
+
+  function init() {
+    // 场景
+    scene = new THREE.Scene();
+
+    // 相机
+    var VIEW_ANGLE = 30,
+      ASPECT = SCREEN_WIDTH / SCREEN_HEIGHT,
+      NEAR = 0.1,
+      FAR = 2000;
+
+    camera = new THREE.PerspectiveCamera(VIEW_ANGLE, ASPECT, NEAR, FAR);
+    scene.add(camera);
+    camera.position.set(0, 450, 250);
+    camera.lookAt(scene.position);
+
+    // 渲染器
+    if (Detector.webgl)
+      renderer = new THREE.WebGLRenderer({
+        antialias: true, //开启锯齿
+        alpha: true,
+        precision: "highp",
+      });
+    else renderer = new THREE.CanvasRenderer();
+
+    renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
+    renderer.setClearAlpha(0.0);
+    renderer.shadowMap.enabled = true;
+    //当界面改变时重新渲染canvas尺寸
+    window.οnresize = function () {
+      renderer.setPixelRatio(window.devicePixelRatio); //设备像素比,防止画布输出模糊
+      camera.aspect = window.innerWidth / window.innerHeight;
+      camera.updateProjectionMatrix();
+      renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
+    };
+    //renderer.setClearColor(0xb9d3ff, 1); //设置背景颜色
+    boxcontanier.appendChild(renderer.domElement);
+
+    // 鼠标控件
+    controls = new THREE.OrbitControls(camera, renderer.domElement);
+    controls.addEventListener("change", render);
+    //controls.listenToKeyEvents( window );
+    // controls.enableDamping = true;
+    // controls.dampingFactor = 0.15;
+    // controls.screenSpacePanning = false;
+    controls.maxPolarAngle = Math.PI / 2;
+    //var clock = new THREE.Clock();
+
+    // 性能插件
+    stats = new Stats();
+    stats.domElement.style.position = "absolute";
+    stats.domElement.style.top = "0px";
+    stats.domElement.style.zIndex = 100;
+    boxcontanier.appendChild(stats.domElement);
+
+    // 光源
+    // var light = new THREE.PointLight(0x00ff00);
+    // light.position.set(0, 100, 0);
+    // scene.add(light);
+    // console.log(light);
+
+    var directionalLight = new THREE.DirectionalLight(0xffffff, 0.6); // 光的颜色,光照强度
+    directionalLight.position.set(400, 200, 300);
+    scene.add(directionalLight);
+
+    var directionalLight2 = new THREE.DirectionalLight(0xffffff, 0.6);
+    directionalLight2.position.set(-400, -200, -300);
+    scene.add(directionalLight2);
+
+    var ambient = new THREE.AmbientLight(0xffffff, 0.6);
+    scene.add(ambient);
+
+    // 初始化模型
+    initModel();
+  }
+
+  function initModel() {
+    // 地板
+    createFloor(250, 150);
+
+    // 玻璃墙
+    createGlassWall(
+      250,
+      100,
+      150,
+      0,
+      50,
+      0,
+      0,
+      0,
+      0,
+      [
+        {
+          size: [244, 100, 144],
+          position: [0, 0, 0],
+          rotation: [0, 0, 0],
+        },
+        {
+          size: [66, 70, 6],
+          position: [122, -15, 0],
+          rotation: [0, Math.PI / 2, 0],
+        },
+      ],
+      0.4
+    );
+    // 门
+    createDoor(124, 35, 0);
+    // createGlassWall(250, 80, 0, 40, -75, 0, 0, 0); //后墙
+    // createGlassWall(150, 80, 125, 40, 0, 0, Math.PI/2, 0, [{
+    // 	size: [50, 60, 5],
+    // 	position: [0, -10, 0],
+    // 	rotation: [0, 0, 0]
+    // }]); //右墙
+    // createGlassWall(250, 80, 0, 40, 75, 0, 0, 0); //前墙
+    // createGlassWall(150, 80, -125, 40, 0, 0, Math.PI/2, 0); //右墙
+
+    // 空调
+    createStandAir(30, 60, 20, -100, 30, -60, 0, 0, 0);
+    createStandAir(30, 60, 20, -50, 30, -60, 0, 0, 0);
+
+    // 配电柜
+    createSmallAir(20, 40, 20, -20, 20, -60, 0, 0, 0);
+
+    // 强电箱
+    // createStrlight(25, 30, 10, 90, 55, -67, 0, 0, 0);
+    // createStrlight(25, 30, 10, 60, 55, -67, 0, 0, 0);
+
+    // 档案柜
+    createFileCabniet(35, 50, 20, -90, 25, 55, 0, Math.PI / 2, 0);
+    createFileCabniet(35, 50, 20, -65, 25, 55, 0, Math.PI / 2, 0);
+  }
+
+  // 创建地板
+  function createFloor(width, height) {
+    var floorGeometry = new THREE.PlaneGeometry(width, height);
+    var maps = textureLoader.load("./images/floor.png");
+    maps.wrapS = maps.wrapT = THREE.RepeatWrapping;
+    maps.repeat.set(8, 6);
+    maps.needsUpdate = true;
+
+    var material = new THREE.MeshBasicMaterial({
+      map: maps,
+      side: THREE.DoubleSide,
+    });
+    var floor = new THREE.Mesh(floorGeometry, material);
+    floor.rotation.x = Math.PI / 2;
+    scene.add(floor);
+    return floor;
+  }
+
+  // 创建玻璃墙
+  function createGlassWall(w, h, d, px, py, pz, rx, ry, rz, holes, opa) {
+    var geometry = new THREE.BoxGeometry(w, h, d);
+    var texture = new textureLoader.load("./images/jsk.png");
+    texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
+    texture.repeat.set(1, 1);
+    var meterials = new THREE.MeshStandardMaterial({
+      // color: 0xD6F2F2,
+      color: 0xeff8fc,
+      // map: texture,
+      opacity: opa,
+      transparent: true,
+      side: THREE.DoubleSide,
+    });
+    var glassW = new THREE.Mesh(geometry, meterials);
+    if (holes) {
+      for (var i = 0; i < holes.length; i++) {
+        var totalBSP = new ThreeBSP(glassW);
+        var hole = holes[i];
+        var holeGeometry = new THREE.BoxGeometry(
+          hole.size[0],
+          hole.size[1],
+          hole.size[2]
+        );
+        var holeCube = new THREE.Mesh(holeGeometry);
+        holeCube.position.x = hole.position[0];
+        holeCube.position.y = hole.position[1];
+        holeCube.position.z = hole.position[2];
+
+        holeCube.rotation.y = hole.rotation[1];
+
+        var clipBSP = new ThreeBSP(holeCube);
+
+        var resultBSP = totalBSP.subtract(clipBSP);
+
+        glassW = resultBSP.toMesh();
+      }
+
+      glassW.material = meterials;
+    }
+
+    glassW.position.x = px;
+    glassW.position.y = py;
+    glassW.position.z = pz;
+
+    glassW.rotation.y = ry;
+
+    scene.add(glassW);
+
+    return glassW;
+  }
+
+  // 创建空调
+  function createStandAir(w, h, d, px, py, pz, rx, ry, rz) {
+    var texture = new THREE.ImageUtils.loadTexture("./fourImages/kongtiao.png");
+    //var texture = new THREE.ImageUtils.loadTexture('img/airCondition.png');
+    texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
+    texture.repeat.set(1, 1);
+
+    var geometry = new THREE.BoxGeometry(w, h, d);
+
+    var materialArray = [];
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697,
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697,
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697,
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697,
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        map: texture,
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697,
+      })
+    );
+    var material = new THREE.MeshFaceMaterial(materialArray);
+
+    var air = new THREE.Mesh(geometry, material);
+
+    air.position.x = px;
+    air.position.y = py;
+    air.position.z = pz;
+
+    air.rotation.x = rx;
+    air.rotation.y = ry;
+    air.rotation.z = rz;
+
+    scene.add(air);
+
+    return air;
+  }
+
+  // 创建小空调
+  function createSmallAir(w, h, d, px, py, pz, rx, ry, rz) {
+    var texture = new THREE.ImageUtils.loadTexture("./images/kongg.png");
+    //var texture = new THREE.ImageUtils.loadTexture('img/airCondition.png');
+    texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
+    texture.repeat.set(1, 1);
+
+    var geometry = new THREE.BoxGeometry(w, h, d);
+
+    var materialArray = [];
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697,
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697,
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697,
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697,
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        map: texture,
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697,
+      })
+    );
+    var material = new THREE.MeshFaceMaterial(materialArray);
+
+    var smallair = new THREE.Mesh(geometry, material);
+
+    smallair.position.x = px;
+    smallair.position.y = py;
+    smallair.position.z = pz;
+
+    smallair.rotation.x = rx;
+    smallair.rotation.y = ry;
+    smallair.rotation.z = rz;
+
+    scene.add(smallair);
+
+    return smallair;
+  }
+
+  // 创建门
+  function createDoor(px, py, pz) {
+    const fbxloader = new THREE.FBXLoader();
+    fbxloader.load("./model/door.fbx", function (obj) {
+      const item = obj.children[0];
+      item.scale.set(0.03, 0.05, 0.03);
+      item.position.set(px, py, pz);
+      item.rotation.y = Math.PI / 2;
+      obj.castShadow = true;
+      scene.add(obj);
+    });
+  }
+  // function createDoor(w, h, px, py, pz, rx, ry, rz) {
+  // 	var geometry = new THREE.BoxGeometry(w, h, 5);
+  // 	var texture = new THREE.ImageUtils.loadTexture('images/rightdoor.png');
+  // 	texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
+  // 	texture.repeat.set(1, 1);
+  //
+  // 	var texture2 = new THREE.ImageUtils.loadTexture('images/rightdoor_reverse.png');
+  // 	texture2.wrapS = texture2.wrapT = THREE.RepeatWrapping;
+  // 	texture2.repeat.set(1, 1);
+  //
+  // 	var materialArray = [];
+  // 	// order to add materials: x+,x-,y+,y-,z+,z-
+  // 	materialArray.push(new THREE.MeshBasicMaterial({
+  // 		color: 0x6C4843
+  // 	}));
+  // 	materialArray.push(new THREE.MeshBasicMaterial({
+  // 		color: 0x6C4843
+  // 	}));
+  // 	materialArray.push(new THREE.MeshBasicMaterial({
+  // 		color: 0x6C4843
+  // 	}));
+  // 	materialArray.push(new THREE.MeshBasicMaterial({
+  // 		color: 0x6C4843
+  // 	}));
+  // 	materialArray.push(new THREE.MeshBasicMaterial({
+  // 		map: texture
+  // 	}));
+  // 	materialArray.push(new THREE.MeshBasicMaterial({
+  // 		map: texture2
+  // 	}));
+  // 	var material = new THREE.MeshFaceMaterial(materialArray);
+  //
+  // 	var door = new THREE.Mesh(geometry, material);
+  //
+  // 	door.position.x = px;
+  // 	door.position.y = py;
+  // 	door.position.z = pz;
+  //
+  // 	door.rotation.y = ry;
+  //
+  // 	scene.add(door);
+  //
+  // 	return door;
+  // }
+
+  // 创建强电箱
+  function createStrlight(w, h, d, px, py, pz, rx, ry, rz) {
+    // var texture = new THREE.ImageUtils.loadTexture('./fourImages/airfiretop.png');
+    // texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
+    // texture.repeat.set(1, 1);
+
+    var texture2 = new THREE.ImageUtils.loadTexture("./images/pdg.png");
+    texture2.wrapS = texture2.wrapT = THREE.RepeatWrapping;
+    texture2.repeat.set(1, 1);
+
+    var geometry = new THREE.BoxGeometry(w, h, d);
+    //var material = new THREE.MeshBasicMaterial( { map: texture } );
+    // Create an array of materials to be used in a cube, one for each side
+    var materialArray = [];
+    // order to add materials: x+,x-,y+,y-,z+,z-
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x969d7a, //后面
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x969d7a, //前面
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x969d7a, //上
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x969d7a, //下
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        map: texture2, // 左
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x969d7a, //右
+      })
+    );
+    var material = new THREE.MeshFaceMaterial(materialArray);
+
+    var strlight = new THREE.Mesh(geometry, material);
+
+    strlight.position.x = px;
+    strlight.position.y = py;
+    strlight.position.z = pz;
+
+    strlight.rotation.x = rx;
+    strlight.rotation.y = ry;
+    strlight.rotation.z = rz;
+
+    scene.add(strlight);
+
+    return strlight;
+  }
+
+  // 创建档案柜
+  function createFileCabniet(w, h, d, px, py, pz, rx, ry, rz) {
+    // var texture = new THREE.ImageUtils.loadTexture('./fourImages/airfiretop.png');
+    // texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
+    // texture.repeat.set(1, 1);
+
+    var texture2 = new THREE.ImageUtils.loadTexture("./images/filecabniet.png");
+    texture2.wrapS = texture2.wrapT = THREE.RepeatWrapping;
+    texture2.repeat.set(1, 1);
+
+    var geometry = new THREE.BoxGeometry(w, h, d);
+    //var material = new THREE.MeshBasicMaterial( { map: texture } );
+    // Create an array of materials to be used in a cube, one for each side
+    var materialArray = [];
+    // order to add materials: x+,x-,y+,y-,z+,z-
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697, //后面
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697, //前面
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697, //上
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697, //下
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        map: texture2, // 左
+      })
+    );
+    materialArray.push(
+      new THREE.MeshBasicMaterial({
+        color: 0x979697, //右
+      })
+    );
+    var material = new THREE.MeshFaceMaterial(materialArray);
+
+    var filecabniet = new THREE.Mesh(geometry, material);
+
+    filecabniet.position.x = px;
+    filecabniet.position.y = py;
+    filecabniet.position.z = pz;
+
+    filecabniet.rotation.x = rx;
+    filecabniet.rotation.y = ry;
+    filecabniet.rotation.z = rz;
+    scene.add(filecabniet);
+
+    return filecabniet;
+  }
+
+  // function drawSprite(text2d, scale, color, x, y, z) {
+  // 	var texture = canvasMultilineText(text2d, {
+  // 		backgroundColor: color
+  // 	}, 'rgba(155, 187, 89, 1)');
+  // 	var spriteMaterial = new THREE.SpriteMaterial({
+  // 		map: texture,
+  // 		opacity: 0.9
+  // 	});
+  // 	var sprite = new THREE.Sprite(spriteMaterial);
+  // 	sprite.position.set(x, y, z);
+
+  // 	sprite.scale.set(scale * texture.image.width, scale * texture.image.height);
+
+  // 	return sprite;
+  // }
+
+  // function canvasMultilineText(textArray, parameters, rgba) {
+  // 	parameters = parameters || {};
+  // 	var width = 0;
+  // 	var canvas = document.createElement('canvas');
+  // 	var context = canvas.getContext('2d');
+  // 	var len = textArray.length;
+
+  // 	if (typeof textArray === 'string') textArray = [textArray];
+
+  // 	context.font = parameters.font ? parameters.font : '48px sans-serif';
+
+  // 	for (var i = 0; i < len; i++) {
+
+  // 		width = context.measureText(textArray[i]).width > width ? context.measureText(textArray[i]).width : width;
+
+  // 	}
+
+  // 	canvas.width = width + 20; // 480
+  // 	canvas.height = textArray.length * 60;
+
+  // 	context.fillStyle = rgba;
+  // 	context.fillRect(0, 0, canvas.width, canvas.height);
+
+  // 	context.font = parameters.font ? parameters.font : '48px sans-serif';
+
+  // 	for (var j = 0; j < len; j++) {
+  // 		context.fillStyle = '#1920E6';
+  // 		context.fillText(textArray[j], 10, 48 + j * 60);
+  // 	}
+
+  // 	var texture = new THREE.Texture(canvas);
+  // 	texture.minFilter = texture.magFilter = THREE.NearestFilter;
+  // 	texture.needsUpdate = true;
+
+  // 	return texture;
+
+  // }
+
+  function animate() {
+    requestAnimationFrame(animate);
+    render();
+    update();
+  }
+
+  // 更新插件
+  function update() {
+    controls.update();
+    stats.update();
+  }
+
+  function render() {
+    // let sprite;
+    // if (sprite != undefined) {
+    // 	scene.remove(sprite)
+    // }
+    // var myDate = new Date();
+    // sprite = drawSprite('Hello, world!' + myDate.getSeconds(), 0.5, 120, 6, 100, 0);
+    // sprite.material.needsUpdate = true;
+    // scene.add(sprite);
+    //console.log(sprite);
+    renderer.render(scene, camera);
+  }
+</script>

+ 305 - 0
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test66 copy/test66.js

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

+ 0 - 0
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test66 copy/test66.less


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

@@ -27,7 +27,7 @@ const test7 = (function () {
       setCharts(dom, testDoms[i]);
     }
 
-    let myChart = echarts.init(dists[0]);
+    // let myChart = echarts.init(dists[0]);
 
     window.addEventListener("resize", function () {
       if (timer) {

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

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

BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/1.png


BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/2.png


BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/3.png


BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/4.png


BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/bjaq.png


BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/ty.png


BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/zdwx.png


BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/zu.png


BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/networkSecurity/zu15.png


BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/numBg.png


BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/images/room.webp


+ 27 - 7
spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/css/main.css

@@ -10,6 +10,10 @@ html {
     src: url('iconfont/iconfont.eot?#iefix') format('embedded-opentype'), url('iconfont/iconfont.woff') format('woff'), url('iconfont/iconfont.ttf') format('truetype'), url('iconfont/iconfont.svg#iconfont') format('svg');
 }
 
+@font-face {
+  font-family: leslie;
+  src: url('../../font/LESLIE.TTF');
+}
 .iconfont {
     font-family: "iconfont" !important;
     font-size: 16px;
@@ -915,11 +919,11 @@ ul.subject li .previewBox {
 .tabBar {
     background: url("../../css/modules/layer/default/底部选择.png") no-repeat;
     background-size: 100%;
-    width: 90%;
+    width: 43%;
     height: 10%;
     position: absolute;
-    top: 90%;
-    left: 5%;
+    top: 93%;
+    left: 27%;
     display: flex;
 }
 
@@ -946,10 +950,11 @@ ul.subject li .previewBox {
 }
 
 .left-tabBar-img-box {
-    font-size: 12px !important;
+    font-size: 0.3rem !important;
     font-weight: 700;
     color: #fffffd;
-    margin-top: 3px;
+    margin-top: 1%;
+    margin-left: 7%;
 }
 
 .right-tabBar {
@@ -975,10 +980,11 @@ ul.subject li .previewBox {
 }
 
 .right-tabBar-img-box {
-    font-size: 12px !important;
+    font-size: 0.3rem !important;
     font-weight: 700;
     color: #fffffd;
-    margin-top: 3px;
+    margin-left: -1%;
+    margin-top: 1%;
 }
 
 .bossMeng{
@@ -991,4 +997,18 @@ ul.subject li .previewBox {
   z-index: 99999999;
   display: none;
 
+}
+
+
+.test31 .box31 .tool,
+.test32 .box32 .tool,
+.test33 .box33 .tool,
+.test34 .box34 .tool,
+.test35 .box35 .tool,
+.test36 .box36 .tool,
+.test37 .box37 .tool
+.test38 .box38 .tool
+.test39 .box39 .tool
+.test40 .box40 .tool{
+  top: -5%;
 }

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

@@ -268,11 +268,6 @@ $('.left-tabBar').click(function() { // 切换到态势总览
   $('.box42').css('visibility','hidden');
   $('.box61').css('visibility','visible');
 
-
-
-
-
-
     // box61L = $('.box61').position().left;
     // box61T = $('.box61').position().top;
 

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

@@ -56,7 +56,7 @@
     </div>
 
 
-    <div class="box12 box" data-name="test12" data-id="81" style="z-index: 4; left: 162px; top: 2629px; width: 4123px; height: 1501px;">
+    <div class="box12 box" data-name="test12" data-id="81" style="z-index: 4; left: 162px; top: 2685px; width: 4123px; height: 1501px;">
         <div class="toolBox">
             <span class="fit"></span>
             <span class="close"></span>
@@ -94,7 +94,7 @@
     </div>
 
     <!-- left: 162px; top: 4162px; -->
-    <div class="box13 box" id="box13" data-name="test13" data-id="82" style="z-index: 5; left: 162px; top: 4162px; width: 4120px; height: 1936px;">
+    <div class="box13 box" id="box13" data-name="test13" data-id="82" style="z-index: 5; left: 162px; top: 4190px; width: 4120px; height: 1936px;">
         <div class="toolBox">
             <span class="fit"></span>
             <span class="close"></span>
@@ -138,7 +138,7 @@
     </div>
 
     <!-- style="z-index: 3; left: 10400px; top: 920px; height: 1600px; width: 4872px;" -->
-    <div class="box14 box" data-name="test14" data-id="83" style="z-index: 3; left: 10400px; top: 920px; height: 1504px; width: 4848px;">
+    <div class="box14 box" data-name="test14" data-id="83" style="z-index: 3; left: 10400px; top: 892px; height: 1984px; width: 4848px;">
         <div class="toolBox">
             <span class="fit"></span>
             <span class="close"></span>
@@ -185,7 +185,7 @@
     </div>
 
 
-    <div class="box15 box" data-name="test15" data-id="84" style="z-index: 4; left: 10400px; top: 2466px; width: 4840px; height: 2132px;">
+    <div class="box15 box" data-name="test15" data-id="84" style="z-index: 4; left: 10400px; top: 3010px; width: 4840px; height: 1516px;">
         <div class="toolBox">
             <span class="fit"></span>
             <span class="close"></span>

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

@@ -5,7 +5,7 @@
     </div>
 
     <!-- style="z-index: 2; width: 4680px; height: 1552px;left:160px;top: 880px; -->
-    <div class="box18 box" data-name="test18" data-id="87" style="z-index: 2; width: 4680px; height: 1552px;left:160px;top: 880px;">
+    <div class="box18 active box" data-name="test18" data-id="87" style="z-index: 2; width: 4680px; height: 1552px;left:160px;top: 880px;">
         <!--  style="z-index: 2; width: 4680px; height: 1552px" -->
         <div class="toolBox">
             <span class="fit"></span>
@@ -17,33 +17,33 @@
             </div>
         </div>
         <div class="test-box">
-            <div class="content">
-                <!-- 数据统计 -->
-                <div class="dataCount">
-                    <div class="dataCount_box">
-                        <div class="count-item">
-                            <h3>业务统</h3>
-                            <div class="info-box">
-                                <span class="info-box-number">3</span>
-                                <span>个</span>
-                            </div>
-                        </div>
-                        <div class="count-item">
-                            <h3>安全设备</h3>
-                            <div class="info-box">
-                                <span class="count-item-number">3</span>
-                                <span>台</span>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
+          <div class="content">
+            <!-- 网络安全主题-数据统计 -->
+            <div class="dataCount">
+              <div class="dataCount_box">
+                  <div class="count-item item1">
+                      <h3>业务统</h3>
+                      <div class="info-box">
+                          <span class="num">3</span>
+                          <span>个</span>
+                      </div>
+                  </div>
+                  <div class="count-item item2">
+                      <h3>安全设备</h3>
+                      <div class="info-box">
+                          <span class="num">3</span>
+                          <span>台</span>
+                      </div>
+                  </div>
+              </div>
+          </div>
+        </div>
         </div>
         <div class="panel-footer"></div>
     </div>
 
     <!-- style="z-index: 3; width: 4696px; height: 2095px; left: 164px; top: 2492px" -->
-    <div class="box19 box" data-name="test19" data-id="88" style="z-index: 3; width: 4696px; height: 2095px; left: 164px; top: 2492px">
+    <div class="box19 box" data-name="test19" data-id="88" style="z-index: 3; width: 4696px; height: 2095px; left: 164px; top: 2492px;color: #3c9ffa;">
         <!-- style="z-index: 3; width: 4699px; height: 2092px; left: 0; top: 2376px" -->
         <div class="toolBox">
             <span class="fit"></span>
@@ -375,8 +375,8 @@
             orgType: 2
         },
         success: function(res) {
-            $(".info-box-number").html(res.result.sys_number);
-            $(".count-item-number").html(res.result.office_number);
+            $(".box18 .item1 .num").html(res.result.sys_number);
+            $(".box18 .item2 .num").html(res.result.office_number);
         },
         error: function(err) {
             console.log("------------------------超时");
@@ -475,7 +475,7 @@
             let data = res.result.map(item => {
                 return `
                <li>
-                        <img src="../images/networkSecurity/tu10.png" alt="">
+                        <img src="../images/networkSecurity/4.png" alt="">
                         <span>${item.system_name}</span>
                     </li>
                `

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

@@ -1,10 +1,11 @@
+
 <!-- 浪潮 -->
 <div class="springFrame springFrame4">
     <div class="springFrameTitle">
         <h2>浪潮政务云网络安全态势</h2>
     </div>
     <!-- style="z-index: 4;width: 4412px;height: 1631px;left: 104px;top: 4564px;" -->
-    <div class="box25 box" data-name="test25" data-id="94" style="z-index: 2;width: 4407px;height: 1547px;left: 104px;top: 880px;">
+    <div class="box25 active box" data-name="test25" data-id="94" style="z-index: 2;width: 4407px;height: 1547px;left: 104px;top: 880px;">
         <div class="toolBox">
             <span class="fit"></span>
             <span class="close"></span>
@@ -18,25 +19,23 @@
             <div class="content">
                 <!-- 网络安全主题-数据统计 -->
                 <div class="dataCount">
-                    <div class="dataCount_box">
-                        <div class="left">
-                            <div class="one">
-                                <img src="../images/networkSecurity/tu9.png" alt="">
-                                <div class="spanBox">
-                                    <p class="txt">业务系统</p>
-                                    <p class="num">5 <span>个</span></p>
-                                </div>
-                            </div>
-                            <div class="tow">
-                                <img src="../images/networkSecurity/tu10.png" alt="">
-                                <div class="spanBox">
-                                    <p class="txt">设备安全</p>
-                                    <p class="num">0 <span>个</span></p>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
+                  <div class="dataCount_box">
+                      <div class="count-item item1">
+                          <h3>业务系统</h3>
+                          <div class="info-box">
+                              <span class="num">3</span>
+                              <span>个</span>
+                          </div>
+                      </div>
+                      <div class="count-item item2">
+                          <h3>安全设备</h3>
+                          <div class="info-box">
+                              <span class="num">3</span>
+                              <span>台</span>
+                          </div>
+                      </div>
+                  </div>
+              </div>
             </div>
         </div>
         <div class="panel-footer"></div>
@@ -57,21 +56,21 @@
                 <!-- 漏洞数据 -->
                 <div class="dataCount">
                     <div class="descBox">
-                        <div class="left">
-                            <img src="../images/networkSecurity/sum.png" alt="">
-                            <div class="info">
-                                <span>高危漏洞</span>
-                                <span class="txt">127</span>
-                            </div>
+                      <div class="left">
+                        <img src="../images/networkSecurity/gwld.png" alt="">
+                        <div class="info">
+                            <span>高危漏洞</span>
+                            <span class="txt">127</span>
                         </div>
-                        <div class="right">
-                            <img src="../images/networkSecurity/sum.png" alt="">
-                            <div class="info">
-                                <span>中危漏洞</span>
-                                <span class="txt">660</span>
-                            </div>
+                    </div>
+                    <div class="right">
+                        <img src="../images/networkSecurity/zwld.png" alt="">
+                        <div class="info">
+                            <span>中危漏洞</span>
+                            <span class="txt">660</span>
                         </div>
                     </div>
+                    </div>
                 </div>
                 <table id="stuTable" class="table">
                     <thead>
@@ -157,14 +156,14 @@
                             <ul>
                                 <li>
                                     <div class="desc">
-                                        <img src="../images/networkSecurity/tu10.png" alt="">
+                                        <img src="../images/networkSecurity/bjaq.png" alt="">
                                         <span>比较安全</span>
                                         <span class="text1">626</span>
                                     </div>
                                 </li>
                                 <li>
                                     <div class="desc">
-                                        <img src="../images/networkSecurity/tu10.png" alt="">
+                                        <img src="../images/networkSecurity/zdwx.png" alt="">
                                         <span>中度危险</span>
                                         <span class="text2">626</span>
                                     </div>
@@ -275,14 +274,14 @@
             } = res;
             if (!result) {
                 // 业务系统
-                $('.springFrame4 .box25 .one .num').html(0);
+                $('.springFrame4 .box25 .item1 .num').html(0);
                 // 设备安全
-                $('.springFrame4 .box25 .tow .num').html(0);
+                $('.springFrame4 .box25 .item2 .num').html(0);
             } else {
                 // 业务系统
-                $('.springFrame4 .box25 .one .num').html(result.sys_number);
+                $('.springFrame4 .box25 .item1 .num').html(result.sys_number);
                 // 设备安全
-                $('.springFrame4 .box25 .tow .num').html(result.equipment_number);
+                $('.springFrame4 .box25 .item2 .num').html(result.equipment_number);
             }
         },
         error: function(err) {
@@ -435,8 +434,9 @@
             if (!result) {
                 return
             }
-            let resArr = result.map((item, index) => {
-                return `
+           let html = ''
+            result.forEach((item, index) => {
+                html+= `
                     <tr>
                         <td>${index + 1}</td>
                         <td>未处理</td>
@@ -447,7 +447,15 @@
                     </tr>
                     `
             })
-            $('.springFrame4 .box30 tbody').append(resArr.join(''));
+            $('.springFrame .box30 tbody').html(html)
+            console.log($('.springFrame4 .box30 tbody tr').eq(0).find('td').eq(0));
+            $('.springFrame4 .box30 tbody tr').eq(0).find('td').eq(0).css({
+              'background':'url(../imgages/networkSecurity/1.png) no-repeat;'
+            })
+            //     "background": `url("${basicUrl}${result.background_path}") 0% 0% / cover`
+
+            $('.springFrame4 .box30 tbody td').eq(1).find('td').eq(0).css('background','url("../imgages/networkSecurity/2.png") no-repeat;')
+            $('.springFrame4 .box30 tbody td').eq(2).find('td').eq(0).css('background','url("../imgages/networkSecurity/3.png) no-repeat;"')
         },
         error: function(err) {
             console.log("受攻击最严重业务统计-超时111111");