Home Explore Help
Sign In
yangxiao
/
sis_zhfx
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

Merge branch 'yx' of http://61.161.152.110:10101/r/electronic-map into yx

zhangming 3 years ago
parent
b9dfd90982 cdc69e2b94
commit
32b317760a
53 changed files with 51293 additions and 2302 deletions
Split View Show Diff Stats
  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. 167 189
      src/assets/dataService/arcgis-nx-fc1-line.json
  19. 570 52
      src/assets/dataService/arcgis-nx-fc1.json
  20. 1 1
      src/assets/icon/svg/风机.svg
  21. BIN
      src/assets/png/3dback.png
  22. 13 0
      src/assets/styles/el-override/el-card.less
  23. 257 0
      src/assets/styles/el-override/el-input.less
  24. 36 0
      src/assets/styles/el-override/el-pagination.less
  25. 104 0
      src/assets/styles/el-override/el-table.less
  26. 5 0
      src/assets/styles/el-override/index.less
  27. 83 67
      src/assets/styles/form.less
  28. 3 0
      src/assets/styles/main.less
  29. 0 142
      src/assets/styles/table.less
  30. 53 4
      src/components/arcgis/arcgis.vue
  31. 5 1
      src/components/chart/line/normal-line-chart.vue
  32. 2 1
      src/components/coms/table/table2.vue
  33. 486 478
      src/router/index.js
  34. 5 3
      src/views/Demo.vue
  35. 0 2
      src/views/HealthControl/HealthTab4.vue
  36. 264 310
      src/views/HealthControl/infotrack2.vue
  37. 291 0
      src/views/NewPages/alarm-center-1.vue
  38. 227 77
      src/views/NewPages/dj1.vue
  39. 5 4
      src/views/NewPages/fdlyl.vue
  40. 542 0
      src/views/NewPages/history-search.vue
  41. 166 57
      src/views/NewPages/knowledge-base.vue
  42. 175 0
      src/views/NewPages/power-forecast-2.vue
  43. 4 4
      src/views/NewPages/ztfx.vue
  44. 13 0
      src/views/SandTable/SandTable.vue
  45. 297 9
      src/views/SandTable/component/ThreeModel.vue
  46. 150 0
      src/views/SandTable/component/st-back.vue
  47. 260 260
      src/views/WindSite/pages/Home/Home.vue
  48. 428 365
      src/views/WindSite/pages/Map.vue
  49. 20 1
      src/views/WindSite/pages/Map1.vue
  50. 40 40
      src/views/WindSite/pages/Matrix.vue
  51. 10 10
      src/views/layout/Header.vue
  52. 48 47
      src/views/layout/Menu.vue
  53. 166 178
      src/views/performanceAnalysis/index.vue

+ 1 - 0
package.json
View File 

@@ -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
View File 

@@ -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>

File diff suppressed because it is too large
+ 4917 - 0
public/static/js/videoPlayer/adapter.js


File diff suppressed because it is too large
+ 2377 - 0
public/static/js/videoPlayer/bootstrap.js


File diff suppressed because it is too large
+ 7 - 0
public/static/js/videoPlayer/bootstrap.min.js


File diff suppressed because it is too large
+ 22 - 0
public/static/js/videoPlayer/flowplayer-3.2.13.min.js


File diff suppressed because it is too large
+ 7 - 0
public/static/js/videoPlayer/flv.min.js


+ 33 - 0
public/static/js/videoPlayer/h5scluster.js
View File 

@@ -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
View File 

@@ -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
View File 

@@ -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);
 
+	}
 
+}

File diff suppressed because it is too large
+ 1 - 0
public/static/js/videoPlayer/h5splayer.js


+ 110 - 0
public/static/js/videoPlayer/h5splayerhelper.js
View File 

@@ -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
View File 

@@ -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);

File diff suppressed because it is too large
+ 10220 - 0
public/static/js/videoPlayer/jquery-3.1.1.js


File diff suppressed because it is too large
+ 1 - 0
public/static/js/videoPlayer/linkplayer.js


File diff suppressed because it is too large
+ 1217 - 0
public/static/js/videoPlayer/platform.js


File diff suppressed because it is too large
+ 26804 - 0
public/static/js/videoPlayer/video.js


+ 167 - 189
src/assets/dataService/arcgis-nx-fc1-line.json
View File 

@@ -6,57 +6,54 @@
 
             },
 
             "paths": [
 
                 [
 
-                    [
 
-                        106.478161812,
 
-                        37.769397497
 
-                    ],
 
-                    [
 
-                        106.47877335499999,
 
-                        37.76933312400001
 
-                    ],
 
-                    [
 
-                        106.48048996900002,
 
-                        37.768034935
 
-                    ],
 
-                    [
 
-                        106.48259282100003,
 
-                        37.76651143999999
 
-                    ],
 
-                    [
 
-                        106.48214221,
 
-                        37.76623249099998
 
-                    ],
 
-                    [
 
-                        106.48159503900001,
 
-                        37.766114473000016
 
-                    ],
 
-                    [
 
-                        106.48064017299998,
 
-                        37.76544928599998
 
-                    ],
 
-                    [
 
-                        106.48048996900002,
 
-                        37.76524543800002
 
-                    ],
 
-                    [
 
-                        106.480082273,
 
-                        37.76525616599997
 
-                    ],
 
-                    [
 
-                        106.479460001,
 
-                        37.76491284399998
 
-                    ],
 
-                    [
 
-                        106.47456765200002,
 
-                        37.767809629
 
-                    ]
 
+                    107.0644069,
 
+                    37.30000218
 
+                ],
 
+                [
 
+                    107.0609736,
 
+                    37.29027221
 
+                ],
 
+                [
 
+                    107.0545363,
 
+                    37.29431798
 
+                ],
 
+                [
 
+                    107.0488715,
 
+                    37.29385708
 
+                ],
 
+                [
 
+                    107.04561,
 
+                    37.29752713
 
+                ],
 
+                [
 
+                    107.0409322,
 
+                    37.30025821
 
+                ],
 
+                [
 
+                    107.0374346,
 
+                    37.30382554
 
+                ],
 
+                [
 
+                    107.0325208,
 
+                    37.30630038
 
+                ],
 
+                [
 
+                    107.0349455,
 
+                    37.30909941
 
+                ],
 
+                [
 
+                    107.0286155,
 
+                    37.30956022
 
+                ],
 
+                [
 
+                    107.0238519,
 
+                    37.31106208
 
                 ]
 
             ]
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 1,
 
-            "fc_code": "fc01",
 
+            "fc_code": "MHS",
 
             "width": 3
 
         },
 
         "popupTemplate": null
 
@@ -68,103 +65,54 @@
 
             },
 
             "paths": [
 
                 [
 
-                    [
 
-                        106.47422432899998,
 
-                        37.76701569599999
 
-                    ],
 
-                    [
 
-                        106.47382736200001,
 
-                        37.76769161200002
 
-                    ],
 
-                    [
 
-                        106.47189617200002,
 
-                        37.76813149499998
 
-                    ],
 
-                    [
 
-                        106.47135973000002,
 
-                        37.768346070999996
 
-                    ],
 
-                    [
 
-                        106.47315144499998,
 
-                        37.764998674000026
 
-                    ],
 
-                    [
 
-                        106.47131681399998,
 
-                        37.763625382999976
 
-                    ],
 
-                    [
 
-                        106.469578743,
 
-                        37.763464451000004
 
-                    ],
 
-                    [
 
-                        106.46923542000002,
 
-                        37.764022350000005
 
-                    ],
 
-                    [
 
-                        106.46859168999998,
 
-                        37.76418328300002
 
-                    ],
 
-                    [
 
-                        106.46682143200002,
 
-                        37.765395641
 
-                    ],
 
-                    [
 
-                        106.464782953,
 
-                        37.76680111899998
 
-                    ],
 
-                    [
 
-                        106.46432161299998,
 
-                        37.76714444200002
 
-                    ],
 
-                    [
 
-                        106.46397829099999,
 
-                        37.76769161200002
 
-                    ],
 
-                    [
 
-                        106.463989019,
 
-                        37.76770234100002
 
-                    ]
 
-                ]
 
-            ]
 
-        },
 
-        "symbol": null,
 
-        "attributes": {
 
-            "objectid": 401,
 
-            "fc_code": "fc01",
 
-            "width": 5
 
-        },
 
-        "popupTemplate": null
 
-    },
 
-    {
 
-        "geometry": {
 
-            "spatialReference": {
 
-                "wkid": 4326
 
-            },
 
-            "paths": [
 
+                    107.0649004,
 
+                    37.30542993
 
+                ],
 
+                [
 
+                    107.0527768,
 
+                    37.30129941
 
+                ],
 
+                [
 
+                    107.048614,
 
+                    37.30432051
 
+                ],
 
                 [
 
-                    [
 
-                        106.47456765200002,
 
-                        37.767809629
 
-                    ],
 
-                    [
 
-                        106.47378444700001,
 
-                        37.76765942600002
 
-                    ],
 
-                    [
 
-                        106.47127389899998,
 
-                        37.768507004000014
 
-                    ],
 
-                    [
 
-                        106.46947145500002,
 
-                        37.76905417400002
 
-                    ]
 
+                    107.0456958,
 
+                    37.30819486
 
+                ],
 
+                [
 
+                    107.0414472,
 
+                    37.31130101
 
+                ],
 
+                [
 
+                    107.0348811,
 
+                    37.31508967
 
+                ],
 
+                [
 
+                    107.0305467,
 
+                    37.31749588
 
+                ],
 
+                [
 
+                    107.0199444,
 
+                    37.31830556
 
+                ],
 
+                [
 
+                    107.0611238,
 
+                    37.30860447
 
+                ],
 
+                [
 
+                    107.0571327,
 
+                    37.31169354
 
+                ],
 
+                [
 
+                    107.0521975,
 
+                    37.31369028
 
                 ]
 
             ]
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 2,
 
-            "fc_code": "fc01",
 
+            "fc_code": "MHS",
 
             "width": 3
 
         },
 
         "popupTemplate": null
 
@@ -176,21 +124,54 @@
 
             },
 
             "paths": [
 
                 [
 
-                    [
 
-                        106.469321251,
 
-                        37.76809930799999
 
-                    ],
 
-                    [
 
-                        106.47069454199999,
 
-                        37.76863574999999
 
-                    ]
 
+                    107.0693851,
 
+                    37.30322815
 
+                ],
 
+                [
 
+                    107.0744705,
 
+                    37.30041183
 
+                ],
 
+                [
 
+                    107.0696425,
 
+                    37.29628104
 
+                ],
 
+                [
 
+                    107.0717883,
 
+                    37.29213295
 
+                ],
 
+                [
 
+                    107.0662093,
 
+                    37.28824071
 
+                ],
 
+                [
 
+                    107.0567894,
 
+                    37.31587468
 
+                ],
 
+                [
 
+                    107.0560169,
 
+                    37.31988494
 
+                ],
 
+                [
 
+                    107.0506954,
 
+                    37.32184734
 
+                ],
 
+                [
 
+                    107.0727539,
 
+                    37.31087435
 
+                ],
 
+                [
 
+                    107.0761871,
 
+                    37.3067612
 
+                ],
 
+                [
 
+                    107.0820665,
 
+                    37.30641985
 
                 ]
 
             ]
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 3,
 
-            "fc_code": "fc01",
 
+            "fc_code": "MHS",
 
             "width": 3
 
         },
 
         "popupTemplate": null
 
@@ -202,53 +183,50 @@
 
             },
 
             "paths": [
 
                 [
 
-                    [
 
-                        106.46255135500002,
 
-                        37.76048183400002
 
-                    ],
 
-                    [
 
-                        106.46808743499997,
 
-                        37.76037454599998
 
-                    ],
 
-                    [
 
-                        106.46884918199999,
 
-                        37.760299444
 
-                    ],
 
-                    [
 
-                        106.46916031799998,
 
-                        37.76011705399998
 
-                    ],
 
-                    [
 
-                        106.47113442400001,
 
-                        37.760331630999985
 
-                    ],
 
-                    [
 
-                        106.471198797,
 
-                        37.760556936
 
-                    ],
 
-                    [
 
-                        106.470930576,
 
-                        37.761157750999985
 
-                    ],
 
-                    [
 
-                        106.47076964399997,
 
-                        37.76178002400002
 
-                    ],
 
-                    [
 
-                        106.47024393100003,
 
-                        37.76248812699998
 
-                    ],
 
-                    [
 
-                        106.469589472,
 
-                        37.76345372200001
 
-                    ]
 
+                    107.0360184,
 
+                    37.32406563
 
+                ],
 
+                [
 
+                    107.0318985,
 
+                    37.32969639
 
+                ],
 
+                [
 
+                    107.0269525,
 
+                    37.33528407
 
+                ],
 
+                [
 
+                    107.0515966,
 
+                    37.32539657
 
+                ],
 
+                [
 
+                    107.0396662,
 
+                    37.33669159
 
+                ],
 
+                [
 
+                    107.0315766,
 
+                    37.34420644
 
+                ],
 
+                [
 
+                    107.0183909,
 
+                    37.34223611
 
+                ],
 
+                [
 
+                    107.0164329,
 
+                    37.33144098
 
+                ],
 
+                [
 
+                    107.0044997,
 
+                    37.32873236
 
+                ],
 
+                [
 
+                    107.0019168,
 
+                    37.33337322
 
                 ]
 
             ]
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 4,
 
-            "fc_code": "fc01",
 
+            "fc_code": "MHS",
 
             "width": 3
 
         },
 
         "popupTemplate": null

+ 570 - 52
src/assets/dataService/arcgis-nx-fc1.json
View File 

@@ -4,8 +4,8 @@
 
             "spatialReference": {
 
                 "wkid": 4326
 
             },
 
-            "x": 106.47947073,
 
-            "y": 37.76491284399998
 
+            "x": 107.0674069,
 
+            "y": 37.3040218
 
         },
 
         "symbol": null,
 
         "attributes": {
 
@@ -21,14 +21,13 @@
 
             "spatialReference": {
 
                 "wkid": 4326
 
             },
 
-            "x": 106.478161812,
 
-            "y": 37.769397497
 
+            "x": 107.0644069,
 
+            "y": 37.30000218
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 2,
 
-            "fc_code": "fc01",
 
-            "code": "A01",
 
+            "fc_code": "MHS",
 
+            "code": "MG01",
 
             "type": "风场"
 
         },
 
         "popupTemplate": null
 
@@ -38,14 +37,13 @@
 
             "spatialReference": {
 
                 "wkid": 4326
 
             },
 
-            "x": 106.47457838100001,
 
-            "y": 37.76784181599999
 
+            "x": 107.0609736,
 
+            "y": 37.29027221
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 401,
 
-            "fc_code": "fc01",
 
-            "code": "A02",
 
+            "fc_code": "MHS",
 
+            "code": "MG02",
 
             "type": "风场"
 
         },
 
         "popupTemplate": null
 
@@ -55,14 +53,13 @@
 
             "spatialReference": {
 
                 "wkid": 4326
 
             },
 
-            "x": 106.47423505799998,
 
-            "y": 37.767080068999974
 
+            "x": 107.0545363,
 
+            "y": 37.29431798
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 402,
 
-            "fc_code": "fc01",
 
-            "code": "A03",
 
+            "fc_code": "MHS",
 
+            "code": "MG03",
 
             "type": "风场"
 
         },
 
         "popupTemplate": null
 
@@ -72,14 +69,13 @@
 
             "spatialReference": {
 
                 "wkid": 4326
 
             },
 
-            "x": 106.47315144499998,
 
-            "y": 37.765030861000014
 
+            "x": 107.0488715,
 
+            "y": 37.29385708
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 403,
 
-            "fc_code": "fc01",
 
-            "code": "A04",
 
+            "fc_code": "MHS",
 
+            "code": "MG04",
 
             "type": "风场"
 
         },
 
         "popupTemplate": null
 
@@ -89,14 +85,13 @@
 
             "spatialReference": {
 
                 "wkid": 4326
 
             },
 
-            "x": 106.46861314799997,
 
-            "y": 37.76419401200002
 
+            "x": 107.04561,
 
+            "y": 37.29752713
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 404,
 
-            "fc_code": "fc01",
 
-            "code": "A05",
 
+            "fc_code": "MHS",
 
+            "code": "MG05",
 
             "type": "风场"
 
         },
 
         "popupTemplate": null
 
@@ -106,14 +101,13 @@
 
             "spatialReference": {
 
                 "wkid": 4326
 
             },
 
-            "x": 106.46949291200002,
 
-            "y": 37.76907563200001
 
+            "x": 107.0409322,
 
+            "y": 37.30025821
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 405,
 
-            "fc_code": "fc01",
 
-            "code": "A06",
 
+            "fc_code": "MHS",
 
+            "code": "MG06",
 
             "type": "风场"
 
         },
 
         "popupTemplate": null
 
@@ -123,14 +117,13 @@
 
             "spatialReference": {
 
                 "wkid": 4326
 
             },
 
-            "x": 106.469321251,
 
-            "y": 37.76813149499998
 
+            "x": 107.0374346,
 
+            "y": 37.30382554
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 406,
 
-            "fc_code": "fc01",
 
-            "code": "A07",
 
+            "fc_code": "MHS",
 
+            "code": "MG07",
 
             "type": "风场"
 
         },
 
         "popupTemplate": null
 
@@ -140,14 +133,13 @@
 
             "spatialReference": {
 
                 "wkid": 4326
 
             },
 
-            "x": 106.47117734,
 
-            "y": 37.76058912299999
 
+            "x": 107.0325208,
 
+            "y": 37.30630038
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 407,
 
-            "fc_code": "fc01",
 
-            "code": "A08",
 
+            "fc_code": "MHS",
 
+            "code": "MG08",
 
             "type": "风场"
 
         },
 
         "popupTemplate": null
 
@@ -157,14 +149,13 @@
 
             "spatialReference": {
 
                 "wkid": 4326
 
             },
 
-            "x": 106.463967562,
 
-            "y": 37.76771307000001
 
+            "x": 107.0349455,
 
+            "y": 37.30909941
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 408,
 
-            "fc_code": "fc01",
 
-            "code": "A09",
 
+            "fc_code": "MHS",
 
+            "code": "MG09",
 
             "type": "风场"
 
         },
 
         "popupTemplate": null
 
@@ -174,14 +165,541 @@
 
             "spatialReference": {
 
                 "wkid": 4326
 
             },
 
-            "x": 106.46254062700001,
 
-            "y": 37.760556936
 
+            "x": 107.0286155,
 
+            "y": 37.30956022
 
         },
 
         "symbol": null,
 
         "attributes": {
 
-            "objectid": 409,
 
-            "fc_code": "fc01",
 
-            "code": "A10",
 
+            "fc_code": "MHS",
 
+            "code": "MG10",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0238519,
 
+            "y": 37.31106208
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG11",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0649004,
 
+            "y": 37.30542993
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG12",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0527768,
 
+            "y": 37.30129941
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG13",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.048614,
 
+            "y": 37.30432051
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG14",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0456958,
 
+            "y": 37.30819486
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG15",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0414472,
 
+            "y": 37.31130101
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG16",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0348811,
 
+            "y": 37.31508967
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG17",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0305467,
 
+            "y": 37.31749588
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG18",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0199444,
 
+            "y": 37.31830556
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG19",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0611238,
 
+            "y": 37.30860447
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG20",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0571327,
 
+            "y": 37.31169354
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG21",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0521975,
 
+            "y": 37.31369028
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG22",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0693851,
 
+            "y": 37.30322815
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG23",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0744705,
 
+            "y": 37.30041183
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG24",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0696425,
 
+            "y": 37.29628104
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG25",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0717883,
 
+            "y": 37.29213295
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG26",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0662093,
 
+            "y": 37.28824071
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG27",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0567894,
 
+            "y": 37.31587468
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG28",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0560169,
 
+            "y": 37.31988494
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG29",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0506954,
 
+            "y": 37.32184734
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG30",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0727539,
 
+            "y": 37.31087435
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG31",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0761871,
 
+            "y": 37.3067612
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG32",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0820665,
 
+            "y": 37.30641985
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG33",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0360184,
 
+            "y": 37.32406563
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG34",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0318985,
 
+            "y": 37.32969639
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG35",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0269525,
 
+            "y": 37.33528407
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG36",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0515966,
 
+            "y": 37.32539657
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG37",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0396662,
 
+            "y": 37.33669159
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG38",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0315766,
 
+            "y": 37.34420644
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG39",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0183909,
 
+            "y": 37.34223611
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG40",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0164329,
 
+            "y": 37.33144098
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG41",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0044997,
 
+            "y": 37.32873236
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG42",
 
+            "type": "风场"
 
+        },
 
+        "popupTemplate": null
 
+    },
 
+    {
 
+        "geometry": {
 
+            "spatialReference": {
 
+                "wkid": 4326
 
+            },
 
+            "x": 107.0019168,
 
+            "y": 37.33337322
 
+        },
 
+        "symbol": null,
 
+        "attributes": {
 
+            "fc_code": "MHS",
 
+            "code": "MG43",
 
             "type": "风场"
 
         },
 
         "popupTemplate": null

+ 1 - 1
src/assets/icon/svg/风机.svg
View File 

@@ -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>

BIN
src/assets/png/3dback.png
View File


+ 13 - 0
src/assets/styles/el-override/el-card.less
View File 

@@ -0,0 +1,13 @@
 
+.main-body {
 
+  .el-card {
 
+    background: transparent;
 
+    border-color: fade(@gray, 50);
 
+    border-radius: 0;
 
+
 
+    .el-card__header {
 
+      color: @gray-l;
 
+      background: fade(@gray, 20);
 
+      border: none;
 
+    }
 
+  }
 
+}

+ 257 - 0
src/assets/styles/el-override/el-input.less
View File 

@@ -0,0 +1,257 @@
 
+@picker-bg-color: fade(#121d1c, 95);
 
+
 
+.main-body {
 
+  .el-input__inner {
 
+    background: fade(@gray, 20);
 
+    color: @gray-l;
 
+  }
 
+
 
+  .el-input {
 
+    &.is-disabled .el-input__inner {
 
+      background-color: fade(@gray-l, 20);
 
+      border-color: @gray;
 
+      color: @gray;
 
+      cursor: not-allowed;
 
+    }
 
+  }
 
+
 
+  // 数字组件
 
+  .el-input-number {
 
+    &.is-controls-right {
 
+      .el-input-number__increase {
 
+        border-bottom: 1px solid @gray;
 
+      }
 
+
 
+      .el-input-number__decrease,
 
+      .el-input-number__increase {
 
+        line-height: 15px;
 
+        color: @gray-l;
 
+        background: fade(@gray, 40);
 
+        border-left: 1px solid @gray;
 
+      }
 
+    }
 
+  }
 
+
 
+  // 日期组件
 
+  .el-date-editor {
 
+    &.is-active,
 
+    &.is-active:hover,
 
+    &.is-focus .el-input__inner {
 
+      border-color: @green;
 
+    }
 
+
 
+    // el datetimerange Start
 
+    &.el-date-editor--datetimerange {
 
+      border: 1px solid fade(@gray, 20);
 
+      height: 33px;
 
+      padding: 0 8px;
 
+      width: 369px;
 
+
 
+      .el-range-separator {
 
+        color: @gray-l;
 
+        line-height: 33px;
 
+      }
 
+
 
+      .el-range-input {
 
+        flex-basis: 145px;
 
+        line-height: 33px;
 
+        background: transparent;
 
+        color: @gray-l;
 
+        &::placeholder {
 
+          text-align: center;
 
+          color: @gray-l;
 
+        }
 
+      }
 
+    }
 
+    // el datetimerange End
 
+  }
 
+
 
+  // 单选框
 
+  .el-radio {
 
+    color: @gray-l;
 
+
 
+    &.is-checked {
 
+      .el-radio__inner {
 
+        background: @green;
 
+        border-color: @green;
 
+      }
 
+
 
+      .el-radio__label {
 
+        color: @green;
 
+      }
 
+    }
 
+
 
+    &.is-bordered.is-checked {
 
+      border-color: @green;
 
+    }
 
+
 
+    &:focus:not(.is-focus):not(:active):not(.is-disabled) .el-radio__inner {
 
+      box-shadow: 0 0 2px 2px @green;
 
+    }
 
+  }
 
+
 
+  // 单选框组
 
+  .el-radio-group {
 
+    height: 33px;
 
+    & > .el-radio {
 
+      line-height: 33px;
 
+    }
 
+  }
 
+
 
+  // 树组件
 
+  .el-tree {
 
+    color: @gray-l;
 
+    background: fade(@gray, 20);
 
+
 
+    .el-checkbox__inner {
 
+      background: transparent;
 
+      border-color: @gray;
 
+    }
 
+
 
+    .el-checkbox__input.is-disabled .el-checkbox__inner {
 
+      background: @gray;
 
+      border-color: @gray;
 
+    }
 
+
 
+    &.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content {
 
+      background: transparent;
 
+      color: @green;
 
+    }
 
+
 
+    .el-tree-node__content:hover,
 
+    .el-upload-list__item:hover {
 
+      background: transparent;
 
+      color: @green;
 
+    }
 
+
 
+    .el-checkbox__inner:hover {
 
+      border-color: @green;
 
+    }
 
+
 
+    .el-checkbox__input.is-focus .el-checkbox__inner {
 
+      border-color: @green;
 
+    }
 
+
 
+    .el-checkbox__input.is-checked .el-checkbox__inner,
 
+    .el-checkbox__input.is-indeterminate .el-checkbox__inner {
 
+      background: @green;
 
+      border-color: @green;
 
+    }
 
+  }
 
+}
 
+
 
+.el-picker__popper.el-popper[role="tooltip"] {
 
+  border-color: @picker-bg-color !important;
 
+  background: @picker-bg-color !important;
 
+}
 
+
 
+.el-picker-panel {
 
+  // el datetimerange  picker Start
 
+  &.el-date-range-picker {
 
+    color: @gray-l;
 
+    background: transparent;
 
+
 
+    .el-date-range-picker__time-header {
 
+      border-color: @gray;
 
+
 
+      .el-icon-arrow-right {
 
+        color: @gray-l;
 
+      }
 
+
 
+      .el-input__inner {
 
+        background: fade(@gray, 20);
 
+        color: @gray-l;
 
+        border-color: @gray;
 
+      }
 
+
 
+      .el-date-range-picker__time-picker-wrap {
 
+        .el-time-panel {
 
+          background-color: @picker-bg-color;
 
+
 
+          .el-time-spinner__item.active:not(.disabled) {
 
+            color: @green;
 
+          }
 
+          .el-time-spinner__item:hover:not(.disabled):not(.active) {
 
+            background: transparent;
 
+            color: @green;
 
+          }
 
+        }
 
+
 
+        .el-time-panel__btn.confirm {
 
+          color: @green;
 
+        }
 
+
 
+        .el-time-panel__btn.cancel {
 
+          color: @gray;
 
+        }
 
+      }
 
+    }
 
+
 
+    .el-date-range-picker__content {
 
+      border-color: @gray;
 
+
 
+      .el-date-table {
 
+        th {
 
+          color: @gray-l;
 
+        }
 
+
 
+        td {
 
+          &.available:hover {
 
+            color: @green;
 
+          }
 
+
 
+          &.in-range div,
 
+          &.in-range div:hover {
 
+            background: fade(@gray, 40);
 
+          }
 
+
 
+          &.end-date span,
 
+          &.start-date span {
 
+            background: @green;
 
+          }
 
+
 
+          &.today {
 
+            span {
 
+              color: @green;
 
+            }
 
+
 
+            &.end-date span,
 
+            &.start-date span {
 
+              color: @white;
 
+            }
 
+          }
 
+
 
+          &.next-month,
 
+          &.prev-month {
 
+            color: @gray;
 
+          }
 
+        }
 
+      }
 
+    }
 
+  }
 
+  // el datetimerange  picker End
 
+
 
+  .el-picker-panel__body {
 
+    border-color: @gray;
 
+  }
 
+
 
+  .el-picker-panel__footer {
 
+    background: transparent;
 
+    border-color: @gray;
 
+
 
+    .el-button--text {
 
+      color: @gray;
 
+    }
 
+
 
+    .el-button.is-plain {
 
+      background: transparent;
 
+      border-color: @green;
 
+      color: @green;
 
+    }
 
+  }
 
+}
 
+
 
+.el-popper__arrow::before {
 
+  background: fade(#121d1c, 95) !important;
 
+  border: 1px solid fade(#121d1c, 95) !important;
 
+}

+ 36 - 0
src/assets/styles/el-override/el-pagination.less
View File 

@@ -0,0 +1,36 @@
 
+// el-pagination
 
+.main-body {
 
+  .el-pagination {
 
+    color: @gray;
 
+    .el-pagination__total {
 
+      color: @gray;
 
+    }
 
+
 
+    button {
 
+      &.btn-next,
 
+      &.btn-prev {
 
+        background: center center no-repeat fade(@gray, 20);
 
+        color: @gray-l;
 
+      }
 
+      &:disabled {
 
+        color: @gray-l;
 
+        background-color: fade(@gray, 20);
 
+        cursor: not-allowed;
 
+      }
 
+    }
 
+
 
+    .el-pager li {
 
+      color: @gray-l;
 
+      background: fade(@gray, 20);
 
+      &.active {
 
+        color: @green;
 
+      }
 
+    }
 
+
 
+    .el-input__inner {
 
+      color: @gray-l;
 
+      background: fade(@gray, 20);
 
+      border: 1px solid fade(@gray, 20);
 
+    }
 
+  }
 
+}

+ 104 - 0
src/assets/styles/el-override/el-table.less
View File 

@@ -0,0 +1,104 @@
 
+// el-table
 
+.main-body {
 
+  .el-table {
 
+    background: transparent;
 
+    border: 0px;
 
+
 
+    &.el-table--border::after,
 
+    &.el-table--group::after,
 
+    &::before {
 
+      background-color: transparent;
 
+    }
 
+
 
+    tr {
 
+      &:hover {
 
+        td {
 
+          color: @green;
 
+          background-color: transparent !important;
 
+        }
 
+      }
 
+    }
 
+
 
+    td {
 
+      border: 0px;
 
+      padding: 0;
 
+      height: 27px;
 
+      line-height: 27px;
 
+      font-size: 12px;
 
+    }
 
+
 
+    th {
 
+      border: 0px;
 
+      padding: 0px;
 
+      height: 30px;
 
+      line-height: 30px;
 
+      font-weight: normal;
 
+      text-align: center;
 
+      color: @gray-l;
 
+
 
+      &.is-leaf {
 
+        border: 0px;
 
+      }
 
+    }
 
+
 
+    th,
 
+    tr {
 
+      background-color: transparent;
 
+      border: 0px;
 
+    }
 
+
 
+    thead {
 
+      color: @gray-l;
 
+      font-weight: 500;
 
+      font-size: @fontsize-s;
 
+      border: 0px;
 
+
 
+      th,
 
+      &.is-group th {
 
+        & > .cell {
 
+        }
 
+
 
+        background-color: fade(@gray, 20);
 
+      }
 
+    }
 
+
 
+    .el-table__body {
 
+      border: 0px;
 
+    }
 
+
 
+    &.el-table--striped .el-table__body tr.el-table__row--striped {
 
+      &:hover td {
 
+        background-color: fade(@gray, 20) !important;
 
+      }
 
+
 
+      td {
 
+        background-color: fade(@gray, 20);
 
+      }
 
+    }
 
+
 
+    &.el-table--border,
 
+    &.el-table--group {
 
+      border: none;
 
+    }
 
+
 
+    .ascending .sort-caret.ascending {
 
+      border-bottom-color: @green;
 
+    }
 
+
 
+    .descending .sort-caret.descending {
 
+      border-top-color: @green;
 
+    }
 
+  }
 
+
 
+  .el-table__expanded-cell {
 
+    background: transparent;
 
+  }
 
+
 
+  .el-table__body tr.hover-row.current-row > td,
 
+  .el-table__body tr.hover-row.el-table__row--striped.current-row > td,
 
+  .el-table__body tr.hover-row.el-table__row--striped > td,
 
+  .el-table__body tr.hover-row > td {
 
+    background: transparent;
 
+    color: @green;
 
+  }
 
+}

+ 5 - 0
src/assets/styles/el-override/index.less
View File 

@@ -0,0 +1,5 @@
 
+@import "./el-card.less";
 
+@import "./el-pagination.less";
 
+@import "./el-pagination.less";
 
+@import "./el-input.less";
 
+@import "./el-table.less";

+ 83 - 67
src/assets/styles/form.less
View File 

@@ -1,83 +1,104 @@
 
 // 查询 样式
 
-.query {
 
-  display: flex;
 
-  justify-content: space-between;
 
-
 
-  &.left {
 
-    justify-content: flex-start;
 
-  }
 
-
 
-  .query-items {
 
-    flex: 0 0 auto;
 
+.main-body {
 
+  .query {
 
     display: flex;
 
+    justify-content: space-between;
 
+
 
+    &.left {
 
+      justify-content: flex-start;
 
+    }
 
 
-    .query-item {
 
+    .query-items {
 
       flex: 0 0 auto;
 
       display: flex;
 
-      margin: 0 1.4815vh;
 
 
-      .el-input {
 
-        &.placeholder-left {
 
-          input {
 
-            &::placeholder {
 
-              text-align: left;
 
+      .query-item {
 
+        flex: 0 0 auto;
 
+        display: flex;
 
+        margin: 0 1.4815vh;
 
+
 
+        .el-input {
 
+          &.placeholder-left {
 
+            input {
 
+              &::placeholder {
 
+                text-align: left;
 
+              }
 
             }
 
           }
 
         }
 
-      }
 
-      .placeholder-left {
 
-        .el-input {
 
-          input {
 
-            height: 33px !important;
 
-            &::placeholder {
 
-              text-align: left;
 
+        .placeholder-left {
 
+          .el-input {
 
+            input {
 
+              height: 33px !important;
 
+              &::placeholder {
 
+                text-align: left;
 
+              }
 
             }
 
           }
 
         }
 
-      }
 
-
 
-      .lable {
 
-        flex: 0 0 auto;
 
-        margin-right: 1.4815vh;
 
-        line-height: 33px;
 
-        color: @gray-l;
 
-      }
 
-
 
-      .search-input {
 
-        position: relative;
 
 
-        input {
 
-          box-sizing: border-box;
 
-          flex: 0 0 200px;
 
-          border: 0px solid @darkgray;
 
-          color: @white;
 
-          outline: unset;
 
-          border-radius: 0%;
 
-          padding-right: 40px;
 
-          background: fade(#536268, 20);
 
-          height: 33px;
 
+        .lable {
 
+          flex: 0 0 auto;
 
+          margin-right: 1.4815vh;
 
           line-height: 33px;
 
-
 
-          &::placeholder {
 
-            font-size: 12px;
 
-            text-align: right;
 
-            color: @darkgray;
 
-          }
 
+          color: @gray-l;
 
         }
 
 
-        .unit {
 
-          position: absolute;
 
-          right: 12px;
 
-          top: 6px;
 
-          line-height: 33px;
 
-          margin: auto;
 
+        .search-input {
 
+          position: relative;
 
+
 
+          // input {
 
+          //   box-sizing: border-box;
 
+          //   flex: 0 0 200px;
 
+          //   border: 0px solid @darkgray;
 
+          //   color: @white;
 
+          //   outline: unset;
 
+          //   border-radius: 0%;
 
+          //   padding-right: 40px;
 
+          //   background: fade(#536268, 20);
 
+          //   height: 33px;
 
+          //   line-height: 33px;
 
+
 
+          //   &::placeholder {
 
+          //     font-size: 12px;
 
+          //     text-align: right;
 
+          //     color: @darkgray;
 
+          //   }
 
+          // }
 
+
 
+          // .unit {
 
+          //   position: absolute;
 
+          //   right: 12px;
 
+          //   top: 6px;
 
+          //   line-height: 33px;
 
+          //   margin: auto;
 
+          // }
 
         }
 
       }
 
     }
 
+
 
+    .query-actions {
 
+      flex: 0 0 auto;
 
+    }
 
   }
 
 
-  .query-actions {
 
-    flex: 0 0 auto;
 
+  input {
 
+    box-sizing: border-box;
 
+    flex: 0 0 200px;
 
+    border: 0px solid @darkgray;
 
+    color: @white;
 
+    outline: unset;
 
+    border-radius: 0%;
 
+    padding-right: 40px;
 
+    background: fade(#536268, 20);
 
+    height: 33px;
 
+    line-height: 33px;
 
+
 
+    &::placeholder {
 
+      font-size: 12px;
 
+      text-align: right;
 
+      color: @darkgray;
 
+    }
 
   }
 
 }
 
 
@@ -223,7 +244,6 @@ input[type="checkbox"] {
 
 }
 
 
 .date-select {
 
-
 
   .el-input {
 
     .el-input__inner {
 
       background: fade(#536268, 20);
 
@@ -256,7 +276,6 @@ input[type="checkbox"] {
 
         }
 
 
         td {
 
-
 
           &.next-month,
 
           &.prev-month {
 
             color: @gray;
 
@@ -396,7 +415,6 @@ input[type="checkbox"] {
 
           }
 
         }
 
       }
 
-
 
     }
 
   }
 
 }
 
@@ -423,9 +441,8 @@ input[type="checkbox"] {
 
 
 .el-checkbox-group {
 
   .el-checkbox {
 
-
 
     &.is-checked {
 
-      .el-checkbox__input  {
 
+      .el-checkbox__input {
 
         &.is-checked {
 
           .el-checkbox__inner {
 
             background-color: @green;
 
@@ -433,13 +450,13 @@ input[type="checkbox"] {
 
           }
 
         }
 
       }
 
-    
+
 
       .el-checkbox__label {
 
         color: @green;
 
       }
 
     }
 
 
-    .el-checkbox__input  {
 
+    .el-checkbox__input {
 
       .el-checkbox__inner {
 
         background-color: transparent;
 
         border-color: #606769;
 
@@ -451,4 +468,3 @@ input[type="checkbox"] {
 
     }
 
   }
 
 }
 
-

+ 3 - 0
src/assets/styles/main.less
View File 

@@ -15,3 +15,6 @@
 
 @import "./dialog.less";
 
 
 @import "./table.less";
 
+
 
+// el 样式 重写
 
+@import "./el-override/index.less";

+ 0 - 142
src/assets/styles/table.less
View File 

@@ -65,145 +65,3 @@
 
     }
 
   }
 
 }
 
-
 
-// el-table
 
-.main-body {
 
-  .el-table {
 
-    background: transparent;
 
-    border: 0px;
 
-
 
-    &.el-table--border::after,
 
-    &.el-table--group::after,
 
-    &::before {
 
-      background-color: transparent;
 
-    }
 
-
 
-    tr {
 
-      &:hover {
 
-        td {
 
-          color: @green;
 
-          background-color: transparent !important;
 
-        }
 
-      }
 
-    }
 
-
 
-    td {
 
-      border: 0px;
 
-      padding: 0;
 
-      height: 27px;
 
-      line-height: 27px;
 
-      font-size: 12px;
 
-    }
 
-
 
-    th {
 
-      border: 0px;
 
-      padding: 0px;
 
-      height: 30px;
 
-      line-height: 30px;
 
-      font-weight: normal;
 
-      text-align: center;
 
-      color: @gray-l;
 
-
 
-      &.is-leaf {
 
-        border: 0px;
 
-      }
 
-    }
 
-
 
-    th,
 
-    tr {
 
-      background-color: transparent;
 
-      border: 0px;
 
-    }
 
-
 
-    thead {
 
-      color: @gray-l;
 
-      font-weight: 500;
 
-      font-size: @fontsize-s;
 
-      border: 0px;
 
-
 
-      th,
 
-      &.is-group th {
 
-        & > .cell {
 
-        }
 
-
 
-        background-color: fade(@gray, 20);
 
-      }
 
-    }
 
-
 
-    .el-table__body {
 
-      border: 0px;
 
-    }
 
-
 
-    &.el-table--striped .el-table__body tr.el-table__row--striped {
 
-      &:hover td {
 
-        background-color: fade(@gray, 20) !important;
 
-      }
 
-
 
-      td {
 
-        background-color: fade(@gray, 20);
 
-      }
 
-    }
 
-
 
-    &.el-table--border,
 
-    &.el-table--group {
 
-      border: none;
 
-    }
 
-
 
-    .ascending .sort-caret.ascending {
 
-      border-bottom-color: @green;
 
-    }
 
-
 
-    .descending .sort-caret.descending {
 
-      border-top-color: @green;
 
-    }
 
-  }
 
-
 
-  .el-table__expanded-cell {
 
-    background: transparent;
 
-  }
 
-
 
-  .el-table__body tr.hover-row.current-row > td,
 
-  .el-table__body tr.hover-row.el-table__row--striped.current-row > td,
 
-  .el-table__body tr.hover-row.el-table__row--striped > td,
 
-  .el-table__body tr.hover-row > td {
 
-    background: transparent;
 
-    color: @green;
 
-  }
 
-}
 
-
 
-// el-pagination
 
-.main-body {
 
-  .el-pagination {
 
-    color: @gray;
 
-    .el-pagination__total {
 
-      color: @gray;
 
-    }
 
-
 
-    button {
 
-      &.btn-next,
 
-      &.btn-prev {
 
-        background: center center no-repeat fade(@gray, 20);
 
-        color: @gray-l;
 
-      }
 
-      &:disabled {
 
-        color: @gray-l;
 
-        background-color: fade(@gray, 20);
 
-        cursor: not-allowed;
 
-      }
 
-    }
 
-
 
-    .el-pager li {
 
-      color: @gray-l;
 
-      background: fade(@gray, 20);
 
-      &.active {
 
-        color: @green;
 
-      }
 
-    }
 
-
 
-    .el-input__inner {
 
-      color: @gray-l;
 
-      background: fade(@gray, 20);
 
-      border: 1px solid fade(@gray, 20);
 
-    }
 
-  }
 
-}

+ 53 - 4
src/components/arcgis/arcgis.vue
View File 

@@ -1,5 +1,5 @@
 
 <template>
 
-    <div class="arcgis">
 
+    <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" 
@@ -55,6 +55,9 @@
 
                         height: 654, // 3D地图初始相机高度
 
                         tilt: 65, // 俯视角
 
                         scale: 128000, // 缩放
 
+                        rotation: 0, // 正北顺时针旋转角度
 
+                        ox: 0, // 标记整体偏移
 
+                        oy: 0, // 标记整体偏移
 
                     }
 
                 },
 
             }
 
@@ -105,10 +108,25 @@
 
                 ],
 
                 syzImg: require("@assets/temp.png"),
 
                 markers: [],
 
+                pointer: false,
 
             }
 
         },
 
         // 函数
 
         methods: {
 
+            // 世界转屏幕
 
+            worldToScreen: function (point) {
 
+                // var world = new Point(point.x, point.y, SpatialReference.WGS84);
 
+                // var screenPoint = map.toScreen(point);
 
+            },
 
+            // 屏幕转世界
 
+            screenToWorld: function (point) {},
 
+            // 偏移转经纬度
 
+            oToLL: function (x, y) {
 
+                return {
 
+                    x: 0.00000899 * x,
 
+                    y: 0.00001141 * y
 
+                }
 
+            },
 
             // 初始化地图
 
             initMap: function() {
 
                 basemap = new Basemap({
 
@@ -144,10 +162,11 @@
 
                     });
 
                 } else {
 
                     view = new MapView({
 
-                        // 3D显示图层
 
+                        // 2D显示图层
 
                         map: map,
 
                         center: this.data.center,
 
                         container: this.$el.querySelector("#viewDiv"),
 
+                        rotation: this.data.rotation,
 
                     });
 
                 }
 
                 view.scale = this.data.scale;
 
@@ -180,7 +199,7 @@
 
                 map.add(text_graphicsLayer);
 
                 map.add(img_graphicsLayer);
 
                 map.add(html_graphicsLayer);
 
-                view.on("click", (event) => {
 
+                view.on("click", (event) => { // 监听鼠标点击 判断是否可以点击
 
                     view.hitTest(event).then((response) => {
 
                         let result = null;
 
                         if (response.results.length) {
 
@@ -196,6 +215,24 @@
 
                         }
 
                     })
 
                 });
 
+                view.on("pointer-move", (event) => { // 监听鼠标移动 判断是否把鼠标变成小手
 
+                    view.hitTest(event).then((response) => {
 
+                        let result = null;
 
+                        if (response.results.length) {
 
+                            const canClick = ["picture-marker", "text"];
 
+                            response.results.forEach(item => {
 
+                                if (canClick.indexOf(item.graphic.symbol.type) >= 0) {
 
+                                    result = item.graphic.attributes;
 
+                                }
 
+                            })
 
+                        }
 
+                        if (result) {
 
+                            this.pointer= true;
 
+                        } else {
 
+                            this.pointer= false;
 
+                        }
 
+                    })
 
+                })
 
                 view.watch("extent", (evt) => {
 
                     this.markers.forEach((marker, index) => {
 
                         let graphics = html_graphics[index];
 
@@ -318,6 +355,8 @@
 
                 let item = JSON.parse(JSON.stringify(jsonItem));
 
                 item.geometry.type = "point";
 
                 item.geometry.spatialReference = SpatialReference.WGS84;
 
+                item.geometry.x += this.oToLL(this.data.ox, this.data.oy).x;
 
+                item.geometry.y += this.oToLL(this.data.ox, this.data.oy).y;
 
                 item.symbol = {
 
                     type: "picture-marker",
 
                     url: item.attributes.type == "升压站" ? this.syzImg : this.getFanImg(item.attributes.state),
 
@@ -336,6 +375,8 @@
 
                 let item = JSON.parse(JSON.stringify(jsonItem));
 
                 item.geometry.type = "point";
 
                 item.geometry.spatialReference = SpatialReference.WGS84;
 
+                item.geometry.x += this.oToLL(this.data.ox, this.data.oy).x;
 
+                item.geometry.y += this.oToLL(this.data.ox, this.data.oy).y;
 
                 item.symbol = {
 
                     type: "text",
 
                     color: "white",
 
@@ -359,10 +400,14 @@
 
                 let item = JSON.parse(JSON.stringify(jsonItem));
 
                 item.geometry.type = "polyline";
 
                 item.geometry.spatialReference = SpatialReference.WGS84;
 
+                item.geometry.paths.forEach(item => {
 
+                    item[0] += this.oToLL(this.data.ox, this.data.oy).x;
 
+                    item[1] += this.oToLL(this.data.ox, this.data.oy).y;
 
+                });
 
                 item.symbol = {
 
                     type: "simple-line",
 
                     color: "#05bb4c",
 
-                    width: item.attributes.width
 
+                    width: item.attributes.width,
 
                 }
 
                 let graphic = new Graphic(item);
 
                 line_graphics.push(graphic);
 
@@ -416,6 +461,10 @@
 
         position: relative;
 
         overflow: hidden;
 
 
+        &.pointer {
 
+            cursor: pointer;
 
+        }
 
+
 
         #viewDiv {
 
             position: absolute;
 
             z-index: 1;

+ 5 - 1
src/components/chart/line/normal-line-chart.vue
View File 

@@ -126,6 +126,10 @@ export default {
 
       type: Boolean,
 
       default: false,
 
     },
 
+    smooth: {
 
+      type: Boolean,
 
+      default: true,
 
+    },
 
   },
 
   data() {
 
     return {
 
@@ -174,7 +178,7 @@ export default {
 
         result.push({
 
           name: value.title,
 
           type: "line",
 
-          smooth: true,
 
+          smooth: this.smooth,
 
           zlevel: index,
 
           lineStyle: {
 
             normal: {

+ 2 - 1
src/components/coms/table/table2.vue
View File 

@@ -11,9 +11,10 @@
 
       :fixed="col.fixed"
 
       :align="col.align ? col.align : 'center'"
 
       :resizable="col.resizable"
 
+      :header-align="'center'"
 
     >
 
       <template v-if="col.slot == true" #default="item">
 
-        <slot :name="col.field" :column="col" :row="item.row" :all="item"></slot>
 
+        <slot :name="col.field" :column="col" :row="item.row" :all="item" :data="item.row[col.field]"></slot>
 
       </template>
 
     </el-table-column>
 
   </el-table>

+ 486 - 478
src/router/index.js
View File 

@@ -2,489 +2,497 @@ 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: "/performanceAnalysis", // 单机性能分析
 
-        name: "performanceAnalysis",
 
-        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/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: '/',
 
+  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'),
 
+},
 
+{
 
+  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(),
 
-    base: '/zhfx/',
 
-    routes
 
+  history: createWebHashHistory(),
 
+  base: '/zhfx/',
 
+  routes
 
 })
 
 
 router.beforeEach((to, from, next) => {
 
-    next()
 
+  next()
 
 })
 
 
 export default router

+ 5 - 3
src/views/Demo.vue
View File 

@@ -56,7 +56,7 @@
 
 
     <h3>折线图：multiple-line-chart</h3>
 
     <multiple-line-chart :height="'200px'" />
 
-    
+
 
     <h3>折线图：multi-arrow-line-chart</h3>
 
     <multi-arrow-line-chart :height="'200px'" />
 
 
@@ -203,7 +203,7 @@
 
     <p>width : 列宽 可自定与每列宽度 如果想设置横向滚动条 需手动设置列宽 满足各列宽度和大于屏幕宽度</p>
 
     <p>click : 点击事件 与原有table相同</p>
 
     <p>sortable : 排序</p>
 
-    <p>slot: 开启插槽 为true时, 可在HTML中添加 插槽模板 添加自定义内容 为false时, 默认对应显示值, 示例参考代码中template </p>
 
+    <p>slot: 开启插槽 为true时, 可在HTML中添加 插槽模板 添加自定义内容 为false时, 默认对应显示值, 示例参考代码中template</p>
 
     <p>fixed: 固定列</p>
 
     <p>align: 默认文本居中 left | center| right</p>
 
     <table-2 :data="tableData2" :height="'200px'" :pageSize="10" @onPagging="tableonPagging">
 
@@ -339,7 +339,7 @@ export default {
 
     AreaBarChart,
 
     MultipleBarLineChart,
 
     Table2,
 
-    multiArrowLineChart
 
+    multiArrowLineChart,
 
   },
 
   methods: {
 
     select(data) {
 
@@ -495,6 +495,7 @@ export default {
 
         data: [
 
           {
 
             index: 1,
 
+            id: "",
 
             name: "MG01-01",
 
             lqf: "0.1000",
 
             yggl: "0.1000",
 
@@ -596,6 +597,7 @@ export default {
 
         data: [
 
           {
 
             index: 1,
 
+            id: "123",
 
             name: "MG01-01",
 
             lqf: "0.1000",
 
             yggl: "0.1000",

+ 0 - 2
src/views/HealthControl/HealthTab4.vue
View File 

@@ -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
View File 

@@ -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>

+ 291 - 0
src/views/NewPages/alarm-center-1.vue
View File 

@@ -0,0 +1,291 @@
 
+<template>
 
+  <div class="alarm-center-1">
 
+    <div class="action-bar">
 
+      <div class="query mg-b-16">
 
+        <div class="query-items">
 
+          <div class="query-item">
 
+            <div class="lable">风场：</div>
 
+            <div class="search-input">
 
+              <el-select v-model="value1" clearable placeholder="请选择" popper-class="select">
 
+                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
 
+              </el-select>
 
+            </div>
 
+          </div>
 
+          <div class="query-item">
 
+            <div class="lable">开始日期：</div>
 
+            <div class="search-input">
 
+              <el-date-picker v-model="value2" type="date" placeholder="选择日期" popper-class="date-select"> </el-date-picker>
 
+            </div>
 
+          </div>
 
+          <div class="query-item">
 
+            <div class="lable">结束日期：</div>
 
+            <div class="search-input">
 
+              <el-date-picker v-model="value3" type="date" placeholder="选择日期" popper-class="date-select"> </el-date-picker>
 
+            </div>
 
+          </div>
 
+          <div class="query-item">
 
+            <div class="lable">规则：</div>
 
+            <div class="search-input">
 
+              <el-select v-model="value1" clearable placeholder="请选择" popper-class="select">
 
+                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
 
+              </el-select>
 
+            </div>
 
+          </div>
 
+        </div>
 
+        <div class="query-actions">
 
+          <button class="btn green">搜索</button>
 
+          <button class="btn green">筛选</button>
 
+          <button class="btn green">导出</button>
 
+        </div>
 
+      </div>
 
+    </div>
 
+    <panel-3 class="table-panel">
 
+      <table-2 :data="tableData" :height="'88vh'">
 
+        <template v-slot:v1="scope">
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v1 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v1 }}</span>
 
+          </div>
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v2 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v2 }}</span>
 
+          </div>
 
+        </template>
 
+        <template v-slot:v2="scope">
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v1 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v1 }}</span>
 
+          </div>
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v2 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v2 }}</span>
 
+          </div>
 
+        </template>
 
+        <template v-slot:v3="scope">
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v1 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v1 }}</span>
 
+          </div>
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v2 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v2 }}</span>
 
+          </div>
 
+        </template>
 
+        <template v-slot:v4="scope">
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v1 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v1 }}</span>
 
+          </div>
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v2 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v2 }}</span>
 
+          </div>
 
+        </template>
 
+        <template v-slot:v5="scope">
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v1 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v1 }}</span>
 
+          </div>
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v2 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v2 }}</span>
 
+          </div>
 
+        </template>
 
+        <template v-slot:v6="scope">
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v1 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v1 }}</span>
 
+          </div>
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v2 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v2 }}</span>
 
+          </div>
 
+        </template>
 
+        <template v-slot:v7="scope">
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v1 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v1 }}</span>
 
+          </div>
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v2 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v2 }}</span>
 
+          </div>
 
+        </template>
 
+        <template v-slot:v8="scope">
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v1 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v1 }}</span>
 
+          </div>
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v2 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v2 }}</span>
 
+          </div>
 
+        </template>
 
+        <template v-slot:v9="scope">
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v1 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v1 }}</span>
 
+          </div>
 
+          <div class="bar">
 
+            <div class="bar-percent" :style="{ width: (scope.data.v2 / (scope.data.v1 + scope.data.v2)) * 100 + 'px' }"></div>
 
+            <span class="value">{{ scope.data.v2 }}</span>
 
+          </div>
 
+        </template>
 
+      </table-2>
 
+    </panel-3>
 
+  </div>
 
+</template>
 
+
 
+<script>
 
+import Panel3 from "../../components/coms/panel/panel3.vue";
 
+import Table2 from "../../components/coms/table/table2.vue";
 
+export default {
 
+  components: { Panel3, Table2 },
 
+  data() {
 
+    return {
 
+      tableData: {
 
+        column: [
 
+          {
 
+            name: "风机编号",
 
+            field: "name",
 
+          },
 
+          {
 
+            name: "主轴温度温差大于8度",
 
+            field: "v1",
 
+            align: "left",
 
+            slot: true,
 
+          },
 
+          {
 
+            name: "浆叶角过小",
 
+            field: "v2",
 
+            align: "left",
 
+            slot: true,
 
+          },
 
+          {
 
+            name: "齿轮箱温控阀故障或换热器效率低",
 
+            field: "v3",
 
+            align: "left",
 
+            slot: true,
 
+          },
 
+          {
 
+            name: "齿轮箱轴承温升速度超过1.5",
 
+            field: "v4",
 
+            align: "left",
 
+            slot: true,
 
+          },
 
+          {
 
+            name: "齿轮箱轴承温升超过40度",
 
+            field: "v5",
 
+            align: "left",
 
+            slot: true,
 
+          },
 
+          {
 
+            name: "滤网压差",
 
+            field: "v6",
 
+            align: "left",
 
+            slot: true,
 
+          },
 
+          {
 
+            name: "解缆动作",
 
+            field: "v7",
 
+            align: "left",
 
+            slot: true,
 
+          },
 
+          {
 
+            name: "液压泵运行",
 
+            field: "v8",
 
+            align: "left",
 
+            slot: true,
 
+          },
 
+          {
 
+            name: "偏航",
 
+            field: "v9",
 
+            align: "left",
 
+            slot: true,
 
+          },
 
+        ],
 
+        data: [
 
+          {
 
+            name: "MG01_01",
 
+            v1: {
 
+              v1: 12,
 
+              v2: 0,
 
+            },
 
+            v2: {
 
+              v1: 0,
 
+              v2: 0,
 
+            },
 
+            v3: {
 
+              v1: 0,
 
+              v2: 0,
 
+            },
 
+            v4: {
 
+              v1: 87,
 
+              v2: 123,
 
+            },
 
+            v5: {
 
+              v1: 0,
 
+              v2: 0,
 
+            },
 
+            v6: {
 
+              v1: 7,
 
+              v2: 343,
 
+            },
 
+            v7: {
 
+              v1: 0,
 
+              v2: 0,
 
+            },
 
+            v8: {
 
+              v1: 0,
 
+              v2: 0,
 
+            },
 
+            v9: {
 
+              v1: 0,
 
+              v2: 0,
 
+            },
 
+          },
 
+        ],
 
+      },
 
+    };
 
+  },
 
+  methods: {
 
+    tabSelect(tab) {},
 
+  },
 
+  created() {
 
+    for (let i = 1; i < 40; i++) {
 
+      this.tableData.data.push(JSON.parse(JSON.stringify(this.tableData.data[0])));
 
+    }
 
+  },
 
+};
 
+</script>
 
+
 
+<style lang="less">
 
+.alarm-center-1 {
 
+  .action-bar {
 
+    display: flex;
 
+
 
+    .query {
 
+      justify-content: flex-start;
 
+    }
 
+  }
 
+
 
+  .table-panel {
 
+    width: 100%;
 
+    background: transparent;
 
+    padding: 0;
 
+
 
+    .bar {
 
+      display: flex;
 
+      align-items: center;
 
+      height: 16px;
 
+      margin: 8px 0;
 
+
 
+      .bar-percent {
 
+        height: 100%;
 
+        background: @green;
 
+        margin-right: 8px;
 
+      }
 
+    }
 
+  }
 
+}
 
+</style>

+ 227 - 77
src/views/NewPages/dj1.vue
View File 

@@ -48,7 +48,8 @@
 
           :areaData="LostChartBgColorData" :showLegend="true" />
 
       </panel>
 
       <panel :title="'电量'" class="mg-b-16">
 
-        <multiple-bar-line-chart :height="'16.6667vh'" :barData="powerChartData" :lineData="powerChartLineData" :units="['(kWh)']" :showLegend="true" />
 
+        <multiple-bar-line-chart :height="'16.6667vh'" :barData="powerChartData" :lineData="powerChartLineData" :units="['(kWh)']"
 
+          :showLegend="true" />
 
       </panel>
 
       <div class="table-info">
 
         <panel class="table-panel" :title="'当日报警记录'" :showLine="false">
 
@@ -299,35 +300,35 @@
 
       </el-row>
 
       <el-row>
 
         <el-col :span="8">
 
-          <panel :title="'日最大风速'" class="radar-panel" :icon="'svg-wind-site'">
 
+          <panel :title="'日风向频率'" class="radar-panel" :icon="'svg-wind-site'">
 
             <div class="wind-info">
 
               <div class="legend mg-r-16">
 
                 <span class="dot"></span>
 
-                <span>静风频率为2</span>
 
+                <span>{{rfxplStr}}</span>
 
               </div>
 
-              <direction-radar-chart :width="'100%'" :height="'350px'" />
 
+              <direction-radar-chart :width="'100%'" :height="'350px'" :value="rfxplData" />
 
             </div>
 
           </panel>
 
         </el-col>
 
         <el-col :span="8">
 
-          <panel :title="'日最大风速'" class="radar-panel" :icon="'svg-wind-site'">
 
+          <panel :title="'月风向频率'" class="radar-panel" :icon="'svg-wind-site'">
 
             <div class="wind-info">
 
               <div class="legend mg-r-16">
 
                 <span class="dot"></span>
 
-                <span>静风频率为2</span>
 
+                <span>{{yfxplStr}}</span>
 
               </div>
 
-              <direction-radar-chart :width="'100%'" :height="'350px'" />
 
+              <direction-radar-chart :width="'100%'" :height="'350px'" :value="yfxplData" />
 
             </div>
 
           </panel>
 
         </el-col>
 
         <el-col :span="8">
 
-          <panel :title="'日最大风速'" class="radar-panel" :icon="'svg-wind-site'">
 
+          <panel :title="'年风向频率'" class="radar-panel" :icon="'svg-wind-site'">
 
             <div class="wind-info">
 
               <div class="legend mg-r-16">
 
                 <span class="dot"></span>
 
-                <span>静风频率为2</span>
 
+                <span>{{nfxplStr}}</span>
 
               </div>
 
-              <direction-radar-chart :width="'100%'" :height="'350px'" />
 
+              <direction-radar-chart :width="'100%'" :height="'350px'" :value="nfxplData" />
 
             </div>
 
           </panel>
 
         </el-col>
 
@@ -338,35 +339,109 @@
 
     <div v-if="tabIndex == 3" class="tab-4">
 
       <el-row>
 
         <el-col :span="8">
 
-          <panel title="日度损失电量分析">
 
-            <dual-pie-chart height="350px" />
 
+          <panel :title="'日最大风速'" class="radar-panel" :icon="'svg-wind-site'">
 
+            <div class="wind-info">
 
+              <div class="legend mg-r-16">
 
+                <span class="dot"></span>
 
+                <span>{{rzdfsStr}}</span>
 
+              </div>
 
+              <direction-radar-chart :width="'100%'" :height="'350px'" :value="rzdfsData" />
 
+            </div>
 
           </panel>
 
         </el-col>
 
         <el-col :span="8">
 
-          <panel title="日度损失电量分析">
 
-            <dual-pie-chart height="350px" />
 
+          <panel :title="'月最大风速'" class="radar-panel" :icon="'svg-wind-site'">
 
+            <div class="wind-info">
 
+              <div class="legend mg-r-16">
 
+                <span class="dot"></span>
 
+                <span>{{yzdfsStr}}</span>
 
+              </div>
 
+              <direction-radar-chart :width="'100%'" :height="'350px'" :value="yzdfsData" />
 
+            </div>
 
           </panel>
 
         </el-col>
 
         <el-col :span="8">
 
-          <panel title="日度损失电量分析">
 
-            <dual-pie-chart height="350px" />
 
+          <panel :title="'年最大风速'" class="radar-panel" :icon="'svg-wind-site'">
 
+            <div class="wind-info">
 
+              <div class="legend mg-r-16">
 
+                <span class="dot"></span>
 
+                <span>{{nzdfsStr}}</span>
 
+              </div>
 
+              <direction-radar-chart :width="'100%'" :height="'350px'" :value="nzdfsData" />
 
+            </div>
 
           </panel>
 
         </el-col>
 
       </el-row>
 
       <el-row>
 
         <el-col :span="8">
 
-          <panel title="日度损失电量分析">
 
-            <dual-pie-chart height="350px" />
 
+          <panel :title="'日风向频率'" class="radar-panel" :icon="'svg-wind-site'">
 
+            <div class="wind-info">
 
+              <div class="legend mg-r-16">
 
+                <span class="dot"></span>
 
+                <span>{{rfxplStr}}</span>
 
+              </div>
 
+              <direction-radar-chart :width="'100%'" :height="'350px'" :value="rfxplData" />
 
+            </div>
 
           </panel>
 
         </el-col>
 
         <el-col :span="8">
 
-          <panel title="日度损失电量分析">
 
-            <dual-pie-chart height="350px" />
 
+          <panel :title="'月风向频率'" class="radar-panel" :icon="'svg-wind-site'">
 
+            <div class="wind-info">
 
+              <div class="legend mg-r-16">
 
+                <span class="dot"></span>
 
+                <span>{{yfxplStr}}</span>
 
+              </div>
 
+              <direction-radar-chart :width="'100%'" :height="'350px'" :value="yfxplData" />
 
+            </div>
 
           </panel>
 
         </el-col>
 
         <el-col :span="8">
 
-          <panel title="日度损失电量分析">
 
-            <dual-pie-chart height="350px" />
 
+          <panel :title="'年风向频率'" class="radar-panel" :icon="'svg-wind-site'">
 
+            <div class="wind-info">
 
+              <div class="legend mg-r-16">
 
+                <span class="dot"></span>
 
+                <span>{{nfxplStr}}</span>
 
+              </div>
 
+              <direction-radar-chart :width="'100%'" :height="'350px'" :value="nfxplData" />
 
+            </div>
 
+          </panel>
 
+        </el-col>
 
+      </el-row>
 
+    </div>
 
+
 
+    <!-- tab5 -->
 
+    <div v-if="tabIndex == 4" class="tab-5">
 
+      <el-row>
 
+        <el-col :span="8">
 
+          <panel title="日小风切入">
 
+            <dual-pie-chart height="350px" :innerData="dayWindPieData" :outerData="dayWindPieData" />
 
+          </panel>
 
+        </el-col>
 
+        <el-col :span="8">
 
+          <panel title="月小风切入">
 
+            <dual-pie-chart height="350px" :innerData="monthWindPieData" :outerData="monthWindPieData" />
 
+          </panel>
 
+        </el-col>
 
+        <el-col :span="8">
 
+          <panel title="年小风切入">
 
+            <dual-pie-chart height="350px" :innerData="yearWindPieData" :outerData="myearWindPieData" />
 
+          </panel>
 
+        </el-col>
 
+      </el-row>
 
+      <el-row>
 
+        <el-col :span="8">
 
+          <panel title="日小风停机">
 
+            <dual-pie-chart height="350px" :innerData="dayStopPieData" :outerData="dayStopPieData" />
 
+          </panel>
 
+        </el-col>
 
+        <el-col :span="8">
 
+          <panel title="月小风停机">
 
+            <dual-pie-chart height="350px" :innerData="monthStopPieData" :outerData="monthStopPieData" />
 
+          </panel>
 
+        </el-col>
 
+        <el-col :span="8">
 
+          <panel title="年小风停机">
 
+            <dual-pie-chart height="350px" :innerData="yearStopPieData" :outerData="yearStopPieData" />
 
           </panel>
 
         </el-col>
 
       </el-row>
 
@@ -387,7 +462,7 @@ export default {
 
   setup () { },
 
   data () {
 
     return {
 
-      tabIndex: 1,
 
+      tabIndex: 4,
 
       tableData: {
 
         column: [
 
           {
 
@@ -521,10 +596,10 @@ export default {
 
 
       powerLineChartData: [{
 
         title: "",
 
-        value:[]
 
+        value: []
 
       }],
 
 
-      dayPowerInfo:{},
 
+      dayPowerInfo: {},
 
 
       monthWarnRecordData: {
 
         column: [
 
@@ -544,47 +619,75 @@ export default {
 
         data: []
 
       },
 
 
-      jfplStr:"",
 
+      jfplStr: "",
 
       windResourcesData: {
 
         indicator: ["N0", "N1", "N2", "N3", "N4", "N5"],
 
         data: [{
 
-            value: [44200, 14200, 20000, 35000, 50000, 38000],
 
-            name: ""
 
-          }]
 
+          value: [44200, 14200, 20000, 35000, 50000, 38000],
 
+          name: ""
 
+        }]
 
       },
 
 
-      rzdfsStr:"",
 
+      rzdfsStr: "",
 
       rzdfsData: {
 
         indicator: ["N0", "N1", "N2", "N3", "N4", "N5"],
 
         data: [{
 
-            value: [44200, 14200, 20000, 35000, 50000, 38000],
 
-            name: ""
 
-          }]
 
+          value: [44200, 14200, 20000, 35000, 50000, 38000],
 
+          name: ""
 
+        }]
 
       },
 
 
-      yzdfsStr:"",
 
+      yzdfsStr: "",
 
       yzdfsData: {
 
         indicator: ["N0", "N1", "N2", "N3", "N4", "N5"],
 
         data: [{
 
-            value: [44200, 14200, 20000, 35000, 50000, 38000],
 
-            name: ""
 
-          }]
 
+          value: [44200, 14200, 20000, 35000, 50000, 38000],
 
+          name: ""
 
+        }]
 
       },
 
 
-      nzdfsStr:"",
 
+      nzdfsStr: "",
 
       nzdfsData: {
 
         indicator: ["N0", "N1", "N2", "N3", "N4", "N5"],
 
         data: [{
 
-            value: [44200, 14200, 20000, 35000, 50000, 38000],
 
-            name: ""
 
-          }]
 
+          value: [44200, 14200, 20000, 35000, 50000, 38000],
 
+          name: ""
 
+        }]
 
       },
 
 
-      value1: [],
 
-      value2: [],
 
-      value3: [],
 
-      value4: "",
 
-      value5: "",
 
+      rfxplStr: "",
 
+      rfxplData: {
 
+        indicator: ["N0", "N1", "N2", "N3", "N4", "N5"],
 
+        data: [{
 
+          value: [44200, 14200, 20000, 35000, 50000, 38000],
 
+          name: ""
 
+        }]
 
+      },
 
+
 
+      yfxplStr: "",
 
+      yfxplData: {
 
+        indicator: ["N0", "N1", "N2", "N3", "N4", "N5"],
 
+        data: [{
 
+          value: [44200, 14200, 20000, 35000, 50000, 38000],
 
+          name: ""
 
+        }]
 
+      },
 
+
 
+      nfxplStr: "",
 
+      nfxplData: {
 
+        indicator: ["N0", "N1", "N2", "N3", "N4", "N5"],
 
+        data: [{
 
+          value: [44200, 14200, 20000, 35000, 50000, 38000],
 
+          name: ""
 
+        }]
 
+      },
 
+
 
+      dayWindPieData: [],
 
+      monthWindPieData: [],
 
+      yearWindPieData: [],
 
+      dayStopPieData: [],
 
+      monthStopPieData: [],
 
+      yearStopPieData: []
 
     };
 
   },
 
   methods: {
 
@@ -596,7 +699,7 @@ export default {
 
         subUrl: "powercompare/windfarmAjax",
 
         success (res) {
 
           that.wpArray = res.data;
 
-          that.wpId = res.data[0].id;
 
+          that.wpId = that.wpId || res.data[0].id;
 
           that.getWtArray(that.wpId, true);
 
         }
 
       });
 
@@ -614,7 +717,10 @@ export default {
 
           },
 
           success (res) {
 
             that.wtArray = res.data;
 
-            that.wtId = res.data[0].id;
 
+            const findRes = res.data.some(ele => {
 
+              return ele.id === that.wtId;
 
+            });
 
+            that.wtId = (findRes ? that.wtId : res.data[0].id);
 
             if (keepRequest) {
 
               that.search();
 
             }
 
@@ -796,11 +902,6 @@ export default {
 
       });
 
     },
 
 
-    tabSelect (index) {
 
-      this.tabIndex = index;
 
-      this.search();
 
-    },
 
-
 
     // tab2 - 获取日发电量信息
 
     getDayPowerInfo () {
 
       let that = this;
 
@@ -848,17 +949,17 @@ export default {
 
 
           let powerLineChartData = [{
 
             title: "实际拟合功率",
 
-            value:[]
 
-          },{
 
+            value: []
 
+          }, {
 
             title: "最优拟合功率",
 
-            value:[]
 
-          },{
 
+            value: []
 
+          }, {
 
             title: "保证功率",
 
-            value:[]
 
+            value: []
 
           }];
 
 
-          keyArray.forEach((keyEle,keyIndex) =>{
 
-            res.data.forEach((ele,index)=>{
 
+          keyArray.forEach((keyEle, keyIndex) => {
 
+            res.data.forEach((ele, index) => {
 
               powerLineChartData[keyIndex].value.push({
 
                 text: (index + 1),
 
                 value: ele[keyEle]
 
@@ -872,7 +973,7 @@ export default {
 
     },
 
 
     // tab2 - 获取当月报警排行
 
-    getWindResources  () {
 
+    getWindResources () {
 
       let that = this;
 
       that.API.requestData({
 
         method: "POST",
 
@@ -882,7 +983,7 @@ export default {
 
           recorddate: that.recorddate
 
         },
 
         success (res) {
 
-          that.jfplStr=res.data.jfpl || "";
 
+          that.jfplStr = res.data.jfpl || "";
 
 
           let windResourcesData = {
 
             indicator: [],
 
@@ -902,18 +1003,15 @@ export default {
 
       });
 
     },
 
 
-    // tab3 - 获取玫瑰图
 
-    getMgt (subUrl, dataKey) {
 
+    // tab3,tab4 - 获取玫瑰图
 
+    getMgt (subUrl, data, dataKey) {
 
       let that = this;
 
       that.API.requestData({
 
         method: "POST",
 
         subUrl,
 
-        data: {
 
-          wpId: that.wpId,
 
-          recorddate: that.recorddate
 
-        },
 
+        data,
 
         success (res) {
 
-          that[dataKey + "Str"] = res.data.jfpl || "";
 
+          that[dataKey.split("Data")[0] + "Str"] = res.data.jfpl || "";
 
 
           let mgtData = {
 
             indicator: [],
 
@@ -923,20 +1021,50 @@ export default {
 
             }]
 
           };
 
 
-          if(res.data.data){
 
+          if (res.data.data) {
 
             res.data.data.forEach((ele) => {
 
               mgtData.indicator.push(ele.name);
 
               mgtData.data[0].value.push(ele.data1);
 
             });
 
           }
 
 
-          that[dataKey + "Data"] = mgtData;
 
+          that[dataKey] = mgtData;
 
+        }
 
+      });
 
+    },
 
+
 
+    // tab5 - 获取饼图
 
+    getPieChart (subUrl, type, dataKey) {
 
+      let that = this;
 
+      that.API.requestData({
 
+        method: "POST",
 
+        subUrl,
 
+        data: {
 
+          wtId: that.wtId,
 
+          recorddate: that.recorddate,
 
+          type,
 
+        },
 
+        success (res) {
 
+          let pieChart = [];
 
+
 
+          res.data.forEach(ele => {
 
+            pieChart.push({
 
+              name: ele.name,
 
+              value: ele.value2,
 
+              unit: "(m/s)"
 
+            });
 
+          });
 
 
-          console.log(dataKey,mgtData)
 
+          that[dataKey] = pieChart;
 
         }
 
       });
 
     },
 
 
+    // 切换tab 
+    tabSelect (index) {
 
+      this.tabIndex = index;
 
+      this.search();
 
+    },
 
 
     // 搜索
 
     search () {
 
@@ -954,14 +1082,35 @@ export default {
 
         this.getPowerLineChartData();
 
         this.getWindResources();
 
       } else if (this.tabIndex === 2) {
 
-        this.getMgt("goodness/wprzdfs", "rzdfs");
 
-        this.getMgt("goodness/wpyzdfs", "yzdfs");
 
-        this.getMgt("goodness/wpnzdfs", "nzdfs");
 
+        const xhrParam = { wpId: this.wpId, recorddate: this.recorddate };
 
+        this.getMgt("goodness/wprzdfs", xhrParam, "rzdfsData");
 
+        this.getMgt("goodness/wpyzdfs", xhrParam, "yzdfsData");
 
+        this.getMgt("goodness/wpnzdfs", xhrParam, "nzdfsData");
 
+        this.getMgt("goodness/wprfxpl", xhrParam, "rfxplData");
 
+        this.getMgt("goodness/wpyfxpl", xhrParam, "yfxplData");
 
+        this.getMgt("goodness/wpnfxpl", xhrParam, "nfxplData");
 
+      } else if (this.tabIndex === 3) {
 
+        const xhrParam = { wtId: this.wtId, recorddate: this.recorddate };
 
+        this.getMgt("goodness/wtrzdfs", xhrParam, "rzdfsData");
 
+        this.getMgt("goodness/wtyzdfs", xhrParam, "yzdfsData");
 
+        this.getMgt("goodness/wtnzdfs", xhrParam, "nzdfsData");
 
+        this.getMgt("goodness/wtrfxpl", xhrParam, "rfxplData");
 
+        this.getMgt("goodness/wtyfxpl", xhrParam, "yfxplData");
 
+        this.getMgt("goodness/wtnfxpl", xhrParam, "nfxplData");
 
+      } else if (this.tabIndex === 4) {
 
+        this.getPieChart("goodness/pieChart", "1", "dayWindPieData");
 
+        this.getPieChart("goodness/pieChart", "2", "monthWindPieData");
 
+        this.getPieChart("goodness/pieChart", "3", "yearWindPieData");
 
+        this.getPieChart("goodness/pieChart", "4", "dayStopPieData");
 
+        this.getPieChart("goodness/pieChart", "5", "monthStopPieData");
 
+        this.getPieChart("goodness/pieChart", "6", "yearStopPieData");
 
       }
 
     }
 
   },
 
   created () {
 
     this.getWpArray();
 
+    this.wpId = this.$route.params.wpId || "";
 
+    this.wtId = this.$route.params.wtId || "";
 
   },
 
 };
 
 </script>
 
@@ -1126,7 +1275,8 @@ export default {
 
     }
 
   }
 
 
-  .tab-3 {
 
+  .tab-3,
 
+  .tab-4 {
 
     .wind-info {
 
       position: relative;
 
 
@@ -1154,7 +1304,7 @@ export default {
 
     }
 
   }
 
 
-  .tab-4 {
 
+  .tab-5 {
 
     .panel-body {
 
       padding: 16px;
 
     }

+ 5 - 4
src/views/NewPages/fdlyl.vue
View File 

@@ -365,25 +365,27 @@ export default {
 
             let monthsAll = []
 
             _this.GsList.map(item => {
 
               let objs = {}
 
+              let obj = {}
 
               monthsAll.push(item.month)
 
               if (item.month > 10) {
 
                 objs.text = item.month.toString()
 
+                obj.text = item.month.toString()
 
               } else {
 
                 item.text = '0'+ item.month
 
                 objs.text = item.text
 
+                obj.text = item.text
 
               }
 
               for (let key in item) {
 
                 if (key === 'current') {
 
                   objs.value = item.current
 
                   nowCureent.push(objs)
 
                 } else if (key === 'sameperiod'){
 
-                  objs.value = item.sameperiod
 
-                  sameCureent.push(objs)
 
+                  obj.value = item.sameperiod
 
+                  sameCureent.push(obj)
 
                 }
 
                 
               }
 
             })
 
-            console.log(nowCureent)
 
             _this.monthData = monthsAll
 
             _this.DayPower = {
 
               // 图表所用单位
 
@@ -404,7 +406,6 @@ export default {
 
               ],
 
             }
 
 
-            console.log(111,_this.DayPower)
 
             // _this.DayPower = {
 
             //   // 图表所用单位
 
             //   units: [""],

+ 542 - 0
src/views/NewPages/history-search.vue
View File 

@@ -0,0 +1,542 @@
 
+<template>
 
+  <div class="searchPage1">
 
+    <div class="query mg-b-8">
 
+      <div class="query-items">
 
+        <div class="query-item">
 
+          <div class="lable">日期：</div>
 
+          <div class="search-input">
 
+            <el-date-picker size="medium" v-model="form.dateArea" type="datetimerange" :picker-options="pickerOptions" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" align="right"> </el-date-picker>
 
+          </div>
 
+        </div>
 
+        <div class="query-item">
 
+          <div class="lable">间隔：</div>
 
+          <div class="search-input">
 
+            <el-input-number v-model="form.interval" controls-position="right"></el-input-number>
 
+          </div>
 
+        </div>
 
+        <div class="query-item">
 
+          <div class="lable"></div>
 
+          <div class="search-input">
 
+            <transition name="el-zoom-in-center">
 
+              <el-radio-group v-model="form.type" size="small" v-show="form.interval">
 
+                <el-radio label="0" @click.prevent="getRadio('0')">最大</el-radio>
 
+                <el-radio label="1" @click.prevent="getRadio('1')">最小</el-radio>
 
+                <el-radio label="2" @click.prevent="getRadio('2')">平均</el-radio>
 
+              </el-radio-group>
 
+            </transition>
 
+          </div>
 
+        </div>
 
+      </div>
 
+      <div class="query-actions">
 
+        <button class="btn green" @click="renderCharts">生成曲线</button>
 
+      </div>
 
+    </div>
 
+    <div class="cardBox">
 
+      <el-card class="box-card">
 
+        <template v-slot:header class="clearfix">
 
+          <span>类型</span>
 
+          <!-- <el-button style="float: right; padding: 3px 0" type="text">操作按钮</el-button> -->
 
+        </template>
 
+        <div>
 
+          <el-radio-group
 
+            v-model="form.fjType"
 
+            size="small"
 
+            @change="
 
+              (fjType) => {
 
+                resetForm();
 
+              }
 
+            "
 
+          >
 
+            <el-form ref="form" :model="form">
 
+              <el-form-item style="margin-bottom:5px;">
 
+                <el-radio border size="medium" label="1">单风机多参数对比</el-radio>
 
+              </el-form-item>
 
+              <el-form-item style="margin-bottom:5px;">
 
+                <el-radio border size="medium" label="2">多风机单参数对比</el-radio>
 
+              </el-form-item>
 
+            </el-form>
 
+          </el-radio-group>
 
+        </div>
 
+      </el-card>
 
+      <el-card class="box-card">
 
+        <template v-slot:header class="clearfix">
 
+          <span>设备结构</span>
 
+        </template>
 
+        <div>
 
+          <div class="treeBox">
 
+            <el-input size="small" placeholder="输入以检索" :disabled="!treeData.length" v-model="filterText"></el-input>
 
+            <el-tree ref="treeRef" node-key="id" :data="treeData" :props="treeProps" :show-checkbox="true" :highlight-current="true" :filter-node-method="filterNode" @check-change="getTreeChecked"></el-tree>
 
+          </div>
 
+        </div>
 
+      </el-card>
 
+      <el-card class="box-card">
 
+        <template v-slot:header class="clearfix">
 
+          <span>关键参数</span>
 
+        </template>
 
+        <div class="selectBox treeBox">
 
+          <el-input size="small" placeholder="输入以检索" :disabled="!gjcsOptions.length" v-model="filterText1"></el-input>
 
+          <el-tree ref="treeRef1" node-key="code" :data="gjcsOptions" :props="{ children: null, label: 'description' }" :show-checkbox="true" :highlight-current="true" :filter-node-method="filterNode1" @check-change="getTreeChecked1"></el-tree>
 
+          <!-- <el-select style="width:100%;" v-model="form.gjcs" filterable clearable :multiple="!treeIsMultiple"
 
+            placeholder="输入以检索" @change="(res) => { this.$forceUpdate(); }">
 
+            <el-option v-for="item in gjcsOptions" :key="item.id" :label="item.description" :value="item.code">
 
+            </el-option>
 
+          </el-select> -->
 
+        </div>
 
+      </el-card>
 
+    </div>
 
+    <div class="chartsBox">
 
+      <div id="lineChart" style="width:100%;height:100%;"></div>
 
+    </div>
 
+  </div>
 
+</template>
 
+
 
+<script>
 
+import * as echarts from "echarts";
 
+
 
+export default {
 
+  data() {
 
+    return {
 
+      form: {
 
+        pointId: "",
 
+        pointName: "",
 
+        autoReq: false,
 
+        dateArea: [this.fmtDate(new Date(new Date().setTime(new Date().getTime() - 3600 * 1000 * 24))), this.fmtDate(new Date())],
 
+        interval: "",
 
+        type: "",
 
+        fjType: "1",
 
+        gjcs: "",
 
+      },
 
+
 
+      treeIsMultiple: false,
 
+      filterText: "",
 
+      filterText1: "",
 
+
 
+      treeData: [
 
+        {
 
+          id: 1,
 
+          label: "一级 2",
 
+          children: [
 
+            {
 
+              id: 3,
 
+              label: "二级 2-1",
 
+              children: [
 
+                {
 
+                  id: 4,
 
+                  label: "三级 3-1-1",
 
+                },
 
+                {
 
+                  id: 5,
 
+                  label: "三级 3-1-2",
 
+                  disabled: true,
 
+                },
 
+              ],
 
+            },
 
+            {
 
+              id: 2,
 
+              label: "二级 2-2",
 
+              disabled: true,
 
+              children: [
 
+                {
 
+                  id: 6,
 
+                  label: "三级 3-2-1",
 
+                },
 
+                {
 
+                  id: 7,
 
+                  label: "三级 3-2-2",
 
+                  disabled: true,
 
+                },
 
+              ],
 
+            },
 
+          ],
 
+        },
 
+      ],
 
+      gjcsOptions: [],
 
+
 
+      treeProps: {
 
+        children: "children",
 
+        label: "label",
 
+      },
 
+
 
+      pickerOptions: {
 
+        shortcuts: [
 
+          {
 
+            text: "最近一天",
 
+            onClick(picker) {
 
+              const end = new Date();
 
+              const start = new Date();
 
+              start.setTime(start.getTime() - 3600 * 1000 * 24);
 
+              picker.$emit("pick", [start, end]);
 
+            },
 
+          },
 
+          {
 
+            text: "最近一周",
 
+            onClick(picker) {
 
+              const end = new Date();
 
+              const start = new Date();
 
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
 
+              picker.$emit("pick", [start, end]);
 
+            },
 
+          },
 
+          {
 
+            text: "最近一个月",
 
+            onClick(picker) {
 
+              const end = new Date();
 
+              const start = new Date();
 
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
 
+              picker.$emit("pick", [start, end]);
 
+            },
 
+          },
 
+          {
 
+            text: "最近三个月",
 
+            onClick(picker) {
 
+              const end = new Date();
 
+              const start = new Date();
 
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
 
+              picker.$emit("pick", [start, end]);
 
+            },
 
+          },
 
+        ],
 
+      },
 
+    };
 
+  },
 
+
 
+  mounted() {
 
+    let that = this;
 
+    that.$nextTick(() => {
 
+      that.getEquipmentStructure();
 
+      that.getEquipmentParams();
 
+    });
 
+  },
 
+
 
+  methods: {
 
+    // 获取设备结构
 
+    getEquipmentStructure() {
 
+      let that = this;
 
+      that.API.requestData({
 
+        baseURL: "http://10.155.32.4:8031/",
 
+        subUrl: "paramComparison/equipmentStructure",
 
+        timeout: 30000,
 
+        success(res) {
 
+          // 请求成功的回调
 
+          let treeData = [];
 
+
 
+          res.data.forEach((ele) => {
 
+            let findRes = treeData.find((findEle) => {
 
+              return ele.windpowerstationid === findEle.label;
 
+            });
 
+            if (!findRes) {
 
+              let treeTemp = {
 
+                label: ele.windpowerstationid,
 
+                children: [],
 
+              };
 
+              treeTemp.children.push({
 
+                label: ele.name,
 
+                id: ele.id,
 
+              });
 
+              treeData.push(treeTemp);
 
+            } else {
 
+              findRes.children.push({
 
+                label: ele.name,
 
+                id: ele.id,
 
+              });
 
+            }
 
+          });
 
+          that.treeData = treeData;
 
+        },
 
+      });
 
+    },
 
+
 
+    // 获取关键节点
 
+    getEquipmentParams() {
 
+      let that = this;
 
+      that.API.requestData({
 
+        baseURL: "http://10.155.32.4:8031/",
 
+        subUrl: "paramComparison/equipmentParams",
 
+        success(res) {
 
+          that.gjcsOptions = res.data;
 
+        },
 
+      });
 
+    },
 
+
 
+    // 获取单选结果
 
+    getRadio(type) {
 
+      if (type === this.form.type && this.form.type !== "") {
 
+        this.form.type = "";
 
+      } else {
 
+        this.form.type = type;
 
+      }
 
+    },
 
+
 
+    // 渲染图表
 
+    renderCharts() {
 
+      let that = this;
 
+      that.$nextTick(() => {
 
+        let begin = that.form.dateArea.length ? new Date(that.form.dateArea[0]).formatDate("yyyy-MM-dd hh:mm:ss") : "";
 
+        let end = that.form.dateArea.length ? new Date(that.form.dateArea[1]).formatDate("yyyy-MM-dd hh:mm:ss") : "";
 
+        let interval = that.form.interval;
 
+        let type = that.form.type;
 
+        let paramtype = that.form.fjType;
 
+        let wts = [];
 
+        let wtsArray = that.$refs.treeRef.getCheckedNodes();
 
+        let params = [];
 
+        let paramsArray = that.$refs.treeRef1.getCheckedNodes();
 
+        // let params = that.form.gjcs;
 
+
 
+        wtsArray.forEach((pEle) => {
 
+          if (pEle.id) {
 
+            wts.push(pEle.id);
 
+          } else {
 
+            pEle.children.forEach((cEle) => {
 
+              wts.push(cEle.id);
 
+            });
 
+          }
 
+        });
 
+
 
+        paramsArray.forEach((pEle) => {
 
+          params.push(pEle.code);
 
+        });
 
+
 
+        let data = {};
 
+        data.begin = begin;
 
+        data.end = end;
 
+        interval && (data.interval = interval);
 
+        type && (data.type = type);
 
+        data.paramtype = paramtype;
 
+        data.wts = wts.toString();
 
+        data.params = params.toString();
 
+
 
+        if (begin && end && paramtype && wts.length && params.length) {
 
+          that.API.requestData({
 
+            baseURL: "http://10.155.32.4:8031/",
 
+            subUrl: "paramComparison/generatingCurve",
 
+            timeout: 10000,
 
+            data,
 
+            success(res) {
 
+              if (res.data.length) {
 
+                let xAxisData = []; // x轴标题
 
+                let seriesData = []; // 折线图数据
 
+
 
+                let keyArray = [];
 
+
 
+                if (that.form.fjType === "1") {
 
+                  params.forEach((ele) => {
 
+                    let findRes = that.gjcsOptions.find((findEle) => {
 
+                      return ele === findEle.code;
 
+                    });
 
+                    keyArray.push(findRes.description);
 
+                  });
 
+                } else {
 
+                  wtsArray.forEach((pEle) => {
 
+                    if (pEle.id) {
 
+                      keyArray.push(pEle.label);
 
+                    } else {
 
+                      pEle.children.forEach((cEle) => {
 
+                        keyArray.push(cEle.label);
 
+                      });
 
+                    }
 
+                  });
 
+                }
 
+
 
+                keyArray.forEach((ele) => {
 
+                  seriesData.push({
 
+                    data: [],
 
+                    type: "line",
 
+                    smooth: true,
 
+                    name: ele,
 
+                  });
 
+                });
 
+
 
+                res.data.forEach((pEle) => {
 
+                  xAxisData.push(that.fmtDate(new Date(pEle.time)));
 
+                  keyArray.forEach((cEle, cIndex) => {
 
+                    seriesData[cIndex].data.push(pEle[cEle] || null);
 
+                  });
 
+                });
 
+
 
+                document.getElementById("lineChart").removeAttribute("_echarts_instance_");
 
+                let chartDom = document.getElementById("lineChart");
 
+                let myChart = echarts.init(chartDom);
 
+                let option = {
 
+                  xAxis: {
 
+                    type: "category",
 
+                    data: xAxisData,
 
+                  },
 
+                  yAxis: {
 
+                    type: "value",
 
+                  },
 
+                  series: seriesData,
 
+                  tooltip: {
 
+                    trigger: "axis",
 
+                    axisPointer: {
 
+                      type: "cross",
 
+                      label: {
 
+                        backgroundColor: "#6a7985",
 
+                      },
 
+                    },
 
+                  },
 
+                };
 
+                option && myChart.setOption(option);
 
+              } else {
 
+                that.BASE.showMsg({
 
+                  type: "warning",
 
+                  msg: "所选参数暂无数据，请切换参数后再次尝试",
 
+                });
 
+              }
 
+            },
 
+          });
 
+        } else {
 
+          that.BASE.showMsg({
 
+            msg: "无法生成，请检查 日期、设备结构与关键参数是否已选择",
 
+          });
 
+        }
 
+      });
 
+    },
 
+
 
+    // 过滤树形节点
 
+    filterNode(value, data) {
 
+      if (!value) return true;
 
+      return data.label.indexOf(value) !== -1;
 
+    },
 
+
 
+    // 过滤树形节点
 
+    filterNode1(value, data) {
 
+      if (!value) return true;
 
+      return data.description.indexOf(value) !== -1;
 
+    },
 
+
 
+    // 获取树形选中
 
+    getTreeChecked(data, checked, node) {
 
+      if (!this.treeIsMultiple) {
 
+        if (checked === true) {
 
+          this.checkedId = data.id;
 
+          this.$refs.treeRef.setCheckedKeys([data.id]);
 
+        } else {
 
+          if (this.checkedId == data.id) {
 
+            this.$refs.treeRef.setCheckedKeys([]);
 
+          }
 
+        }
 
+      }
 
+    },
 
+
 
+    // 获取树形选中
 
+    getTreeChecked1(data, checked, node) {
 
+      if (this.treeIsMultiple) {
 
+        if (checked === true) {
 
+          this.checkedId = data.code;
 
+          this.$refs.treeRef1.setCheckedKeys([data.code]);
 
+        } else {
 
+          if (this.checkedId == data.code) {
 
+            this.$refs.treeRef1.setCheckedKeys([]);
 
+          }
 
+        }
 
+      }
 
+    },
 
+
 
+    // 重置表单
 
+    resetForm() {
 
+      this.form.fjType === "1" ? (this.treeIsMultiple = false) : (this.treeIsMultiple = true);
 
+      this.$refs.treeRef.setCheckedKeys([]);
 
+      this.$refs.treeRef1.setCheckedKeys([]);
 
+      this.form.gjcs = "";
 
+      this.$forceUpdate();
 
+      document.getElementById("lineChart").removeAttribute("_echarts_instance_");
 
+      echarts.init(document.getElementById("lineChart"));
 
+    },
 
+
 
+    // 格式化日期
 
+    fmtDate(date) {
 
+      let curDate = date || new Date();
 
+      let year = curDate.getFullYear();
 
+      let mouth = curDate.getUTCMonth() + 1;
 
+      let day = curDate.getDate();
 
+      let hour = curDate.getHours();
 
+      let minutes = curDate.getMinutes();
 
+      let seconds = curDate.getSeconds();
 
+      return year + "-" + (mouth < 10 ? "0" + mouth : mouth) + "-" + (day < 10 ? "0" + day : day) + " " + (hour < 10 ? "0" + hour : hour) + ":" + (minutes < 10 ? "0" + minutes : minutes) + ":" + (seconds < 10 ? "0" + seconds : seconds);
 
+    },
 
+  },
 
+
 
+  watch: {
 
+    filterText(val) {
 
+      this.$refs.treeRef.filter(val);
 
+    },
 
+
 
+    filterText1(val) {
 
+      this.$refs.treeRef1.filter(val);
 
+    },
 
+  },
 
+};
 
+</script>
 
+<style lang="less" scoped>
 
+.searchBox1 {
 
+  width: 80%;
 
+  display: flex;
 
+  justify-content: start;
 
+  align-items: center;
 
+  position: relative;
 
+
 
+  .btnBox {
 
+    position: absolute;
 
+    left: calc(100% + 60px);
 
+    top: 0;
 
+    display: flex;
 
+    justify-content: start;
 
+    align-items: center;
 
+  }
 
+
 
+  .el-input {
 
+    width: 150px;
 
+  }
 
+}
 
+
 
+.cardBox {
 
+  width: 100%;
 
+  display: flex;
 
+  justify-content: space-between;
 
+  align-items: center;
 
+  margin-top: 20px;
 
+
 
+  .el-card {
 
+    width: 32%;
 
+    height: 255px;
 
+
 
+    .treeBox {
 
+      width: 100%;
 
+
 
+      .el-tree {
 
+        width: 100%;
 
+        height: 160px;
 
+        margin-top: 10px;
 
+        overflow-y: scroll;
 
+
 
+      
+      }
 
+    }
 
+  }
 
+}
 
+
 
+.selectBox {
 
+  .el-select {
 
+    max-height: 150px;
 
+    overflow-y: scroll;
 
+
 
+   
+  }
 
+}
 
+
 
+.chartsBox {
 
+  width: 100%;
 
+  height: 400px;
 
+}
 
+</style>
 
+<style lang="less">
 
+.cardBox {
 
+  .el-card__header {
 
+    padding: 5px 20px;
 
+  }
 
+
 
+  .el-card__body {
 
+    padding: 10px 20px;
 
+  }
 
+}
 
+</style>

+ 166 - 57
src/views/NewPages/knowledge-base.vue
View File 

@@ -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,81 +195,71 @@
 
               </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 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>
 
-            </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 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>
 
-            </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>
 
         </panel>
 
       </el-col>
 
@@ -199,7 +274,41 @@ 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>

+ 175 - 0
src/views/NewPages/power-forecast-2.vue
View File 

@@ -0,0 +1,175 @@
 
+<template>
 
+  <div class="power-forecast-2">
 
+    <div class="action-bar">
 
+      <div class="query mg-b-16">
 
+        <div class="query-items">
 
+          <div class="query-item">
 
+            <div class="lable">风场：</div>
 
+            <div class="search-input">
 
+              <el-select v-model="value1" clearable placeholder="请选择" popper-class="select">
 
+                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
 
+              </el-select>
 
+            </div>
 
+          </div>
 
+          <div class="query-item">
 
+            <div class="lable">开始日期：</div>
 
+            <div class="search-input">
 
+              <el-date-picker v-model="value2" type="date" placeholder="选择日期" popper-class="date-select"> </el-date-picker>
 
+            </div>
 
+          </div>
 
+          <div class="query-item">
 
+            <div class="lable">结束日期：</div>
 
+            <div class="search-input">
 
+              <el-date-picker v-model="value3" type="date" placeholder="选择日期" popper-class="date-select"> </el-date-picker>
 
+            </div>
 
+          </div>
 
+        </div>
 
+        <div class="query-actions">
 
+          <button class="btn green">搜索</button>
 
+        </div>
 
+      </div>
 
+      <div class="query" style="margin-left:32px">
 
+        <div class="query-items">
 
+          <div class="query-item">
 
+            <div class="lable">预测准确率：</div>
 
+            <div class="fj-lable">麻黄山 <span class="num">55%</span></div>
 
+          </div>
 
+        </div>
 
+      </div>
 
+    </div>
 
+    <panel :title="'功率预测对比'" class="mg-b-16" :showLine="false">
 
+      <normal-line-chart :smooth="false" :showLegend="true" :height="'200px'" />
 
+    </panel>
 
+    <panel :title="'功率预测对比'" class="mg-b-16" :showLine="false">
 
+      <table-2 :data="tableData" :height="'58vh'" />
 
+    </panel>
 
+  </div>
 
+</template>
 
+
 
+<script>
 
+import NormalLineChart from "../../components/chart/line/normal-line-chart.vue";
 
+import Panel from "../../components/coms/panel/panel.vue";
 
+import Table2 from "../../components/coms/table/table2.vue";
 
+export default {
 
+  components: { Panel, NormalLineChart, Table2 },
 
+  setup() {},
 
+  data() {
 
+    return {
 
+      options: [
 
+        {
 
+          value: "选项1",
 
+          label: "黄金糕",
 
+        },
 
+        {
 
+          value: "选项2",
 
+          label: "双皮奶",
 
+        },
 
+        {
 
+          value: "选项3",
 
+          label: "蚵仔煎",
 
+        },
 
+        {
 
+          value: "选项4",
 
+          label: "龙须面",
 
+        },
 
+        {
 
+          value: "选项5",
 
+          label: "北京烤鸭",
 
+        },
 
+      ],
 
+      value1: "",
 
+      value2: "",
 
+      value3: "",
 
+      tableData: {
 
+        column: [
 
+          {
 
+            name: "时间",
 
+            field: "name",
 
+            click: function(event, data) {
 
+              console.log(event);
 
+              console.log(data);
 
+            },
 
+          },
 
+          {
 
+            name: "预测风速",
 
+            field: "lqf",
 
+          },
 
+          {
 
+            name: "预测功率",
 
+            field: "yggl",
 
+          },
 
+          {
 
+            name: "实际风速",
 
+            field: "yyy",
 
+          },
 
+          {
 
+            name: "实际功率",
 
+            field: "pcspp",
 
+          },
 
+        ],
 
+        data: [
 
+          {
 
+            index: 1,
 
+            name: "MG01-01",
 
+            lqf: "0.1000",
 
+            yggl: "0.1000",
 
+            yyy: "0.10",
 
+            pcspp: "0.1000",
 
+            u1: "0.1000",
 
+            u2: "0.1000",
 
+            v1: "0.1000",
 
+            v2: "0.1000",
 
+            w1: "0.1000",
 
+            w2: "0.1000",
 
+            zca: "0.1000",
 
+            zcb: "0.1000",
 
+            clx: "0.1000",
 
+            clx1: "0.1000",
 
+            clx2: "0.1000",
 
+            jc: "0.1000",
 
+            hh: "0.1000",
 
+            hj: "0.1000",
 
+            is_light: false,
 
+          },
 
+        ],
 
+        total: 100,
 
+      },
 
+    };
 
+  },
 
+  created() {
 
+    for (let i = 1; i < 40; i++) {
 
+      this.tableData.data.push(JSON.parse(JSON.stringify(this.tableData.data[0])));
 
+      this.tableData.data[i].index = i + 1;
 
+      this.tableData.data[i].yyy = i * 0.01 * Math.random();
 
+    }
 
+  },
 
+};
 
+</script>
 
+
 
+<style lang="less">
 
+.power-forecast-2 {
 
+  .action-bar {
 
+    display: flex;
 
+
 
+    .query {
 
+      justify-content: flex-start;
 
+    }
 
+
 
+    .fj-lable {
 
+      height: 33px;
 
+      line-height: 33px;
 
+      padding: 0px 24px;
 
+      background: fade(@gray, 20);
 
+      font-size: 14px;
 
+      color: @gray-l;
 
+
 
+      .num {
 
+        margin-left: 12px;
 
+        font-family: @font-family-num;
 
+        font-size: 16px;
 
+        color: @green;
 
+      }
 
+    }
 
+  }
 
+}
 
+</style>

+ 4 - 4
src/views/NewPages/ztfx.vue
View File 

@@ -1549,22 +1549,22 @@
 
     <el-row :gutter="20" class="pie-chart-panel">
 
         <el-col :span="6">
 
             <panel title="当月理论平衡分析">
 
-              <dual-pie-chart height="27.296vh" :innerData=innerDataCurentsChart :outerData=innerDataCurentsChart />
 
+              <dual-pie-chart height="27.296vh" width="500px" :innerData=innerDataCurentsChart :outerData=innerDataCurentsChart />
 
             </panel>
 
           </el-col>
 
           <el-col :span="6">
 
             <panel title="同期理论平衡分析">
 
-              <dual-pie-chart height="27.296vh" :innerData=innerDataSameChart :outerData=innerDataSameChart />
 
+              <dual-pie-chart height="27.296vh" width="500px" :innerData=innerDataSameChart :outerData=innerDataSameChart />
 
             </panel>
 
           </el-col>
 
           <el-col :span="6">
 
             <panel title="当年理论平衡分析">
 
-              <dual-pie-chart height="27.296vh" :innerData=innerDataCurentsYearChart :outerData=innerDataCurentsYearChart />
 
+              <dual-pie-chart height="27.296vh" width="500px" :innerData=innerDataCurentsYearChart :outerData=innerDataCurentsYearChart />
 
             </panel>
 
           </el-col>
 
           <el-col :span="6">
 
             <panel title="年同期理论平衡分析">
 
-              <dual-pie-chart height="27.296vh" :innerData=innerDataSameYearChart :outerData=innerDataSameYearChart />
 
+              <dual-pie-chart height="27.296vh" width="500px" :innerData=innerDataSameYearChart :outerData=innerDataSameYearChart />
 
             </panel>
 
           </el-col>
 
       </el-row>

+ 13 - 0
src/views/SandTable/SandTable.vue
View File 

@@ -1,5 +1,7 @@
 
 <template>
 
     <div class="sand-table">
 
+        <img :src="require('@assets/png/3dback.png')" class="i3dback">
 
+        <StBack></StBack>
 
         <ThreeModel class="three-model-layer" @when="when"></ThreeModel>
 
         <div class="sand-table-left" v-if="showPanel">
 
             <PanelSand class="left-panel" title="板块标题" subTitle="AM10:52  实况">
 
@@ -96,6 +98,7 @@ import Weather from "./component/weather.vue";
 
 import ListBarChart2 from "@com/chart/bar/list-bar-chart2.vue";
 
 import PowerPlan from "./component/power-plan.vue";
 
 import PowerReview from "./component/power-review.vue";
 
+import StBack from "./component/st-back.vue";
 
 import Table from "@com/coms/table/table.vue";
 
 import RadarPieChart from "@com/chart/pie/radar-pie-chart.vue";
 
 
@@ -113,6 +116,7 @@ export default {
 
         PowerReview,
 
         Table,
 
         RadarPieChart,
 
+        StBack,
 
     },
 
     // 数据
 
     data() {
 
@@ -231,6 +235,15 @@ export default {
 
     height: 91.667vh;
 
     position: relative;
 
 
+    .i3dback {
 
+        position: fixed;
 
+        z-index: -1;
 
+        width: 100vw;
 
+        height: 100vh;
 
+        top: 0;
 
+        left: 0;
 
+    }
 
+
 
     .left-panel {
 
         width: 36.852vh;
 
     }

+ 297 - 9
src/views/SandTable/component/ThreeModel.vue
View File 

@@ -7,7 +7,113 @@
 
                 :id="htmlLayer[0].id"
 
                 v-show="htmlLayer[0].show"
 
                 :style="'left: ' + htmlLayer[0].x + 'px; top: ' + htmlLayer[0].y + 'px;'"
 
-            ></div>
 
+            >
 
+                <div class="fan-info-close" @click.stop="closeFanInfo">
 
+                    <i class="el-icon-close"></i>
 
+                </div>
 
+                <div class="fan-info-item">
 
+                    <span class="svg-icon svg-icon-gray-l svg-icon-sm">
 
+                        <svg-icon svgid="svg-风机" />
 
+                    </span>
 
+                    <span class="gray-l mg-l-8">接入</span>
 
+                    <span class="green num">176</span>
 
+                    <span class="green mg-l-8">台</span>
 
+                </div>
 
+                <div class="fan-info-item">
 
+                    <span class="svg-icon svg-icon-gray-l svg-icon-sm">
 
+                        <svg-icon svgid="svg-normal-power" />
 
+                    </span>
 
+                    <span class="gray-l mg-l-8">运行</span>
 
+                    <span class="green num">1</span>
 
+                    <span class="green mg-l-8">台</span>
 
+                </div>
 
+                <div class="fan-info-item">
 
+                    <span class="svg-icon svg-icon-gray-l svg-icon-sm">
 
+                        <svg-icon svgid="svg-standby" />
 
+                    </span>
 
+                    <span class="gray-l mg-l-8">待机</span>
 
+                    <span class="green num">1</span>
 
+                    <span class="green mg-l-8">台</span>
 
+                </div>
 
+                <div class="fan-info-item">
 
+                    <span class="svg-icon svg-icon-gray-l svg-icon-sm">
 
+                        <svg-icon svgid="svg-limit-power" />
 
+                    </span>
 
+                    <span class="gray-l mg-l-8">限电</span>
 
+                    <span class="green num">1</span>
 
+                    <span class="green mg-l-8">台</span>
 
+                </div>
 
+                <div class="fan-info-item">
 
+                    <span class="svg-icon svg-icon-gray-l svg-icon-sm">
 
+                        <svg-icon svgid="svg-gz-downtime" />
 
+                    </span>
 
+                    <span class="gray-l mg-l-8">故障</span>
 
+                    <span class="green num">1</span>
 
+                    <span class="green mg-l-8">台</span>
 
+                </div>
 
+                <div class="fan-info-item">
 
+                    <span class="svg-icon svg-icon-gray-l svg-icon-sm">
 
+                        <svg-icon svgid="svg-jx-downtime" />
 
+                    </span>
 
+                    <span class="gray-l mg-l-8">检修</span>
 
+                    <span class="green num">1</span>
 
+                    <span class="green mg-l-8">台</span>
 
+                </div>
 
+                <div class="fan-info-item">
 
+                    <span class="svg-icon svg-icon-gray-l svg-icon-sm">
 
+                        <svg-icon svgid="svg-offline" />
 
+                    </span>
 
+                    <span class="gray-l mg-l-8">离线</span>
 
+                    <span class="green num">1</span>
 
+                    <span class="green mg-l-8">台</span>
 
+                </div>
 
+                <div class="fan-info-item">
 
+                    <span class="svg-icon svg-icon-gray-l svg-icon-sm">
 
+                        <svg-icon svgid="svg-intranet-involvement" />
 
+                    </span>
 
+                    <span class="gray-l mg-l-8">受累</span>
 
+                    <span class="green num">1</span>
 
+                    <span class="green mg-l-8">台</span>
 
+                </div>
 
+            </div>
 
+            <div
 
+                class="three-html-dom build-info"
 
+                :id="htmlLayer[1].id"
 
+                v-show="htmlLayer[1].show"
 
+                :style="'left: ' + htmlLayer[1].x + 'px; top: ' + htmlLayer[1].y + 'px;'"
 
+            >
 
+                <div class="build-info-close" @click.stop="closeBuildInfo">
 
+                    <i class="el-icon-close"></i>
 
+                </div>
 
+                <div class="build-info-item blue" :style="'right: '+circleXY[0].x+'px; top: '+circleXY[0].y+'px'">
 
+                    <div class="build-info-item-num">97</div>
 
+                    <div class="build-info-item-text">综合厂</div>
 
+                </div>
 
+                <div class="build-info-item blue" :style="'right: '+circleXY[1].x+'px; top: '+circleXY[1].y+'px'">
 
+                    <div class="build-info-item-num">97</div>
 
+                    <div class="build-info-item-text">风能</div>
 
+                </div>
 
+                <div class="build-info-item green" :style="'right: '+circleXY[2].x+'px; top: '+circleXY[2].y+'px'">
 
+                    <div class="build-info-item-num">97</div>
 
+                    <div class="build-info-item-text">利用小时</div>
 
+                </div>
 
+                <div class="build-info-item purple" :style="'right: '+circleXY[3].x+'px; top: '+circleXY[3].y+'px'">
 
+                    <div class="build-info-item-num">97</div>
 
+                    <div class="build-info-item-text">评分</div>
 
+                </div>
 
+                <div class="build-info-item orange" :style="'right: '+circleXY[4].x+'px; top: '+circleXY[4].y+'px'">
 
+                    <div class="build-info-item-num">97</div>
 
+                    <div class="build-info-item-text">MTBF</div>
 
+                </div>
 
+                <div class="build-info-item yellow" :style="'right: '+circleXY[5].x+'px; top: '+circleXY[5].y+'px'">
 
+                    <div class="build-info-item-num">97</div>
 
+                    <div class="build-info-item-text">设备科</div>
 
+                </div>
 
+                <div class="build-info-item blue" :style="'right: '+circleXY[6].x+'px; top: '+circleXY[6].y+'px'">
 
+                    <div class="build-info-item-num">97</div>
 
+                    <div class="build-info-item-text">MTTR</div>
 
+                </div>
 
+            </div>
 
         </div>
 
     </div>
 
 </template>
 
@@ -17,16 +123,20 @@ import loading from "@com/coms/loading/loading.vue";
 
 import * as THREE from "three";
 
 import { GLTFLoader } from "@node/three/examples/jsm/loaders/GLTFLoader.js";
 
 import { OrbitControls } from "@node/three/examples/jsm/controls/OrbitControls.js";
 
+import { GeometryUtils } from "@node/three/examples/jsm/utils/GeometryUtils.js";
 
+import SvgIcon from "@com/coms/icon/svg-icon.vue";
 
 let camera, scene, renderer, controls;
 
 let mixers = [];
 
 let clock = new THREE.Clock();
 
 let fanAnimates = [];
 
+let cylinder = null;
 
 export default {
 
     // 名称
 
     name: "ThreeModel",
 
     // 使用组件
 
     components: {
 
         loading,
 
+        SvgIcon,
 
     },
 
     // 传入参数
 
     props: {},
 
@@ -48,7 +158,25 @@ export default {
 
                     oy: -50,
 
                     position: null,
 
                 },
 
+                {
 
+                    id: "build-info",
 
+                    x: 0,
 
+                    y: 0,
 
+                    show: false,
 
+                    ox: -300,
 
+                    oy: -50,
 
+                    position: null,
 
+                },
 
             ],
 
+            circleXY: [
 
+                { x: -(200*Math.sin(0/180*Math.PI)), y: -(200*Math.cos(0/180*Math.PI)) },
 
+                { x: -(200*Math.sin(-30/180*Math.PI)), y: -(200*Math.cos(-30/180*Math.PI)) },
 
+                { x: -(200*Math.sin(-60/180*Math.PI)), y: -(200*Math.cos(-60/180*Math.PI)) },
 
+                { x: -(200*Math.sin(-90/180*Math.PI)), y: -(200*Math.cos(-90/180*Math.PI)) },
 
+                { x: -(200*Math.sin(-120/180*Math.PI)), y: -(200*Math.cos(-120/180*Math.PI)) },
 
+                { x: -(200*Math.sin(-150/180*Math.PI)), y: -(200*Math.cos(-150/180*Math.PI)) },
 
+                { x: -(200*Math.sin(-180/180*Math.PI)), y: -(200*Math.cos(-180/180*Math.PI)) },
 
+            ]
 
         };
 
     },
 
     // 函数
 
@@ -175,8 +303,8 @@ export default {
 
             );
 
         },
 
         // 创建一个圆柱
 
-        initCylinderGeometry: function(position) {
 
-            let geometry = new THREE.CylinderGeometry(2, 2, 7, 64);
 
+        initCylinderGeometry: function(position, cr=2) {
 
+            let geometry = new THREE.CylinderGeometry(cr, cr, 7, 64);
 
             //加载纹理
 
             let texture = new THREE.TextureLoader().load("static/3d/beam-texture.png");
 
             texture.wrapS = texture.wrapT = THREE.RepeatWrapping; //每个都重复
 
@@ -202,13 +330,13 @@ export default {
 
                     side: THREE.DoubleSide,
 
                 }),
 
             ];
 
-            let cylinder = new THREE.Mesh(geometry, materials);
 
+            cylinder = new THREE.Mesh(geometry, materials);
 
             cylinder.position.set(position.x + 5.75, position.y + 8, position.z);
 
             scene.add(cylinder);
 
         },
 
         // 判断时候是可点击对象 返回null 或object
 
         getClickObject: function(intersects) {
 
-            const names = ["组840", "组857", "组838"];
 
+            const names = ["组833", "组840", "组857", "组838"];
 
             const x = true;
 
             let obj = null;
 
             for (let intersect of intersects) {
 
@@ -261,6 +389,38 @@ export default {
 
             this.htmlLayer[0].show = true;
 
             this.setEveryHTML();
 
         },
 
+        // 隐藏风机弹出层
 
+        hideFanInfo: function () {
 
+            this.htmlLayer[0].show = false;
 
+        },
 
+        // 显示楼信息弹出层
 
+        showBuildInfo: function(position) {
 
+            this.htmlLayer[1].position = {
 
+                x: position.x,
 
+                y: position.y,
 
+                z: position.z,
 
+            };
 
+            this.htmlLayer[1].show = true;
 
+            this.setEveryHTML();
 
+        },
 
+        // 隐藏楼信息弹出层
 
+        hideBuildInfo: function () {
 
+            this.htmlLayer[1].show = false;
 
+        },
 
+        // 关闭弹出
 
+        closeFanInfo: function () {
 
+            this.htmlLayer[0].show = false;
 
+            if (cylinder) {
 
+                scene.remove(cylinder);
 
+            }
 
+        },
 
+        // 关闭弹出
 
+        closeBuildInfo: function () {
 
+            this.htmlLayer[1].show = false;
 
+            if (cylinder) {
 
+                scene.remove(cylinder);
 
+            }
 
+        },
 
         // 点击事件
 
         clickEvent: function(event) {
 
             event.preventDefault();
 
@@ -268,15 +428,27 @@ export default {
 
             vector = vector.unproject(camera);
 
             let raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());
 
             let intersects = raycaster.intersectObjects(scene.children, true);
 
-            console.log(intersects);
 
+            // console.log(intersects); // 输出点击的对象信息
 
             // 找是否是可点击对象
 
             let obj = this.getClickObject(intersects);
 
             if (obj) {
 
-                console.log(obj);
 
-                this.initCylinderGeometry(obj.position);
 
-                this.showFanInfo(obj.position);
 
+                if (cylinder) {
 
+                    scene.remove(cylinder);
 
+                }
 
+                this.initCylinderGeometry(obj.position, obj.name == "组833" ? 4 : 2);
 
+                if (obj.name == "组833") {
 
+                    this.showBuildInfo(obj.position);
 
+                    this.hideFanInfo();
 
+                } else {
 
+                    this.showFanInfo(obj.position);
 
+                    this.hideBuildInfo();
 
+                }
 
             }
 
         },
 
+        // 初始化云
 
+        initCloud: function () {
 
+            
+        },
 
         // 初始化
 
         initThree: function() {
 
             this.initScene();
 
@@ -286,6 +458,7 @@ export default {
 
             this.initLight();
 
             this.initControls();
 
             this.initContent();
 
+            this.initCloud();
 
             renderer.setAnimationLoop(this.animate);
 
         },
 
         // 动画
 
@@ -331,6 +504,7 @@ export default {
 
 <style lang="less" scoped>
 
 .three-model {
 
     position: relative;
 
+    overflow: hidden;
 
 
     .three-html-layer {
 
         position: absolute;
 
@@ -344,11 +518,125 @@ export default {
 
         }
 
 
         .fan-info {
 
+            padding: 14px;
 
             width: 149px;
 
             height: 288px;
 
             background: #1a1f2fd8;
 
             border: 1px solid #05bb4c;
 
             box-shadow: 0px 8px 17px 1px #05bb4c66;
 
+
 
+            .fan-info-close {
 
+                position: absolute;
 
+                width: 20px;
 
+                height: 20px;
 
+                top: -10px;
 
+                right: -10px;
 
+                border-radius: 50%;
 
+                background: #1a1f2fd8;
 
+                border: 1px solid #05bb4c;
 
+                box-shadow: 0px 8px 17px 1px #05bb4c66;
 
+                cursor: pointer;
 
+                color: @gray-l;
 
+                transition: all 0.3s;
 
+                display: flex;
 
+                align-items: center;
 
+                justify-content: center;
 
+                font-size: 8px;
 
+
 
+                &:hover {
 
+                    color: #05bb4c;
 
+                }
 
+            }
 
+
 
+            .fan-info-item {
 
+
 
+                +.fan-info-item {
 
+                    margin-top: 13px;
 
+                }
 
+
 
+                .svg-icon {
 
+                    text-align: center;
 
+                }
 
+
 
+                .num {
 
+                    display: inline-block;
 
+                    width: 45px;
 
+                    text-align: right;
 
+                }
 
+            }
 
+        }
 
+
 
+        .build-info {
 
+            width: 400px;
 
+            height: 200px;
 
+            position: relative;
 
+
 
+            .build-info-close {
 
+                position: absolute;
 
+                width: 40px;
 
+                height: 40px;
 
+                top: 20px;
 
+                right: 20px;
 
+                border-radius: 50%;
 
+                background: #1a1f2fd8;
 
+                border: 1px solid #05bb4c;
 
+                box-shadow: 0px 8px 17px 1px #05bb4c66;
 
+                cursor: pointer;
 
+                color: @gray-l;
 
+                transition: all 0.3s;
 
+                display: flex;
 
+                align-items: center;
 
+                justify-content: center;
 
+                font-size: 14px;
 
+
 
+                &:hover {
 
+                    color: #05bb4c;
 
+                }
 
+            }
 
+
 
+            .build-info-item {
 
+                width: 72px;
 
+                height: 72px;
 
+                border-radius: 50%;
 
+                background: #1A1F2FE5;
 
+                position: absolute;
 
+
 
+                .build-info-item-num {
 
+                    font-size: 24px;
 
+                    font-weight: 500;
 
+                    color: #FFFFFF;
 
+                    text-align: center;
 
+                    line-height: 1.2;
 
+                    margin-top: 9px;
 
+                }
 
+
 
+                .build-info-item-text {
 
+                    font-size: 12px;
 
+                    color: #FFFFFF;
 
+                    font-weight: 400;
 
+                    text-align: center;
 
+                }
 
+
 
+                &.blue {
 
+                    border: 2px solid #1DA0D7;
 
+                }
 
+
 
+                &.green {
 
+                    border: 2px solid #05BB4C;
 
+                }
 
+
 
+                &.purple {
 
+                    border: 2px solid #323E6F;
 
+                }
 
+
 
+                &.orange {
 
+                    border: 2px solid #DB5520;
 
+                }
 
+
 
+                &.yellow {
 
+                    border: 2px solid #EDB32F;
 
+                }
 
+            }
 
         }
 
     }
 
 }

+ 150 - 0
src/views/SandTable/component/st-back.vue
View File 

@@ -0,0 +1,150 @@
 
+<template>
 
+    <div class="st-back">
 
+        <svg viewBox="0 0 872 872" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve">
 
+            <defs>
 
+                <polygon id="sjx-svg-def" points="13 0 26 22 0 22" fill="#F4DF6A"></polygon>
 
+                <rect id="cjx-svg-def" x="0" y="0" width="94" height="12" fill="#F4DF6A"></rect>
 
+            </defs>
 
+            <circle cx="436" cy="436" r="430" stroke="#2F3647" stroke-width="2" fill="none" stroke-dasharray="15,10">
 
+                <animateTransform
 
+                    attributeName="transform"
 
+                    attributeType="XML"
 
+                    type="rotate"
 
+                    from="359 436 436"
 
+                    to="0 436 436"
 
+                    dur="50s"
 
+                    repeatCount="indefinite"
 
+                />
 
+            </circle>
 
+            <circle cx="436" cy="436" r="270" stroke="#2F3647" stroke-width="70" fill="none" stroke-dasharray="500,50">
 
+                <animateTransform
 
+                    attributeName="transform"
 
+                    attributeType="XML"
 
+                    type="rotate"
 
+                    from="0 436 436"
 
+                    to="359 436 436"
 
+                    dur="25s"
 
+                    repeatCount="indefinite"
 
+                />
 
+            </circle>
 
+            <circle cx="436" cy="436" r="350" stroke="#2F3647" stroke-width="2" fill="none"></circle>
 
+            <use xlink:href="#sjx-svg-def" x="424" y="815">
 
+                <animateTransform
 
+                    attributeName="transform"
 
+                    attributeType="XML"
 
+                    type="rotate"
 
+                    from="0 436 436"
 
+                    to="359 436 436"
 
+                    dur="15s"
 
+                    repeatCount="indefinite"
 
+                />
 
+            </use>
 
+            <use xlink:href="#sjx-svg-def" x="75" y="245">
 
+                <animateTransform
 
+                    attributeName="transform"
 
+                    attributeType="XML"
 
+                    type="rotate"
 
+                    from="0 436 436"
 
+                    to="359 436 436"
 
+                    dur="15s"
 
+                    repeatCount="indefinite"
 
+                />
 
+            </use>
 
+            <use xlink:href="#sjx-svg-def" x="775" y="245">
 
+                <animateTransform
 
+                    attributeName="transform"
 
+                    attributeType="XML"
 
+                    type="rotate"
 
+                    from="0 436 436"
 
+                    to="359 436 436"
 
+                    dur="15s"
 
+                    repeatCount="indefinite"
 
+                />
 
+            </use>
 
+            <use xlink:href="#cjx-svg-def" x="390" y="778">
 
+                <animateTransform
 
+                    attributeName="transform"
 
+                    attributeType="XML"
 
+                    type="rotate"
 
+                    from="359 436 436"
 
+                    to="0 436 436"
 
+                    dur="15s"
 
+                    repeatCount="indefinite"
 
+                />
 
+            </use>
 
+            <use xlink:href="#cjx-svg-def" x="390" y="778">
 
+                <animateTransform
 
+                    attributeName="transform"
 
+                    attributeType="XML"
 
+                    type="rotate"
 
+                    from="135 436 436"
 
+                    to="-224 436 436"
 
+                    dur="15s"
 
+                    repeatCount="indefinite"
 
+                />
 
+            </use>
 
+            <use xlink:href="#cjx-svg-def" x="390" y="778">
 
+                <animateTransform
 
+                    attributeName="transform"
 
+                    attributeType="XML"
 
+                    type="rotate"
 
+                    from="225 436 436"
 
+                    to="-134 436 436"
 
+                    dur="15s"
 
+                    repeatCount="indefinite"
 
+                />
 
+            </use>
 
+        </svg>
 
+    </div>
 
+</template>
 
+
 
+<script>
 
+export default {
 
+    // 名称
 
+    name: "st-back",
 
+    // 使用组件
 
+    components: {},
 
+    // 数据
 
+    data() {
 
+        return {};
 
+    },
 
+    // 函数
 
+    methods: {},
 
+    // 生命周期钩子
 
+    beforeCreate() {
 
+        // 创建前
 
+    },
 
+    created() {
 
+        // 创建后
 
+    },
 
+    beforeMount() {
 
+        // 渲染前
 
+    },
 
+    mounted() {
 
+        // 渲染后
 
+    },
 
+    beforeUpdate() {
 
+        // 数据更新前
 
+    },
 
+    updated() {
 
+        // 数据更新后
 
+    },
 
+};
 
+</script>
 
+
 
+<style lang="less">
 
+.st-back {
 
+    width: 872px;
 
+    height: 872px;
 
+    position: fixed;
 
+    z-index: 0;
 
+    left: calc(50% - 436px);
 
+    top: calc(50% - 436px);
 
+    transform: rotateX(20deg);
 
+
 
+    svg {
 
+        width: 872px;
 
+        height: 872px;
 
+    }
 
+}
 
+</style>

+ 260 - 260
src/views/WindSite/pages/Home/Home.vue
View File 

@@ -1,237 +1,236 @@
 
 <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>
 
-    </div>
 
-    <row>
 
-      <Col :span="8">
 
+      <row>
 
+        <Col :span="8">
 
         <panel title="日度损失电量分析">
 
           <dual-pie-chart :innerData="pieChartData.dayData" :outerData="pieChartData.dayData" height="21.296vh" />
 
         </panel>
 
-      </Col>
 
-      <Col :span="8">
 
+        </Col>
 
+        <Col :span="8">
 
         <panel title="月度损失电量分析">
 
           <dual-pie-chart :innerData="pieChartData.monthData" :outerData="pieChartData.monthData" height="21.296vh" />
 
         </panel>
 
-      </Col>
 
-      <Col :span="8">
 
+        </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">
 
+        </Col>
 
+      </row>
 
+      <row>
 
+        <Col :span="8">
 
         <panel title="日度损失电量分析">
 
           <hover-bar-chart :list="dayLost" height="21.296vh" />
 
         </panel>
 
-      </Col>
 
-      <Col :span="8">
 
+        </Col>
 
+        <Col :span="8">
 
         <panel title="日发电量对比">
 
-          <multiple-bar-chart height="21.296vh" :list="CompleteElectricity.data" :units="CompleteElectricity.units" :showLegend="true" />
 
+          <multiple-bar-chart height="21.296vh" :list="CompleteElectricity.data" :units="CompleteElectricity.units"
 
+            :showLegend="true" />
 
         </panel>
 
-      </Col>
 
-      <Col :span="8">
 
+        </Col>
 
+        <Col :span="8">
 
         <panel title="月发电量对比">
 
           <normal-line-chart height="21.296vh" :list="MonthCompare.value" :units="MonthCompare.units" />
 
         </panel>
 
-      </Col>
 
-    </row>
 
+        </Col>
 
+      </row>
 
+    </div>
 
   </div>
 
 </template>
 
 
@@ -259,7 +258,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,
 
@@ -338,78 +337,78 @@ export default {
 
           },
 
         ],
 
       },
 
-       selectIndex:0,
 
-      rowIndex:0,
 
+      selectIndex: 0,
 
+      rowIndex: 0,
 
       btnGroupsss: [
 
-                {
 
-                    icon: "svg-wind-site",
 
-                    btns: [],
 
-                },
 
-                {
 
-                    icon: "svg-photovoltaic",
 
-                    btns: [],
 
-                },
 
-            ],
 
+        {
 
+          icon: "svg-wind-site",
 
+          btns: [],
 
+        },
 
+        {
 
+          icon: "svg-photovoltaic",
 
+          btns: [],
 
+        },
 
+      ],
 
     };
 
   },
 
   // 函数
 
   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: []
 
           }];
 
 
-          res.data.forEach((ele,index)=>{
 
-            if(ele.id.indexOf("FDC") !== -1){
 
+          res.data.forEach((ele, index) => {
 
+            if (ele.id.indexOf("FDC") !== -1) {
 
               btnGroups[0].btns.push({
 
-                text:ele.name,
 
-                code:ele.id
 
+                text: ele.name,
 
+                code: ele.id
 
               });
 
-            }else{
 
+            } else {
 
               btnGroups[1].btns.push({
 
-                text:ele.name,
 
-                code:ele.id
 
+                text: ele.name,
 
+                code: ele.id
 
               });
 
             }
 
           });
 
 
-          that.btnGroupsss=btnGroups;
 
+          that.btnGroupsss = btnGroups;
 
           that.renderBtnActiveIndex();
 
 
         },
 
       });
 
     },
 
 
-    renderBtnActiveIndex(){
 
-      this.btnGroupsss.forEach((pEle,pIndex)=>{
 
-        pEle.btns.forEach((cEle,cIndex)=>{
 
-          if(cEle.code === this.wpId) {
 
-            this.rowIndex=pIndex;
 
-            this.selectIndex=cIndex;
 
+    renderBtnActiveIndex () {
 
+      this.btnGroupsss.forEach((pEle, pIndex) => {
 
+        pEle.btns.forEach((cEle, cIndex) => {
 
+          if (cEle.code === this.wpId) {
 
+            this.rowIndex = pIndex;
 
+            this.selectIndex = cIndex;
 
           }
 
         });
 
       });
 
     },
 
 
-    select(res) {
 
+    select (res) {
 
       this.$router.replace({
 
         path: `/monitor/windsite/home/${res.code}`
 
       });
 
     },
 
     // 根据风机状态码返回对应 class
 
-    getColor(fjzt) {
 
+    getColor (fjzt) {
 
       switch (fjzt) {
 
         case 0:
 
           return "green";
 
@@ -428,7 +427,7 @@ export default {
 
       }
 
     },
 
     // 请求服务
 
-    requestData(showLoading) {
 
+    requestData (showLoading) {
 
       this.requestWpInfo(showLoading);
 
       this.requestLoss(showLoading);
 
       this.requestPower(showLoading);
 
@@ -436,7 +435,7 @@ export default {
 
     },
 
 
     // 获取场站监视数据
 
-    requestWpInfo(showLoading) {
 
+    requestWpInfo (showLoading) {
 
       let that = this;
 
       that.API.requestData({
 
         showLoading,
 
@@ -445,7 +444,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 = [];
 
@@ -541,7 +541,7 @@ export default {
 
             keys.forEach((key, keyIndex) => {
 
               res.data.glvos.forEach((ele) => {
 
                 Powertrend.value[keyIndex].value.push({
 
-                  text: new Date().formatDate("yyyy-MM-dd"),
 
+                  text: new Date(ele.time).formatDate("hh:mm"),
 
                   value: ele[key],
 
                 });
 
               });
 
@@ -590,7 +590,7 @@ export default {
 
     },
 
 
     // 获取日度损失电量分析
 
-    requestLoss(showLoading) {
 
+    requestLoss (showLoading) {
 
       let that = this;
 
       that.API.requestData({
 
         showLoading,
 
@@ -599,7 +599,7 @@ export default {
 
         data: {
 
           wpId: that.wpId,
 
         },
 
-        success(res) {
 
+        success (res) {
 
           let dayLost = [];
 
           res.data.forEach((ele) => {
 
             dayLost.push({
 
@@ -613,7 +613,7 @@ export default {
 
     },
 
 
     // 获取完成电量
 
-    requestPower(showLoading) {
 
+    requestPower (showLoading) {
 
       let that = this;
 
       that.API.requestData({
 
         showLoading,
 
@@ -622,7 +622,7 @@ export default {
 
         data: {
 
           wpId: that.wpId,
 
         },
 
-        success(res) {
 
+        success (res) {
 
           let data = [
 
             {
 
               title: "发电量",
 
@@ -653,7 +653,7 @@ export default {
 
     },
 
 
     // 获取月发电量对比
 
-    requestMonthPower(showLoading) {
 
+    requestMonthPower (showLoading) {
 
       let that = this;
 
       that.API.requestData({
 
         showLoading,
 
@@ -662,7 +662,7 @@ export default {
 
         data: {
 
           wpId: that.wpId,
 
         },
 
-        success(res) {
 
+        success (res) {
 
           let data = [
 
             {
 
               title: "月发电量",
 
@@ -693,11 +693,11 @@ export default {
 
     },
 
   },
 
 
-  created() {
 
+  created () {
 
     let that = this;
 
     that.wpId = that.$route.params.wpId;
 
     that.$nextTick(() => {
 
-    that.getWp();
 
+      that.getWp();
 
       that.requestData(false);
 
       that.timmer = setInterval(() => {
 
         that.requestData(false);
 
@@ -708,16 +708,16 @@ export default {
 
     });
 
   },
 
 
-  mounted() {},
 
+  mounted () { },
 
 
-  unmounted() {
 
+  unmounted () {
 
     clearInterval(this.timmer);
 
     clearInterval(this.timmer2);
 
     this.timmer = null;
 
     this.timmer2 = null;
 
   },
 
-  watch:{
 
-    "$route"(res){
 
+  watch: {
 
+    "$route" (res) {
 
       console.warn('router变化');
 
       this.wpId = res.params.wpId;
 
       this.requestData(false);
 
@@ -848,7 +848,7 @@ export default {
 
 }
 
 
 .btn-group-tabs {
 
-        display: flex;
 
-        flex-direction: row;
 
-    }
 
+  display: flex;
 
+  flex-direction: row;
 
+}
 
 </style>

+ 428 - 365
src/views/WindSite/pages/Map.vue
View File 

@@ -1,140 +1,151 @@
 
 <template>
 
-  <div class="map-1">
 
-    <div class="btn-group-tabs">
 
-      <BtnGroup2 :btnGroups="btnGroups" :rowIndex="0" :index="1" @select="select"></BtnGroup2>
 
-    </div>
 
-    <div class="panel-title">
 
-      <div class="panel-title-name">
 
-        <span class="svg-icon svg-icon-green svg-icon-sm">
 
-          <SvgIcon svgid="svg-wind-site"></SvgIcon>
 
-        </span>
 
-        <span class="green">某某某风电场</span>
 
-        <div class="sub-title-item">
 
-          <img src="../../../assets/map/fan/black.png" />
 
-          <span class="sub-title gray">接入台数</span>
 
-          <span class="sub-count font-num white">256</span>
 
-        </div>
 
-        <div class="sub-title-item">
 
-          <img src="../../../assets/map/fan/green.png" />
 
-          <span class="sub-title green">待机台数</span>
 
-          <span class="sub-count font-num green">56</span>
 
-        </div>
 
-        <div class="sub-title-item">
 
-          <img src="../../../assets/map/fan/blue.png" />
 
-          <span class="sub-title blue">并网台数</span>
 
-          <span class="sub-count font-num blue">256</span>
 
-        </div>
 
-        <div class="sub-title-item">
 
-          <img src="../../../assets/map/fan/purple.png" />
 
-          <span class="sub-title pink">限电台数</span>
 
-          <span class="sub-count font-num pink">3</span>
 
+    <div class="map-1">
 
+        <div class="btn-group-tabs">
 
+            <BtnGroup2
 
+                :btnGroups="btnGroups"
 
+                :rowIndex="0"
 
+                :index="1"
 
+                @select="select"
 
+            ></BtnGroup2>
 
         </div>
 
-        <div class="sub-title-item">
 
-          <img src="../../../assets/map/fan/red.png" />
 
-          <span class="sub-title red">故障台数</span>
 
-          <span class="sub-count font-num red">5</span>
 
+        <div class="panel-title">
 
+            <div class="panel-title-name">
 
+                <span class="svg-icon svg-icon-green svg-icon-sm">
 
+                    <SvgIcon svgid="svg-wind-site"></SvgIcon>
 
+                </span>
 
+                <span class="green">某某某风电场</span>
 
+                <div class="sub-title-item">
 
+                    <img src="../../../assets/map/fan/black.png" />
 
+                    <span class="sub-title gray">接入台数</span>
 
+                    <span class="sub-count font-num white">256</span>
 
+                </div>
 
+                <div class="sub-title-item">
 
+                    <img src="../../../assets/map/fan/green.png" />
 
+                    <span class="sub-title green">待机台数</span>
 
+                    <span class="sub-count font-num green">56</span>
 
+                </div>
 
+                <div class="sub-title-item">
 
+                    <img src="../../../assets/map/fan/blue.png" />
 
+                    <span class="sub-title blue">并网台数</span>
 
+                    <span class="sub-count font-num blue">256</span>
 
+                </div>
 
+                <div class="sub-title-item">
 
+                    <img src="../../../assets/map/fan/purple.png" />
 
+                    <span class="sub-title pink">限电台数</span>
 
+                    <span class="sub-count font-num pink">3</span>
 
+                </div>
 
+                <div class="sub-title-item">
 
+                    <img src="../../../assets/map/fan/red.png" />
 
+                    <span class="sub-title red">故障台数</span>
 
+                    <span class="sub-count font-num red">5</span>
 
+                </div>
 
+                <div class="sub-title-item">
 
+                    <img src="../../../assets/map/fan/orange.png" />
 
+                    <span class="sub-title orange">检修台数</span>
 
+                    <span class="sub-count font-num orange">20</span>
 
+                </div>
 
+                <div class="sub-title-item">
 
+                    <img src="../../../assets/map/fan/white.png" />
 
+                    <span class="sub-title white">受累台数</span>
 
+                    <span class="sub-count font-num white">256</span>
 
+                </div>
 
+                <div class="sub-title-item">
 
+                    <img src="../../../assets/map/fan/black.png" />
 
+                    <span class="sub-title gray">离线台数</span>
 
+                    <span class="sub-count font-num gray">2</span>
 
+                </div>
 
+            </div>
 
         </div>
 
-        <div class="sub-title-item">
 
-          <img src="../../../assets/map/fan/orange.png" />
 
-          <span class="sub-title orange">检修台数</span>
 
-          <span class="sub-count font-num orange">20</span>
 
+        <div class="panel-body">
 
+            <arcgis class="arcgis-layer" @when="when" ref="arcgis" :data="arcgisData" @clickMap="clickMap"></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">
 
+                    <table class="table-form">
 
+                        <tr>
 
+                            <td class="text white">装机容量</td>
 
+                            <td class="value green">49.5</td>
 
+                            <td class="unit white">M/W</td>
 
+                            <td class="text white">装机台数</td>
 
+                            <td class="value green">33</td>
 
+                            <td class="unit white">台</td>
 
+                            <td class="text white">风机型号</td>
 
+                            <td class="value green" colspan="2">UP82/77-1500</td>
 
+                        </tr>
 
+                        <tr>
 
+                            <td class="text white">实时功率</td>
 
+                            <td class="value green">50.81</td>
 
+                            <td class="unit white">M/W</td>
 
+                            <td class="text white">平均风速</td>
 
+                            <td class="value green">14.66</td>
 
+                            <td class="unit white">m/s</td>
 
+                            <td class="text white">运行台数</td>
 
+                            <td class="value green">33</td>
 
+                            <td class="unit white">台</td>
 
+                        </tr>
 
+                        <tr>
 
+                            <td class="text white">待机台数</td>
 
+                            <td class="value green">0</td>
 
+                            <td class="unit white">台</td>
 
+                            <td class="text white">故障台数</td>
 
+                            <td class="value green">0</td>
 
+                            <td class="unit white">台</td>
 
+                            <td class="text white">维护台数</td>
 
+                            <td class="value green">0</td>
 
+                            <td class="unit white">台</td>
 
+                        </tr>
 
+                        <tr>
 
+                            <td class="text white">离线台数</td>
 
+                            <td class="value green">0</td>
 
+                            <td class="unit white">台</td>
 
+                            <td class="text white"></td>
 
+                            <td class="value green"></td>
 
+                            <td class="unit white"></td>
 
+                            <td class="text white"></td>
 
+                            <td class="value green"></td>
 
+                            <td class="unit white"></td>
 
+                        </tr>
 
+                        <tr>
 
+                            <td class="text white">日发电量</td>
 
+                            <td class="value green">49.5</td>
 
+                            <td class="unit white">万kWh</td>
 
+                            <td class="text white">月发电量</td>
 
+                            <td class="value green">49.5</td>
 
+                            <td class="unit white">万kWh</td>
 
+                            <td class="text white"></td>
 
+                            <td class="value green"></td>
 
+                            <td class="unit white"></td>
 
+                        </tr>
 
+                        <tr>
 
+                            <td class="text white">年发电量</td>
 
+                            <td class="value green">49.5</td>
 
+                            <td class="unit white">万kWh</td>
 
+                            <td class="text white">总发电量</td>
 
+                            <td class="value green">49.5</td>
 
+                            <td class="unit white">万kWh</td>
 
+                            <td class="text white"></td>
 
+                            <td class="value green"></td>
 
+                            <td class="unit white"></td>
 
+                        </tr>
 
+                    </table>
 
+                </div>
 
+            </div>
 
+            <div class="map-tool">
 
+                <div class="m-btn" :class="{'active': mapToolIndex == 0}" @click="clickMapTool(0)">风机排布</div>
 
+                <div class="m-btn" :class="{'active': mapToolIndex == 1}" @click="clickMapTool(1)">巡检路线</div>
 
+            </div>
 
         </div>
 
-        <div class="sub-title-item">
 
-          <img src="../../../assets/map/fan/white.png" />
 
-          <span class="sub-title white">受累台数</span>
 
-          <span class="sub-count font-num white">256</span>
 
-        </div>
 
-        <div class="sub-title-item">
 
-          <img src="../../../assets/map/fan/black.png" />
 
-          <span class="sub-title gray">离线台数</span>
 
-          <span class="sub-count font-num gray">2</span>
 
-        </div>
 
-      </div>
 
     </div>
 
-    <div class="panel-body">
 
-      <arcgis @when="when" ref="arcgis" :data="arcgisData" @clickMap="clickMap"></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">
 
-          <table class="table-form">
 
-            <tr>
 
-              <td class="text white">装机容量</td>
 
-              <td class="value green">49.5</td>
 
-              <td class="unit white">M/W</td>
 
-              <td class="text white">装机台数</td>
 
-              <td class="value green">33</td>
 
-              <td class="unit white">台</td>
 
-              <td class="text white">风机型号</td>
 
-              <td class="value green" colspan="2">UP82/77-1500</td>
 
-            </tr>
 
-            <tr>
 
-              <td class="text white">实时功率</td>
 
-              <td class="value green">50.81</td>
 
-              <td class="unit white">M/W</td>
 
-              <td class="text white">平均风速</td>
 
-              <td class="value green">14.66</td>
 
-              <td class="unit white">m/s</td>
 
-              <td class="text white">运行台数</td>
 
-              <td class="value green">33</td>
 
-              <td class="unit white">台</td>
 
-            </tr>
 
-            <tr>
 
-              <td class="text white">待机台数</td>
 
-              <td class="value green">0</td>
 
-              <td class="unit white">台</td>
 
-              <td class="text white">故障台数</td>
 
-              <td class="value green">0</td>
 
-              <td class="unit white">台</td>
 
-              <td class="text white">维护台数</td>
 
-              <td class="value green">0</td>
 
-              <td class="unit white">台</td>
 
-            </tr>
 
-            <tr>
 
-              <td class="text white">离线台数</td>
 
-              <td class="value green">0</td>
 
-              <td class="unit white">台</td>
 
-              <td class="text white"></td>
 
-              <td class="value green"></td>
 
-              <td class="unit white"></td>
 
-              <td class="text white"></td>
 
-              <td class="value green"></td>
 
-              <td class="unit white"></td>
 
-            </tr>
 
-            <tr>
 
-              <td class="text white">日发电量</td>
 
-              <td class="value green">49.5</td>
 
-              <td class="unit white">万kWh</td>
 
-              <td class="text white">月发电量</td>
 
-              <td class="value green">49.5</td>
 
-              <td class="unit white">万kWh</td>
 
-              <td class="text white"></td>
 
-              <td class="value green"></td>
 
-              <td class="unit white"></td>
 
-            </tr>
 
-            <tr>
 
-              <td class="text white">年发电量</td>
 
-              <td class="value green">49.5</td>
 
-              <td class="unit white">万kWh</td>
 
-              <td class="text white">总发电量</td>
 
-              <td class="value green">49.5</td>
 
-              <td class="unit white">万kWh</td>
 
-              <td class="text white"></td>
 
-              <td class="value green"></td>
 
-              <td class="unit white"></td>
 
-            </tr>
 
-          </table>
 
-        </div>
 
-      </div>
 
-    </div>
 
-  </div>
 
 </template>
 
 
 <script>
 
@@ -144,277 +155,329 @@ import arcgis from "@com/arcgis/arcgis.vue";
 
 import dataService from "@/helper/data.js";
 
 
 export default {
 
-  // 名称
 
-  name: "Map",
 
-  // 使用组件
 
-  components: {
 
-    BtnGroup2,
 
-    SvgIcon,
 
-    arcgis,
 
-  },
 
-  // 数据
 
-  data() {
 
-    return {
 
-      btnGroups: [
 
-        {
 
-          icon: "svg-wind-site",
 
-          btns: [
 
-            {
 
-              text: "某某风场",
 
-              code: "mmfdc1",
 
-            },
 
-            {
 
-              text: "某某风场",
 
-              code: "mhsfc",
 
-            },
 
-            {
 
-              text: "某某风场",
 
-              code: "mmfdc2",
 
-            },
 
-            {
 
-              text: "某某风场",
 
-              code: "mmfdc3",
 
-            },
 
-            {
 
-              text: "某某风场",
 
-              code: "mmfdc4",
 
+    // 名称
 
+    name: "Map",
 
+    // 使用组件
 
+    components: {
 
+        BtnGroup2,
 
+        SvgIcon,
 
+        arcgis,
 
+    },
 
+    // 数据
 
+    data() {
 
+        return {
 
+            btnGroups: [
 
+                {
 
+                    icon: "svg-wind-site",
 
+                    btns: [
 
+                        {
 
+                            text: "某某风场",
 
+                            code: "mmfdc1",
 
+                        },
 
+                        {
 
+                            text: "某某风场",
 
+                            code: "mhsfc",
 
+                        },
 
+                        {
 
+                            text: "某某风场",
 
+                            code: "mmfdc2",
 
+                        },
 
+                        {
 
+                            text: "某某风场",
 
+                            code: "mmfdc3",
 
+                        },
 
+                        {
 
+                            text: "某某风场",
 
+                            code: "mmfdc4",
 
+                        },
 
+                    ],
 
+                },
 
+                {
 
+                    icon: "svg-photovoltaic",
 
+                    btns: [
 
+                        {
 
+                            text: "某某风场",
 
+                            code: "mmgf1",
 
+                        },
 
+                        {
 
+                            text: "某某风场",
 
+                            code: "mmgf2",
 
+                        },
 
+                        {
 
+                            text: "某某风场",
 
+                            code: "mmgf3",
 
+                        },
 
+                        {
 
+                            text: "某某风场",
 
+                            code: "mmgf4",
 
+                        },
 
+                    ],
 
+                },
 
+            ],
 
+            arcgisData: {
 
+                mode: "2D", // 模式 2D 3D
 
+                title: "宁夏地图", // 标题
 
+                center: [107.0391975, 37.31469028], // 初始中心点 106.230909, 38.487193
 
+                height: 654, // 3D地图初始相机高度
 
+                tilt: 65, // 俯视角
 
+                scale: 30000,
 
+                rotation: -45,
 
+                ox: -600,
 
+                oy: -50,
 
             },
 
-          ],
 
+            showPopup: true,
 
+            mapToolIndex: 0,
 
+        };
 
+    },
 
+    // 函数
 
+    methods: {
 
+        when: function () {
 
+            let jsonObj = dataService.get("arcgis-nx-fc1");
 
+            let data = [{id: "MG13", state: "yx"},{id: "MG12", state: "xd"},{id: "MG34", state: "gz"},{id: "MG39", state: "jc"},
 
+                        {id: "MG02", state: "lx"}, {id: "MG19", state: "sl"}]
 
+            jsonObj.forEach(item => {
 
+                let obj = data.find(t => t.id == item.attributes.code);
 
+                if (obj) {
 
+                    item.attributes.state = obj.state;
 
+                } else {
 
+                    item.attributes.state = "dj";
 
+                }
 
+            });
 
+            let lineJsonObj = dataService.get("arcgis-nx-fc1-line");
 
+            this.$refs.arcgis.addFanByJson(jsonObj, lineJsonObj);
 
         },
 
-        {
 
-          icon: "svg-photovoltaic",
 
-          btns: [
 
-            {
 
-              text: "某某风场",
 
-              code: "mmgf1",
 
-            },
 
-            {
 
-              text: "某某风场",
 
-              code: "mmgf2",
 
-            },
 
-            {
 
-              text: "某某风场",
 
-              code: "mmgf3",
 
-            },
 
-            {
 
-              text: "某某风场",
 
-              code: "mmgf4",
 
-            },
 
-          ],
 
+        clickMap: function (info) {
 
+            console.log(info)
 
+            this.showPopup = true;
 
         },
 
-      ],
 
-      arcgisData: {
 
-        mode: "2D", // 模式 2D 3D
 
-        title: "宁夏地图", // 标题
 
-        center: [106.47423505799998, 37.767080068999974], // 初始中心点 106.230909, 38.487193
 
-        height: 654, // 3D地图初始相机高度
 
-        tilt: 65, // 俯视角
 
-        scale: 15000,
 
-      },
 
-      showPopup: false,
 
-    };
 
-  },
 
-  // 函数
 
-  methods: {
 
-    when: function() {
 
-      let jsonObj = dataService.get("arcgis-nx-fc1");
 
-      jsonObj.forEach(item => {
 
-        item.attributes.state = "dj";
 
-      });
 
-      let lineJsonObj = dataService.get("arcgis-nx-fc1-line");
 
-      this.$refs.arcgis.addFanByJson(jsonObj, lineJsonObj);
 
+        popupBack: function () {
 
+            this.showPopup = false;
 
+        },
 
+        clickMapTool: function (index) {
 
+            this.mapToolIndex = index;
 
+        },
 
+    },
 
+    // 生命周期钩子
 
+    beforeCreate() {
 
+        // 创建前
 
+    },
 
+    created() {
 
+        // 创建后
 
+    },
 
+    beforeMount() {
 
+        // 渲染前
 
+    },
 
+    mounted() {
 
+        // 渲染后
 
     },
 
-    clickMap: function(info) {
 
-      console.log(info);
 
-      this.showPopup = true;
 
+    beforeUpdate() {
 
+        // 数据更新前
 
     },
 
-    popupBack: function() {
 
-      this.showPopup = false;
 
+    updated() {
 
+        // 数据更新后
 
     },
 
-  },
 
-  // 生命周期钩子
 
-  beforeCreate() {
 
-    // 创建前
 
-  },
 
-  created() {
 
-    // 创建后
 
-  },
 
-  beforeMount() {
 
-    // 渲染前
 
-  },
 
-  mounted() {
 
-    // 渲染后
 
-  },
 
-  beforeUpdate() {
 
-    // 数据更新前
 
-  },
 
-  updated() {
 
-    // 数据更新后
 
-  },
 
 };
 
 </script>
 
 
 <style lang="less" scoped>
 
-@titleHeight: 3.704vh;
 
+@titleHeight: 40px;
 
 
 .map-1 {
 
-  width: 100%;
 
-  height: calc(100vh - 90px);
 
-  display: flex;
 
-  flex-direction: column;
 
-
 
-  .btn-group-tabs {
 
-    display: flex;
 
-    flex-direction: row;
 
-  }
 
-
 
-  .panel-title {
 
     width: 100%;
 
-    background-color: fade(@darkgray, 40%);
 
-    margin-top: 1.481vh;
 
-    padding: 6px;
 
+    height: calc(100vh - 90px);
 
     display: flex;
 
-    align-items: center;
 
-
 
-    .panel-title-name {
 
-      color: @green;
 
-      display: flex;
 
-      align-items: center;
 
-      line-height: 0;
 
-      font-size: 0;
 
+    flex-direction: column;
 
 
-      i,
 
-      span {
 
-        margin: 0 0 0 1.481vh;
 
-        line-height: 0;
 
-        font-size: 13px;
 
-      }
 
+    .btn-group-tabs {
 
+        display: flex;
 
+        flex-direction: row;
 
     }
 
 
-    .sub-title-item {
 
-      display: flex;
 
-      align-items: center;
 
-      margin-left: 16px;
 
+    .panel-title {
 
+        width: 100%;
 
+        background-color: fade(@darkgray, 40%);
 
+        margin-top: 16px;
 
+        padding: 6px;
 
+        display: flex;
 
+        align-items: center;
 
 
-      .sub-title {
 
-        font-size: 13px;
 
-        margin-left: 6px;
 
-      }
 
+        .panel-title-name {
 
+            color: @green;
 
+            display: flex;
 
+            align-items: center;
 
+            line-height: 0;
 
+            font-size: 0;
 
 
-      .sub-count {
 
-        font-size: 13px;
 
-        font-weight: 500;
 
-      }
 
+            i,
 
+            span {
 
+                margin: 0 0 0 16px;
 
+                line-height: 0;
 
+                font-size: 13px;
 
+            }
 
+        }
 
+
 
+        .sub-title-item {
 
+            display: flex;
 
+            align-items: center;
 
+            margin-left: 16px;
 
+            
+            .sub-title {
 
+                font-size: 13px;
 
+                margin-left: 6px;
 
+            }
 
 
-      img {
 
-        height: 31px;
 
-      }
 
+            .sub-count {
 
+                font-size: 13px;
 
+                font-weight: 500;
 
+            }
 
+            
+            img {
 
+                height: 31px;
 
+            }
 
+        }
 
     }
 
-  }
 
 
-  .panel-body {
 
-    flex-grow: 1;
 
-    background-color: fade(@darkgray, 20%);
 
-    padding: 0.741vh;
 
-    overflow: auto;
 
-    position: relative;
 
+    .panel-body {
 
+        flex-grow: 1;
 
+        background-color: fade(@darkgray, 20%);
 
+        padding: 8px;
 
+        overflow: auto;
 
+        position: relative;
 
 
-    .map-popup-panel {
 
-      width: 679px;
 
-      position: absolute;
 
-      left: 71px;
 
-      top: 22px;
 
+        .arcgis-layer {
 
+            z-index: 1;
 
+        }
 
 
-      .map-popup-panel-header {
 
-        width: 100%;
 
-        background: fade(#152221, 90%);
 
-        display: flex;
 
+        .map-popup-panel {
 
+            width: 760px;
 
+            position: absolute;
 
+            left: 71px;
 
+            top: 22px;
 
+            z-index: 2;
 
 
-        .map-popup-panel-title {
 
-          padding: 17px 24px;
 
-          font-size: @fontsize-s;
 
-          position: relative;
 
+            .map-popup-panel-header {
 
+                width: 100%;
 
+                background: fade(#152221, 90%);
 
+                display: flex;
 
 
-          &::before,
 
-          &::after {
 
-            position: absolute;
 
-            width: calc(50% - 6px);
 
-            bottom: 0;
 
-            border-bottom: 2px solid @green;
 
-          }
 
+                .map-popup-panel-title {
 
+                    padding: 17px 24px;
 
+                    font-size: @fontsize-s;
 
+                    position: relative;
 
 
-          &::before {
 
-            content: "";
 
-            left: 0;
 
-          }
 
+                    &::before,
 
+                    &::after {
 
+                        position: absolute;
 
+                        width: calc(50% - 6px);
 
+                        bottom: 0;
 
+                        border-bottom: 2px solid @green;
 
+                    }
 
 
-          &::after {
 
-            content: "";
 
-            right: 0;
 
-          }
 
+                    &::before {
 
+                        content: "";
 
+                        left: 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);
 
-          }
 
-        }
 
+                    &::after {
 
+                        content: "";
 
+                        right: 0;
 
+                    }
 
 
-        .map-popup-panel-date {
 
-          flex-grow: 1;
 
-          padding: 17px 24px;
 
-          font-size: @fontsize-s;
 
-          text-align: right;
 
-          border-bottom: 2px solid @green;
 
-        }
 
+                    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-back {
 
-          margin-left: auto;
 
-          width: 54px;
 
-          display: flex;
 
-          align-items: center;
 
-          justify-content: center;
 
-          position: relative;
 
-          cursor: pointer;
 
+                .map-popup-panel-date {
 
+                    flex-grow: 1;
 
+                    padding: 17px 24px;
 
+                    font-size: @fontsize-s;
 
+                    text-align: right;
 
+                    border-bottom: 2px solid @green;
 
+                }
 
 
-          &::after {
 
-            content: "";
 
-            position: absolute;
 
-            left: 0;
 
-            height: 50%;
 
-            border-left: 1px solid @gray;
 
-            top: 25%;
 
-          }
 
+                .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;
 
+                    }
 
+                }
 
+            }
 
         }
 
-      }
 
 
-      .map-popup-panel-body {
 
-        background: fade(#152221, 75%);
 
-        border: 1px solid fade(@darkgray, 40);
 
-        border-top: 0px;
 
+        .map-tool {
 
+            position: absolute;
 
+            right: 22px;
 
+            top: 22px;
 
+            z-index: 2;
 
+            background: #152221AF;
 
+            padding: 18px 14px;
 
 
-        .table-form {
 
-          .text,
 
-          .unit {
 
-            font-weight: 400;
 
-          }
 
+            .m-btn {
 
+                width: 124px;
 
+                height: 44px;
 
+                background: #152221BF;
 
+                border: 1px solid #152221BF;
 
+                color: #FFFFFF;
 
+                transition: all .3s;
 
+                display: flex;
 
+                align-items: center;
 
+                justify-content: center;
 
+                cursor: pointer;
 
 
-          .unit {
 
-            min-width: auto;
 
-          }
 
+                &:hover,
 
+                &.active {
 
+                    background: #05BB4C33;
 
+                    border: 1px solid #05BB4C;
 
+                    color: #05BB4C;
 
+                }
 
 
-          .value,
 
-          .unit {
 
-            text-align: left;
 
-          }
 
+                +.m-btn {
 
+                    margin-top: 16px;
 
+                }
 
+            }
 
         }
 
-      }
 
     }
 
-  }
 
 }
 
 </style>

+ 20 - 1
src/views/WindSite/pages/Map1.vue
View File 

@@ -59,7 +59,10 @@
 
         <div class="panel-body">
 
             <arcgis @when="when" ref="arcgis" :data="arcgisData" @clickMap="clickMap">
 
                 <template v-slot:test>
 
-                    <img :src="tempImg" style="width: 800px; height: 700px;">
 
+                    <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>
 
                 </template>
 
             </arcgis>
 
         </div>
 
@@ -336,5 +339,21 @@ export default {
 
             }
 
         }
 
     }
 
+
 
+    .panel-box {
 
+        width: 800px;
 
+        display: flex;
 
+        flex-wrap: wrap;
 
+
 
+        .panel-item {
 
+            width: 100px;
 
+            height: 100px;
 
+            padding: 20px;
 
+            background: #536268B8;
 
+            margin-top: -20px;
 
+            margin-left: -20px;
 
+        }
 
+
 
+    }
 
 }
 
 </style>

+ 40 - 40
src/views/WindSite/pages/Matrix.vue
View File 

@@ -8,7 +8,7 @@
 
         <i class="fa fa-send"></i>
 
         <span>{{ sourceMap.fczbmap.jczbmap.name }}</span>
 
         <span class="sub-title">接入台数</span>
 
-        <span class="sub-count">{{ sourceMap.fczbmap.jczbmap.yxts }}</span>
 
+        <span class="sub-count">{{ sourceMap.fczbmap.jczbmap.jrts }}</span>
 
       </div>
 
     </div>
 
     <div class="panel-body">
 
@@ -51,12 +51,12 @@ export default {
 
     SvgIcon
 
   },
 
 
-  data() {
 
+  data () {
 
     return {
 
       timmer: null, // 计时器
 
-      wpId:"",
 
-      selectIndex:0,
 
-      rowIndex:0,
 
+      wpId: "",
 
+      selectIndex: 0,
 
+      rowIndex: 0,
 
       mapping: {
 
         green: "svg-standby",
 
         blue: "svg-normal-power",
 
@@ -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,61 +157,61 @@ export default {
 
       });
 
     },
 
 
-    getWp(){
 
+    getWp () {
 
       let that = this;
 
       that.API.requestData({
 
         method: "GET",
 
         subUrl: "powercompare/windfarmAllAjax",
 
-        success(res) {
 
+        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){
 
+          res.data.forEach((ele, index) => {
 
+            if (ele.id.indexOf("FDC") !== -1) {
 
               btnGroups[0].btns.push({
 
-                text:ele.name,
 
-                code:ele.id
 
+                text: ele.name,
 
+                code: ele.id
 
               });
 
-            }else{
 
+            } else {
 
               btnGroups[1].btns.push({
 
-                text:ele.name,
 
-                code:ele.id
 
+                text: ele.name,
 
+                code: ele.id
 
               });
 
             }
 
           });
 
 
-          that.btnGroups=btnGroups;
 
+          that.btnGroups = btnGroups;
 
           that.renderBtnActiveIndex();
 
 
         },
 
       });
 
     },
 
 
-    renderBtnActiveIndex(){
 
-      this.btnGroups.forEach((pEle,pIndex)=>{
 
-        pEle.btns.forEach((cEle,cIndex)=>{
 
-          if(cEle.code === this.wpId) {
 
-            this.rowIndex=pIndex;
 
-            this.selectIndex=cIndex;
 
+    renderBtnActiveIndex () {
 
+      this.btnGroups.forEach((pEle, pIndex) => {
 
+        pEle.btns.forEach((cEle, cIndex) => {
 
+          if (cEle.code === this.wpId) {
 
+            this.rowIndex = pIndex;
 
+            this.selectIndex = cIndex;
 
           }
 
         });
 
       });
 
     },
 
 
-    select(res) {
 
+    select (res) {
 
       this.$router.replace({
 
         path: `/monitor/windsite/matrix/${res.code}`
 
       });
 
     },
 
   },
 
 
-  created() {
 
+  created () {
 
     let that = this;
 
     that.wpId = that.$route.params.wpId;
 
     that.$nextTick(() => {
 
@@ -223,15 +223,15 @@ export default {
 
     });
 
   },
 
 
-  mounted() {},
 
+  mounted () { },
 
 
-  unmounted() {
 
+  unmounted () {
 
     clearInterval(this.timmer);
 
     this.timmer = null;
 
   },
 
 
-  watch:{
 
-    "$route"(res){
 
+  watch: {
 
+    "$route" (res) {
 
       this.wpId = res.params.wpId;
 
       this.requestData(false);
 
       this.renderBtnActiveIndex();
 
@@ -326,16 +326,16 @@ export default {
 
           }
 
 
           .icon {
 
-              flex-grow: 1;
 
-              height: calc(100% - 16px);
 
-              display: flex;
 
-              align-items: center;
 
-              justify-content: center;
 
-
 
-              i {
 
-                font-size: 14px;
 
-              }
 
+            flex-grow: 1;
 
+            height: calc(100% - 16px);
 
+            display: flex;
 
+            align-items: center;
 
+            justify-content: center;
 
+
 
+            i {
 
+              font-size: 14px;
 
             }
 
+          }
 
         }
 
 
         .card-right {

+ 10 - 10
src/views/layout/Header.vue
View File 

@@ -20,7 +20,7 @@
 
 </template>
 
 <script>
 
 export default {
 
-  data() {
 
+  data () {
 
     return {
 
       menus: [
 
         {
 
@@ -36,9 +36,9 @@ export default {
 
           isActive: false,
 
         },
 
         {
 
-          id: "singleAnalysis",
 
+          id: "performanceAnalysis",
 
           text: "统计分析",
 
-          path: "/singleAnalysis",
 
+          path: "/performanceAnalysis",
 
           isActive: false,
 
         },
 
         {
 
@@ -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;

+ 48 - 47
src/views/layout/Menu.vue
View File 

@@ -1,7 +1,8 @@
 
 <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'">
 
@@ -37,7 +38,7 @@ export default {
 
     SvgIcon,
 
   },
 
   props: {},
 
-  data() {
 
+  data () {
 
     return {
 
       currRoot: "monitor",
 
       menuData: [
 
@@ -80,7 +81,7 @@ export default {
 
               icon: "svg-agc",
 
               path: "/monitor/agc",
 
             },
 
-           {
 
+            {
 
               text: "风场",
 
               icon: "svg-wind-site",
 
               path: "/monitor/windsite/home/MHS_FDC",
 
@@ -123,7 +124,7 @@ export default {
 
           ],
 
         },
 
         {
 
-          id: "singleAnalysis",
 
+          id: "performanceAnalysis",
 
           text: "统计分析",
 
           data: [
 
             {
 
@@ -180,28 +181,28 @@ export default {
 
                 }
 
               ]
 
             },
 
-            {
 
-              text: "单机分析",
 
-              icon: "svg-wind-site",
 
-              path: "/fgzyfx",
 
-              children: [
 
-                {
 
-                  text: "单机分析详细",
 
-                  icon: "svg-wind-site",
 
-                  path: "/new/dj1",
 
-                },
 
-                {
 
-                  text: "电量预测",
 
-                  icon: "svg-wind-site",
 
-                  path: "/new/pf1",
 
-                },
 
-                {
 
-                  text: "气象预测",
 
-                  icon: "svg-wind-site",
 
-                  path: "/new/fs",
 
-                }
 
-              ]
 
-            }
 
+            // {
 
+            //   text: "单机分析",
 
+            //   icon: "svg-wind-site",
 
+            //   path: "/fgzyfx",
 
+            //   children: [
 
+            //     {
 
+            //       text: "单机分析详细",
 
+            //       icon: "svg-wind-site",
 
+            //       path: "/new/dj1",
 
+            //     },
 
+            //     {
 
+            //       text: "电量预测",
 
+            //       icon: "svg-wind-site",
 
+            //       path: "/new/pf1",
 
+            //     },
 
+            //     {
 
+            //       text: "气象预测",
 
+            //       icon: "svg-wind-site",
 
+            //       path: "/new/fs",
 
+            //     }
 
+            //   ]
 
+            // }
 
           ],
 
         },
 
         {
 
@@ -213,7 +214,7 @@ export default {
 
               icon: "svg-wind-site",
 
               path: "/health",
 
               children: [
 
-                 {
 
+                {
 
                   text: "健康推荐",
 
                   icon: "svg-wind-site",
 
                   path: "/health",
 
@@ -245,7 +246,7 @@ export default {
 
                 },
 
               ],
 
             },
 
-            
+
 
           ],
 
         },
 
         {
 
@@ -316,24 +317,24 @@ export default {
 
             },
 
             // 三率管理
 
             {
 
-              text:'三率管理',
 
-              icon:'svg-matrix',
 
-              path:'/slgl',
 
-              children:[
 
+              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'
 
                 }
 
               ]
 
             }
 
@@ -394,11 +395,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;
 
@@ -408,18 +409,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;
 
@@ -429,7 +430,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;

+ 166 - 178
src/views/performanceAnalysis/index.vue
View File 

@@ -1,76 +1,71 @@
 
 <template>
 
   <div class="draught-fan-list">
 
     <div class="query mg-b-8">
 
-			<div class="query-items">
 
-				<div class="query-item">
 
-					<div class="lable">场站：</div>
 
-					<div class="search-input">
 
-						<el-select v-model="wpId" clearable placeholder="请选择"
 
-							popper-class="select">
 
-							<el-option v-for="item in wpArray" :key="item.id" :value="item.id" :label="item.name" />
 
-						</el-select>
 
-					</div>
 
-				</div>
 
-				<div class="query-item">
 
-					<div class="lable">日期：</div>
 
-					<div class="search-input">
 
-						<el-date-picker v-model="recorddate" type="date"
 
-							value-format="YYYY-MM-DD" placeholder="选择日期" popper-class="date-select">
 
-						</el-date-picker>
 
-					</div>
 
-				</div>
 
-			</div>
 
-			<div class="query-actions">
 
-				<button class="btn green" @click="search">查询</button>
 
-				<button class="btn green" @click="exportExcel">导出</button>
 
-			</div>
 
-		</div>
 
+      <div class="query-items">
 
+        <div class="query-item">
 
+          <div class="lable">场站：</div>
 
+          <div class="search-input">
 
+            <el-select v-model="wpId" clearable placeholder="请选择" popper-class="select">
 
+              <el-option v-for="item in wpArray" :key="item.id" :value="item.id" :label="item.name" />
 
+            </el-select>
 
+          </div>
 
+        </div>
 
+        <div class="query-item">
 
+          <div class="lable">日期：</div>
 
+          <div class="search-input">
 
+            <el-date-picker v-model="recorddate" type="date" value-format="YYYY-MM-DD" placeholder="选择日期" popper-class="date-select">
 
+            </el-date-picker>
 
+          </div>
 
+        </div>
 
+      </div>
 
+      <div class="query-actions">
 
+        <button class="btn green" @click="search">查询</button>
 
+        <button class="btn green" @click="exportExcel">导出</button>
 
+      </div>
 
+    </div>
 
     <div class="df-table">
 
       <ComTable height="78vh" :data="tableData"></ComTable>
 
     </div>
 
-    <el-dialog title="切入切出风速整合历史" v-model="dialogShow" width="85%" top="10vh" custom-class="modal" :close-on-click-modal="true" @closed="dialogType = ''">
 
+    <el-dialog title="切入切出风速整合历史" v-model="dialogShow" width="85%" top="10vh" custom-class="modal"
 
+      :close-on-click-modal="true" @closed="dialogType = ''">
 
       <div class="query mg-b-8">
 
-			<div class="query-items">
 
-				<div class="query-item">
 
-					<div class="lable">场站：</div>
 
-					<div class="search-input">
 
-						<el-select v-model="wpId2" clearable placeholder="请选择"
 
-							popper-class="select" @change="reGetWtArray">
 
-							<el-option v-for="item in wpArray" :key="item.id" :value="item.id" :label="item.name" />
 
-						</el-select>
 
-					</div>
 
-				</div>
 
-        <div class="query-item">
 
-					<div class="lable">风机：</div>
 
-					<div class="search-input">
 
-						<el-select v-model="wtId" clearable placeholder="请选择"
 
-							popper-class="select">
 
-							<el-option v-for="item in wtArray" :key="item.id" :value="item.id" :label="item.name" />
 
-						</el-select>
 
-					</div>
 
-				</div>
 
-				<div class="query-item">
 
-					<div class="lable">开始日期：</div>
 
-					<div class="search-input">
 
-						<el-date-picker v-model="beginDate" type="date"
 
-							value-format="YYYY-MM-DD" placeholder="选择日期" popper-class="date-select">
 
-						</el-date-picker>
 
-					</div>
 
-				</div>
 
-				<div class="query-item">
 
-					<div class="lable">结束日期：</div>
 
-					<div class="search-input">
 
-						<el-date-picker v-model="endDate" type="date"
 
-							value-format="YYYY-MM-DD" placeholder="选择日期" popper-class="date-select">
 
-						</el-date-picker>
 
-					</div>
 
-				</div>
 
-			</div>
 
-			<div class="query-actions">
 
-				<button class="btn green" @click="reGetHistoryTableData">查询</button>
 
-				<button class="btn green" @click="exportExcel2">导出</button>
 
-			</div>
 
-		</div>
 
+        <div class="query-items">
 
+          <div class="query-item">
 
+            <div class="lable">场站：</div>
 
+            <div class="search-input">
 
+              <el-select v-model="wpId2" clearable placeholder="请选择" popper-class="select" @change="reGetWtArray">
 
+                <el-option v-for="item in wpArray" :key="item.id" :value="item.id" :label="item.name" />
 
+              </el-select>
 
+            </div>
 
+          </div>
 
+          <div class="query-item">
 
+            <div class="lable">风机：</div>
 
+            <div class="search-input">
 
+              <el-select v-model="wtId" clearable placeholder="请选择" popper-class="select">
 
+                <el-option v-for="item in wtArray" :key="item.id" :value="item.id" :label="item.name" />
 
+              </el-select>
 
+            </div>
 
+          </div>
 
+          <div class="query-item">
 
+            <div class="lable">开始日期：</div>
 
+            <div class="search-input">
 
+              <el-date-picker v-model="beginDate" type="date" value-format="YYYY-MM-DD" placeholder="选择日期" popper-class="date-select">
 
+              </el-date-picker>
 
+            </div>
 
+          </div>
 
+          <div class="query-item">
 
+            <div class="lable">结束日期：</div>
 
+            <div class="search-input">
 
+              <el-date-picker v-model="endDate" type="date" value-format="YYYY-MM-DD" placeholder="选择日期" popper-class="date-select">
 
+              </el-date-picker>
 
+            </div>
 
+          </div>
 
+        </div>
 
+        <div class="query-actions">
 
+          <button class="btn green" @click="reGetHistoryTableData">查询</button>
 
+          <button class="btn green" @click="exportExcel2">导出</button>
 
+        </div>
 
+      </div>
 
       <ComTable height="78vh" :data="historyTableData"></ComTable>
 
     </el-dialog>
 
   </div>
 
@@ -84,34 +79,27 @@ export default {
 
 
   // 使用组件
 
   components: {
 
-   ComTable
 
+    ComTable
 
   },
 
 
   // 数据
 
-  data() {
 
+  data () {
 
     const that = this;
 
     return {
 
-      isAsc:"asc",
 
-      wpArray:[],
 
-      wtArray:[],
 
-      wpId:"",
 
-      wtId:"",
 
-      wpId2:"",
 
-      recorddate:new Date((new Date().getTime() - 3600 * 1000 * 24)).formatDate("yyyy-MM-dd"),
 
-      beginDate:"",
 
-      endDate:"",
 
-      dialogShow:false,
 
+      isAsc: "asc",
 
+      wpArray: [],
 
+      wtArray: [],
 
+      wpId: "",
 
+      wtId: "",
 
+      wpId2: "",
 
+      recorddate: new Date((new Date().getTime() - 3600 * 1000 * 24)).formatDate("yyyy-MM-dd"),
 
+      beginDate: "",
 
+      endDate: "",
 
+      dialogShow: false,
 
 
       tableData: {
 
         column: [
 
           {
 
-            name: "风场",
 
-            field: "name",
 
-            is_num: false,
 
-            is_light: false,
 
-            sortable: true
 
-          },
 
-          {
 
             name: "风机",
 
             field: "windturbineid",
 
             is_num: false,
 
@@ -193,10 +181,10 @@ export default {
 
             field: "",
 
             is_num: false,
 
             is_light: false,
 
-            template() {
 
-								return "<el-button type='text' style='cursor: pointer;'>详情</el-button>";
 
-						},
 
-            click(e, row){
 
+            template () {
 
+              return "<el-button type='text' style='cursor: pointer;'>详情</el-button>";
 
+            },
 
+            click (e, row) {
 
               that.jumpUrl(row);
 
             }
 
           },
 
@@ -205,10 +193,10 @@ export default {
 
             field: "",
 
             is_num: false,
 
             is_light: false,
 
-            template() {
 
-								return "<el-button type='text' style='cursor: pointer;'>历史</el-button>";
 
-						},
 
-            click(e, row){
 
+            template () {
 
+              return "<el-button type='text' style='cursor: pointer;'>历史</el-button>";
 
+            },
 
+            click (e, row) {
 
               that.getOutputspeedHistoryList(row);
 
             }
 
           }
 
@@ -374,122 +362,122 @@ export default {
 
   // 函数
 
   methods: {
 
     // 请求服务
 
-    requestData() {
 
+    requestData () {
 
       let that = this;
 
       that.API.requestData({
 
         method: "GET",
 
         subUrl: "powercompare/windfarmAjax",
 
-        success(res) {
 
-          that.wpArray=res.data;
 
-          that.wpId=res.data[0].id;
 
+        success (res) {
 
+          that.wpArray = res.data;
 
+          that.wpId = res.data[0].id;
 
           that.getOutputSpeedList(that.wpId)
 
         }
 
       });
 
     },
 
 
-    getOutputSpeedList(wpId){
 
+    getOutputSpeedList (wpId) {
 
       let that = this;
 
-      if(!that.wpId || !that.recorddate){
 
+      if (!that.wpId || !that.recorddate) {
 
         that.BASE.showMsg({
 
-          msg:"场站与日期不可为空"
 
+          msg: "场站与日期不可为空"
 
         });
 
-      }else{
 
+      } else {
 
         that.API.requestData({
 
           method: "POST",
 
           subUrl: "goodness/windturbinegoodness",
 
-          data:{
 
+          data: {
 
             wpId,
 
-            isAsc:that.isAsc,
 
-            recorddate:that.recorddate
 
+            isAsc: that.isAsc,
 
+            recorddate: that.recorddate
 
           },
 
-          success(res) {
 
+          success (res) {
 
             that.tableData.data = res.data.list;
 
           }
 
         });
 
       }
 
-      
+
 
     },
 
 
-    getOutputspeedHistoryList (item){
 
+    getOutputspeedHistoryList (item) {
 
       let that = this;
 
 
       that.API.requestData({
 
-          method: "GET",
 
-          subUrl: "powercompare/windturbineAjax",
 
-          data:{
 
-            wpId: item.windtpowerstationid
 
-          },
 
-          success(res) {
 
-            that.wtArray=res.data;
 
-
 
-            that.wpId2 = item.windtpowerstationid;
 
-            that.wtId = item.windturbineid;
 
-            that.beginDate = (new Date().formatDate("yyyy-MM") + '-01');
 
-            that.endDate = new Date().formatDate("yyyy-MM-dd");
 
-
 
-            that.API.requestData({
 
-              method: "POST",
 
-              subUrl: "goodness/goodhistorylist",
 
-              data:{
 
-                wpId: that.wpId2,
 
-                wtId: that.wtId,
 
-                beginDate: that.beginDate,
 
-                endDate: that.endDate
 
-              },
 
-              success(res) {
 
-                res.data.forEach(ele=>{
 
-                  ele.time=new Date(ele.recorddate).formatDate("yyyy-MM-dd");
 
-                });
 
-                that.historyTableData.data = res.data;
 
-                that.dialogShow = true;
 
-              }
 
-            });
 
-          }
 
-        });
 
+        method: "GET",
 
+        subUrl: "powercompare/windturbineAjax",
 
+        data: {
 
+          wpId: item.windtpowerstationid
 
+        },
 
+        success (res) {
 
+          that.wtArray = res.data;
 
+
 
+          that.wpId2 = item.windtpowerstationid;
 
+          that.wtId = item.windturbineid;
 
+          that.beginDate = (new Date().formatDate("yyyy-MM") + '-01');
 
+          that.endDate = new Date().formatDate("yyyy-MM-dd");
 
+
 
+          that.API.requestData({
 
+            method: "POST",
 
+            subUrl: "goodness/goodhistorylist",
 
+            data: {
 
+              wpId: that.wpId2,
 
+              wtId: that.wtId,
 
+              beginDate: that.beginDate,
 
+              endDate: that.endDate
 
+            },
 
+            success (res) {
 
+              res.data.forEach(ele => {
 
+                ele.time = new Date(ele.recorddate).formatDate("yyyy-MM-dd");
 
+              });
 
+              that.historyTableData.data = res.data;
 
+              that.dialogShow = true;
 
+            }
 
+          });
 
+        }
 
+      });
 
     },
 
 
-    reGetWtArray(){
 
+    reGetWtArray () {
 
       let that = this;
 
       that.API.requestData({
 
-          method: "GET",
 
-          subUrl: "powercompare/windturbineAjax",
 
-          data:{
 
-            wpId: that.wpId2
 
-          },
 
-          success(res) {
 
-            that.wtArray=res.data;
 
-            that.wtId = res.data[0].id;
 
-          }
 
-        });
 
+        method: "GET",
 
+        subUrl: "powercompare/windturbineAjax",
 
+        data: {
 
+          wpId: that.wpId2
 
+        },
 
+        success (res) {
 
+          that.wtArray = res.data;
 
+          that.wtId = res.data[0].id;
 
+        }
 
+      });
 
     },
 
 
-    reGetHistoryTableData(){
 
-      let that=this;
 
-      if(!that.wpId2){
 
+    reGetHistoryTableData () {
 
+      let that = this;
 
+      if (!that.wpId2) {
 
         that.BASE.showMgs({
 
-          msg:"场站不可为空"
 
+          msg: "场站不可为空"
 
         });
 
-      }else if(!that.wtId){
 
+      } else if (!that.wtId) {
 
         that.BASE.showMgs({
 
-          msg:"风机不可为空"
 
+          msg: "风机不可为空"
 
         });
 
-      }else if(!that.beginDate || !that.endDate){
 
+      } else if (!that.beginDate || !that.endDate) {
 
         that.BASE.showMgs({
 
-          msg:"开始日期与结束日期不可为空"
 
+          msg: "开始日期与结束日期不可为空"
 
         });
 
-      }else{
 
+      } else {
 
         that.API.requestData({
 
           method: "POST",
 
           subUrl: "goodness/goodhistorylist",
 
-          data:{
 
+          data: {
 
             wpId: that.wpId2,
 
             wtId: that.wtId,
 
             beginDate: that.beginDate,
 
             endDate: that.endDate
 
           },
 
-          success(res) {
 
-            res.data.forEach(ele=>{
 
-              ele.time=new Date(ele.recorddate).formatDate("yyyy-MM-dd");
 
+          success (res) {
 
+            res.data.forEach(ele => {
 
+              ele.time = new Date(ele.recorddate).formatDate("yyyy-MM-dd");
 
             });
 
             that.historyTableData.data = res.data;
 
             that.dialogShow = true;
 
@@ -498,7 +486,7 @@ export default {
 
       }
 
     },
 
 
-    search(){
 
+    search () {
 
       this.getOutputSpeedList(this.wpId);
 
     },
 
 
@@ -506,15 +494,15 @@ export default {
 
     exportExcel () {
 
       let that = this;
 
       const { export_json_to_excel } = require('@tools/excel/Export2Excel.js'); // 注意这个Export2Excel路径      
-      
+
 
       // const tHeader = ['点名', '描述']; // 上面设置Excel的表格第一行的标题       
       // const filterVal = ['id', 'name']; // 上面的index、nickName、name是tableData里对象的属性key值   
-      
+
 
       let tHeader = []; // 上面设置Excel的表格第一行的标题       
       let filterVal = []; // 上面的index、nickName、name是tableData里对象的属性key值
 
 
-      that.tableData.column.forEach(ele=>{
 
-        if(ele.name !== "操作"){
 
+      that.tableData.column.forEach(ele => {
 
+        if (ele.name !== "操作") {
 
           tHeader.push(ele.name);
 
           filterVal.push(ele.field);
 
         }
 
@@ -529,15 +517,15 @@ export default {
 
     exportExcel2 () {
 
       let that = this;
 
       const { export_json_to_excel } = require('@tools/excel/Export2Excel.js'); // 注意这个Export2Excel路径      
-      
+
 
       // const tHeader = ['点名', '描述']; // 上面设置Excel的表格第一行的标题       
       // const filterVal = ['id', 'name']; // 上面的index、nickName、name是tableData里对象的属性key值   
-      
+
 
       let tHeader = []; // 上面设置Excel的表格第一行的标题       
       let filterVal = []; // 上面的index、nickName、name是tableData里对象的属性key值
 
 
-      that.historyTableData.column.forEach(ele=>{
 
-        if(ele.name !== "操作"){
 
+      that.historyTableData.column.forEach(ele => {
 
+        if (ele.name !== "操作") {
 
           tHeader.push(ele.name);
 
           filterVal.push(ele.field);
 
         }
 
@@ -553,18 +541,18 @@ export default {
 
     },
 
 
     // 页面跳转
 
-    jumpUrl(item){
 
-      this.$router.push(`/new/dj1/${item.windtpowerstationid}`);
 
+    jumpUrl (item) {
 
+      this.$router.push(`/performanceAnalysis/detail/${item.windtpowerstationid}/${item.windturbineid}`);
 
     }
 
   },
 
 
-  created() {
 
+  created () {
 
     this.requestData();
 
   },
 
 
-  mounted() {},
 
+  mounted () { },
 
 
-  unmounted() {},
 
+  unmounted () { },
 
 };
 
 </script>
 
 
@@ -592,7 +580,7 @@ export default {
 
     margin-top: 1.481vh;
 
 
     &:before {
 
-      content: "";
 
+      content: '';
 
       width: 0.37vh;
 
       height: 0.37vh;
 
       background: @write;