From efa0e60ffa77fd41449d64521c493571fc46d07e Mon Sep 17 00:00:00 2001 From: hdw <496960745@qq.com> Date: 星期二, 27 十一月 2018 15:11:59 +0800 Subject: [PATCH] 饼状图配置 --- gx_tieta/WebRoot/pages/js/pages/index-common.js | 111 ++++++++------- gx_tieta/WebRoot/index.jsp | 304 +++++++++++++++++++++++++++++-------------- 2 files changed, 267 insertions(+), 148 deletions(-) diff --git a/gx_tieta/WebRoot/index.jsp b/gx_tieta/WebRoot/index.jsp index e54a08e..c511404 100644 --- a/gx_tieta/WebRoot/index.jsp +++ b/gx_tieta/WebRoot/index.jsp @@ -219,16 +219,21 @@ <i class="fa fa-cog"></i> </a> </div> - <!--鐢垫睜鏁呴殰淇鍥�--> - <div class="repair-pie module"></div> - <!-- 鐢垫睜鏁呴殰楗肩姸鍥� --> - <div class="brdn-pie module"></div> - <!-- 鐢垫睜鍛婅楗肩姸鍥� --> - <div class="warn-pie module"></div> - <!--鐢垫睜鍋ュ悍楗肩姸鍥�--> - <div class="health-pie module"></div> - <!--娓呴櫎娴姩--> - <div class="clear"></div> + <div class="pie-item-con"> + <!-- 鏈烘埧鍋滅數 --> + <div class="repair-pie module"></div> + <!-- 鐢垫睜鐘舵�侀ゼ鐘跺浘 --> + <div class="brdn-pie module"></div> + <!-- 鐢垫睜鍛婅楗肩姸鍥� --> + <div class="warn-pie module"></div> + <!--鐢垫睜瀹归噺楗肩姸鍥�--> + <div class="health-pie module"></div> + <!-- 鏈烘埧缁埅鑳藉姏楗肩姸鍥� --> + <div class="endur-pie module"></div> + <!--娓呴櫎娴姩--> + <div class="clear"></div> + </div> + </div> <c:forEach var="cust" items="${sessionScope.custompages}"> <c:if test="${cust.submenu eq 'My_work' && cust.subflag eq 1}"> @@ -453,6 +458,15 @@ ]; + + // 璁剧疆椤甸潰涓璸ie鐨勬ā鍧� + ;(function() { + var pieStatus = GLOBAL.Index.Pie.pieStatus; // 鏌ヨ楗肩姸鍥炬樉绀虹殑鐘舵�� + var pieItemCon = $('.pie-con .pie-item-con'); + pieItemCon.text(''); + var pieItems = pieStatus(); + pieItemCon.html(pieItems); + })(); var locationcity; @@ -783,36 +797,23 @@ } $(function() { - flushFourPie(); - - if($('#content .brdn-pie').length>0){ - //鐢熸垚鐢垫睜鐘舵�侀ゼ鐘跺浘 - var $brdn=$('#content .pie-con .brdn-pie'); //鑾峰彇鏁呴殰瀹瑰櫒鐨刯query瀵硅薄 - var brdn=$brdn.get(0); //灏嗗鍣ㄧ殑jquery瀵硅薄杞寲涓篸om瀵硅薄 - brdnPie=echarts.init(brdn); //鍒濆鍖栬〃鏍煎鍣� - brdnPie.showLoading(); - } - - if($('#content .repair-pie').length>0){ - var $repair=$('#content .pie-con .repair-pie'); //鑾峰彇鏈烘埧鍋滅數鍥惧鍣ㄧ殑jquery瀵硅薄 - var repair=$repair.get(0); //灏嗘晠闅滃鍣ㄧ殑jquery瀵硅薄杞寲涓篸om瀵硅薄 - repairPie=echarts.init(repair); //鍒濆鍖栬〃鏍煎鍣� - repairPie.showLoading(); - } + flushFourPie(true); }); //鏇存柊鍥涚楗肩姸鍥� - function flushFourPie(){ + function flushFourPie(create){ var cityname = $('#panelCity').val(); locationcity = getCityByName(cityname); + if(create) { + initPieObj(); + } + + searchalarm_data(); //鏌ヨ鍛婅鐜� searchGood(); //鏌ヨ鍋ュ悍鐜� searchmaintByMap(); //鏌ヨ鐢垫睜鐘舵�� - searchBatt_maint_inf(); //鏌ヨ鏈烘埧鍋滅數姣斾緥 - - - + searchEndurHome(); //鏌ヨ缁埅楗肩姸鍥� } //鏌ヨ鏈�杩戠殑鏁呴殰缁存姢璁板綍 @@ -919,20 +920,22 @@ }); } - + var warnPie; //鏌ヨ鍛婅淇℃伅骞舵樉绀哄憡璀︾巼 function searchalarm_data(){ if($('#content .warn-pie').length==0){ return; } - //鐢熸垚鐢垫睜鍛婅鐜囬ゼ鐘跺浘 var $warn=$('#content .pie-con .warn-pie'); //鑾峰彇鍛婅瀹瑰櫒鐨刯query瀵硅薄 if($warn.length!=0){ - var warn=$warn.get(0); //灏嗗憡璀﹀鍣ㄧ殑jquery瀵硅薄杞寲涓篸om瀵硅薄 - var warnPie=echarts.init(warn); //鍒濆鍖栧浘琛ㄥ鍣� - window.warnPie = warnPie; - warnPie.showLoading(); + var isEcharts = isObject(warnPie)?true:false; + if(!isEcharts) { + var warn=$warn.get(0); //灏嗗憡璀﹀鍣ㄧ殑jquery瀵硅薄杞寲涓篸om瀵硅薄 + warnPie=echarts.init(warn); //鍒濆鍖栧浘琛ㄥ鍣� + warnPie.showLoading(); + } + var cityname=''; //console.info("="+locationcity.pinyin+"="); @@ -1004,47 +1007,63 @@ } //鍒涘缓鐢垫睜鍛婅楗肩姸鍥� var warnTle="<s:text name='Battery_alarm_rate'/>"; /* 鐢垫睜鍛婅鐜� */ - createPie(warnPie,warnTle,Almarr); - warnPie.on('click', function(param) { - // 0:鍦ㄧ嚎鐢靛帇 1:缁勭鐢靛帇 2:鍏呯數鐢垫祦 3:鏀剧數鐢垫祦 4:鍗曚綋鐢靛帇 5:瀹归噺鍛婅 - if(param.dataIndex == 5) { + if(!isEcharts) { + createPie(warnPie,warnTle,Almarr); + warnPie.on('click', function(param) { + // 0:鍦ㄧ嚎鐢靛帇 1:缁勭鐢靛帇 2:鍏呯數鐢垫祦 3:鏀剧數鐢垫祦 4:鍗曚綋鐢靛帇 5:瀹归噺鍛婅 + if(param.dataIndex == 5) { + + }else { + window.open('elewarn.jsp?warntype='+param.dataIndex+'&warntxt='+param.name); + } - }else { - window.open('elewarn.jsp?warntype='+param.dataIndex+'&warntxt='+param.name); - } - - }); + }); + }else { + var opts = getOpt(warnTle, Almarr); + warnPie.setOption(opts); + } + + setTimeout(searchalarm_data, 10000) + } }); } } - var battstate_isExist = true; var brdnPie; //鏌ヨ鍚勪釜鏈烘埧鐨勭數姹犵姸鎬� function searchmaintByMap(){ if($('#content .brdn-pie').length==0){ return; } + + // 鍒ゆ柇鏄惁涓篍charts瀵硅薄 + var isEcharts = isObject(brdnPie)?true:false; + + if(!isEcharts) { + //鐢熸垚鐢垫睜鐘舵�侀ゼ鐘跺浘 + var $brdn=$('#content .pie-con .brdn-pie'); //鑾峰彇鏁呴殰瀹瑰櫒鐨刯query瀵硅薄 + var brdn=$brdn.get(0); //灏嗗鍣ㄧ殑jquery瀵硅薄杞寲涓篸om瀵硅薄 + brdnPie=echarts.init(brdn); //鍒濆鍖栬〃鏍煎鍣� + } + + var brdnTle="<s:text name='Batte_state'/>"; /* 鐢垫睜鐘舵�� */ $.post("Batt_rtstateAction!serchBattStateRate",null,function(data){ var model=eval("("+data.result+")"); //console.info(model); var maintarr = new Array(); setBatt_list(maintarr,model.data); - if(battstate_isExist){ + if(!isEcharts){ //鍒涘缓鐢垫睜鏁呴殰鐜囩姸鍥� createPie(brdnPie,brdnTle,maintarr); - battstate_isExist = false; brdnPie.on('click', function(param) { - console.info(param); window.open('elestatus.jsp?battstate='+param.dataIndex); }); }else{ brdnPie.setOption(getOpt(brdnTle, maintarr)); - //console.info("鏇存柊鎴愬姛"); } - setTimeout("searchmaintByMap()",10000); + setTimeout(searchmaintByMap, 10000); }); } @@ -1084,13 +1103,21 @@ {state:4,value:"<s:text name='Average_charge'/>",color:'#800080'}, //鍧囧厖 ]; - var repairPie; - var powercut_isNew = true; + var repairPie; //鏌ヨ鏈烘埧鍋滅數鐘舵�� function searchBatt_maint_inf(){ if($('#content .repair-pie').length==0){ return; } + // 鍒ゆ柇鏄惁涓篍charts瀵硅薄 + var isEcharts = isObject(repairPie)?true:false; + if(!isEcharts) { + var $repair=$('#content .pie-con .repair-pie'); //鑾峰彇鏈烘埧鍋滅數鍥惧鍣ㄧ殑jquery瀵硅薄 + var repair=$repair.get(0); //灏嗘晠闅滃鍣ㄧ殑jquery瀵硅薄杞寲涓篸om瀵硅薄 + repairPie=echarts.init(repair); //鍒濆鍖栬〃鏍煎鍣� + } + + // 璇锋眰鍚庡彴 $.ajax({ type: "post", //url: "BattPower_offAction!serchPowerOff", @@ -1113,9 +1140,7 @@ {name:"鏈烘埧鎺夌珯", val: model.code}]; /* '鏈慨澶�' */ } var repairTle="<s:text name='Computer_room'/><s:text name='Power_cut'/>"; /* '鏈烘埧鍋滅數' */ - if(powercut_isNew){ - //鍒涘缓鏈烘埧鍋滅數楗肩姸鍥� - powercut_isNew = false; + if(!isEcharts){ createPie(repairPie,repairTle,repairObj); repairPie.on('click', function() { window.open('batt-state-manage.jsp'); @@ -1124,8 +1149,8 @@ var opt = getOpt(repairTle, repairObj); repairPie.setOption(opt); } - //console.info(repairPie); - setTimeout("searchBatt_maint_inf()", 10000); + + setTimeout(searchBatt_maint_inf, 10000); }, error:function(){ //setTimeout("searchBatt_maint_inf()", 10000); @@ -1134,6 +1159,7 @@ } //鏌ヨ鍋ュ悍鐜� + var healthPie; function searchGood(){ if($('#content .health-pie').length==0){ return; @@ -1141,16 +1167,18 @@ //鐢熸垚鐢垫睜鍋ュ悍鐜� var $health=$('#content .pie-con .health-pie'); //鑾峰彇鏁呴殰瀹瑰櫒鐨刯query瀵硅薄 if($health.length!=0){ - var health=$health.get(0); //灏嗘晠闅滃鍣ㄧ殑jquery瀵硅薄杞寲涓篸om瀵硅薄 - var healthPie=echarts.init(health); //鍒濆鍖栬〃鏍煎鍣� - window.healthPie = healthPie; + // 鏄惁echarts瀵硅薄 + var isEcharts = isObject(healthPie)?true:false; + if(!isEcharts) { + var health=$health.get(0); //灏嗘晠闅滃鍣ㄧ殑jquery瀵硅薄杞寲涓篸om瀵硅薄 + healthPie=echarts.init(health); //鍒濆鍖栬〃鏍煎鍣� + healthPie.showLoading(); + } + var healthTle="<s:text name='Monomer_cap_health_rate'/>"; /* '鐢垫睜鍋ュ悍鐜�' */ - healthPie.showLoading(); $.post("Battalarm_dataAction!serchGood",null,function(data){ var model=eval("("+data.result+")"); - //console.info(model); var healthObj; - //console.info(model); if(model.code==1){ healthObj=[ {name:"鍗曚綋瀹归噺鍋ュ悍",val:model.sum-model.data[0]-model.data[1],color:'#31CB36'}, /* '鍋ュ悍鐢垫睜' */ @@ -1164,16 +1192,106 @@ {name:"鍗曚綋瀹归噺鏇存崲",val:0,color:'#FF0000'} ]; } - //鍒涘缓鐢垫睜鏁呴殰楗肩姸鍥� - createPie(healthPie,healthTle,healthObj); + if(!isEcharts) { + //鍒涘缓鐢垫睜鏁呴殰楗肩姸鍥� + createPie(healthPie,healthTle,healthObj); + + // 鐐瑰嚮楗肩姸鍥捐繘琛岃烦杞� + healthPie.on('click', function(param) { + window.open('taskplan.jsp'); // 璺宠浆鍒拌惤鍚庡崟浣撴煡璇� + }); + }else { + var opt = getOpt(healthTle, healthObj); + healthPie.setOption(opt); + } - // 鐐瑰嚮楗肩姸鍥捐繘琛岃烦杞� - healthPie.on('click', function(param) { - window.open('taskplan.jsp'); // 璺宠浆鍒拌惤鍚庡崟浣撴煡璇� - }); + setTimeout(searchGood, 10000); }); } } + + // 鏌ヨ缁埅涓嶈冻鐨勬満鎴挎暟 + var endurPie; + function searchEndurHome() { + if($('#content .endur-pie').length==0){ + return; + } + + //鐢熸垚鐢垫睜鍛婅鐜囬ゼ鐘跺浘 + var $endur=$('#content .pie-con .endur-pie'); //鑾峰彇鍛婅瀹瑰櫒鐨刯query瀵硅薄 + if($endur.length!=0){ + var isEcharts = endurPie?true:false; + if(!isEcharts) { + var endur=$endur.get(0); //灏嗘晠闅滃鍣ㄧ殑jquery瀵硅薄杞寲涓篸om瀵硅薄 + endurPie=echarts.init(endur); //鍒濆鍖栬〃鏍煎鍣� + } + + var endurTle="鏈烘埧缁埅鑳藉姏"; /* 鏈烘埧缁埅鑳藉姏 */ + // 鏌ヨ鍚庡彴鍐呭 + $.ajax({ + type: 'post' + ,async: true + ,url: 'Batt_enduranceAction!serchByState_xuhang' + ,data: null + ,dataType: 'json' + ,success: function(res) { + var rs = JSON.parse(res.result); + if(rs.code == 1) { + var data = rs.data; + var endurObj =[ + {name:"缁埅涓嶈冻1灏忔椂",val:data[0],color:'#FF0000'} + ,{name:"缁埅1~2灏忔椂",val:data[1],color:'#D1D105'} + ,{name:"缁埅2~3灏忔椂",val:data[2],color:'#31CB36'} + ,{name:"缁埅3灏忔椂浠ヤ笂",val:data[3],color:'#800080'} + ]; + + if(!isEcharts) { + //鍒涘缓鐢垫睜鏁呴殰楗肩姸鍥� + createPie(endurPie,endurTle,endurObj); + }else { + var opts = getOpt(endurTle, endurObj); + endurPie.setOption(opts); + } + } + + setTimeout(searchEndurHome, 10000); + } + }); + + } + } + + // 鍒濆鍖栭ゼ鐘跺浘瀹瑰櫒瀵硅薄 + function initPieObj() { + warnPie = false; + brdnPie = false; + repairPie = false; + healthPie = false; + endurPie = false; + } + + //璁╁湴鍥惧拰楗肩姸鍥鹃殢娴忚鍣ㄧ獥鍙g殑鏀瑰彉鑰屾敼鍙� + $(window).resize(function(){ + getMapHt(); + if(isObject(warnPie)) + { + warnPie.resize(); + } + if(isObject(brdnPie)) + { + brdnPie.resize(); + } + if(isObject(repairPie)) + { + repairPie.resize(); + } + if(isObject(healthPie)) { + healthPie.resize(); + } + if(isObject(endurPie)) { + endurPie.resize(); + } + }); //鏌ヨ鎵�鏈夌殑鍏憡淇℃伅 function searchAnnounceall(){ @@ -1202,15 +1320,12 @@ //鏌ヨ鏀剧數娴嬭瘯鐨勬瘮渚� function searchTestsCale(){ if($('#content .discharge-test').length==0){ - //alert(); return; } //鐢熸垚鐢垫睜鏈斁鐢垫瘮渚嬪浘 var $health=$('#content .discharge-test .test-pie'); //鑾峰彇鏁呴殰瀹瑰櫒鐨刯query瀵硅薄 if($health.length!=0){ var health=$health.get(0); //灏嗘晠闅滃鍣ㄧ殑jquery瀵硅薄杞寲涓篸om瀵硅薄 - //console.info(health); - //healthPie.showLoading(); var healthTle="<s:text name='Battery_discharge_scale_map'/>"; /* '鐢垫睜鏀剧數姣斾緥鍥�' */ Batttest_Td=new Array(); $.post("Batttestdata_infAction!searchTestsCale",$('#batttest_form').serialize(),function(data){ @@ -1457,10 +1572,7 @@ }); }); - $(window).resize(function() { - console.log(123); - getMapHt(); - }); + // 鏀瑰彉div鐨勫ぇ灏� function changeDivBig(ele) { // 闅愯棌闈㈡澘 @@ -3092,25 +3204,6 @@ $(function() { searchProvince(); - }); - - //璁╁湴鍥惧拰楗肩姸鍥鹃殢娴忚鍣ㄧ獥鍙g殑鏀瑰彉鑰屾敼鍙� - $(window).resize(function(){ - if(warnPie != undefined) - { - warnPie.resize(); - } - if(brdnPie != undefined) - { - brdnPie.resize(); - } - if(repairPie != undefined) - { - repairPie.resize(); - } - if(healthPie != undefined) { - healthPie.resize(); - } }); // 鐐瑰嚮鍒囨崲鍐呭 @@ -3629,6 +3722,7 @@ var model = eval('('+data.result+')'); if(model.code == 1) { var result = model.data; + //console.log(result); var formatData = formatPieRsData(result[0]); laytpl(pieConfTpl).render(formatData, function(html) { layer.open({ @@ -3704,6 +3798,7 @@ // 鏇存柊褰撳墠鐢ㄦ埛璁剧疆楗肩姸鍥剧殑浣胯兘鐘舵�� function updateUserBieState(temp, dialog, load){ + var pieItemCon = $('.pie-con .pie-item-con'); // 鏇存柊鍚庡彴鏁版嵁 $.ajax({ type:"post", @@ -3713,9 +3808,22 @@ data:'json='+JSON.stringify(temp), success: function(data){ layer.closeAll(); - var model = eval('('+data.result+')'); if(model.code == 1) { + // 鏇村叿temp鐨勫�艰缃ゼ鐘跺浘鐨勫唴瀹� + var formaterTmp = GLOBAL.Index.Pie.formaterPieStauts(temp); + //console.log(formaterTmp); + var pieItems = GLOBAL.Index.Pie.getPieList(formaterTmp); + //console.log(pieItems); + pieItemCon.text(''); + pieItemCon.append(pieItems); + + // 璁剧疆楂樺害 + getMapHt(); + + // 鏇存柊楗肩姸鍥� + flushFourPie(true); + layer.msg('閰嶇疆鎴愬姛锛侊紒锛�'); }else { layer.msg('閰嶇疆澶辫触锛侊紒锛�'); diff --git a/gx_tieta/WebRoot/pages/js/pages/index-common.js b/gx_tieta/WebRoot/pages/js/pages/index-common.js index 5223704..6a683c0 100644 --- a/gx_tieta/WebRoot/pages/js/pages/index-common.js +++ b/gx_tieta/WebRoot/pages/js/pages/index-common.js @@ -3,76 +3,87 @@ gl.namespace('Index.Pie'); var pieType = [ + { + name: '鏈烘埧鍋滅數' + ,cla: 'repair-pie' + }, { - name: '鐢垫睜鐘舵��', - action: 'Batt_rtstateAction!serchBattStateRate', - formatData: eleStatus + name: '鐢垫睜鐘舵��' + ,cla: 'brdn-pie' }, { - name: '鐢垫睜鍛婅鐜�', - action: 'Battalarm_dataAction!serchAlm', - formatData: eleWarn + name: '鐢垫睜鍛婅鐜�' + ,cla: 'warn-pie' }, { - name: '鏈烘埧鍋滅數', - action: 'BattPower_offAction!serchPowerOff', - formatData: homeCut + name: '鍗曚綋瀹归噺鍋ュ悍鐜�' + ,cla: 'health-pie' }, { - name: '鍗曚綋瀹归噺鍋ュ悍鐜�', - action: 'Battalarm_dataAction!serchGood', - formatData: monCapGood + name: '鏈烘埧缁埅鑳藉姏' + ,cla: 'endur-pie' } ]; // 灏唒ieType缁戝畾鍒癐ndex.Pie鍛藉悕绌洪棿涓� gl.Index.Pie.pieType = pieType; - // 鏍规嵁鏁扮粍璋冪敤鏌ヨ鍐呭 - function search(arr) { - for(var i=0; i<arr.length; i++) { - if(arr[i]) { - ajax(pieType[i]); - } - } - } - - // 灏唖earch缁戝畾鍒癐ndex.Pie鍛藉悕绌洪棿涓� - gl.Index.Pie.search = search; - - // 璇锋眰鍚庡彴 - function ajax(obj) { - // ajax璇锋眰鍚庡彴 + // 鏌ヨ楗肩姸鍥剧姸鎬佽繑鍥為渶瑕佹樉绀洪ゼ鐘跺浘 + function pieStatus() { + // 璁剧疆涓�涓悓姝ユ煡璇㈣繑鍥炰竴涓猟iv.pie-item-list + var pieItems; $.ajax({ - type: 'post', - url: obj.action, - data: null, - async: true, - dataType: 'json', - success:function(result) { - var rs = JSON.parse(result.result); - var pieData = obj.formatData(rs); - + type: 'post' + ,async: false + ,url: 'Echarts_usrAction!serchByCondition' + ,data: null + ,dataType: 'json' + ,success: function(res) { + var rs = JSON.parse(res.result); + //console.log(rs); + if(rs.code == 1) { + var data = rs.data[0]; + var rsStatus = formaterPieStauts(data); + pieItems = getPieList(rsStatus); + } } }); + + return pieItems; } - // 鐢垫睜鐘舵�� - function eleStatus(data) { - console.log(data); + // 灏唒ieStatus缁戝畾鍒癐ndex.Pie鍛藉悕绌洪棿涓� + gl.Index.Pie.pieStatus = pieStatus; + + // 鏍规嵁鏁扮粍杩斿洖 + function getPieList(arr) { + var pieItems = $('<div class="pie-item-list"></div>'); + for(var i=0; i<arr.length; i++) { + if(arr[i] == 1) { + var cla = pieType[i].cla; + var pieItem = $('<div class="'+cla+' module"></div>'); + pieItems.append(pieItem); + } + + } + return pieItems; } - // 鐢垫睜鍛婅 - function eleWarn(data) { - console.log(data); + // 灏唃etPieList缁戝畾鍒癐ndex.Pie鍛藉悕绌洪棿涓� + gl.Index.Pie.getPieList = getPieList; + + // 鏋勯�犳洿鏂伴ゼ鐘跺浘鍙傛暟 + function formaterPieStauts(obj) { + var rs = []; + // 閬嶅巻pieType鐨勭被鍨� + for(var i=0; i<pieType.length; i++) { + var num = i+1; + var key = 'echarts'+num+'_enable'; + rs.push(obj[key]); + } + return rs; } - // 鏈烘埧鍋滅數 - function homeCut(data) { - console.log(data); - } - // 鍗曚綋瀹归噺鍋ュ悍鐜� - function monCapGood(data) { - console.log(data); - } + // 灏唃etPieList缁戝畾鍒癐ndex.Pie鍛藉悕绌洪棿涓� + gl.Index.Pie.formaterPieStauts = formaterPieStauts; })(jQuery, window, document, GLOBAL); \ No newline at end of file -- Gitblit v1.9.1