首頁 探索 說明
登入
yangxiao
/
sis_zhfx
1
0
複刻 0
檔案 問題管理 0 合併請求 0 Wiki
瀏覽代碼

Merge branch 'update/V1.0.14' of http://61.161.152.110:10101/r/electronic-map into sl

# Conflicts:
#	src/router/index.js
shilin 3 年之前
父節點
d75da89953 3c81aac661
當前提交
2354f88bd4
共有 45 個文件被更改，包括 49335 次插入 和 1496 次删除
分割檢視 顯示文件統計
  1. 1 0
      package.json
  2. 4 0
      public/index.html
  3. 4917 0
      public/static/js/videoPlayer/adapter.js
  4. 2377 0
      public/static/js/videoPlayer/bootstrap.js
  5. 7 0
      public/static/js/videoPlayer/bootstrap.min.js
  6. 22 0
      public/static/js/videoPlayer/flowplayer-3.2.13.min.js
  7. 7 0
      public/static/js/videoPlayer/flv.min.js
  8. 33 0
      public/static/js/videoPlayer/h5scluster.js
  9. 184 0
      public/static/js/videoPlayer/h5sevent.js
  10. 278 0
      public/static/js/videoPlayer/h5spbcontrol.js
  11. 1 0
      public/static/js/videoPlayer/h5splayer.js
  12. 110 0
      public/static/js/videoPlayer/h5splayerhelper.js
  13. 214 0
      public/static/js/videoPlayer/jQuery.md5.js
  14. 10220 0
      public/static/js/videoPlayer/jquery-3.1.1.js
  15. 1 0
      public/static/js/videoPlayer/linkplayer.js
  16. 1217 0
      public/static/js/videoPlayer/platform.js
  17. 26804 0
      public/static/js/videoPlayer/video.js
  18. 1 1
      src/assets/icon/svg/风机.svg
  19. 二進制
      src/assets/png/booster-station.png
  20. 41 1
      src/assets/styles/el-override/el-input.less
  21. 15 7
      src/components/arcgis/arcgis.vue
  22. 16 16
      src/components/chart/combination/area-bar-chart.vue
  23. 468 0
      src/components/chart/combination/area-line-chart.vue
  24. 34 34
      src/components/chart/line/marker-line-chart.vue
  25. 328 0
      src/components/chart/line/zoom-line-chart.vue
  26. 17 12
      src/components/chart/radar/normal-radar-chart.vue
  27. 24 13
      src/components/chart/radar/radar-chart.vue
  28. 7 8
      src/components/coms/btn/btn-group-double.vue
  29. 7 8
      src/components/coms/table/table.vue
  30. 477 480
      src/router/index.js
  31. 91 0
      src/views/Demo.vue
  32. 5 6
      src/views/HealthControl/Health10.vue
  33. 0 2
      src/views/HealthControl/HealthTab4.vue
  34. 264 310
      src/views/HealthControl/infotrack2.vue
  35. 80 55
      src/views/LightMatrix3/LightMatrix3.vue
  36. 55 55
      src/views/NewPages/alarm-center.vue
  37. 6 4
      src/views/NewPages/history-search.vue
  38. 163 57
      src/views/NewPages/knowledge-base.vue
  39. 76 76
      src/views/WindSite/components/gax6.vue
  40. 260 260
      src/views/WindSite/pages/Home/Home.vue
  41. 5 3
      src/views/WindSite/pages/Info/Warning.vue
  42. 424 13
      src/views/WindSite/pages/Map1.vue
  43. 28 27
      src/views/WindSite/pages/Matrix.vue
  44. 8 8
      src/views/layout/Header.vue
  45. 38 40
      src/views/layout/Menu.vue

+ 1 - 0
package.json
查看文件 

@@ -19,6 +19,7 @@
 
     "file-saver": "^2.0.5",
 
     "font-awesome": "^4.7.0",
 
     "html2canvas": "^1.0.0-rc.7",
 
+    "jquery": "^3.6.0",
 
     "jspdf": "^2.3.1",
 
     "stompjs": "^2.3.3",
 
     "three": "^0.129.0",

+ 4 - 0
public/index.html
查看文件 

@@ -5,6 +5,10 @@
 
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
 
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
 
+    <script src="./static/js/videoPlayer/adapter.js"></script>
 
+    <script src="./static/js/videoPlayer/platform.js"></script>
 
+    <script src="./static/js/videoPlayer/h5splayer.js"></script>
 
+    <script src="./static/js/videoPlayer/h5splayerhelper.js"></script>
 
     <title><%= htmlWebpackPlugin.options.title %></title>
 
   </head>
 
   <body>

文件差異過大導致無法顯示
+ 4917 - 0
public/static/js/videoPlayer/adapter.js


文件差異過大導致無法顯示
+ 2377 - 0
public/static/js/videoPlayer/bootstrap.js


文件差異過大導致無法顯示
+ 7 - 0
public/static/js/videoPlayer/bootstrap.min.js


文件差異過大導致無法顯示
+ 22 - 0
public/static/js/videoPlayer/flowplayer-3.2.13.min.js


文件差異過大導致無法顯示
+ 7 - 0
public/static/js/videoPlayer/flv.min.js


+ 33 - 0
public/static/js/videoPlayer/h5scluster.js
查看文件 

@@ -0,0 +1,33 @@
 
+function H5SClusterHttpGet(url)
 
+{
 
+    var xmlHttp = new XMLHttpRequest();
 
+    xmlHttp.open("GET", url, false );
 
+    xmlHttp.send( null );
 
+    return xmlHttp.responseText;
 
+}
 
+
 
+function H5SClusterGetConf(conf)
 
+{
 
+    var strStatusUrl =  conf.protocol + '//' + conf.host + conf.rootpath +
 
+                'api/v1/cluster/GetClusterStatus';
 
+    console.log(strStatusUrl);        
+    var strStatus = H5SClusterHttpGet(strStatusUrl);
 
+    console.log(strStatus);
 
+    var strStatusJson = JSON.parse(strStatus);
 
+    if (strStatusJson["bEnable"] == true)
 
+    {
 
+        console.log("Cluster enable");
 
+        var strProtocol = "http";
 
+        if (conf.protocol == "https:")
 
+        {
 
+            strProtocol = "https";
 
+        }
 
+        var strAddrUrl =  conf.protocol + '//' + conf.host + conf.rootpath +
 
+                    'api/v1/cluster/GetServiceAddr?service=' + strProtocol + '&token=' + conf.token;
 
+        var strAddr = H5SClusterHttpGet(strAddrUrl);
 
+        console.log(strAddr);
 
+        var strAddrJson = JSON.parse(strAddr);
 
+        conf.host = strAddrJson["strAddr"] + ':' + strAddrJson["nPort"];
 
+        console.log("Cluster get play host", conf.host);
 
+    }
 
+}

+ 184 - 0
public/static/js/videoPlayer/h5sevent.js
查看文件 

@@ -0,0 +1,184 @@
 
+/** 
+ *=================Event API
 
+ *
 
+ */
 
+/** 
+ * Interface with h5s Event API
 
+ * @constructor
 
+ * @param 
+ var conf = {
 
+	protocol: window.location.protocol, // {string} - 'http:' or 'https:'
 
+	host: window.location.host, //{string} - 'localhost:8080'
 
+	rootpath:window.location.pathname, // {string} - path of the app running
 
+	callback: EventCB, //{function}(event(string), userdata(object)) 
+	userdata: user data // user data
 
+	session:'c1782caf-b670-42d8-ba90-2244d0b0ee83', //{string} - session got from login
 
+	consolelog: 'true' // 'true' or 'false' enable/disable console.log
 
+};
 
+*/
 
+
 
+function H5sEvent(conf)
 
+{
 
+	this.wsSocket;
 
+	this.keepaliveTimerId;
 
+	this.bNeedReconnect = false;
 
+	this.bDisConnected = false;
 
+	
+	this._debug = true;	
+	if (conf.consolelog !== undefined)
 
+	{
 
+		if (conf.consolelog === 'false')
 
+		{
 
+			this._debug = false;	
+		}
 
+	}	
+	
+
 
+	this._conf = conf;	
+}
 
+
 
+H5sEvent.prototype.ReconnectFunction = function() 
+{
 
+	//if(this._debug === true) console.log('Try Reconnect...', this.bNeedReconnect);
 
+	if (this.bNeedReconnect === true)
 
+	{
 
+		if(this._debug === true) console.log('Reconnect...');
 
+		
+		this.setupWebSocket(this._token);
 
+		this.bNeedReconnect = false;
 
+	}
 
+	//if(this._debug === true) console.log('Try Reconnect...', this.bNeedReconnect);
 
+}
 
+	
+	
+H5sEvent.prototype.H5SWebSocketClient = function(h5spath) 
+{
 
+	var socket;
 
+	if(this._debug === true) console.log("H5SWebSocketClient");
 
+	try {
 
+		//alert(this._conf.protocol);
 
+		if (this._conf.protocol == "http:") 
+		{
 
+			if (typeof MozWebSocket != "undefined")
 
+			{
 
+				socket = new MozWebSocket('ws://' + this._conf.host  +  h5spath);
 
+			}else
 
+			{
 
+				socket = new WebSocket('ws://' + this._conf.host +  h5spath);
 
+			}
 
+		}
 
+		if (this._conf.protocol == "https:")
 
+		{	
+			//alert(this._conf.host);
 
+			if(this._debug === true) console.log(this._conf.host);
 
+			if (typeof MozWebSocket != "undefined")
 
+			{
 
+				socket = new MozWebSocket('wss://' + this._conf.host +  h5spath);
 
+			}else
 
+			{
 
+				socket = new WebSocket('wss://' + this._conf.host + h5spath);
 
+			}				
+		}
 
+		if(this._debug === true) console.log(this._conf.host);
 
+	} catch (e) {
 
+		alert('error');
 
+		return;
 
+	}
 
+	return socket;
 
+}
 
+
 
+H5sEvent.prototype.keepaliveTimer = function()	
+{
 
+	try {
 
+		var j = {};
 
+		j.type = "keepalive";
 
+		this.wsSocket.send(JSON.stringify(j));
 
+	} catch (e) {
 
+	  if(this._debug === true) console.log(e);
 
+	}
 
+}
 
+
 
+
 
+H5sEvent.prototype.onWebSocketData = function(msg)	
+{
 
+	
+	if (this._conf.callback != undefined)
 
+	{
 
+		this._conf.callback(msg.data, this._conf.userdata);
 
+	}
 
+} 
+	
+
 
+H5sEvent.prototype.setupWebSocket = function(token)	
+{	
+	var h5spath = "api/v1/h5seventapi";
 
+
 
+	h5spath = this._conf.rootpath + h5spath + '?session=' + this._conf.session;
 
+	
+	if(this._debug === true) console.log(h5spath);
 
+	
+	this.wsSocket = this.H5SWebSocketClient(h5spath);
 
+	if(this._debug === true) console.log("setupWebSocket", this.wsSocket);
 
+	this.wsSocket.binaryType = 'arraybuffer';
 
+	this.wsSocket.h5 = this;
 
+	this.wsSocket.onmessage = this.onWebSocketData.bind(this);
 
+	
+	this.wsSocket.onopen = function()
 
+	{
 
+		if(this.h5._debug === true) console.log("wsSocket.onopen", this.h5);
 
+		
+		this.h5.keepaliveTimerId = setInterval(this.h5.keepaliveTimer.bind(this.h5), 1000);
 
+
 
+	}
 
+	
+	this.wsSocket.onclose = function () {
 
+		if(this.h5._debug === true) console.log("wsSocket.onclose", this.h5);
 
+		if (this.h5.bDisConnected === true)
 
+		{
 
+			if(this.h5._debug === true) console.log("wsSocket.onclose disconnect");
 
+		}else
 
+		{
 
+			this.h5.bNeedReconnect = true;
 
+		}
 
+		
+		this.h5.CleanupWebSocket(this.h5);
 
+	}
 
+
 
+}
 
+
 
+
 
+H5sEvent.prototype.CleanupWebSocket = function(h5sPlayer)
 
+{
 
+	if(h5sPlayer._debug === true) console.log('CleanupWebSocket', h5sPlayer);
 
+	clearInterval(h5sPlayer.keepaliveTimerId);
 
+	h5sPlayer.emptyBuffCnt = 0;
 
+	h5sPlayer.lastBuffTime = 0;
 
+	h5sPlayer.buffTimeSameCnt = 0;
 
+}
 
+
 
+
 
+/** 
+ * Connect a websocket Stream to videoElement 
+*/
 
+H5sEvent.prototype.connect = function() {
 
+	/* start connect to server */
 
+	this.setupWebSocket(this._token);
 
+	this.reconnectTimerId = setInterval(this.ReconnectFunction.bind(this), 3000);
 
+}
 
+
 
+
 
+/** 
+ * Disconnect a websocket Stream and clear videoElement source
 
+*/
 
+H5sEvent.prototype.disconnect = function() {
 
+	if(this._debug === true) console.log("disconnect", this);
 
+	this.bDisConnected = true;
 
+	clearInterval(this.reconnectTimerId);
 
+	
+	if (this.wsSocket != null)
 
+	{
 
+		this.wsSocket.close();
 
+		this.wsSocket = null;
 
+	}
 
+	if(this._debug === true) console.log("disconnect", this);
 
+}

+ 278 - 0
public/static/js/videoPlayer/h5spbcontrol.js
查看文件 

@@ -0,0 +1,278 @@
 
+/** 
+ * Interface with h5s websocket pb ctonrol API
 
+ * @constructor
 
+ * @param 
+ var pbconf1 = {
 
+	begintime: '2019-03-23T120101+08',//{string} begintime 0 for fileplayback
 
+	endtime: '2019-03-23T150101+08',//{string} endtime 0 for fileplayback
 
+	serverpb: 'true', //'true' or 'false' playback from h5stream record, default false 
+	filename: 'token1.mp4', // file name need to playback (begintime == 0 & endtime == 0 and serverpb is true)
 
+	callback: PlaybackCB, //{function}(event(string), userdata(object)) 
+	userdata:  user data // user data
 
+};
 
+ 
+ var conf = {
 
+	protocol: window.location.protocol, // {string} - 'http:' or 'https:'
 
+	host: window.location.host, //{string} - 'localhost:8080'
 
+	rootpath:window.location.pathname, // {string} - path of the app running
 
+	token:'token1', // {string} - token of stream
 
+	streamprofile: 'main', // {string} - stream profile, main/sub or other predefine transcoding profile
 
+	pbconf: pbconf1, //This is optional, if no pbconf, this will be live.
 
+	session:'c1782caf-b670-42d8-ba90-2244d0b0ee83', //{string} - session got from login
 
+	consolelog: 'true' // 'true' or 'false' enable/disable console.log
 
+};                     
+*/
 
+
 
+function H5sPbControl(conf)
 
+{
 
+	this.wsSocket;
 
+	this.keepaliveTimerId;
 
+	this.bDisConnected = false;
 
+	
+	this._debug = true;	
+	if (conf.consolelog !== undefined)
 
+	{
 
+		if (conf.consolelog === 'false')
 
+		{
 
+			this._debug = false;	
+		}
 
+	}	
+	
+	this._conf = conf;
 
+	if(this._debug === true) console.log("[PBCONTROL] Websocket Conf:", conf);
 
+	
+	this._pbconf = conf.pbconf;
 
+	
+	this._token = conf.token;
 
+}
 
+	
+H5sPbControl.prototype.H5SWebSocketClient = function(h5spath) 
+{
 
+	var socket;
 
+	if(this._debug === true) console.log("[PBCONTROL] H5SWebSocketClient");
 
+	try {
 
+		//alert(this._conf.protocol);
 
+		if (this._conf.protocol == "http:") 
+		{
 
+			if (typeof MozWebSocket != "undefined")
 
+			{
 
+				socket = new MozWebSocket('ws://' + this._conf.host  +  h5spath);
 
+			}else
 
+			{
 
+				socket = new WebSocket('ws://' + this._conf.host +  h5spath);
 
+			}
 
+		}
 
+		if (this._conf.protocol == "https:")
 
+		{	
+			//alert(this._conf.host);
 
+			if(this._debug === true) console.log(this._conf.host);
 
+			if (typeof MozWebSocket != "undefined")
 
+			{
 
+				socket = new MozWebSocket('wss://' + this._conf.host +  h5spath);
 
+			}else
 
+			{
 
+				socket = new WebSocket('wss://' + this._conf.host + h5spath);
 
+			}				
+		}
 
+		if(this._debug === true) console.log(this._conf.host);
 
+	} catch (e) {
 
+		alert('error');
 
+		return;
 
+	}
 
+	return socket;
 
+}
 
+
 
+H5sPbControl.prototype.keepaliveTimer = function()	
+{
 
+	try {
 
+		var j = {};
 
+		j.cmd = "H5_KEEPALIVE";
 
+		this.wsSocket.send(JSON.stringify(j));
 
+	} catch (e) {
 
+	  if(this._debug === true) console.log(e);
 
+	}
 
+}
 
+
 
+H5sPbControl.prototype.onWebSocketData = function(msg)	
+{	
+	if(typeof msg.data === 'string')
 
+	{
 
+		if(this._debug === true) console.log("[PBCONTROL] string");
 
+		if (this._pbconf != undefined && this._pbconf.callback != undefined)
 
+		{
 
+			this._pbconf.callback(msg.data, this._pbconf.userdata);
 
+		}
 
+		return;
 
+	}
 
+	
+	if (this.bDisConnected === true)
 
+	{
 
+		return;
 
+	}
 
+} 
+
 
+H5sPbControl.prototype.setupWebSocket = function(token)	
+{
 
+	var h5spath = "api/v1/h5spbcontrolapi";
 
+	var streamprofile = 'main';
 
+	if (this._conf.streamprofile === undefined)
 
+	{}else 
+	{
 
+		streamprofile = this._conf.streamprofile;
 
+	}
 
+	
+	if (this._pbconf === undefined)
 
+	{
 
+		h5spath = this._conf.rootpath + h5spath + "?token=" + token 
+						+ "&profile=" + streamprofile + '&session=' + this._conf.session;
 
+	}else 
+	{
 
+		var serverpb = 'false';
 
+		var filename = 'fake';
 
+		if (this._pbconf.serverpb === undefined)
 
+		{}else 
+		{
 
+			serverpb = this._pbconf.serverpb;
 
+		}
 
+
 
+		if (this._pbconf.filename === undefined)
 
+		{}else 
+		{
 
+			filename = this._pbconf.filename;
 
+		}		
+		
+		h5spath = this._conf.rootpath + h5spath + "?token=" + token 
+								+ "&playback=true"
 
+								+ '&profile=' + streamprofile
 
+								+ "&serverpb=" + serverpb
 
+								+ "&begintime=" + encodeURIComponent(this._pbconf.begintime)//this._pbconf.begintime
 
+								+ "&endtime=" + encodeURIComponent(this._pbconf.endtime)//this._pbconf.endtime
 
+								+ "&filename=" + filename//file name
 
+								+ '&session=' + this._conf.session;
 
+	}				+ '&session=' + this._conf.session;
 
+
 
+	
+	
+	if(this._debug === true) console.log(h5spath);
 
+	
+	this.wsSocket = this.H5SWebSocketClient(h5spath);
 
+	if(this._debug === true) console.log("[PBCONTROL] setupWebSocket", this.wsSocket);
 
+	this.wsSocket.binaryType = 'arraybuffer';
 
+	this.wsSocket.h5 = this;
 
+	this.wsSocket.onmessage = this.onWebSocketData.bind(this);
 
+	
+	this.wsSocket.onopen = function()
 
+	{
 
+		if(this.h5._debug === true) console.log("[PBCONTROL] wsSocket.onopen", this.h5);
 
+		this.h5.keepaliveTimerId = setInterval(this.h5.keepaliveTimer.bind(this.h5), 1000);
 
+
 
+		var j = {};
 
+		j.type = "H5S_WS_CONNECTED";
 
+		if (this.h5._pbconf != undefined && this.h5._pbconf.callback != undefined)
 
+		{
 
+			this.h5._pbconf.callback(JSON.stringify(j), this.h5._pbconf.userdata);
 
+		}
 
+	}
 
+	
+	this.wsSocket.onclose = function () {
 
+		if(this.h5._debug === true) console.log("[PBCONTROL] wsSocket.onclose", this.h5);
 
+		
+		var j = {};
 
+		j.type = "H5S_WS_DISCONNECTED";
 
+		if (this.h5._pbconf != undefined && this.h5._pbconf.callback != undefined)
 
+		{
 
+			this.h5._pbconf.callback(JSON.stringify(j), this.h5._pbconf.userdata);
 
+		}
 
+		
+		this.h5.CleanupWebSocket(this.h5);
 
+	}
 
+
 
+}
 
+	
+H5sPbControl.prototype.CleanupWebSocket = function(h5sPlayer)
 
+{
 
+	if(h5sPlayer._debug === true) console.log('[PBCONTROL] CleanupWebSocket', h5sPlayer);
 
+	clearInterval(h5sPlayer.keepaliveTimerId);
 
+}
 
+
 
+
 
+/** 
+ * Connect a websocket Stream to videoElement 
+*/
 
+H5sPbControl.prototype.connect = function() {
 
+	/* start connect to server */
 
+	this.setupWebSocket(this._token);
 
+}
 
+
 
+
 
+/** 
+ * Disconnect a websocket Stream and clear videoElement source
 
+*/
 
+H5sPbControl.prototype.disconnect = function() {
 
+	if(this._debug === true) console.log("[PBCONTROL] disconnect", this);
 
+	this.bDisConnected = true;
 
+	clearInterval(this.reconnectTimerId);
 
+	
+	try {
 
+		if (this.wsSocket != null)
 
+		{
 
+			this.wsSocket.close();
 
+			this.wsSocket = null;
 
+		}
 
+	}
 
+	catch (e){}
 
+	
+	if(this._debug === true) console.log("[PBCONTROL] disconnect", this);
 
+}
 
+
 
+H5sPbControl.prototype.start = function(){
 
+	try {
 
+		var j = {};
 
+		j.cmd = "H5_START";
 
+		this.wsSocket.send(JSON.stringify(j));
 
+	} catch (e) {
 
+	  if(this._debug === true) console.log(e);
 
+	}
 
+}
 
+
 
+H5sPbControl.prototype.pause = function(){
 
+	try {
 
+		var j = {};
 
+		j.cmd = "H5_PAUSE";
 
+		this.wsSocket.send(JSON.stringify(j));
 
+	} catch (e) {
 
+	  if(this._debug === true) console.log(e);
 
+	}
 
+}
 
+
 
+H5sPbControl.prototype.resume = function(){
 
+	try {
 
+		var j = {};
 
+		j.cmd = "H5_RESUME";
 
+		this.wsSocket.send(JSON.stringify(j));
 
+	} catch (e) {
 
+	  if(this._debug === true) console.log(e);
 
+	}
 
+}
 
+
 
+H5sPbControl.prototype.seek = function(nTime){
 
+	try {
 
+		var j = {};
 
+		j.cmd = "H5_SEEK";
 
+		j.nSeekTime = nTime;
 
+		this.wsSocket.send(JSON.stringify(j));
 
+	} catch (e) {
 
+	  if(this._debug === true) console.log(e);
 
+	}
 
+}
 
+
 
+H5sPbControl.prototype.speed = function(nSpeed){
 
+	try {
 
+		var j = {};
 
+		j.cmd = "H5_SPEED";
 
+		j.nSpeed = nSpeed;
 
+		this.wsSocket.send(JSON.stringify(j));
 
+	} catch (e) {
 
+	  if(this._debug === true) console.log(e);
 
+	}
 
+}

文件差異過大導致無法顯示
+ 1 - 0
public/static/js/videoPlayer/h5splayer.js


+ 110 - 0
public/static/js/videoPlayer/h5splayerhelper.js
查看文件 

@@ -0,0 +1,110 @@
 
+/** 
+ * Check platform and OS
 
+	(platform.name); // 'Safari'
 
+	(platform.version); // '11.1'
 
+	(platform.product); // 'iPad'
 
+	(platform.manufacturer); // 'Apple'
 
+	(platform.layout); // 'WebKit'
 
+	(platform.os.family); // 'iOS'
 
+	(platform.description);// 'Safari 11.1 on Apple iPad (iOS 11.0)'
 
+ 
+*/
 
+function H5siOS() {
 
+    var browserName=platform.os.family;  
+    if(/ios/i.test(browserName) ){  
+        return true;  
+    } 
+	return false;
 
+}
 
+
 
+function H5sChromeBrowser(){  
+    var browserName=platform.name;  
+    if(/chrome/i.test(browserName) ){  
+        return true;  
+    }  
+    return false;
 
+}  
+
 
+
 
+function H5sEdgeBrowser(){  
+    var browserName=platform.name;  
+    if(/edge/i.test(browserName) ){  
+        return true;  
+    }  
+    return false;
 
+} 
+
 
+function H5sSafariBrowser(){  
+    var browserName=platform.name;  
+	console.log(browserName);
 
+    if(/safari/i.test(browserName) ){  
+        return true;  
+    }  
+    return false;
 
+}
 
+
 
+function H5sAndriodPlatform(){  
+    var browserName=platform.os.family;  
+    if(/android/i.test(browserName) ){  
+        return true;  
+    }  
+    return false;
 
+}
 
+
 
+/** 
+ *=================H5Player Create
 
+ *
 
+ */
 
+ 
+function H5sPlayerCreate(conf) {
 
+	var player;
 
+
 
+	if (H5siOS())
 
+	{
 
+        player = new H5sPlayerRTC(conf);
 
+	}else{
 
+        player = new H5sPlayerWS(conf);
 
+	}
 
+	return player;
 
+}
 
+
 
+
 
+function GetURLParameter(sParam)
 
+{
 
+    var sPageURL = window.location.search.substring(1);
 
+    var sURLVariables = sPageURL.split('&');
 
+    for (var i = 0; i < sURLVariables.length; i++) 
+    {
 
+        var sParameterName = sURLVariables[i].split('=');
 
+        if (sParameterName[0] == sParam) 
+        {
 
+            return sParameterName[1];
 
+        }
 
+    }
 
+}
 
+
 
+
 
+function H5sSnapshot(vid, fileName)
 
+{
 
+	var video = vid;
 
+	var w = video.videoWidth;//video.videoWidth * scaleFactor;
 
+	var h = video.videoHeight;//video.videoHeight * scaleFactor;
 
+	var canvas = document.createElement('canvas');
 
+	canvas.width = w;
 
+	canvas.height = h;
 
+	var ctx = canvas.getContext('2d');
 
+	ctx.drawImage(video, 0, 0, w, h);
 
+	var MIME_TYPE = "image/png";
 
+	var imgURL = canvas.toDataURL(MIME_TYPE);
 
+
 
+	var dlLink = document.createElement('a');
 
+	dlLink.download = fileName;
 
+	dlLink.href = imgURL;
 
+	dlLink.dataset.downloadurl = [MIME_TYPE, dlLink.download, dlLink.href].join(':');
 
+
 
+	document.body.appendChild(dlLink);
 
+	dlLink.click();
 
+	document.body.removeChild(dlLink);           
+}
 
+ 
+

+ 214 - 0
public/static/js/videoPlayer/jQuery.md5.js
查看文件 

@@ -0,0 +1,214 @@
 
+	/**
 
+	 * jQuery MD5 hash algorithm function
 
+	 * 
+	 * 	<code>
 
+	 * 		Calculate the md5 hash of a String 
+	 * 		String $.md5 ( String str )
 
+	 * 	</code>
 
+	 * 
+	 * Calculates the MD5 hash of str using the » RSA Data Security, Inc. MD5 Message-Digest Algorithm, and returns that hash. 
+	 * MD5 (Message-Digest algorithm 5) is a widely-used cryptographic hash function with a 128-bit hash value. MD5 has been employed in a wide variety of security applications, and is also commonly used to check the integrity of data. The generated hash is also non-reversable. Data cannot be retrieved from the message digest, the digest uniquely identifies the data.
 
+	 * MD5 was developed by Professor Ronald L. Rivest in 1994. Its 128 bit (16 byte) message digest makes it a faster implementation than SHA-1.
 
+	 * This script is used to process a variable length message into a fixed-length output of 128 bits using the MD5 algorithm. It is fully compatible with UTF-8 encoding. It is very useful when u want to transfer encrypted passwords over the internet. If you plan using UTF-8 encoding in your project don't forget to set the page encoding to UTF-8 (Content-Type meta tag). 
+	 * This function orginally get from the WebToolkit and rewrite for using as the jQuery plugin.
 
+	 * 
+	 * Example
 
+	 * 	Code
 
+	 * 		<code>
 
+	 * 			$.md5("I'm Persian."); 
+	 * 		</code>
 
+	 * 	Result
 
+	 * 		<code>
 
+	 * 			"b8c901d0f02223f9761016cfff9d68df"
 
+	 * 		</code>
 
+	 * 
+	 * @alias Muhammad Hussein Fattahizadeh < muhammad [AT] semnanweb [DOT] com >
 
+	 * @link http://www.semnanweb.com/jquery-plugin/md5.html
 
+	 * @see http://www.webtoolkit.info/
 
+	 * @license http://www.gnu.org/licenses/gpl.html [GNU General Public License]
 
+	 * @param {jQuery} {md5:function(string))
 
+	 * @return string
 
+	 */
 
+	(function($){
 
+		var rotateLeft = function(lValue, iShiftBits) {
 
+			return (lValue << iShiftBits) | (lValue >>> (32 - iShiftBits));
 
+		}
 
+		var addUnsigned = function(lX, lY) {
 
+			var lX4, lY4, lX8, lY8, lResult;
 
+			lX8 = (lX & 0x80000000);
 
+			lY8 = (lY & 0x80000000);
 
+			lX4 = (lX & 0x40000000);
 
+			lY4 = (lY & 0x40000000);
 
+			lResult = (lX & 0x3FFFFFFF) + (lY & 0x3FFFFFFF);
 
+			if (lX4 & lY4) return (lResult ^ 0x80000000 ^ lX8 ^ lY8);
 
+			if (lX4 | lY4) {
 
+				if (lResult & 0x40000000) return (lResult ^ 0xC0000000 ^ lX8 ^ lY8);
 
+				else return (lResult ^ 0x40000000 ^ lX8 ^ lY8);
 
+			} else {
 
+				return (lResult ^ lX8 ^ lY8);
 
+			}
 
+		}
 
+		var F = function(x, y, z) {
 
+			return (x & y) | ((~ x) & z);
 
+		}
 
+		var G = function(x, y, z) {
 
+			return (x & z) | (y & (~ z));
 
+		}
 
+		var H = function(x, y, z) {
 
+			return (x ^ y ^ z);
 
+		}
 
+		var I = function(x, y, z) {
 
+			return (y ^ (x | (~ z)));
 
+		}
 
+		var FF = function(a, b, c, d, x, s, ac) {
 
+			a = addUnsigned(a, addUnsigned(addUnsigned(F(b, c, d), x), ac));
 
+			return addUnsigned(rotateLeft(a, s), b);
 
+		};
 
+		var GG = function(a, b, c, d, x, s, ac) {
 
+			a = addUnsigned(a, addUnsigned(addUnsigned(G(b, c, d), x), ac));
 
+			return addUnsigned(rotateLeft(a, s), b);
 
+		};
 
+		var HH = function(a, b, c, d, x, s, ac) {
 
+			a = addUnsigned(a, addUnsigned(addUnsigned(H(b, c, d), x), ac));
 
+			return addUnsigned(rotateLeft(a, s), b);
 
+		};
 
+		var II = function(a, b, c, d, x, s, ac) {
 
+			a = addUnsigned(a, addUnsigned(addUnsigned(I(b, c, d), x), ac));
 
+			return addUnsigned(rotateLeft(a, s), b);
 
+		};
 
+		var convertToWordArray = function(string) {
 
+			var lWordCount;
 
+			var lMessageLength = string.length;
 
+			var lNumberOfWordsTempOne = lMessageLength + 8;
 
+			var lNumberOfWordsTempTwo = (lNumberOfWordsTempOne - (lNumberOfWordsTempOne % 64)) / 64;
 
+			var lNumberOfWords = (lNumberOfWordsTempTwo + 1) * 16;
 
+			var lWordArray = Array(lNumberOfWords - 1);
 
+			var lBytePosition = 0;
 
+			var lByteCount = 0;
 
+			while (lByteCount < lMessageLength) {
 
+				lWordCount = (lByteCount - (lByteCount % 4)) / 4;
 
+				lBytePosition = (lByteCount % 4) * 8;
 
+				lWordArray[lWordCount] = (lWordArray[lWordCount] | (string.charCodeAt(lByteCount) << lBytePosition));
 
+				lByteCount++;
 
+			}
 
+			lWordCount = (lByteCount - (lByteCount % 4)) / 4;
 
+			lBytePosition = (lByteCount % 4) * 8;
 
+			lWordArray[lWordCount] = lWordArray[lWordCount] | (0x80 << lBytePosition);
 
+			lWordArray[lNumberOfWords - 2] = lMessageLength << 3;
 
+			lWordArray[lNumberOfWords - 1] = lMessageLength >>> 29;
 
+			return lWordArray;
 
+		};
 
+		var wordToHex = function(lValue) {
 
+			var WordToHexValue = "", WordToHexValueTemp = "", lByte, lCount;
 
+			for (lCount = 0; lCount <= 3; lCount++) {
 
+				lByte = (lValue >>> (lCount * 8)) & 255;
 
+				WordToHexValueTemp = "0" + lByte.toString(16);
 
+				WordToHexValue = WordToHexValue + WordToHexValueTemp.substr(WordToHexValueTemp.length - 2, 2);
 
+			}
 
+			return WordToHexValue;
 
+		};
 
+		var uTF8Encode = function(string) {
 
+			string = string.replace(/\x0d\x0a/g, "\x0a");
 
+			var output = "";
 
+			for (var n = 0; n < string.length; n++) {
 
+				var c = string.charCodeAt(n);
 
+				if (c < 128) {
 
+					output += String.fromCharCode(c);
 
+				} else if ((c > 127) && (c < 2048)) {
 
+					output += String.fromCharCode((c >> 6) | 192);
 
+					output += String.fromCharCode((c & 63) | 128);
 
+				} else {
 
+					output += String.fromCharCode((c >> 12) | 224);
 
+					output += String.fromCharCode(((c >> 6) & 63) | 128);
 
+					output += String.fromCharCode((c & 63) | 128);
 
+				}
 
+			}
 
+			return output;
 
+		};
 
+		$.extend({
 
+			md5: function(string) {
 
+				var x = Array();
 
+				var k, AA, BB, CC, DD, a, b, c, d;
 
+				var S11=7, S12=12, S13=17, S14=22;
 
+				var S21=5, S22=9 , S23=14, S24=20;
 
+				var S31=4, S32=11, S33=16, S34=23;
 
+				var S41=6, S42=10, S43=15, S44=21;
 
+				string = uTF8Encode(string);
 
+				x = convertToWordArray(string);
 
+				a = 0x67452301; b = 0xEFCDAB89; c = 0x98BADCFE; d = 0x10325476;
 
+				for (k = 0; k < x.length; k += 16) {
 
+					AA = a; BB = b; CC = c; DD = d;
 
+					a = FF(a, b, c, d, x[k+0],  S11, 0xD76AA478);
 
+					d = FF(d, a, b, c, x[k+1],  S12, 0xE8C7B756);
 
+					c = FF(c, d, a, b, x[k+2],  S13, 0x242070DB);
 
+					b = FF(b, c, d, a, x[k+3],  S14, 0xC1BDCEEE);
 
+					a = FF(a, b, c, d, x[k+4],  S11, 0xF57C0FAF);
 
+					d = FF(d, a, b, c, x[k+5],  S12, 0x4787C62A);
 
+					c = FF(c, d, a, b, x[k+6],  S13, 0xA8304613);
 
+					b = FF(b, c, d, a, x[k+7],  S14, 0xFD469501);
 
+					a = FF(a, b, c, d, x[k+8],  S11, 0x698098D8);
 
+					d = FF(d, a, b, c, x[k+9],  S12, 0x8B44F7AF);
 
+					c = FF(c, d, a, b, x[k+10], S13, 0xFFFF5BB1);
 
+					b = FF(b, c, d, a, x[k+11], S14, 0x895CD7BE);
 
+					a = FF(a, b, c, d, x[k+12], S11, 0x6B901122);
 
+					d = FF(d, a, b, c, x[k+13], S12, 0xFD987193);
 
+					c = FF(c, d, a, b, x[k+14], S13, 0xA679438E);
 
+					b = FF(b, c, d, a, x[k+15], S14, 0x49B40821);
 
+					a = GG(a, b, c, d, x[k+1],  S21, 0xF61E2562);
 
+					d = GG(d, a, b, c, x[k+6],  S22, 0xC040B340);
 
+					c = GG(c, d, a, b, x[k+11], S23, 0x265E5A51);
 
+					b = GG(b, c, d, a, x[k+0],  S24, 0xE9B6C7AA);
 
+					a = GG(a, b, c, d, x[k+5],  S21, 0xD62F105D);
 
+					d = GG(d, a, b, c, x[k+10], S22, 0x2441453);
 
+					c = GG(c, d, a, b, x[k+15], S23, 0xD8A1E681);
 
+					b = GG(b, c, d, a, x[k+4],  S24, 0xE7D3FBC8);
 
+					a = GG(a, b, c, d, x[k+9],  S21, 0x21E1CDE6);
 
+					d = GG(d, a, b, c, x[k+14], S22, 0xC33707D6);
 
+					c = GG(c, d, a, b, x[k+3],  S23, 0xF4D50D87);
 
+					b = GG(b, c, d, a, x[k+8],  S24, 0x455A14ED);
 
+					a = GG(a, b, c, d, x[k+13], S21, 0xA9E3E905);
 
+					d = GG(d, a, b, c, x[k+2],  S22, 0xFCEFA3F8);
 
+					c = GG(c, d, a, b, x[k+7],  S23, 0x676F02D9);
 
+					b = GG(b, c, d, a, x[k+12], S24, 0x8D2A4C8A);
 
+					a = HH(a, b, c, d, x[k+5],  S31, 0xFFFA3942);
 
+					d = HH(d, a, b, c, x[k+8],  S32, 0x8771F681);
 
+					c = HH(c, d, a, b, x[k+11], S33, 0x6D9D6122);
 
+					b = HH(b, c, d, a, x[k+14], S34, 0xFDE5380C);
 
+					a = HH(a, b, c, d, x[k+1],  S31, 0xA4BEEA44);
 
+					d = HH(d, a, b, c, x[k+4],  S32, 0x4BDECFA9);
 
+					c = HH(c, d, a, b, x[k+7],  S33, 0xF6BB4B60);
 
+					b = HH(b, c, d, a, x[k+10], S34, 0xBEBFBC70);
 
+					a = HH(a, b, c, d, x[k+13], S31, 0x289B7EC6);
 
+					d = HH(d, a, b, c, x[k+0],  S32, 0xEAA127FA);
 
+					c = HH(c, d, a, b, x[k+3],  S33, 0xD4EF3085);
 
+					b = HH(b, c, d, a, x[k+6],  S34, 0x4881D05);
 
+					a = HH(a, b, c, d, x[k+9],  S31, 0xD9D4D039);
 
+					d = HH(d, a, b, c, x[k+12], S32, 0xE6DB99E5);
 
+					c = HH(c, d, a, b, x[k+15], S33, 0x1FA27CF8);
 
+					b = HH(b, c, d, a, x[k+2],  S34, 0xC4AC5665);
 
+					a = II(a, b, c, d, x[k+0],  S41, 0xF4292244);
 
+					d = II(d, a, b, c, x[k+7],  S42, 0x432AFF97);
 
+					c = II(c, d, a, b, x[k+14], S43, 0xAB9423A7);
 
+					b = II(b, c, d, a, x[k+5],  S44, 0xFC93A039);
 
+					a = II(a, b, c, d, x[k+12], S41, 0x655B59C3);
 
+					d = II(d, a, b, c, x[k+3],  S42, 0x8F0CCC92);
 
+					c = II(c, d, a, b, x[k+10], S43, 0xFFEFF47D);
 
+					b = II(b, c, d, a, x[k+1],  S44, 0x85845DD1);
 
+					a = II(a, b, c, d, x[k+8],  S41, 0x6FA87E4F);
 
+					d = II(d, a, b, c, x[k+15], S42, 0xFE2CE6E0);
 
+					c = II(c, d, a, b, x[k+6],  S43, 0xA3014314);
 
+					b = II(b, c, d, a, x[k+13], S44, 0x4E0811A1);
 
+					a = II(a, b, c, d, x[k+4],  S41, 0xF7537E82);
 
+					d = II(d, a, b, c, x[k+11], S42, 0xBD3AF235);
 
+					c = II(c, d, a, b, x[k+2],  S43, 0x2AD7D2BB);
 
+					b = II(b, c, d, a, x[k+9],  S44, 0xEB86D391);
 
+					a = addUnsigned(a, AA);
 
+					b = addUnsigned(b, BB);
 
+					c = addUnsigned(c, CC);
 
+					d = addUnsigned(d, DD);
 
+				}
 
+				var tempValue = wordToHex(a) + wordToHex(b) + wordToHex(c) + wordToHex(d);
 
+				return tempValue.toLowerCase();
 
+			}
 
+		});
 
+	})(jQuery);

文件差異過大導致無法顯示
+ 10220 - 0
public/static/js/videoPlayer/jquery-3.1.1.js


文件差異過大導致無法顯示
+ 1 - 0
public/static/js/videoPlayer/linkplayer.js


文件差異過大導致無法顯示
+ 1217 - 0
public/static/js/videoPlayer/platform.js


文件差異過大導致無法顯示
+ 26804 - 0
public/static/js/videoPlayer/video.js


+ 1 - 1
src/assets/icon/svg/风机.svg
查看文件 

@@ -23,6 +23,6 @@
 
 		c-0.615,0.271-1.052,0.836-1.158,1.5c-0.886,5.22-3.695,9.918-7.875,13.166c-0.533,0.42-0.823,1.074-0.775,1.75
 
 		c0.05,0.668,0.45,1.275,1.041,1.634c26.25,14.267,57.268,29.524,66.15,29.75c0.967-0.024,2.283-0.158,3.233-1.476
 
 		c0.267-0.469,0.407-1,0.408-1.541C182.537,133.341,174.862,127.999,163.604,119.332L163.604,119.332z" />
 
-		<animateTransform attributeType="XML" attributeName="transform" begin="0s" dur="3s" type="rotate" from="0 99 90" to="360 99 90" repeatCount="indefinite" />
 
+		<animateTransform attributeType="XML" attributeName="transform" begin="0s" dur="3s" type="rotate" from="0 99 90" to="-360 99 90" repeatCount="indefinite" />
 
 	</g>
 
 </svg>

二進制
src/assets/png/booster-station.png
查看文件


+ 41 - 1
src/assets/styles/el-override/el-input.less
查看文件 

@@ -1,6 +1,6 @@
 
 @picker-bg-color: fade(#121d1c, 95);
 
 
-.main-body {
 
+body {
 
   .el-input__inner {
 
     background: fade(@gray, 20);
 
     color: @gray-l;
 
@@ -98,6 +98,42 @@
 
     }
 
   }
 
 
+  .el-checkbox {
 
+    height: 33px;
 
+    line-height: 33px;
 
+    color: @gray-l;
 
+
 
+    &.is-bordered {
 
+      height: 33px;
 
+      line-height: 33px;
 
+      padding: 0px 20px;
 
+      border-color: @gray;
 
+
 
+      &.is-checked {
 
+        border-color: @green;
 
+      }
 
+    }
 
+
 
+    .el-checkbox__inner {
 
+      background: fade(@gray, 20);
 
+      border-color: fade(@gray, 40);
 
+    }
 
+
 
+    .el-checkbox__input.is-checked + .el-checkbox__label {
 
+      color: @green;
 
+    }
 
+
 
+    .el-checkbox__input.is-checked .el-checkbox__inner,
 
+    .el-checkbox__input.is-indeterminate .el-checkbox__inner {
 
+      background-color: @green;
 
+      border-color: @green;
 
+    }
 
+
 
+    .el-checkbox__input.is-focus .el-checkbox__inner {
 
+      border-color: @green;
 
+    }
 
+  }
 
+
 
   // 树组件
 
   .el-tree {
 
     color: @gray-l;
 
@@ -108,6 +144,10 @@
 
       border-color: @gray;
 
     }
 
 
+    .el-tree-node:focus > .el-tree-node__content {
 
+      background: transparent;
 
+    }
 
+
 
     .el-checkbox__input.is-disabled .el-checkbox__inner {
 
       background: @gray;
 
       border-color: @gray;

+ 15 - 7
src/components/arcgis/arcgis.vue
查看文件 

@@ -1,12 +1,15 @@
 
 <template>
 
     <div class="arcgis" :class="{'pointer': pointer}">
 
         <div id="viewDiv"></div>
 
-        <div id="marker">
 
-            <div v-for="(marker, index) of markers" :key="index" v-show="marker.show" 
-                :id="'arcgic-marker-' + marker.slot" class="arcgis-marker" :style="'left: '+marker.x+'px; top: '+marker.y+'px;'">
 
-                <slot :name="marker.slot"></slot>
 
+        <teleport to=".esri-ui" v-if="teleport">
 
+            <div id="marker">
 
+                <div v-for="(marker, index) of markers" :key="index" v-show="marker.show" 
+                    :id="'arcgic-marker-' + marker.slot" class="arcgis-marker" :style="'left: '+marker.x+'px; top: '+marker.y+'px; transform: scale('+marker.scale+')'">
 
+                    <slot :name="marker.slot"></slot>
 
+                </div>
 
             </div>
 
-        </div>
 
+        </teleport>
 
+        
     </div>
 
 </template>
 
 
@@ -106,9 +109,10 @@
 
                         img: require("@assets/map/fan/white.png")
 
                     },
 
                 ],
 
-                syzImg: require("@assets/temp.png"),
 
+                syzImg: require("@assets/png/booster-station.png"),
 
                 markers: [],
 
                 pointer: false,
 
+                teleport: false, // 是否进行传送
 
             }
 
         },
 
         // 函数
 
@@ -179,6 +183,7 @@
 
             },
 
             when: function() {
 
                 // 当地图加载完成
 
+                this.teleport = true; // 传送
 
                 point_graphicsLayer = new GraphicsLayer({
 
                     graphics: []
 
                 });
 
@@ -239,7 +244,9 @@
 
                         let screenPoint = view.toScreen(graphics.geometry);
 
                         marker.x = screenPoint.x - marker.ox;
 
                         marker.y = screenPoint.y - marker.oy;
 
-                        if (evt.height < 0.045) { 
+                        marker.scale =  0.0272 / evt.height;
 
+                        // console.log(evt.height)
 
+                        if (evt.height < 0.295) { 
                             if (!marker.show) {
 
                                 marker.show = true;
 
                                 graphics.symbol = new SimpleMarkerSymbol({
 
@@ -307,6 +314,7 @@
 
                     oy: oy,
 
                     x: screenPoint.x - ox,
 
                     y: screenPoint.y - oy,
 
+                    scale: 1,
 
                     show: true,
 
                 };
 
                 this.markers.push(marker);

+ 16 - 16
src/components/chart/combination/area-bar-chart.vue
查看文件 

@@ -88,23 +88,23 @@ export default {
 
       default: () => ["#323E6F", "#1DA0D7", "#02BB4C", "#DB5520", "#EDB32F", "#EDEB2F"],
 
     },
 
   },
 
-  data () {
 
+  data() {
 
     return {
 
       id: "",
 
       chart: null,
 
     };
 
   },
 
   computed: {
 
-    legend () {
 
+    legend() {
 
       let data = this.bardata.legend;
 
       data.push(this.units[0]);
 
       return data;
 
     },
 
-    areaChartData () {
 
+    areaChartData() {
 
       let data = [];
 
       for (var i = 0; i < this.areaData.length; i++) {
 
         let item = this.areaData[i];
 
-        var color = (item.color ? item.color : partten.getColor(item.state));
 
+        var color = item.color ? item.color : partten.getColor(item.state);
 
         data.push({
 
           name: item.name,
 
           value: [item.start, item.end, item.end - item.start],
 
@@ -120,7 +120,7 @@ export default {
 
     },
 
   },
 
   methods: {
 
-    renderItem (params, api) {
 
+    renderItem(params, api) {
 
       var start = api.coord([api.value(0)]);
 
       var end = api.coord([api.value(1)]);
 
       var height = api.size([0, 1])[1];
 
@@ -149,7 +149,7 @@ export default {
 
         }
 
       );
 
     },
 
-    initChart () {
 
+    initChart() {
 
       let that = this;
 
       let chart = echarts.init(this.$el);
 
 
@@ -203,7 +203,7 @@ export default {
 
             min: 0,
 
             axisLabel: {
 
               show: false,
 
-              formatter: function (val) {
 
+              formatter: function(val) {
 
                 return Math.max(0, val - 0) + " ms";
 
               },
 
             },
 
@@ -254,7 +254,7 @@ export default {
 
             },
 
           },
 
           {
 
-            data: [(this.areaData && this.areaData[0] && this.areaData[0].name || "")],
 
+            data: [(this.areaData && this.areaData[0] && this.areaData[0].name) || ""],
 
             axisLabel: { show: false },
 
           },
 
         ],
 
@@ -271,11 +271,11 @@ export default {
 
             smooth: true, //平滑展示
 
             yAxisIndex: 0,
 
             lineStyle: {
 
-              color: this.color[index]
 
+              color: this.color[index],
 
             },
 
             itemStyle: {
 
-              color: this.color[index]
 
-            }
 
+              color: this.color[index],
 
+            },
 
           });
 
         });
 
       }
 
@@ -308,7 +308,7 @@ export default {
 
           },
 
           tooltip: {
 
             show: true,
 
-            formatter: function (params) {
 
+            formatter: function(params) {
 
               return params.marker + params.name + ": " + params.value[2] + "s";
 
             },
 
           },
 
@@ -322,7 +322,7 @@ export default {
 
 
       chart.setOption(option);
 
 
-      chart.on("click", function (e, p) {
 
+      chart.on("click", function(e, p) {
 
         if (e.seriesType == "custom") {
 
           that.$emit("areaClick", { data: e.data.exData });
 
         }
 
@@ -332,17 +332,17 @@ export default {
 
   emits: {
 
     areaClick: null,
 
   },
 
-  created () {
 
+  created() {
 
     this.id = "pie-chart-" + util.newGUID();
 
   },
 
-  mounted () {
 
+  mounted() {
 
     this.$nextTick(() => {
 
       this.$el.style.width = this.width;
 
       this.$el.style.height = this.height;
 
       this.initChart();
 
     });
 
   },
 
-  updated () {
 
+  updated() {
 
     this.$nextTick(() => {
 
       this.initChart();
 
     });

+ 468 - 0
src/components/chart/combination/area-line-chart.vue
查看文件 

@@ -0,0 +1,468 @@
 
+<template>
 
+  <div class="chart" :id="id"></div>
 
+</template>
 
+
 
+<script>
 
+import util from "@/helper/util.js";
 
+import partten from "@/helper/partten.js";
 
+import * as echarts from "echarts";
 
+
 
+export default {
 
+  name: "multiple-bar-chart",
 
+  componentName: "multiple-bar-chart",
 
+  props: {
 
+    width: {
 
+      type: String,
 
+      default: "100%",
 
+    },
 
+    height: {
 
+      type: String,
 
+      default: "800px",
 
+    },
 
+    lineData: {
 
+      type: Array,
 
+      default: () => [
 
+        {
 
+          text: "日发电量",
 
+          value: [
 
+            {
 
+              text: "1",
 
+              value: 1,
 
+            },
 
+            {
 
+              text: "2",
 
+              value: 2,
 
+            },
 
+            {
 
+              text: "3",
 
+              value: 1,
 
+            },
 
+            {
 
+              text: "4",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "5",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "6",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "7",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "8",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "9",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "10",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "11",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "12",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "13",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "14",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "15",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "16",
 
+              value: 3,
 
+            },
 
+          ],
 
+        },
 
+        {
 
+          text: "上网电量",
 
+          value: [
 
+            {
 
+              text: "1",
 
+              value: 1,
 
+            },
 
+            {
 
+              text: "2",
 
+              value: 2,
 
+            },
 
+            {
 
+              text: "3",
 
+              value: 1,
 
+            },
 
+            {
 
+              text: "4",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "5",
 
+              value: 4,
 
+            },
 
+            {
 
+              text: "6",
 
+              value: 5,
 
+            },
 
+            {
 
+              text: "7",
 
+              value: 6,
 
+            },
 
+            {
 
+              text: "8",
 
+              value: 7,
 
+            },
 
+            {
 
+              text: "9",
 
+              value: 8,
 
+            },
 
+            {
 
+              text: "10",
 
+              value: 7,
 
+            },
 
+            {
 
+              text: "11",
 
+              value: 9,
 
+            },
 
+            {
 
+              text: "12",
 
+              value: 2,
 
+            },
 
+            {
 
+              text: "13",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "14",
 
+              value: 5,
 
+            },
 
+            {
 
+              text: "15",
 
+              value: 12,
 
+            },
 
+            {
 
+              text: "16",
 
+              value: 11,
 
+            },
 
+          ],
 
+        },
 
+      ],
 
+    },
 
+    areaData: {
 
+      type: Array,
 
+      default: () => [
 
+        {
 
+          name: "1",
 
+          start: 0,
 
+          end: 100,
 
+          state: "green",
 
+        },
 
+        {
 
+          name: "1",
 
+          start: 100,
 
+          end: 200,
 
+          state: "red",
 
+        },
 
+        {
 
+          name: "1",
 
+          start: 200,
 
+          end: 300,
 
+          state: "yellow",
 
+        },
 
+        {
 
+          name: "2",
 
+          start: 300,
 
+          end: 800,
 
+          state: "green",
 
+        },
 
+        {
 
+          name: "3",
 
+          start: 800,
 
+          end: 9000,
 
+          state: "green",
 
+        },
 
+      ],
 
+    },
 
+    // 单位
 
+    units: {
 
+      type: Array,
 
+      default: () => ["健康趋势", "风机健康状态数量"],
 
+    },
 
+    // 显示 legend
 
+    showLegend: {
 
+      type: Boolean,
 
+      default: true,
 
+    },
 
+    // 颜色
 
+    color: {
 
+      type: Array,
 
+      default: () => ["#323E6F", "#1DA0D7", "#02BB4C", "#DB5520", "#EDB32F", "#EDEB2F"],
 
+    },
 
+  },
 
+  data() {
 
+    return {
 
+      id: "",
 
+      chart: null,
 
+    };
 
+  },
 
+  computed: {
 
+    legend() {
 
+      let data = [];
 
+      this.lineData.forEach((value, index) => {
 
+        data.push(value.text);
 
+      });
 
+      return data;
 
+    },
 
+    xAxisData() {
 
+      let data = [];
 
+      if (this.lineData.length > 0)
 
+        this.lineData[0].value.forEach((value, index) => {
 
+          data.push(value.text);
 
+        });
 
+      return data;
 
+    },
 
+    areaChartData() {
 
+      let data = [];
 
+      for (var i = 0; i < this.areaData.length; i++) {
 
+        let item = this.areaData[i];
 
+        var color = item.state;
 
+        data.push({
 
+          name: item.name,
 
+          value: [item.start, item.end, item.end - item.start],
 
+          itemStyle: {
 
+            normal: {
 
+              color: color,
 
+            },
 
+          },
 
+          exData: item,
 
+        });
 
+      }
 
+      return data;
 
+    },
 
+    areaMax() {
 
+      let max = 0;
 
+      this.areaData.forEach((value) => {
 
+        if (max < value.end) max = value.end;
 
+      });
 
+      return max;
 
+    },
 
+  },
 
+  methods: {
 
+    renderItem(params, api) {
 
+      var start = api.coord([api.value(0)]);
 
+      var end = api.coord([api.value(1)]);
 
+      var height = api.size([0, 1])[1];
 
+
 
+      var rectShape = echarts.graphic.clipRectByRect(
 
+        {
 
+          x: start[0],
 
+          y: start[1] - height / 2,
 
+          width: end[0] - start[0],
 
+          height: height,
 
+        },
 
+        {
 
+          x: params.coordSys.x,
 
+          y: params.coordSys.y,
 
+          width: params.coordSys.width,
 
+          height: params.coordSys.height,
 
+        }
 
+      );
 
+
 
+      return (
 
+        rectShape && {
 
+          type: "rect",
 
+          transition: ["shape"],
 
+          shape: rectShape,
 
+          style: api.style(),
 
+        }
 
+      );
 
+    },
 
+    initChart() {
 
+      let that = this;
 
+      let chart = echarts.init(this.$el);
 
+
 
+      let option = {
 
+        color: this.color,
 
+        grid: {
 
+          left: 40,
 
+          right: 40,
 
+          bottom: 40,
 
+          top: 32,
 
+          containLabel: true,
 
+        },
 
+        tooltip: {
 
+          show: true,
 
+          trigger: "item",
 
+          backgroundColor: "rgba(0,0,0,0.4)",
 
+          borderColor: partten.getColor("gray"),
 
+          textStyle: {
 
+            color: "#fff",
 
+            fontSize: 14,
 
+          },
 
+        },
 
+        legend: {
 
+          show: this.showLegend,
 
+          data: this.legend,
 
+          right: 120,
 
+          icon: "ract",
 
+          itemWidth: 8,
 
+          itemHeight: 8,
 
+          inactiveColor: partten.getColor("gray"),
 
+          textStyle: {
 
+            color: partten.getColor("grayl"),
 
+            fontSize: 12,
 
+          },
 
+        },
 
+        xAxis: [
 
+          {
 
+            type: "category",
 
+            axisLabel: {
 
+              color: partten.getColor("gray"),
 
+            },
 
+            axisLine: {
 
+              show: false,
 
+            },
 
+            axisTick: {
 
+              show: false,
 
+            },
 
+            data: this.xAxisData,
 
+          },
 
+          {
 
+            min: 0,
 
+            max: this.areaMax,
 
+            axisLabel: {
 
+              show: false,
 
+              formatter: function(val) {
 
+                return Math.max(0, val - 0) + " ms";
 
+              },
 
+            },
 
+          },
 
+        ],
 
+        yAxis: [
 
+          {
 
+            type: "value",
 
+            name: this.units[0],
 
+            axisLabel: {
 
+              formatter: "{value} ",
 
+              color: partten.getColor("gray"),
 
+            },
 
+            axisLine: {
 
+              type: "dashed",
 
+              lineStyle: {
 
+                color: partten.getColor("gray"),
 
+              },
 
+              width: 5,
 
+            },
 
+            axisTick: {
 
+              show: false,
 
+            },
 
+            splitLine: {
 
+              lineStyle: {
 
+                type: "dashed",
 
+                dashOffset: 10,
 
+                color: partten.getColor("gray") + 80,
 
+              },
 
+            },
 
+          },
 
+          {
 
+            data: [this.areaData[0].name],
 
+            axisLabel: { show: false },
 
+          },
 
+        ],
 
+        series: [],
 
+      };
 
+
 
+      // line data
 
+      if (this.lineData.length > 0) {
 
+        this.lineData.forEach((value, index) => {
 
+          option.series.push({
 
+            name: value.text,
 
+            type: "line",
 
+            data: value.value,
 
+            smooth: true, //平滑展示
 
+            yAxisIndex: 0,
 
+            // lineStyle: {
 
+            //   color: partten.getColor("green"),
 
+            // },
 
+            // itemStyle: {
 
+            //   color: partten.getColor("green"),
 
+            // },
 
+          });
 
+        });
 
+      }
 
+
 
+      // 区域
 
+      if (this.areaData && this.areaData.length > 0) {
 
+        option.series.push({
 
+          type: "custom",
 
+          renderItem: this.renderItem,
 
+          yAxisIndex: 1,
 
+          xAxisIndex: 1,
 
+          itemStyle: {
 
+            opacity: 0.2,
 
+          },
 
+          tooltip: {
 
+            show: true,
 
+            formatter: function(params) {
 
+              return params.marker + params.name + ": " + params.value[2] + "s";
 
+            },
 
+          },
 
+          encode: {
 
+            x: [1, 2],
 
+            y: 0,
 
+          },
 
+          data: this.areaChartData,
 
+        });
 
+      }
 
+
 
+      chart.setOption(option);
 
+
 
+      chart.on("click", function(e, p) {
 
+        if (e.seriesType == "custom") {
 
+          that.$emit("areaClick", { data: e.data.exData });
 
+        }
 
+      });
 
+    },
 
+  },
 
+  emits: {
 
+    areaClick: null,
 
+  },
 
+  created() {
 
+    this.id = "pie-chart-" + util.newGUID();
 
+  },
 
+  mounted() {
 
+    this.$nextTick(() => {
 
+      this.$el.style.width = this.width;
 
+      this.$el.style.height = this.height;
 
+      this.initChart();
 
+    });
 
+  },
 
+  updated() {
 
+    this.$nextTick(() => {
 
+      this.initChart();
 
+    });
 
+  },
 
+};
 
+</script>
 
+
 
+<style lang="less">
 
+.chart {
 
+  width: 100%;
 
+  height: 100%;
 
+  display: inline-block;
 
+}
 
+</style>

+ 34 - 34
src/components/chart/line/marker-line-chart.vue
查看文件 

@@ -160,40 +160,40 @@ export default {
 
               width: 1,
 
             },
 
           },
 
-          markPoint:{},
 
-            // index == 0
 
-            //   ? {
 
-            //       data: [
 
-            //         {
 
-            //           type: "average",
 
-            //           name: "保证功率",
 
-            //           symbolSize: 0,
 
-            //           label: {
 
-            //             offset: [0, -40],
 
-            //             formatter: function(param) {
 
-            //               return `{title|${param.name}}` + "\n" + `{value| ${param.value}${that.unit}}`;
 
-            //             },
 
-            //             backgroundColor: partten.getColor("green") + 33,
 
-            //             borderColor: partten.getColor("green"),
 
-            //             borderWidth: 0.5,
 
-            //             borderRadius: 2,
 
-            //             padding: 8,
 
-            //             rich: {
 
-            //               title: {
 
-            //                 color: partten.getColor("green"),
 
-            //                 fontSize: 12,
 
-            //               },
 
-            //               value: {
 
-            //                 color: "#fff",
 
-            //                 fontSize: 16,
 
-            //                 padding: [12, 0, 0, -4],
 
-            //               },
 
-            //             },
 
-            //           },
 
-            //         },
 
-            //       ],
 
-            //     }
 
-            //   : {},
 
+          markPoint: {},
 
+          // index == 0
 
+          //   ? {
 
+          //       data: [
 
+          //         {
 
+          //           type: "average",
 
+          //           name: "保证功率",
 
+          //           symbolSize: 0,
 
+          //           label: {
 
+          //             offset: [0, -40],
 
+          //             formatter: function(param) {
 
+          //               return `{title|${param.name}}` + "\n" + `{value| ${param.value}${that.unit}}`;
 
+          //             },
 
+          //             backgroundColor: partten.getColor("green") + 33,
 
+          //             borderColor: partten.getColor("green"),
 
+          //             borderWidth: 0.5,
 
+          //             borderRadius: 2,
 
+          //             padding: 8,
 
+          //             rich: {
 
+          //               title: {
 
+          //                 color: partten.getColor("green"),
 
+          //                 fontSize: 12,
 
+          //               },
 
+          //               value: {
 
+          //                 color: "#fff",
 
+          //                 fontSize: 16,
 
+          //                 padding: [12, 0, 0, -4],
 
+          //               },
 
+          //             },
 
+          //           },
 
+          //         },
 
+          //       ],
 
+          //     }
 
+          //   : {},
 
           yAxisIndex: value.yAxisIndex,
 
           data: value.value.map((t) => {
 
             return t.value;

+ 328 - 0
src/components/chart/line/zoom-line-chart.vue
查看文件 

@@ -0,0 +1,328 @@
 
+<template>
 
+  <div class="chart" :id="id"></div>
 
+</template>
 
+
 
+<script>
 
+import util from "@/helper/util.js";
 
+import partten from "@/helper/partten.js";
 
+import * as echarts from "echarts";
 
+
 
+export default {
 
+  name: "normal-line-chart",
 
+  componentName: "normal-line-chart",
 
+  props: {
 
+    width: {
 
+      type: String,
 
+      default: "100%",
 
+    },
 
+    height: {
 
+      type: String,
 
+      default: "13.889vh",
 
+    },
 
+    // 数据
 
+    list: {
 
+      type: Array,
 
+      default: () => [
 
+        {
 
+          title: "日发电量",
 
+          yAxisIndex: 0,
 
+          value: [
 
+            {
 
+              text: "1",
 
+              value: 1,
 
+            },
 
+            {
 
+              text: "2",
 
+              value: 2,
 
+            },
 
+            {
 
+              text: "3",
 
+              value: 1,
 
+            },
 
+            {
 
+              text: "4",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "5",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "6",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "7",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "8",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "9",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "10",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "11",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "12",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "13",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "14",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "15",
 
+              value: 3,
 
+            },
 
+            {
 
+              text: "16",
 
+              value: 3,
 
+            },
 
+          ],
 
+        },
 
+        {
 
+          title: "上网电量",
 
+          yAxisIndex: 0,
 
+          value: [
 
+            {
 
+              text: "1",
 
+              value: 1,
 
+            },
 
+            {
 
+              text: "2",
 
+              value: 2,
 
+            },
 
+            {
 
+              text: "3",
 
+              value: 1,
 
+            },
 
+            {
 
+              text: "4",
 
+              value: 3,
 
+            },
 
+          ],
 
+        },
 
+      ],
 
+    },
 
+    // 单位
 
+    units: {
 
+      type: Array,
 
+      default: () => ["(MW)"],
 
+    },
 
+    showLegend: {
 
+      type: Boolean,
 
+      default: false,
 
+    },
 
+    smooth: {
 
+      type: Boolean,
 
+      default: true,
 
+    },
 
+  },
 
+  data() {
 
+    return {
 
+      id: "",
 
+      chart: null,
 
+      color: ["#05bb4c", "#4b55ae", "#fa8c16", "#f8de5b"],
 
+    };
 
+  },
 
+  computed: {
 
+    legend() {
 
+      return this.list.map((t) => {
 
+        return t.title;
 
+      });
 
+    },
 
+    xdata() {
 
+      return this.list[0].value.map((t) => {
 
+        return t.text;
 
+      });
 
+    },
 
+    yAxis() {
 
+      let result = [];
 
+      this.units.forEach((value, index) => {
 
+        result.push({
 
+          type: "value",
 
+          name: value,
 
+          axisLabel: {
 
+            formatter: "{value}",
 
+            fontSize: util.vh(14),
 
+          },
 
+          //分格线
 
+          splitLine: {
 
+            lineStyle: {
 
+              color: partten.getColor("gray") + 55,
 
+              type: "dashed",
 
+            },
 
+          },
 
+        });
 
+      });
 
+
 
+      return result;
 
+    },
 
+    series() {
 
+      let result = [];
 
+
 
+      this.list.forEach((value, index) => {
 
+        result.push({
 
+          name: value.title,
 
+          type: "line",
 
+          smooth: this.smooth,
 
+          zlevel: index,
 
+          lineStyle: {
 
+            normal: {
 
+              color: this.color[index],
 
+              width: 1,
 
+            },
 
+          },
 
+          yAxisIndex: value.yAxisIndex,
 
+          data: value.value.map((t) => {
 
+            return t.value;
 
+          }),
 
+        });
 
+      });
 
+
 
+      return result;
 
+    },
 
+  },
 
+  methods: {
 
+    initChart() {
 
+      const chart = echarts.init(this.$el);
 
+
 
+      let option = {
 
+        color: this.color,
 
+        tooltip: {
 
+          trigger: "axis",
 
+          backgroundColor: "rgba(0,0,0,0.4)",
 
+          borderColor: partten.getColor("gray"),
 
+          textStyle: {
 
+            color: "#fff",
 
+            fontSize: util.vh(16),
 
+          },
 
+        },
 
+        legend: {
 
+          show: this.showLegend,
 
+          data: this.legend,
 
+          right: 56,
 
+          icon: "circle",
 
+          itemWidth: 6,
 
+          inactiveColor: partten.getColor("gray"),
 
+          textStyle: {
 
+            color: partten.getColor("grayl"),
 
+            fontSize: 12,
 
+          },
 
+        },
 
+        grid: {
 
+          top: 32,
 
+          left: 40,
 
+          right: 40,
 
+          bottom: 80,
 
+        },
 
+        dataZoom: [
 
+          {
 
+            type: "inside",
 
+            start: 0,
 
+            end: 100,
 
+          },
 
+          {
 
+            start: 0,
 
+            end: 100,
 
+            height: 40,
 
+            bottom: 8,
 
+            backgroundColor: "transparent",
 
+            // handleIcon: "path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z",
 
+            handleStyle: {
 
+              color: partten.getColor("yellow"),
 
+            },
 
+            moveHandleSize: 0,
 
+            dataBackground: {
 
+              lineStyle: {
 
+                color: partten.getColor("gray"),
 
+              },
 
+              areaStyle: {
 
+                color: partten.getColor("gray"),
 
+              },
 
+            },
 
+            selectedDataBackground: {
 
+              lineStyle: {
 
+                color: partten.getColor("yellow"),
 
+              },
 
+              areaStyle: {
 
+                color: partten.getColor("yellow"),
 
+              },
 
+            },
 
+            fillerColor: "transparent",
 
+            textStyle: {
 
+              color: partten.getColor("grayl"),
 
+            },
 
+            borderColor: partten.getColor("gray"),
 
+            brushSelect: false,
 
+          },
 
+        ],
 
+        xAxis: [
 
+          {
 
+            type: "category",
 
+            boundaryGap: false,
 
+            axisLabel: {
 
+              formatter: "{value}",
 
+              fontSize: util.vh(14),
 
+              textStyle: {
 
+                color: partten.getColor("gray"),
 
+              },
 
+            },
 
+            data: this.xdata,
 
+          },
 
+        ],
 
+        yAxis: this.yAxis,
 
+        series: this.series,
 
+      };
 
+
 
+      chart.clear();
 
+      chart.setOption(option);
 
+
 
+      this.resize = function() {
 
+        chart.resize();
 
+      };
 
+
 
+      window.addEventListener("resize", this.resize);
 
+    },
 
+  },
 
+  created() {
 
+    this.id = "pie-chart-" + util.newGUID();
 
+  },
 
+  mounted() {
 
+    this.$nextTick(() => {
 
+      this.$el.style.width = this.width;
 
+      this.$el.style.height = this.height;
 
+      this.initChart();
 
+    });
 
+  },
 
+  updated() {
 
+    this.$nextTick(() => {
 
+      this.initChart();
 
+    });
 
+  },
 
+  unmounted() {
 
+    window.removeEventListener("resize", this.resize);
 
+  },
 
+};
 
+</script>
 
+
 
+<style lang="less">
 
+.chart {
 
+  width: 100%;
 
+  height: 100%;
 
+  display: inline-block;
 
+}
 
+</style>

+ 17 - 12
src/components/chart/radar/normal-radar-chart.vue
查看文件 

@@ -82,22 +82,27 @@ export default {
 
   methods: {
 
     initChart() {
 
       let chart = echarts.init(this.$el);
 
+
 
       let maxValue = -1;
 
-      this.value[0].data.forEach((item, index) => {
 
-        item.value.forEach((value) => {
 
-          if (value > maxValue) {
 
-            maxValue = value;
 
-          }
 
+
 
+      if (this.value.length > 0)
 
+        this.value[0].data.forEach((item, index) => {
 
+          item.value.forEach((value) => {
 
+            if (value > maxValue) {
 
+              maxValue = value;
 
+            }
 
+          });
 
+          item.areaStyle = this.lineStyles[index % this.lineStyles.length].areaStyle;
 
+          item.lineStyle = this.lineStyles[index % this.lineStyles.length].lineStyle;
 
+          item.itemStyle = this.lineStyles[index % this.lineStyles.length].itemStyle;
 
         });
 
-        item.areaStyle = this.lineStyles[index % this.lineStyles.length].areaStyle;
 
-        item.lineStyle = this.lineStyles[index % this.lineStyles.length].lineStyle;
 
-        item.itemStyle = this.lineStyles[index % this.lineStyles.length].itemStyle;
 
-      });
 
       maxValue *= 1.5;
 
+
 
       let indicator = [];
 
-      this.value[0].indicator.forEach((item) => {
 
-        indicator.push({ name: item, max: maxValue });
 
-      });
 
+      if (this.value.length > 0)
 
+        this.value[0].indicator.forEach((item) => {
 
+          indicator.push({ name: item, max: maxValue });
 
+        });
 
 
       let option = {
 
         grid: {

+ 24 - 13
src/components/chart/radar/radar-chart.vue
查看文件 

@@ -69,21 +69,24 @@ export default {
 
       let chart = echarts.init(this.$el);
 
 
       let maxValue = -1;
 
-      this.value.data.forEach((item, index) => {
 
-        item.value.forEach((value) => {
 
-          if (value > maxValue) {
 
-            maxValue = value;
 
-          }
 
+      if (this.value.data)
 
+        this.value.data.forEach((item, index) => {
 
+          item.value.forEach((value) => {
 
+            if (value > maxValue) {
 
+              maxValue = value;
 
+            }
 
+          });
 
+          item.areaStyle = this.lineStyles[index % this.lineStyles.length].areaStyle;
 
+          item.lineStyle = this.lineStyles[index % this.lineStyles.length].lineStyle;
 
+          item.itemStyle = this.lineStyles[index % this.lineStyles.length].itemStyle;
 
         });
 
-        item.areaStyle = this.lineStyles[index % this.lineStyles.length].areaStyle;
 
-        item.lineStyle = this.lineStyles[index % this.lineStyles.length].lineStyle;
 
-        item.itemStyle = this.lineStyles[index % this.lineStyles.length].itemStyle;
 
-      });
 
       maxValue *= 1.5;
 
+
 
       let indicator = [];
 
-      this.value.indicator.forEach((item) => {
 
-        indicator.push({ name: item, max: maxValue });
 
-      });
 
+      if (this.value.indicator)
 
+        this.value.indicator.forEach((item) => {
 
+          indicator.push({ name: item, max: maxValue });
 
+        });
 
 
       let option = {
 
         grid: {
 
@@ -92,6 +95,15 @@ export default {
 
           bottom: 0,
 
           top: 0,
 
         },
 
+        tooltip: {
 
+          trigger: "item",
 
+          backgroundColor: "rgba(0,0,0,0.4)",
 
+          borderColor: partten.getColor("gray"),
 
+          textStyle: {
 
+            color: "#fff",
 
+            fontSize: util.vh(16),
 
+          },
 
+        },
 
         radar: [
 
           // 最低层 90
 
           {
 
@@ -100,7 +112,6 @@ export default {
 
             splitNumber: 1,
 
             nameGap: "10",
 
             name: {
 
-              show: false,
 
               textStyle: {
 
                 color: partten.getColor("gray") + 99,
 
                 fontSize: 12,

+ 7 - 8
src/components/coms/btn/btn-group-double.vue
查看文件 

@@ -122,15 +122,14 @@ export default {
 
     a {
 
       text-decoration: none;
 
       color: @gray;
 
-      margin-right: 0.278vh;
 
-      border: 0.093vh solid @darkgray;
 
-      border-radius: 0.185vh;
 
-      width: 12.5vh;
 
-      // height: 2.13vh;
 
-      // line-height: 2.13vh;
 
-      padding: 0.3704vh 0;
 
+      width: 105px;
 
+      height: 23px;
 
+      line-height: 23px;
 
+      font-size: 12px;
 
       text-align: center;
 
-      font-size: @fontsize-s;
 
+      margin-right: 4px;
 
+      border: 1px solid @darkgray;
 
+      border-radius: 2px;
 
 
       &:last-child {
 
         margin-right: 0;

+ 7 - 8
src/components/coms/table/table.vue
查看文件 

@@ -141,14 +141,14 @@ export default {
 
   },
 
   // 函数
 
   methods: {
 
-    clearCheckBox(time){
 
-      this.$nextTick(()=>{
 
-        setTimeout(()=>{
 
+    clearCheckBox(time) {
 
+      this.$nextTick(() => {
 
+        setTimeout(() => {
 
           const domArray = document.querySelectorAll(".curCheckBox");
 
-          for(let i=0;i<domArray.length;i++){
 
-            domArray[i].checked=false;
 
+          for (let i = 0; i < domArray.length; i++) {
 
+            domArray[i].checked = false;
 
           }
 
-        },(time || 300));
 
+        }, time || 300);
 
       });
 
     },
 
     onClick(col, data) {
 
@@ -212,5 +212,4 @@ export default {
 
 };
 
 </script>
 
 
-<style lang="less">
 
-</style>
 
+<style lang="less"></style>

+ 477 - 480
src/router/index.js
查看文件 

@@ -2,491 +2,488 @@ import { createRouter, createWebHashHistory } from 'vue-router'
 
 import Home from '../views/Home/Home.vue'
 
 
 const routes = [{
 
-        path: '/',
 
-        redirect: '/monitor/home'
 
-    },
 
-    {
 
-        path: '/monitor/home', // 驾驶舱
 
-        name: 'Home',
 
-        component: Home,
 
-    },
 
-    {
 
-        path: '/monitor/about',
 
-        name: 'About',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "about" */ '../views/About.vue'),
 
-    },
 
-    {
 
-        path: '/monitor/demo',
 
-        name: 'Demo',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "Demo" */ '../views/Demo.vue'),
 
-    },
 
-    {
 
-        path: '/monitor/status', // 状态监视
 
-        name: 'Status',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "status" */ '../views/Status/Status.vue'),
 
-    },
 
-    {
 
-        path: '/monitor/agc', // AGC 监视
 
-        name: 'Agc',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "agc" */ '../views/Agc/Agc.vue'),
 
-    },
 
-    {
 
-        path: '/monitor/windsite',
 
-        name: 'WindSite',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "windsite" */ '../views/WindSite/WindSite.vue'),
 
-        children: [{
 
-                path: 'home/:wpId', // 场站监视
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "windsitehome" */ '../views/WindSite/pages/Home/Home.vue'),
 
-            }, {
 
-                path: 'draughtfanlist/:wpId', // 风机列表
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "windsitedraughtfanlist" */ '../views/WindSite/pages/DraughtFanList.vue'),
 
-            }, {
 
-                path: 'matrix/:wpId', // 风场矩阵
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "windsitematrix" */ '../views/WindSite/pages/Matrix.vue'),
 
-            }, {
 
-                path: 'lightmatrix/:wpId',
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "windsitelightmatrix" */ '../views/WindSite/pages/LightMatrix.vue'),
 
-            }, {
 
-                path: 'box/:wpId',
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "windsitebox" */ '../views/WindSite/pages/Box.vue'),
 
-            }, {
 
-                path: 'info/:wpId/:wtId', // 单机状态监视
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "info" */ '../views/WindSite/pages/Info/Info.vue'),
 
-            }, {
 
-                path: 'tower/:wpId', // 测风塔
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "windsitetower" */ '../views/WindSite/pages/Tower.vue'),
 
-            }, {
 
-                path: 'inverter-info/:wpId',
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "inverter-info" */ '../views/WindSite/pages/Inverter-Info.vue'),
 
-            }, {
 
-                path: 'map/:wpId',
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "windsitemap" */ '../views/WindSite/pages/Map.vue'),
 
-            }, {
 
-                path: 'map1/:wpId',
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "windsitemap1" */ '../views/WindSite/pages/Map1.vue'),
 
-            },
 
-            {
 
-                path: 'boosterstation/:wpId', // 升压站
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "boosterstation" */ '../views/WindSite/pages/BoosterStation.vue'),
 
-            },
 
-            {
 
-                path: "generalappearance/:wpId", // 总样貌
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "generalappearance" */ "../views/WindSite/pages/GeneralAppearance.vue"),
 
-            },
 
-        ]
 
-    },
 
-    {
 
-        path: '/monitor/lightmatrix', // 光伏明细矩阵
 
-        name: 'LightMatrix',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "lightmatrix" */ '../views/LightMatrix/LightMatrix.vue'),
 
-    },
 
-    {
 
-        path: '/monitor/lightmatrix1', // 基础矩阵
 
-        name: 'LightMatrix1',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "lightmatrix1" */ '../views/LightMatrix1/LightMatrix1.vue'),
 
-    },
 
-    {
 
-        path: '/monitor/lightmatrix2', // 欠发矩阵
 
-        name: 'LightMatrix2',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "lightmatrix2" */ '../views/LightMatrix2/LightMatrix2.vue'),
 
-    }, {
 
-        path: '/monitor/lightmatrix3', // 明细矩阵
 
-        name: 'LightMatrix3',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "lightmatrix3" */ '../views/LightMatrix3/LightMatrix3.vue'),
 
-    }, {
 
-        path: '/decision/decision1', //风机绩效榜
 
-        name: 'decision1',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "decision1" */ '../views/Decision/Decision1.vue'),
 
-    },
 
-    {
 
-        path: '/decision/decision1Mx', //风机绩效榜明细
 
-        name: 'decision1Mx',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "decision1Mx" */ '../views/Decision/Decision1Mx.vue'),
 
-    },
 
-
 
-    {
 
-        path: '/decision/decision2', //五项损失率
 
-        name: 'decision2',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "decision2" */ '../views/Decision/Decision2.vue'),
 
-    },
 
-    {
 
-        path: '/decision/decision2Cndb', //场内对标
 
-        name: 'decision2Cndb',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "decision2Cndb" */ '../views/Decision/Decision2Cndb.vue'),
 
-    },
 
-    {
 
-        path: '/decision/decision2Cjdb', //场际对标
 
-        name: 'decision2Cjdb',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "decision2Cjdb" */ '../views/Decision/Decision2Cjdb.vue'),
 
-    },
 
-    {
 
-        path: '/decision/decision2Xmdb', //项目对标
 
-        name: 'decision2Xmdb',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "decision2Xmdb" */ '../views/Decision/Decision2Xmdb.vue'),
 
-    },
 
-    {
 
-        path: '/decision/decision2Xldb', //线路对标
 
-        name: 'decision2Xldb',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "decision2Xldb" */ '../views/Decision/Decision2Xldb.vue'),
 
-    },
 
-    {
 
-        path: '/decision/decision3', //性能对标
 
-        name: 'decision3',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "decision3" */ '../views/Decision/Decision3.vue'),
 
-    },
 
-    {
 
-        path: '/decision/decision4', //值际对标
 
-        name: 'decision4',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "decision4" */ '../views/Decision/Decision4.vue'),
 
-    },
 
-    {
 
-        path: '/decision/decision4czzl', //操作指令统计
 
-        name: 'decision4czzl',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "decision4czzl" */ '../views/Decision/Decision4Czzl.vue'),
 
-    },
 
-    {
 
-        path: '/health',
 
-        name: 'health',
 
-        component: () =>
 
-            import ('../views/HealthControl/Health.vue'),
 
-    },
 
-    {
 
-        path: '/health/healthDay', //风机  日  信息量化评级管理
 
-        name: 'healthDay',
 
-        component: () =>
 
-            import ('../views/HealthControl/HealthDay.vue'),
 
-    },
 
-    {
 
-        path: '/health/healthMonth', //风机  月  信息量化评级管理
 
-        name: 'healthMonth',
 
-        component: () =>
 
-            import ('../views/HealthControl/HealthMonth.vue'),
 
-    },
 
-    {
 
-        path: '/health/healthYear', //风机  年  信息量化评级管理
 
-        name: 'healthYear',
 
-        component: () =>
 
-            import ('../views/HealthControl/HealthYear.vue'),
 
-    },
 
-    {
 
-        path: '/health/health1',
 
-        name: 'health1',
 
-        component: () =>
 
-            import ('../views/HealthControl/Health1.vue'),
 
-    },
 
-    {
 
-        path: '/health/health2', // 健康管理首页
 
-        name: 'health2',
 
-        component: () =>
 
-            import ('../views/HealthControl/Health2.vue'),
 
-    },
 
-    {
 
-        path: '/health/health3/:wpId', // 场站健康管理
 
-        name: 'health3',
 
-        component: () =>
 
-            import ('../views/HealthControl/Health3.vue'),
 
-    },
 
-    {
 
-        path: '/health/health4',
 
-        name: 'health4',
 
-        children: [{
 
-                path: "/health/health0/:wpId/:wtId",
 
-                name: "health0",
 
-                component: () =>
 
-                    import ("../views/HealthControl/Health0.vue"),
 
-            }, {
 
-                path: "/health/health10/:wtId",
 
-                name: "health10",
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "health8" */ "../views/HealthControl/Health10.vue"),
 
-            }, {
 
-                path: 'healthLineChart/:wtId', // 风机健康趋势
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "healthLineChart" */ '../views/HealthControl/healthLineChart.vue'),
 
-            },
 
-            {
 
-                path: 'healthLineChart2/:wtId', // 健康趋势
 
-                component: () =>
 
-                    import ( /* webpackChunkName: "healthLineChart2" */ '../views/HealthControl/healthLineChart2.vue'),
 
-            }
 
-        ],
 
-        component: () =>
 
-            import ('../views/HealthControl/Health4.vue'),
 
-    },
 
-    {
 
-        path: '/health/health5/',
 
-        name: 'health5',
 
-        component: () =>
 
-            import ('../views/HealthControl/Health5.vue'),
 
-    },
 
-    {
 
-        path: '/health/health6', // 健康总览
 
-        name: 'health6',
 
-        component: () =>
 
-            import ('../views/HealthControl/Health6.vue'),
 
-    },
 
-    {
 
-        path: '/cutAnalyse', // 切入切出分析
 
-        name: 'cutAnalyse',
 
-        component: () =>
 
-            import ('../views/cutAnalyse/index.vue'),
 
-    },
 
-    {
 
-        path: '/cutAnalyse', // 切入切出分析
 
-        name: 'cutAnalyse',
 
-        component: () =>
 
-            import ('../views/cutAnalyse/index.vue'),
 
-    },
 
-    {
 
-        path: '/wtSaturability', // 单机饱和度
 
-        name: 'wtSaturability',
 
-        component: () =>
 
-            import ('../views/wtSaturability/index.vue'),
 
-    },
 
-    {
 
-        path: '/windAnalysis', // 风资源分析
 
-        name: 'windAnalysis',
 
-        component: () =>
 
-            import ('../views/windAnalysis/index.vue'),
 
-    },
 
-    {
 
-        path: '/powerRank', // 发电效率排行
 
-        name: 'powerRank',
 
-        component: () =>
 
-            import ('../views/powerRank/index.vue'),
 
-    },
 
-    {
 
-        path: '/totalPowerRank', // 总发电效率排行
 
-        name: 'totalPowerRank',
 
-        component: () =>
 
-            import ('../views/totalPowerRank/index.vue'),
 
-    },
 
-    {
 
-        path: '/warningRank', // 报警排行
 
-        name: 'warningRank',
 
-        component: () =>
 
-            import ('../views/warningRank/index.vue'),
 
-    },
 
-    {
 
-        path: '/realSearch', // 测点数据查询
 
-        name: 'realSearch',
 
-        component: () =>
 
-            import ('../views/realSearch/index.vue'),
 
-    },
 
-    {
 
-        path: '/singleAnalysis', // 单机月度分析
 
-        name: 'singleAnalysis',
 
-        component: () =>
 
-            import ('../views/singleAnalysis/index.vue'),
 
-    },
 
-    // {
 
-    //   path: '/performanceAnalysis', // 单机性能分析
 
-    //   name: 'performanceAnalysis',
 
-    //   component: () => import('../views/performanceAnalysis/index.vue'),
 
-    //   children: [{
 
-    //     path: "detail/:wpId",
 
-    //     name: "performanceAnalysisDetail",
 
-    //     component: () => import("../views/performanceAnalysis/detail/index.vue"),
 
-    //   }]
 
-    // },
 
-    {
 
-        path: '/historySearch', // 测点历史数据查询
 
-        name: 'historySearch',
 
-        component: () =>
 
-            import ('../views/historySearch/index.vue'),
 
-    },
 
-    {
 
-        path: '/knowledge', //故障知识列表
 
-        name: 'knowledge1',
 
-        component: () =>
 
-            import ('../views/Knowledge/Knowledge1.vue'),
 
-    },
 
-    {
 
-        path: '/knowledge2', //安全措施知识
 
-        name: 'knowledge2',
 
-        component: () =>
 
-            import ('../views/Knowledge/Knowledge2.vue'),
 
-    },
 
-    {
 
-        path: '/knowledge3', //风险辨识知识
 
-        name: 'knowledge3',
 
-        component: () =>
 
-            import ('../views/Knowledge/Knowledge3.vue'),
 
-    },
 
-    {
 
-        path: '/knowledge4', //作业指导知识
 
-        name: 'knowledge4',
 
-        component: () =>
 
-            import ('../views/Knowledge/Knowledge4.vue'),
 
-    },
 
-    {
 
-        path: '/knowledge5', //特征参数
 
-        name: 'knowledge5',
 
-        component: () =>
 
-            import ('../views/Knowledge/Knowledge5.vue'),
 
-    },
 
-    {
 
-        path: '/knowledge6', //排查检修方案
 
-        name: 'knowledge6',
 
-        component: () =>
 
-            import ('../views/Knowledge/Knowledge6.vue'),
 
-    },
 
-    {
 
-        path: '/knowledge7', //预警知识
 
-        name: 'knowledge7',
 
-        component: () =>
 
-            import ('../views/Knowledge/Knowledge7.vue'),
 
-    },
 
-    {
 
-        path: "/health/health8",
 
-        name: "health8",
 
-        component: () =>
 
-            import ( /* webpackChunkName: "health8" */ "../views/HealthControl/Health8.vue"),
 
-    },
 
-    {
 
-        path: "/monitor/sandtable",
 
-        name: "sandtable",
 
-        component: () =>
 
-            import ( /* webpackChunkName: "sandtable" */ "../views/SandTable/SandTable.vue"),
 
-    },
 
-    {
 
-        path: "/new/dj1",
 
-        name: "dj1",
 
-        component: () =>
 
-            import ( /* webpackChunkName: "dj1" */ "../views/NewPages/dj1.vue"),
 
-    },
 
-    {
 
-        path: "/new/pf1",
 
-        name: "pf1",
 
-        component: () =>
 
-            import ( /* webpackChunkName: "pf1" */ "../views/NewPages/power-forecast-1.vue"),
 
-    },
 
-    {
 
-        path: "/new/fs",
 
-        name: "fs",
 
-        component: () =>
 
-            import ( /* webpackChunkName: "fs" */ "../views/NewPages/forecast-system.vue"),
 
-    },
 
-    {
 
-        path: '/new/ztfx',
 
-        name: 'ztfx',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "ztfx" */ '../views/NewPages/ztfx.vue'),
 
-    },
 
-    {
 
-        path: '/new/intelligentalarmcenter',
 
-        name: 'intelligentalarmcenter',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "intelligentalarmcenter" */ '../views/NewPages/intelligent-alarm-center.vue'),
 
-    },
 
-    {
 
-        path: '/new/personnel',
 
-        name: 'personnel',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "personnel" */ '../views/NewPages/personnel.vue'),
 
-    },
 
-    {
 
-        path: '/new/znzhfx',
 
-        name: 'znzhfx',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "ztfx" */ '../views/NewPages/znzhfx.vue'),
 
-    },
 
-    {
 
-        path: '/new/alarmcenter',
 
-        name: 'alarmcenter',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "personnel" */ '../views/NewPages/alarm-center.vue'),
 
-    },
 
-    {
 
-        path: '/new/knowledgebase',
 
-        name: 'knowledgebase',
 
-        component: () =>
 
-            import ( /* webpackChunkName: "knowledgebase" */ '../views/NewPages/knowledge-base.vue'),
 
-    },
 
-    {
 
-        path: "/new/dj",
 
-        name: "dj",
 
-        component: () =>
 
-            import ( /* webpackChunkName: "dj" */ "../views/NewPages/dj.vue"),
 
-    },
 
-    {
 
-        path: "/new/dj2",
 
-        name: "dj2",
 
-        component: () =>
 
-            import ( /* webpackChunkName: "dj2" */ "../views/NewPages/dj2.vue"),
 
-    },
 
-    {
 
-        path: "/new/dialog",
 
-        name: "dialog",
 
-        component: () =>
 
-            import ( /* webpackChunkName: "dj2" */ "../views/NewPages/dialogs.vue"),
 
-    }, // 三率管理/复位及时率
 
-    {
 
-        path: '/fwjsl',
 
-        name: 'fwjsl',
 
-        component: () =>
 
-            import ('../views/Decision/slgl/fwjsl.vue')
 
-    },
 
-    // 三率管理/状态转换率
 
-    {
 
-        path: '/ztzhl',
 
-        name: 'ztzhl',
 
-        component: () =>
 
-            import ('../views/Decision/slgl/ztzhl.vue')
 
-    },
 
-    // 三率管理/消缺及时率
 
-    {
 
-        path: '/xqjsl',
 
-        name: 'xqjsl',
 
-        component: () =>
 
-            import ('../views/Decision/slgl/xqjsl.vue')
 
-    },
 
-  {
 
-      path: "/new/powerforecast2",
 
-      name: "powerforecast2",
 
-      component: () => import(/* webpackChunkName: "powerforecast2" */ "../views/NewPages/power-forecast-2.vue"),
 
+  path: '/',
 
+  redirect: '/monitor/home'
 
+},
 
+{
 
+  path: '/monitor/home', // 驾驶舱
 
+  name: 'Home',
 
+  component: Home,
 
+},
 
+{
 
+  path: '/monitor/about',
 
+  name: 'About',
 
+  component: () =>
 
+    import( /* webpackChunkName: "about" */ '../views/About.vue'),
 
+},
 
+{
 
+  path: '/monitor/demo',
 
+  name: 'Demo',
 
+  component: () =>
 
+    import( /* webpackChunkName: "Demo" */ '../views/Demo.vue'),
 
+},
 
+{
 
+  path: '/monitor/status', // 状态监视
 
+  name: 'Status',
 
+  component: () =>
 
+    import( /* webpackChunkName: "status" */ '../views/Status/Status.vue'),
 
+},
 
+{
 
+  path: '/monitor/agc', // AGC 监视
 
+  name: 'Agc',
 
+  component: () =>
 
+    import( /* webpackChunkName: "agc" */ '../views/Agc/Agc.vue'),
 
+},
 
+{
 
+  path: '/monitor/windsite',
 
+  name: 'WindSite',
 
+  component: () =>
 
+    import( /* webpackChunkName: "windsite" */ '../views/WindSite/WindSite.vue'),
 
+  children: [{
 
+    path: 'home/:wpId', // 场站监视
 
+    component: () =>
 
+      import( /* webpackChunkName: "windsitehome" */ '../views/WindSite/pages/Home/Home.vue'),
 
+  }, {
 
+    path: 'draughtfanlist/:wpId', // 风机列表
 
+    component: () =>
 
+      import( /* webpackChunkName: "windsitedraughtfanlist" */ '../views/WindSite/pages/DraughtFanList.vue'),
 
+  }, {
 
+    path: 'matrix/:wpId', // 风场矩阵
 
+    component: () =>
 
+      import( /* webpackChunkName: "windsitematrix" */ '../views/WindSite/pages/Matrix.vue'),
 
+  }, {
 
+    path: 'lightmatrix/:wpId',
 
+    component: () =>
 
+      import( /* webpackChunkName: "windsitelightmatrix" */ '../views/WindSite/pages/LightMatrix.vue'),
 
+  }, {
 
+    path: 'box/:wpId',
 
+    component: () =>
 
+      import( /* webpackChunkName: "windsitebox" */ '../views/WindSite/pages/Box.vue'),
 
+  }, {
 
+    path: 'info/:wpId/:wtId', // 单机状态监视
 
+    component: () =>
 
+      import( /* webpackChunkName: "info" */ '../views/WindSite/pages/Info/Info.vue'),
 
+  }, {
 
+    path: 'tower/:wpId', // 测风塔
 
+    component: () =>
 
+      import( /* webpackChunkName: "windsitetower" */ '../views/WindSite/pages/Tower.vue'),
 
+  }, {
 
+    path: 'inverter-info/:wpId',
 
+    component: () =>
 
+      import( /* webpackChunkName: "inverter-info" */ '../views/WindSite/pages/Inverter-Info.vue'),
 
+  }, {
 
+    path: 'map/:wpId',
 
+    component: () =>
 
+      import( /* webpackChunkName: "windsitemap" */ '../views/WindSite/pages/Map.vue'),
 
+  }, {
 
+    path: 'map1/:wpId',
 
+    component: () =>
 
+      import( /* webpackChunkName: "windsitemap1" */ '../views/WindSite/pages/Map1.vue'),
 
   },
 
   {
 
-      path: "/new/alarmcenter1",
 
-      name: "alarmcenter1",
 
-      component: () => import(/* webpackChunkName: "powerforecast2" */ "../views/NewPages/alarm-center-1.vue"),
 
+    path: 'boosterstation/:wpId', // 升压站
 
+    component: () =>
 
+      import( /* webpackChunkName: "boosterstation" */ '../views/WindSite/pages/BoosterStation.vue'),
 
   },
 
   {
 
-      path: "/new/historysearch",
 
-      name: "historysearch",
 
-      component: () => import(/* webpackChunkName: "historysearch" */ "../views/NewPages/history-search.vue"),
 
+    path: "generalappearance/:wpId", // 总样貌
 
+    component: () =>
 
+      import( /* webpackChunkName: "generalappearance" */ "../views/WindSite/pages/GeneralAppearance.vue"),
 
   },
 
+  ]
 
+},
 
+{
 
+  path: '/monitor/lightmatrix', // 光伏明细矩阵
 
+  name: 'LightMatrix',
 
+  component: () =>
 
+    import( /* webpackChunkName: "lightmatrix" */ '../views/LightMatrix/LightMatrix.vue'),
 
+},
 
+{
 
+  path: '/monitor/lightmatrix1', // 基础矩阵
 
+  name: 'LightMatrix1',
 
+  component: () =>
 
+    import( /* webpackChunkName: "lightmatrix1" */ '../views/LightMatrix1/LightMatrix1.vue'),
 
+},
 
+{
 
+  path: '/monitor/lightmatrix2', // 欠发矩阵
 
+  name: 'LightMatrix2',
 
+  component: () =>
 
+    import( /* webpackChunkName: "lightmatrix2" */ '../views/LightMatrix2/LightMatrix2.vue'),
 
+}, {
 
+  path: '/monitor/lightmatrix3', // 明细矩阵
 
+  name: 'LightMatrix3',
 
+  component: () =>
 
+    import( /* webpackChunkName: "lightmatrix3" */ '../views/LightMatrix3/LightMatrix3.vue'),
 
+}, {
 
+  path: '/decision/decision1', //风机绩效榜
 
+  name: 'decision1',
 
+  component: () =>
 
+    import( /* webpackChunkName: "decision1" */ '../views/Decision/Decision1.vue'),
 
+},
 
+{
 
+  path: '/decision/decision1Mx', //风机绩效榜明细
 
+  name: 'decision1Mx',
 
+  component: () =>
 
+    import( /* webpackChunkName: "decision1Mx" */ '../views/Decision/Decision1Mx.vue'),
 
+},
 
+{
 
+  path: '/decision/decision2', //五项损失率
 
+  name: 'decision2',
 
+  component: () =>
 
+    import( /* webpackChunkName: "decision2" */ '../views/Decision/Decision2.vue'),
 
+},
 
+{
 
+  path: '/decision/decision2Cndb', //场内对标
 
+  name: 'decision2Cndb',
 
+  component: () =>
 
+    import( /* webpackChunkName: "decision2Cndb" */ '../views/Decision/Decision2Cndb.vue'),
 
+},
 
+{
 
+  path: '/decision/decision2Cjdb', //场际对标
 
+  name: 'decision2Cjdb',
 
+  component: () =>
 
+    import( /* webpackChunkName: "decision2Cjdb" */ '../views/Decision/Decision2Cjdb.vue'),
 
+},
 
+{
 
+  path: '/decision/decision2Xmdb', //项目对标
 
+  name: 'decision2Xmdb',
 
+  component: () =>
 
+    import( /* webpackChunkName: "decision2Xmdb" */ '../views/Decision/Decision2Xmdb.vue'),
 
+},
 
+{
 
+  path: '/decision/decision2Xldb', //线路对标
 
+  name: 'decision2Xldb',
 
+  component: () =>
 
+    import( /* webpackChunkName: "decision2Xldb" */ '../views/Decision/Decision2Xldb.vue'),
 
+},
 
+{
 
+  path: '/decision/decision3', //性能对标
 
+  name: 'decision3',
 
+  component: () =>
 
+    import( /* webpackChunkName: "decision3" */ '../views/Decision/Decision3.vue'),
 
+},
 
+{
 
+  path: '/decision/decision4', //值际对标
 
+  name: 'decision4',
 
+  component: () =>
 
+    import( /* webpackChunkName: "decision4" */ '../views/Decision/Decision4.vue'),
 
+},
 
+{
 
+  path: '/decision/decision4czzl', //操作指令统计
 
+  name: 'decision4czzl',
 
+  component: () =>
 
+    import( /* webpackChunkName: "decision4czzl" */ '../views/Decision/Decision4Czzl.vue'),
 
+},
 
+{
 
+  path: '/health',
 
+  name: 'health',
 
+  component: () =>
 
+    import('../views/HealthControl/Health.vue'),
 
+},
 
+{
 
+  path: '/health/healthDay', //风机  日  信息量化评级管理
 
+  name: 'healthDay',
 
+  component: () =>
 
+    import('../views/HealthControl/HealthDay.vue'),
 
+},
 
+{
 
+  path: '/health/healthMonth', //风机  月  信息量化评级管理
 
+  name: 'healthMonth',
 
+  component: () =>
 
+    import('../views/HealthControl/HealthMonth.vue'),
 
+},
 
+{
 
+  path: '/health/healthYear', //风机  年  信息量化评级管理
 
+  name: 'healthYear',
 
+  component: () =>
 
+    import('../views/HealthControl/HealthYear.vue'),
 
+},
 
+{
 
+  path: '/health/health1',
 
+  name: 'health1',
 
+  component: () =>
 
+    import('../views/HealthControl/Health1.vue'),
 
+},
 
+{
 
+  path: '/health/health2', // 健康管理首页
 
+  name: 'health2',
 
+  component: () =>
 
+    import('../views/HealthControl/Health2.vue'),
 
+},
 
+{
 
+  path: '/health/health3/:wpId', // 场站健康管理
 
+  name: 'health3',
 
+  component: () =>
 
+    import('../views/HealthControl/Health3.vue'),
 
+},
 
+{
 
+  path: '/health/health4',
 
+  name: 'health4',
 
+  children: [{
 
+    path: "/health/health0/:wpId/:wtId",
 
+    name: "health0",
 
+    component: () =>
 
+      import("../views/HealthControl/Health0.vue"),
 
+  }, {
 
+    path: "/health/health10/:wtId",
 
+    name: "health10",
 
+    component: () =>
 
+      import( /* webpackChunkName: "health8" */ "../views/HealthControl/Health10.vue"),
 
+  }, {
 
+    path: 'healthLineChart/:wtId', // 风机健康趋势
 
+    component: () =>
 
+      import( /* webpackChunkName: "healthLineChart" */ '../views/HealthControl/healthLineChart.vue'),
 
+  },
 
+  {
 
+    path: 'healthLineChart2/:wtId', // 健康趋势
 
+    component: () =>
 
+      import( /* webpackChunkName: "healthLineChart2" */ '../views/HealthControl/healthLineChart2.vue'),
 
+  }
 
+  ],
 
+  component: () =>
 
+    import('../views/HealthControl/Health4.vue'),
 
+},
 
+{
 
+  path: '/health/health5/',
 
+  name: 'health5',
 
+  component: () =>
 
+    import('../views/HealthControl/Health5.vue'),
 
+},
 
+{
 
+  path: '/health/health6', // 健康总览
 
+  name: 'health6',
 
+  component: () =>
 
+    import('../views/HealthControl/Health6.vue'),
 
+},
 
+{
 
+  path: '/cutAnalyse', // 切入切出分析
 
+  name: 'cutAnalyse',
 
+  component: () =>
 
+    import('../views/cutAnalyse/index.vue'),
 
+},
 
+{
 
+  path: '/cutAnalyse', // 切入切出分析
 
+  name: 'cutAnalyse',
 
+  component: () =>
 
+    import('../views/cutAnalyse/index.vue'),
 
+},
 
+{
 
+  path: '/wtSaturability', // 单机饱和度
 
+  name: 'wtSaturability',
 
+  component: () =>
 
+    import('../views/wtSaturability/index.vue'),
 
+},
 
+{
 
+  path: '/windAnalysis', // 风资源分析
 
+  name: 'windAnalysis',
 
+  component: () =>
 
+    import('../views/windAnalysis/index.vue'),
 
+},
 
+{
 
+  path: '/powerRank', // 发电效率排行
 
+  name: 'powerRank',
 
+  component: () =>
 
+    import('../views/powerRank/index.vue'),
 
+},
 
+{
 
+  path: '/totalPowerRank', // 总发电效率排行
 
+  name: 'totalPowerRank',
 
+  component: () =>
 
+    import('../views/totalPowerRank/index.vue'),
 
+},
 
+{
 
+  path: '/warningRank', // 报警排行
 
+  name: 'warningRank',
 
+  component: () =>
 
+    import('../views/warningRank/index.vue'),
 
+},
 
+{
 
+  path: '/realSearch', // 测点数据查询
 
+  name: 'realSearch',
 
+  component: () =>
 
+    import('../views/realSearch/index.vue'),
 
+},
 
+{
 
+  path: '/singleAnalysis', // 单机月度分析
 
+  name: 'singleAnalysis',
 
+  component: () =>
 
+    import('../views/singleAnalysis/index.vue'),
 
+},
 
+{
 
+  path: '/performanceAnalysis', // 单机信息总览
 
+  name: 'performanceAnalysis',
 
+  component: () => import('../views/performanceAnalysis/index.vue'),
 
+},
 
+{
 
+  path: "/performanceAnalysis/detail/:wpId/:wtId", // 单机信息总览详情
 
+  name: "performanceAnalysisDetail",
 
+  component: () => import( /* webpackChunkName: "performanceAnalysisDetail" */ "../views/NewPages/dj1.vue"),
 
+},
 
+{
 
+  path: '/historySearch', // 测点历史数据查询
 
+  name: 'historySearch',
 
+  component: () =>
 
+    import('../views/historySearch/index.vue'),
 
+},
 
+{
 
+  path: '/knowledge', //故障知识列表
 
+  name: 'knowledge1',
 
+  component: () =>
 
+    import('../views/Knowledge/Knowledge1.vue'),
 
+},
 
+{
 
+  path: '/knowledge2', //安全措施知识
 
+  name: 'knowledge2',
 
+  component: () =>
 
+    import('../views/Knowledge/Knowledge2.vue'),
 
+},
 
+{
 
+  path: '/knowledge3', //风险辨识知识
 
+  name: 'knowledge3',
 
+  component: () =>
 
+    import('../views/Knowledge/Knowledge3.vue'),
 
+},
 
+{
 
+  path: '/knowledge4', //作业指导知识
 
+  name: 'knowledge4',
 
+  component: () =>
 
+    import('../views/Knowledge/Knowledge4.vue'),
 
+},
 
+{
 
+  path: '/knowledge5', //特征参数
 
+  name: 'knowledge5',
 
+  component: () =>
 
+    import('../views/Knowledge/Knowledge5.vue'),
 
+},
 
+{
 
+  path: '/knowledge6', //排查检修方案
 
+  name: 'knowledge6',
 
+  component: () =>
 
+    import('../views/Knowledge/Knowledge6.vue'),
 
+},
 
+{
 
+  path: '/knowledge7', //预警知识
 
+  name: 'knowledge7',
 
+  component: () =>
 
+    import('../views/Knowledge/Knowledge7.vue'),
 
+},
 
+{
 
+  path: "/health/health8",
 
+  name: "health8",
 
+  component: () =>
 
+    import( /* webpackChunkName: "health8" */ "../views/HealthControl/Health8.vue"),
 
+},
 
+{
 
+  path: "/monitor/sandtable",
 
+  name: "sandtable",
 
+  component: () =>
 
+    import( /* webpackChunkName: "sandtable" */ "../views/SandTable/SandTable.vue"),
 
+},
 
+{
 
+  path: "/new/pf1",
 
+  name: "pf1",
 
+  component: () =>
 
+    import( /* webpackChunkName: "pf1" */ "../views/NewPages/power-forecast-1.vue"),
 
+},
 
+{
 
+  path: "/new/fs",
 
+  name: "fs",
 
+  component: () =>
 
+    import( /* webpackChunkName: "fs" */ "../views/NewPages/forecast-system.vue"),
 
+},
 
+{
 
+  path: '/new/ztfx', // 专题分析
 
+  name: 'ztfx',
 
+  component: () => import( /* webpackChunkName: "ztfx" */ '../views/NewPages/ztfx.vue'),
 
+},
 
+{
 
+  path: '/new/fdlyl', // 风能利用率
 
+  name: 'fdlyl',
 
+  component: () => import( /* webpackChunkName: "ztfx" */ '../views/NewPages/fdlyl.vue'),
 
+},
 
+{
 
+  path: '/new/intelligentalarmcenter',
 
+  name: 'intelligentalarmcenter',
 
+  component: () =>
 
+    import( /* webpackChunkName: "intelligentalarmcenter" */ '../views/NewPages/intelligent-alarm-center.vue'),
 
+},
 
+{
 
+  path: '/new/personnel',
 
+  name: 'personnel',
 
+  component: () =>
 
+    import( /* webpackChunkName: "personnel" */ '../views/NewPages/personnel.vue'),
 
+},
 
+{
 
+  path: '/new/znzhfx/:wtId/:year/:month',
 
+  name: 'znzhfx',
 
+  component: () =>
 
+    import( /* webpackChunkName: "ztfx" */ '../views/NewPages/znzhfx.vue'),
 
+},
 
+{
 
+  path: '/new/alarmcenter',
 
+  name: 'alarmcenter',
 
+  component: () =>
 
+    import( /* webpackChunkName: "personnel" */ '../views/NewPages/alarm-center.vue'),
 
+},
 
+{
 
+  path: '/new/knowledgebase',
 
+  name: 'knowledgebase',
 
+  component: () =>
 
+    import( /* webpackChunkName: "knowledgebase" */ '../views/NewPages/knowledge-base.vue'),
 
+},
 
+{
 
+  path: "/new/dj",
 
+  name: "dj",
 
+  component: () =>
 
+    import( /* webpackChunkName: "dj" */ "../views/NewPages/dj.vue"),
 
+},
 
+{
 
+  path: "/new/dj2",
 
+  name: "dj2",
 
+  component: () =>
 
+    import( /* webpackChunkName: "dj2" */ "../views/NewPages/dj2.vue"),
 
+},
 
+{
 
+  path: "/new/dialog",
 
+  name: "dialog",
 
+  component: () =>
 
+    import( /* webpackChunkName: "dj2" */ "../views/NewPages/dialogs.vue"),
 
+}, // 三率管理/复位及时率
 
+{
 
+  path: '/fwjsl',
 
+  name: 'fwjsl',
 
+  component: () =>
 
+    import('../views/Decision/slgl/fwjsl.vue')
 
+},
 
+// 三率管理/状态转换率
 
+{
 
+  path: '/ztzhl',
 
+  name: 'ztzhl',
 
+  component: () =>
 
+    import('../views/Decision/slgl/ztzhl.vue')
 
+},
 
+// 三率管理/消缺及时率
 
+{
 
+  path: '/xqjsl',
 
+  name: 'xqjsl',
 
+  component: () =>
 
+    import('../views/Decision/slgl/xqjsl.vue')
 
+},
 
+{
 
+  path: "/new/powerforecast2",
 
+  name: "powerforecast2",
 
+  component: () => import(/* webpackChunkName: "powerforecast2" */ "../views/NewPages/power-forecast-2.vue"),
 
+},
 
+{
 
+  path: "/new/alarmcenter1",
 
+  name: "alarmcenter1",
 
+  component: () => import(/* webpackChunkName: "powerforecast2" */ "../views/NewPages/alarm-center-1.vue"),
 
+},
 
+{
 
+  path: "/new/historysearch",
 
+  name: "historysearch",
 
+  component: () => import(/* webpackChunkName: "historysearch" */ "../views/NewPages/history-search.vue"),
 
+},
 
 ]
 
 const router = createRouter({
 
   history: createWebHashHistory(),

+ 91 - 0
src/views/Demo.vue
查看文件 

@@ -4,6 +4,12 @@
 
   <!-- 图表 -->
 
   <el-scrollbar v-if="currTab == 1" style="height:85%;">
 
     <h2>图表</h2>
 
+    <h2>07-12新增</h2>
 
+    <h3>折现:  zoom-line-chart</h3>
 
+    <zoom-line-chart :height="'250px'" :smooth="false" :showLegend="true" />
 
+
 
+    <h3>组合:  area-line-chart</h3>
 
+    <area-line-chart @areaClick="areaBarChartClick" :showLegend="true" />
 
 
     <h2>07-08新增</h2>
 
     <h3>组合: 时间区域 area-bar-chart</h3>
 
@@ -181,6 +187,7 @@
 
     </div>
 
   </el-scrollbar>
 
 
+  <!-- Table 组件 -->
 
   <el-scrollbar v-if="currTab == 3" style="height:85%;">
 
     <h2>07-09更新</h2>
 
     <h3>table-2</h3>
 
@@ -239,6 +246,7 @@
 
     </el-table>
 
   </el-scrollbar>
 
 
+  <!--  icon -->
 
   <el-scrollbar v-if="currTab == 4" style="height:85%;">
 
     <i class="svg-icon svg-icon-sm mg-r-16">
 
       <svg-icon :svgid="'svg-wind-site'" />
 
@@ -250,6 +258,17 @@
 
       <svg-icon :svgid="'svg-wind-site'" />
 
     </i>
 
   </el-scrollbar>
 
+
 
+  <!-- el-compoments -->
 
+
 
+  <el-scrollbar v-if="currTab == 5" style="height:85%;">
 
+    <el-button type="text" @click="dialogTableVisible = true">打开 Dialog</el-button>
 
+    <el-tree :data="elTreeData.data" :props="elTreeData.defaultProps" @node-click="handleNodeClick"></el-tree>
 
+  </el-scrollbar>
 
+
 
+  <el-dialog custom-class="modal" title="收货地址" v-model="dialogTableVisible">
 
+    <el-tree :data="elTreeData.data" :props="elTreeData.defaultProps" @node-click="handleNodeClick"></el-tree>
 
+  </el-dialog>
 
 </template>
 
 
 <script>
 
@@ -295,6 +314,8 @@ import Table from "../components/coms/table/table.vue";
 
 import Table2 from "../components/coms/table/table2.vue";
 
 import Tab from "../components/coms/tabs/tab.vue";
 
 import multiArrowLineChart from "../components/chart/line/multi-arrow-line-chart.vue";
 
+import ZoomLineChart from "../components/chart/line/zoom-line-chart.vue";
 
+import AreaLineChart from '../components/chart/combination/area-line-chart.vue';
 
 
 export default {
 
   components: {
 
@@ -340,6 +361,8 @@ export default {
 
     MultipleBarLineChart,
 
     Table2,
 
     multiArrowLineChart,
 
+    ZoomLineChart,
 
+    AreaLineChart,
 
   },
 
   methods: {
 
     select(data) {
 
@@ -416,6 +439,10 @@ export default {
 
           id: "4",
 
           text: "图标",
 
         },
 
+        {
 
+          id: "5",
 
+          text: "element 组件",
 
+        },
 
       ],
 
       tableData: {
 
         column: [
 
@@ -1167,6 +1194,70 @@ export default {
 
           zip: 200333,
 
         },
 
       ],
 
+      elTreeData: {
 
+        data: [
 
+          {
 
+            label: "一级 1",
 
+            children: [
 
+              {
 
+                label: "二级 1-1",
 
+                children: [
 
+                  {
 
+                    label: "三级 1-1-1",
 
+                  },
 
+                ],
 
+              },
 
+            ],
 
+          },
 
+          {
 
+            label: "一级 2",
 
+            children: [
 
+              {
 
+                label: "二级 2-1",
 
+                children: [
 
+                  {
 
+                    label: "三级 2-1-1",
 
+                  },
 
+                ],
 
+              },
 
+              {
 
+                label: "二级 2-2",
 
+                children: [
 
+                  {
 
+                    label: "三级 2-2-1",
 
+                  },
 
+                ],
 
+              },
 
+            ],
 
+          },
 
+          {
 
+            label: "一级 3",
 
+            children: [
 
+              {
 
+                label: "二级 3-1",
 
+                children: [
 
+                  {
 
+                    label: "三级 3-1-1",
 
+                  },
 
+                ],
 
+              },
 
+              {
 
+                label: "二级 3-2",
 
+                children: [
 
+                  {
 
+                    label: "三级 3-2-1",
 
+                  },
 
+                ],
 
+              },
 
+            ],
 
+          },
 
+        ],
 
+        defaultProps: {
 
+          children: "children",
 
+          label: "label",
 
+        },
 
+      },
 
+      dialogTableVisible: false,
 
     };
 
   },
 
   created() {

+ 5 - 6
src/views/HealthControl/Health10.vue
查看文件 

@@ -85,31 +85,30 @@
 
     </el-row>
 
     <div class="fc-info mg-b-16">
 
       <panel :title="'曲线'" :showLine="false">
 
-        <normal-line-chart height="19vh" :list="line1.value" :units="line1.units" />
 
-        <stright-line-chart height="15vh" :list="line2.value" :units="line2.units" />
 
+        <zoom-line-chart height="35vh" :list="line1.value" :units="line1.units" />
 
       </panel>
 
     </div>
 
   </div>
 
 </template>
 
 
 <script>
 
-import NormalLineChart from "../../components/chart/line/normal-line-chart.vue";
 
+// import NormalLineChart from "../../components/chart/line/normal-line-chart.vue";
 
 // import SvgIcon from "../../components/coms/icon/svg-icon.vue";SvgIcon,
 
 import Panel from "../../components/coms/panel/panel.vue";
 
 import Table from "../../components/coms/table/table.vue";
 
 import TableLineChart from "../../components/chart/line/table-line-chart.vue";
 
-import StrightLineChart from "../../components/chart/line/stright-line-chart.vue";
 
+// import StrightLineChart from "../../components/chart/line/stright-line-chart.vue";
 
 import ImgLineChart from "../../components/chart/line/img-line-chart.vue";
 
+import ZoomLineChart from '../../components/chart/line/zoom-line-chart.vue';
 
 
 export default {
 
   setup() {},
 
   components: {
 
-    NormalLineChart,
 
     Panel,
 
     Table,
 
     TableLineChart,
 
-    StrightLineChart,
 
     ImgLineChart,
 
+    ZoomLineChart,
 
   },
 
   data() {
 
     return {

+ 0 - 2
src/views/HealthControl/HealthTab4.vue
查看文件 

@@ -163,7 +163,6 @@ export default {
 
     },
 
     // 消缺跟踪
 
     onClickTrack(row){
 
-      console.warn('onClickTrack');
 
       this.requestTrack(row);
 
       
     },
 
@@ -241,7 +240,6 @@ export default {
 
         success(res) {
 
           if (res.code == 200) {
 
             that.trackDate = res.data
 
-            console.warn(that.trackDate);
 
             that.dialogVisible = true
 
           }
 
         },

+ 264 - 310
src/views/HealthControl/infotrack2.vue
查看文件 

@@ -3,11 +3,7 @@
 
     <div class="form-info">
 
       <div class="work-flow">
 
         <div class="work-flow-line"></div>
 
-        <div
 
-          :class="['work-flow-item', item.name == statu(form) ? 'active' : '']"
 
-          v-for="(item, i) in svgarr"
 
-          :key="i"
 
-        >
 
+        <div :class="['work-flow-item', item.name == statu(form) ? 'active' : '']" v-for="(item, i) in svgarr" :key="i">
 
           <div class="work-flow-icon-item">
 
             <div class="work-flow-icon-o"></div>
 
             <div class="work-flow-icon-i"></div>
 
@@ -23,154 +19,104 @@
 
           <el-row>
 
             <el-col :span="12">
 
               <el-form-item label="风场：">
 
-                <el-input
 
-                  v-model="form.wpName"
 
-                  placeholder="风场名称"
 
-                ></el-input>
 
+                <el-input v-model="form.wpName" placeholder="风场名称" readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
             <el-col :span="12">
 
               <el-form-item label="风机：">
 
-                <el-input v-model="form.wtId" placeholder="风机名称"></el-input>
 
+                <el-input v-model="form.wtId" placeholder="风机名称" readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
           </el-row>
 
           <el-row>
 
             <el-col :span="12">
 
               <el-form-item label="推荐检修时间：">
 
-                <el-input
 
-                  v-model="form.tjss"
 
-                  placeholder="推荐检修时间"
 
-                ></el-input>
 
+                <el-input v-model="form.tjss" placeholder="推荐检修时间" readonly></el-input>
 
                 <!-- <el-date-picker v-model="form.tjjxsj" type="datetime" placeholder="推荐检修时间" popper-class="date-select"></el-date-picker> -->
 
               </el-form-item>
 
             </el-col>
 
             <el-col :span="12">
 
               <el-form-item label="预计检修风速：">
 
-                <el-input
 
-                  v-model="form.tjfs"
 
-                  placeholder="预计检修风速"
 
-                ></el-input>
 
+                <el-input v-model="form.tjfs" placeholder="预计检修风速" readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
           </el-row>
 
           <el-row>
 
             <el-col :span="24">
 
               <el-form-item label="推荐理由：">
 
-                <el-input
 
-                  type="textarea"
 
-                  :rows="3"
 
-                  v-model="form.description"
 
-                  placeholder="推荐理由"
 
-                ></el-input>
 
+                <el-input type="textarea" resize="none" :rows="3" v-model="form.description" placeholder="推荐理由"
 
+                  readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
           </el-row>
 
           <el-row>
 
             <el-col :span="12">
 
               <el-form-item label="下单时间：">
 
-                <el-input
 
-                  v-model="form.prodtdepttime"
 
-                  placeholder="下单时间"
 
-                ></el-input>
 
+                <el-input v-model="form.prodtdepttime" placeholder="下单时间" readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
             <el-col :span="12">
 
               <el-form-item label="主要负责人：">
 
-                <el-input
 
-                  v-model="form.workleader"
 
-                  placeholder="主要负责人"
 
-                ></el-input>
 
+                <el-input v-model="form.workleader" placeholder="主要负责人" readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
           </el-row>
 
           <el-row>
 
             <el-col :span="12">
 
               <el-form-item label="出发时间：">
 
-                <el-input
 
-                  v-model="form.departuretime"
 
-                  placeholder="出发时间"
 
-                ></el-input>
 
+                <el-input v-model="form.departuretime" placeholder="出发时间" readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
             <el-col :span="12">
 
               <el-form-item label="到达时间：">
 
-                <el-input
 
-                  v-model="form.arrivaltime"
 
-                  placeholder="到达时间"
 
-                ></el-input>
 
+                <el-input v-model="form.arrivaltime" placeholder="到达时间" readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
           </el-row>
 
           <el-row>
 
             <el-col :span="24">
 
               <el-form-item label="排查方法：">
 
-                <el-input
 
-                  type="textarea"
 
-                  :rows="3"
 
-                  v-model="form.gzpc"
 
-                  placeholder="排查方法"
 
-                ></el-input>
 
+                <el-input type="textarea" resize="none" :rows="3" v-model="form.gzpc" placeholder="排查方法" readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
           </el-row>
 
           <el-row>
 
             <el-col :span="24">
 
               <el-form-item label="处理方法：">
 
-                <el-input
 
-                  type="textarea"
 
-                  :rows="3"
 
-                  v-model="form.repairedcomment"
 
-                  placeholder="处理方法"
 
-                ></el-input>
 
+                <el-input type="textarea" resize="none" :rows="3" v-model="form.repairedcomment" placeholder="处理方法"
 
+                  readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
           </el-row>
 
           <el-row>
 
             <el-col :span="12">
 
               <el-form-item label="消缺时间：">
 
-                <el-input
 
-                  v-model="form.repairedtime"
 
-                  placeholder="消缺时间"
 
-                ></el-input>
 
+                <el-input v-model="form.repairedtime" placeholder="消缺时间" readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
             <el-col :span="12">
 
               <el-form-item label="故障时长：">
 
-                <el-input
 
-                  v-model="form.degradebugtype"
 
-                  placeholder="故障时长"
 
-                ></el-input>
 
+                <el-input v-model="form.degradebugtype" placeholder="故障时长" readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
           </el-row>
 
           <el-row>
 
             <el-col :span="12">
 
               <el-form-item label="验收人：">
 
-                <el-input
 
-                  v-model="form.checkdeptlabornum"
 
-                  placeholder="验收人"
 
-                ></el-input>
 
+                <el-input v-model="form.checkdeptlabornum" placeholder="验收人" readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
             <el-col :span="12">
 
               <el-form-item label="验收时间：">
 
-                <el-input
 
-                  v-model="form.checktime"
 
-                  placeholder="验收时间"
 
-                ></el-input>
 
+                <el-input v-model="form.checktime" placeholder="验收时间" readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
           </el-row>
 
           <el-row>
 
             <el-col :span="24">
 
               <el-form-item label="验收意见：">
 
-                <el-input
 
-                  type="textarea"
 
-                  :rows="3"
 
-                  v-model="form.checkdeptopinion"
 
-                  placeholder="验收意见"
 
-                ></el-input>
 
+                <el-input type="textarea" resize="none" :rows="3" v-model="form.checkdeptopinion" placeholder="验收意见"
 
+                  readonly></el-input>
 
               </el-form-item>
 
             </el-col>
 
           </el-row>
 
@@ -179,153 +125,81 @@
 
     </div>
 
     <div class="evaluate">
 
       <div class="white">评价</div>
 
-      <div class="evaluate-item">
 
+      <div class="evaluate-item" :class="(form.rwfpsc > form.rwfppjsc ? ' warColor' : '')">
 
         <div class="evaluate-label">任务分配时长</div>
 
-        <el-input-number
 
-          class="input-number"
 
-          v-model="form.rwfpsc"
 
-          :controls="false"
 
-          controls-position="right"
 
-          :min="0"
 
-          :max="1000"
 
-        ></el-input-number>
 
+        <el-input v-model="form.rwfpsc" style="width: 62px;text-align: center;" placeholder="" readonly></el-input>
 
         <div class="evaluate-unit">min</div>
 
       </div>
 
       <div class="evaluate-item">
 
         <div class="evaluate-label">任务分配平均时长</div>
 
-        <el-input-number
 
-          class="input-number"
 
-          v-model="form.rwfppjsc"
 
-          :controls="false"
 
-          controls-position="right"
 
-          :min="0"
 
-          :max="1000"
 
-        ></el-input-number>
 
+        <el-input v-model="form.rwfppjsc" style="width: 62px;text-align: center;" placeholder="" readonly></el-input>
 
         <div class="evaluate-unit">min</div>
 
       </div>
 
-      <div class="evaluate-item">
 
+      <div class="evaluate-item" :class="(form.ddxcsc > form.ddxcpjsc ? ' warColor' : '')">
 
         <div class="evaluate-label">到达现场时长</div>
 
-        <el-input-number
 
-          class="input-number"
 
-          v-model="form.ddxcsc"
 
-          :controls="false"
 
-          controls-position="right"
 
-          :min="0"
 
-          :max="1000"
 
-        ></el-input-number>
 
+        <el-input v-model="form.ddxcsc" style="width: 62px;text-align: center;" placeholder="" readonly></el-input>
 
         <div class="evaluate-unit">min</div>
 
       </div>
 
       <div class="evaluate-item">
 
         <div class="evaluate-label">到达现场平均时长</div>
 
-        <el-input-number
 
-          class="input-number"
 
-          v-model="form.ddxcpjsc"
 
-          :controls="false"
 
-          controls-position="right"
 
-          :min="0"
 
-          :max="1000"
 
-        ></el-input-number>
 
+        <el-input v-model="form.ddxcpjsc" style="width: 62px;text-align: center;" placeholder="" readonly></el-input>
 
         <div class="evaluate-unit">min</div>
 
       </div>
 
-      <div class="evaluate-item">
 
+      <div class="evaluate-item" :class="(form.qxclsc > form.qxclpjsc ? ' warColor' : '')">
 
         <div class="evaluate-label">缺陷处理时长</div>
 
-        <el-input-number
 
-          class="input-number"
 
-          v-model="form.qxclsc"
 
-          :controls="false"
 
-          controls-position="right"
 
-          :min="0"
 
-          :max="1000"
 
-        ></el-input-number>
 
+        <el-input v-model="form.qxclsc" style="width: 62px;text-align: center;" placeholder="" readonly></el-input>
 
         <div class="evaluate-unit">min</div>
 
       </div>
 
       <div class="evaluate-item">
 
         <div class="evaluate-label">缺陷处理平均时长</div>
 
-        <el-input-number
 
-          class="input-number"
 
-          v-model="form.qxclpjsc"
 
-          :controls="false"
 
-          controls-position="right"
 
-          :min="0"
 
-          :max="1000"
 
-        ></el-input-number>
 
+        <el-input v-model="form.qxclpjsc" style="width: 62px;text-align: center;" placeholder="" readonly></el-input>
 
         <div class="evaluate-unit">min</div>
 
       </div>
 
-      <div class="evaluate-item">
 
+      <div class="evaluate-item" :class="(form.yssc > form.yspjsc ? ' warColor' : '')">
 
         <div class="evaluate-label">验收时长</div>
 
-        <el-input-number
 
-          class="input-number"
 
-          v-model="form.yssc"
 
-          :controls="false"
 
-          controls-position="right"
 
-          :min="0"
 
-          :max="1000"
 
-        ></el-input-number>
 
+        <el-input v-model="form.yssc" style="width: 62px;text-align: center;" placeholder="" readonly></el-input>
 
         <div class="evaluate-unit">min</div>
 
       </div>
 
       <div class="evaluate-item">
 
         <div class="evaluate-label">验收平均时长</div>
 
-        <el-input-number
 
-          class="input-number"
 
-          v-model="form.yspjsc"
 
-          :controls="false"
 
-          controls-position="right"
 
-          :min="0"
 
-          :max="1000"
 
-        ></el-input-number>
 
+        <el-input v-model="form.yspjsc" style="width: 62px;text-align: center;" placeholder="" readonly></el-input>
 
         <div class="evaluate-unit">min</div>
 
       </div>
 
     </div>
 
     <div class="tabs">
 
       <div class="tab-box">
 
-        <div
 
-          class="tab-item"
 
-          v-for="(tab, index) of tabs"
 
-          :key="index"
 
-          :class="{ active: activeTab == index }"
 
-          @click="selectTab(tab,index)"
 
-        >
 
-          <span
 
-            class="svg-icon svg-icon-md"
 
-            :class="activeTab == index ? 'svg-icon-green' : 'svg-icon-write'"
 
-          >
 
+        <div class="tab-item" v-for="(tab, index) of tabs" :key="index" :class="{ active: activeTab == index }" @click="selectTab(tab,index)">
 
+          <span class="svg-icon svg-icon-md" :class="activeTab == index ? 'svg-icon-green' : 'svg-icon-write'">
 
             <SvgIcon :svgid="tab.icon"></SvgIcon>
 
           </span>
 
           <span>{{ tab.text }}</span>
 
         </div>
 
       </div>
 
     </div>
 
-    <defect-elimination-tracking
 
-      ref="det"
 
-      :show="false"
 
-      :formdata="formdata"
 
-    ></defect-elimination-tracking>
 
-  <div class="dialog-box">  
-    <el-dialog
 
-      title="消缺历史"
 
-      v-model="dialogVisible"
 
-       width="1200px" height='800px' custom-class="modal" :close-on-click-modal="false"
 
-      :before-close="handleClose"
 
-    >
 
-    <div class="diamain">
 
-      <div class="left">
 
-        <el-tree
 
-        :data="data"
 
-        :props="defaultProps"
 
-        node-key="id"
 
-        :default-expand-all="true"
 
-        custom-class="modal" 
-        @node-click="handleNodeClick"
 
-      ></el-tree>
 
-      </div>
 
-      <div class="right">
 
-        <div class="table-box">
 
-        <ComTable :data="tableData" height="700px"></ComTable>
 
-      </div>
 
-      </div>
 
+    <defect-elimination-tracking ref="det" :show="false" :formdata="formdata"></defect-elimination-tracking>
 
+    <div class="dialog-box">
 
+      <el-dialog title="消缺历史" v-model="dialogVisible" width="1200px" height='800px' custom-class="modal"
 
+        :close-on-click-modal="false">
 
+        <div class="diamain">
 
+          <div class="left">
 
+            <el-tree :data="data" :props="defaultProps" node-key="id" :default-expand-all="true" custom-class="modal"
 
+              @node-click="handleNodeClick"></el-tree>
 
+          </div>
 
+          <div class="right">
 
+            <div class="table-box">
 
+              <ComTable :data="tableData" height="700px"></ComTable>
 
+            </div>
 
+          </div>
 
+        </div>
 
+      </el-dialog>
 
     </div>
 
+    <el-dialog title="查看监控视频" v-model="videoBoxShow" width="80%" height='800px' custom-class="modal"
 
+      :close-on-click-modal="true">
 
+      <video class="videoPlayer" id="videoPlayer" muted autoplay webkit-playsinline playsinline></video>
 
+    </el-dialog>
 
+    <el-dialog title="GIS地貌" v-model="gisBoxShow" width="80%" custom-class="modal gisBox" :close-on-click-modal="true">
 
+      <iframe width="100%" height="100%" src="http://10.155.32.4:8070/gisweb/ditujiankang.html?LAT=106.23507&LNG=38.48989&userid=1500" sryle="width:100%;height:100%;"></iframe>
 
     </el-dialog>
 
-     </div> 
   </div>
 
 </template>
 
 
@@ -333,45 +207,48 @@
 
 import ComTable from "@com/coms/table/table.vue";
 
 import SvgIcon from "@com/coms/icon/svg-icon.vue";
 
 import DefectEliminationTracking from "../HealthControl/defect-elimination-tracking.vue"; //手环监控
 
+import $ from 'jquery';
 
 export default {
 
   components: {
 
-    SvgIcon,ComTable,
 
+    SvgIcon, ComTable,
 
     DefectEliminationTracking,
 
   },
 
   props: {
 
     formdata: Object,
 
   },
 
-  data() {
 
+  data () {
 
     return {
 
-      location:'',
 
-      tableData:{
 
-          column: [
 
-          { 
+      gisBoxShow: false,
 
+      videoBoxShow: false,
 
+      location: '',
 
+      tableData: {
 
+        column: [
 
+          {
 
             name: "消缺描述",
 
             field: "xqms",
 
             is_light: false
 
           },
 
-          { 
+          {
 
             name: "消缺人员",
 
             field: "xqry",
 
             is_light: false
 
           },
 
-          { 
+          {
 
             name: "消缺时间",
 
             field: "xqsj",
 
             is_light: false
 
           },
 
-          { 
+          {
 
             name: "更换部件",
 
             field: "ghbj",
 
             is_light: false
 
           },
 
-          { 
+          {
 
             name: "更换原因",
 
             field: "ghyy",
 
             is_light: false
 
           },
 
-          { 
+          {
 
             name: "更换数量",
 
             field: "ghsl",
 
             is_light: false
 
@@ -379,46 +256,46 @@ export default {
 
         ],
 
         data: [],
 
       },
 
-       data: [{
 
-          label: '一级 1',
 
+      data: [{
 
+        label: '一级 1',
 
+        children: [{
 
+          label: '二级 1-1',
 
+          children: [{
 
+            label: '三级 1-1-1'
 
+          }]
 
+        }]
 
+      }, {
 
+        label: '一级 2',
 
+        children: [{
 
+          label: '二级 2-1',
 
           children: [{
 
-            label: '二级 1-1',
 
-            children: [{
 
-              label: '三级 1-1-1'
 
-            }]
 
+            label: '三级 2-1-1'
 
           }]
 
         }, {
 
-          label: '一级 2',
 
+          label: '二级 2-2',
 
           children: [{
 
-            label: '二级 2-1',
 
-            children: [{
 
-              label: '三级 2-1-1'
 
-            }]
 
-          }, {
 
-            label: '二级 2-2',
 
-            children: [{
 
-              label: '三级 2-2-1'
 
-            }]
 
+            label: '三级 2-2-1'
 
+          }]
 
+        }]
 
+      }, {
 
+        label: '一级 3',
 
+        children: [{
 
+          label: '二级 3-1',
 
+          children: [{
 
+            label: '三级 3-1-1'
 
           }]
 
         }, {
 
-          label: '一级 3',
 
+          label: '二级 3-2',
 
           children: [{
 
-            label: '二级 3-1',
 
-            children: [{
 
-              label: '三级 3-1-1'
 
-            }]
 
-          }, {
 
-            label: '二级 3-2',
 
-            children: [{
 
-              label: '三级 3-2-1'
 
-            }]
 
+            label: '三级 3-2-1'
 
           }]
 
-        }],
 
-        defaultProps: {
 
-          children: 'children',
 
-          label: 'label'
 
-        },
 
-      dialogVisible:false,
 
+        }]
 
+      }],
 
+      defaultProps: {
 
+        children: 'children',
 
+        label: 'label'
 
+      },
 
+      dialogVisible: false,
 
       tabs: [
 
         {
 
           icon: "svg-gis",
 
@@ -487,66 +364,62 @@ export default {
 
         gzpc: null,
 
         gzjx: null,
 
         prodtdepttime: null,
 
-        checkdeptopinion: null,
 
-        rwfpsc: 0.0,
 
-        rwfppjsc: 1066.0,
 
-        ddxcsc: 0.0,
 
-        ddxcpjsc: 0.0,
 
-        qxclsc: 0.0,
 
-        qxclpjsc: 0.0,
 
-        yssc: 0.0,
 
-        yspjsc: 0.0,
 
-        workHours: null,
 
-        rwfpsc: 0,
 
-        rwfppjsc: 0,
 
-        ddxcsc: 0,
 
-        ddxcpjsc: 0,
 
-        qxclsc: 0,
 
-        qxclpjsc: 0,
 
-        yssc: 0,
 
-        yspjsc: 0,
 
-        workHours: 0,
 
+        checkdeptopinion: null
 
       },
 
+
 
+      videoConfigHost: '10.155.32.4:9984', // 视频 host
 
+      // videoConfigHost: 'localhost:9984', // 视频 host
 
+      videoConfigToken: 'stream-1', // 视频 token
 
+      videoConfigStreamprofile: 'Profile_1', // 视频流文件
 
+      videoPlayer: null // 视频播放实例
 
     };
 
   },
 
-  created() {
 
-    this.form = this.formdata;
 
-    console.warn(this.form);
 
-    console.warn(this.statu(this.form));
 
-    this.form.tjss = this.form.tjss
 
-      ? new Date(this.form.tjss).formatDate("yyyy-MM-dd hh:mm:ss")
 
-      : null;
 
-    this.form.prodtdepttime = this.form.prodtdepttime
 
-      ? new Date(this.form.prodtdepttime).formatDate("yyyy-MM-dd hh:mm:ss")
 
-      : null;
 
-    this.form.departuretime = this.form.departuretime
 
-      ? new Date(this.form.departuretime).formatDate("yyyy-MM-dd hh:mm:ss")
 
-      : null;
 
-    this.form.arrivaltime = this.form.arrivaltime
 
-      ? new Date(this.form.arrivaltime).formatDate("yyyy-MM-dd hh:mm:ss")
 
-      : null;
 
-    this.form.repairedtime = this.form.repairedtime
 
-      ? new Date(this.form.repairedtime).formatDate("yyyy-MM-dd hh:mm:ss")
 
-      : null;
 
-    this.form.checktime = this.form.checktime
 
-      ? new Date(this.form.checktime).formatDate("yyyy-MM-dd hh:mm:ss")
 
-      : null;
 
+  created () {
 
+    this.setData();
 
+  },
 
+
 
+  updated () {
 
+    this.setData();
 
+  },
 
+
 
+  onmounted () {
 
+    this.cancelPlay();
 
   },
 
 
   // 函数
 
   methods: {
 
-    handleNodeClick(data) {
 
+    setData () {
 
+      this.form = this.formdata;
 
+      this.form.tjss = this.form.tjss
 
+        ? new Date(this.form.tjss).formatDate("yyyy-MM-dd hh:mm:ss")
 
+        : null;
 
+      this.form.prodtdepttime = this.form.prodtdepttime
 
+        ? new Date(this.form.prodtdepttime).formatDate("yyyy-MM-dd hh:mm:ss")
 
+        : null;
 
+      this.form.departuretime = this.form.departuretime
 
+        ? new Date(this.form.departuretime).formatDate("yyyy-MM-dd hh:mm:ss")
 
+        : null;
 
+      this.form.arrivaltime = this.form.arrivaltime
 
+        ? new Date(this.form.arrivaltime).formatDate("yyyy-MM-dd hh:mm:ss")
 
+        : null;
 
+      this.form.repairedtime = this.form.repairedtime
 
+        ? new Date(this.form.repairedtime).formatDate("yyyy-MM-dd hh:mm:ss")
 
+        : null;
 
+      this.form.checktime = this.form.checktime
 
+        ? new Date(this.form.checktime).formatDate("yyyy-MM-dd hh:mm:ss")
 
+        : null;
 
+    },
 
+    handleNodeClick (data) {
 
       this.location = data.id
 
-        console.log(data);
 
-        this.searchTab(data.id)
 
-      },
 
-    DateformatDate(val) {
 
+      this.searchTab(data.id)
 
+    },
 
+    DateformatDate (val) {
 
       return new Date(val).formatDate("yyyy-MM-dd hh:mm:ss");
 
     },
 
-    showDet() {
 
+    showDet () {
 
       this.$refs.det.show();
 
     },
 
-    statu(data) {
 
+    statu (data) {
 
       if (null != data.checktime) {
 
         return "消缺验收";
 
       } else if (
 
@@ -572,41 +445,105 @@ export default {
 
         return "流程未启动";
 
       }
 
     },
 
-    async searchH(){
 
-      const {data} = await this.API.requestData({
 
+    async searchH () {
 
+      const { data } = await this.API.requestData({
 
         method: "POST",
 
         subUrl: "/recommen/findLocationTreeByWtId",
 
         data: {
 
-          wtId: this.form.wtId ,
 
+          wtId: this.form.wtId,
 
         },
 
       })
 
-      this.dialogVisible =true
 
+      this.dialogVisible = true
 
       this.data = data.data
 
       this.location = data.data[0].id
 
-      console.warn(data);
 
       this.searchTab()
 
     },
 
-    async searchTab(){
 
-      const {data} = await this.API.requestData({
 
+    async searchTab () {
 
+      const { data } = await this.API.requestData({
 
         method: "POST",
 
         subUrl: "/recommen/findWobugeqByLocation",
 
         data: {
 
           tablepar: {
 
-            pageNum:1,
 
-            pageSize:10,
 
+            pageNum: 1,
 
+            pageSize: 10,
 
           },
 
-          location:this.location
 
+          location: this.location
 
         },
 
       })
 
-      console.warn(data);
 
-      this.tableData.data= data.data
 
+      this.tableData.data = data.data
 
+    },
 
+    showVideoBox () {
 
+      this.videoBoxShow = true;
 
+      this.$nextTick(() => {
 
+        this.listenEvent();
 
+        this.resetVideo();
 
+      });
 
+    },
 
+    // 销毁播放实例
 
+    cancelPlay () {
 
+      $('.videoPlayer').attr('poster', "").attr('src', "");
 
+      this.videoPlayer && this.videoPlayer.disconnect() && (this.videoPlayer = null);
 
+    },
 
+
 
+    // 监听视频被暂停和被播放
 
+    listenEvent () {
 
+      let that = this;
 
+
 
+      //判断设备
 
+      if (H5siOS() === true || H5sSafariBrowser() === true) {
 
+        $('.videoPlayer').prop('controls', true);
 
+      }
 
+
 
+      //如果是暂停状态，就让它开始；如果是开始就让他暂停。每次开始之前都先清空参数
 
+      $('.videoPlayer').on('click', function () {
 
+        if ($(this).get(0).paused) {
 
+          that.resetVideo();
 
+        } else {
 
+          that.videoPlayer.disconnect();
 
+          $(this).get(0).pause();
 
+          this.BASE.showMsg({
 
+            type: "success",
 
+            msg: "暂停播放"
 
+          });
 
+        }
 
+      });
 
     },
 
-    selectTab: function (tab,index) {
 
+
 
+    // 重置视频播放状态
 
+    resetVideo () {
 
+      this.$nextTick(() => {
 
+        let videoConfig = {
 
+          videoid: 'videoPlayer',//跟上面video标签的id一致
 
+          protocol: 'http:', //'http:' or 'https:'
 
+          host: this.videoConfigHost, //'localhost:8080'自己内部的网址
 
+          rootpath: '/', // '/' or window.location.pathname
 
+          token: this.videoConfigToken,//可变参数
 
+          // streamprofile: this.videoConfigStreamprofile, // {string} - stream profile, main/sub or other predefine transcoding profile
 
+          hlsver: 'v1', //v1 is for ts, v2 is for fmp4
 
+          session: 'e312287e-d809-4b4b-a5d6-336e5006199f' //session got from login可变参数
 
+        };
 
+
 
+        this.cancelPlay();
 
+        this.videoPlayer = new H5sPlayerRTC(videoConfig);
 
+        this.videoPlayer.connect();
 
+
 
+        this.BASE.showMsg({
 
+          type: "success",
 
+          msg: "播放组件初始化中...请稍后..."
 
+        });
 
+
 
+      });
 
+    },
 
+    selectTab: function (tab, index) {
 
       this.activeTab = index;
 
-      if (index == 1) {
 
+      if (index === 0) {
 
+        this.gisBoxShow = true;
 
+      } else if (index == 1) {
 
         this.showDet();
 
+      } else if (index === 2) {
 
+        this.showVideoBox();
 
       }
 
-      if(tab.text == '消缺历史'){
 
+      if (tab.text == '消缺历史') {
 
         this.searchH()
 
       }
 
     },
 
@@ -615,17 +552,17 @@ export default {
 
 </script>
 
 
 <style lang="less">
 
-.diamain{
 
+.diamain {
 
   width: 100%;
 
   height: 700px;
 
-  overflow:hidden;
 
+  overflow: hidden;
 
   display: flex;
 
   justify-content: space-between;
 
-  .left{
 
+  .left {
 
     width: 30%;
 
     overflow-y: auto;
 
   }
 
-  .right{
 
+  .right {
 
     width: 68%;
 
   }
 
 }
 
@@ -731,7 +668,6 @@ export default {
 
               #606769 100%
 
             );
 
           }
 
-
 
           .svg-icon {
 
             position: absolute;
 
             width: 26px;
 
@@ -747,7 +683,6 @@ export default {
 
             }
 
           }
 
         }
 
-
 
         .work-flow-text {
 
           color: @gray-l;
 
           margin-top: 8px;
 
@@ -756,27 +691,26 @@ export default {
 
       }
 
     }
 
   }
 
-
 
   .evaluate {
 
     flex: 0 0 240px;
 
     margin-left: 30px;
 
-
 
     .evaluate-item {
 
       display: flex;
 
+      justify-content: space-between;
 
       align-items: center;
 
       margin-top: 8px;
 
-
 
+      .el-input__inner {
 
+        text-align: center;
 
+      }
 
       .evaluate-label {
 
         width: 120px;
 
         text-align: right;
 
       }
 
-
 
       .evaluate-label,
 
       .evaluate-unit {
 
         font-size: @fontsize;
 
         color: @gray-l;
 
       }
 
-
 
       .input-number {
 
         display: inline-block;
 
         width: 62px;
 
@@ -784,37 +718,30 @@ export default {
 
       }
 
     }
 
   }
 
-
 
   .tabs {
 
     flex: 0 0 200px;
 
     height: 619px;
 
     margin-left: 20px;
 
     border-left: 1px solid #53626833;
 
-
 
     .tab-box {
 
       margin: 1.852vh 2.778vh;
 
       display: inline-block;
 
       z-index: 2;
 
       position: relative;
 
       margin: 26px 0 0 20px;
 
-
 
       .tab-item {
 
         display: flex;
 
-        align-items: center;
 
-        // justify-content: center;
 
+        align-items: center; // justify-content: center;
 
         font-size: @fontsize-l;
 
-        cursor: pointer;
 
-        // width: 120px;
 
+        cursor: pointer; // width: 120px;
 
         padding: 8px;
 
         margin-bottom: 16px;
 
-
 
         &.active {
 
           color: @green;
 
           position: relative;
 
           background-image: @greenLinearTop;
 
-
 
           &::after {
 
-            content: "";
 
+            content: '';
 
             position: absolute;
 
             width: 100%;
 
             height: 5px;
 
@@ -825,7 +752,6 @@ export default {
 
             box-sizing: border-box;
 
           }
 
         }
 
-
 
         .svg-icon {
 
           margin-right: 16px;
 
         }
 
@@ -833,4 +759,32 @@ export default {
 
     }
 
   }
 
 }
 
+.videoPlayer {
 
+  width: 100%;
 
+  height: 100%;
 
+  object-fit: contain;
 
+  cursor: pointer;
 
+}
 
+</style>
 
+<style lang="less">
 
+.evaluate {
 
+  .evaluate-item {
 
+    .el-input__inner {
 
+      padding: 0 15px;
 
+      text-align: center;
 
+    }
 
+  }
 
+
 
+  .evaluate-item.warColor {
 
+    .el-input__inner {
 
+      color: #f25656;
 
+    }
 
+  }
 
+}
 
+
 
+.gisBox {
 
+  .el-dialog__body {
 
+    height: 600px;
 
+  }
 
+}
 
 </style>

+ 80 - 55
src/views/LightMatrix3/LightMatrix3.vue
查看文件 

@@ -5,50 +5,52 @@
 
       <div class="dot left bottom"></div>
 
       <div class="dot right top"></div>
 
       <div class="dot right bottom"></div>
 
-      <Row>
 
-        <Col :span="3">
 
-          <div class="panel-item-gf">
 
-            <div class="panel-item-gf-left">
 
-              <span class="svg-icon svg-icon-write svg-icon-md">
 
-                <SvgIcon :svgid="panelData.first.icon"></SvgIcon>
 
-              </span>
 
-            </div>
 
-            <div class="panel-item-gf-right">
 
-              <div class="panel-item-gf-up">{{ panelData.first.text }}</div>
 
-              <div class="panel-item-gf-down">{{ sourceMap[panelData.first.key] || "---" }}</div>
 
-            </div>
 
+      <div class="page-header">
 
+        <div class="panel-item-gf">
 
+          <div class="panel-item-gf-left">
 
+            <div class="loop"></div>
 
+            <span class="svg-icon svg-icon-gray svg-icon-md">
 
+              <SvgIcon svgid="svg-wind-site"></SvgIcon>
 
+            </span>
 
+          </div>
 
+          <div class="panel-item-gf-right">
 
+              <div class="panel-item-gf-up">{{ panelData.first.text  }}</div>
 
+              <div class="panel-item-gf-down">{{  sourceMap[panelData.first.key] || "---" }}</div>
 
           </div>
 
-        </Col>
 
-        <Col :span="3" v-for="(data, index) of panelData.datas" :key="index">
 
-          <div class="panel-item" :class="data.color">
 
+        </div>
 
+        <div class="header-info">
 
+          <div class="panel-item" v-for="(data, index) of panelData.datas" :key="index" :class="data.color">
 
             <div class="panel-item-left">
 
               <div class="panel-item-li">
 
                 <span>{{ data.name }}</span>
 
-                <span class="svg-icon svg-icon-sm" :class="'svg-icon-' + data.color">
 
-                  <SvgIcon :svgid="data.nameIcon"></SvgIcon>
 
-                </span>
 
               </div>
 
               <div class="panel-item-li">
 
                 <span v-if="data.calcStr && sourceMap">{{ calcGfStr(data.calcStr) || "---" }}</span>
 
                 <span v-else>{{ sourceMap[data.key] || "---" }}</span>
 
-                <span class="svg-icon svg-icon-sm" :class="'svg-icon-' + data.color">
 
-                  <SvgIcon :svgid="data.numIcon"></SvgIcon>
 
-                </span>
 
               </div>
 
             </div>
 
             <div class="panel-item-right">
 
               <div class="panel-item-ri">
 
-                <span>{{ data.text1 }}</span>
 
+                <span>
 
+                  <i class="svg-icon svg-icon-sm" :class="'svg-icon-' + data.color">
 
+                    <SvgIcon :svgid="data.nameIcon"></SvgIcon>
 
+                  </i>
 
+                  {{ data.text1 }}</span>
 
                 <span>{{ sourceMap[data.key1] || "---" }}</span>
 
               </div>
 
               <div class="panel-item-ri">
 
-                <span>{{ data.text2 }}</span>
 
+                <span>
 
+                  <i class="svg-icon svg-icon-sm" :class="'svg-icon-' + data.color">
 
+                    <SvgIcon :svgid="data.numIcon"></SvgIcon>
 
+                  </i>
 
+                {{ data.text2 }}
 
+                </span>
 
                 <span>{{ sourceMap[data.key2] || "---" }}</span>
 
               </div>
 
             </div>
 
           </div>
 
-        </Col>
 
-      </Row>
 
+        </div>
 
+      </div>
 
     </div>
 
     <el-scrollbar>
 
       <div class="panel-box">
 
@@ -108,8 +110,6 @@
 
 </template>
 
 
 <script>
 
-import Row from "@/components/coms/grid/row.vue";
 
-import Col from "@/components/coms/grid/col.vue";
 
 import SvgIcon from "@com/coms/icon/svg-icon.vue";
 
 import util from "@/helper/util.js";
 
 
@@ -120,8 +120,6 @@ export default {
 
   name: "LightMatrix3",
 
   // 使用组件
 
   components: {
 
-    Row,
 
-    Col,
 
     SvgIcon,
 
   },
 
 
@@ -408,7 +406,7 @@ export default {
 
 </script>
 
 
 <style lang="less" scoped>
 
-@panelHeight: 6.481vh;
 
+@panelHeight: 60px;
 
 @titleHeight: 3.704vh;
 
 
 .light-matrix {
 
@@ -419,9 +417,10 @@ export default {
 
 
   .panel {
 
     width: 100%;
 
-    border: 0.093vh solid @darkgray;
 
+    height: 80px;
 
+    border: 1px solid @darkgray;
 
     position: relative;
 
-    padding: 1.111vh 2.222vh;
 
+    padding: 10px 20px;
 
     background-color: fade(@darkgray, 20%);
 
 
     .dot {
 
@@ -448,45 +447,58 @@ export default {
 
       }
 
     }
 
 
+    .page-header {
 
+      display: flex;
 
+
 
+      .header-info {
 
+        display: flex;
 
+        flex: 1 0 auto;
 
+      }
 
+    }
 
+
 
     .panel-item-gf {
 
-      width: 100%;
 
-      background-color: fade(@darkgray, 20%);
 
+      flex: 0 0 auto;
 
+      margin-right: 16px;
 
       display: flex;
 
       height: @panelHeight;
 
 
       .panel-item-gf-left {
 
         width: @panelHeight;
 
         height: @panelHeight;
 
-        background-color: fade(@darkgray, 40%);
 
         display: flex;
 
         align-items: center;
 
         justify-content: center;
 
-
 
-        i {
 
-          font-size: 2.778vh;
 
-          color: @write;
 
+        position: relative;
 
+
 
+        .loop {
 
+          position: absolute;
 
+          width: 4.444vh;
 
+          height: 4.444vh;
 
+          border-radius: 50%;
 
+          border: 0.093vh solid @darkgray;
 
+          background-color: fade(@darkgray, 20);
 
+          left: calc(50% - 2.222vh);
 
+          top: calc(50% - 2.222vh);
 
         }
 
       }
 
 
       .panel-item-gf-right {
 
-        flex-grow: 1;
 
         color: @write;
 
         text-align: right;
 
+        margin-left: 24px;
 
 
         .panel-item-gf-up {
 
+          color: @gray;
 
           height: @panelHeight / 2;
 
-          border-bottom: 0.093vh solid fade(@darkgray, 40%);
 
           line-height: @panelHeight / 2;
 
-          padding-right: 1.111vh;
 
-          font-size: @fontsize;
 
+          font-size: 14px;
 
         }
 
 
         .panel-item-gf-down {
 
           height: @panelHeight / 2;
 
           line-height: @panelHeight / 2;
 
-          padding-right: 1.111vh;
 
           font-weight: 600;
 
-          font-size: @fontsize;
 
+          font-size: 16px;
 
         }
 
       }
 
     }
 
@@ -494,44 +506,57 @@ export default {
 
     .panel-item {
 
       width: 100%;
 
       height: @panelHeight;
 
-      display: flex;
 
-      font-size: @fontsize-s;
 
+      font-size: 12px;
 
+      margin-left: 8px;
 
 
       .panel-item-left {
 
-        width: @panelHeight;
 
-        height: @panelHeight;
 
+        display: flex;
 
 
         .panel-item-li {
 
-          width: 100%;
 
           height: @panelHeight / 2;
 
           line-height: @panelHeight / 2;
 
+          flex: 1 0 auto;
 
           padding: 0 1.111vh;
 
-          display: flex;
 
           align-items: center;
 
-          font-size: @fontsize-s;
 
+          font-size: 14px;
 
 
           .svg-icon {
 
             margin-left: auto;
 
           }
 
+
 
+          &.value {
 
+            text-align: right;
 
+            flex: 0;
 
+            font-size: 16px;
 
+            color: #fff;
 
+          }
 
         }
 
       }
 
 
       .panel-item-right {
 
+        display: flex;
 
         flex-grow: 1;
 
         height: @panelHeight;
 
 
         .panel-item-ri {
 
           height: @panelHeight / 2;
 
           line-height: @panelHeight / 2;
 
-          padding: 0 1.111vh;
 
+          padding: 0 8px;
 
+          flex: 1;
 
 
           &:first-child {
 
-            border-bottom: 0.093vh solid;
 
+            border-right: 1px solid;
 
           }
 
 
-          span {
 
+          & > span {
 
             &:first-child {
 
               float: left;
 
+              display: flex;
 
+              align-items: center;
 
+
 
+              i {
 
+                margin-right: 4px;
 
+              }
 
             }
 
 
             &:last-child {

+ 55 - 55
src/views/NewPages/alarm-center.vue
查看文件 

@@ -2,7 +2,7 @@
 
   <div class="alarm-center">
 
     <div class="action-bar">
 
       <div class="selections mg-b-16">
 
-        <div v-for="(tabItem, tabIndex) in tabLists" :key="tabItem.type" class="item" :class="{ active: tabIndex == cureent }" @click="tabSelect(tabItem.type, tabIndex)" >
 
+        <div v-for="(tabItem, tabIndex) in tabLists" :key="tabItem.type" class="item" :class="{ active: tabIndex == cureent }" @click="tabSelect(tabItem.type, tabIndex)">
 
           {{ tabItem.name }}
 
         </div>
 
         <!-- <div class="item" @click="tabSelect(0)" :class="{ active: tabIndex == 0 }">发电机</div>
 
@@ -31,7 +31,7 @@
 
     <el-scrollbar>
 
       <div class="fj">
 
         <div class="fj-item" v-for="(item, index) in tableLists" :key="index">
 
-          <div class="fj-title">风机编号:{{item[0].wtId}}</div>
 
+          <div class="fj-title">风机编号:{{ item[0].wtId }}</div>
 
           <div class="fj-info">
 
             <Table :data="handleTable(item)"></Table>
 
           </div>
 
@@ -56,32 +56,32 @@ export default {
 
   data() {
 
     return {
 
       cureent: 0,
 
-      optSelectValue: '',
 
+      optSelectValue: "",
 
       tabLists: [
 
         {
 
-          type: 'fdj',
 
-          name: '发电机'
 
+          type: "fdj",
 
+          name: "发电机",
 
         },
 
         {
 
-          type: 'clx',
 
-          name: '齿轮箱'
 
+          type: "clx",
 
+          name: "齿轮箱",
 
         },
 
         {
 
-          type: 'bj',
 
-          name: '变桨系统'
 
+          type: "bj",
 
+          name: "变桨系统",
 
         },
 
         {
 
-          type: 'yyz',
 
-          name: '液压站'
 
+          type: "yyz",
 
+          name: "液压站",
 
         },
 
         {
 
-          type: 'zd',
 
-          name: '风机震动'
 
+          type: "zd",
 
+          name: "风机震动",
 
         },
 
         {
 
-          type: 'qt',
 
-          name: '其他参数'
 
-        }
 
+          type: "qt",
 
+          name: "其他参数",
 
+        },
 
       ],
 
       // tableData: {
 
       //   column: [
 
@@ -107,15 +107,15 @@ export default {
 
       // },
 
       tableLists: [],
 
       options: [],
 
-      type: '',
 
+      type: "",
 
       timmer: null, // 遮罩开关
 
     };
 
   },
 
   methods: {
 
     tabSelect(type, index) {
 
-      this.cureent = index
 
-      this.type = type
 
-      this.getList(true)
 
+      this.cureent = index;
 
+      this.type = type;
 
+      this.getList(true);
 
     },
 
     handleTable(item) {
 
       let tableData = {
 
@@ -133,56 +133,56 @@ export default {
 
             is_light: false,
 
           },
 
         ],
 
-        data: item
 
-      }
 
-      return tableData
 
+        data: item,
 
+      };
 
+      return tableData;
 
     },
 
     handelSelectChange() {
 
-      this.getList(true)
 
+      this.getList(true);
 
     },
 
     getList(showLoading) {
 
-      let _this = this
 
+      let _this = this;
 
       _this.API.requestData({
 
-          showLoading,
 
-          method: "POST",
 
-          subUrl: "/temperature/getTemperatureList",
 
-          data:{
 
-            type: this.type,
 
-            wpId: this.optSelectValue
 
-          },
 
-          success(res) {
 
-            _this.tableLists = res.data
 
-            // this.tableData.data = res.data
 
-            // debugger
 
-            console.log(res)
 
-          }
 
-      })
 
+        showLoading,
 
+        method: "POST",
 
+        subUrl: "/temperature/getTemperatureList",
 
+        data: {
 
+          type: this.type,
 
+          wpId: this.optSelectValue,
 
+        },
 
+        success(res) {
 
+          _this.tableLists = res.data;
 
+          // this.tableData.data = res.data
 
+          // debugger
 
+          console.log(res);
 
+        },
 
+      });
 
     },
 
 
     getSelectLists(showLoading) {
 
-      let _this = this
 
+      let _this = this;
 
       _this.API.requestData({
 
-          showLoading,
 
-          method: "GET",
 
-          subUrl: "/powercompare/windfarmAjax",
 
-          success(res) {
 
-            _this.options = res.data
 
-            _this.optSelectValue = res.data[0].id
 
-            _this.$nextTick(() => {
 
+        showLoading,
 
+        method: "GET",
 
+        subUrl: "/powercompare/windfarmAjax",
 
+        success(res) {
 
+          _this.options = res.data;
 
+          _this.optSelectValue = res.data[0].id;
 
+          _this.$nextTick(() => {
 
+            _this.getList(false);
 
+            _this.timmer = setInterval(() => {
 
               _this.getList(false);
 
-              _this.timmer = setInterval(() => {
 
-                _this.getList(false)
 
-              }, _this.$store.state.websocketTimeSec);
 
-            });
 
-          }
 
-      })
 
-    }
 
+            }, _this.$store.state.websocketTimeSec);
 
+          });
 
+        },
 
+      });
 
+    },
 
   },
 
   created() {
 
     // for (let i = 1; i < 7; i++) {
 
     //   this.tableData.data.push(JSON.parse(JSON.stringify(this.tableData.data[0])));
 
     // }
 
-    this.type = this.tabLists[0].type
 
+    this.type = this.tabLists[0].type;
 
     this.getSelectLists(false);
 
 
     // this.getList()

+ 6 - 4
src/views/NewPages/history-search.vue
查看文件 

@@ -15,6 +15,12 @@
 
           </div>
 
         </div>
 
         <div class="query-item">
 
+          <div class="lable">间隔：</div>
 
+          <div class="search-input">
 
+            <el-checkbox v-model="form.autoReq" label="刷新" :border="true"></el-checkbox>
 
+          </div>
 
+        </div>
 
+        <div class="query-item">
 
           <div class="lable"></div>
 
           <div class="search-input">
 
             <transition name="el-zoom-in-center">
 
@@ -508,8 +514,6 @@ export default {
 
         height: 160px;
 
         margin-top: 10px;
 
         overflow-y: scroll;
 
-
 
-      
       }
 
     }
 
   }
 
@@ -519,8 +523,6 @@ export default {
 
   .el-select {
 
     max-height: 150px;
 
     overflow-y: scroll;
 
-
 
-   
   }
 
 }

+ 163 - 57
src/views/NewPages/knowledge-base.vue
查看文件 

@@ -2,25 +2,110 @@
 
   <div class="knowledge-base">
 
     <el-row class="mg-b-16">
 
       <el-col :span="8">
 
-        <panel class="outline" :title="'故障体系'" :icon="'fa fa-warning'" :subTitle="1234" :showLine="false">
 
+        <panel class="outline" :title="'故障体系'" :icon="'fa fa-warning'" :subTitle="3347" :showLine="false">
 
           <div class="table">
 
             <div>
 
               <table style="width:100%;" border="0" cellspacing="0">
 
                 <tbody>
 
-                  <tr v-for="index of 6" :key="index">
 
+                  <tr>
 
                     <td style="width:150px;">
 
-                      MG01_01
 
+                      UP77
 
                     </td>
 
                     <td class="green num" style="width:105px;">
 
-                      1234.56
 
+                      409
 
                     </td>
 
                     <td style="width:350px;">
 
                       <div class="percent-item">
 
                         完成度
 
                         <div class="percent-bar" style="">
 
-                          <div class="percent-value" style="width:80%"></div>
 
+                          <div class="percent-value" style="width: 12%"></div>
 
                         </div>
 
-                        <span class="perent-num">80%</span>
 
+                        <span class="perent-num">12%</span>
 
+                      </div>
 
+                    </td>
 
+                  </tr>
 
+                  <tr>
 
+                    <td style="width:150px;">
 
+                      UP82
 
+                    </td>
 
+                    <td class="green num" style="width:105px;">
 
+                      409
 
+                    </td>
 
+                    <td style="width:350px;">
 
+                      <div class="percent-item">
 
+                        完成度
 
+                        <div class="percent-bar" style="">
 
+                          <div class="percent-value" style="width: 12%"></div>
 
+                        </div>
 
+                        <span class="perent-num">12%</span>
 
+                      </div>
 
+                    </td>
 
+                  </tr>
 
+                  <tr>
 
+                    <td style="width:150px;">
 
+                      UP86
 
+                    </td>
 
+                    <td class="green num" style="width:105px;">
 
+                      0
 
+                    </td>
 
+                    <td style="width:350px;">
 
+                      <div class="percent-item">
 
+                        完成度
 
+                        <div class="percent-bar" style="">
 
+                          <div class="percent-value" style="width: 0%"></div>
 
+                        </div>
 
+                        <span class="perent-num">0%</span>
 
+                      </div>
 
+                    </td>
 
+                  </tr>
 
+                  <tr>
 
+                    <td style="width:150px;">
 
+                      UP97
 
+                    </td>
 
+                    <td class="green num" style="width:105px;">
 
+                      0
 
+                    </td>
 
+                    <td style="width:350px;">
 
+                      <div class="percent-item">
 
+                        完成度
 
+                        <div class="percent-bar" style="">
 
+                          <div class="percent-value" style="width: 0%"></div>
 
+                        </div>
 
+                        <span class="perent-num">0%</span>
 
+                      </div>
 
+                    </td>
 
+                  </tr>
 
+                  <tr>
 
+                    <td style="width:150px;">
 
+                      UP105
 
+                    </td>
 
+                    <td class="green num" style="width:105px;">
 
+                      0
 
+                    </td>
 
+                    <td style="width:350px;">
 
+                      <div class="percent-item">
 
+                        完成度
 
+                        <div class="percent-bar" style="">
 
+                          <div class="percent-value" style="width: 0%"></div>
 
+                        </div>
 
+                        <span class="perent-num">0%</span>
 
+                      </div>
 
+                    </td>
 
+                  </tr>
 
+                  <tr>
 
+                    <td style="width:150px;">
 
+                      华创
 
+                    </td>
 
+                    <td class="green num" style="width:105px;">
 
+                      2529
 
+                    </td>
 
+                    <td style="width:350px;">
 
+                      <div class="percent-item">
 
+                        完成度
 
+                        <div class="percent-bar" style="">
 
+                          <div class="percent-value" style="width: 76%"></div>
 
+                        </div>
 
+                        <span class="perent-num">76%</span>
 
                       </div>
 
                     </td>
 
                   </tr>
 
@@ -31,51 +116,51 @@
 
         </panel>
 
       </el-col>
 
       <el-col :span="8">
 
-        <panel class="outline" :title="'预警知识'" :icon="'fa fa-warning'" :subTitle="1234" :showLine="false">
 
+        <panel class="outline" :title="'预警知识'" :icon="'fa fa-warning'" :subTitle="173" :showLine="false">
 
           <div class="warning-item">
 
             <div class="sub-item">
 
               <div class="text">发电机：</div>
 
-              <div class="value">1234.56</div>
 
+              <div class="value">91</div>
 
             </div>
 
             <div class="sub-item">
 
-              <div class="text">发电机：</div>
 
-              <div class="value">1234.56</div>
 
+              <div class="text">偏航：</div>
 
+              <div class="value">0</div>
 
             </div>
 
           </div>
 
           <div class="warning-item">
 
             <div class="sub-item">
 
-              <div class="text">发电机：</div>
 
-              <div class="value">1234.56</div>
 
+              <div class="text">齿轮箱：</div>
 
+              <div class="value">45</div>
 
             </div>
 
             <div class="sub-item">
 
-              <div class="text">发电机：</div>
 
-              <div class="value">1234.56</div>
 
+              <div class="text">机舱：</div>
 
+              <div class="value">12</div>
 
             </div>
 
           </div>
 
           <div class="warning-item">
 
             <div class="sub-item">
 
-              <div class="text">发电机：</div>
 
-              <div class="value">1234.56</div>
 
+              <div class="text">主轴：</div>
 
+              <div class="value">5</div>
 
             </div>
 
             <div class="sub-item">
 
-              <div class="text">发电机：</div>
 
-              <div class="value">1234.56</div>
 
+              <div class="text">变频：</div>
 
+              <div class="value">0</div>
 
             </div>
 
           </div>
 
           <div class="warning-item">
 
             <div class="sub-item">
 
-              <div class="text">发电机：</div>
 
-              <div class="value">1234.56</div>
 
+              <div class="text">变桨：</div>
 
+              <div class="value">9</div>
 
             </div>
 
             <div class="sub-item">
 
-              <div class="text">发电机：</div>
 
-              <div class="value">1234.56</div>
 
+              <div class="text">主控：</div>
 
+              <div class="value">9</div>
 
             </div>
 
           </div>
 
         </panel>
 
       </el-col>
 
       <el-col :span="8">
 
-        <panel class="outline" :title="'特征参数'" :icon="'fa fa-id-card-o'" :subTitle="1234" :showLine="false">
 
+        <panel class="outline" :title="'特征参数'" :icon="'fa fa-id-card-o'" :subTitle="248" :showLine="false">
 
           <div class="feature-item">
 
             <div class="title">
 
               <i class="svg-icon svg-icon-sm svg-icon-gray">
 
@@ -83,7 +168,7 @@
 
               </i>
 
               基于数据统计
 
             </div>
 
-            <div class="value">123</div>
 
+            <div class="value">28</div>
 
           </div>
 
           <div class="feature-item">
 
             <div class="title">
 
@@ -92,7 +177,7 @@
 
               </i>
 
               神经网络整理
 
             </div>
 
-            <div class="value">123</div>
 
+            <div class="value">77</div>
 
           </div>
 
           <div class="feature-item">
 
             <div class="title">
 
@@ -101,7 +186,7 @@
 
               </i>
 
               文档整理
 
             </div>
 
-            <div class="value">123</div>
 
+            <div class="value">124</div>
 
           </div>
 
           <div class="feature-item">
 
             <div class="title">
 
@@ -110,79 +195,67 @@
 
               </i>
 
               专家知识分析
 
             </div>
 
-            <div class="value">123</div>
 
+            <div class="value">19</div>
 
           </div>
 
         </panel>
 
       </el-col>
 
     </el-row>
 
     <el-row>
 
       <el-col :span="8">
 
-        <panel class="outline" :title="'故障体系'" :icon="'fa fa-warning'" :subTitle="1234" :showLine="false">
 
+        <panel class="outline" :title="'排查、检修方案'" :icon="'fa fa-warning'" :subTitle="4344" :showLine="false">
 
           <div class="circle-items">
 
             <div class="circle-item">
 
               <div class="inner">
 
-                <div class="text">健康评价</div>
 
-                <div class="value">29</div>
 
-              </div>
 
-            </div>
 
-            <div class="circle-item">
 
-              <div class="inner">
 
-                <div class="text">健康评价</div>
 
-                <div class="value">29</div>
 
+                <div class="text">排查方法</div>
 
+                <div class="value">431</div>
 
               </div>
 
             </div>
 
             <div class="circle-item">
 
               <div class="inner">
 
-                <div class="text">健康评价</div>
 
-                <div class="value">29</div>
 
+                <div class="text">检修方案</div>
 
+                <div class="value">3913</div>
 
               </div>
 
             </div>
 
           </div>
 
         </panel>
 
       </el-col>
 
       <el-col :span="8">
 
-        <panel class="outline" :title="'预警知识'" :icon="'fa fa-warning'" :subTitle="1234" :showLine="false">
 
+        <panel class="outline" :title="'评价体系'" :icon="'fa fa-warning'" :subTitle="7" :showLine="false">
 
           <div class="circle-items">
 
             <div class="circle-item">
 
               <div class="inner">
 
-                <div class="text">健康评价</div>
 
-                <div class="value">29</div>
 
+                <div class="text">性能评价体系</div>
 
+                <div class="value">3</div>
 
               </div>
 
             </div>
 
             <div class="circle-item">
 
               <div class="inner">
 
-                <div class="text">健康评价</div>
 
-                <div class="value">29</div>
 
+                <div class="text">健康评价体系</div>
 
+                <div class="value">2</div>
 
               </div>
 
             </div>
 
             <div class="circle-item">
 
               <div class="inner">
 
-                <div class="text">健康评价</div>
 
-                <div class="value">29</div>
 
+                <div class="text">故障诊断体系</div>
 
+                <div class="value">2</div>
 
               </div>
 
             </div>
 
           </div>
 
         </panel>
 
       </el-col>
 
       <el-col :span="8">
 
-        <panel class="outline" :title="'特征参数'" :icon="'fa fa-id-card-o'" :subTitle="1234" :showLine="false">
 
+        <panel class="outline" :title="'人工智能'" :icon="'fa fa-id-card-o'" :subTitle="9" :showLine="false">
 
           <div class="circle-items">
 
             <div class="circle-item">
 
               <div class="inner">
 
-                <div class="text">健康评价</div>
 
-                <div class="value">29</div>
 
-              </div>
 
-            </div>
 
-            <div class="circle-item">
 
-              <div class="inner">
 
-                <div class="text">健康评价</div>
 
-                <div class="value">29</div>
 
+                <div class="text">决策树</div>
 
+                <div class="value">2</div>
 
               </div>
 
             </div>
 
             <div class="circle-item">
 
               <div class="inner">
 
-                <div class="text">健康评价</div>
 
-                <div class="value">29</div>
 
+                <div class="text">神经网络</div>
 
+                <div class="value">7</div>
 
               </div>
 
             </div>
 
           </div>
 
@@ -199,7 +272,40 @@ export default {
 
   components: { panel, SvgIcon },
 
   setup() {},
 
   data() {
 
-    return {};
 
+    return {
 
+      gztx: [
 
+        {
 
+          id: "UP77",
 
+          name: "409",
 
+          wsd: "12%",
 
+        },
 
+        {
 
+          id: "UP82",
 
+          name: "409",
 
+          wsd: "12%",
 
+        },
 
+        {
 
+          id: "UP86",
 
+          name: "0",
 
+          wsd: "0%",
 
+        },
 
+        {
 
+          id: "UP97",
 
+          name: "0",
 
+          wsd: "0%",
 
+        },
 
+        {
 
+          id: "UP105",
 
+          name: "0",
 
+          wsd: "0%",
 
+        },
 
+        {
 
+          id: "华创",
 
+          name: "2529",
 
+          wsd: "76%",
 
+        },
 
+      ],
 
+    };
 
   },
 
 };
 
 </script>

+ 76 - 76
src/views/WindSite/components/gax6.vue
查看文件 

@@ -67,21 +67,21 @@ export default {
 
                 direction: "top"
 
             },{
 
                 id: "315",
 
-                x: 868,
 
+                x: 803,
 
                 y: 497,
 
                 type: "switch",
 
                 state: 0,
 
                 direction: "top"
 
             },{
 
                 id: "323",
 
-                x: 958,
 
+                x: 868,
 
                 y: 497,
 
                 type: "switch",
 
                 state: 1,
 
                 direction: "top"
 
             },{
 
                 id: "322",
 
-                x: 1088,
 
+                x: 1023,
 
                 y: 497,
 
                 type: "switch",
 
                 state: 0,
 
@@ -150,19 +150,19 @@ export default {
 
             },{
 
                 id: "L315",
 
                 shape: "simple-text-r",
 
-                x: 855,
 
+                x: 790,
 
                 y: 470,
 
                 label: "315",
 
             },{
 
                 id: "L323",
 
                 shape: "simple-text-r",
 
-                x: 940,
 
+                x: 850,
 
                 y: 470,
 
                 label: "323",
 
             },{
 
                 id: "L322",
 
                 shape: "simple-text-r",
 
-                x: 1070,
 
+                x: 1005,
 
                 y: 470,
 
                 label: "322",
 
             },{
 
@@ -188,7 +188,7 @@ export default {
 
                 shape: "tag-text",
 
                 x: 1640,
 
                 y: 555,
 
-                label: "#3集电线路",
 
+                label: "#4集电线路",
 
             },{
 
                 id: "jddl_2",
 
                 shape: "tag-text",
 
@@ -199,8 +199,8 @@ export default {
 
                 id: "jddl_4",
 
                 shape: "tag-text",
 
                 x: 1640,
 
-                y: 685,
 
-                label: "#4集电线路",
 
+                y: 815,
 
+                label: "#3集电线路",
 
             }],
 
             fans: [{
 
                 id: "fanA01",
 
@@ -424,67 +424,67 @@ export default {
 
                 label: "A01",
 
             },
 
             
-            {
 
-                id: "fanA23-m",
 
-                shape: "fan-green",
 
-                x: 1150,
 
-                y: 640,
 
-                label: "A01",
 
-            },{
 
-                id: "fanA24-m",
 
-                shape: "fan-green",
 
-                x: 1200,
 
-                y: 640,
 
-                label: "A01",
 
-            },{
 
-                id: "fanA25-m",
 
-                shape: "fan-green",
 
-                x: 1250,
 
-                y: 640,
 
-                label: "A01",
 
-            },{
 
-                id: "fanA26-m",
 
-                shape: "fan-green",
 
-                x: 1300,
 
-                y: 640,
 
-                label: "A01",
 
-            },{
 
-                id: "fanA27-m",
 
-                shape: "fan-green",
 
-                x: 1350,
 
-                y: 640,
 
-                label: "A01",
 
-            },{
 
-                id: "fanA28-m",
 
-                shape: "fan-green",
 
-                x: 1400,
 
-                y: 640,
 
-                label: "A01",
 
-            },{
 
-                id: "fanA29-m",
 
-                shape: "fan-green",
 
-                x: 1450,
 
-                y: 640,
 
-                label: "A01",
 
-            },{
 
-                id: "fanA31-m",
 
-                shape: "fan-green",
 
-                x: 1600,
 
-                y: 640,
 
-                label: "A01",
 
-            },{
 
-                id: "fanA32-m",
 
-                shape: "fan-green",
 
-                x: 1650,
 
-                y: 640,
 
-                label: "A01",
 
-            },{
 
-                id: "fanA33-m",
 
-                shape: "fan-green",
 
-                x: 1700,
 
-                y: 640,
 
-                label: "A01",
 
-            },
 
+            // {
 
+            //     id: "fanA23-m",
 
+            //     shape: "fan-green",
 
+            //     x: 1150,
 
+            //     y: 640,
 
+            //     label: "A01",
 
+            // },{
 
+            //     id: "fanA24-m",
 
+            //     shape: "fan-green",
 
+            //     x: 1200,
 
+            //     y: 640,
 
+            //     label: "A01",
 
+            // },{
 
+            //     id: "fanA25-m",
 
+            //     shape: "fan-green",
 
+            //     x: 1250,
 
+            //     y: 640,
 
+            //     label: "A01",
 
+            // },{
 
+            //     id: "fanA26-m",
 
+            //     shape: "fan-green",
 
+            //     x: 1300,
 
+            //     y: 640,
 
+            //     label: "A01",
 
+            // },{
 
+            //     id: "fanA27-m",
 
+            //     shape: "fan-green",
 
+            //     x: 1350,
 
+            //     y: 640,
 
+            //     label: "A01",
 
+            // },{
 
+            //     id: "fanA28-m",
 
+            //     shape: "fan-green",
 
+            //     x: 1400,
 
+            //     y: 640,
 
+            //     label: "A01",
 
+            // },{
 
+            //     id: "fanA29-m",
 
+            //     shape: "fan-green",
 
+            //     x: 1450,
 
+            //     y: 640,
 
+            //     label: "A01",
 
+            // },{
 
+            //     id: "fanA31-m",
 
+            //     shape: "fan-green",
 
+            //     x: 1600,
 
+            //     y: 640,
 
+            //     label: "A01",
 
+            // },{
 
+            //     id: "fanA32-m",
 
+            //     shape: "fan-green",
 
+            //     x: 1650,
 
+            //     y: 640,
 
+            //     label: "A01",
 
+            // },{
 
+            //     id: "fanA33-m",
 
+            //     shape: "fan-green",
 
+            //     x: 1700,
 
+            //     y: 640,
 
+            //     label: "A01",
 
+            // },
 
 
             {
 
                 id: "fanA23-2",
 
@@ -585,7 +585,7 @@ export default {
 
                 },
 
                 interacting: false,
 
             });
 
-            // this.graph.zoomTo(0.8);
 
+            this.graph.zoomTo(0.8);
 
         },
 
         initData: function () {
 
             const data = { 
@@ -596,18 +596,18 @@ export default {
 
                     shape: "path",
 
                     attrs: {
 
                         body: {
 
-                            d: `M1007.9,99.76V273.33h473V172.08H1045.63V143.15H1672.5
 
-                                M878,99.76V400.3c1.81,1.53,3.69,1.21,5.49,1.21H1666c6.49,0,6.49,0,6.49-6.48V279.81c0-5.9,0-6-6-6q-22.5,0-45,0H1513.1
 
-                                M788,99.76V401.51H1
 
+                            d: `M942.9,99.76v44.39H1666
 
+                                M788,99.76V400.3c1.81,1.53,3.69,1.21,5.49,1.21H1666
 
+                                M723,99.76V401.51H1
 
                                 M658.11,99.76v44.39H1
 
                                 M803.52,34.42H643.62
 
                                 M1023.39,34.42H863.49
 
                                 M723.07,-19V33.42
 
                                 M942.94,-19V33.42
 
                                 M658.11,35.91V66.84
 
+                                M723,35.91V66.84
 
                                 M788,35.91V66.84
 
-                                M878,35.91V66.84
 
-                                M1007.9,35.91V66.84`,
 
+                                M942.9,35.91V66.84`,
 
                             fill: "transparent",
 
                             stroke: "#cbaa07",
 
                             "stroke-width": 3,

+ 260 - 260
src/views/WindSite/pages/Home/Home.vue
查看文件 

@@ -1,234 +1,234 @@
 
 <template>
 
-  <div class="btn-group-tabs">
 
-    <BtnGroup2 :btnGroups="btnGroupsss" :rowIndex="rowIndex" :index="selectIndex" @select="select"></BtnGroup2>
 
-  </div>
 
-  <div class="wind-site-home">
 
-    <div class="mg-b-16">
 
-      <btn-group-double :btnGroups="btnGroups" :rowIndex="0" :index="1" @select="select" />
 
+  <div>
 
+    <div class="btn-group-tabs">
 
+      <BtnGroup2 :btnGroups="btnGroupsss" :rowIndex="rowIndex" :index="selectIndex" @select="select"></BtnGroup2>
 
     </div>
 
-    <row>
 
-      <wind-site-weather :time="nowTime" :data="tqmap" />
 
-      <panel-3 class="wind-site-info">
 
-        <row align="middle">
 
-          <div class="info-item">
 
-            <div class="value">{{ jczbmap.zjrl }}</div>
 
-            <div class="text">装机容量</div>
 
-          </div>
 
-          <div class="info-item">
 
-            <div class="value">{{ jczbmap.rfdl }}</div>
 
-            <div class="text">日发电量</div>
 
-          </div>
 
-          <div class="info-item">
 
-            <div class="value">{{ jczbmap.yfdl }}</div>
 
-            <div class="text">月发电量</div>
 
-          </div>
 
-          <div class="info-item">
 
-            <div class="value">{{ jczbmap.nfdl }}</div>
 
-            <div class="text">年发电量</div>
 
-          </div>
 
-          <div class="info-item">
 
-            <div class="value">{{ jczbmap.ylyxs }}</div>
 
-            <div class="text">月利用小时</div>
 
-          </div>
 
-          <div class="info-item">
 
-            <div class="value">{{ jczbmap.nlyxs }}</div>
 
-            <div class="text">年利用小时</div>
 
-          </div>
 
-          <div class="info-item">
 
-            <div class="value">{{ jczbmap.ssfs }}</div>
 
-            <div class="text">实时风速</div>
 
-          </div>
 
-          <div class="info-item">
 
-            <div class="value">{{ jczbmap.sjgl }}</div>
 
-            <div class="text">实时功率</div>
 
-          </div>
 
-        </row>
 
-      </panel-3>
 
-      <panel-3 class="wind-running-info">
 
-        <row align="middle">
 
-          <div class="fengji">
 
-            <div class="fengji-icon svg-icon svg-icon-white">
 
-              <svg-icon class="" svgid="svg-风机" />
 
+    <div class="wind-site-home">
 
+      <div class="mg-b-16">
 
+        <btn-group-double :btnGroups="btnGroups" :rowIndex="0" :index="1" @select="select" />
 
+      </div>
 
+      <row>
 
+        <wind-site-weather :time="nowTime" :data="tqmap" />
 
+        <panel-3 class="wind-site-info">
 
+          <row align="middle">
 
+            <div class="info-item">
 
+              <div class="value">{{ jczbmap.zjrl }}</div>
 
+              <div class="text">装机容量</div>
 
             </div>
 
-            <div class="info">
 
-              <div class="text green">接入风机</div>
 
-              <div class="value">{{ jczbmap.jrts }}</div>
 
+            <div class="info-item">
 
+              <div class="value">{{ jczbmap.rfdl }}</div>
 
+              <div class="text">日发电量</div>
 
             </div>
 
-          </div>
 
-          <div class="situation">
 
-            <row class="icon-status">
 
-              <div class="status ">
 
-                <span class="svg-icon svg-icon-purple">
 
-                  <svg-icon svgid="svg-standby" />
 
-                </span>
 
-                <span class="text purple">
 
-                  待机
 
-                </span>
 
-              </div>
 
-              <div class="status ">
 
-                <span class="svg-icon svg-icon-green">
 
-                  <svg-icon svgid="svg-normal-power" />
 
-                </span>
 
-                <span class="text green">
 
-                  运行
 
-                </span>
 
-              </div>
 
-              <div class="status ">
 
-                <span class="svg-icon svg-icon-yellow">
 
-                  <svg-icon svgid="svg-limit-power" style="margin:3px 0.3704vh -3px 0;" />
 
-                </span>
 
-                <span class="text yellow">
 
-                  限电
 
-                </span>
 
-              </div>
 
-              <div class="status ">
 
-                <span class="svg-icon svg-icon-red">
 
-                  <svg-icon svgid="svg-gz-downtime" />
 
-                </span>
 
-                <span class="text red">
 
-                  故障
 
-                </span>
 
-              </div>
 
-              <div class="status ">
 
-                <span class="svg-icon svg-icon-orange">
 
-                  <svg-icon svgid="svg-jx-downtime" />
 
-                </span>
 
-                <span class="text orange">
 
-                  检修
 
-                </span>
 
-              </div>
 
-              <div class="status ">
 
-                <span class="svg-icon svg-icon-gray">
 
-                  <svg-icon svgid="svg-offline" />
 
-                </span>
 
-                <span class="text gray">
 
-                  离线
 
-                </span>
 
-              </div>
 
-              <div class="status ">
 
-                <span class="svg-icon svg-icon-darkblue">
 
-                  <svg-icon svgid="svg-intranet-involvement" />
 
-                </span>
 
-                <span class="text darkblue">
 
-                  受限
 
-                </span>
 
-              </div>
 
-            </row>
 
-            <row>
 
-              <div class="status">
 
-                <span class="text gray">
 
-                  待风
 
-                </span>
 
-                <span class="value">
 
-                  {{ jczbmap.djnum }}
 
-                </span>
 
-              </div>
 
-              <div class="status">
 
-                <span class="text gray">
 
-                  正常出力
 
-                </span>
 
-                <span class="value">
 
-                  {{ jczbmap.zcfdnum }}
 
-                </span>
 
-              </div>
 
-              <div class="status">
 
-                <span class="text gray">
 
-                  降出力
 
-                </span>
 
-                <span class="value">
 
-                  {{ jczbmap.xdjclnum }}
 
-                </span>
 
-              </div>
 
-              <div class="status">
 
-                <span class="text gray">
 
-                  故障停机
 
-                </span>
 
-                <span class="value">
 
-                  {{ jczbmap.gztjnum }}
 
-                </span>
 
-              </div>
 
-              <div class="status">
 
-                <span class="text gray">
 
-                  检修停机
 
-                </span>
 
-                <span class="value">
 
-                  {{ jczbmap.jxtjnum }}
 
-                </span>
 
-              </div>
 
-              <div class="status">
 
-                <span class="text gray">
 
-                  电网
 
-                </span>
 
-                <span class="value">
 
-                  {{ jczbmap.dwslnum }}
 
-                </span>
 
+            <div class="info-item">
 
+              <div class="value">{{ jczbmap.yfdl }}</div>
 
+              <div class="text">月发电量</div>
 
+            </div>
 
+            <div class="info-item">
 
+              <div class="value">{{ jczbmap.nfdl }}</div>
 
+              <div class="text">年发电量</div>
 
+            </div>
 
+            <div class="info-item">
 
+              <div class="value">{{ jczbmap.ylyxs }}</div>
 
+              <div class="text">月利用小时</div>
 
+            </div>
 
+            <div class="info-item">
 
+              <div class="value">{{ jczbmap.nlyxs }}</div>
 
+              <div class="text">年利用小时</div>
 
+            </div>
 
+            <div class="info-item">
 
+              <div class="value">{{ jczbmap.ssfs }}</div>
 
+              <div class="text">实时风速</div>
 
+            </div>
 
+            <div class="info-item">
 
+              <div class="value">{{ jczbmap.sjgl }}</div>
 
+              <div class="text">实时功率</div>
 
+            </div>
 
+          </row>
 
+        </panel-3>
 
+        <panel-3 class="wind-running-info">
 
+          <row align="middle">
 
+            <div class="fengji">
 
+              <div class="fengji-icon svg-icon svg-icon-white">
 
+                <svg-icon class="" svgid="svg-风机" />
 
               </div>
 
-              <div class="status">
 
-                <span class="text gray">
 
-                  离线
 
-                </span>
 
-                <span class="value">
 
-                  {{ jczbmap.lxnum }}
 
-                </span>
 
+              <div class="info">
 
+                <div class="text green">接入风机</div>
 
+                <div class="value">{{ jczbmap.jrts }}</div>
 
               </div>
 
-            </row>
 
-          </div>
 
-        </row>
 
-      </panel-3>
 
-    </row>
 
-    <div class="first-info mg-t-16 mg-b-16">
 
-      <div style="flex:0 1 450px;">
 
-        <panel title="场站">
 
-          <station height="18.519vh" />
 
-        </panel>
 
-      </div>
 
-      <div class="mg-l-16" style="flex:1 1 auto;" ref="lineChart">
 
-        <panel title="4小时功率曲线图">
 
-          <multiple-line-chart height="18.519vh" v-if="Powertrend" :list="Powertrend.value" :units="Powertrend.units"
 
-            :showLegend="true" />
 
-        </panel>
 
-      </div>
 
-      <div class="mg-l-16" style="flex:0 0 400px;">
 
-        <panel class="light-matrix-panel">
 
-          <light-matrix :list="fjmap" />
 
-        </panel>
 
+            </div>
 
+            <div class="situation">
 
+              <row class="icon-status">
 
+                <div class="status ">
 
+                  <span class="svg-icon svg-icon-purple">
 
+                    <svg-icon svgid="svg-standby" />
 
+                  </span>
 
+                  <span class="text purple">
 
+                    待机
 
+                  </span>
 
+                </div>
 
+                <div class="status ">
 
+                  <span class="svg-icon svg-icon-green">
 
+                    <svg-icon svgid="svg-normal-power" />
 
+                  </span>
 
+                  <span class="text green">
 
+                    运行
 
+                  </span>
 
+                </div>
 
+                <div class="status ">
 
+                  <span class="svg-icon svg-icon-yellow">
 
+                    <svg-icon svgid="svg-limit-power" style="margin:3px 0.3704vh -3px 0;" />
 
+                  </span>
 
+                  <span class="text yellow">
 
+                    限电
 
+                  </span>
 
+                </div>
 
+                <div class="status ">
 
+                  <span class="svg-icon svg-icon-red">
 
+                    <svg-icon svgid="svg-gz-downtime" />
 
+                  </span>
 
+                  <span class="text red">
 
+                    故障
 
+                  </span>
 
+                </div>
 
+                <div class="status ">
 
+                  <span class="svg-icon svg-icon-orange">
 
+                    <svg-icon svgid="svg-jx-downtime" />
 
+                  </span>
 
+                  <span class="text orange">
 
+                    检修
 
+                  </span>
 
+                </div>
 
+                <div class="status ">
 
+                  <span class="svg-icon svg-icon-gray">
 
+                    <svg-icon svgid="svg-offline" />
 
+                  </span>
 
+                  <span class="text gray">
 
+                    离线
 
+                  </span>
 
+                </div>
 
+                <div class="status ">
 
+                  <span class="svg-icon svg-icon-darkblue">
 
+                    <svg-icon svgid="svg-intranet-involvement" />
 
+                  </span>
 
+                  <span class="text darkblue">
 
+                    受限
 
+                  </span>
 
+                </div>
 
+              </row>
 
+              <row>
 
+                <div class="status">
 
+                  <span class="text gray">
 
+                    待风
 
+                  </span>
 
+                  <span class="value">
 
+                    {{ jczbmap.djnum }}
 
+                  </span>
 
+                </div>
 
+                <div class="status">
 
+                  <span class="text gray">
 
+                    正常出力
 
+                  </span>
 
+                  <span class="value">
 
+                    {{ jczbmap.zcfdnum }}
 
+                  </span>
 
+                </div>
 
+                <div class="status">
 
+                  <span class="text gray">
 
+                    降出力
 
+                  </span>
 
+                  <span class="value">
 
+                    {{ jczbmap.xdjclnum }}
 
+                  </span>
 
+                </div>
 
+                <div class="status">
 
+                  <span class="text gray">
 
+                    故障停机
 
+                  </span>
 
+                  <span class="value">
 
+                    {{ jczbmap.gztjnum }}
 
+                  </span>
 
+                </div>
 
+                <div class="status">
 
+                  <span class="text gray">
 
+                    检修停机
 
+                  </span>
 
+                  <span class="value">
 
+                    {{ jczbmap.jxtjnum }}
 
+                  </span>
 
+                </div>
 
+                <div class="status">
 
+                  <span class="text gray">
 
+                    电网
 
+                  </span>
 
+                  <span class="value">
 
+                    {{ jczbmap.dwslnum }}
 
+                  </span>
 
+                </div>
 
+                <div class="status">
 
+                  <span class="text gray">
 
+                    离线
 
+                  </span>
 
+                  <span class="value">
 
+                    {{ jczbmap.lxnum }}
 
+                  </span>
 
+                </div>
 
+              </row>
 
+            </div>
 
+          </row>
 
+        </panel-3>
 
+      </row>
 
+      <div class="first-info mg-t-16 mg-b-16">
 
+        <div style="flex:0 1 450px;">
 
+          <panel title="场站">
 
+            <station height="18.519vh" />
 
+          </panel>
 
+        </div>
 
+        <div class="mg-l-16" style="flex:1 1 auto;" ref="lineChart">
 
+          <panel title="4小时功率曲线图">
 
+            <multiple-line-chart height="18.519vh" v-if="Powertrend" :list="Powertrend.value" :units="Powertrend.units" :showLegend="true" />
 
+          </panel>
 
+        </div>
 
+        <div class="mg-l-16" style="flex:0 0 400px;">
 
+          <panel class="light-matrix-panel">
 
+            <light-matrix :list="fjmap" />
 
+          </panel>
 
+        </div>
 
       </div>
 
+      <row>
 
+        <Col :span="8">
 
+          <panel title="日度损失电量分析">
 
+            <dual-pie-chart :innerData="pieChartData.dayData" :outerData="pieChartData.dayData" height="21.296vh" />
 
+          </panel>
 
+        </Col>
 
+        <Col :span="8">
 
+          <panel title="月度损失电量分析">
 
+            <dual-pie-chart :innerData="pieChartData.monthData" :outerData="pieChartData.monthData" height="21.296vh" />
 
+          </panel>
 
+        </Col>
 
+        <Col :span="8">
 
+          <panel title="年度损失电量分析">
 
+            <dual-pie-chart :innerData="pieChartData.yearData" :outerData="pieChartData.yearData" height="21.296vh" />
 
+          </panel>
 
+        </Col>
 
+      </row>
 
+      <row>
 
+        <Col :span="8">
 
+          <panel title="日度损失电量分析">
 
+            <hover-bar-chart :list="dayLost" height="21.296vh" />
 
+          </panel>
 
+        </Col>
 
+        <Col :span="8">
 
+          <panel title="日发电量对比">
 
+            <multiple-bar-chart height="21.296vh" :list="CompleteElectricity.data" :units="CompleteElectricity.units" :showLegend="true" />
 
+          </panel>
 
+        </Col>
 
+        <Col :span="8">
 
+          <panel title="月发电量对比">
 
+            <normal-line-chart height="21.296vh" :list="MonthCompare.value" :units="MonthCompare.units" />
 
+          </panel>
 
+        </Col>
 
+      </row>
 
     </div>
 
-    <row>
 
-      <Col :span="8">
 
-      <panel title="日度损失电量分析">
 
-        <dual-pie-chart :innerData="pieChartData.dayData" :outerData="pieChartData.dayData" height="21.296vh" />
 
-      </panel>
 
-      </Col>
 
-      <Col :span="8">
 
-      <panel title="月度损失电量分析">
 
-        <dual-pie-chart :innerData="pieChartData.monthData" :outerData="pieChartData.monthData" height="21.296vh" />
 
-      </panel>
 
-      </Col>
 
-      <Col :span="8">
 
-      <panel title="年度损失电量分析">
 
-        <dual-pie-chart :innerData="pieChartData.yearData" :outerData="pieChartData.yearData" height="21.296vh" />
 
-      </panel>
 
-      </Col>
 
-    </row>
 
-    <row>
 
-      <Col :span="8">
 
-      <panel title="日度损失电量分析">
 
-        <hover-bar-chart :list="dayLost" height="21.296vh" />
 
-      </panel>
 
-      </Col>
 
-      <Col :span="8">
 
-      <panel title="日发电量对比">
 
-        <multiple-bar-chart height="21.296vh" :list="CompleteElectricity.data" :units="CompleteElectricity.units"
 
-          :showLegend="true" />
 
-      </panel>
 
-      </Col>
 
-      <Col :span="8">
 
-      <panel title="月发电量对比">
 
-        <normal-line-chart height="21.296vh" :list="MonthCompare.value" :units="MonthCompare.units" />
 
-      </panel>
 
-      </Col>
 
-    </row>
 
   </div>
 
 </template>
 
 
@@ -256,7 +256,7 @@ export default {
 
   // 使用组件
 
   components: { BtnGroup2, WindSiteWeather, Row, Col, Panel, DualPieChart, MultipleLineChart, Panel3, SvgIcon, HoverBarChart, MultipleBarChart, NormalLineChart, LightMatrix, BtnGroupDouble, Station },
 
   // 数据
 
-  data () {
 
+  data() {
 
     return {
 
       timmer: null, // 计时器
 
       timmer2: null,
 
@@ -351,45 +351,45 @@ export default {
 
   },
 
   // 函数
 
   methods: {
 
-
 
-
 
-    getWp () {
 
+    getWp() {
 
       let that = this;
 
       that.API.requestData({
 
         method: "GET",
 
         subUrl: "powercompare/windfarmAllAjax",
 
-        success (res) {
 
+        success(res) {
 
           console.warn(res);
 
-          let btnGroups = [{
 
-            icon: "svg-wind-site",
 
-            btns: []
 
-          }, {
 
-            icon: "svg-photovoltaic",
 
-            btns: []
 
-          }];
 
+          let btnGroups = [
 
+            {
 
+              icon: "svg-wind-site",
 
+              btns: [],
 
+            },
 
+            {
 
+              icon: "svg-photovoltaic",
 
+              btns: [],
 
+            },
 
+          ];
 
 
           res.data.forEach((ele, index) => {
 
             if (ele.id.indexOf("FDC") !== -1) {
 
               btnGroups[0].btns.push({
 
                 text: ele.name,
 
-                code: ele.id
 
+                code: ele.id,
 
               });
 
             } else {
 
               btnGroups[1].btns.push({
 
                 text: ele.name,
 
-                code: ele.id
 
+                code: ele.id,
 
               });
 
             }
 
           });
 
 
           that.btnGroupsss = btnGroups;
 
           that.renderBtnActiveIndex();
 
-
 
         },
 
       });
 
     },
 
 
-    renderBtnActiveIndex () {
 
+    renderBtnActiveIndex() {
 
       this.btnGroupsss.forEach((pEle, pIndex) => {
 
         pEle.btns.forEach((cEle, cIndex) => {
 
           if (cEle.code === this.wpId) {
 
@@ -400,13 +400,13 @@ export default {
 
       });
 
     },
 
 
-    select (res) {
 
+    select(res) {
 
       this.$router.replace({
 
-        path: `/monitor/windsite/home/${res.code}`
 
+        path: `/monitor/windsite/home/${res.code}`,
 
       });
 
     },
 
     // 根据风机状态码返回对应 class
 
-    getColor (fjzt) {
 
+    getColor(fjzt) {
 
       switch (fjzt) {
 
         case 0:
 
           return "green";
 
@@ -425,7 +425,7 @@ export default {
 
       }
 
     },
 
     // 请求服务
 
-    requestData (showLoading) {
 
+    requestData(showLoading) {
 
       this.requestWpInfo(showLoading);
 
       this.requestLoss(showLoading);
 
       this.requestPower(showLoading);
 
@@ -433,7 +433,7 @@ export default {
 
     },
 
 
     // 获取场站监视数据
 
-    requestWpInfo (showLoading) {
 
+    requestWpInfo(showLoading) {
 
       let that = this;
 
       that.API.requestData({
 
         showLoading,
 
@@ -442,7 +442,8 @@ export default {
 
         data: {
 
           wpId: that.wpId,
 
         },
 
-        success (res) {
 
+        success(res) {
 
+          console.log(123, res);
 
           if (res.data) {
 
             that.tqmap = res.data.tqmap;
 
             let fjmap = [];
 
@@ -538,7 +539,7 @@ export default {
 
             keys.forEach((key, keyIndex) => {
 
               res.data.glvos.forEach((ele) => {
 
                 Powertrend.value[keyIndex].value.push({
 
-                  text: new Date().formatDate("hh:mm"),
 
+                  text: new Date(ele.time).formatDate("hh:mm"),
 
                   value: ele[key],
 
                 });
 
               });
 
@@ -587,7 +588,7 @@ export default {
 
     },
 
 
     // 获取日度损失电量分析
 
-    requestLoss (showLoading) {
 
+    requestLoss(showLoading) {
 
       let that = this;
 
       that.API.requestData({
 
         showLoading,
 
@@ -596,7 +597,7 @@ export default {
 
         data: {
 
           wpId: that.wpId,
 
         },
 
-        success (res) {
 
+        success(res) {
 
           let dayLost = [];
 
           res.data.forEach((ele) => {
 
             dayLost.push({
 
@@ -610,7 +611,7 @@ export default {
 
     },
 
 
     // 获取完成电量
 
-    requestPower (showLoading) {
 
+    requestPower(showLoading) {
 
       let that = this;
 
       that.API.requestData({
 
         showLoading,
 
@@ -619,7 +620,7 @@ export default {
 
         data: {
 
           wpId: that.wpId,
 
         },
 
-        success (res) {
 
+        success(res) {
 
           let data = [
 
             {
 
               title: "发电量",
 
@@ -650,7 +651,7 @@ export default {
 
     },
 
 
     // 获取月发电量对比
 
-    requestMonthPower (showLoading) {
 
+    requestMonthPower(showLoading) {
 
       let that = this;
 
       that.API.requestData({
 
         showLoading,
 
@@ -659,7 +660,7 @@ export default {
 
         data: {
 
           wpId: that.wpId,
 
         },
 
-        success (res) {
 
+        success(res) {
 
           let data = [
 
             {
 
               title: "月发电量",
 
@@ -690,7 +691,7 @@ export default {
 
     },
 
   },
 
 
-  created () {
 
+  created() {
 
     let that = this;
 
     that.wpId = that.$route.params.wpId;
 
     that.$nextTick(() => {
 
@@ -705,24 +706,23 @@ export default {
 
     });
 
   },
 
 
-  mounted () { },
 
+  mounted() {},
 
 
-  unmounted () {
 
+  unmounted() {
 
     clearInterval(this.timmer);
 
     clearInterval(this.timmer2);
 
     this.timmer = null;
 
     this.timmer2 = null;
 
   },
 
   watch: {
 
-    "$route" (res) {
 
-      console.warn('router变化');
 
+    $route(res) {
 
+      console.warn("router变化");
 
       this.wpId = res.params.wpId;
 
       this.requestData(false);
 
       this.renderBtnActiveIndex();
 
-    }
 
-  }
 
+    },
 
+  },
 
 };
 
-
 
 </script>
 
 
 <style lang="less">

+ 5 - 3
src/views/WindSite/pages/Info/Warning.vue
查看文件 

@@ -222,12 +222,14 @@ export default {
 
           text-align: center;
 
           border: 1px solid @darkgray;
 
           margin-right: 0.37vh;
 
+          height: 28px;
 
           line-height: 28px;
 
         }
 
 
         .text {
 
           flex: 1 0 auto;
 
           border: 1px solid @darkgray;
 
+          height: 28px;
 
           line-height: 28px;
 
           padding: 0 8px;
 
         }
 
@@ -270,12 +272,12 @@ export default {
 
     }
 
 
     thead tr th {
 
-      padding: 8px 0;
 
-      font-size: 14px;
 
+      padding: 0;
 
+      font-size: 12px;
 
     }
 
 
     tbody {
 
-      height: 54vh;
 
+      height: 56vh;
 
     }
 
   }
 
 }

+ 424 - 13
src/views/WindSite/pages/Map1.vue
查看文件 

@@ -58,13 +58,144 @@
 
         </div>
 
         <div class="panel-body">
 
             <arcgis @when="when" ref="arcgis" :data="arcgisData" @clickMap="clickMap">
 
-                <template v-slot:test>
 
+                <template v-slot:content>
 
                     <div class="panel-box">
 
-                        <!-- <div class="panel-item" v-for="index of 80" :key="index"></div> -->
 
-                        <img :src="tempImg" style="width: 800px; height: 700px;">
 
+                        <div class="panel-item" :class="panel.line" v-for="(panel, index) of panels" :key="index">
 
+                            <svg v-show="panel.type != 'none' && panel.type != 'syz'" viewBox="0 0 800 800" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
 
+                                xml:space="preserve">
 
+                                <defs>
 
+                                    <rect id="fill-rect" x="5" y="5" rx="8" ry="8" width="90" height="340" fill="#303B6F" />
 
+                                    <rect id="none-rect" x="5" y="5" rx="8" ry="8" width="90" height="120" fill="#303B6F" />
 
+                                    <g id="panel-deepblue">
 
+                                        <polygon fill="#FFFFFF"
 
+                                            points="300 13.73 60.07 13.73 60.07 13.73 22.48 13.73 0 109.84 0 109.84 0 109.84 0 109.84 0 109.84 22.48 205.95 272.88 205.95 272.88 205.61 300 205.61 300 13.73" />
 
+                                        <polygon fill="#5C9BAF" 
+                                            points="250.4 109.84 3.26 109.84 29 0 276.14 0 250.4 109.84" />
 
+                                        <polygon fill="#00486B"
 
+                                            points="29 219.68 276.14 219.68 250.4 109.84 3.26 109.84 29 219.68" />
 
+                                    </g>
 
+                                    <g id="panel-blue">
 
+                                        <polygon fill="#FFFFFF"
 
+                                            points="300 13.73 60.07 13.73 60.07 13.73 22.48 13.73 0 109.84 0 109.84 0 109.84 0 109.84 0 109.84 22.48 205.95 272.88 205.95 272.88 205.61 300 205.61 300 13.73" />
 
+                                        <polygon fill="#23ABFF" 
+                                            points="250.4 109.84 3.26 109.84 29 0 276.14 0 250.4 109.84" />
 
+                                        <polygon fill="#0E6BBB"
 
+                                            points="29 219.68 276.14 219.68 250.4 109.84 3.26 109.84 29 219.68" />
 
+                                    </g>
 
+                                    <g id="panel-red">
 
+                                        <polygon fill="#FFFFFF"
 
+                                            points="290 13.27 58.07 13.27 58.07 13.27 21.73 13.27 0 106.18 0 106.18 0 106.18 0 106.18 0 106.18 21.73 199.09 263.79 199.09 263.79 198.75 290 198.75 290 13.27" />
 
+                                        <polygon fill="#EC1208" 
+                                            points="242.05 106.18 3.15 106.18 28.04 0 266.94 0 242.05 106.18" />
 
+                                        <polygon fill="#AA0607"
 
+                                            points="28.04 212.36 266.94 212.36 242.05 106.18 3.15 106.18 28.04 212.36" />
 
+                                    </g>
 
+                                </defs>
 
+                                <!-- 底图 左右两列矩形 -->
 
+                                <g>
 
+                                    <use xlink:href="#fill-rect" x="50" y="50" />
 
+                                    <use xlink:href="#fill-rect" x="150" y="50" />
 
+                                    <use xlink:href="#fill-rect" x="550" y="50" />
 
+                                    <use xlink:href="#fill-rect" x="650" y="50" />
 
+                                    <use xlink:href="#fill-rect" x="50" y="400" />
 
+                                    <use xlink:href="#fill-rect" x="150" y="400" />
 
+                                    <use xlink:href="#fill-rect" x="550" y="400" />
 
+                                    <use xlink:href="#fill-rect" x="650" y="400" />
 
+                                </g>
 
+
 
+                                <!-- 中间上矩形 全部 -->
 
+                                <g :style="'display: ' + (panel.type == 'fill' || panel.type == 'bottom' ? 'block' : 'none')">
 
+                                    <use xlink:href="#fill-rect" x="250" y="50" />
 
+                                    <use xlink:href="#fill-rect" x="350" y="50" />
 
+                                    <use xlink:href="#fill-rect" x="450" y="50" />
 
+                                </g>
 
+
 
+                                <!-- 中间上矩形 一半 -->
 
+                                <g :style="'display: ' + (panel.type == 'top' ? 'block' : 'none')">
 
+                                    <use xlink:href="#none-rect" x="250" y="270" />
 
+                                    <use xlink:href="#none-rect" x="350" y="270" />
 
+                                    <use xlink:href="#none-rect" x="450" y="270" />
 
+                                </g>
 
+
 
+                                <!-- 中间上逆变器 深蓝色 -->
 
+                                <g :style="'display: ' + (panel.type == 'top' && panel.state == 'deepblue' ? 'block' : 'none')" class="can-click esri-component" @click.prevent="clickEl(panel)">
 
+                                    <use xlink:href="#panel-deepblue" x="250" y="50" />
 
+                                </g>
 
+
 
+                                <!-- 中间上逆变器 蓝色 -->
 
+                                <g :style="'display: ' + (panel.type == 'top' && panel.state == 'blue' ? 'block' : 'none')" class="can-click esri-component" @click.prevent="clickEl(panel)">
 
+                                    <use xlink:href="#panel-blue" x="250" y="50" />
 
+                                </g>
 
+
 
+                                <!-- 中间上逆变器 红色 -->
 
+                                <g :style="'display: ' + (panel.type == 'top' && panel.state == 'red' ? 'block' : 'none')" class="can-click esri-component" @click.prevent="clickEl(panel)">
 
+                                    <use xlink:href="#panel-red" x="250" y="50" />
 
+                                </g>
 
+
 
+                                <!-- 中间上文字 -->
 
+                                <g :style="'display: ' + (panel.type == 'top' ? 'block' : 'none')" class="can-click esri-component" @click.prevent="clickEl(panel)">
 
+                                    <text x="420" y="220" fill="#ffffff" font-size="150" text-anchor="middle" transform="rotate(-90 400 180)">{{panel.code}}</text>
 
+                                </g>
 
+
 
+                                <!-- 中间下矩形 全部 -->
 
+                                <g :style="'display: ' + (panel.type == 'fill' || panel.type == 'top' ? 'block' : 'none')">
 
+                                    <use xlink:href="#fill-rect" x="250" y="400" />
 
+                                    <use xlink:href="#fill-rect" x="350" y="400" />
 
+                                    <use xlink:href="#fill-rect" x="450" y="400" />
 
+                                </g>
 
+
 
+                                <!-- 中间下矩形 一半 -->
 
+                                <g :style="'display: ' + (panel.type == 'bottom' ? 'block' : 'none')">
 
+                                    <use xlink:href="#none-rect" x="250" y="400" />
 
+                                    <use xlink:href="#none-rect" x="350" y="400" />
 
+                                    <use xlink:href="#none-rect" x="450" y="400" />
 
+                                </g>
 
+
 
+                                <!-- 中间下逆变器 深蓝色 -->
 
+                                <g :style="'display: ' + (panel.type == 'bottom' && panel.state == 'deepblue' ? 'block' : 'none')" class="can-click esri-component" @click.prevent="clickEl(panel)">
 
+                                    <use xlink:href="#panel-deepblue" x="250" y="530" />
 
+                                </g>
 
+
 
+                                <!-- 中间下逆变器 蓝色 -->
 
+                                <g :style="'display: ' + (panel.type == 'bottom' && panel.state == 'blue' ? 'block' : 'none')" class="can-click esri-component" @click.prevent="clickEl(panel)">
 
+                                    <use xlink:href="#panel-blue" x="250" y="530" />
 
+                                </g>
 
+
 
+                                <!-- 中间下逆变器 红色 -->
 
+                                <g :style="'display: ' + (panel.type == 'bottom' && panel.state == 'red' ? 'block' : 'none')" class="can-click esri-component" @click.prevent="clickEl(panel)">
 
+                                    <use xlink:href="#panel-red" x="250" y="530" />
 
+                                </g>
 
+
 
+                                <!-- 中间下文字 -->
 
+                                <g :style="'display: ' + (panel.type == 'bottom' ? 'block' : 'none')" class="can-click" @click.prevent="clickEl(panel)">
 
+                                    <text x="460" y="740" fill="#ffffff" font-size="150" text-anchor="middle"  transform="rotate(-90 400 700)">{{panel.code}}</text>
 
+                                </g>
 
+                            </svg>
 
+                            <div v-show="panel.type == 'syz'" class="panel-syz">
 
+                                <img :src="syzImg" class="syz-img">
 
+                                <div class="syz-text">升压站</div>
 
+                            </div>
 
+                        </div>
 
+                        <!-- <img :src="tempImg" style="width: 800px; height: 700px;"> -->
 
                     </div>
 
                 </template>
 
             </arcgis>
 
+            <div class="map-popup-panel" v-show="showPopup">
 
+                <div class="map-popup-panel-header">
 
+                    <div class="map-popup-panel-title green">
 
+                        某某风电场总貌<span></span>
 
+                    </div>
 
+                    <div class="map-popup-panel-date gray">2020年5月10日</div>
 
+                    <div class="map-popup-panel-back" @click="popupBack">
 
+                        <span class="svg-icon svg-icon-white svg-icon-sm">
 
+                            <SvgIcon svgid="svg-arrow-dpwn-1"></SvgIcon>
 
+                        </span>
 
+                    </div>
 
+                </div>
 
+                <div class="map-popup-panel-body">
 
+                    
+                </div>
 
+            </div>
 
         </div>
 
     </div>
 
 </template>
 
@@ -137,23 +268,122 @@ export default {
 
             arcgisData: {
 
                 mode: "2D", // 模式 2D 3D
 
                 title: "宁夏地图", // 标题
 
-                center: [106.60768412800003, 37.806672373000006], // 初始中心点
 
+                center: [106.48638888888888, 38.924166666666665], // 初始中心点
 
                 height: 654, // 3D地图初始相机高度
 
                 tilt: 65, // 俯视角
 
                 scale: 15000,
 
+                rotation: 180,
 
             },
 
             tempImg: require("@assets/temp1.png"),
 
+            syzImg: require("@assets/png/booster-station.png"),
 
+            showPopup: true,
 
+            panels: [ // fill top bottom none syz // red blue deepblue
 
+                { id: "00", type: "fill", code: "", state: "", line: "" },
 
+                { id: "01", type: "fill", code: "", state: "", line: "" },
 
+                { id: "02", type: "fill", code: "", state: "", line: "" },
 
+                { id: "03", type: "fill", code: "", state: "", line: "" },
 
+                { id: "04", type: "fill", code: "", state: "", line: "" },
 
+                { id: "05", type: "fill", code: "", state: "", line: "" },
 
+                { id: "06", type: "bottom", code: "12", state: "deepblue", line: "bottom" },
 
+                { id: "07", type: "none", code: "", state: "", line: "bottom" },
 
+                { id: "08", type: "fill", code: "", state: "", line: "" },
 
+                { id: "09", type: "fill", code: "", state: "", line: "" },
 
+
 
+                { id: "10", type: "top", code: "36", state: "deepblue", line: "top left" },
 
+                { id: "11", type: "top", code: "32", state: "deepblue", line: "top left" },
 
+                { id: "12", type: "top", code: "28", state: "deepblue", line: "top" },
 
+                { id: "13", type: "top", code: "24", state: "deepblue", line: "top" },
 
+                { id: "14", type: "top", code: "20", state: "deepblue", line: "top" },
 
+                { id: "15", type: "top", code: "16", state: "deepblue", line: "top right" },
 
+                { id: "16", type: "fill", code: "", state: "", line: "bottom right" },
 
+                { id: "17", type: "syz", code: "", state: "", line: "bottom right" },
 
+                { id: "18", type: "top", code: "5", state: "deepblue", line: "top" },
 
+                { id: "19", type: "top", code: "4", state: "deepblue", line: "top right" },
 
+
 
+                { id: "20", type: "bottom", code: "37", state: "deepblue", line: "bottom left" },
 
+                { id: "21", type: "fill", code: "", state: "deepblue", line: "left" },
 
+                { id: "22", type: "fill", code: "", state: "deepblue", line: "" },
 
+                { id: "23", type: "fill", code: "", state: "deepblue", line: "" },
 
+                { id: "24", type: "fill", code: "", state: "deepblue", line: "" },
 
+                { id: "25", type: "fill", code: "", state: "deepblue", line: "" },
 
+                { id: "26", type: "bottom", code: "13", state: "deepblue", line: "bottom" },
 
+                { id: "27", type: "fill", code: "", state: "", line: "" },
 
+                { id: "28", type: "fill", code: "", state: "deepblue", line: "" },
 
+                { id: "29", type: "fill", code: "", state: "deepblue", line: "right" },
 
+
 
+                { id: "30", type: "none", code: "", state: "", line: "" },
 
+                { id: "31", type: "top", code: "33", state: "deepblue", line: "top" },
 
+                { id: "32", type: "top", code: "29", state: "deepblue", line: "top" },
 
+                { id: "33", type: "top", code: "25", state: "deepblue", line: "top" },
 
+                { id: "34", type: "top", code: "21", state: "deepblue", line: "top" },
 
+                { id: "35", type: "top", code: "17", state: "deepblue", line: "top right" },
 
+                { id: "36", type: "fill", code: "", state: "deepblue", line: "" },
 
+                { id: "37", type: "top", code: "1", state: "deepblue", line: "top" },
 
+                { id: "38", type: "top", code: "2", state: "deepblue", line: "top" },
 
+                { id: "39", type: "top", code: "3", state: "deepblue", line: "top" },
 
+
 
+                { id: "40", type: "none", code: "", state: "", line: "" },
 
+                { id: "41", type: "fill", code: "", state: "", line: "" },
 
+                { id: "42", type: "fill", code: "", state: "", line: "" },
 
+                { id: "43", type: "fill", code: "", state: "", line: "" },
 
+                { id: "44", type: "fill", code: "", state: "", line: "" },
 
+                { id: "45", type: "fill", code: "", state: "", line: "" },
 
+                { id: "46", type: "bottom", code: "14", state: "deepblue", line: "bottom left" },
 
+                { id: "47", type: "bottom", code: "10", state: "deepblue", line: "bottom" },
 
+                { id: "48", type: "bottom", code: "8", state: "deepblue", line: "bottom" },
 
+                { id: "49", type: "bottom", code: "6", state: "deepblue", line: "bottom" },
 
+
 
+                { id: "50", type: "none", code: "", state: "", line: "" },
 
+                { id: "51", type: "top", code: "34", state: "red", line: "top left" },
 
+                { id: "52", type: "top", code: "30", state: "deepblue", line: "top" },
 
+                { id: "53", type: "top", code: "26", state: "deepblue", line: "top" },
 
+                { id: "54", type: "top", code: "22", state: "deepblue", line: "top" },
 
+                { id: "55", type: "top", code: "18", state: "deepblue", line: "top" },
 
+                { id: "56", type: "fill", code: "", state: "", line: "" },
 
+                { id: "57", type: "fill", code: "", state: "", line: "" },
 
+                { id: "58", type: "fill", code: "", state: "", line: "" },
 
+                { id: "59", type: "fill", code: "", state: "", line: "right" },
 
+
 
+                { id: "60", type: "none", code: "", state: "", line: "" },
 
+                { id: "61", type: "fill", code: "", state: "", line: "left" },
 
+                { id: "62", type: "fill", code: "", state: "", line: "" },
 
+                { id: "63", type: "fill", code: "", state: "", line: "" },
 
+                { id: "64", type: "fill", code: "", state: "", line: "" },
 
+                { id: "65", type: "fill", code: "", state: "", line: "" },
 
+                { id: "66", type: "bottom", code: "15", state: "deepblue", line: "bottom" },
 
+                { id: "67", type: "bottom", code: "11", state: "deepblue", line: "bottom" },
 
+                { id: "68", type: "bottom", code: "9", state: "deepblue", line: "bottom" },
 
+                { id: "69", type: "bottom", code: "7", state: "deepblue", line: "bottom right" },
 
+
 
+                { id: "70", type: "none", code: "", state: "", line: "" },
 
+                { id: "71", type: "top", code: "35", state: "blue", line: "top" },
 
+                { id: "72", type: "top", code: "31", state: "deepblue", line: "top" },
 
+                { id: "73", type: "top", code: "27", state: "deepblue", line: "top" },
 
+                { id: "74", type: "top", code: "23", state: "deepblue", line: "top" },
 
+                { id: "75", type: "top", code: "19", state: "deepblue", line: "top" },
 
+                { id: "76", type: "fill", code: "", state: "", line: "" },
 
+                { id: "77", type: "fill", code: "", state: "", line: "" },
 
+                { id: "78", type: "fill", code: "", state: "", line: "" },
 
+                { id: "79", type: "fill", code: "", state: "", line: "" },
 
+            ],
 
         };
 
     },
 
     // 函数
 
     methods: {
 
         when: function () {
 
         //    this.$refs.arcgis.addImagePoint([106.60768412800003, 37.806672373000006], "@assets/temp1.png", "160px", "140px");
 
-           this.$refs.arcgis.addHtmlPoint([106.60768412800003, 37.806672373000006], "test",  400, 350);
 
+           this.$refs.arcgis.addHtmlPoint([106.48638888888888, 38.924166666666665], "content",  400, 350);
 
         },
 
         clickMap: function (info) {
 
             console.log(info)
 
         },
 
+        popupBack: function () {
 
+            this.showPopup = false;
 
+        },
 
+        clickEl: function (item) {
 
+            console.log(item);
 
+            this.showPopup = true;
 
+        },
 
     },
 
     // 生命周期钩子
 
     beforeCreate() {
 
@@ -177,7 +407,7 @@ export default {
 
 };
 
 </script>
 
 
-<style lang="less" scoped>
 
+<style lang="less">
 
 @titleHeight: 3.704vh;
 
 
 .map-1 {
 
@@ -341,19 +571,200 @@ export default {
 
     }
 
 
     .panel-box {
 
-        width: 800px;
 
+        width: 840px;
 
+        padding: 20px;
 
         display: flex;
 
         flex-wrap: wrap;
 
+        background: #536268B8;
 
 
         .panel-item {
 
-            width: 100px;
 
-            height: 100px;
 
-            padding: 20px;
 
-            background: #536268B8;
 
-            margin-top: -20px;
 
-            margin-left: -20px;
 
+            width: 80px;
 
+            height: 80px;
 
+            position: relative;
 
+            
+            // margin-top: -20px;
 
+            // margin-left: -20px;
 
+
 
+            &.top {
 
+                &::after {
 
+                    top: -3px;
 
+                    opacity: 1;
 
+                }
 
+            }
 
+
 
+            &.bottom {
 
+                &::after {
 
+                    bottom: -3px;
 
+                    opacity: 1;
 
+                }
 
+            }
 
+
 
+            &.left {
 
+                &::before {
 
+                    left: -3px;
 
+                    opacity: 1;
 
+                }
 
+            }
 
+
 
+            &.right {
 
+                &::before {
 
+                    right: -3px;
 
+                    opacity: 1;
 
+                }
 
+            }
 
+
 
+            &::after {
 
+                content: '';
 
+                width: 100%;
 
+                height: 6px;
 
+                position: absolute;
 
+                left: 0;
 
+                background: @green;
 
+                opacity: 0;
 
+            }
 
+
 
+            &::before {
 
+                content: '';
 
+                width: 6px;
 
+                height: 100%;
 
+                position: absolute;
 
+                top: 0;
 
+                background: @green;
 
+                opacity: 0;
 
+            }
 
+
 
+            svg {
 
+                width: 80px;
 
+                height: 80px;
 
+            }
 
+
 
+            .panel-syz {
 
+                width: 100%;
 
+                height: 100%;
 
+                position: relative;
 
+
 
+                .syz-img {
 
+                    position: absolute;
 
+                    height: 70px;
 
+                    top: -35px;
 
+                    left: -10px;
 
+                }
 
+
 
+                .syz-text {
 
+                    position: absolute;
 
+                    color: @green;
 
+                    font-size: @fontsize-l;
 
+                    width: 100%;
 
+                    text-align: center;
 
+                    left: 0;
 
+                    top: -55px;
 
+                    font-weight: bold;
 
+                }
 
+            }
 
+        }
 
+
 
+    }
 
+
 
+    .can-click {
 
+        cursor: pointer;
 
+    }
 
+
 
+    .map-popup-panel {
 
+        width: 760px;
 
+        position: absolute;
 
+        left: 71px;
 
+        top: 22px;
 
+        z-index: 2;
 
+
 
+        .map-popup-panel-header {
 
+            width: 100%;
 
+            background: fade(#152221, 90%);
 
+            display: flex;
 
+
 
+            .map-popup-panel-title {
 
+                padding: 17px 24px;
 
+                font-size: @fontsize-s;
 
+                position: relative;
 
+
 
+                &::before,
 
+                &::after {
 
+                    position: absolute;
 
+                    width: calc(50% - 6px);
 
+                    bottom: 0;
 
+                    border-bottom: 2px solid @green;
 
+                }
 
+
 
+                &::before {
 
+                    content: "";
 
+                    left: 0;
 
+                }
 
+
 
+                &::after {
 
+                    content: "";
 
+                    right: 0;
 
+                }
 
+
 
+                span {
 
+                    position: absolute;
 
+                    width: 11.3px;
 
+                    height: 11.3px;
 
+                    border-left: 2px solid @green;
 
+                    border-top: 2px solid @green;
 
+                    left: calc(50% - 5.65px);
 
+                    bottom: -3px;
 
+                    transform: rotate(45deg);
 
+                }
 
+            }
 
+
 
+            .map-popup-panel-date {
 
+                flex-grow: 1;
 
+                padding: 17px 24px;
 
+                font-size: @fontsize-s;
 
+                text-align: right;
 
+                border-bottom: 2px solid @green;
 
+            }
 
+
 
+            .map-popup-panel-back {
 
+                margin-left: auto;
 
+                width: 54px;
 
+                display: flex;
 
+                align-items: center;
 
+                justify-content: center;
 
+                position: relative;
 
+                cursor: pointer;
 
+
 
+                &::after {
 
+                    content: "";
 
+                    position: absolute;
 
+                    left: 0;
 
+                    height: 50%;
 
+                    border-left: 1px solid @gray;
 
+                    top: 25%;
 
+                }
 
+            }
 
         }
 
 
+        .map-popup-panel-body {
 
+            background: fade(#152221, 75%);
 
+            border: 1px solid fade(@darkgray, 40);
 
+            border-top: 0px;
 
+
 
+            .table-form {
 
+                .text,
 
+                .unit {
 
+                    font-weight: 400;
 
+                }
 
+
 
+                .unit {
 
+                    min-width: auto;
 
+                }
 
+
 
+                .value,
 
+                .unit {
 
+                    text-align: left;
 
+                }
 
+            }
 
+        }
 
     }
 
 }
 
 </style>

+ 28 - 27
src/views/WindSite/pages/Matrix.vue
查看文件 

@@ -48,10 +48,10 @@ export default {
 
   // 使用组件
 
   components: {
 
     BtnGroup2,
 
-    SvgIcon
 
+    SvgIcon,
 
   },
 
 
-  data () {
 
+  data() {
 
     return {
 
       timmer: null, // 计时器
 
       wpId: "",
 
@@ -98,7 +98,7 @@ export default {
 
   },
 
 
   methods: {
 
-    getColor (fjzt) {
 
+    getColor(fjzt) {
 
       switch (fjzt) {
 
         case 0:
 
           return "green";
 
@@ -125,7 +125,7 @@ export default {
 
     },
 
 
     // 请求服务
 
-    requestData (showLoading) {
 
+    requestData(showLoading) {
 
       let that = this;
 
       that.API.requestData({
 
         showLoading,
 
@@ -134,7 +134,7 @@ export default {
 
         data: {
 
           wpId: that.wpId,
 
         },
 
-        success (res) {
 
+        success(res) {
 
           if (res.data) {
 
             let sourceMap = res.data;
 
             for (let key in sourceMap) {
 
@@ -157,43 +157,44 @@ export default {
 
       });
 
     },
 
 
-    getWp () {
 
+    getWp() {
 
       let that = this;
 
       that.API.requestData({
 
         method: "GET",
 
         subUrl: "powercompare/windfarmAllAjax",
 
-        success (res) {
 
-
 
-          let btnGroups = [{
 
-            icon: "fa fa-fire",
 
-            btns: []
 
-          }, {
 
-            icon: "fa fa-fire-extinguisher",
 
-            btns: []
 
-          }];
 
+        success(res) {
 
+          let btnGroups = [
 
+            {
 
+              icon: "fa fa-fire",
 
+              btns: [],
 
+            },
 
+            {
 
+              icon: "fa fa-fire-extinguisher",
 
+              btns: [],
 
+            },
 
+          ];
 
 
           res.data.forEach((ele, index) => {
 
             if (ele.id.indexOf("FDC") !== -1) {
 
               btnGroups[0].btns.push({
 
                 text: ele.name,
 
-                code: ele.id
 
+                code: ele.id,
 
               });
 
             } else {
 
               btnGroups[1].btns.push({
 
                 text: ele.name,
 
-                code: ele.id
 
+                code: ele.id,
 
               });
 
             }
 
           });
 
 
           that.btnGroups = btnGroups;
 
           that.renderBtnActiveIndex();
 
-
 
         },
 
       });
 
     },
 
 
-    renderBtnActiveIndex () {
 
+    renderBtnActiveIndex() {
 
       this.btnGroups.forEach((pEle, pIndex) => {
 
         pEle.btns.forEach((cEle, cIndex) => {
 
           if (cEle.code === this.wpId) {
 
@@ -204,14 +205,14 @@ export default {
 
       });
 
     },
 
 
-    select (res) {
 
+    select(res) {
 
       this.$router.replace({
 
-        path: `/monitor/windsite/matrix/${res.code}`
 
+        path: `/monitor/windsite/matrix/${res.code}`,
 
       });
 
     },
 
   },
 
 
-  created () {
 
+  created() {
 
     let that = this;
 
     that.wpId = that.$route.params.wpId;
 
     that.$nextTick(() => {
 
@@ -223,20 +224,20 @@ export default {
 
     });
 
   },
 
 
-  mounted () { },
 
+  mounted() {},
 
 
-  unmounted () {
 
+  unmounted() {
 
     clearInterval(this.timmer);
 
     this.timmer = null;
 
   },
 
 
   watch: {
 
-    "$route" (res) {
 
+    $route(res) {
 
       this.wpId = res.params.wpId;
 
       this.requestData(false);
 
       this.renderBtnActiveIndex();
 
-    }
 
-  }
 
+    },
 
+  },
 
 };
 
 </script>

+ 8 - 8
src/views/layout/Header.vue
查看文件 

@@ -20,7 +20,7 @@
 
 </template>
 
 <script>
 
 export default {
 
-  data () {
 
+  data() {
 
     return {
 
       menus: [
 
         {
 
@@ -85,25 +85,25 @@ export default {
 
     };
 
   },
 
   methods: {
 
-    click (index, data) {
 
+    click(index, data) {
 
       this.activeIndex = index;
 
       this.$router.push(data.path);
 
     },
 
-    clickSubMenu (index, code) {
 
+    clickSubMenu(index, code) {
 
       console.log(index, code);
 
     },
 
-    clickMenu () {
 
+    clickMenu() {
 
       this.dropdown = !this.dropdown;
 
     },
 
   },
 
   computed: {
 
-    activeClass (data) {
 
+    activeClass(data) {
 
       return data.isActive ? "active" : "";
 
     },
 
   },
 
   watch: {
 
     $route: {
 
-      handler: function (val, oldVal) {
 
+      handler: function(val, oldVal) {
 
         this.menus.some((t, index) => {
 
           if (val.path.includes(t.id)) {
 
             this.activeIndex = index;
 
@@ -151,7 +151,7 @@ export default {
 
         transition: color 0.2s ease-in-out;
 
 
         &::after {
 
-          content: '';
 
+          content: "";
 
           position: absolute;
 
           width: 100%;
 
           height: 0.463vh;
 
@@ -208,7 +208,7 @@ export default {
 
         background-color: fade(@write, 5%);
 
 
         &::after {
 
-          content: '';
 
+          content: "";
 
           position: absolute;
 
           width: 100%;
 
           height: 0.463vh;

+ 38 - 40
src/views/layout/Menu.vue
查看文件 

@@ -1,8 +1,7 @@
 
 <template>
 
   <div class="menu">
 
     <ul class="menu-list">
 
-      <li class="menu-item" v-for="(menu, index) of currentMenu" :key="menu" @click="click(index)" :class="{ active: activeIndex == index }"
 
-        @mouseenter="subMenuShow(menu.children, index)">
 
+      <li class="menu-item" v-for="(menu, index) of currentMenu" :key="menu" @click="click(index)" :class="{ active: activeIndex == index }" @mouseenter="subMenuShow(menu.children, index)">
 
         <router-link v-if="!menu.children" :to="menu.path">
 
           <el-tooltip class="item" effect="dark" :content="menu.text" placement="right" :show-after="500">
 
             <div class="menu-icon svg-icon" :class="activeIndex == index ? 'svg-icon-green' : 'svg-icon-gray'">
 
@@ -38,7 +37,7 @@ export default {
 
     SvgIcon,
 
   },
 
   props: {},
 
-  data () {
 
+  data() {
 
     return {
 
       currRoot: "monitor",
 
       menuData: [
 
@@ -100,14 +99,14 @@ export default {
 
                 {
 
                   text: "测点数据查询",
 
                   icon: "svg-wind-site",
 
-                  path: "/realSearch"
 
+                  path: "/realSearch",
 
                 },
 
                 {
 
                   text: "测点历史数据查询",
 
                   icon: "svg-wind-site",
 
-                  path: "/historySearch"
 
-                }
 
-              ]
 
+                  path: "/historySearch",
 
+                },
 
+              ],
 
             },
 
             {
 
               text: "预警记录",
 
@@ -117,10 +116,10 @@ export default {
 
                 {
 
                   text: "预警管理",
 
                   icon: "svg-wind-site",
 
-                  path: "/new/alarmcenter"
 
-                }
 
-              ]
 
-            }
 
+                  path: "/new/alarmcenter",
 
+                },
 
+              ],
 
+            },
 
           ],
 
         },
 
         {
 
@@ -166,8 +165,8 @@ export default {
 
                   text: "单机饱和度",
 
                   icon: "svg-wind-site",
 
                   path: "/wtSaturability",
 
-                }
 
-              ]
 
+                },
 
+              ],
 
             },
 
             {
 
               text: "风光资源分析",
 
@@ -178,8 +177,8 @@ export default {
 
                   text: "风资源分析",
 
                   icon: "svg-wind-site",
 
                   path: "/windAnalysis",
 
-                }
 
-              ]
 
+                },
 
+              ],
 
             },
 
             // {
 
             //   text: "单机分析",
 
@@ -246,7 +245,6 @@ export default {
 
                 },
 
               ],
 
             },
 
-
 
           ],
 
         },
 
         {
 
@@ -312,32 +310,32 @@ export default {
 
                   text: "报警排行",
 
                   icon: "svg-wind-site",
 
                   path: "/warningRank",
 
-                }
 
-              ]
 
+                },
 
+              ],
 
             },
 
             // 三率管理
 
             {
 
-              text: '三率管理',
 
-              icon: 'svg-matrix',
 
-              path: '/slgl',
 
+              text: "三率管理",
 
+              icon: "svg-matrix",
 
+              path: "/slgl",
 
               children: [
 
                 {
 
-                  text: '复位及时率',
 
-                  icon: 'svg-wind-site',
 
-                  path: '/fwjsl'
 
+                  text: "复位及时率",
 
+                  icon: "svg-wind-site",
 
+                  path: "/fwjsl",
 
                 },
 
                 {
 
-                  text: '状态转换率',
 
-                  icon: 'svg-wind-site',
 
-                  path: '/ztzhl'
 
+                  text: "状态转换率",
 
+                  icon: "svg-wind-site",
 
+                  path: "/ztzhl",
 
                 },
 
                 {
 
-                  text: '消缺及时率',
 
-                  icon: 'svg-wind-site',
 
-                  path: '/xqjsl'
 
-                }
 
-              ]
 
-            }
 
+                  text: "消缺及时率",
 
+                  icon: "svg-wind-site",
 
+                  path: "/xqjsl",
 
+                },
 
+              ],
 
+            },
 
           ],
 
         },
 
         {
 
@@ -378,7 +376,7 @@ export default {
 
               text: "作业指导知识",
 
               icon: "svg-matrix",
 
               path: "/knowledge4",
 
-            }
 
+            },
 
           ],
 
         },
 
         {
 
@@ -395,11 +393,11 @@ export default {
 
     };
 
   },
 
   methods: {
 
-    click (index) {
 
+    click(index) {
 
       this.activeIndex = index;
 
       this.subIndex = null;
 
     },
 
-    subMenuShow (children, index) {
 
+    subMenuShow(children, index) {
 
       if (children) {
 
         this.isShowSubMenu = true;
 
         this.parentIndex = index;
 
@@ -409,18 +407,18 @@ export default {
 
       }
 
       this.subMenu = children;
 
     },
 
-    subMenuHide () {
 
+    subMenuHide() {
 
       this.isShowSubMenu = false;
 
       this.parentIndex = null;
 
       this.subMenu = [];
 
     },
 
-    subclick (index) {
 
+    subclick(index) {
 
       this.activeIndex = this.parentIndex;
 
       this.subIndex = index;
 
     },
 
   },
 
   computed: {
 
-    currentMenu () {
 
+    currentMenu() {
 
       let data = this.menuData.filter((t) => {
 
         return t.id == this.currRoot;
 
       })[0].data;
 
@@ -430,7 +428,7 @@ export default {
 
   watch: {
 
     // 监听路由
 
     $route: {
 
-      handler: function (val, oldVal) {
 
+      handler: function(val, oldVal) {
 
         this.menuData.some((element, index) => {
 
           if (val.path.includes(element.id)) {
 
             this.currRoot = element.id;