From f4aac33f3dac3d86ed30936c87a5970bfeba6310 Mon Sep 17 00:00:00 2001
From: hdw <496960745@qq.com>
Date: 星期二, 06 十一月 2018 09:13:02 +0800
Subject: [PATCH] 添加折线图

---
 gx_tieta/WebRoot/batt-traffic-statistics1.jsp |   62 ++++++++++++++++++++++++++++---
 1 files changed, 56 insertions(+), 6 deletions(-)

diff --git a/gx_tieta/WebRoot/batt-traffic-statistics1.jsp b/gx_tieta/WebRoot/batt-traffic-statistics1.jsp
index 52079ba..27174f5 100644
--- a/gx_tieta/WebRoot/batt-traffic-statistics1.jsp
+++ b/gx_tieta/WebRoot/batt-traffic-statistics1.jsp
@@ -149,6 +149,13 @@
             	<!-- 琛ㄦ牸鍐呭 -->
 				<table id="pageTbl" lay-filter="pageTbl"></table>
             </div>
+            <div id="echarts-container" class="abs abs-top220 bg-red abs-index1n abs-bottom70">
+            	<div class="abs-container">
+            		<div class="graph">
+	            		<div class="graph-content" id="lineGraph"></div>
+	            	</div>
+            	</div>
+            </div>
             <!-- 鍒嗛〉鍐呭 -->
 			<div id="paging">
 				<a href="javascript:" class="search"><s:text name="Search"/><!-- 鏌ヨ --></a>
@@ -162,12 +169,22 @@
 	    <script type="text/javascript" src="jqueryui/jquery-ui.min.js"></script>
         <script type="text/javascript" src="src/layui.js"></script>
         <script type="text/javascript" src="pages/js/mylayui.js"></script>
+        <script type="text/javascript" src="pages/js/pages/control-common.js"></script>
         <script type="text/javascript">
         	layui.use(['form', 'table', 'layer', 'laydate', 'element'], function() {
         		var table = layui.table;		// 鑾峰彇琛ㄦ牸妯″潡
         		var form = layui.form;			// 鑾峰彇琛ㄥ崟妯″潡
         		var layer = layui.layer;		// 鑾峰彇寮瑰嚭妗嗘ā鍧�
         		var laydate = layui.laydate;	// 鑾峰彇鏃ユ湡妯″潡
+        		var createLine = GLOBAL.eleDataGraph.createLine;	// 鐢熸垚鎶樼嚎鍥�
+        		var $lineGraph = $('#lineGraph').get(0);
+        		var lineGraph = echarts.init($lineGraph);
+        		createLine(lineGraph, {});
+        		
+        		// 椤甸潰澶у皬鏀瑰彉妯″潡
+        		$(window).resize(function() {
+        			lineGraph.resize();
+        		});
         		
         		// 瀹氫箟鏃堕棿妯″潡
         		var date = new Date();
@@ -413,12 +430,12 @@
 				});
 				
 				// 鍒囨崲鏁版嵁鏄剧ず绫诲瀷
+				var echartsCont = $('#echarts-container');
   				form.on('switch(dataType)', function(data){
-  					console.log(this.checked);
   					if(this.checked) {
-  						layer.msg('鎴戞槸鎶樼嚎鍥�');
+  						echartsCont.removeClass('abs-index1n');
   					}else {
-  						layer.msg('鎴戞槸琛ㄦ牸锛�');
+  						echartsCont.addClass('abs-index1n');
   					}
   				});
 				
@@ -469,7 +486,12 @@
 							
 							// 鐢熸垚琛ㄦ牸鏁版嵁
 							table.render(tOptions);
-							console.log(getLineData());
+							
+							// 鑾峰彇绫诲瀷
+							var type = sData.num;
+							var lineData = getLineData(type);
+							var lineGraphOpts = getlineGraphOpts(lineData, type)
+							createLine(lineGraph, lineGraphOpts);
 						}
 					});
 				}
@@ -487,12 +509,12 @@
 				}
 				
 				// 澶勭悊骞惰繑鍥炵敓鎴愭姌绾垮浘鐨勬暟鎹�
-				function getLineData() {
+				function getLineData(type) {
 					var rs = {
 						x: [],
 						y:[]
 					};
-					var type = $('#statistics').val();
+					
 					// 閬嶅巻allData鐨勫��
 					for(var i=0; i<allData.length; i++) {
 						var _allData = allData[i];
@@ -544,6 +566,34 @@
 					
 					return rs;
 				}
+				
+				// 鑾峰彇鐢熸垚鎶樼嚎鍥剧殑閰嶇疆椤�
+				function getlineGraphOpts(data, type) {
+					var rs = {
+						xdata:[],
+						sdata: [],
+					};
+					rs.xdata = data.x;
+					rs.sdata.push(data.y);
+					rs.tname = '娴侀噺缁熻';
+					rs.lname = ["浣跨敤娴侀噺"];
+					switch(type) {
+						case '3':
+							rs.subtxt = '鎸夊勾缁熻';
+							rs.unit = "G";
+						break;
+						case '1':
+							rs.subtxt = '鎸夋湀缁熻';
+							rs.unit = "M";
+						break;
+						default:
+							rs.subtxt = '鎸夊ぉ缁熻';
+							rs.unit = "M";
+						break;
+					}
+					console.log(rs);
+					return rs;
+				}
         	});
         </script>
     </body>

--
Gitblit v1.9.1