Browse Source

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

# Conflicts:
#	spring-cloud/server-basic/src/main/java/com/jd/configer/ResourceServerConfig.java
xyg 3 years ago
parent
commit
940c15e4a4
92 changed files with 3808 additions and 3853 deletions
  1. 9 0
      cms/src/main/java/com/jd/cms/controller/FileController.java
  2. 8 0
      cms/src/main/java/com/jd/cms/service/FileService.java
  3. 20 0
      cms/src/main/java/com/jd/cms/service/impl/FileServiceImpl.java
  4. 3 4
      cms/src/main/resources/static/ftl/fzzd/dhl/hdgn/wjll.ftl
  5. 37 1
      sms/src/main/java/com/jd/sms/controller/SmsController.java
  6. 1 1
      spring-cloud/server-basic/src/main/java/com/jd/configer/ResourceServerConfig.java
  7. 22 1
      spring-cloud/server-basic/src/main/java/com/jd/controller/FlatController.java
  8. 5 5
      spring-cloud/server-basic/src/main/java/com/jd/service/impl/SafetyInfoServiceImpl.java
  9. 87 85
      spring-cloud/server-page/src/main/resources/static/lbzd/css/index_lbfz.css
  10. 78 41
      spring-cloud/server-page/src/main/resources/static/lbzd/css/indexb.css
  11. 9 4
      spring-cloud/server-page/src/main/resources/static/lbzd/css/style.css
  12. 4 1
      spring-cloud/server-page/src/main/resources/static/lbzd/css/ztzs.css
  13. 8 4
      spring-cloud/server-page/src/main/resources/static/lbzd/font/iconfont.css
  14. 0 0
      spring-cloud/server-page/src/main/resources/static/lbzd/font/iconfont.js
  15. 0 51
      spring-cloud/server-page/src/main/resources/static/lbzd/font/iconfont.json
  16. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/font/iconfont.ttf
  17. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/font/iconfont.woff
  18. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/font/iconfont.woff2
  19. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/1.png
  20. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/2.png
  21. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/3.png
  22. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/4.png
  23. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/5.png
  24. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/bg.png
  25. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/kk.png
  26. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/left.png
  27. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/licheng.png
  28. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/licheng1.png
  29. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/pdf.png
  30. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/right.png
  31. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/sp.png
  32. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/tp.png
  33. BIN
      spring-cloud/server-page/src/main/resources/static/lbzd/img/wj.png
  34. 148 16
      spring-cloud/server-page/src/main/resources/static/lbzd/indexb.html
  35. 8 6
      spring-cloud/server-page/src/main/resources/static/lbzd/js/xczs.js
  36. 76 178
      spring-cloud/server-page/src/main/resources/static/lbzd/wjll.html
  37. 58 32
      spring-cloud/server-page/src/main/resources/static/lbzd/wjts.html
  38. 176 149
      spring-cloud/server-page/src/main/resources/static/lbzd/xczs.html
  39. 37 1
      spring-cloud/server-page/src/main/resources/static/lbzd/ztzs.html
  40. 60 59
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test1/test1.css
  41. 101 101
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test1/test1.js
  42. 16 7
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test10/test10.css
  43. 94 50
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test10/test10.html
  44. 118 94
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test2/test2.css
  45. 96 97
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test2/test2.html
  46. 340 340
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test2/test2.js
  47. 6 3
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test28/test28.css
  48. 52 43
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test3/test3.css
  49. 110 104
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test3/test3.html
  50. 20 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test3/test3.js
  51. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test31/test31.js
  52. 19 5
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test32/test32.css
  53. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test32/test32.html
  54. 6 20
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test33/test33.js
  55. 46 114
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test36/test36 copy.js
  56. 2 15
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test36/test36.js
  57. 6 6
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test37/test37.html
  58. 25 18
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test38/test38.js
  59. 5 71
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test39/test39.js
  60. 66 54
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test4/test4.css
  61. 101 105
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test4/test4.html
  62. 6 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test40/test40.js
  63. 16 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test41/test41.css
  64. 4 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test41/test41.js
  65. 4 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test42/test42.css
  66. 0 5
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test42/test42.html
  67. 113 201
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test49/test49.html
  68. 0 621
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test49/test49.js
  69. 29 28
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test5/test5.css
  70. 2 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test50/test50.html
  71. 8 8
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test50/test50.js
  72. 113 37
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test61/test61.css
  73. 43 34
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test61/test61.html
  74. 109 8
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test61/test61.js
  75. 26 5
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test62/test62.html
  76. 11 10
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test7/test7.js
  77. 76 59
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test9/test9.css
  78. 130 80
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test9/test9.html
  79. 232 223
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/css/coom.css
  80. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/css/modules/layer/default/图层 789.png
  81. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/css/modules/layer/default/色相饱和度1854.png
  82. BIN
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/font/RUIZIZHENYANTIMIANFEISHANGYONG-2.TTF
  83. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/index.css
  84. 8 0
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/js/common.js
  85. 1 1
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/css/main.css
  86. 94 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/js/common.js
  87. 13 45
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/js/main.js
  88. 2 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/main.html
  89. 593 571
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame1.html
  90. 45 8
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame3.html
  91. 42 10
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame4.html
  92. 2 2
      spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/springFrame5.html

+ 9 - 0
cms/src/main/java/com/jd/cms/controller/FileController.java

@@ -36,4 +36,13 @@ public class FileController {
     public Map<String, Object> getNotices() {
         return fileService.selectNotices();
     }
+
+    /**
+     * 获取轻应用文件
+     * @return
+     */
+    @GetMapping("getQYYFiles")
+    public Map<String, Object> getQYYFiles(Integer current, Integer size) {
+        return fileService.getQYYFiles(current, size);
+    }
 }

+ 8 - 0
cms/src/main/java/com/jd/cms/service/FileService.java

@@ -21,4 +21,12 @@ public interface FileService {
      * @return
      */
     Map<String, Object> selectNotices();
+
+    /**
+     * 获取轻应用文件库
+     * @param current
+     * @param size
+     * @return
+     */
+    Map<String, Object> getQYYFiles(Integer current, Integer size);
 }

+ 20 - 0
cms/src/main/java/com/jd/cms/service/impl/FileServiceImpl.java

@@ -1,5 +1,9 @@
 package com.jd.cms.service.impl;
 
+import cn.hutool.core.util.StrUtil;
+import cn.hutool.http.HttpRequest;
+import com.alibaba.fastjson.JSON;
+import com.alibaba.fastjson.JSONObject;
 import com.jd.cms.base.Constants;
 import com.jd.cms.mapper.FileMapper;
 import com.jd.cms.service.FileService;
@@ -24,6 +28,22 @@ public class FileServiceImpl implements FileService {
     private FileMapper fileMapper;
 
     @Override
+    public Map<String, Object> getQYYFiles(Integer current, Integer size) {
+        //调用http请求
+        String url = "http://172.16.100.101:9876/sms/getQYYFiles";
+        Map<String, Object> param = new HashMap<>();
+        param.put("current", current);
+        param.put("size", size);
+        String body = HttpRequest.get(url).form(param).execute().body();
+        if (StrUtil.isNotBlank(body)) {
+            JSONObject jsonObject = JSON.parseObject(body);
+            JSONObject data = jsonObject.getJSONObject("data");
+            return SendUtil.send(true, Constants.code200, data);
+        }
+        return SendUtil.send(false);
+    }
+
+    @Override
     public Map<String, Object> selectNotices() {
         // 通知公告获取
         // 获取通知公告栏目id

+ 3 - 4
cms/src/main/resources/static/ftl/fzzd/dhl/hdgn/wjll.ftl

@@ -329,7 +329,7 @@
         } else if (iden === "lswj") {
             // 加载临时文件库
             $(".file_list").load("/${data.websiteInfo.rootPath }/dhl/hdgn/wjll/lswj/list.html");
-        } else if (iden === "qyy") {
+        } else if (iden === "qyywj") {
             // 请求轻应用文件获取接口
             getFileListForQYY()
             // 加载轻应用文件库
@@ -342,16 +342,15 @@
     function getFileListForQYY() {
         $.ajax({
             type: 'get',
-            url: QYYFILE_PATH + 'base/api/upload/record/list',
+            url: FLAT_PATH_BASIC + 'flat/getQYYFiles',
             dataType: 'json',
             data: {
                 current: 1,
                 size: 10000,
             },
             success: function (res) {
-                if (res.code == 200) {
+                if (res.result) {
                     let data = res.data.records;
-                    console.log(data)
                     var qyyHtml = '';
                     if (data && data.length > 0) {
                         for (let i = 0; i < data.length; i++) {

+ 37 - 1
sms/src/main/java/com/jd/sms/controller/SmsController.java

@@ -1,13 +1,16 @@
 package com.jd.sms.controller;
 
+import cn.hutool.http.HttpRequest;
 import com.jd.sms.util.Blank;
-import com.jd.sms.util.ConstString;
 import com.jd.sms.util.SendUtil;
 import com.jd.sms.util.SmsUtil;
+import org.springframework.beans.factory.annotation.Value;
+import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.bind.annotation.PostMapping;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;
 
+import java.util.HashMap;
 import java.util.Map;
 
 /**
@@ -18,6 +21,20 @@ import java.util.Map;
 @RestController
 @RequestMapping("sms")
 public class SmsController {
+    @Value("${qyy.fileUrl}")
+    String qyyFileUrl;
+    /**
+     * 短信发送接口
+     * @param mobiles
+     * @param ecName
+     * @param apId
+     * @param secretKey
+     * @param sign
+     * @param url
+     * @param content
+     * @param addSerial
+     * @return
+     */
     @PostMapping("sendMessage")
     public Map<String, Object> sendMsg(String mobiles, String ecName, String apId, String secretKey, String sign, String url, String content, String addSerial) {
         // 判断参数
@@ -51,4 +68,23 @@ public class SmsController {
         }
         return SendUtil.send(true, "短信发送失败");
     }
+
+    /**
+     * 获取轻应用文件库列表
+     * @param current
+     * @param size
+     * @return
+     */
+    @GetMapping("getQYYFiles")
+    public String getQYYFiles(Integer current, Integer size) {
+        if (Blank.isEmpty(current, size)) {
+            current = 1;
+            size = 10000;
+        }
+        Map<String, Object> param = new HashMap<>();
+        param.put("current", current);
+        param.put("size", size);
+        String body = HttpRequest.get(qyyFileUrl).form(param).execute().body();
+        return body;
+    }
 }

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

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

+ 22 - 1
spring-cloud/server-basic/src/main/java/com/jd/controller/FlatController.java

@@ -7,6 +7,7 @@ import cn.hutool.core.util.StrUtil;
 import cn.hutool.http.HttpRequest;
 import cn.hutool.json.JSONObject;
 import cn.hutool.json.JSONUtil;
+import com.alibaba.fastjson.JSON;
 import com.jd.code.ConstString;
 import com.jd.entity.PersonCode;
 import com.jd.entity.basic.User;
@@ -19,8 +20,8 @@ import io.swagger.annotations.Api;
 import io.swagger.annotations.ApiOperation;
 import lombok.RequiredArgsConstructor;
 import org.springframework.beans.factory.annotation.Value;
-import org.springframework.data.redis.core.RedisTemplate;
 import org.springframework.transaction.annotation.Transactional;
+import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.bind.annotation.PostMapping;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;
@@ -106,6 +107,26 @@ public class FlatController {
 	}
 
 
+	/**
+	 * 获取轻应用文件
+	 * @return
+	 */
+	@GetMapping("getQYYFiles")
+	public Map<String, Object> getQYYFiles(Integer current, Integer size) {
+		//调用http请求
+//		String url = "http://172.16.100.101:9876/sms/getQYYFiles";
+		String url = Convert.toStr(basicDataService.getOneBasicDataByType("QYYFILE_URL").get("data_value"));
+		Map<String, Object> param = new HashMap<>();
+		param.put("current", current);
+		param.put("size", size);
+		String body = HttpRequest.get(url).form(param).execute().body();
+		if (StrUtil.isNotBlank(body)) {
+			com.alibaba.fastjson.JSONObject jsonObject = JSON.parseObject(body);
+			com.alibaba.fastjson.JSONObject data = jsonObject.getJSONObject("data");
+			return SendUtil.send(true, ConstString.RESULT_SUCCESS, data);
+		}
+		return SendUtil.send(false);
+	}
 
 	/**
 	 * 发送短信验证码

+ 5 - 5
spring-cloud/server-basic/src/main/java/com/jd/service/impl/SafetyInfoServiceImpl.java

@@ -97,7 +97,7 @@ public class SafetyInfoServiceImpl implements SafetyInfoService {
         //获取当前年月份
         Map<String, Object> map = new HashMap<>();
         Calendar calender = Calendar.getInstance();
-        Integer year = calender.get(calender.YEAR);
+        Integer year = calender.get(Calendar.YEAR);
         Integer month = (calender.get(Calendar.MONTH)==0?12:calender.get(Calendar.MONTH));
         if ((orgType != null) && (orgType != "")) {
             map.put("orgType", orgType);
@@ -117,7 +117,7 @@ public class SafetyInfoServiceImpl implements SafetyInfoService {
         //查询参数
         Map<String, Object> paramMap = new HashMap<>();
         Calendar calender = Calendar.getInstance();
-        Integer year = calender.get(calender.YEAR);
+        Integer year = calender.get(Calendar.YEAR);
         Integer month = (calender.get(Calendar.MONTH)==0?12:calender.get(Calendar.MONTH));
         paramMap.put("createYear", year);
         paramMap.put("createMonth", month);
@@ -163,7 +163,7 @@ public class SafetyInfoServiceImpl implements SafetyInfoService {
         Map<String, Object> paramMap = new HashMap<>();
         //时间
         Calendar calender = Calendar.getInstance();
-        Integer year = calender.get(calender.YEAR);
+        Integer year = calender.get(Calendar.YEAR);
         Integer month = (calender.get(Calendar.MONTH)==0?12:calender.get(Calendar.MONTH));
         paramMap.put("createYear", year);
         paramMap.put("createMonth", month);
@@ -205,7 +205,7 @@ public class SafetyInfoServiceImpl implements SafetyInfoService {
         Map<String, Object> paramMap = new HashMap<>();
         //时间
         Calendar calender = Calendar.getInstance();
-        Integer year = calender.get(calender.YEAR);
+        Integer year = calender.get(Calendar.YEAR);
         Integer month = (calender.get(Calendar.MONTH)==0?12:calender.get(Calendar.MONTH));
         paramMap.put("createYear", year);
         paramMap.put("createMonth", month);
@@ -298,7 +298,7 @@ public class SafetyInfoServiceImpl implements SafetyInfoService {
         Map<String, Object> paramMap = new HashMap<>();
         //当前时间
         Calendar calender = Calendar.getInstance();
-        Integer year = calender.get(calender.YEAR);
+        Integer year = calender.get(Calendar.YEAR);
         Integer month = (calender.get(Calendar.MONTH)==0?12:calender.get(Calendar.MONTH));
         paramMap.put("createYear", year);
         paramMap.put("createMonth", month);

+ 87 - 85
spring-cloud/server-page/src/main/resources/static/lbzd/css/index_lbfz.css

@@ -1,124 +1,126 @@
-*{
-	margin: 0;
-	padding: 0;
-	box-sizing: border-box;
-	font-family: "Microsoft YaHei";
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-family: "Microsoft YaHei";
 }
 
-html,body{
-	width: 100%;
-	height: 100%;
-	background-color: #E8E8F0;
+html,
+body {
+    width: 100%;
+    height: 100%;
+    background-color: #E8E8F0;
 }
 
-li{
-	list-style: none;
+li {
+    list-style: none;
 }
 
 @font-face {
-  font-family: 'iconfont';
-  src: url('iconfont.woff2?t=1649485663505') format('woff2'),
-       url('iconfont.woff?t=1649485663505') format('woff'),
-       url('iconfont.ttf?t=1649485663505') format('truetype');
+    font-family: 'iconfont';
+    src: url('iconfont.woff2?t=1649485663505') format('woff2'), url('iconfont.woff?t=1649485663505') format('woff'), url('iconfont.ttf?t=1649485663505') format('truetype');
 }
 
+
 /* 头部 */
 
-.header{
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	width: 100%;
-	height: 8%;
-	padding: 0 2%;
-	background-color: #1aadec;
-	background-image: linear-gradient(to right,#0451A3,#207DC2,#2C8ECD);
+.header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 100%;
+    height: 8%;
+    padding: 0 2%;
+    background-color: #1aadec;
+    background-image: linear-gradient(to right, #0451A3, #207DC2, #2C8ECD);
 }
 
-.header .head_left{
-	display: flex;
-	align-items: center;
-	cursor: default;
+.header .head_left {
+    display: flex;
+    align-items: center;
+    cursor: default;
 }
 
-.head_left>img{
-	height: 30px;
-	margin-right: 10px;
+.head_left>img {
+    height: 30px;
+    margin-right: 10px;
 }
 
-.head_left>i{
-	font-size: 25px;
-	font-weight: 550;
-	color: #D5D5D6;
+.head_left>i {
+    font-size: 25px;
+    font-weight: 550;
+    color: #D5D5D6;
 }
 
-.header .head_right>button{
-	width: 95px;
-	height: 40px;
-	border: 1px solid #fff;
-	border-radius: 5px;
-	font-size: 18px;
-	color: #FFFFFF;
-	cursor: pointer;
-	background-color: transparent;
+.header .head_right>button {
+    width: 95px;
+    height: 40px;
+    border: 1px solid #fff;
+    border-radius: 5px;
+    font-size: 18px;
+    color: #FFFFFF;
+    cursor: pointer;
+    background-color: transparent;
 }
 
-.header .head_right .swith{
-	font-size: 18px;
-	color: #FFFFFF;
-	margin-right: 10px;
+.header .head_right .swith {
+    font-size: 18px;
+    color: #FFFFFF;
+    margin-right: 10px;
 }
 
 
 /* 主体 */
-main{
-	width: 100%;
-	height: 92%;
-	padding: 1%;
+
+main {
+    width: 100%;
+    height: 92%;
+    padding: 1%;
 }
 
-.main-tab{
-	width: 100%;
-	height: 8%;
-	box-shadow: 0px 4px 13px rgb(147 147 147 / 50%);
+.main-tab {
+    width: 100%;
+    height: 8%;
+    box-shadow: 0px 4px 13px rgb(147 147 147 / 50%);
 }
 
-.main-tab .tab-list{
-	display: flex;
-	align-items: center;
-	width: 100%;
-	height: 100%;
+.main-tab .tab-list {
+    display: flex;
+    align-items: center;
+    width: 100%;
+    height: 100%;
 }
 
-.tab-list .tab-item{
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 25%;
-	height: 100%;
-	font-size: 18px;
-	font-weight: 500;
-	color: #717171;
-	border-right: 1px solid #ccc;
-	border-radius: 5px;
-	background-color: #fff;
+.tab-list .tab-item {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 25%;
+    height: 100%;
+    font-size: 18px;
+    font-weight: 500;
+    color: #717171;
+    border-right: 1px solid #ccc;
+    border-radius: 5px;
+    background-color: #fff;
 }
 
-.tab-list .tab-item:nth-child(4){
-	border-right: none;
+.tab-list .tab-item:nth-child(4) {
+    border-right: none;
 }
 
-.tab-item-act{
-	color: #FFFFFF !important;
-	background-image: linear-gradient(to right,#0451A3,#207DC2,#2C8ECD);
+.tab-item-act {
+    color: #FFFFFF !important;
+    background-image: linear-gradient(to right, #0451A3, #207DC2, #2C8ECD);
 }
 
-section{
-	width: 100%;
-	height: 92%;
-	border-radius: 5px;
-	background-color: #FFFFFF;
-	box-shadow: 0px 4px 13px rgb(147 147 147 / 50%);
+section {
+    width: 100%;
+    height: 92%;
+    border-radius: 5px;
+    background-color: #FFFFFF;
+    box-shadow: 0px 4px 13px rgb(147 147 147 / 50%);
 }
 
-/* 宣传展示 */
+
+/* 宣传展示 */

+ 78 - 41
spring-cloud/server-page/src/main/resources/static/lbzd/css/indexb.css

@@ -75,6 +75,8 @@ li {
     position: relative;
     width: 100%;
     height: 100%;
+    background: url(../img/bg.png) bottom center no-repeat;
+    background-size: cover;
 }
 
 
@@ -87,74 +89,109 @@ li {
 
 .yg-box .time-line {
     position: relative;
-    height: 100%;
-}
-
-.time-line .center-line {
-    position: absolute;
-    bottom: 20%;
     width: 100%;
-    height: 5px;
-    background-color: #0451A3;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    overflow-x: scroll;
+    /* background: url(../img/licheng.png) top left no-repeat;
+    background-size: 100% 100%; */
 }
 
-.time-line img {
-    position: fixed;
-    bottom: 22.5%;
-    left: 50%;
+.one {
+    min-width: 100%;
+    height: 100%;
+    background: url(../img/licheng.png) top left no-repeat;
+    background-size: 100% 100%;
 }
 
-.time-top {
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: flex-start;
-    width: 100%;
+.two {
+    min-width: 100%;
     height: 100%;
-    overflow-y: scroll;
+    background: url(../img/licheng1.png) top left no-repeat;
+    background-size: 100% 100%;
 }
 
-.time-top .time-item {
+.time-line>div {
     position: relative;
-    bottom: -5%;
-    min-width: 200px;
-    height: 50%;
-    padding-right: 35px;
-    box-sizing: content-box;
 }
 
-.time-top .time-item::after {
-    content: "";
+.time-line>div>div {
     position: absolute;
-    bottom: 0;
-    width: 100%;
-    height: 5px;
-    background-color: #0451A3;
+    width: 17%;
+    height: 40%;
+}
+
+.o-one {
+    top: 32%;
+    left: 6%;
+}
+
+.o-two {
+    top: 32%;
+    left: 25%;
+}
+
+.o-there {
+    top: 31%;
+    left: 44%;
+}
+
+.o-four {
+    height: 52% !important;
+    top: 26%;
+    left: 63%;
+}
+
+.o-five {
+    top: 10%;
+    left: 82%;
+}
+
+.t-one {
+    top: 15%;
+    left: 6%;
+}
+
+.t-two {
+    top: 24%;
+    left: 25%;
+}
+
+.t-there {
+    top: 35%;
+    left: 44%;
+}
+
+.t-four {
+    top: 28%;
+    left: 63%;
 }
 
-.time-top .time-item:nth-of-type(1) {
-    padding-left: 40px;
+.t-five {
+    top: 27%;
+    left: 82%;
 }
 
-.time-item .flag {
+.flag {
     position: absolute;
-    width: 5px;
+    width: 7px;
     height: 100%;
     background-color: #0451A3;
 }
 
 .flag>i {
     position: absolute;
-    top: 5px;
+    top: 0px;
     display: inline-block;
-    border-top: 40px solid transparent;
-    border-bottom: 40px solid transparent;
-    border-left: 90px solid #0451A3;
+    border-top: 20px solid transparent;
+    border-bottom: 20px solid transparent;
+    border-left: 40px solid #0451A3;
 }
 
-.time-item .contan-box {
+.contan-box {
     position: absolute;
-    top: 30%;
+    top: 15%;
     margin-left: 14px;
 }
 

+ 9 - 4
spring-cloud/server-page/src/main/resources/static/lbzd/css/style.css

@@ -11,7 +11,7 @@
           body {
               width: 100%;
               height: 100%;
-              background: url(../img/xiangce.png) 75% center no-repeat;
+              background: url(../img/1.png) 75% center no-repeat;
               background-size: 92% 90%;
           }
           
@@ -80,6 +80,8 @@
               text-overflow: ellipsis;
               overflow: hidden;
               font-size: 18px;
+              background: url(../img/kk.png) top center no-repeat;
+              background-size: auto 100%;
           }
           /* new */
           
@@ -89,14 +91,17 @@
           }
           
           .front>span {
-              display: inline-block;
+              display: flex;
+              align-items: center;
+              justify-content: center;
               width: 100%;
-              height: 6%;
-              text-align: center;
+              height: 10%;
               white-space: nowrap;
               text-overflow: ellipsis;
               overflow: hidden;
               font-size: 18px;
+              background: url(../img/kk.png) top center no-repeat;
+              background-size: auto 100%;
           }
           
           .page.active {

+ 4 - 1
spring-cloud/server-page/src/main/resources/static/lbzd/css/ztzs.css

@@ -22,12 +22,15 @@ li {
     width: 100%;
     height: 100%;
     padding: 2%;
+    background: url(../img/bg.png) bottom center no-repeat;
+    background-size: cover;
 }
 
 .ztzs .ztzs-list {
     width: 100%;
-    height: 85%;
+    height: 100%;
     padding: 0 2%;
+    overflow-y: scroll;
 }
 
 .ztzs-list .ztzs-item {

+ 8 - 4
spring-cloud/server-page/src/main/resources/static/lbzd/font/iconfont.css

@@ -1,18 +1,22 @@
 @font-face {
   font-family: "iconfont"; /* Project id 3314969 */
-  src: url('iconfont.woff2?t=1649485663505') format('woff2'),
-       url('iconfont.woff?t=1649485663505') format('woff'),
-       url('iconfont.ttf?t=1649485663505') format('truetype');
+  src: url('iconfont.woff2?t=1652443805784') format('woff2'),
+       url('iconfont.woff?t=1652443805784') format('woff'),
+       url('iconfont.ttf?t=1652443805784') format('truetype');
 }
 
 .iconfont {
   font-family: "iconfont" !important;
-  font-size: 20px;
+  font-size: 16px;
   font-style: normal;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-wenjian:before {
+  content: "\e631";
+}
+
 .icon-zhaoxiangji:before {
   content: "\e663";
 }

File diff suppressed because it is too large
+ 0 - 0
spring-cloud/server-page/src/main/resources/static/lbzd/font/iconfont.js


+ 0 - 51
spring-cloud/server-page/src/main/resources/static/lbzd/font/iconfont.json

@@ -1,51 +0,0 @@
-{
-  "id": "3314969",
-  "name": "fzzd",
-  "font_family": "iconfont",
-  "css_prefix_text": "icon-",
-  "description": "",
-  "glyphs": [
-    {
-      "icon_id": "630128",
-      "name": "照相机",
-      "font_class": "zhaoxiangji",
-      "unicode": "e663",
-      "unicode_decimal": 58979
-    },
-    {
-      "icon_id": "10640861",
-      "name": "政务大厅",
-      "font_class": "jingwuicon_svg-",
-      "unicode": "e603",
-      "unicode_decimal": 58883
-    },
-    {
-      "icon_id": "11715087",
-      "name": "政府",
-      "font_class": "zhengfu",
-      "unicode": "e607",
-      "unicode_decimal": 58887
-    },
-    {
-      "icon_id": "12781205",
-      "name": "奖杯",
-      "font_class": "jiangbei",
-      "unicode": "e717",
-      "unicode_decimal": 59159
-    },
-    {
-      "icon_id": "15000963",
-      "name": "目标状态",
-      "font_class": "mubiaozhuangtai",
-      "unicode": "e612",
-      "unicode_decimal": 58898
-    },
-    {
-      "icon_id": "23505198",
-      "name": "步骤",
-      "font_class": "buzhou",
-      "unicode": "e625",
-      "unicode_decimal": 58917
-    }
-  ]
-}

BIN
spring-cloud/server-page/src/main/resources/static/lbzd/font/iconfont.ttf


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/font/iconfont.woff


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/font/iconfont.woff2


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/1.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/2.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/3.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/4.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/5.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/bg.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/kk.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/left.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/licheng.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/licheng1.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/pdf.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/right.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/sp.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/tp.png


BIN
spring-cloud/server-page/src/main/resources/static/lbzd/img/wj.png


+ 148 - 16
spring-cloud/server-page/src/main/resources/static/lbzd/indexb.html

@@ -34,10 +34,8 @@
             <!-- 沿革 -->
             <div class="yg-box">
                 <div class="time-line">
-                    <ul class="time-top">
-                        <div class="center-line"></div>
-                        <img src="img/run-man.png" />
-                        <li class="time-item">
+                    <div class="one">
+                        <div class="o-one">
                             <p class="flag">
                                 <i></i>
                             </p>
@@ -49,8 +47,142 @@
                                     重庆市城市建设局科技技术情报站成立
                                 </p>
                             </div>
-                        </li>
-                        <li class="time-item">
+                        </div>
+                        <div class="o-two">
+                            <p class="flag">
+                                <i></i>
+                            </p>
+                            <div class="contan-box">
+                                <div class="item-title">
+                                    1998
+                                </div>
+                                <p class="item-cont">
+                                    更名为重庆市市政管理局科学技术情报站
+                                </p>
+                            </div>
+                        </div>
+                        <div class="o-there">
+                            <p class="flag">
+                                <i></i>
+                            </p>
+                            <div class="contan-box">
+                                <div class="item-title">
+                                    2001
+                                </div>
+                                <p class="item-cont">
+                                    更名为重庆市市政信息中心
+                                </p>
+                            </div>
+                        </div>
+                        <div class="o-four">
+                            <p class="flag">
+                                <i></i>
+                            </p>
+                            <div class="contan-box">
+                                <div class="item-title">
+                                    2005
+                                </div>
+                                <p class="item-cont">
+                                    单位机构规格调整为正处级
+                                </p>
+                            </div>
+                        </div>
+                        <div class="o-five">
+                            <p class="flag">
+                                <i></i>
+                            </p>
+                            <div class="contan-box">
+                                <div class="item-title">
+                                    2010
+                                </div>
+                                <p class="item-cont">
+                                    经市编办批准增挂重庆市数字化城市管理中心牌子
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="two">
+                        <div class="t-one">
+                            <p class="flag">
+                                <i></i>
+                            </p>
+                            <div class="contan-box">
+                                <div class="item-title">
+                                    1985
+                                </div>
+                                <p class="item-cont">
+                                    重庆市城市建设局科技技术情报站成立
+                                </p>
+                            </div>
+                        </div>
+                        <div class="t-two">
+                            <p class="flag">
+                                <i></i>
+                            </p>
+                            <div class="contan-box">
+                                <div class="item-title">
+                                    1985
+                                </div>
+                                <p class="item-cont">
+                                    重庆市城市建设局科技技术情报站成立
+                                </p>
+                            </div>
+                        </div>
+                        <div class="t-there">
+                            <p class="flag">
+                                <i></i>
+                            </p>
+                            <div class="contan-box">
+                                <div class="item-title">
+                                    1985
+                                </div>
+                                <p class="item-cont">
+                                    重庆市城市建设局科技技术情报站成立
+                                </p>
+                            </div>
+                        </div>
+                        <div class="t-four">
+                            <p class="flag">
+                                <i></i>
+                            </p>
+                            <div class="contan-box">
+                                <div class="item-title">
+                                    1985
+                                </div>
+                                <p class="item-cont">
+                                    重庆市城市建设局科技技术情报站成立
+                                </p>
+                            </div>
+                        </div>
+                        <div class="t-five">
+                            <p class="flag">
+                                <i></i>
+                            </p>
+                            <div class="contan-box">
+                                <div class="item-title">
+                                    1985
+                                </div>
+                                <p class="item-cont">
+                                    重庆市城市建设局科技技术情报站成立
+                                </p>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="one">
+                        <div class="o-one">
+                            <p class="flag">
+                                <i></i>
+                            </p>
+                            <div class="contan-box">
+                                <div class="item-title">
+                                    1985
+                                </div>
+                                <p class="item-cont">
+                                    重庆市城市建设局科技技术情报站成立
+                                </p>
+                            </div>
+                        </div>
+                        <div class="o-two">
                             <p class="flag">
                                 <i></i>
                             </p>
@@ -62,8 +194,8 @@
                                     更名为重庆市市政管理局科学技术情报站
                                 </p>
                             </div>
-                        </li>
-                        <li class="time-item">
+                        </div>
+                        <div class="o-there">
                             <p class="flag">
                                 <i></i>
                             </p>
@@ -75,8 +207,8 @@
                                     更名为重庆市市政信息中心
                                 </p>
                             </div>
-                        </li>
-                        <li class="time-item">
+                        </div>
+                        <div class="o-four">
                             <p class="flag">
                                 <i></i>
                             </p>
@@ -88,8 +220,8 @@
                                     单位机构规格调整为正处级
                                 </p>
                             </div>
-                        </li>
-                        <li class="time-item">
+                        </div>
+                        <div class="o-five">
                             <p class="flag">
                                 <i></i>
                             </p>
@@ -101,8 +233,8 @@
                                     经市编办批准增挂重庆市数字化城市管理中心牌子
                                 </p>
                             </div>
-                        </li>
-                    </ul>
+                        </div>
+                    </div>
                 </div>
             </div>
             <!-- 机构 -->
@@ -144,7 +276,7 @@
             <!-- 掠影 -->
             <div class="ly-box" style="display: none;">
                 <div class="pre">
-                    <img src="img/zuoqiehuan.png" />
+                    <img src="img/left.png" />
                 </div>
                 <div class="swiper">
                     <div class="swiper-wrapper">
@@ -175,7 +307,7 @@
                     </div>
                 </div>
                 <div class="next">
-                    <img src="img/youqiehuan.png" />
+                    <img src="img/right.png" />
                 </div>
             </div>
             <!-- 奖牌 -->

+ 8 - 6
spring-cloud/server-page/src/main/resources/static/lbzd/js/xczs.js

@@ -1,7 +1,9 @@
-$(".scene-tab").on("click",".tab-text",function(){
-	const bool = $(this).hasClass("active-scene")
-	if(!bool){
-		$(this).siblings(".tab-text").removeClass("active-scene")
-		$(this).addClass("active-scene")
-	}
+$(".scene-tab").on("click", ".tab-text", function() {
+    const bool = $(this).hasClass("active-scene")
+    const imgId = $(this).attr("data-img")
+    if (!bool) {
+        $(this).siblings(".tab-text").removeClass("active-scene")
+        $(this).addClass("active-scene")
+        $("body").css({ "background": "url(./img/" + imgId + ".png) 75% center no-repeat", "background-size": "92% 90%" })
+    }
 })

+ 76 - 178
spring-cloud/server-page/src/main/resources/static/lbzd/wjll.html

@@ -29,6 +29,8 @@
             width: 100%;
             height: 100%;
             background-color: #FFFFFF;
+            background: url(img/bg.png) bottom center no-repeat;
+            background-size: cover;
         }
         
         .box .back {
@@ -39,47 +41,45 @@
             background-color: #000000;
         }
         
-        .back_list {
+        .crumbs {
             position: absolute;
-            top: 5%;
-            right: 5%;
-            width: 20%;
-            z-index: 9999;
+            top: 3%;
+            left: 2%;
             display: flex;
             align-items: center;
-            justify-content: flex-end;
-        }
-        
-        .back_list>div {
             font-size: 18px;
-            width: 50%;
-            text-align: center;
-            border-radius: 5px;
-            padding: 1% 0;
+            width: 80%;
+            z-index: 100;
         }
         
-        .back_list .back {
-            color: #FFFFFF;
-            background-color: #ff0000;
+        .crumbs>span {
+            margin: 0 0.5%;
         }
         
-        .back_list .wj_list {
-            /* margin-left: 1%; */
-            color: #297CC2;
-            background-color: #D5E8F6;
+        .crumbs .cur {
+            color: #8BBBDF;
         }
         
-        .file_list {
+        .box-wj {
             position: absolute;
             top: 50%;
             left: 50%;
             transform: translate(-50%, -50%);
+            width: 90%;
+            height: 70%;
+            box-shadow: 0px 1px 9px 0px rgba(0, 0, 0, 0.13);
+            border-radius: 16px;
+            overflow: hidden;
+        }
+        
+        .file_list {
             z-index: 1000;
             display: flex;
             align-content: baseline;
             flex-wrap: wrap;
-            width: 70%;
-            height: 60%;
+            width: 100%;
+            height: 87%;
+            overflow-y: scroll;
             border-radius: 5px;
             background-color: #FFFFFF;
         }
@@ -105,16 +105,18 @@
             display: -webkit-box;
             -webkit-line-clamp: 2;
             -webkit-box-orient: vertical;
-            font-size: 12px;
+            font-size: 14px;
         }
         
         .show {
             display: none;
-            justify-content: flex-end;
+            justify-content: center;
             width: 100%;
             height: 100%;
             overflow: auto;
             background-color: #FFFFFF;
+            background: url(img/bg.png) bottom center no-repeat;
+            background-size: cover;
         }
         
         .show::-webkit-scrollbar {
@@ -146,163 +148,78 @@
         }
         
         .file_ass {
-            position: absolute;
-            top: 0;
-            left: -15%;
-            width: 15%;
-            height: 100%;
-            overflow: auto;
-            z-index: 30;
-            transition: all 0.5s linear;
-            background-color: #FFFFFF;
+            display: flex;
+            align-items: center;
+            width: 100%;
+            height: 13%;
+            background-color: #8EB9E1;
         }
         
         .file_ass::-webkit-scrollbar {
             width: 0;
         }
         
-        .file_ass .title_ass {
-            width: 100%;
-            height: 40px;
-            line-height: 40px;
-            text-align: center;
-            font-weight: 550;
-            color: #333;
-            font-size: 18px;
-            border-bottom: 1px solid #ccc;
-        }
-        
         .file_ass .ass_item {
             display: flex;
             align-items: center;
             justify-content: center;
-            width: 100%;
-            height: 10%;
+            width: 20%;
+            height: 100%;
             overflow: hidden;
             text-overflow: ellipsis;
             white-space: nowrap;
-            border-bottom: 1px solid rgba(147, 147, 147, 0.4);
+            color: #FFFFFF;
+            font-size: 20px;
         }
         
         .ass_active {
-            color: #2D8FCE;
-            background-color: #C0DAED;
-        }
-        
-        .ass_shrink {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            position: absolute;
-            left: 0%;
-            top: 1%;
-            z-index: 30;
-            width: 3%;
-            height: 40px;
-            border-radius: 5px;
-            transition: all 0.5s linear;
-            background-color: rgba(4, 108, 183, 0.25);
-        }
-        
-        .ass_shrink>img {
-            width: 60%;
+            color: #FFFFFF;
+            background-color: #1F7ABF;
         }
     </style>
 </head>
 
 <body>
-    <ul class="file_ass" style="left: 0;">
-        <div class="title_ass">文件分类</div>
-        <li class="ass_item">一类文件</li>
-        <li class="ass_item">二类文件</li>
-        <li class="ass_item">三类文件</li>
-        <li class="ass_item">四类文件</li>
-    </ul>
-    <!-- 收缩文件分类 -->
-    <div class="ass_shrink" style="display: none;">
-        <img src="img/bottom.png" style="transform: rotate(90deg);" />
-    </div>
     <!-- 返回和文件列表 -->
-    <div class="back_list">
-        <div class="wj_list" style="display: none;">文件列表</div>
-        <div class="back">返回</div>
+    <div class="crumbs">
+        <div class="back_wjts">互动功能</div>
+        <span>&gt;</span>
+        <div class="cur">文件浏览</div>
     </div>
     <!-- 文件列表 -->
     <div class="box">
-        <ul class="file_list">
-            <li class="file_item" data-iden="video" data-src="https://vd4.bdstatic.com/mda-ndd5br5k6hgdgpwi/sc/cae_h264_delogo/1649908320881108315/mda-ndd5br5k6hgdgpwi.mp4?v_from_s=bdapp-bdappcore-hnb">
-                <img src="img/sp.png" />
-                <div class="file_name">
-                    视频视频视频视频视频视频
-                </div>
-            </li>
-            <li class="file_item" data-iden="img" data-src="img/a1.png">
-                <img src="img/tp.png" />
-                <div class="file_name">
-                    图片图片图片图片图片图片图片
-                </div>
-            </li>
-            <li class="file_item" data-iden="pdf">
-                <img src="img/pdf.png" />
-                <div class="file_name">
-                    pdf
-                </div>
-            </li>
-            <li class="file_item" data-iden="wj">
-                <img src="img/wj.png" />
-                <div class="file_name">
-                    文件
-                </div>
-            </li>
-            <li class="file_item">
-                <img src="img/wj.png" />
-                <div class="file_name">
-                    文件
-                </div>
-            </li>
-            <li class="file_item">
-                <img src="img/wj.png" />
-                <div class="file_name">
-                    文件
-                </div>
-            </li>
-            <li class="file_item">
-                <img src="img/wj.png" />
-                <div class="file_name">
-                    文件
-                </div>
-            </li>
-            <li class="file_item">
-                <img src="img/wj.png" />
-                <div class="file_name">
-                    文件
-                </div>
-            </li>
-            <li class="file_item">
-                <img src="img/wj.png" />
-                <div class="file_name">
-                    文件
-                </div>
-            </li>
-            <li class="file_item">
-                <img src="img/wj.png" />
-                <div class="file_name">
-                    文件
-                </div>
-            </li>
-            <li class="file_item">
-                <img src="img/wj.png" />
-                <div class="file_name">
-                    文件
-                </div>
-            </li>
-            <li class="file_item">
-                <img src="img/wj.png" />
-                <div class="file_name">
-                    文件
-                </div>
-            </li>
-        </ul>
+        <div class="box-wj">
+            <ul class="file_ass" style="left: 0;">
+                <li class="ass_item ass_active">一类文件</li>
+                <li class="ass_item">二类文件</li>
+            </ul>
+            <ul class="file_list">
+                <li class="file_item" data-iden="video" data-src="https://vd4.bdstatic.com/mda-ndd5br5k6hgdgpwi/sc/cae_h264_delogo/1649908320881108315/mda-ndd5br5k6hgdgpwi.mp4?v_from_s=bdapp-bdappcore-hnb">
+                    <img src="img/sp.png" />
+                    <div class="file_name">
+                        视频视频视频视频视频视频
+                    </div>
+                </li>
+                <li class="file_item" data-iden="img" data-src="img/a1.png">
+                    <img src="img/tp.png" />
+                    <div class="file_name">
+                        图片图片图片图片图片图片图片
+                    </div>
+                </li>
+                <li class="file_item" data-iden="pdf">
+                    <img src="img/pdf.png" />
+                    <div class="file_name">
+                        pdf
+                    </div>
+                </li>
+                <li class="file_item" data-iden="wj">
+                    <img src="img/wj.png" />
+                    <div class="file_name">
+                        文件
+                    </div>
+                </li>
+            </ul>
+        </div>
     </div>
     <!-- 显示 -->
     <div class="show">
@@ -316,7 +233,7 @@
     </div>
     <script src="js/jquery-3.5.1.min.js" type="text/javascript" charset="utf-8"></script>
     <script type="text/javascript">
-        $(".back_list").on("click", ".back", function() {
+        $(".crumbs").on("click", ".back_wjts", function() {
             location.href = "qtgn.html"
         })
 
@@ -337,30 +254,11 @@
             }
         })
 
-        $(".back_list").on("click", ".wj_list", function() {
-            $(this).css("display", "none")
+        $(".crumbs").on("click", ".cur", function() {
             $(".show").css("display", "none")
             $(".box").css("display", "block")
         })
 
-        // 文件分类
-        var idenNum = 1
-        $("body").on("click", ".ass_shrink", function() {
-            if (idenNum == 0) {
-                // 收起
-                $(".file_ass").css("left", "-15%")
-                $(this).css("left", "0")
-                $(this).find("img").attr("src", "img/bottom.png")
-                idenNum += 1
-            } else {
-                // 展开
-                $(".file_ass").css("left", "0")
-                $(this).css("left", "15%")
-                $(this).find("img").attr("src", "img/top.png")
-                idenNum = 0
-            }
-        })
-
         $(".file_ass").on("click", ".ass_item", function() {
             $(this).addClass("ass_active").siblings("li").removeClass("ass_active")
         })

+ 58 - 32
spring-cloud/server-page/src/main/resources/static/lbzd/wjts.html

@@ -4,6 +4,7 @@
 <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="stylesheet" href="font/iconfont.css">
     <title>文件推送</title>
     <style>
         * {
@@ -16,6 +17,8 @@
         body {
             width: 100%;
             height: 100%;
+            background: url(img/bg.png) bottom center no-repeat;
+            background-size: cover;
         }
         
         .file_input {
@@ -69,8 +72,8 @@
         }
         
         .look_xz .sh_look {
-            color: #333;
-            border: 1px solid #333;
+            color: #207DC2;
+            border: 1px solid #207DC2;
             background-color: #fff;
         }
         
@@ -81,26 +84,41 @@
         }
         
         .st-put .put_wj {
-            width: 120px;
+            width: 156px;
             height: 50px;
             line-height: 50px;
             border: 1px solid transparent;
             padding: 0 18px;
-            background-color: #207DC2;
             color: #fff;
             white-space: nowrap;
             text-align: center;
-            font-size: 14px;
+            font-size: 18px;
             border-radius: 2px;
             cursor: pointer;
+            border-bottom-right-radius: 25px;
+            border-top-right-radius: 25px;
+            background-image: linear-gradient(to right, #0451A3, #207DC2, #2C8ECD);
         }
         
         .st-put>input {
-            width: 370px;
+            width: 450px;
             height: 50px;
             font-size: 18px;
+            border-bottom-left-radius: 25px;
+            border-top-left-radius: 25px;
             outline: none;
             background-color: #fff;
+            text-indent: 3em;
+            border-color: #1168B3;
+        }
+        
+        .st-put>i {
+            position: absolute;
+            transform: translateY(-50%);
+            top: 53%;
+            left: 4%;
+            font-size: 24px;
+            color: #6D6D6D;
         }
         
         .fail {
@@ -120,19 +138,24 @@
         .fail>span {
             margin-left: 5%;
         }
-		
-		.back_wjts{
-			position: absolute;
-			top: 5%;
-			right: 1%;
-			font-size: 18px;
-			width: 10%;
-			text-align: center;
-			border-radius: 5px;
-			padding: 0.4% 0;
-			color: #FFFFFF;
-			background-color: #ff0000;
-		}
+        
+        .crumbs {
+            position: absolute;
+            top: 3%;
+            left: 2%;
+            display: flex;
+            align-items: center;
+            font-size: 18px;
+            width: 80%;
+        }
+        
+        .crumbs>span {
+            margin: 0 0.5%;
+        }
+        
+        .crumbs .cur {
+            color: #8BBBDF;
+        }
     </style>
 </head>
 
@@ -142,7 +165,8 @@
             <input type="file" id="put_file" />
         </form>
         <div class="st-put">
-            <input type="text" disabled>
+            <i class="iconfont icon-wenjian"></i>
+            <input type="text" value="请选择上传文件" disabled>
             <div class="put_wj">上传文件</div>
         </div>
     </div>
@@ -157,19 +181,21 @@
         <img src="img/fail.png" />
         <span>文件上传失败</span>
     </div>
-	<div class="back_wjts">
-		返回
-	</div>
+    <div class="crumbs">
+        <div class="back_wjts">互动功能</div>
+        <span>&gt;</span>
+        <div class="cur">临时文件推送</div>
+    </div>
     <script src="js/jquery-3.5.1.min.js"></script>
     <script>
         // 点击立即查看跳转文件浏览
         $(".look_xz").on("click", ".lj_look", function() {
-                location.href = "wjll.html"
-            })
-            // 点击稍后隐藏按钮
+            location.href = "wjll.html"
+        });
+        // 点击稍后隐藏按钮
         $(".look_xz").on("click", ".sh_look", function() {
             $(".tip").css("display", "none")
-        })
+        });
 
         // 监控文件上传的上传
         $(".file_input").on("change", "#put_file", function(e) {
@@ -193,11 +219,11 @@
         $(".st-put").on("click", ".put_wj", function() {
             $("#put_file").click()
         })
-		
-		// 点击返回
-		$("body").on("click",".back_wjts",function(){
-			location.href = "qtgn.html"
-		})
+
+        // 点击返回
+        $("body").on("click", ".back_wjts", function() {
+            location.href = "qtgn.html"
+        })
     </script>
 </body>
 

+ 176 - 149
spring-cloud/server-page/src/main/resources/static/lbzd/xczs.html

@@ -1,165 +1,192 @@
 <!DOCTYPE html>
 <html lang="zh">
-<head>
-	<meta charset="UTF-8">
-	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-	<meta name="viewport" content="width=device-width, initial-scale=1.0">
-	<title>宣传展示</title>
 
-	<!--主要样式-->
-	<link rel="stylesheet" href="css/style.css">
-	<script src="js/prefixfree.min.js"></script>
-	<style type="text/css">
-		.scene{
-			position: relative;
-		}
-		.scene-tab{
-			position: absolute;
-			z-index: -1;
-			top: -3.3%;
-			left: -109.15%;
-			width: 7%;
-			height: 99%;
-			list-style: none;
-		}
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>宣传展示</title>
 
-		.scene-tab .tab-text{
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			flex-direction: column;
-			text-align: center;
-			width: 100%;
-			height: 20%;
-			padding: 0;
-			color: #656565;
-			background-color: #9FCDEB;
-			border-top-left-radius: 5px;
-			border-bottom-left-radius: 5px;
-		}
-		.active-scene{
-			color: #FFFFFF !important;
-			background-color: #449ED7 !important;
-		}
-	</style>
+    <!--主要样式-->
+    <link rel="stylesheet" href="css/style.css">
+    <script src="js/prefixfree.min.js"></script>
+    <style type="text/css">
+        .scene {
+            position: relative;
+        }
+        
+        .scene-tab {
+            position: absolute;
+            z-index: -1;
+            top: -3.3%;
+            left: -112.15%;
+            width: 10%;
+            height: 99%;
+            list-style: none;
+            display: flex;
+            flex-direction: column;
+            align-items: flex-end;
+        }
+        
+        .scene-tab .tab-text {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            flex-direction: column;
+            text-align: center;
+            width: 80%;
+            height: 20%;
+            padding: 0;
+            color: #FFFFFF;
+            border-top-left-radius: 5px;
+            border-bottom-left-radius: 5px;
+        }
+        
+        .scene-tab .tab-text:nth-child(1) {
+            background-color: #1B5688;
+        }
+        
+        .scene-tab .tab-text:nth-child(2) {
+            background-color: #FF9757;
+        }
+        
+        .scene-tab .tab-text:nth-child(3) {
+            background-color: #01A7E4;
+        }
+        
+        .scene-tab .tab-text:nth-child(4) {
+            background-color: #2EC191;
+        }
+        
+        .scene-tab .tab-text:nth-child(5) {
+            background-color: #FF6F47;
+        }
+        
+        .active-scene {
+            width: 100% !important;
+        }
+    </style>
 </head>
+
 <body>
 
-<div class="scene">
-	<ul class="scene-tab">
-		<li class="tab-text active-scene">
-			<span>园</span>
-			<span>林</span>
-			<span>绿</span>
-			<span>化</span>
-		</li>
-		<li class="tab-text">
-			<span>市</span>
-			<span>政</span>
-			<span>设</span>
-			<span>施</span>
-		</li>
-		<li class="tab-text">
-			<span>市</span>
-			<span>容</span>
-			<span>环</span>
-			<span>卫</span>
-		</li>
-		<li class="tab-text">
-			<span>垃</span>
-			<span>圾</span>
-			<span>分</span>
-			<span>类</span>
-		</li>
-		<li class="tab-text">
-			<span>视</span>
-			<span>频</span>
-			<span>展</span>
-			<span>示</span>
-		</li>
-	</ul>
-	<article class="book">
+    <div class="scene">
+        <ul class="scene-tab">
+            <li class="tab-text active-scene" data-img="1">
+                <span>园</span>
+                <span>林</span>
+                <span>绿</span>
+                <span>化</span>
+            </li>
+            <li class="tab-text" data-img="2">
+                <span>市</span>
+                <span>政</span>
+                <span>设</span>
+                <span>施</span>
+            </li>
+            <li class="tab-text" data-img="3">
+                <span>市</span>
+                <span>容</span>
+                <span>环</span>
+                <span>卫</span>
+            </li>
+            <li class="tab-text" data-img="4">
+                <span>垃</span>
+                <span>圾</span>
+                <span>分</span>
+                <span>类</span>
+            </li>
+            <li class="tab-text" data-img="5">
+                <span>视</span>
+                <span>频</span>
+                <span>展</span>
+                <span>示</span>
+            </li>
+        </ul>
+        <article class="book">
 
-		<div class="back">
-			<img src="img/a1.png"/>
-			<span>1</span>
-		</div>
-		<div class="front">
-			<img src="img/a1.png"/>
-			<span>2</span>
-		</div>
-		<div class="back">
-			<img src="img/a1.png"/>
-			<span>3</span>
-		</div>
-		<div class="front">
-			<img src="img/a1.png"/>
-			<span>4</span>
-		</div>
-		<div class="back">
-			<img src="img/a1.png"/>
-			<span>5</span>
-		</div>
-		<div class="front">
-			<img src="img/a1.png"/>
-			<span>6</span>
-		</div>
-		<div class="back">
-			<img src="img/a1.png"/>
-			<span>7</span>
-		</div>
-		<div class="front">
-			<img src="img/a1.png"/>
-			<span>8</span>
-		</div>
-	</article>
-</div>
+            <div class="back">
+                <img src="img/a1.png" />
+                <span>1</span>
+            </div>
+            <div class="front">
+                <img src="img/a1.png" />
+                <span>2</span>
+            </div>
+            <div class="back">
+                <img src="img/a1.png" />
+                <span>3</span>
+            </div>
+            <div class="front">
+                <img src="img/a1.png" />
+                <span>4</span>
+            </div>
+            <div class="back">
+                <img src="img/a1.png" />
+                <span>5</span>
+            </div>
+            <div class="front">
+                <img src="img/a1.png" />
+                <span>6</span>
+            </div>
+            <div class="back">
+                <img src="img/a1.png" />
+                <span>7</span>
+            </div>
+            <div class="front">
+                <img src="img/a1.png" />
+                <span>8</span>
+            </div>
+        </article>
+    </div>
 
-	<script src="js/jquery-3.5.1.min.js"></script>
-	<script src='js/jquery.hammer.min.js' type="text/javascript"></script>
-	<script src="js/xczs.js" type="text/javascript" charset="utf-8"></script>
-	<script>
-		var count = $(".book").find("div").length
-		$(".book").find("div").each(function () {
-			if (count == 1) {
+    <script src="js/jquery-3.5.1.min.js"></script>
+    <script src='js/jquery.hammer.min.js' type="text/javascript"></script>
+    <script src="js/xczs.js" type="text/javascript" charset="utf-8"></script>
+    <script>
+        var count = $(".book").find("div").length
+        $(".book").find("div").each(function() {
+                if (count == 1) {
 
-			}
-		})
-		// 页数标识
-		var currentPage = 0;
-		// 点击翻页
-		$('.book')
-		.on('click', '.active', nextPage)
-		.on('click', '.flipped', prevPage);
+                }
+            })
+            // 页数标识
+        var currentPage = 0;
+        // 点击翻页
+        $('.book')
+            .on('click', '.active', nextPage)
+            .on('click', '.flipped', prevPage);
 
-		// 向前翻
-		function prevPage() {
-		  // 开始无法先前翻
-		  if(currentPage !== 0){
-			  $('.flipped')
-			    .last()
-			    .removeClass('flipped')
-			    .addClass('active')
-			    .siblings('.page')
-			    .removeClass('active');
-				currentPage -= 1
-		  }
-		}
-		function nextPage() {
-		  // 最后无法先后翻
-		  if(!(currentPage == ($(".page").length-2))){
-			  $('.active')
-				.removeClass('active')
-				.addClass('flipped')
-				.next('.page')
-				.addClass('active')
-				.siblings();
+        // 向前翻
+        function prevPage() {
+            // 开始无法先前翻
+            if (currentPage !== 0) {
+                $('.flipped')
+                    .last()
+                    .removeClass('flipped')
+                    .addClass('active')
+                    .siblings('.page')
+                    .removeClass('active');
+                currentPage -= 1
+            }
+        }
 
-				currentPage += 1
-		  }
+        function nextPage() {
+            // 最后无法先后翻
+            if (!(currentPage == ($(".page").length - 2))) {
+                $('.active')
+                    .removeClass('active')
+                    .addClass('flipped')
+                    .next('.page')
+                    .addClass('active')
+                    .siblings();
 
+                currentPage += 1
+            }
 
-		}
-	</script>
+
+        }
+    </script>
 </body>
+
 </html>

+ 37 - 1
spring-cloud/server-page/src/main/resources/static/lbzd/ztzs.html

@@ -48,8 +48,44 @@
                 <img src="img/jsdwzq.png" />
                 <p>局属单位网站集群</p>
             </li>
+            <li class="ztzs-item">
+                <img src="img/yycz.png" />
+                <p>一云承载</p>
+            </li>
+            <li class="ztzs-item">
+                <img src="img/yshj.png" />
+                <p>一数汇聚</p>
+            </li>
+            <li class="ztzs-item">
+                <img src="img/ywtg.png" />
+                <p>一网通管</p>
+            </li>
+            <li class="ztzs-item">
+                <img src="img/yptl.png" />
+                <p>一屏统览</p>
+            </li>
+            <li class="ztzs-item">
+                <img src="img/yjld.png" />
+                <p>一键联动</p>
+            </li>
+            <li class="ztzs-item">
+                <img src="img/szcg.png" />
+                <p>数字城管</p>
+            </li>
+            <li class="ztzs-item">
+                <img src="img/spjk.png" />
+                <p>视频监控</p>
+            </li>
+            <li class="ztzs-item">
+                <img src="img/gyyzt.png" />
+                <p>公园一张图</p>
+            </li>
+            <li class="ztzs-item">
+                <img src="img/jsdwzq.png" />
+                <p>局属单位网站集群</p>
+            </li>
         </ul>
-        <div class="but-box">
+        <div class="but-box" style="display: none;">
             <button type="button">上一页</button>
             <button type="button">下一页</button>
         </div>

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

@@ -1,60 +1,61 @@
-.trends {
-    padding: 0 0.2rem;
-}
-
-.trends img {
-    width: 3.125vw;
-    height: 2.5781vw;
-}
-
-.trends ul {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
-}
-
-.trends ul li {
-    margin: 0.06rem 0.02rem;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    max-width: 3.7rem;
-    min-width: 0.8rem;
-    display: flex;
-    font-family: Source Han Sans SC;
-    color: #B5C0E8;
-}
-
-.trends ul li .explain {
-    margin-left: 0.2rem;
-    position: relative;
-}
-
-.trends ul li .explain h3 {
-    width: 2.3rem;
-    font-weight: bold;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-}
-
-.trends ul li .explain p {
-    font-weight: 400;
-    opacity: 0.5;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
-    width: 2.3rem;
-}
-
-.trends ul li .explain .timer {
-    font-size: 0.2rem;
-    font-weight: 400;
-    color: #B5C0E8;
-    line-height: 0.4rem;
-    opacity: 0.5;
-}
-
-.trends:hover {
-    animation-play-state: paused;
+.trends {
+    padding: 0 0.2rem;
+}
+
+.trends img {
+    width: 3.125vw;
+    height: 2.5781vw;
+}
+
+.trends ul {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+}
+
+.trends ul li {
+    width: 48%;
+    margin: 0.06rem 0.02rem;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    max-width: 3.7rem;
+    min-width: 0.8rem;
+    display: flex;
+    font-family: Source Han Sans SC;
+    color: #B5C0E8;
+}
+
+.trends ul li .explain {
+    margin-left: 0.2rem;
+    position: relative;
+}
+
+.trends ul li .explain h3 {
+    width: 2.3rem;
+    font-weight: bold;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.trends ul li .explain p {
+    font-weight: 400;
+    opacity: 0.5;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    width: 2.3rem;
+}
+
+.trends ul li .explain .timer {
+    font-size: 0.2rem;
+    font-weight: 400;
+    color: #B5C0E8;
+    line-height: 0.4rem;
+    opacity: 0.5;
+}
+
+.trends:hover {
+    animation-play-state: paused;
 }

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

@@ -1,102 +1,102 @@
-const test1 = (function() {
-    // 最新动态数据
-    const officialAccount = {
-        init() {
-            this.getData();
-        },
-
-        getData() {
-            const This = this;
-            $.ajax({
-                /** url,data参数,
-                 * type请求类型,响应体结果,超时时间
-                 * 成功的回调,失败回调 */
-                url: ZQURL + '/getNews_Top10',
-                data: {
-                    dateType: 0
-                },
-                type: 'GET',
-                dataType: 'JSON',
-                success: function(data) {
-                    console.log('最新动态数据', data);
-                    if (data.success != 'true') return
-                    const {
-                        obj: dataArr
-                    } = data;
-                    if (dataArr.length == 0) {
-                        return
-                    }
-                    This.publicNoData(dataArr)
-                    console.log(dataArr, '最新动态数据');
-                },
-                error: function() {
-                    console.log('站群最新动态接口超时了');
-                },
-            })
-        },
-
-        publicNoData(dataArr) {
-            let html = '';
-            let newDataArr = dataArr.filter((item) => {
-                return item.titlepic != '' && item.summary != ''
-            })
-            newDataArr.forEach(d => {
-                html += ` 
-            <li>
-              <div class="img">
-                  <img src="${imgURL}${d.titlepic}" alt="">
-              </div>
-              <div class="explain">
-                  <h3>${d.title}</h3>
-                  <p>${d.summary}</p>
-                  <div class="timer">${d.releaseDate}</div>
-              </div>
-            </li>
-          `
-            });
-            $('.test1 .trends ul').html('').append(html);
-        }
-    }
-
-    function test1(id, domTitle) {
-        if (domTitle) {
-            $('.test1 .title h2').text(domTitle)
-        }
-        $('.test1 .box').css('z-index', ++zIndex)
-        $('.test1 .box').attr('data-id', id)
-            // move('.test1 .box')
-        move3('.test1 .test-box')
-        move2('.test1 .containerTool')
-        let timer = null;
-
-        $('.test1 .box .close').click(function() {
-            $('.test1 .box').remove();
-            $('.test1 .containerTool').css('display', 'none');
-            $('.test1 .setWidth').val('')
-            $('.test1 .setHeight').val('');
-
-            moduleIdRemove.push(id)
-        })
-
-        eventClick('.test1');
-
-        window.addEventListener('resize', function() {
-            if (timer) {
-                clearTimeout(timer);
-                timer = null;
-            }
-            timer = setTimeout(() => {
-                move3('.test1 .test-box')
-            }, 500);
-        });
-
-
-
-        officialAccount.init()
-
-    };
-
-
-
-    return test1;
+const test1 = (function() {
+    // 最新动态数据
+    const officialAccount = {
+        init() {
+            this.getData();
+        },
+
+        getData() {
+            const This = this;
+            $.ajax({
+                /** url,data参数,
+                 * type请求类型,响应体结果,超时时间
+                 * 成功的回调,失败回调 */
+                url: ZQURL + '/getNews_Top10',
+                data: {
+                    dateType: 0
+                },
+                type: 'GET',
+                dataType: 'JSON',
+                success: function(data) {
+                    console.log('最新动态数据', data);
+                    if (data.success != 'true') return
+                    const {
+                        obj: dataArr
+                    } = data;
+                    if (dataArr.length == 0) {
+                        return
+                    }
+                    This.publicNoData(dataArr)
+                    console.log(dataArr, '最新动态数据');
+                },
+                error: function() {
+                    console.log('站群最新动态接口超时了');
+                },
+            })
+        },
+
+        publicNoData(dataArr) {
+            let html = '';
+            let newDataArr = dataArr.filter((item) => {
+                return item.titlepic != '' && item.summary != ''
+            })
+            newDataArr.forEach(d => {
+                html += ` 
+            <li>
+              <div class="img">
+                  <img src="${imgURL}${d.titlepic}" alt="">
+              </div>
+              <div class="explain">
+                  <h3>${d.title}</h3>
+                  <p>${d.summary}</p>
+                  <div class="timer">${d.releaseDate}</div>
+              </div>
+            </li>
+          `
+            });
+            $('.test1 .trends ul').html('').append(html);
+        }
+    }
+
+    function test1(id, domTitle) {
+        if (domTitle) {
+            $('.test1 .title h2').text(domTitle)
+        }
+        $('.test1 .box').css('z-index', ++zIndex)
+        $('.test1 .box').attr('data-id', id)
+            // move('.test1 .box')
+        move3('.test1 .test-box')
+        move2('.test1 .containerTool')
+        let timer = null;
+
+        $('.test1 .box .close').click(function() {
+            $('.test1 .box').remove();
+            $('.test1 .containerTool').css('display', 'none');
+            $('.test1 .setWidth').val('')
+            $('.test1 .setHeight').val('');
+
+            moduleIdRemove.push(id)
+        })
+
+        eventClick('.test1');
+
+        window.addEventListener('resize', function() {
+            if (timer) {
+                clearTimeout(timer);
+                timer = null;
+            }
+            timer = setTimeout(() => {
+                move3('.test1 .test-box')
+            }, 500);
+        });
+
+
+
+        officialAccount.init()
+
+    };
+
+
+
+    return test1;
 })();

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

@@ -1,7 +1,16 @@
-.box10 .inner a {
-  display: inline-block;
-  margin: 0.12rem;
-}
-.box10 .inner a img {
-  width: 1.7rem;
-}
+#demo a {
+  margin: 0.15rem;
+  width: 28%;
+  float: right;
+  margin-top: 5%;
+}
+#demo {
+  overflow: hidden;
+  width: 100%;
+  height: 100%;
+  /* margin-top: 5%; */
+}
+#demo img {
+  display: block;
+  /* width: 1.75rem; */
+}

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

@@ -1,50 +1,94 @@
-<div class="box10 box" data-name='test10'>
-    <div class="toolBox">
-        <span class="fit"></span>
-        <span class="close"></span>
-    </div>
-    <div class="tool">
-        <div class="title bgTitle2">
-            <h2>行业单位入口</h2>
-        </div>
-    </div>
-    <div class="test-box">
-        <div class="content">
-            <!-- 行业单位入口 -->
-            <div class="inner">
-                <a href="javascript:void(0)" class="active"><img src="../images/stationGroup/tc2.png" alt=""></a>
-                <a href="javascript:void(0)" class="active"><img src="../images/stationGroup/tc3.png" alt=""></a>
-                <a href="javascript:void(0)" class="active"><img src="../images/stationGroup/tc7.png" alt=""></a>
-                <a href="javascript:void(0)" class="active"><img src="../images/stationGroup/tc8.png" alt=""></a>
-                <a href="javascript:void(0)" class="active"><img src="../images/stationGroup/tc9.png" alt=""></a>
-                <a href="javascript:void(0)" class="active"><img src="../images/stationGroup/tc10.png" alt=""></a>
-                <a href="javascript:void(0)" class="active"><img src="../images/stationGroup/tc11.png" alt=""></a>
-                <a href="javascript:void(0)" class="active"><img src="../images/stationGroup/tc12.png" alt=""></a>
-                <a href="javascript:void(0)" class="active"><img src="../images/stationGroup/tc13.png" alt=""></a>
-            </div>
-        </div>
-    </div>
-    <div class="panel-footer"></div>
-</div>
-
-
-<!-- 工具弹框 -->
-<div class="tools" style="display: none;">
-
-    <div class="containerTool test10Toll">
-        <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="box10 box" data-name="test10">
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="tool">
+    <div class="title bgTitle2">
+      <h2>行业单位入口</h2>
+    </div>
+  </div>
+  <div class="test-box">
+    <div class="content" id="content1">
+      <div id="demo">
+        <div id="demo1" class="inner">
+          <a href="javascript:void(0)" class="active"
+            ><img src="../images/stationGroup/tc2.png" alt=""
+          /></a>
+
+          <a href="javascript:void(0)" class="active"
+            ><img src="../images/stationGroup/tc3.png" alt=""
+          /></a>
+          <a href="javascript:void(0)" class="active"
+            ><img src="../images/stationGroup/tc7.png" alt=""
+          /></a>
+          <a href="javascript:void(0)" class="active"
+            ><img src="../images/stationGroup/tc8.png" alt=""
+          /></a>
+          <a href="javascript:void(0)" class="active"
+            ><img src="../images/stationGroup/tc9.png" alt=""
+          /></a>
+          <a href="javascript:void(0)" class="active"
+            ><img src="../images/stationGroup/tc10.png" alt=""
+          /></a>
+          <a href="javascript:void(0)" class="active"
+            ><img src="../images/stationGroup/tc11.png" alt=""
+          /></a>
+          <a href="javascript:void(0)" class="active"
+            ><img src="../images/stationGroup/tc12.png" alt=""
+          /></a>
+          <a href="javascript:void(0)" class="active"
+            ><img src="../images/stationGroup/tc13.png" alt=""
+          /></a>
+        </div>
+        <div id="demo2" class="inner"></div>
+      </div>
+      <!-- 行业单位入口 -->
+    </div>
+  </div>
+  <div class="panel-footer"></div>
+</div>
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none">
+  <div class="containerTool test10Toll">
+    <ul>
+      <li>
+        <span>宽度:</span>
+        <input class="setWidth" type="text" />
+        <span id="validateAge" class="regValidate"></span>
+      </li>
+      <li>
+        <span>高度:</span>
+        <input class="setHeight" type="text" />
+      </li>
+    </ul>
+    <!-- 确定 -->
+    <button class="fixBtn toolBtn">确定</button>
+    <button class="offBtn toolBtn">取消</button>
+  </div>
+</div>
+<script>
+  var speed = 70; //数字越大速度越慢
+  var tab = document.getElementById("demo");
+  var tab1 = document.getElementById("demo1");
+  var tab2 = document.getElementById("demo2");
+  tab2.innerHTML = tab1.innerHTML; //克隆demo1为demo2
+  function Marquee() {
+    // if (tab2.offsetTop - tab.scrollTop <= 0)
+    //   //当滚动至demo1与demo2交界时
+    //   tab.scrollTop += tab1.offsetHeight; //demo跳到最顶端
+    // else {
+
+    // }
+    tab.scrollTop++;
+  }
+
+  var MyMar = setInterval(Marquee, speed);
+  tab.onmouseover = function () {
+    clearInterval(MyMar);
+  }; //鼠标移上时清除定时器达到滚动停止的目的
+  tab.onmouseout = function () {
+    MyMar = setInterval(Marquee, speed);
+  }; //鼠标移开时重设定时器
+</script>

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

@@ -1,94 +1,118 @@
-@keyframes news {
-  0% {
-    transform: translateY(0%);
-  }
-  100% {
-    transform: translateY(-50%);
-  }
-}
-.visits {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-}
-.visits .vis-top {
-  display: flex;
-  height: 40%;
-}
-.visits .vis-top .left {
-  display: flex;
-  flex: 2;
-  background: url(../../images/2bg.png) center;
-  background-repeat: no-repeat;
-  background-size: 100%;
-  position: relative;
-}
-.visits .vis-top .left .vis h4 {
-  border-radius: 0.26rem;
-  color: aqua;
-  padding: 0.2rem;
-}
-.visits .vis-top .left .vis p {
-  width: 1rem;
-  height: 1rem;
-  color: #fff;
-  position: absolute;
-  left: 50%;
-  top: 50%;
-  transform: translate(-50%, -50%);
-}
-.visits .vis-top .left .vis h4 {
-  position: absolute;
-  top: 0%;
-}
-.visits .vis-top .left .one h4 {
-  left: 31%;
-  top: -18%;
-}
-.visits .vis-top .left .one p {
-  left: 62%;
-  top: 80%;
-}
-.visits .vis-top .left .two h4 {
-  left: -4%;
-}
-.visits .vis-top .left .two p {
-  left: 32%;
-  top: -14%;
-  transform: translate(-50%, 80%);
-}
-.visits .vis-top .left .three h4 {
-  left: 68%;
-}
-.visits .vis-top .left .three p {
-  left: 93%;
-  top: 103%;
-}
-.visits .vis-top .right {
-  flex: 3;
-  overflow-y: auto;
-  background-color: #0e61b263;
-}
-.visits .vis-top .right .table {
-  width: 100%;
-  color: #fff;
-}
-.visits .vis-top .right .table thead {
-  position: relative;
-  z-index: 1000;
-  background-color: #266adc52;
-}
-.visits .vis-top .right .table tr {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  text-align: center;
-  margin: 4px 0;
-}
-.visits .vis-top .right .table tr th,
-.visits .vis-top .right .table tr td {
-  flex: 1;
-}
-.visits .vis-bottom {
-  height: 60%;
-}
+@keyframes news {
+  0% {
+    transform: translateY(0%);
+  }
+  100% {
+    transform: translateY(-50%);
+  }
+}
+@font-face {
+  font-family: "RUIZIZHENYANTIMIANFEISHANGYONG-2";
+  src: url("../../font/RUIZIZHENYANTIMIANFEISHANGYONG-2.TTF");
+}
+.visits {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+.visits .vis-top {
+  display: flex;
+  height: 40%;
+}
+.visits .vis-top .left {
+  display: flex;
+  flex: 2;
+  background: url(../../images/2bg.png) center;
+  background-repeat: no-repeat;
+  background-size: 100%;
+  position: relative;
+}
+.visits .vis-top .left .vis h4 {
+  border-radius: 0.26rem;
+  color: #fff;
+  font-family: "RUIZIZHENYANTIMIANFEISHANGYONG-2";
+  padding: 0.2rem;
+  font-style: italic;
+}
+.visits .vis-top .left .vis p {
+  width: 1rem;
+  height: 1rem;
+  color: #fff;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  font-family: "RUIZIZHENYANTIMIANFEISHANGYONG-2";
+  font-style: italic;
+}
+.visits .vis-top .left .vis h4 {
+  position: absolute;
+  top: 0%;
+}
+.visits .vis-top .left .one h4 {
+  left: 33%;
+  top: -18%;
+  font-size: 0.15rem !important;
+}
+.visits .vis-top .left .one p {
+  left: 62%;
+  top: 80%;
+}
+.visits .vis-top .left .two h4 {
+  /* left: -4%; */
+  font-size: 0.15rem !important;
+}
+.visits .vis-top .left .two p {
+  left: 32%;
+  top: -14%;
+  transform: translate(-50%, 80%);
+}
+.visits .vis-top .left .three h4 {
+  left: 64%;
+  top: 21%;
+  font-size: 0.15rem !important;
+}
+.visits .vis-top .left .three p {
+  left: 93%;
+  top: 103%;
+}
+.visits .vis-top .right {
+  flex: 3;
+  overflow-y: auto;
+  background-color: #0e61b263;
+}
+.visits .vis-top .right .table {
+  width: 100%;
+  color: #fff;
+}
+.visits .vis-top .right .table thead {
+  position: relative;
+  z-index: 1000;
+  /* background-color: #266adc52; */
+}
+.visits .vis-top .right .table tr {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  margin: 4px 0;
+}
+.visits .vis-top .right .table tr th,
+.visits .vis-top .right .table tr td {
+  flex: 1;
+}
+.visits .vis-bottom {
+  height: 60%;
+}
+.text-title-one {
+  width: 10%;
+  height: 20%;
+  /* background: #ff8019; */
+  background: rgba(200, 154, 54, 0.5);
+}
+.vis-img {
+  position: absolute;
+  /* left: 354%; */
+  left: 34%;
+  width: 5% !important;
+}

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

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

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

@@ -1,341 +1,341 @@
-const test2 = (function() {
-
-    const trafficRanking = { // 网站访问量排行
-        init() {
-            this.getData();
-        },
-
-        getData() {
-            const This = this;
-            $.ajax({
-                /** url,data参数,
-                 * type请求类型,响应体结果,超时时间
-                 * 成功的回调,失败回调 */
-                url: ZQURL + '/getVisitRank',
-                data: {
-                    dateType: 0
-                },
-                type: 'POST',
-                dataType: 'JSON',
-                contentType: 'application/x-www-form-urlencoded',
-                success: function(data) {
-                    console.log('网站访问量排行', data);
-                    if (data.success != 'true') return
-                    const {
-                        obj: dataArr
-                    } = data;
-                    if (dataArr.length == 0) {
-                      $('.test2 .box2 .content').html('暂无数据')
-                      $('.test2 .box2 .content').css('text-align','center')
-                      $('.test2 .box2 .content').css('justify-content','center')
-                      $('.test2 .box2 .content').css('fontSize','0.2rem')
-                        return
-                    }
-                    This.createRanking(dataArr);
-                },
-                error: function() {
-                    console.log('站群网站访问量排行超时了');
-                },
-            });
-        },
-
-        createRanking(dataArr) {
-          let names = [];
-          let values = [];
-          $('.test2 .box2 .one h4').html(dataArr[0].name);
-          $('.test2 .box2 .two h4').html(dataArr[1].name);
-          $('.test2 .box2 .three h4').html(dataArr[2].name);
-           const html = dataArr.map((item,index) => {
-             names.push(item.name);
-             values.push(+item.cnts);
-              return `
-              <tr>
-                <td>${index+1}</td>
-                <td>${item.name}</td>
-              </tr>
-              `
-            }).join('')
-            $('.test2 .box2 tbody').html(html)
-            const dom = document.querySelector('.test2 .floor-dist');
-            const testDom = document.querySelector('.test2 .box');
-            setCharts(dom, testDom,names,values);
-        }
-    }
-
-    function test2(id, domTitle) {
-        if (domTitle) {
-            $('.test2 .title h2').text(domTitle)
-        }
-
-        $('.test2 .box').css('z-index', ++zIndex)
-        $('.test2 .box').attr('data-id', id)
-            // move('.test2 .box')
-        move3('.test2 .test-box')
-        move2('.test2 .containerTool')
-
-
-        $('.test2 .close').click(function() {
-            $('.test2 .box').remove();
-            $('.test2 .containerTool').css('display', 'none');
-            $('.test2 .setWidth').val('')
-            $('.test2 .setHeight').val('')
-            moduleIdRemove.push(id)
-            console.log(id);
-        })
-        eventClick('.test2');
-
-        trafficRanking.init();
-
-        if ($('.test2 .box .content .noData').length !== 0) {
-            return
-        }
-    }
-
-
-    function setCharts(echartDom, testDom,names,values) {
-        var myChart = echarts.init(echartDom);
-let timer = null;
-        const offsetX = 20;
-        const offsetY = 10;
-        // 绘制左侧面
-        const CubeLeft = echarts.graphic.extendShape({
-            shape: {
-                x: 0,
-                y: 0,
-            },
-            buildPath: function(ctx, shape) {
-                // 会canvas的应该都能看得懂,shape是从custom传入的
-                const xAxisPoint = shape.xAxisPoint;
-                // console.log(shape);
-                const c0 = [shape.x, shape.y];
-                const c1 = [shape.x - offsetX, shape.y - offsetY];
-                const c2 = [xAxisPoint[0] - offsetX, xAxisPoint[1] - offsetY];
-                const c3 = [xAxisPoint[0], xAxisPoint[1]];
-                ctx.moveTo(c0[0], c0[1]).lineTo(c1[0], c1[1]).lineTo(c2[0], c2[1]).lineTo(c3[0], c3[1]).closePath();
-            },
-        });
-        // 绘制右侧面
-        const CubeRight = echarts.graphic.extendShape({
-            shape: {
-                x: 0,
-                y: 0,
-            },
-            buildPath: function(ctx, shape) {
-                const xAxisPoint = shape.xAxisPoint;
-                const c1 = [shape.x, shape.y];
-                const c2 = [xAxisPoint[0], xAxisPoint[1]];
-                const c3 = [xAxisPoint[0] + offsetX, xAxisPoint[1] - offsetY];
-                const c4 = [shape.x + offsetX, shape.y - offsetY];
-                ctx.moveTo(c1[0], c1[1]).lineTo(c2[0], c2[1]).lineTo(c3[0], c3[1]).lineTo(c4[0], c4[1]).closePath();
-            },
-        });
-        // 绘制顶面
-        const CubeTop = echarts.graphic.extendShape({
-            shape: {
-                x: 0,
-                y: 0,
-            },
-            buildPath: function(ctx, shape) {
-                const c1 = [shape.x, shape.y];
-                const c2 = [shape.x + offsetX, shape.y - offsetY]; //右点
-                const c3 = [shape.x, shape.y - offsetX];
-                const c4 = [shape.x - offsetX, shape.y - offsetY];
-                ctx.moveTo(c1[0], c1[1]).lineTo(c2[0], c2[1]).lineTo(c3[0], c3[1]).lineTo(c4[0], c4[1]).closePath();
-            },
-        });
-        // 注册三个面图形
-        echarts.graphic.registerShape('CubeLeft', CubeLeft);
-        echarts.graphic.registerShape('CubeRight', CubeRight);
-        echarts.graphic.registerShape('CubeTop', CubeTop);
-
-        const VALUE = values;
-
-        option = {
-            // backgroundColor: '#012366',
-            tooltip: {
-                trigger: 'axis',
-                axisPointer: {
-                    type: 'shadow',
-                },
-                formatter: function(params, ticket, callback) {
-                    const item = params[1];
-                    return item.name + ' : ' + item.value;
-                },
-            },
-            grid: {
-                left: '10%',
-                right: '10%',
-                top: '15%',
-                bottom: '10%',
-                containLabel: true,
-            },
-            xAxis: {
-                type: 'category',
-                data: names,
-                axisLine: {
-                    show: true,
-                    lineStyle: {
-                        width: 22,
-                        color: '#2B7BD6',
-                    },
-                },
-                axisTick: {
-                    show: false,
-                },
-                axisLabel: {
-                    fontSize: 114,
-                },
-            },
-            yAxis: {
-                type: 'value',
-                axisLine: {
-                    show: true,
-                    lineStyle: {
-                        width: 22,
-                        color: '#2B7BD6',
-                    },
-                },
-                splitLine: {
-                    show: true,
-                    lineStyle: {
-                        color: '#153D7D',
-                    },
-                },
-                axisTick: {
-                    show: false,
-                },
-                axisLabel: {
-                    fontSize: 114,
-                },
-                // boundaryGap: ['20%', '20%'],
-            },
-            series: [{
-                    type: 'custom',
-                    renderItem: (params, api) => {
-                        const location = api.coord([api.value(0), api.value(1)]);
-                        return {
-                            type: 'group',
-                            children: [{
-                                    type: 'CubeLeft',
-                                    shape: {
-                                        api,
-                                        xValue: api.value(0),
-                                        yValue: api.value(1),
-                                        x: location[0],
-                                        y: location[1],
-                                        xAxisPoint: api.coord([api.value(0), 0]),
-                                    },
-                                    style: {
-                                        fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-                                                offset: 0,
-                                                color: '#33BCEB',
-                                            },
-                                            {
-                                                offset: 1,
-                                                color: '#337CEB',
-                                            },
-                                        ]),
-                                    },
-                                },
-                                {
-                                    type: 'CubeRight',
-                                    shape: {
-                                        api,
-                                        xValue: api.value(0),
-                                        yValue: api.value(1),
-                                        x: location[0],
-                                        y: location[1],
-                                        xAxisPoint: api.coord([api.value(0), 0]),
-                                    },
-                                    style: {
-                                        fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-                                                offset: 0,
-                                                color: '#28A2CE',
-                                            },
-                                            {
-                                                offset: 1,
-                                                color: '#50c9dfc4',
-                                            },
-                                        ]),
-                                    },
-                                },
-                                {
-                                    type: 'CubeTop',
-                                    shape: {
-                                        api,
-                                        xValue: api.value(0),
-                                        yValue: api.value(1),
-                                        x: location[0],
-                                        y: location[1],
-                                        xAxisPoint: api.coord([api.value(0), 0]),
-                                    },
-                                    style: {
-                                        fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
-                                                offset: 0,
-                                                color: '#43C4F1',
-                                            },
-                                            {
-                                                offset: 1,
-                                                color: '#28A2CE',
-                                            },
-                                        ]),
-                                    },
-                                },
-                            ],
-                        };
-                    },
-                    data: VALUE,
-                },
-                {
-                    type: 'bar',
-                    label: {
-                        normal: {
-                            show: true,
-                            position: 'top',
-                            formatter: (e) => {
-                                return e.value + '次';
-                                /*console.log(e)
-                                switch (e.name) {
-                                    case '1001':
-                                        return e.value;
-                                    case '1002':
-                                        return VALUE[1];
-                                    case '1003':
-                                        return VALUE[2];
-                                }*/
-                            },
-                            fontSize: 116,
-                            color: '#43C4F1',
-                            offset: [0, -25],
-                        },
-                    },
-                    barWidth: 127,
-                    itemStyle: {
-                        color: 'transparent',
-                    },
-                    tooltip: {},
-                    data: VALUE,
-                },
-            ],
-        };
-        myChart.setOption(option);
-        window.addEventListener('resize', function() {
-          if (timer) {
-              clearTimeout(timer);
-              timer = null;
-          }
-          timer = setTimeout(() => {
-              move3('.test2 .test-box')
-
-              myChart.resize();
-          }, 500);
-      })
-        if (!testDom) {
-            testDom = document.querySelectorAll('.test8 .box');
-        }
-        obsDom(testDom, myChart)
-    }
-
-
-    return test2
+const test2 = (function() {
+
+    const trafficRanking = { // 网站访问量排行
+        init() {
+            this.getData();
+        },
+
+        getData() {
+            const This = this;
+            $.ajax({
+                /** url,data参数,
+                 * type请求类型,响应体结果,超时时间
+                 * 成功的回调,失败回调 */
+                url: ZQURL + '/getVisitRank',
+                data: {
+                    dateType: 0
+                },
+                type: 'POST',
+                dataType: 'JSON',
+                contentType: 'application/x-www-form-urlencoded',
+                success: function(data) {
+                    console.log('网站访问量排行', data);
+                    if (data.success != 'true') return
+                    const {
+                        obj: dataArr
+                    } = data;
+                    if (dataArr.length == 0) {
+                      $('.test2 .box2 .content').html('暂无数据')
+                      $('.test2 .box2 .content').css('text-align','center')
+                      $('.test2 .box2 .content').css('justify-content','center')
+                      $('.test2 .box2 .content').css('fontSize','0.2rem')
+                        return
+                    }
+                    This.createRanking(dataArr);
+                },
+                error: function() {
+                    console.log('站群网站访问量排行超时了');
+                },
+            });
+        },
+
+        createRanking(dataArr) {
+          let names = [];
+          let values = [];
+          $('.test2 .box2 .one h4').html(dataArr[0].name);
+          $('.test2 .box2 .two h4').html(dataArr[1].name);
+          $('.test2 .box2 .three h4').html(dataArr[2].name);
+           const html = dataArr.map((item,index) => {
+             names.push(item.name);
+             values.push(+item.cnts);
+              return `
+              <tr>
+                <td>${index+1}</td>
+                <td>${item.name}</td>
+              </tr>
+              `
+            }).join('')
+            $('.test2 .box2 tbody').html(html)
+            const dom = document.querySelector('.test2 .floor-dist');
+            const testDom = document.querySelector('.test2 .box');
+            setCharts(dom, testDom,names,values);
+        }
+    }
+
+    function test2(id, domTitle) {
+        if (domTitle) {
+            $('.test2 .title h2').text(domTitle)
+        }
+
+        $('.test2 .box').css('z-index', ++zIndex)
+        $('.test2 .box').attr('data-id', id)
+            // move('.test2 .box')
+        move3('.test2 .test-box')
+        move2('.test2 .containerTool')
+
+
+        $('.test2 .close').click(function() {
+            $('.test2 .box').remove();
+            $('.test2 .containerTool').css('display', 'none');
+            $('.test2 .setWidth').val('')
+            $('.test2 .setHeight').val('')
+            moduleIdRemove.push(id)
+            console.log(id);
+        })
+        eventClick('.test2');
+
+        trafficRanking.init();
+
+        if ($('.test2 .box .content .noData').length !== 0) {
+            return
+        }
+    }
+
+
+    function setCharts(echartDom, testDom,names,values) {
+        var myChart = echarts.init(echartDom);
+let timer = null;
+        const offsetX = 20;
+        const offsetY = 10;
+        // 绘制左侧面
+        const CubeLeft = echarts.graphic.extendShape({
+            shape: {
+                x: 0,
+                y: 0,
+            },
+            buildPath: function(ctx, shape) {
+                // 会canvas的应该都能看得懂,shape是从custom传入的
+                const xAxisPoint = shape.xAxisPoint;
+                // console.log(shape);
+                const c0 = [shape.x, shape.y];
+                const c1 = [shape.x - offsetX, shape.y - offsetY];
+                const c2 = [xAxisPoint[0] - offsetX, xAxisPoint[1] - offsetY];
+                const c3 = [xAxisPoint[0], xAxisPoint[1]];
+                ctx.moveTo(c0[0], c0[1]).lineTo(c1[0], c1[1]).lineTo(c2[0], c2[1]).lineTo(c3[0], c3[1]).closePath();
+            },
+        });
+        // 绘制右侧面
+        const CubeRight = echarts.graphic.extendShape({
+            shape: {
+                x: 0,
+                y: 0,
+            },
+            buildPath: function(ctx, shape) {
+                const xAxisPoint = shape.xAxisPoint;
+                const c1 = [shape.x, shape.y];
+                const c2 = [xAxisPoint[0], xAxisPoint[1]];
+                const c3 = [xAxisPoint[0] + offsetX, xAxisPoint[1] - offsetY];
+                const c4 = [shape.x + offsetX, shape.y - offsetY];
+                ctx.moveTo(c1[0], c1[1]).lineTo(c2[0], c2[1]).lineTo(c3[0], c3[1]).lineTo(c4[0], c4[1]).closePath();
+            },
+        });
+        // 绘制顶面
+        const CubeTop = echarts.graphic.extendShape({
+            shape: {
+                x: 0,
+                y: 0,
+            },
+            buildPath: function(ctx, shape) {
+                const c1 = [shape.x, shape.y];
+                const c2 = [shape.x + offsetX, shape.y - offsetY]; //右点
+                const c3 = [shape.x, shape.y - offsetX];
+                const c4 = [shape.x - offsetX, shape.y - offsetY];
+                ctx.moveTo(c1[0], c1[1]).lineTo(c2[0], c2[1]).lineTo(c3[0], c3[1]).lineTo(c4[0], c4[1]).closePath();
+            },
+        });
+        // 注册三个面图形
+        echarts.graphic.registerShape('CubeLeft', CubeLeft);
+        echarts.graphic.registerShape('CubeRight', CubeRight);
+        echarts.graphic.registerShape('CubeTop', CubeTop);
+
+        const VALUE = values;
+
+        option = {
+            // backgroundColor: '#012366',
+            tooltip: {
+                trigger: 'axis',
+                axisPointer: {
+                    type: 'shadow',
+                },
+                formatter: function(params, ticket, callback) {
+                    const item = params[1];
+                    return item.name + ' : ' + item.value;
+                },
+            },
+            grid: {
+                left: '10%',
+                right: '10%',
+                top: '15%',
+                bottom: '10%',
+                containLabel: true,
+            },
+            xAxis: {
+                type: 'category',
+                data: names,
+                axisLine: {
+                    show: true,
+                    lineStyle: {
+                        width: 52,
+                        color: '#2B7BD6',
+                    },
+                },
+                axisTick: {
+                    show: false,
+                },
+                axisLabel: {
+                    fontSize: 114,
+                },
+            },
+            yAxis: {
+                type: 'value',
+                axisLine: {
+                    show: true,
+                    lineStyle: {
+                        width: 52,
+                        color: '#2B7BD6',
+                    },
+                },
+                splitLine: {
+                    show: true,
+                    lineStyle: {
+                        color: '#153D7D',
+                    },
+                },
+                axisTick: {
+                    show: false,
+                },
+                axisLabel: {
+                    fontSize: 114,
+                },
+                // boundaryGap: ['20%', '20%'],
+            },
+            series: [{
+                    type: 'custom',
+                    renderItem: (params, api) => {
+                        const location = api.coord([api.value(0), api.value(1)]);
+                        return {
+                            type: 'group',
+                            children: [{
+                                    type: 'CubeLeft',
+                                    shape: {
+                                        api,
+                                        xValue: api.value(0),
+                                        yValue: api.value(1),
+                                        x: location[0],
+                                        y: location[1],
+                                        xAxisPoint: api.coord([api.value(0), 0]),
+                                    },
+                                    style: {
+                                        fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+                                                offset: 0,
+                                                color: '#33BCEB',
+                                            },
+                                            {
+                                                offset: 1,
+                                                color: '#337CEB',
+                                            },
+                                        ]),
+                                    },
+                                },
+                                {
+                                    type: 'CubeRight',
+                                    shape: {
+                                        api,
+                                        xValue: api.value(0),
+                                        yValue: api.value(1),
+                                        x: location[0],
+                                        y: location[1],
+                                        xAxisPoint: api.coord([api.value(0), 0]),
+                                    },
+                                    style: {
+                                        fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+                                                offset: 0,
+                                                color: '#28A2CE',
+                                            },
+                                            {
+                                                offset: 1,
+                                                color: '#50c9dfc4',
+                                            },
+                                        ]),
+                                    },
+                                },
+                                {
+                                    type: 'CubeTop',
+                                    shape: {
+                                        api,
+                                        xValue: api.value(0),
+                                        yValue: api.value(1),
+                                        x: location[0],
+                                        y: location[1],
+                                        xAxisPoint: api.coord([api.value(0), 0]),
+                                    },
+                                    style: {
+                                        fill: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+                                                offset: 0,
+                                                color: '#43C4F1',
+                                            },
+                                            {
+                                                offset: 1,
+                                                color: '#28A2CE',
+                                            },
+                                        ]),
+                                    },
+                                },
+                            ],
+                        };
+                    },
+                    data: VALUE,
+                },
+                {
+                    type: 'bar',
+                    label: {
+                        normal: {
+                            show: true,
+                            position: 'top',
+                            formatter: (e) => {
+                                return e.value + '次';
+                                /*console.log(e)
+                                switch (e.name) {
+                                    case '1001':
+                                        return e.value;
+                                    case '1002':
+                                        return VALUE[1];
+                                    case '1003':
+                                        return VALUE[2];
+                                }*/
+                            },
+                            fontSize: 116,
+                            color: '#43C4F1',
+                            offset: [0, -25],
+                        },
+                    },
+                    barWidth: 127,
+                    itemStyle: {
+                        color: 'transparent',
+                    },
+                    tooltip: {},
+                    data: VALUE,
+                },
+            ],
+        };
+        myChart.setOption(option);
+        window.addEventListener('resize', function() {
+          if (timer) {
+              clearTimeout(timer);
+              timer = null;
+          }
+          timer = setTimeout(() => {
+              move3('.test2 .test-box')
+
+              myChart.resize();
+          }, 500);
+      })
+        if (!testDom) {
+            testDom = document.querySelectorAll('.test8 .box');
+        }
+        obsDom(testDom, myChart)
+    }
+
+
+    return test2
 })();

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

@@ -37,7 +37,7 @@
 }
 .box28 .left img,
 .box28 .right img {
-  width: 13%;
+  width: 21%;
 }
 .box28 span {
   font-size: 0.15rem !important;
@@ -76,14 +76,17 @@
   display: flex;
   align-items: center;
   flex-direction: column;
+  width: 80%;
 }
 .box28 .right ul li {
-  margin: 0.05rem 0;
+  width: 100%;
+  margin-bottom: 0.05rem;
 }
 .box28 .desc {
   display: flex;
   align-items: center;
-  padding: 0.1rem;
   background: #4784a06e;
   background: url(../images/networkSecurity/zu15.png) no-repeat;
+  background:linear-gradient(45deg,#15aed5,transparent)
+
 }

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

@@ -1,43 +1,52 @@
-.box3 .test-box {
-  padding-top: 0.2rem;
-}
-.box3 .content {
-  margin: 0;
-}
-.overall {
-  color: #5C96FF;
-  padding: 0.16rem;
-}
-.overall ul {
-  width: 100%;
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-between;
-}
-.overall ul li {
-  margin: 0.2rem;
-}
-.overall ul li > div {
-  display: flex;
-}
-.overall ul li .info {
-  margin-right: 0.24rem;
-}
-.overall ul li p {
-  font-size: 0.22rem;
-  font-family: Source Han Sans SC;
-  font-weight: 400;
-  color: #677EA1;
-}
-.overall ul li .num {
-  font-size: 0.25rem !important;
-  font-family: PangMenZhengDao;
-  font-weight: 400;
-}
-.overall ul li .details p {
-  color: #5C96FF;
-}
-.title h2 {
-  position: relative;
-  top: -0.1rem;
-}
+.box3 .test-box {
+  padding-top: 0.2rem;
+}
+.box3 .content {
+  margin: 0;
+}
+.overall {
+  color: #5c96ff;
+  padding: 0.16rem;
+}
+.overall ul {
+  width: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+}
+.overall ul li {
+  margin: 0.2rem;
+}
+.overall ul li > div {
+  display: flex;
+}
+.overall ul li .info {
+  margin-right: 0.24rem;
+}
+.overall ul li p {
+  font-size: 0.22rem;
+  font-family: Source Han Sans SC;
+  font-weight: 400;
+  color: #677ea1;
+}
+.overall ul li .num {
+  font-size: 0.25rem !important;
+  font-family: "LESLIE";
+  font-weight: 400;
+}
+.overall ul li .details p {
+  color: #5c96ff;
+}
+.title h2 {
+  position: relative;
+  top: -0.1rem;
+}
+@font-face {
+  font-family: "LESLIE";
+  src: url("../../font/LESLIE.TTF");
+}
+.details-num {
+  font-size: 120px !important;
+  font-family: "LESLIE";
+  color: rgb(58, 175, 184);
+}

+ 110 - 104
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test3/test3.html

@@ -1,104 +1,110 @@
-<div class="box3 box" data-name='test3' draggable="true">
-    <div class="toolBox">
-        <span class="fit"></span>
-        <span class="close"></span>
-    </div>
-    <div class="tool">
-        <div class="title">
-            <img src="../images/stationGroup/dx.png" alt="">
-            <h2>test3</h2>
-        </div>
-    </div>
-    <div class="test-box">
-        <div class="content">
-            <!-- <div class="noData">暂无信息</div> -->
-
-            <!-- 站群的总体情况 -->
-            <div class="overall">
-                <ul>
-                    <li>
-                        <p>总访问人数</p>
-                        <div>
-                            <div class="info">
-                                <span class="num">89,774</span>
-                                <span class="unit">人</span>
-                            </div>
-                        </div>
-                    </li>
-                    <li>
-                        <p>总文章浏览量</p>
-                        <div>
-                            <div class="info">
-                                <span class="num">89,774</span>
-                                <span class="unit">次</span>
-                            </div>
-                        </div>
-                    </li>
-                    <li>
-                        <p>总文章发布条数</p>
-                        <div>
-                            <div class="info">
-                                <span class="num">89,774</span>
-                                <span class="unit">条</span>
-                            </div>
-                        </div>
-                    </li>
-                    <li>
-                        <p>总空间大小</p>
-                        <div>
-                            <div class="info">
-                                <span class="num">89,774</span>
-                                <span class="unit">GB</span>
-                            </div>
-                        </div>
-                    </li>
-                    <li>
-                        <p>站群总数</p>
-                        <div>
-                            <div class="info">
-                                <span class="num">9</span>
-                                <span class="unit">人</span>
-                            </div>
-                            <div class="details">
-                                <p>
-                                    <span>公园:<span>3个</span></span>|
-                                    <span>学校:<span>2个</span></span>|
-                                </p>
-                                <p>
-                                    <span>园林:<span>2个</span></span>|
-                                    <span>设施:<span>1个</span></span>|
-                                    <span>环卫:<span>1个</span></span>
-                                </p>
-                            </div>
-                        </div>
-                    </li>
-                </ul>
-            </div>
-
-        </div>
-    </div>
-    <div class="panel-footer"></div>
-
-</div>
-
-
-<!-- 工具弹框 -->
-<div class="tools" style="display: none;">
-
-    <div class="containerTool test3Toll">
-        <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="box3 box" data-name="test3" draggable="true">
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="tool">
+    <div class="title">
+      <img src="../images/stationGroup/dx.png" alt="" />
+      <h2>test3</h2>
+    </div>
+  </div>
+  <div class="test-box">
+    <div class="content">
+      <!-- <div class="noData">暂无信息</div> -->
+
+      <!-- 站群的总体情况 -->
+      <div class="overall">
+        <ul>
+          <li>
+            <p>总访问人数</p>
+            <div>
+              <div class="info">
+                <span class="num">89,774</span>
+                <span class="unit">人</span>
+              </div>
+            </div>
+          </li>
+          <li>
+            <p>总文章浏览量</p>
+            <div>
+              <div class="info">
+                <span class="num">89,774</span>
+                <span class="unit">次</span>
+              </div>
+            </div>
+          </li>
+          <li>
+            <p>总文章发布条数</p>
+            <div>
+              <div class="info">
+                <span class="num">89,774</span>
+                <span class="unit">条</span>
+              </div>
+            </div>
+          </li>
+          <li>
+            <p>总空间大小</p>
+            <div>
+              <div class="info">
+                <span class="num">89,774</span>
+                <span class="unit">GB</span>
+              </div>
+            </div>
+          </li>
+          <li>
+            <p>站群总数</p>
+            <div>
+              <div class="info">
+                <span class="num">9</span>
+                <span class="unit">人</span>
+              </div>
+              <div class="details">
+                <p>
+                  <span class="details-num"
+                    >公园:<span class="details-num">3个</span></span
+                  >|
+                  <span class="details-num"
+                    >学校:<span class="details-num">2个</span></span
+                  >|
+                </p>
+                <p>
+                  <span class="details-num"
+                    >园林:<span class="details-num">2个</span></span
+                  >|
+                  <span class="details-num"
+                    >设施:<span class="details-num">1个</span></span
+                  >|
+                  <span class="details-num"
+                    >环卫:<span class="details-num">1个</span></span
+                  >
+                </p>
+              </div>
+            </div>
+          </li>
+        </ul>
+      </div>
+    </div>
+  </div>
+  <div class="panel-footer"></div>
+</div>
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none">
+  <div class="containerTool test3Toll">
+    <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>

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

@@ -10,9 +10,9 @@ const test3 = (function() {
                 /** url,data参数,
                  * type请求类型,响应体结果,超时时间
                  * 成功的回调,失败回调 */
-                url: ZQURL + '/getStatData',
+                url: ZQURL + '/getStatAllData',
                 data: {
-                    dateType: 0
+                    dateType: 3
                 },
                 type: 'POST',
                 dataType: 'JSON',
@@ -23,6 +23,24 @@ const test3 = (function() {
                     const {
                         obj: dataObj
                     } = data;
+                    $('.test3 .box3 li').eq(0).find('.num').html(dataObj.visitcount); // 总访问人数
+
+                    $('.test3 .box3 li').eq(1).find('.num').html(dataObj.articlecount); // 总文章浏览量 -
+                    $('.test3 .box3 li').eq(2).find('.num').html(dataObj.visitcount); // 总文章发布条数 -
+
+                    $('.test3 .box3 li').eq(3).find('.num').html(dataObj.spacecount); // 总空间大小
+                    $('.test3 .box3 li').eq(4).find('.num').html(dataObj.siteAllCount); // 站群总数
+
+                    $('.test3 .box3 li').eq(4).find('.details p').eq(0).find('span').eq(0).find('sapn').html(dataObj.siteInstituteCount); // 公园 -
+
+                    $('.test3 .box3 li').eq(4).find('.details p').eq(0).find('span').eq(1).find('sapn').html(dataObj.siteSchoolCount); // 学校
+
+
+                    $('.test3 .box3 li').eq(4).find('.details p').eq(1).find('span').eq(0).find('sapn').html(dataObj.siteGardenCount); // 园林 -
+                    $('.test3 .box3 li').eq(4).find('.details p').eq(1).find('span').eq(1).find('sapn').html(dataObj.siteFacilitiesCount); // 设施
+                    $('.test3 .box3 li').eq(4).find('.details p').eq(1).find('span').eq(2).find('sapn').html(dataObj.siteSanitationCount); // 环卫
+
+                    
                 },
                 error: function() {
                     console.log('文章访问总数超时了');

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

@@ -40,7 +40,7 @@ const test31 = (function() {
                       return `
                           <tr class="tbody-box">
                             <td class="tbody-details">${index+1}</td>
-                            <td class="tbody-details">${item.office_name}</td>
+                            <td class="tbody-details">${item.office_name||'-'}</td>
                             <td class="tbody-details">${item.system_name}</td>
                             <td class="tbody-details">${high||'-'}</td>
                             <td class="tbody-details">${middle || '-'}</td>

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

@@ -27,6 +27,9 @@
 .box32 .descBox div {
   margin: 0.06rem 0;
 }
+.box32 .descBox div:nth-child(1){
+  font-size: 0.12rem !important;
+}
 .box32 .left,
 .box32 .right {
   height: 100%;
@@ -49,8 +52,13 @@
 }
 .box32 .left .info span,
 .box32 .right .info span {
-  font-size: 1vw;
+  font-size: 0.12rem !important;
   margin: 0.04rem 0.08rem;
+  color: #707438;
+  /* text-shadow: 0 0 50px #fff; */
+}
+.box32 .right .info span{
+  color: #3c9ffa;
 }
 .box32 .left .num,
 .box32 .right .num {
@@ -68,8 +76,14 @@
   display: flex;
   margin-left: 0.2rem;
   color: #fff;
-  flex: 3;
+  flex: 3 1 auto;
+  padding: 0.05rem 0;
   justify-content: space-around;
+  background: url(../../images/networkSecurity/zu.png) no-repeat;
+  background-size: 100% 110%;
+  position: relative;
+  left: -5%;
+  transform: scale(1.2);
 }
 .box32 .left .number span,
 .box32 .right .number span {
@@ -79,9 +93,9 @@
   padding: 0.03rem;
   border-radius: 1rem;
 }
-.box32 .left .txt,
-.box32 .right .txt {
-  font-size: 18px;
+.test32 .box32 .left span.txt,
+.test32 .box32 .right span.txt {
+  font-size: 0.22rem !important;
   color: antiquewhite;
 }
 .box32 .left img,

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

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

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

@@ -8,8 +8,6 @@ const test33 = (function() {
         move3(".test33 .test-box");
         move2(".test33 .containerTool");
 
-        let timer = null;
-
         $(".test33 .close").click(function() {
             $(".test33 .box").remove();
             $(".test33 .containerTool").css("display", "none");
@@ -45,19 +43,6 @@ const test33 = (function() {
                 console.log("-系统漏洞类型--------------超时");
             },
         });
-
-        // let myChart = echarts.init(dists[0]);
-
-        window.addEventListener("resize", function() {
-            if (timer) {
-                clearTimeout(timer);
-                timer = null;
-            }
-            timer = setTimeout(() => {
-                // move('.test33 .box')
-                // myChart.resize();
-            }, 500);
-        });
     }
 
     function setCharts(echartDom, testDom, result) {
@@ -92,7 +77,7 @@ const test33 = (function() {
                 show: false,
                 text: nametext,
                 subtext: "122",
-                textAlign: "center",
+                textAlign: "right",
                 textVerticalAlign: "middle",
                 textStyle: {
                     fontSize: 120,
@@ -104,7 +89,7 @@ const test33 = (function() {
                     color: "#1492ff",
                     fontSize: 116,
                     fontWeight: "bold",
-                    padding: [0, 10, 0, 10],
+                    padding: [0, 200, 0, 10],
                 },
                 left: "30%",
                 top: "center",
@@ -128,7 +113,7 @@ const test33 = (function() {
                             color: "#1492ff",
                             fontSize: 116,
                             fontWeight: "bold",
-                            padding: [0, 60, 0, 10],
+                            padding: [0, 80, 0, 10],
                         },
                     },
                 },
@@ -140,7 +125,7 @@ const test33 = (function() {
                             unit = data[i].unit;
                         }
                     }
-                    return `{a| ${name}}{b|${target}}`;
+                    return `{a| ${name}}\n{b|${target}}`;
                 },
             },
             series: [{
@@ -157,7 +142,8 @@ const test33 = (function() {
                         position: "center",
                         formatter: "{b}\n{c}",
                         textStyle: {
-                            fontSize: 0,
+                             fontSize: 120,
+                            fontWeight: "bold",
                             color: "#fff",
                         },
                     },

File diff suppressed because it is too large
+ 46 - 114
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test36/test36 copy.js


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

@@ -8,7 +8,6 @@ const test36 = (function() {
         move3(".test36 .test-box");
         move2(".test36 .containerTool");
 
-        let timer = null;
 
         $(".test36 .close").click(function() {
             $(".test36 .box").remove();
@@ -28,7 +27,7 @@ const test36 = (function() {
                 riskClassify: 2
             },
             success: function(res) {
-                console.log(res);
+                console.log('WEB漏洞类型',res);
                 let result = res.result;
                 const dists = document.querySelectorAll(".test36 .floor-dist");
                 const testDoms = document.querySelectorAll(".test36 .box");
@@ -38,22 +37,10 @@ const test36 = (function() {
                 }
             },
             error: function(err) {
-                console.log("------------------------超时");
+                console.log("----------WEB漏洞类型--------------超时");
             },
         });
 
-        // let myChart = echarts.init(dists[0]);
-
-        window.addEventListener("resize", function() {
-            if (timer) {
-                clearTimeout(timer);
-                timer = null;
-            }
-            timer = setTimeout(() => {
-                // move('.test36 .box')
-                // myChart.resize();
-            }, 500);
-        });
     }
 
     function setCharts(echartDom, testDom, result) {

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

@@ -21,18 +21,18 @@
             <ul class="rightInfo">
                 <li>
                     <img src="../images/networkSecurity/gwld.png" alt="">
-                    <span class="s2">已失陷资产数</span>
+                    <span>已失陷资产数</span>
                     <div>
-                        <span class="num n2">0</span>
-                        <i class="n2">个</i>
+                        <span class="num">0</span>
+                        <i >个</i>
                     </div>
                 </li>
                 <li>
                     <img src="../images/networkSecurity/zwld.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>

+ 25 - 18
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test38/test38.js

@@ -23,24 +23,31 @@ const test38 = (function () {
 
 
     // 安全事件
-    $.ajax({
-      url: FLAT_PATH_THREE + '/apiUrl/sendApiUrlAndParam',
-      type: 'GET',
-      data: {
-        urlCode: 'AQZX_014',
-        params: '{"keyword":"","startTime":"2022-05-04+00:00:00","endTime":"2022-05-10+17:05:00","threatSeverity":""}'
-      },
-      success: function (res) {
-        console.log('安全事件', JSON.parse(res.data));
-        const result = JSON.parse(res.data);
-        $('.test38 .box38 .img-numer').eq(0).html(result.data.High)
-        $('.test38 .box38 .img-numer').eq(1).html(result.data.Medium)
-        $('.test38 .box38 .img-numer').eq(2).html(result.data.Low)
-      },
-      error: function (err) {
-        console.log("----安全事件--------超时");
-      },
-    });
+    function test38Ajax() {
+      $.ajax({
+        url: FLAT_PATH_THREE + '/apiUrl/sendApiUrlAndParam',
+        type: 'GET',
+        data: {
+          urlCode: 'AQZX_014',
+          params: '{"keyword":"","startTime":"2022-05-04+00:00:00","endTime":"2022-05-10+17:05:00","threatSeverity":""}'
+        },
+        success: function (res) {
+          console.log('安全事件', JSON.parse(res.data));
+          const result = JSON.parse(res.data);
+          $('.test38 .box38 .img-numer').eq(0).html(result.data.High)
+          $('.test38 .box38 .img-numer').eq(1).html(result.data.Medium)
+          $('.test38 .box38 .img-numer').eq(2).html(result.data.Low)
+        },
+        error: function (err) {
+          console.log("----安全事件--------超时");
+        },
+      });
+    }
+    test38Ajax()
+    setInterval(() => {
+      test38Ajax()
+    }, 60*1000);
+    
   }
 
   return test38

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

@@ -68,78 +68,12 @@ const test39 = (function () {
       },
     });
 
+    const dom = $('.test39 .box39 .content');
+    setTimeout(() => {
+      scroll(dom,0)
+    }, 1500);
 
-
-    function animateScrool (option) {
-      const defatult = {
-        duration: 500, // 每次移动的时间
-        total: 1000, // 总时间
-        begin: {},
-        end: {}
-      }
-      option = Object.assign({}, defatult, option);
-      let timer = null;
-      // 移动总次数
-      const number = Math.ceil(option.total / option.duration);
-      // 当前移动次数
-      let count = 0;
-      // 移动属性的总距离
-      const distance = {};
-      // 每次属性移动的距离
-      const everyDistance = {};
-      // 记录每次移动的状态
-      const curData = option.begin;
-      for (const key in option.begin) {
-        distance[key] = option.end[key] - option.begin[key];
-        everyDistance[key] = distance[key] / number;
-      }
-      // 开始动画
-      const start = () => {
-        if (timer || count === number) {
-          return
-        }
-        option.onStart && option.onStart(curData)
-        timer = setInterval(() => {
-          for (const key in curData) {
-            if (count === number) { // 最后一次运动
-              curData[key] = option.end[key];
-            } else {
-              curData[key] += everyDistance[key];
-            }
-          }
-          option.startMove && option.startMove(curData);
-          if (count === number) {
-            stop();
-            option.stopMove && option.stopMove(curData)
-          }
-        }, option.duration);
-      }
-
-      const stop = () => {
-        clearInterval(timer);
-        timer = null;
-      }
-
-      return {
-        start,
-        stop
-      }
-
-    }
-
-
-    animateScrool({
-      duration: 30,
-      total: 5000,
-      begin:{
-        top:0
-      },
-      end:{
-        
-      }
-    })
-
-
+    
   }
 
   return test39

+ 66 - 54
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test4/test4.css

@@ -1,54 +1,66 @@
-.box4 {
-  /* background-image: linear-gradient(#0f0, #f0f); */
-}
-.secu-top {
-  margin-bottom: 0px;
-  margin-top: 0.12rem;
-}
-.secu-top ul {
-  display: flex;
-  align-items: center;
-  justify-content: space-around;
-  width: 100%;
-}
-.secu-top ul li {
-  width: 2.7rem;
-  height: 0.7rem;
-  line-height: 0.75rem;
-  font-size: 0.2rem;
-  color: #fff;
-  background: url(../../images/stationGroup/sx1.png) no-repeat;
-  background-size: 100% 100%;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-.secu-top ul li span {
-  margin-left: 1.1rem;
-}
-.secu-bottom ul {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-around;
-}
-.secu-bottom ul li {
-  display: flex;
-  margin: 0.05rem 0;
-}
-.secu-bottom ul li img {
-  width: 0.8rem;
-  height: 0.8rem;
-}
-.secu-bottom ul li .secu-info {
-  width: 1.3rem;
-  padding: 0.16rem;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-}
-.secu-bottom ul li .secu-info .leak {
-  color: #ccc;
-}
-.secu-bottom ul li .secu-info .leak-num {
-  color: #5C96FF;
-}
+.box4 {
+  /* background-image: linear-gradient(#0f0, #f0f); */
+}
+@font-face {
+  font-family: "LESLIE";
+  src: url("../../font/LESLIE.TTF");
+}
+.secu-top {
+  margin-bottom: 0px;
+  margin-top: 0.12rem;
+}
+.secu-top ul {
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
+  width: 100%;
+}
+.secu-top ul li {
+  width: 2.7rem;
+  height: 0.7rem;
+  line-height: 0.75rem;
+  font-size: 0.2rem;
+  color: #fff;
+  background: url(../../images/stationGroup/sx1.png) no-repeat;
+  background-size: 100% 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.num{
+  font-family: "LESLIE";
+}
+.secu-top-li {
+  background: url(../../images/stationGroup/sx2.png) no-repeat !important;
+  background-size: 100% 100% !important;
+}
+.secu-top ul li span {
+  margin-left: 1.1rem;
+}
+.secu-bottom ul {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-around;
+}
+.secu-bottom ul li {
+  display: flex;
+  /* margin: 0.05rem 0; */
+  margin-top: 1%;
+}
+.secu-bottom ul li img {
+  width: 0.7rem;
+  height: 0.7rem;
+}
+.secu-bottom ul li .secu-info {
+  width: 1.3rem;
+  padding: 0.16rem;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+.secu-bottom ul li .secu-info .leak {
+  color: #ccc;
+}
+.secu-bottom ul li .secu-info .leak-num {
+  color: #5c96ff;
+}

+ 101 - 105
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test4/test4.html

@@ -1,105 +1,101 @@
-<div class="box4 box" data-name='test4'>
-    <div class="toolBox">
-        <span class="fit"></span>
-        <span class="close"></span>
-    </div>
-    <div class="tool">
-        <div class="title">
-            <img src="../images/stationGroup/scph3.png" alt="">
-            <h2>站群安全态势</h2>
-        </div>
-    </div>
-    <div class="test-box">
-        <div class="content">
-            <!-- <div class="floor-dist">
-        </div> -->
-
-            <!-- 站群安全态势 -->
-            <div class="security">
-                <div class="secu-top">
-                    <ul>
-                        <li>
-                            <span>网页防篡改</span>
-                        </li>
-                        <li>
-                            <span>安全设备状态</span>
-                        </li>
-                    </ul>
-                </div>
-                <div class="secu-bottom">
-                    <ul>
-                        <li>
-                            <div class="img">
-                                <img src="../images/stationGroup/scph7.png" alt="">
-                            </div>
-                            <div class="secu-info">
-                                <p class="leak">高风险漏洞数</p>
-                                <p class="leak-num">
-                                    <span class="num">0<span class="unit">个</span></span>
-                                </p>
-                            </div>
-                        </li>
-                        <li>
-                            <div class="img">
-                                <img src="../images/stationGroup/scph4.png" alt="">
-                            </div>
-                            <div class="secu-info">
-                                <p class="leak">木马数量</p>
-                                <p class="leak-num">
-                                    <span class="num">0<span class="unit">个</span></span>
-                                </p>
-                            </div>
-                        </li>
-                        <li>
-                            <div class="img">
-                                <img src="../images/stationGroup/scph5.png" alt="">
-                            </div>
-                            <div class="secu-info">
-                                <p class="leak">病毒数量</p>
-                                <p class="leak-num">
-                                    <span class="num">0<span class="unit">个</span></span>
-                                </p>
-                            </div>
-                        </li>
-                        <li>
-                            <div class="img">
-                                <img src="../images/stationGroup/scph6.png" alt="">
-                            </div>
-                            <div class="secu-info">
-                                <p class="leak">防御攻击次数</p>
-                                <p class="leak-num">
-                                    <span class="num">1,939<span class="unit">次</span></span>
-                                </p>
-                            </div>
-                        </li>
-                    </ul>
-                </div>
-            </div>
-
-        </div>
-    </div>
-    <div class="panel-footer"></div>
-
-</div>
-
-
-<!-- 工具弹框 -->
-<div class="tools" style="display: none;">
-
-    <div class="containerTool test4Toll">
-        <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="box4 box" data-name="test4">
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="tool">
+    <div class="title">
+      <img src="../images/stationGroup/scph3.png" alt="" />
+      <h2>站群安全态势</h2>
+    </div>
+  </div>
+  <div class="test-box">
+    <div class="content">
+      <!-- <div class="floor-dist">
+        </div> -->
+
+      <!-- 站群安全态势 -->
+      <div class="security">
+        <div class="secu-top">
+          <ul>
+            <li class="secu-top-li">
+              <span>网页防篡改</span>
+            </li>
+            <li>
+              <span>安全设备状态</span>
+            </li>
+          </ul>
+        </div>
+        <div class="secu-bottom">
+          <ul>
+            <li>
+              <div class="img">
+                <img src="../images/stationGroup/scph7.png" alt="" />
+              </div>
+              <div class="secu-info">
+                <p class="leak">高风险漏洞数</p>
+                <p class="leak-num">
+                  <span class="num">0<span class="unit">个</span></span>
+                </p>
+              </div>
+            </li>
+            <li>
+              <div class="img">
+                <img src="../images/stationGroup/scph4.png" alt="" />
+              </div>
+              <div class="secu-info">
+                <p class="leak">木马数量</p>
+                <p class="leak-num">
+                  <span class="num">0<span class="unit">个</span></span>
+                </p>
+              </div>
+            </li>
+            <li>
+              <div class="img">
+                <img src="../images/stationGroup/scph5.png" alt="" />
+              </div>
+              <div class="secu-info">
+                <p class="leak">病毒数量</p>
+                <p class="leak-num">
+                  <span class="num">0<span class="unit">个</span></span>
+                </p>
+              </div>
+            </li>
+            <li>
+              <div class="img">
+                <img src="../images/stationGroup/scph6.png" alt="" />
+              </div>
+              <div class="secu-info">
+                <p class="leak">防御攻击次数</p>
+                <p class="leak-num">
+                  <span class="num">1,939<span class="unit">次</span></span>
+                </p>
+              </div>
+            </li>
+          </ul>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="panel-footer"></div>
+</div>
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none">
+  <div class="containerTool test4Toll">
+    <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>

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

@@ -58,6 +58,12 @@ const test40 = (function() {
             `
           })
           $('.test40 .box40 tbody').html(html);
+
+
+          const dom = $('.test40 .box40 .content');
+          setTimeout(() => {
+            scroll(dom,0)
+          }, 1500);
           },
           error: function (err) {
             console.log("----攻击来源--------超时");

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

@@ -81,4 +81,20 @@
 }
 .box41 thead tr{
   background-color: #1c538c;
+  display: flex;
+  text-indent: 71%;
+  width: 98%;
+  justify-content: space-around;
+  position: absolute;
+  align-items: center;
 }
+
+.box41 thead tr th:nth-child(2){
+  position: relative;
+  left: 6%;
+}
+
+.box41 thead tr th:nth-child(3){
+  position: relative;
+  left: 6%;
+}

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

@@ -44,6 +44,10 @@ const test41 = (function() {
               `
             }).join('');
             $('.test41 .box41 tbody').html(html);
+            const dom = $('.test41 .box41 .content');
+            setTimeout(() => {
+              scroll(dom,0)
+            }, 1500);
           },
           error: function (err) {
             console.log("----攻击详情--------超时");

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

@@ -5,3 +5,7 @@
   margin: 0;
   padding: 0;
 }
+.test42 .box42{
+  box-shadow: none;
+  background: none;
+}

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

@@ -3,11 +3,6 @@
         <span class="fit"></span>
         <span class="close"></span>
     </div>
-    <div class="tool">
-        <div class="title bgTitle">
-            <h2>test42</h2>
-        </div>
-    </div>
     <div class="test-box">
         <div class="content">
             <div class="floor-dist">

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

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

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

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

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

@@ -1,29 +1,30 @@
-.box5 .content {
-    margin: 0;
-    padding: 0;
-}
-
-.special ul {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-around;
-}
-
-.special li {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: 1.7rem;
-    height: 0.7rem;
-    box-sizing: border-box;
-    color: #beb1eb;
-    background: url(../../images/stationGroup/tb7.png);
-    transform: scale(0.9);
-    padding: 0 0.05rem;
-}
-
-.special li img {
-    width: 0.6rem;
-    height: 0.4rem;
-    margin-right: 0.1rem;
+.box5 .content {
+    margin: 0;
+    padding: 0;
+}
+
+.special ul {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-around;
+}
+
+.special li {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 1.7rem;
+    height: 0.7rem;
+    box-sizing: border-box;
+    color: #beb1eb;
+    background: url(../../images/stationGroup/tb7.png);
+    transform: scale(0.9);
+    padding: 0 0.05rem;
+    margin-top: 2%;
+}
+
+.special li img {
+    width: 0.6rem;
+    height: 0.4rem;
+    margin-right: 0.1rem;
 }

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

@@ -9,7 +9,7 @@
       </div>
     </div>
     <div class="test-box">
-      <marquee behavior="scroll" direction="up" height="100%">
+      <!-- <marquee behavior="scroll" direction="up" height="100%"> -->
         <div class="content">
           <div class="item" data-id="1">
             <img src="../images/networkSecurity/pic_kuang.png" alt="" />
@@ -62,7 +62,7 @@
             </div>
           </div>
         </div>
-      </marquee>
+      <!-- </marquee> -->
     </div>
     <div class="panel-footer"></div>
   </div>

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

@@ -68,7 +68,6 @@ const test50 = (function () {
         console.log("--机房接口八楼,二号楼-------------超时");
       },
     });
-
     // 网络核心机房
     $.ajax({
       url: ROOM + "/api/devicesignaltable/listByName",
@@ -76,6 +75,7 @@ const test50 = (function () {
         deviceName: "四楼",
       },
       success: function ({ data }) {
+        console.log('网络核心机房',data);
         // 温度
         let temperature = data.filter((item) => {
           return item.signalname === "温度";
@@ -638,7 +638,7 @@ const test50 = (function () {
       });
 
       roomIndex = $(this).index();
-      roomIndex = 9;
+      // roomIndex = 9;
       if (roomIndex === 0) {
         $(".roomThree62").css("visibility", "inherit");
         $(".roomThree63").css("visibility", "hidden");
@@ -668,12 +668,12 @@ const test50 = (function () {
         $(".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();
+        $('.roomThree62').css('visibility', 'hidden');
+        $('.roomThree63').css('visibility', 'hidden');
+        $('.roomThree64').css('visibility', 'hidden');
+        $('.roomThree65').css('visibility', 'hidden');
+        $('.roomThree66').css('visibility', 'inherit');
+        module66();
       }
       $(".sf5").slideToggle();
     });

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

@@ -3,6 +3,34 @@
   background: none;
 }
 
+@keyframes row {
+  0%{
+    transform: translateX(0);
+  }
+
+  50%{
+    /* transform: translateX(-50%); */
+  }
+  100%{
+    /* transform: translateX(0); */
+    transform: translateX(-50%);
+  }
+}
+
+.box61 .left-box,.box61 .right-box{
+  animation: row linear 20s infinite;
+}
+
+
+
+.left-box-three:hover{
+  transform: scale(1.2);
+}
+
+.left-box-three{
+  transition: all 0.5s;
+}
+
 
 .box61 .test-box {
   width: 100%;
@@ -99,13 +127,19 @@
   height: 100%;
 }
 
-.bg-botton {
+.bg-botton,.meng-bg {
   margin: auto;
   width: 25%;
   height: 50%;
   position: absolute;
   top: 50%;
   left: 38%;
+  z-index: 9;
+}
+
+.meng-bg{
+  background: #2140641f;
+  z-index: 8;
 }
 
 .bg-botton img {
@@ -115,7 +149,7 @@
 
 .bg-botton-two {
   width: 100%;
-  height: 50%;
+  height: 11%;
   background: url("../../css/modules/layer/default/传送带拷贝.png") no-repeat;
   background-size: 100%;
   position: absolute;
@@ -125,44 +159,42 @@
   color: #9fdbf0;
   text-align: center;
 }
+.bg-left-box,.bg-right-box{
+  margin-top: -18%;
+  overflow: hidden;
+  position: relative;
+  transform: scale(0.8);
 
-.left-box {
-  width: 50%;
-  height: 100%;
-  display: flex;
 }
-
-.right-box {
-  width: 50%;
+.bg-left-box{
+  left: -4%;
+}
+.bg-right-box{
+  right: -4%;
+}
+.left-box,.right-box {
+  width: 400%;
   height: 100%;
   display: flex;
   justify-content: center;
-  position: absolute;
-  left: 57%;
+  margin-top: 10%;
 }
 
-.left-box-one {
-  width: 25%;
-  height: 100%;
-  background: url("../../css/modules/layer/default/组58.png") no-repeat;
-  background-size: 64%;
-  margin-top: -18%;
-  margin-left: 3%;
-}
 
-.left-box-two {
-  width: 25%;
+.left-box-one,.left-box-two  {
+  flex: 1;
   height: 100%;
-  background: url("../../css/modules/layer/default/业务系统.png") no-repeat;
+  background: url("../../css/modules/layer/default/组58.png") no-repeat;
   background-size: 64%;
-  margin-top: -18%;
-  margin-left: 3%;
+  background-position-x: center;
 }
 
 .left-box-one-title {
   margin-left: 0.23rem;
   width: 0.9rem;
   margin-top: 7%;
+  left: 26%;
+  position: relative;
 }
 
 .number-img {
@@ -181,16 +213,21 @@
 
 
 /* 弹窗样式 */
-
+.box61 .tablebox{
+  margin-top: 13%;
+  height: 60%;
+  overflow: auto;
+}
 .Popup {
   width: 35%;
-  height: 30%;
-  /* font-size: 1rem !important; */
+  height: 42%;
   position: absolute;
-  top: 60%;
-  left: 20%;
+  top: 41%;
+  left: 34%;
+  transform: scale(1.5);
   background: url("../../css/modules/layer/default/色相饱和度1854.png") no-repeat;
-  background-size: 100% 100%;
+  background-size: 100% 103%;
+  z-index: 99;
 }
 
 .close-Popup {
@@ -207,16 +244,30 @@
   height: 55%;
   text-align: center;
   font-size: 0.15rem !important;
-  position: absolute;
-  top: 21%;
-  left: 5%;
+  margin: 0 auto;
 }
 
 .number-box {
   color: #fff;
-  position: relative;
-  top: 70%;
-  left: 37.5%;
+  text-align: center;
+}
+
+.number-box::after{
+  content: "";
+    width: 0;
+    height: 0;
+    border-top: 50px solid transparent;
+    border-right: 100px solid red;
+    border-bottom: 50px solid transparent;
+}
+
+.number-box::before{
+    content: "";
+    width: 0;
+    height: 0;
+    border-top: 50px solid transparent;
+    border-left: 100px solid red;
+    border-bottom: 50px solid transparent;
 }
 
 .Popup-name {
@@ -228,7 +279,7 @@
 }
 
 .box61 .Tr-td {
-  height: 20% !important;
+  /* height: 20% !important; */
 }
 
 .box61 .Tr-td:nth-child(1) {
@@ -246,7 +297,32 @@
   background-color: #205dcf46;
 }
 
+.box61 #stuTable thead tr{
+  position: absolute;
+  top: 20%;
+  background: #205dcf;
+  width: 90%;
+  height: 8%;
+  display: flex;
+  line-height: 0.3rem;
+}
+
+.box61 #stuTable thead tr th:nth-child(1){
+  padding-left: 8%;
+}
+
+.box61 #stuTable thead tr th:nth-child(2){
+  position: relative;
+  left: 6%;
+}
+
+
 .box61 .stuTableTr {
   min-width: 20%;
   height: 50%;
+}
+
+.box61 #stuTable th,.box61 #stuTable td{
+  width: 13%;
+  font-size: 0.12rem !important;
 }

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

@@ -12,7 +12,7 @@
         </div>
         <div class="bg-center-img-two">
           <img src="../css/modules/layer/default/xcy1.png" alt="" />
-          <div class="bg-center-img-two-text">创云</div>
+          <div class="bg-center-img-two-text">创云</div>
         </div>
         <div class="bg-center-img-three">
           <img
@@ -32,64 +32,73 @@
       <div class="bg-botton">
         <img src="../css/modules/layer/default/组1443.png" alt="" />
       </div>
+      <div class="meng-bg"></div>
       <div class="number-img">
         <img src="../css/modules/layer/default/代码.png" alt="" />
       </div>
       <div class="bg-botton-two">
+        <div class="bg-left-box">
         <div class="left-box">
-          <div class="left-box-one left-box-three">
+          <div class="left-box-one left-box-three" data-id='0'>
             <div class="left-box-one-title">市环卫中心</div>
           </div>
-          <div class="left-box-one left-box-three">
+          <div class="left-box-one left-box-three" data-id='1'>
             <div class="left-box-one-title">后勤中心</div>
           </div>
-          <div class="left-box-one left-box-three">
+          <div class="left-box-one left-box-three" data-id='2'>
             <div class="left-box-one-title">市市政环卫检测中心</div>
           </div>
         </div>
+      </div>
+
+<div class="bg-right-box">
         <div class="right-box">
-          <div class="left-box-two left-box-three">
+          <div class="left-box-two left-box-three" data-id='3'>
             <div class="left-box-one-title">市城市管理执法总队</div>
           </div>
-          <div class="left-box-two left-box-three">
+          <div class="left-box-two left-box-three" data-id='4'>
             <div class="left-box-one-title">市设施运行中心</div>
           </div>
-          <div class="left-box-two left-box-three">
+          <div class="left-box-two left-box-three" data-id='5'>
             <div class="left-box-one-title">市动物园管理中心</div>
           </div>
         </div>
+</div>
+
       </div>
     </div>
     <!-- 感染病毒详情弹窗 -->
     <div class="Popup hiddenScroll" style="display: none">
       <div class="Popup-name">市环卫中心<span class="close-Popup">X</span></div>
-      <table id="stuTable" class="table">
-        <thead>
-          <tr>
-            <th class="stuTableTr">系统名称</th>
-            <th class="stuTableTr">高危漏洞</th>
-            <th class="stuTableTr">中危漏洞</th>
-            <th class="stuTableTr">系统保护评定等级</th>
-            <th class="stuTableTr">评定时间</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr class="Tr-td">
-            <td>市环卫中心门户网站系统</td>
-            <td>0</td>
-            <td>0</td>
-            <td>低</td>
-            <td>2022年1月13日 14:36:29</td>
-          </tr>
-          <tr class="Tr-td">
-            <td>市环卫中心门户网站系统</td>
-            <td>0</td>
-            <td>0</td>
-            <td>低</td>
-            <td>2022年1月13日 14:36:29</td>
-          </tr>
-        </tbody>
-      </table>
+      <div class="tablebox hiddenScroll">
+        <table id="stuTable" class="table">
+          <thead>
+            <tr>
+              <th class="stuTableTr">系统名称</th>
+              <th class="stuTableTr">高危漏洞</th>
+              <th class="stuTableTr">中危漏洞</th>
+              <th class="stuTableTr">系统保护评定等级</th>
+              <th class="stuTableTr">评定时间</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr class="Tr-td">
+              <td>市环卫中心门户网站系统</td>
+              <td>0</td>
+              <td>0</td>
+              <td>低</td>
+              <td>2022年1月13日 14:36:29</td>
+            </tr>
+            <tr class="Tr-td">
+              <td>市环卫中心门户网站系统</td>
+              <td>0</td>
+              <td>0</td>
+              <td>低</td>
+              <td>2022年1月13日 14:36:29</td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
       <div class="number-box" style="display: none;">病毒感染总数:<span>5</span>台</div>
     </div>
   </div>

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

@@ -30,18 +30,24 @@ const test61 = (function() {
             $(".sf1").slideDown();
             $(".sf3").slideUp();
             $(".sf4").slideUp();
+            sp1Ajax11()
+            sp1Ajax12()
+            sp1Ajax14()
+            sp1Ajax15()
+            sp1Ajax17()
         });
 
-
-
         // 浪潮
         $(".bg-center-img-three").click(function() {
             $(".sf4").slideDown();
             $(".sf1").slideUp();
             $(".sf3").slideUp();
-
-            // setCharts27(dom27, testDom27);
-            // setCharts29(dom29, testDom29);
+            sp4Ajax25()
+            sp4Ajax26()
+            sp4Ajax27();
+            sp4Ajax28();
+            sp4Ajax29();
+            sp4Ajax30();
         });
 
         // 华为
@@ -49,6 +55,10 @@ const test61 = (function() {
             $(".sf3").slideDown();
             $(".sf1").slideUp();
             $(".sf4").slideUp();
+            sp3Ajax18()
+            sp3Ajax19()
+            sp3Ajax21()
+            sp3Ajax22()
             myAjax1()
             myAjax2()
             myAjax3()
@@ -57,12 +67,19 @@ const test61 = (function() {
         $(".test61 .close-Popup").click(function() {
             $(".test61 .Popup").css("display", "none");
         });
-        $(".test61 .left-box-three").click(function() {
 
+        const domPop = $('.Popup .tablebox');
+        let popFlag = false;
+        $(".test61 .left-box-three").click(function() {
+          const tit = $(this).find('.left-box-one-title').html();
+          $('.Popup-name').text(tit);
+          const id = +$(this).attr('data-id');
           $.ajax({
             url: basicUrl +
                 "/SystemRisk/GetSystemRiskList",
-            data: {},
+            data: {
+              officeId:id
+            },
             success: function(res) {
                 console.log('安全等级弹框', res);
                 const {result} = res;
@@ -85,17 +102,22 @@ const test61 = (function() {
                     status = '高'
                      break;
                  }
+
                 return `
                     <tr class="Tr-td">
                       <td>${item.system_name}</td>
                       <td>${high}</td>
                       <td>${middle}</td>
                       <td>${status}</td>
-                      <td>${item.update_time ||item.create_time }</td>
+                      <td>${item.update_time ? item.update_time.substring(0,10):false ||item.create_time ? item.create_time.substring(0,10) : false }</td>
                     </tr>
                 `
                 }).join('');
                 $('.box61 .Popup tbody').html(html);
+                setTimeout(() => {
+                  scroll(domPop, 0,popFlag)
+                  popFlag = true;
+                }, 1500);
             },
             error: function(err) {
                 console.log("----安全等级弹框--------超时");
@@ -105,6 +127,85 @@ const test61 = (function() {
 
             $(".test61 .Popup").css("display", "block");
         });
+
+
+
+        const dom = $('.test61 .box61 .left-box');
+        const dom1Children = $('.test61 .box61 .left-box').children();
+
+        const dom2 = $('.test61 .box61 .right-box');
+        const dom2Children = $('.test61 .box61 .right-box').children();
+
+        dom.append(dom2Children.clone(true))
+        dom.append(dom1Children.clone(true))
+        dom.append(dom2Children.clone(true))
+
+
+        dom2.append(dom1Children.clone(true))
+        dom2.append(dom2Children.clone(true))
+        dom2.append(dom1Children.clone(true))
+
+
+
+
+        
+
+        hoverAnimation(dom,dom2)
+        hoverAnimation(dom2,dom)
+        function hoverAnimation(dom,dom2) {
+          dom.hover(()=>{
+            dom.css({
+              'animation-play-state': 'paused'
+            })
+            dom2.css({
+              'animation-play-state': 'paused'
+            })
+          },
+          () => {
+            dom.css({
+              'animation-play-state': 'running'
+            })
+            dom2.css({
+              'animation-play-state': 'running'
+            })
+          })
+        }
+
+
+        setTimeout(() => {
+          const scroll = (dom,curLeft) => {
+            const option = {
+              duration: 16,
+              total: 5000,
+              begin: {
+                left: curLeft
+              },
+              end: {
+                left: -dom.width()/2
+              },
+              startMove (curData) {
+                curLeft = curData.left;
+                dom.css('margin-left',curLeft)
+              },
+              stopMove () {
+                dom.css('margin-left',0)
+
+                curLeft = 0;
+                scroll(dom,0)
+              }
+            }
+            const animate = animateScrool(option);
+             animate.start();
+             dom.hover(() => {
+              animate.stop();
+            },() => {
+              animate.start();
+            })
+             return animate;
+           }
+          //  scroll(dom,0)
+          }, 1500);
+
     }
 
     function setCharts(echartDom, testDom) {

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

@@ -3,22 +3,43 @@
     <span class="fit"></span>
     <span class="close"></span>
   </div>
+  <div class="svg-contanier">
+    <div class="svg-item">
+      <svg>
+        <path d="M800 260, L 860 300, L 900 250,L 1000 300" />
+        <path d="M780 320, L 820 340, L 760 400" />
+        <path d="M700 240, L 600 280, L 630 305, L 530 350" />
+        <path d="M700 220, L 660 195, L 740 155" />
+        <path d="M750 220, L 900 220" />
+        <path d="M400 260, L 320 220, L 400 190, L 320 140" />
+        <path d="M280 60, L 600 60, L 630 30, L 900 30, L 930 60, L 1180 60" />
+        <path d="M1120 140, L 1060 190, L 1130 220" />
+      </svg>
+      <div class="rect qxRect"></div>
+      <div class="rect qxRect2"></div>
+      <div class="rect qxRect3"></div>
+      <div class="rect qxRect4"></div>
+      <div class="rect qxRect5"></div>
+      <div class="rect qxRect6"></div>
+      <div class="rect qxRect7"></div>
+    </div>
+  </div>
   <div class="test-box">
     <div class="concent">
 
       <div class="l-bg ex"></div>
       <!-- <div class="x-bg ex"></div> -->
 
-      <div class="c-left-img-one">
+      <div style="width: 6%;" class="c-left-img-one">
         <img src="../images/zybz/jbq拷贝3.png" alt="">
         <p>主城区县</p>
       </div>
-      <div class="c-left-img-two">
+      <div style="width: 5%;" class="c-left-img-two">
         <img src="../images/zybz/ybq拷贝2.png" alt="">
         <p>郊区区县</p>
       </div>
       <div class="c-center1">
-        <img src="../images/zybz/组240拷贝.png" alt="" style="width: 1666px" />
+        <img src="../images/zybz/组240拷贝.png" alt="" style="width: 1660px" />
         <p style="font-family: '庞门正道标题体'">指挥大厅</p>
       </div>
       <div class="c-center2">
@@ -34,11 +55,11 @@
         <p>2号楼中心机房</p>
       </div>
       <div class="c-center5">
-        <img src="../images/zybz/icon_jifang拷贝3.png" alt="">
+        <img src="../images/zybz/icon_jifang拷贝3.png" alt="" style="width: 5%">
         <p>档案室库房</p>
       </div>
       <div class="c-center6">
-        <img style="width: 49%;" src="../images/zybz/icon_jifang拷贝3.png" alt="">
+        <img style="width: 49%;" src="../images/zybz/icon_jifang拷贝3.png" alt="" style="width: 100px">
         <p>城管局网络核心机房</p>
       </div>
 

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

@@ -52,7 +52,7 @@ const test7 = (function () {
         // text: "请求数",
         textStyle: {
           fontWeight: "normal",
-          fontSize: 16,
+          fontSize: 30,
           color: "#F1F1F3",
         },
         left: "6%",
@@ -70,10 +70,10 @@ const test7 = (function () {
         itemWidth: 14,
         itemHeight: 5,
         itemGap: 13,
-        data: ["移动", "电信", "联通"],
+        data: ["移动", "电信"],
         right: "4%",
         textStyle: {
-          fontSize: 12,
+          fontSize: 80,
           color: "#fff",
         },
       },
@@ -119,7 +119,7 @@ const test7 = (function () {
           axisLabel: {
             margin: 10,
             textStyle: {
-              fontSize: 14,
+              fontSize: 80,
             },
           },
           splitLine: {
@@ -135,11 +135,11 @@ const test7 = (function () {
           type: "line",
           smooth: true,
           symbol: "circle",
-          symbolSize: 5,
+          symbolSize: 10,
           showSymbol: false,
           lineStyle: {
             normal: {
-              width: 3,
+              width: 10,
             },
           },
           areaStyle: {
@@ -162,7 +162,7 @@ const test7 = (function () {
                 false
               ),
               shadowColor: "rgba(0, 0, 0, 0.1)",
-              shadowBlur: 10,
+              shadowBlur: 100,
             },
           },
           itemStyle: {
@@ -192,11 +192,12 @@ const test7 = (function () {
           type: "line",
           smooth: true,
           symbol: "circle",
-          symbolSize: 5,
+          symbolSize: 10,
           showSymbol: false,
           lineStyle: {
             normal: {
-              width: 3,
+              width: 10,
+              top:100
             },
           },
           areaStyle: {
@@ -219,7 +220,7 @@ const test7 = (function () {
                 false
               ),
               shadowColor: "rgba(0, 0, 0, 0.1)",
-              shadowBlur: 10,
+              shadowBlur: 100,
             },
           },
           itemStyle: {

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

@@ -1,59 +1,76 @@
-.box9 .title {
-    height: 1.5rem;
-    background: url(../../images/stationGroup/title.png) no-repeat;
-    padding-left: 1.8rem;
-}
-
-.box9 .content li {
-    display: flex;
-    margin: 0.5rem;
-    margin-bottom: 0;
-    margin-top: 0.2rem;
-    position: relative;
-}
-
-.box9 .content li:nth-child(1)::after,
-.box9 .content li:nth-child(2)::after,
-.box9 .content li:nth-child(3)::after {
-    content: "01";
-    position: absolute;
-    width: 1rem;
-    color: #ccc;
-    padding-left: 0.1rem;
-    background: url(../../images/stationGroup/tc1.png) no-repeat;
-    top: 0.3rem;
-    background-size: contain;
-}
-
-.box9 .content li:nth-child(2)::after {
-    content: "02";
-}
-
-.box9 .content li:nth-child(3)::after {
-    content: "03";
-}
-
-.box9 .content li .info {
-    overflow: hidden;
-    color: #ccc;
-}
-
-.box9 .content li .info h5 {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    font-size: 0.2rem;
-    margin-bottom: 0.1rem;
-}
-
-.box9 .content li .info p {
-    -webkit-box-orient: vertical;
-    -webkit-line-clamp: 3;
-    overflow: hidden;
-}
-
-.box9 .content li img {
-    width: 4vw;
-    height: 2.5781vw;
-    margin-right: 0.2rem;
-}
+.box9 .title {
+  height: 1.5rem;
+  background: url(../../images/stationGroup/title.png) no-repeat;
+  padding-left: 1.8rem;
+}
+#container {
+  width: 100%;
+  /* margin: 100px auto; */
+  position: relative;
+  height: 100%;
+  overflow: hidden;
+}
+.box9 .content li {
+  display: flex;
+  margin: 0.5rem;
+  margin-bottom: 0;
+  margin-top: 0.2rem;
+  position: relative;
+}
+#list-wrapper {
+  position: relative;
+}
+.box9 .content li:nth-child(1)::after,
+.box9 .content li:nth-child(2)::after,
+.box9 .content li:nth-child(3)::after {
+  content: "01";
+  position: absolute;
+  width: 1rem;
+  color: #ccc;
+  padding-left: 0.1rem;
+  background: url(../../images/stationGroup/tc1.png) no-repeat;
+  top: 0.3rem;
+  background-size: contain;
+}
+
+.box9 .content li:nth-child(2)::after {
+  content: "02";
+}
+
+.box9 .content li:nth-child(3)::after {
+  content: "03";
+}
+
+.box9 .content li .info {
+  overflow: hidden;
+  color: #ccc;
+}
+
+.box9 .content li .info h5 {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-size: 0.2rem;
+  margin-bottom: 0.1rem;
+  color: #c0d6f9;
+}
+
+.box9 .content li .info p {
+  /* -webkit-box-orient: vertical;
+    -webkit-line-clamp: 3;
+    overflow: hidden; */
+  color: #999fa7;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  overflow: hidden;
+  /* autoprefixer: ignore next */
+  -webkit-box-orient: vertical;
+}
+
+.box9 .content li img {
+  width: 4vw;
+  height: 2.5781vw;
+  margin-right: 0.2rem;
+}

+ 130 - 80
spring-cloud/server-page/src/main/resources/static/testEcharts/test/components/test9/test9.html

@@ -1,80 +1,130 @@
-<div class="box9 box" data-name='test9'>
-    <div class="toolBox">
-        <span class="fit"></span>
-        <span class="close"></span>
-    </div>
-    <div class="tool">
-        <div class="title bgTitle2">
-            <h2>热闹文章排行</h2>
-        </div>
-    </div>
-    <div class="test-box">
-        <div class="content">
-            <!-- <div class="noData">暂无信息</div> -->
-
-            <!-- 热闹文章排行 -->
-            <ul>
-                <li>
-                    <div>
-                        <img src="../images/img_01.jpg" alt="">
-                    </div>
-                    <div class="info">
-                        <h5>[重庆园博园] —— 科普盛宴,精彩纷呈</h5>
-                        <p>确保工程质量的技术组织措施 为保证 本工程质量,我司项目经理部将组织全体人员,科学 合理地对建筑装修、电气、综合布线、给排水等工程 的功能和效果,进行合理计划、组织</p>
-                    </div>
-                </li>
-                <li>
-                    <div>
-                        <img src="../images/img_01.jpg" alt="">
-                    </div>
-                    <div class="info">
-                        <h5>[重庆园博园] —— 科普盛宴,精彩纷呈</h5>
-                        <p>确保工程质量的技术组织措施 为保证 本工程质量,我司项目经理部将组织全体人员,科学 合理地对建筑装修、电气、综合布线、给排水等工程 的功能和效果,进行合理计划、组织</p>
-                    </div>
-                </li>
-                <li>
-                    <div>
-                        <img src="../images/img_01.jpg" alt="">
-                    </div>
-                    <div class="info">
-                        <h5>[重庆园博园] —— 科普盛宴,精彩纷呈</h5>
-                        <p>确保工程质量的技术组织措施 为保证 本工程质量,我司项目经理部将组织全体人员,科学 合理地对建筑装修、电气、综合布线、给排水等工程 的功能和效果,进行合理计划、组织</p>
-                    </div>
-                </li>
-                <li>
-                    <div>
-                        <img src="../images/img_01.jpg" alt="">
-                    </div>
-                    <div class="info">
-                        <h5>[重庆园博园] —— 科普盛宴,精彩纷呈</h5>
-                        <p>确保工程质量的技术组织措施 为保证 本工程质量,我司项目经理部将组织全体人员,科学 合理地对建筑装修、电气、综合布线、给排水等工程 的功能和效果,进行合理计划、组织</p>
-                    </div>
-                </li>
-            </ul>
-        </div>
-    </div>
-    <div class="panel-footer"></div>
-
-</div>
-
-
-<!-- 工具弹框 -->
-<div class="tools" style="display: none;">
-
-    <div class="containerTool test9Toll">
-        <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="box9 box" data-name="test9">
+  <div class="toolBox">
+    <span class="fit"></span>
+    <span class="close"></span>
+  </div>
+  <div class="tool">
+    <div class="title bgTitle2">
+      <h2>热闹文章排行</h2>
+    </div>
+  </div>
+  <div class="test-box">
+    <div class="content" id="container">
+      <!-- <div class="noData">暂无信息</div> -->
+      <div id="list-wrapper" style="top: 0">
+        <!-- 热闹文章排行 -->
+        <ul class="notice-list" id="notice-list">
+          <li>
+            <div>
+              <img src="../images/img_01.jpg" alt="" />
+            </div>
+            <div class="info">
+
+              <h5>重庆园博园 —— 科普盛宴,精彩纷呈</h5>
+              <p>
+                确保工程质量的技术组织措施 为保证
+                本工程质量,我司项目经理部将组织全体人员,科学
+                合理地对建筑装修、电气、综合布线、给排水等工程
+                的功能和效果,进行合理计划、组织
+              </p>
+            </div>
+          </li>
+          <li>
+            <div>
+              <img src="../images/img_01.jpg" alt="" />
+            </div>
+            <div class="info">
+              <h5>[重庆园博园] —— 科普盛宴,精彩纷呈</h5>
+              <p>
+                确保工程质量的技术组织措施 为保证
+                本工程质量,我司项目经理部将组织全体人员,科学
+                合理地对建筑装修、电气、综合布线、给排水等工程
+                的功能和效果,进行合理计划、组织
+              </p>
+            </div>
+          </li>
+          <li>
+            <div>
+              <img src="../images/img_01.jpg" alt="" />
+            </div>
+            <div class="info">
+              <h5>[重庆园博园] —— 科普盛宴,精彩纷呈</h5>
+              <p>
+                确保工程质量的技术组织措施 为保证
+                本工程质量,我司项目经理部将组织全体人员,科学
+                合理地对建筑装修、电气、综合布线、给排水等工程
+                的功能和效果,进行合理计划、组织
+              </p>
+            </div>
+          </li>
+          <li>
+            <div>
+              <img src="../images/img_01.jpg" alt="" />
+            </div>
+            <div class="info">
+              <h5>[重庆园博园] —— 科普盛宴,精彩纷呈</h5>
+              <p>
+                确保工程质量的技术组织措施 为保证
+                本工程质量,我司项目经理部将组织全体人员,科学
+                合理地对建筑装修、电气、综合布线、给排水等工程
+                的功能和效果,进行合理计划、组织
+              </p>
+            </div>
+          </li>
+        </ul>
+        <ul class="notice-list" id="notice-list-2"></ul>
+      </div>
+    </div>
+  </div>
+  <div class="panel-footer"></div>
+</div>
+
+<!-- 工具弹框 -->
+<div class="tools" style="display: none">
+  <div class="containerTool test9Toll">
+    <ul>
+      <li>
+        <span>宽度:</span>
+        <input class="setWidth" type="text" />
+        <span id="validateAge" class="regValidate"></span>
+      </li>
+      <li>
+        <span>高度:</span>
+        <input class="setHeight" type="text" />
+      </li>
+    </ul>
+    <!-- 确定 -->
+    <button class="fixBtn toolBtn">确定</button>
+    <button class="offBtn toolBtn">取消</button>
+  </div>
+</div>
+<script>
+  var ROLL_SPEED = 10;
+  var noticeList1 = document.getElementById("notice-list");
+  var noticeList2 = document.getElementById("notice-list-2");
+  var listWrapper = document.getElementById("list-wrapper");
+  noticeList2.innerHTML = noticeList1.innerHTML;
+
+  var timer = setInterval(rollStart, ROLL_SPEED);
+  function rollStart() {
+    if (Math.abs(_subStr(listWrapper.style.top)) >= noticeList1.clientHeight) {
+      listWrapper.style.top = "0px";
+    } else {
+      var top = listWrapper.style.top;
+      listWrapper.style.top = _subStr(top) - 1 + "px";
+    }
+  }
+  $(".notice-list").mouseover(function () {
+    clearInterval(timer);
+  });
+  $(".notice-list").mouseout(function () {
+    timer = setInterval(rollStart, ROLL_SPEED);
+  });
+  // 截取px前数值
+  function _subStr(str) {
+    var index = str.indexOf("px");
+    if (index > -1) {
+      return parseFloat(str.substr(0, index + 1));
+    }
+  }
+</script>

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

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

BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/css/modules/layer/default/图层 789.png


BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/css/modules/layer/default/色相饱和度1854.png


BIN
spring-cloud/server-page/src/main/resources/static/testEcharts/test/font/RUIZIZHENYANTIMIANFEISHANGYONG-2.TTF


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

@@ -134,7 +134,7 @@ iframe {
   /* width: 50%;
   height: 50%; */
   position: absolute;
-  left: 0;
+  left: -50%;
   top: 0;
   z-index: 9999;
 }

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

@@ -25,3 +25,11 @@ function getDateString(date) {
 
     return `${year}年${month}月${day}日 ${hour}:${minute}:${second}`;
 }
+
+function getDateString2(date) {
+  const dt = new Date(date)
+  var year = dt.getFullYear().toString().padStart(4, "0");
+  var month = (dt.getMonth() + 1).toString().padStart(2, "0");
+  var day = dt.getDate().toString().padStart(2, "0");
+  return `${year}年${month}月${day}日`;
+}

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

@@ -877,7 +877,7 @@ ul.subject li .previewBox {
     position: absolute;
     left: 0;
     top: 0;
-    background: rgba(0, 0, 0, 0.4);
+    background: rgba(0, 0, 0, 0.7);
     z-index: 99;
 }
 

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

@@ -1,4 +1,4 @@
-const basicUrl = 'http://23.37.100.80:8084/basic';
+const basicUrl = 'http://23.37.100.87:8084/basic';
 // const basicUrl = "http://192.168.0.100:8084/basic";
 
 // http://23.37.100.87:8084
@@ -198,4 +198,96 @@ function debounce(func, delay = 50) {
             func.apply(this, ...args);
         }, delay);
     };
-}
+}
+
+// 动画
+function animateScrool (option) {
+  const defatult = {
+    duration: 500, // 每次移动的时间
+    total: 1000, // 总时间
+    begin: {},
+    end: {}
+  }
+  option = Object.assign({}, defatult, option);
+  let timer = null;
+  // 移动总次数
+  const number = Math.ceil(option.total / option.duration);
+  // 当前移动次数
+  let count = 0;
+  // 移动属性的总距离
+  const distance = {};
+  // 每次属性移动的距离
+  const everyDistance = {};
+  // 记录每次移动的状态
+  const curData = option.begin;
+  for (const key in option.begin) {
+    distance[key] = option.end[key] - option.begin[key];
+    everyDistance[key] = distance[key] / number;
+  }
+  // 开始动画
+  const start = () => {
+    if (timer || count === number) {
+      return
+    }
+    option.onStart && option.onStart(curData)
+    timer = setInterval(() => {
+      count++;
+      for (const key in curData) {
+        if (count === number) { // 最后一次运动
+          curData[key] = option.end[key];
+        } else {
+          curData[key] += everyDistance[key];
+        }
+      }
+      option.startMove && option.startMove(curData);
+      if (count === number) {
+        stop();
+        option.stopMove && option.stopMove(curData)
+      }
+    }, option.duration);
+  }
+
+  const stop = () => {
+    clearInterval(timer);
+    timer = null;
+  }
+
+  return {
+    start,
+    stop
+  }
+}
+
+const scroll = (dom,curTop,flage) => {
+  if(flage){
+    return
+  }
+  const option = {
+    duration: 16,
+    total: 8000,
+    begin: {
+      top: curTop
+    },
+    end: {
+      top: dom.height()
+    },
+    startMove (curData) {
+      curTop = curData.top;
+      dom.scrollTop(curTop)
+    },
+    stopMove () {
+      dom.scrollTop(0)
+      curTop = 0;
+      scroll(dom,0,flage)
+    }
+  }
+  const animate = animateScrool(option);
+   dom.hover(() => {
+    animate.stop();
+  },() => {
+    animate.start();
+  })
+  animate.start();
+   return animate;
+ }
+

+ 13 - 45
spring-cloud/server-page/src/main/resources/static/testEcharts/test/main/js/main.js

@@ -145,15 +145,15 @@ $.ajax({
 
 // 设备状态
 // $.ajax({
-//   url: DH + 'queryData/queryDeviceParam',
-//   data: {
-//       "urlCode": 'DH_004'
-//   },
+//   url: ZQURL + '/getStatAllData',
+// //   data: {
+// //     dateType: 3
+// // },
 //   success: function(res) {
-//       console.log('设备状态', res);
+//       console.log('getStatAllData', res);
 //   },
 //   error: function(err) {
-//       console.log('---设备状态-----------超时');
+//       console.log('---getStatAllData-----------超时');
 //   }
 // });
 
@@ -176,6 +176,10 @@ $.ajax({
       // });
 
 
+
+
+
+
 // 监控设备状态
 $.ajax({
   url: DH + 'queryData/queryMonitorState',
@@ -264,49 +268,13 @@ $(`.sf5`).load('./springFrame5.html', _ => {
 // .box42:地图
 // .box61:控制中心(态势总览)
 $('.left-tabBar').click(function() { // 切换到态势总览
-
-  $('.box42').css('visibility','hidden');
+    $('.box42').css('visibility','hidden');
   $('.box61').css('visibility','visible');
-
-    // box61L = $('.box61').position().left;
-    // box61T = $('.box61').position().top;
-
-    // if (!box42T) {
-    //     box42T = $(".box42").position().top;
-    // }
-    // if (!box42L) {
-    //     box42L = $(".box42").position().left;
-    // }
-    // $(".box42").css({
-    //     'opacity': 1,
-    //     'left': box42L,
-    //     'top': box42T
-    // });
-    // $(".box61").css({
-    //     'opacity': 0,
-    //     'left': -$(".box61").width(),
-    //     'top': -$(".box61").height()
-    // });
-
+  $('.box61').css('display','block');
 })
 
 $('.right-tabBar').click(function() { // 切换到地图
   $('.box61').css('visibility','hidden');
   $('.box42').css('visibility','visible');
-
-
-    // box42L = $('.box42').position().left;
-    // box42T = $('.box42').position().top;
-    // if (!box61T) {
-    //     box61T = $(".box61").position().top;
-    // }
-    // if (!box61L) {
-    //     box61L = $(".box61").position().left;
-    // }
-    // $(".box42").css({
-    //     'opacity': 0,
-    //     'left': -$(".box42").width(),
-    //     'top': -$(".box42").height()
-    // });
-    // $(".box61").css({ 'opacity': 1, 'left': box61L, 'top': box61T });
+  $('.box61').css('display','none');
 })

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

@@ -328,11 +328,11 @@
         </div>
     </div>
 
-    <div id="ThreeJS62" class="roomThree roomThree62" style="visibility:hidden"></div>
+    <!-- <div id="ThreeJS62" class="roomThree roomThree62" style="visibility:hidden"></div>
     <div id="ThreeJS63" class="roomThree roomThree63" style="visibility:hidden"></div>
     <div id="ThreeJS64" class="roomThree roomThree64" style="visibility:hidden"></div>
     <div id="ThreeJS65" class="roomThree roomThree65" style="visibility:hidden"></div>
-    <div id="ThreeJS66" class="roomThree roomThree66" style="visibility:hidden"></div> 
+    <div id="ThreeJS66" class="roomThree roomThree66" style="visibility:hidden"></div>  -->
 
     <div class="bossMeng"></div>
     <script src="../components/test8/graphData.js"></script>

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

@@ -1,483 +1,506 @@
 <style>
-    .springFrame1 {
-        z-index: 99999;
-    }
-    
-    .springFrame1 .content ul li {
-        height: 0.6rem;
-    }
-    
-    .springFrame1 .content ul li h3,
-    .springFrame1 .content ul li p {
-        font-size: 0.1rem !important;
-    }
+  .springFrame1 {
+    z-index: 99999;
+  }
+
+  .springFrame1 .content ul li {
+    height: 0.6rem;
+  }
+
+  .springFrame1 .content ul li h3,
+  .springFrame1 .content ul li p {
+    font-size: 0.1rem !important;
+  }
 </style>
 <!-- 局本级 -->
 
 <div class="springFrame springFrame1">
-    <div class="springFrameTitle">
-        <h2>局本级网络安全态势</h2>
+  <div class="springFrameTitle">
+    <h2>局本级网络安全态势</h2>
+  </div>
+  <!-- style="z-index: 3; left: 130px; top: 912px; width: 4133px; height: 1685px;" -->
+  <div class="box11 box active" data-name="test11" data-id="80"
+    style="z-index: 3; left: 130px; top: 912px; width: 4133px; height: 1685px;">
+    <div class="toolBox">
+      <span class="fit"></span>
+      <span class="close"></span>
     </div>
-    <!-- style="z-index: 3; left: 130px; top: 912px; width: 4133px; height: 1685px;" -->
-    <div class="box11 box active" data-name="test11" data-id="80" style="z-index: 3; left: 130px; top: 912px; width: 4133px; height: 1685px;">
-        <div class="toolBox">
-            <span class="fit"></span>
-            <span class="close"></span>
-        </div>
-        <div class="tool">
-            <div class="title bgTitle">
-                <h2>数据统计</h2>
+    <div class="tool">
+      <div class="title bgTitle">
+        <h2>数据统计</h2>
+      </div>
+    </div>
+    <div class="test-box">
+      <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>
-        <div class="test-box">
-            <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 class="count-item item2">
+              <h3>安全设备</h3>
+              <div class="info-box">
+                <span class="num">3</span>
+                <span>台</span>
+              </div>
             </div>
+          </div>
         </div>
-        <div class="panel-footer"></div>
+      </div>
     </div>
+    <div class="panel-footer"></div>
+  </div>
 
 
-    <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>
-        </div>
-        <div class="tool">
-            <div class="title bgTitle">
-                <h2>局门户网站</h2>
+  <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>
+    </div>
+    <div class="tool">
+      <div class="title bgTitle">
+        <h2>局门户网站</h2>
+      </div>
+    </div>
+    <div class="test-box">
+      <div class="content">
+        <!-- 数据统计 -->
+        <div class="dataCount">
+          <div class="dataCount_box">
+            <div class="left">
+              <img src="../images/networkSecurity/tu9.png" alt="">
+              <div class="spanBox">
+                <p class="txt">安全状态</p>
+                <p class="num">良好</p>
+              </div>
             </div>
-        </div>
-        <div class="test-box">
-            <div class="content">
-                <!-- 数据统计 -->
-                <div class="dataCount">
-                    <div class="dataCount_box">
-                        <div class="left">
-                            <img src="../images/networkSecurity/tu9.png" alt="">
-                            <div class="spanBox">
-                                <p class="txt">安全状态</p>
-                                <p class="num">良好</p>
-                            </div>
-                        </div>
-                        <div class="right">
-                            <img src="../images/networkSecurity/tu10.png" alt="">
-                            <div class="spanBox">
-                                <p class="txt">高危漏洞</p>
-                                <p class="num">0</p>
-                            </div>
-                        </div>
-                    </div>
-                </div>
+            <div class="right">
+              <img src="../images/networkSecurity/tu10.png" alt="">
+              <div class="spanBox">
+                <p class="txt">高危漏洞</p>
+                <p class="num">0</p>
+              </div>
             </div>
+          </div>
         </div>
-        <div class="panel-footer"></div>
-
+      </div>
     </div>
+    <div class="panel-footer"></div>
 
-    <!-- left: 162px; top: 4162px; -->
-    <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>
-        </div>
-        <div class="tool">
-            <div class="title bgTitle">
-                <h2>直属单位门户网站安全态势</h2>
-            </div>
-        </div>
-        <div class="test-box">
-            <div class="content">
-                <!-- 数据统计 -->
-                <div class="dataCount">
-                    <div class="dataCount_box">
-                        <div class="left">
-                            <img src="../images/networkSecurity/tu9.png" alt="">
-                            <div class="spanBox">
-                                <p class="txt">安全状态</p>
-                                <p class="num">良好</p>
-                            </div>
-                        </div>
-                        <div class="right">
-                            <img src="../images/networkSecurity/tu10.png" alt="">
-                            <div class="spanBox">
-                                <p class="txt">高危漏洞</p>
-                                <p class="num">0</p>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-                <div class="floor-dist" _echarts_instance_="ec_1650358105783" style="-webkit-tap-highlight-color: transparent; user-select: none; position: relative;">
-                    <div style="position: relative; width: 640px; height: 10px; padding: 0px; margin: 0px; border-width: 0px;">
-                        <canvas data-zr-dom-id="zr_0" width="640" height="10" style="position: absolute; left: 0px; top: 0px; width: 640px; height: 10px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas>
-                    </div>
-                    <div></div>
-                </div>
-            </div>
-        </div>
-        <div class="panel-footer"></div>
+  </div>
 
+  <!-- left: 162px; top: 4162px; -->
+  <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>
     </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: 892px; height: 1984px; width: 4848px;">
-        <div class="toolBox">
-            <span class="fit"></span>
-            <span class="close"></span>
-        </div>
-        <div class="tool">
-            <div class="title bgTitle">
-                <h2>终端安全态势</h2>
+    <div class="tool">
+      <div class="title bgTitle">
+        <h2>直属单位门户网站安全态势</h2>
+      </div>
+    </div>
+    <div class="test-box">
+      <div class="content">
+        <!-- 数据统计 -->
+        <div class="dataCount">
+          <div class="dataCount_box">
+            <div class="left">
+              <img src="../images/networkSecurity/tu9.png" alt="">
+              <div class="spanBox">
+                <p class="txt">安全状态</p>
+                <p class="num">良好</p>
+              </div>
             </div>
-        </div>
-        <div class="test-box">
-            <div class="content active">
-                <!-- 终端安全态势 -->
-                <div class="dataCount">
-                    <div class="dataCount_box">
-                        <div class="left">
-                            <div class="one">
-                                <img src="../images/networkSecurity/tu2.png" alt="">
-                                <div class="spanBox">
-                                    <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="num">0</p>
-                                </div>
-                            </div>
-                        </div>
-                        <div class="right">
-                            <div class="floor-dist" _echarts_instance_="ec_1650358904595" style="-webkit-tap-highlight-color: transparent; user-select: none; position: relative;">
-                                <div style="position: relative; width: 320px; height: 160px; padding: 0px; margin: 0px; border-width: 0px; cursor: default;">
-                                    <canvas data-zr-dom-id="zr_0" width="320" height="160" style="position: absolute; left: 0px; top: 0px; width: 320px; height: 160px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas>
-                                </div>
-                                <div></div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
+            <div class="right">
+              <img src="../images/networkSecurity/tu10.png" alt="">
+              <div class="spanBox">
+                <p class="txt">高危漏洞</p>
+                <p class="num">0</p>
+              </div>
             </div>
+          </div>
+        </div>
+        <div class="floor-dist" _echarts_instance_="ec_1650358105783"
+          style="-webkit-tap-highlight-color: transparent; user-select: none; position: relative;">
+          <div style="position: relative; width: 640px; height: 10px; padding: 0px; margin: 0px; border-width: 0px;">
+            <canvas data-zr-dom-id="zr_0" width="640" height="10"
+              style="position: absolute; left: 0px; top: 0px; width: 640px; height: 10px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas>
+          </div>
+          <div></div>
         </div>
-        <div class="panel-footer"></div>
+      </div>
     </div>
+    <div class="panel-footer"></div>
 
+  </div>
 
-    <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>
-        </div>
-        <div class="tool">
-            <div class="title bgTitle">
-                <h2>攻击类型</h2>
+  <!-- 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: 892px; height: 1984px; width: 4848px;">
+    <div class="toolBox">
+      <span class="fit"></span>
+      <span class="close"></span>
+    </div>
+    <div class="tool">
+      <div class="title bgTitle">
+        <h2>终端安全态势</h2>
+      </div>
+    </div>
+    <div class="test-box">
+      <div class="content active">
+        <!-- 终端安全态势 -->
+        <div class="dataCount">
+          <div class="dataCount_box">
+            <div class="left">
+              <div class="one">
+                <img src="../images/networkSecurity/tu2.png" alt="">
+                <div class="spanBox">
+                  <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="num">0</p>
+                </div>
+              </div>
             </div>
-
+            <div class="right">
+              <div class="floor-dist" _echarts_instance_="ec_1650358904595"
+                style="-webkit-tap-highlight-color: transparent; user-select: none; position: relative;">
+                <div
+                  style="position: relative; width: 320px; height: 160px; padding: 0px; margin: 0px; border-width: 0px; cursor: default;">
+                  <canvas data-zr-dom-id="zr_0" width="320" height="160"
+                    style="position: absolute; left: 0px; top: 0px; width: 320px; height: 160px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas>
+                </div>
+                <div></div>
+              </div>
+            </div>
+          </div>
         </div>
-        <div class="test-box">
-            <div class="content">
-                <!-- 攻击类型 -->
-                <div class="container active">
-                    <div class="progress">
-                        <div class="proDesc"><i style="background-color: #ccc;"></i> 远程控制 》 恶意IP</div>
-                        <span style="width: 20%;"><span>20%</span></span>
-                        <span class="txt"><i style="color: #ccc;">202</i> 条</span>
-                    </div>
-
-                    <div class="progress">
-                        <div class="proDesc"><i style="background-color: green;"></i>远程控制 》 恶意IP</div>
-                        <span class="green" style="width: 40%;"><span>40%</span></span>
-                        <span class="txt"><i style="color: green;">230</i> 条</span>
-                    </div>
+      </div>
+    </div>
+    <div class="panel-footer"></div>
+  </div>
 
-                    <div class="progress">
-                        <div class="proDesc"><i style="background-color: orange;"></i>远程控制 》 恶意IP</div>
-                        <span class="orange" style="width: 60%;"><span>60%</span></span>
-                        <span class="txt"><i style="color: orange;">40</i>条</span>
-                    </div>
 
-                    <div class="progress">
-                        <div class="proDesc"><i style="background-color: red;"></i>远程控制 》 恶意IP</div>
-                        <span class="red" style="width: 80%;"><span>80%</span></span>
-                        <span class="txt"><i style="color: red;">210</i>条</span>
-                    </div>
+  <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>
+    </div>
+    <div class="tool">
+      <div class="title bgTitle">
+        <h2>攻击类型</h2>
+      </div>
 
-                    <div class="progress">
-                        <div class="proDesc"><i style="background-color: blue;"></i>远程控制 》 恶意IP</div>
-                        <span class="blue" style="width: 100%;"><span>100%</span></span>
-                        <span class="txt"><i style="color: blue;">230</i>条</span>
-                    </div>
-                </div>
-            </div>
+    </div>
+    <div class="test-box">
+      <div class="content">
+        <!-- 攻击类型 -->
+        <div class="container active">
+          <div class="progress">
+            <div class="proDesc"><i style="background-color: #ccc;"></i> 远程控制 》 恶意IP</div>
+            <span style="width: 20%;"><span>20%</span></span>
+            <span class="txt"><i style="color: #ccc;">202</i> 条</span>
+          </div>
+
+          <div class="progress">
+            <div class="proDesc"><i style="background-color: green;"></i>远程控制 》 恶意IP</div>
+            <span class="green" style="width: 40%;"><span>40%</span></span>
+            <span class="txt"><i style="color: green;">230</i> 条</span>
+          </div>
+
+          <div class="progress">
+            <div class="proDesc"><i style="background-color: orange;"></i>远程控制 》 恶意IP</div>
+            <span class="orange" style="width: 60%;"><span>60%</span></span>
+            <span class="txt"><i style="color: orange;">40</i>条</span>
+          </div>
+
+          <div class="progress">
+            <div class="proDesc"><i style="background-color: red;"></i>远程控制 》 恶意IP</div>
+            <span class="red" style="width: 80%;"><span>80%</span></span>
+            <span class="txt"><i style="color: red;">210</i>条</span>
+          </div>
+
+          <div class="progress">
+            <div class="proDesc"><i style="background-color: blue;"></i>远程控制 》 恶意IP</div>
+            <span class="blue" style="width: 100%;"><span>100%</span></span>
+            <span class="txt"><i style="color: blue;">230</i>条</span>
+          </div>
         </div>
-        <div class="panel-footer"></div>
+      </div>
     </div>
+    <div class="panel-footer"></div>
+  </div>
 
 
-    <div class="box16 box" data-name="test16" data-id="85" style="z-index: 5; left: 10400px; top: 4629px; width: 2384px; height: 1604px;">
-        <div class="toolBox">
-            <span class="fit"></span>
-            <span class="close"></span>
-        </div>
-        <div class="tool">
-            <div class="title bgTitle">
-                <h2>网络安全应急流程</h2>
-            </div>
-        </div>
-        <div class="test-box">
-            <div class="content">
-                <!-- 网络安全应急流程 -->
-                <img src="../images/networkSecurity/tu.png" alt="">
-                <!-- <div class="floor-dist">
+  <div class="box16 box" data-name="test16" data-id="85"
+    style="z-index: 5; left: 10400px; top: 4629px; width: 2384px; height: 1604px;">
+    <div class="toolBox">
+      <span class="fit"></span>
+      <span class="close"></span>
+    </div>
+    <div class="tool">
+      <div class="title bgTitle">
+        <h2>网络安全应急流程</h2>
+      </div>
+    </div>
+    <div class="test-box">
+      <div class="content">
+        <!-- 网络安全应急流程 -->
+        <img src="../images/networkSecurity/tu.png" alt="">
+        <!-- <div class="floor-dist">
   </div> -->
-            </div>
-        </div>
-        <div class="panel-footer"></div>
+      </div>
     </div>
+    <div class="panel-footer"></div>
+  </div>
 
 
-    <div class="box17 box" data-name="test17" data-id="86" style="z-index: 6; left: 12834px; top: 4625px; width: 2420px; height: 1604px;">
-        <div class="toolBox">
-            <span class="fit"></span>
-            <span class="close"></span>
-        </div>
-        <div class="tool">
-            <div class="title bgTitle">
-                <h2>应急保障组成员信息</h2>
+  <div class="box17 box" data-name="test17" data-id="86"
+    style="z-index: 6; left: 12834px; top: 4625px; width: 2420px; height: 1604px;">
+    <div class="toolBox">
+      <span class="fit"></span>
+      <span class="close"></span>
+    </div>
+    <div class="tool">
+      <div class="title bgTitle">
+        <h2>应急保障组成员信息</h2>
+      </div>
+    </div>
+    <div class="test-box">
+      <div class="content">
+        <!-- 应急保障组成员信息 -->
+        <ul>
+          <li>
+            <img src="../images/networkSecurity/kuang.png" alt="">
+            <div class="desc">
+              <h3>局科技信息处</h3>
+              <p>联系人:林老师</p>
             </div>
-        </div>
-        <div class="test-box">
-            <div class="content">
-                <!-- 应急保障组成员信息 -->
-                <ul>
-                    <li>
-                        <img src="../images/networkSecurity/kuang.png" alt="">
-                        <div class="desc">
-                            <h3>局科技信息处</h3>
-                            <p>联系人:林老师</p>
-                        </div>
-                    </li>
-                    <li>
-                        <img src="../images/networkSecurity/kuang.png" alt="">
-                        <div class="desc">
-                            <h3>局科技信息处</h3>
-                            <p>联系人:林老师</p>
-                        </div>
-                    </li>
-                    <li>
-                        <img src="../images/networkSecurity/kuang.png" alt="">
-                        <div class="desc">
-                            <h3>局科技信息处</h3>
-                            <p>联系人:林老师</p>
-                        </div>
-                    </li>
-                    <li>
-                        <img src="../images/networkSecurity/kuang.png" alt="">
-                        <div class="desc">
-                            <h3>局科技信息处</h3>
-                            <p>联系人:林老师</p>
-                        </div>
-                    </li>
-                </ul>
+          </li>
+          <li>
+            <img src="../images/networkSecurity/kuang.png" alt="">
+            <div class="desc">
+              <h3>局科技信息处</h3>
+              <p>联系人:林老师</p>
             </div>
-        </div>
-        <div class="panel-footer"></div>
+          </li>
+          <li>
+            <img src="../images/networkSecurity/kuang.png" alt="">
+            <div class="desc">
+              <h3>局科技信息处</h3>
+              <p>联系人:林老师</p>
+            </div>
+          </li>
+          <li>
+            <img src="../images/networkSecurity/kuang.png" alt="">
+            <div class="desc">
+              <h3>局科技信息处</h3>
+              <p>联系人:林老师</p>
+            </div>
+          </li>
+        </ul>
+      </div>
     </div>
+    <div class="panel-footer"></div>
+  </div>
 
 
-    <div class="fx" style="top: 15%;">
-        <p>安全等级</p>
-        <h2>优</h2>
-    </div>
-    <div class="dj" style="bottom: 5%;">
-        <p>风险系数</p>
-        <h2>低</h2>
-    </div>
+  <div class="fx" style="top: 15%;">
+    <p>安全等级</p>
+    <h2>优</h2>
+  </div>
+  <div class="dj" style="bottom: 5%;">
+    <p>风险系数</p>
+    <h2>低</h2>
+  </div>
 
-    <div class="frameClose">X</div>
+  <div class="frameClose">X</div>
 </div>
 
 <script>
-    const dom13 = document.querySelector('.springFrame1 .box13 .floor-dist');
-    const testDom13 = document.querySelector('.springFrame1 .box13');
-    const dom14 = document.querySelector(".springFrame1 .box14 .floor-dist");
-    const testDom14 = document.querySelector(".springFrame1 .box14");
-    // 数据统计
+  const dom13 = document.querySelector('.springFrame1 .box13 .floor-dist');
+  const testDom13 = document.querySelector('.springFrame1 .box13');
+  const dom14 = document.querySelector(".springFrame1 .box14 .floor-dist");
+  const testDom14 = document.querySelector(".springFrame1 .box14");
+  // 数据统计
+  function sp1Ajax11() {
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getSafetyInfoByMonth",
-        data: {
-            orgType: 3
-        },
-        success: function(res) {
-            console.log('springFrame1 数据统计', res);
-            const result = res.result;
-            if (!result) {
-                $('.springFrame1 .box11 .item1 .num').html(0)
-                $('.springFrame1 .box11 .item2 .num').html(0)
-            } else {
-                $('.springFrame1 .box11 .item1 .num').html(result.sys_number)
-                $('.springFrame1 .box11 .item2 .num').html(result.equipment_number)
-            }
-        },
-        error: function() {
-            console.log('springFrame1 数据统计超时');
+    url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getSafetyInfoByMonth",
+    data: {
+      orgType: 3
+    },
+    success: function (res) {
+      console.log('springFrame1 数据统计', res);
+      const result = res.result;
+      if (!result) {
+        $('.springFrame1 .box11 .item1 .num').html(0)
+        $('.springFrame1 .box11 .item2 .num').html(0)
+      } else {
+        $('.springFrame1 .box11 .item1 .num').html(result.sys_number)
+        $('.springFrame1 .box11 .item2 .num').html(result.equipment_number)
+      }
+    },
+    error: function () {
+      console.log('springFrame1 数据统计超时');
+    }
+  });
+  }
+ 
+  // 局本级门户网站
+  function sp1Ajax12() {
+    $.ajax({
+      url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getWebSafetyStatusByOrg",
+      data: {
+        orgType: 3
+      },
+      success: function (res) {
+        const result = res.result;
+        console.log(result, '优秀');
+        if (!result.length) {
+          $('.springFrame1 .box12 .dataCount_box').html('暂无数据')
+          $('.springFrame1 .box13 .dataCount_box').html('暂无数据')
+          // $('.springFrame1 .box12 .content').append('<div class="noData">暂无数据</div>')
+          return
+        }
+        let status = '优秀'
+        let status2 = '优秀'
+        if (result.safetyStatusFirst === 1) {
+          status = '优秀';
+          status2 = '优秀';
+
+        } else if (result.safetyStatusFirst === 2) {
+          status = '良好'
+          status2 = '良好'
+        } else if (result.safetyStatusFirst === 3) {
+          status = '一般';
+          status2 = '一般'
+        } else {
+          status = '恶劣'
+          status2 = '恶劣'
         }
-    });
-
 
-    // 局本级门户网站
-    $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/safetyInfo/getWebSafetyStatusByOrg",
-        data: {
-            orgType: 3
-        },
-        success: function(res) {
-            const result = res.result;
-            console.log(result, '优秀');
-            if (!result.length) {
-                $('.springFrame1 .box12 .dataCount_box').html('暂无数据')
-                $('.springFrame1 .box13 .dataCount_box').html('暂无数据')
-                    // $('.springFrame1 .box12 .content').append('<div class="noData">暂无数据</div>')
-                return
-            }
-            let status = '优秀'
-            let status2 = '优秀'
-            if (result.safetyStatusFirst === 1) {
-                status = '优秀';
-                status2 = '优秀';
-
-            } else if (result.safetyStatusFirst === 2) {
-                status = '良好'
-                status2 = '良好'
-            } else if (result.safetyStatusFirst === 3) {
-                status = '一般';
-                status2 = '一般'
-            } else {
-                status = '恶劣'
-                status2 = '恶劣'
-            }
-
-            $('.springFrame1 .box12 .left .num').html(status);
-            $('.springFrame1 .box12 .right .num').html(result.highRiskNumberFirst);
-
-
-            $('.springFrame1 .box13 .left .num').html(status2);
-            $('.springFrame1 .box13 .right .num').html(result.highRiskNumberSecond);
-
-            const newArr = result.webAttackTypeList.map(item => {
-                return {
-                    value: item.attack_count,
-                    name: item.attack_type
-                }
-            });
-            setCharts13(dom13, testDom13, newArr);
+        $('.springFrame1 .box12 .left .num').html(status);
+        $('.springFrame1 .box12 .right .num').html(result.highRiskNumberFirst);
 
-        },
-        error: function(err) {
-            console.log("-dfdf-------------超时");
-        },
-    });
 
+        $('.springFrame1 .box13 .left .num').html(status2);
+        $('.springFrame1 .box13 .right .num').html(result.highRiskNumberSecond);
 
-    // 终端安全态势
-    $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/OfficeVirus/getOfficeSafetyInfo",
-        data: {
-            orgType: 3
-        },
-        success: function(res) {
-            const result = res.result;
-            console.log('终端安全态势', result);
-
-            if (!result) {
-                // $('.springFrame1 .box14 .content').append('<div class="noData">暂无数据</div>')
-                $('.springFrame1 .box14 .left .one .num').html('-');
-                $('.springFrame1 .box14 .left .tow .num').html('-');
-                return
-            }
-            $('.springFrame1 .box14 .left .one .num').html(result.infectedNumber);
-            $('.springFrame1 .box14 .left .tow .num').html(result.virusesTNumber);
-
-            const newArr = result.virus.map(item => {
-                return {
-                    value: item.virus_number,
-                    name: item.virus_name
-                }
-            });
-            console.log(newArr);
-            setCharts14(dom14, testDom14, newArr);
+        const newArr = result.webAttackTypeList.map(item => {
+          return {
+            value: item.attack_count,
+            name: item.attack_type
+          }
+        });
+        setCharts13(dom13, testDom13, newArr);
 
-        },
-        error: function(err) {
-            console.log("-终端安全态势-----------超时");
-        },
+      },
+      error: function (err) {
+        console.log("-dfdf-------------超时");
+      },
     });
+  }
 
+  // 终端安全态势
+  function sp1Ajax14() {
+    $.ajax({
+      url: "http://23.37.100.87:8084" + "/basic/OfficeVirus/getOfficeSafetyInfo",
+      data: {
+        orgType: 3
+      },
+      success: function (res) {
+        const result = res.result;
+        console.log('终端安全态势', result);
+
+        if (!result) {
+          // $('.springFrame1 .box14 .content').append('<div class="noData">暂无数据</div>')
+          $('.springFrame1 .box14 .left .one .num').html('-');
+          $('.springFrame1 .box14 .left .tow .num').html('-');
+          return
+        }
+        $('.springFrame1 .box14 .left .one .num').html(result.infectedNumber);
+        $('.springFrame1 .box14 .left .tow .num').html(result.virusesTNumber);
+
+        const newArr = result.virus.map(item => {
+          return {
+            value: item.virus_number,
+            name: item.virus_name
+          }
+        });
+        console.log(newArr);
+        setCharts14(dom14, testDom14, newArr);
+
+      },
+      error: function (err) {
+        console.log("-终端安全态势-----------超时");
+      },
+    });
+  }
 
-// 攻击类型
+  // 攻击类型
+  let sp1flag = false;
+  function sp1Ajax15() {
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/AttackType/getTopAttackType",
-        data: {
-            orgType: 3
-        },
-        success: function(res) {
-            const result = res.result;
-            console.log('攻击类型', result);
-            if (!result) {
-                return
-            }
-            const progress = result.map(item => {
-                return `
+      url: "http://23.37.100.87:8084" + "/basic/AttackType/getTopAttackType",
+      data: {
+        orgType: 3
+      },
+      success: function (res) {
+        const result = res.result;
+        console.log('攻击类型', result);
+        if (!result) {
+          return
+        }
+        const progress = result.map(item => {
+          return `
             <div class="progress">
                         <div class="proDesc"><i style="background-color: green;"></i>${item.attack_type}</div>
                         <span class="green" style="width: 40%;"><span>40%</span></span>
                         <span class="txt"><i style="color: green;">${item.attack_count}</i> 条</span>
                     </div>
             `
-            }).join('');
-
-            $('.springFrame1 .box15 .container').html(progress);
-        },
-        error: function(err) {
-            console.log("------------------------超时");
-        },
+        }).join('');
+
+        $('.springFrame1 .box15 .container').html(progress);
+        const dom = $('.springFrame1 .box15 .content');
+        setTimeout(() => {
+          scroll(dom, 0,sp1flag)
+          sp1flag = true;
+        }, 1500);
+      },
+      error: function (err) {
+        console.log("------------------------超时");
+      },
     });
+  }
 
-
-    // 应急保障组成员信息
+  // 应急保障组成员信息
+  function sp1Ajax17() {
     $.ajax({
-        url: "http://23.37.100.87:8084" + "/basic/GuaranteeGroup/getAllGuaranteeGroup",
-        success: function(res) {
-            const result = res.result;
-            console.log('应急保障组成员信息', result);
-            if (!result) {
-                return
-            }
-
-           const html = result.map(item => {
-              return `
+      url: "http://23.37.100.87:8084" + "/basic/GuaranteeGroup/getAllGuaranteeGroup",
+      success: function (res) {
+        const result = res.result;
+        console.log('应急保障组成员信息', result);
+        if (!result) {
+          return
+        }
+
+        const html = result.map(item => {
+          return `
                     <li>
                         <img src="../images/networkSecurity/kuang.png" alt="">
                         <div class="desc">
@@ -486,166 +509,165 @@
                         </div>
                     </li>
               `
-            }).join('')
-            $('.springFrame1 .box17 .content ul').html(html); 
+        }).join('')
+        $('.springFrame1 .box17 .content ul').html(html);
+      },
+      error: function (err) {
+        console.log("----应急保障组成员信息------------超时");
+      },
+    });
+  }
+
+  function setCharts13(echartDom, testDom, data = []) {
+    const defaultData = [{
+      value: 1048,
+      name: 'java攻击'
+    }, {
+      value: 735,
+      name: '协议违规'
+    }, {
+      value: 580,
+      name: '文件限制'
+    }, {
+      value: 484,
+      name: '其他'
+    }];
+
+    if (data === undefined || data.length === 0) {
+      data = defaultData;
+    }
+    let timer = null;
+    // 1实例化对象
+    const myChart = echarts.init(echartDom);
+    const option = {
+      color: [
+        "#006cff",
+        "#47BAFD",
+        "#DA8F51"
+      ],
+      tooltip: {
+        trigger: 'item'
+      },
+      legend: {
+        orient: 'vertical',
+        top: "center",
+        right: "480",
+        textStyle: {
+          color: "#fff",
+          fontSize: "100",
         },
-        error: function(err) {
-            console.log("----应急保障组成员信息------------超时");
+      },
+      series: [{
+        name: '攻击类型',
+        type: 'pie',
+        radius: ['30%', '70%'],
+        center: ["20%", "50%"],
+        avoidLabelOverlap: false,
+        label: {
+          show: false,
+          position: 'center'
         },
-    });
-
-
-
-    function setCharts13(echartDom, testDom, data = []) {
-        const defaultData = [{
-            value: 1048,
-            name: 'java攻击'
-        }, {
-            value: 735,
-            name: '协议违规'
-        }, {
-            value: 580,
-            name: '文件限制'
-        }, {
-            value: 484,
-            name: '其他'
-        }];
-
-        if (data === undefined || data.length === 0) {
-            data = defaultData;
-        }
-        let timer = null;
-        // 1实例化对象
-        const myChart = echarts.init(echartDom);
-        const option = {
-            color: [
-                "#006cff",
-                "#47BAFD",
-                "#DA8F51"
-            ],
-            tooltip: {
-                trigger: 'item'
-            },
-            legend: {
-                orient: 'vertical',
-                top: "center",
-                right: "480",
-                textStyle: {
-                    color: "#fff",
-                    fontSize: "100",
-                },
-            },
-            series: [{
-                name: '攻击类型',
-                type: 'pie',
-                radius: ['30%', '70%'],
-                center: ["20%", "50%"],
-                avoidLabelOverlap: false,
-                label: {
-                    show: false,
-                    position: 'center'
-                },
-                emphasis: {
-                    label: {
-                        show: true,
-                        fontSize: '100',
-                        fontWeight: 'bold'
-                    }
-                },
-                itemStyle: {
-                    shadowColor: 'rgba(71, 186, 253, .5)',
-                    shadowBlur: 100,
-                },
-                labelLine: {
-                    show: false
-                },
-                data: data
-            }]
-        };
-        myChart.setOption(option);
-
-        window.addEventListener('resize', function() {
-            if (timer) {
-                clearTimeout(timer);
-                timer = null;
-            }
-            timer = setTimeout(() => {
-                myChart.resize();
-            }, 500);
-        })
-        obsDom(testDom, myChart)
+        emphasis: {
+          label: {
+            show: true,
+            fontSize: '100',
+            fontWeight: 'bold'
+          }
+        },
+        itemStyle: {
+          shadowColor: 'rgba(71, 186, 253, .5)',
+          shadowBlur: 100,
+        },
+        labelLine: {
+          show: false
+        },
+        data: data
+      }]
+    };
+    myChart.setOption(option);
+
+    window.addEventListener('resize', function () {
+      if (timer) {
+        clearTimeout(timer);
+        timer = null;
+      }
+      timer = setTimeout(() => {
+        myChart.resize();
+      }, 500);
+    })
+    obsDom(testDom, myChart)
+  }
+
+
+  function setCharts14(echartDom, testDom, data = []) {
+    const defaultData = [{
+      value: 1048,
+      name: '广告'
+    }, {
+      value: 735,
+      name: '木马'
+    }, , {
+      value: 484,
+      name: '其他'
+    }];
+
+    if (data === undefined || data.length === 0) {
+      data = defaultData;
     }
-
-
-    function setCharts14(echartDom, testDom, data = []) {
-        const defaultData = [{
-            value: 1048,
-            name: '广告'
-        }, {
-            value: 735,
-            name: '木马'
-        }, , {
-            value: 484,
-            name: '其他'
-        }];
-
-        if (data === undefined || data.length === 0) {
-            data = defaultData;
-        }
-        console.log(data);
-        // 1实例化对象
-        myChart = echarts.init(echartDom);
-        let option = {
-            color: [
-                "#006cff",
-                "#47BAFD",
-                "#DA8F51"
-            ],
-            tooltip: {
-                trigger: 'item'
-            },
-            legend: {
-                orient: 'vertical',
-                top: "center",
-                right: "50",
-                textStyle: {
-                    color: "#fff",
-                    fontSize: "100",
-                },
-            },
-            series: [{
-                name: 'Access From',
-                type: 'pie',
-                radius: ['20%', '40%'],
-                center: ["30%", "55%"],
-                avoidLabelOverlap: false,
-                label: {
-                    show: false,
-                    position: 'center'
-                },
-                emphasis: {
-                    label: {
-                        show: true,
-                        fontSize: '140',
-                        fontWeight: 'bold'
-                    }
-                },
-                itemStyle: {
-                    shadowColor: 'rgba(71, 186, 253, .5)',
-                    shadowBlur: 100,
-                },
-                labelLine: {
-                    show: false
-                },
-                data: data
-            }]
-        };
-        myChart.setOption(option);
-        // obsDom(`.test14 .box`, myChart)
-
-        if (!testDom) {
-            testDom = document.querySelectorAll('.test14 .box');
-        }
-        obsDom(testDom, myChart)
+    console.log(data);
+    // 1实例化对象
+    myChart = echarts.init(echartDom);
+    let option = {
+      color: [
+        "#006cff",
+        "#47BAFD",
+        "#DA8F51"
+      ],
+      tooltip: {
+        trigger: 'item'
+      },
+      legend: {
+        orient: 'vertical',
+        top: "center",
+        right: "50",
+        textStyle: {
+          color: "#fff",
+          fontSize: "100",
+        },
+      },
+      series: [{
+        name: 'Access From',
+        type: 'pie',
+        radius: ['20%', '40%'],
+        center: ["30%", "55%"],
+        avoidLabelOverlap: false,
+        label: {
+          show: false,
+          position: 'center'
+        },
+        emphasis: {
+          label: {
+            show: true,
+            fontSize: '140',
+            fontWeight: 'bold'
+          }
+        },
+        itemStyle: {
+          shadowColor: 'rgba(71, 186, 253, .5)',
+          shadowBlur: 100,
+        },
+        labelLine: {
+          show: false
+        },
+        data: data
+      }]
+    };
+    myChart.setOption(option);
+    // obsDom(`.test14 .box`, myChart)
+
+    if (!testDom) {
+      testDom = document.querySelectorAll('.test14 .box');
     }
+    obsDom(testDom, myChart)
+  }
 </script>

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

@@ -369,7 +369,8 @@
     const dom23 = document.querySelector(".springFrame3 .box23 .floor-dist");
     const testDom23 = document.querySelector(".springFrame3 .box23");
     // 数据统计
-    $.ajax({
+    function sp3Ajax18() {
+      $.ajax({
         url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getSafetyInfoByMonth",
         data: {
             orgType: 2
@@ -382,8 +383,13 @@
             console.log("------------------------超时");
         },
     });
+    }
+  
     //   漏洞数据
-    $.ajax({
+  let flag19 = false;
+
+function sp3Ajax19() {
+  $.ajax({
         url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getRiskInfoByOrg",
         data: {
             orgType: 2
@@ -416,13 +422,22 @@
                     tr.appendChild(td);
                 }
             }
+            
+            const dom = $('.springFrame3 .box19 .content');
+          setTimeout(() => {
+            scroll(dom,0,flag19)
+            flag19 = true;
+
+          }, 1500);
         },
         error: function(err) {
             console.log("------------------------超时");
         },
     });
-    //  漏洞趋势
+}
 
+  
+    //  漏洞趋势
     function myAjax1() {
         $.ajax({
             url: "http://23.37.100.87:8084" +
@@ -445,14 +460,13 @@
     }
 
     //   业务系统
-    $.ajax({
+function sp3Ajax21() {
+  $.ajax({
         url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getSysStatusByOrg",
         data: {
             orgType: 2
         },
         success: function(res) {
-            console.log(res);
-
             $('.springFrame3 .box21 .left .tow').html(res.result.monthAttackCount);
             $('.springFrame3 .box21 .right .descinfo1').html(res.result.safeSystemCount);
             $('.springFrame3 .box21 .right .descinfo2').html(res.result.middleSystemCount);
@@ -461,8 +475,15 @@
             console.log("------------------------超时");
         },
     });
+   
+   
+}
+
+   
     //   高危系统列表
-    $.ajax({
+    let flag22 = false;
+    function sp3Ajax22() {
+      $.ajax({
         url: "http://23.37.100.87:8084" + "/basic/SystemRisk/getHighStatus",
         data: {
             orgType: 2,
@@ -485,12 +506,20 @@
             }
 
             $('.springFrame3 .box22 .content ul').html(data)
+            const dom = $('.springFrame3 .box22 .content');
+          setTimeout(() => {
+            scroll(dom,0,flag22)
+            flag22 = true;
+          }, 1500);
 
         },
         error: function(err) {
             console.log("------------------------超时");
         },
     });
+    }
+    
+   
     //   高危业务系统趋势
     function myAjax2() {
         $.ajax({
@@ -531,7 +560,15 @@
         });
     }
 
-
+    setInterval(() => {
+      sp3Ajax18()
+      sp3Ajax19()
+      sp3Ajax21()
+      sp3Ajax22()
+      myAjax1()
+      myAjax2()
+      myAjax3()
+    }, 60*1000);
 
 
 

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

@@ -262,7 +262,8 @@
 
 <script>
     // 数据统计
-    $.ajax({
+    function sp4Ajax25() {
+      $.ajax({
         url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getSafetyInfoByMonth",
         data: {
             orgType: 1
@@ -288,9 +289,12 @@
             console.log("浪潮弹框-超时");
         },
     });
-
+    }
+    
     // 漏洞数据 
-    $.ajax({
+    let flag26 = false;
+    function sp4Ajax26() {
+      $.ajax({
         url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getRiskInfoByOrg",
         data: {
             orgType: 1
@@ -318,17 +322,28 @@
             }).join('');
 
             $('.springFrame4 .box26 .table tbody').html(trs);
-
+            const dom = $('.springFrame4 .box26 .content');
+          setTimeout(() => {
+            scroll(dom,0,flag26)
+            flag26 = true;
+          }, 1500);
         },
         error: function(err) {
             console.log("浪潮弹框-超时");
         },
     });
 
+    }
+    
     // 漏洞类型
     const dom27 = document.querySelector('.springFrame4 .box27 .floor-dist');
     const testDom27 = document.querySelector('.springFrame4 .box27');
-    $.ajax({
+    setInterval(() => {
+      sp4Ajax27();
+      sp4Ajax29();
+    }, 60*1000);
+    function sp4Ajax27() {
+      $.ajax({
         url: "http://23.37.100.87:8084" + "/basic/RiskType/getSysRiskType",
         data: {
             orgType: 1,
@@ -357,8 +372,10 @@
             console.log("浪潮政务漏洞类型-超时");
         },
     });
+    }
 
     // 业务系统
+    function sp4Ajax28() {
     $.ajax({
         url: "http://23.37.100.87:8084" + "/basic/safetyInfor/getSysStatusByOrg",
         data: {
@@ -383,12 +400,15 @@
             console.log("业务系统-超时");
         },
     });
+    }
 
+  
     const dom29 = document.querySelector('.springFrame4 .box29 .floor-dist');
     const testDom29 = document.querySelector('.springFrame4 .box29');
 
     // 攻击拦截类型
-    $.ajax({
+    function sp4Ajax29() {
+      $.ajax({
         url: "http://23.37.100.87:8084" + "/basic/AttackType/getAttackTypeByMonth",
         data: {
             orgType: 1
@@ -419,9 +439,12 @@
             console.log("攻击拦截类型-超时29");
         },
     });
-
+    }
+   
     // 受攻击最严重业务统计
-    $.ajax({
+    let flag30 = false;
+    function sp4Ajax30() {
+      $.ajax({
         url: "http://23.37.100.87:8084" + "/basic/SystemAttacked/getSystemAttackedByInfo",
         data: {
             orgType: 1
@@ -447,7 +470,7 @@
                     </tr>
                     `
             })
-            $('.springFrame .box30 tbody').html(html)
+            $('.springFrame4 .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(../images/networkSecurity/1.png)',
@@ -467,12 +490,21 @@
               'background-repeat': 'no-repeat',
               'background-position': 'center'
             })
-        },
+     
+            const dom = $('.springFrame4 .box30 .content');
+          setTimeout(() => {
+            scroll(dom,0,flag30)
+            flag30 = true;
+          }, 1500);
+          },
         error: function(err) {
             console.log("受攻击最严重业务统计-超时111111");
         },
     });
 
+    }
+    
+
     // box27
     function setCharts27(echartDom, testDom, vlas = []) {
         let data = vlas

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

@@ -306,11 +306,11 @@
 
 
 
-  <!-- <div id="ThreeJS62" class="roomThree roomThree62" style="visibility:hidden"></div>
+  <div id="ThreeJS62" class="roomThree roomThree62" style="visibility:hidden"></div>
   <div id="ThreeJS63" class="roomThree roomThree63" style="visibility:hidden"></div>
   <div id="ThreeJS64" class="roomThree roomThree64" style="visibility:hidden"></div>
   <div id="ThreeJS65" class="roomThree roomThree65" style="visibility:hidden"></div>
-  <div id="ThreeJS66" class="roomThree roomThree66" style="visibility:hidden"></div> -->
+  <div id="ThreeJS66" class="roomThree roomThree66" style="visibility:hidden"></div>
 
 
   <div class="box60 box" data-name="test60" style="width: 3972px;height:1260px;left:11384px;top:2356px;">

Some files were not shown because too many files changed in this diff