var fontcolor_grey = '#aeaeae';
    var fontcolor_black = '#0d2336';
    var color_blue = '#36FFF9';
    var color_blue_other = '#1D4F6D';
    var img_name = '';
    var titleColor = '#ffffff';
    var height = 1080;
    var width = 1920;
    var heightV =1;
    var widthV =1;
      var color = ['#ffff13','#31ff7d','#ff2ee3','#2e97ff','#ffb536'];
      var bizid = "";
      var jsp_id = "";
      var left_top_height = 0;
      var left_middle_height = 0;
      var left_bottom_height = 0;
      var center_top_height = 0;
      var center_middle_height = 0;
      var center_bottom_height = 0;
      var right_top_height = 0;
      var right_middle_height = 0;
      var right_bottom_height = 0;
      var selected_DailyWaterSupply = true;
      var selected_RawWaterQuality = true;
      var selectedAll = [];
      function changeDataType(){
    	  var dataType = $("#dataType").val();
    	  if(dataType==3){
    		  $("#proDatavisualFrameTitle").html("实时监视");
    	  }
    	  if(dataType==4){
    		  $("#proDatavisualFrameTitle").html("摄像头");
    	  }
    	  if(dataType==1){
      		  $("#unit").show();
            $("#proDatavisualFrame").hide();
    	  }else{
            $("#proDatavisualFrame").show();
            $("#unit").hide();
    	  }
      }
      
      function showDatavisualFrame4Select(hiddenId,textId,id){
    	  var dataType = $("#dataType").val();
    	  if(dataType==3){
  	        $.post(ext.contextPath + '/process/dataVisualFrame/showMenu4Select.do', {
	            formId: "subForm",
	            hiddenId: hiddenId,
	            textId: textId,
	            ownId: id,
	            menuType: 'proVisual'
	        }, function (data) {
	            $("#menu4SelectDiv").html(data);
	            openModal("menu4SelectModal")
	        });
    	  }
    	  if(dataType==4){
  	        $.post(ext.contextPath + '/process/dataVisualCamera/radioListForVisual.do', {
	            formId: "subForm",
	            hiddenId: hiddenId,
	            textId: textId,
	        }, function (data) {
	            $("#menu4SelectDiv").html(data);
	            openModal("cameraSubModal")
	        });
    	  }
      }
      var showCompany4SelectFun = function (hiddenId,textId,id) {
          $.post(ext.contextPath + '/user/showCompany4Select.do', { formId: "subForm", hiddenId: hiddenId, textId: textId }, function (data) {
              $("#company4SelectDiv").html(data);
              openModal("company4SelectModal");
          });
      };
      
      function dosaveElement(){
          var icon_width = 36;
          var icon_height = 49;
          var elementLeft = $("#elementLeft").val();
          var elementTop = $("#elementTop").val();
          if(dataType==1){
              icon_width = 36;
              icon_height = 49;
          }else{
              icon_width = 18;
              icon_height = 42;
          }
          $("#subForm #elementLeft").val(elementLeft-icon_width/2);
          $("#subForm #elementTop").val(elementTop-icon_height);
        $("#subForm").bootstrapValidator({
            live: 'disabled',//验证时机，enabled是内容有变化就验证（默认），disabled和submitted是提交再验证
            fields: {
                name: {
                    validators: {
                        notEmpty: {
                            message: '名称不能为空'
                        }
                    }
                },
            }
        });
    	  $("#subForm").bootstrapValidator('validate');//提交验证  
          if ($("#subForm").data('bootstrapValidator').isValid()) {//获取验证结果，如果成功，执行下面代码  
            $.post(ext.contextPath + "/jspConfigure/save.do", $("#subForm").serialize(), function(result) {
              if (result == 1) {
                      getImgData();
                  }else{
                      alert('保存失败');
                  }
            },'json');  
          }
      }
      function doupdateElement() {
    	    $("#subForm").bootstrapValidator('validate');//提交验证  
    	        if ($("#subForm").data('bootstrapValidator').isValid()) {//获取验证结果，如果成功，执行下面代码  
    	          $.post(ext.contextPath + "/jspConfigure/update.do", $("#subForm").serialize(), function(data) {
    	                if (data == 1){
    	                    getImgData();
    	                }else if(data == 0){
    	                      alert('保存失败');
    	                }else{
    	                      alert(data);
    	                }
    	          },'json');  
    	        } 
    	  }

    	  function dodelElement() {
    	      swal({
    	          text: "您确定要删除此记录？",
    	          dangerMode: true,
    	          buttons: {
    	                cancel: {
    	                    text: "取消",
    	                    value: null,
    	                    visible: true,
    	                    className: "btn btn-default btn-sm",
    	                    closeModal: true,
    	                  },
    	                  confirm: {
    	                    text: "确定",
    	                    value: true,
    	                    visible: true,
    	                    className: "btn btn-danger btn-sm",
    	                    closeModal: true
    	                  }
    	            }
    	        })
    	        .then(function(willDelete) {
    	          if (willDelete) {
    	            $.post(ext.contextPath + '/jspConfigure/delete.do', $("#subForm").serialize(), function(data) {
    	                if(data>0){
                            getImgData();
    	                }else{
    	                    alert('删除失败'); 
    	                }
    	            },'json');
    	            
    	          }
    	        });
    	  }
      function addAndRemove4Class(one,two){
          $('.'+one).addClass(two);
          $('.'+one).removeClass(one);
      }
      function getData(){
        var time_input = $('#time_input').val();
          $.post(ext.contextPath + '/smart/getSmartData.do', {bizid:bizid,time:time_input,jsp_id:jsp_id} , function(data) {
                var arr= JSON.parse(data);
                console.log(arr);
                var left_middle_line_legenddata=[];
                var left_middle_line_seriesdata=[];
                var left_bottom_bar_legenddata=[];
                var left_bottom_bar_seriesdata=[];
                var bar_max =0;
                var bar_min =0;
                var bar_totle =0;
                var center_bottom_line_legenddata=[];
                var center_bottom_line_seriesdata=[];
                var patrol =0;
                var maintenance =0;
                var right_bottom_bar_legenddata=[];
                var right_bottom_bar_seriesdata=[];
                var water_supply_title = "";
                var effluentQuality_title = "";
                var key_indicators = "";
                
                if(arr.rows!=null && arr.rows!=undefined && arr.rows!=''){
                  for(var i=0;i<arr.rows.length;i++){
                    var value =0;
                    var numtail=0;
                    var dataMax=0;
                    var rate = 1;
                    if(arr.rows[i].visualCacheConfig!=null 
                            && arr.rows[i].visualCacheConfig!=undefined 
                            && arr.rows[i].visualCacheConfig!=''){
                        var visualCacheConfig = arr.rows[i].visualCacheConfig;
                        if(visualCacheConfig.numtail!=null && visualCacheConfig.numtail!=undefined && visualCacheConfig.numtail!=''){
                          numtail = visualCacheConfig.numtail;
                        }
                    }
                    if(arr.rows[i].visualCacheData!=null 
                        && arr.rows[i].visualCacheData!=undefined 
                        && arr.rows[i].visualCacheData!=''){
                      var visualCacheData = arr.rows[i].visualCacheData;

                        if(visualCacheData.inivalue!=null && visualCacheData.inivalue!=undefined && visualCacheData.inivalue!=''){
                            value = visualCacheData.inivalue;
                        }else{
                          if(visualCacheData.value!=null && visualCacheData.value!=undefined && visualCacheData.value!=''){
                              value = visualCacheData.value;
                            }else{
                                if(arr.rows[i].mPoint!=null && arr.rows[i].mPoint!=undefined && arr.rows[i].mPoint!=''){
                                    var mPoint = arr.rows[i].mPoint;
                                  if(mPoint.parmvalue!=null && mPoint.parmvalue!=undefined && mPoint.parmvalue!=''){
                                    value = mPoint.parmvalue;
                                  }
                                  if(mPoint.alarmmax!=null && mPoint.alarmmax!=undefined && mPoint.alarmmax!=''){
                                    dataMax = mPoint.alarmmax;
                                  }
                                  if(mPoint.numtail!=null && mPoint.numtail!=undefined && mPoint.numtail!=''){
                                    numtail = mPoint.numtail;
                                  }
                                  if(mPoint.measuredt!=null && mPoint.measuredt!=undefined && mPoint.measuredt!=''){
                                    nowdate = mPoint.measuredt;
                                    }
                                }
                            }
                        }
                      if(visualCacheData.numtail!=null && visualCacheData.numtail!=undefined && visualCacheData.numtail!=''){
                        numtail = visualCacheData.numtail;
                      }
                      if(visualCacheData.rate!=null && visualCacheData.rate!=undefined && visualCacheData.rate!=''){
                          rate = visualCacheData.rate;
                          }
                    }else{
                      var mPoint = arr.rows[i].mPoint;
                      if(mPoint!=null && mPoint!=undefined && mPoint!=''){
                        if(mPoint.parmvalue!=null && mPoint.parmvalue!=undefined && mPoint.parmvalue!=''){
                          value = mPoint.parmvalue;
                        }
                        if(mPoint.alarmmax!=null && mPoint.alarmmax!=undefined && mPoint.alarmmax!=''){
                          dataMax = mPoint.alarmmax;
                        }
                        if(mPoint.numtail!=null && mPoint.numtail!=undefined && mPoint.numtail!=''){
                          numtail = mPoint.numtail;
                        }
                      }
                    }
                    value =  parseFloat(value)*rate;
                    value = value.toFixed(numtail);
                    //value =  parseFloat(value).toFixed(numtail);
                    if($("."+arr.rows[i].elementCode).length > 0){
                        $("."+arr.rows[i].elementCode).html(toThousands(value));
                      }
                    if($("#"+arr.rows[i].elementCode+"_title").length > 0){
                    	$("#"+arr.rows[i].elementCode+"_title").attr("data-mpcode",arr.rows[i].visualCacheData.mpcode);
                    }
                    if(arr.rows[i].elementCode=='effluent_turbidity' ){
                        if($(".yesterday_water_supply").length > 0){
                            var yes_value = 0;
                            if(arr.rows[i].mPointHistory!=null 
                                && arr.rows[i].mPointHistory!=undefined 
                                && arr.rows[i].mPointHistory!=''){
                              var mPointHistory = arr.rows[i].mPointHistory;
                              if(mPointHistory.length>2){
                                  yes_value = mPointHistory[mPointHistory.length-2].parmvalue.toFixed(numtail);
                              }else{
                                if(mPointHistory.length>1){
                                  yes_value = mPointHistory[mPointHistory.length-1].parmvalue.toFixed(numtail);
                                }else{
                                  yes_value = mPointHistory[0].parmvalue.toFixed(numtail);
                                }
                              }
                            }else{
                              if(arr.rows[i].visualCacheDataList!=null 
                                  && arr.rows[i].visualCacheDataList!=undefined 
                                  && arr.rows[i].visualCacheDataList!=''){
                                  var visualCacheDataList = arr.rows[i].visualCacheDataList;
                                  if(visualCacheDataList.length>2){
                                      yes_value = visualCacheDataList[visualCacheDataList.length-2].value.toFixed(numtail);
                                  }else{
                                    if(visualCacheDataList.length>1){
                                          yes_value = visualCacheDataList[visualCacheDataList.length-1].value.toFixed(numtail);
                                    }else{
                                          yes_value = visualCacheDataList[0].value.toFixed(numtail);
                                    }
                                  }
                                }
                            }
                         $(".yesterday_water_supply").html(toThousands(yes_value));
                       }
                     }
                    //出水浊度\出水PH\出水溶解氧
                    if(arr.rows[i].elementCode=='effluent_turbidity' 
                        || arr.rows[i].elementCode=='effluent_ph' 
                        || arr.rows[i].elementCode=='effluent_dissolved_oxygen'){
                      left_middle_line_legenddata.push(arr.rows[i].name);
                      if(!selectedAll.some(item=>item.name===arr.rows[i].name)){
                          var legenddata = {
                              name : arr.rows[i].name,
                              flag : selected_RawWaterQuality
                          };
                          selectedAll.push(legenddata);
                          selected_RawWaterQuality = false;
                      }
                      if(arr.rows[i].visualCacheData!=null 
                              && arr.rows[i].visualCacheData!=undefined 
                              && arr.rows[i].visualCacheData!=''){
                          var visualCacheData = arr.rows[i].visualCacheData;
                          if(visualCacheData.mpcode!=null && visualCacheData.mpcode!=''){
                            effluentQuality_title += visualCacheData.mpcode+',';
                          }
                      }
                      var dataseries =[];
                      if(arr.rows[i].mPointHistory!=null 
                          && arr.rows[i].mPointHistory!=undefined 
                          && arr.rows[i].mPointHistory!=''){
                        var mPointHistory = arr.rows[i].mPointHistory;
                        for(var m=0;m<mPointHistory.length;m++){
                            var dataserie =[];
                            dataserie.push(mPointHistory[m].measuredt);
                            dataserie.push(mPointHistory[m].parmvalue.toFixed(numtail));
                            dataseries.push(dataserie);
                        }
                      }else{
                          if(arr.rows[i].visualCacheDataList!=null 
                              && arr.rows[i].visualCacheDataList!=undefined 
                              && arr.rows[i].visualCacheDataList!=''){
                              var visualCacheDataList = arr.rows[i].visualCacheDataList;
                              for(var m=0;m<visualCacheDataList.length;m++){
                                  var dataserie =[];
                                  dataserie.push(visualCacheDataList[m].insdt);
                                  dataserie.push(visualCacheDataList[m].value.toFixed(numtail));
                                  dataseries.push(dataserie);
                              }
                            }
                        }
                      left_middle_line_seriesdata.push({
                          name: arr.rows[i].name,
                          type: 'line',
                          smooth: true,
                          symbol: 'none',
                          data: dataseries
                      });
                    }
                    //日供水量\日取水量
                    if(arr.rows[i].elementCode=='daily_water_supply' 
                        || arr.rows[i].elementCode=='daily_water_intake' ){
                      left_bottom_bar_legenddata.push(arr.rows[i].name);
                      if(!selectedAll.some(item=>item.name===arr.rows[i].name)){
                          var legenddata = {
                              name : arr.rows[i].name,
                              flag : selected_DailyWaterSupply
                          };
                          selectedAll.push(legenddata);
                          selected_DailyWaterSupply = false;
                      }
                      if(arr.rows[i].visualCacheData!=null 
                              && arr.rows[i].visualCacheData!=undefined 
                              && arr.rows[i].visualCacheData!=''){
                          var visualCacheData = arr.rows[i].visualCacheData;
                          if(visualCacheData.mpcode!=null && visualCacheData.mpcode!=''){
                              water_supply_title += visualCacheData.mpcode+',';
                          }
                      }
                      var dataseries =[];
                      if(arr.rows[i].mPointHistory!=null 
                          && arr.rows[i].mPointHistory!=undefined 
                          && arr.rows[i].mPointHistory!=''){
                        var mPointHistory = arr.rows[i].mPointHistory;
                        for(var m=0;m<mPointHistory.length;m++){
                          if(arr.rows[i].elementCode=='daily_water_supply'){
                            if(m==0){
                                bar_max = mPointHistory[m].parmvalue;
                                bar_min = mPointHistory[m].parmvalue;
                            }
                            if(mPointHistory[m].parmvalue>bar_max){
                                bar_max = mPointHistory[m].parmvalue;
                            }
                            if(mPointHistory[m].parmvalue<bar_min){
                                bar_min = mPointHistory[m].parmvalue;
                            }
                            bar_totle += mPointHistory[m].parmvalue;
                          }
                            var dataserie =[];
                            dataserie.push(mPointHistory[m].measuredt.substr(0,10));
                            dataserie.push(mPointHistory[m].parmvalue.toFixed(numtail));
                            dataseries.push(dataserie);
                        }
                      }else{
                        if(arr.rows[i].visualCacheDataList!=null 
                            && arr.rows[i].visualCacheDataList!=undefined 
                            && arr.rows[i].visualCacheDataList!=''){
                            var visualCacheDataList = arr.rows[i].visualCacheDataList;
                            for(var m=0;m<visualCacheDataList.length;m++){
                                var dataserie =[];
                                dataserie.push(visualCacheDataList[m].insdt.substr(0,10));
                                dataserie.push(visualCacheDataList[m].value.toFixed(numtail));
                                dataseries.push(dataserie);
                            }
                          }
                      }
                      left_bottom_bar_seriesdata.push({
                          name: arr.rows[i].name,
                          type: 'bar',
                          barMaxWidth: '10%',
                          itemStyle: {
                            normal: {
                                barBorderRadius: 12,
                            },
                          },
                          data: dataseries
                      });
                    }
                    //单位电耗\单位矾耗\单位氯耗\自耗水率
                    if(arr.rows[i].elementCode=='unit_power' 
                        || arr.rows[i].elementCode=='unit_alum' 
                        || arr.rows[i].elementCode=='unit_chlorine'
                            || arr.rows[i].elementCode=='water_rate'){
                      center_bottom_line_legenddata.push(arr.rows[i].name);
                      if(arr.rows[i].visualCacheData!=null 
                              && arr.rows[i].visualCacheData!=undefined 
                              && arr.rows[i].visualCacheData!=''){
                          var visualCacheData = arr.rows[i].visualCacheData;
                          if(visualCacheData.mpcode!=null && visualCacheData.mpcode!=''){
                            key_indicators += visualCacheData.mpcode+',';
                          }
                      }
                      var dataseries =[];
                      if(arr.rows[i].mPointHistory!=null 
                          && arr.rows[i].mPointHistory!=undefined 
                          && arr.rows[i].mPointHistory!=''){
                        var mPointHistory = arr.rows[i].mPointHistory;
                        for(var m=0;m<mPointHistory.length;m++){
                            var dataserie =[];
                            dataserie.push(mPointHistory[m].measuredt.substr(0,10));
                            dataserie.push(mPointHistory[m].parmvalue.toFixed(numtail));
                            dataseries.push(dataserie);
                        }
                      }else{
                          if(arr.rows[i].visualCacheDataList!=null 
                              && arr.rows[i].visualCacheDataList!=undefined 
                              && arr.rows[i].visualCacheDataList!=''){
                              var visualCacheDataList = arr.rows[i].visualCacheDataList;
                              for(var m=0;m<visualCacheDataList.length;m++){
                                  var dataserie =[];
                                  dataserie.push(visualCacheDataList[m].insdt);
                                  dataserie.push(visualCacheDataList[m].value.toFixed(numtail));
                                  dataseries.push(dataserie);
                              }
                            }
                        }
                      center_bottom_line_seriesdata.push({
                          name: arr.rows[i].name,
                          type: 'line',
                          smooth: true,
                          symbol: 'none',
                          data: dataseries
                      });
                    }
                    //巡检完成率
                    if(arr.rows[i].elementCode=='patrol_inspection_completion_rate'){
                      patrol=value;
                    }
                    //维修完成率
                    if(arr.rows[i].elementCode=='maintenance_completion_rate'){
                      maintenance=value;
                    }

                    //机械设备日维修次\电气设备日维修次数\自动化设备日维修次数\水质设备日维修次数
                    if(arr.rows[i].elementCode=='mechanics_equipment_repair_day' 
                        || arr.rows[i].elementCode=='electrical_equipment_repair_day'
                            || arr.rows[i].elementCode=='automation_equipment_repair_day'
                                || arr.rows[i].elementCode=='water_equipment_repair_day' ){
                      right_bottom_bar_legenddata.push(arr.rows[i].name);
                      var dataseries =[];
                      if(arr.rows[i].mPointHistory!=null 
                          && arr.rows[i].mPointHistory!=undefined 
                          && arr.rows[i].mPointHistory!=''){
                        var mPointHistory = arr.rows[i].mPointHistory;
                        for(var m=0;m<mPointHistory.length;m++){
                            var dataserie =[];
                            dataserie.push(mPointHistory[m].measuredt.substr(0,7));
                            dataserie.push(mPointHistory[m].parmvalue.toFixed(numtail));
                            dataseries.push(dataserie);
                        }
                      }else{
                        if(arr.rows[i].visualCacheDataList!=null 
                            && arr.rows[i].visualCacheDataList!=undefined 
                            && arr.rows[i].visualCacheDataList!=''){
                            var visualCacheDataList = arr.rows[i].visualCacheDataList;
                            for(var m=0;m<visualCacheDataList.length;m++){
                                var dataserie =[];
                                dataserie.push(visualCacheDataList[m].insdt.substr(0,7));
                                dataserie.push(visualCacheDataList[m].value.toFixed(numtail));
                                dataseries.push(dataserie);
                            }
                          }
                      }
                      right_bottom_bar_seriesdata.push({
                          name: arr.rows[i].name,
                          type: 'bar',
                          barMaxWidth: '10%',
                          stack: '设备',
                          data: dataseries
                      });
                    }
                  }
                }
                var selected = {};
                if(selectedAll.length>0){
                  for(var s=0;s<selectedAll.length;s++){
                    selected[selectedAll[s].name]=selectedAll[s].flag;
                  }
                }
                echarts_line('left-middle-line',left_middle_line_legenddata,left_middle_line_seriesdata,selected);
                echarts_bar('left-bottom-bar',bar_max,bar_min,bar_totle,left_bottom_bar_legenddata,left_bottom_bar_seriesdata,selected);
                echarts_line_bottom('center-bottom-line',center_bottom_line_legenddata,center_bottom_line_seriesdata);
                var data = {value:patrol,name:'巡检完成率'};
                doendPie('right-top-pie-1',data);
                data = {value:maintenance,name:'维修完成率'};
                doendPie('right-top-pie-2',data); 
                echarts_bar_right('right-bottom-bar',right_bottom_bar_legenddata,right_bottom_bar_seriesdata);
                
                if($("#water_supply_title").length > 0){
                	$("#water_supply_title").attr("data-mpcode",water_supply_title);
                }
                if($("#key_indicators").length > 0){
                	$("#key_indicators").attr("data-mpcode",key_indicators);
                }
                if($("#effluentQuality_title").length > 0){
                	$("#effluentQuality_title").attr("data-mpcode",effluentQuality_title);
                }
            });
          getImgData();
        }

      function getImgData(){
    	  $('.center-middle').empty();
          $.post(ext.contextPath + '/jspConfigure/getSmartImgData.do', {bizid:bizid,jsp_id:jsp_id} , function(data) {
              var arr = JSON.parse(data);
              console.log(arr);
              if(arr.rows!=null && arr.rows!=undefined && arr.rows!=''){
                  var elements = "";
                  for(var i=0;i<arr.rows.length;i++){
                      var element= arr.rows[i];
                      var icon_width = 36;
                      var icon_height = 49;
                      var heightAlone = 0;
                      var widthAlone = 0;
                      if(element.windowsHeight != null && element.windowsHeight != undefined && element.windowsHeight != ''){
                          heightAlone = height/element.windowsHeight;
                      }else{
                          heightAlone = heightV;
                      }
                      if(element.windowsWidth != null && element.windowsWidth != undefined && element.windowsWidth != ''){
                          widthAlone = width/element.windowsWidth;
                      }else{
                          widthAlone = widthV;
                      }
                      if(element.dataType==1){
                          src = ext.contextPath+"/IMG/smart/map_waterworks.png";
                          icon_width = 36;
                          icon_height = 49;
                      }else{
                    	  if(element.dataType==4){
                              src = ext.contextPath+"/IMG/smart/camera.png";
                              icon_width = 32;
                              icon_height = 32;
                    	  }else{
                              src = ext.contextPath+"/IMG/smart/map_pump_station.png";
                              icon_width = 18;
                              icon_height = 42;
                    	  }
                      }
                      var proDatavisualFrameName= "";
                      if(element.dataVisualFrame!=null){
                    	  proDatavisualFrameName=element.dataVisualFrame.name;
                      }
                      if(element.camera!=null){
                    	  proDatavisualFrameName=element.camera.name;
                      }
                      var companyname= "";
                      if(element.unit!=null){
                    	  companyname=element.unit.sname;
                      }
                      elements = '<div  id="'+element.id+'" '+
                        ' class="edit-element" title="'+element.name+'" data-id="'+element.id+'" data-name="'+element.name+'" '+
                        ' data-elementLeft="'+element.elementLeft+'" data-elementTop="'+element.elementTop+'" data-proDatavisualFrameId="'+element.proDatavisualFrameId+'" '+
                        ' data-proDatavisualFrameName="'+proDatavisualFrameName+'" data-dataType="'+element.dataType+'" '+
                        ' data-companyid="'+element.companyid+'" data-companyname="'+companyname+'" '+
                        ' style=" left: '+(element.elementLeft*widthAlone)+'px;top: '+(element.elementTop*heightAlone)+'px;">'+
                        ' <img src= "'+src+'" style="width: '+icon_width+'px;height: '+icon_height+'px;" draggable="false"/>'+
                        ' </div>';
                      $('.center-middle').append(elements);
                      var fun = "drag";  // 函数的名称 
                      try {
                      	if($.isFunction(eval(fun))){
	                            drag(element.id);
                      	}
                      } catch(e) {
                          console.log('drag函数不存在!'); 
                      }
                  }
              }
          });
      }

      function echarts_line(id,legenddata,seriesdata,selected){
          var lifeChart = echarts.getInstanceByDom(document.getElementById(id)); 
          //有的话就获取已有echarts实例的DOM节点。
          if (lifeChart != null) { // 如果存在，就进行销毁。
            lifeChart.dispose();
          }
          var option = {
        		  color:color,
/*<%--     		    title: {
    		        text: '{A|出水水质}',
    		        textStyle: {
                color: fontcolor_black ,
                rich: {
                    A: {
                        fontSize: 16 ,
                        fontWeight: 'bold' ,
                         height: 23,
                         width: 115,
                         align:'center',
                         backgroundColor: {
                           image: ext.contextPath+'/IMG/smart/title'+img_name+'.png',
                         },
                      },
                },
              }
    		    }, --%>*/
    		    tooltip: {
    		        trigger: 'axis'
    		    },
    		    legend: {
    		        data: legenddata, 
    		        /* top:'6%', */
    		        x:'right',
	              textStyle: {
	                  color: fontcolor_grey ,
	                  fontSize: 12 ,
	                },
	                icon:'roundRect',
                    selected: selected
    		    },
    		    grid: {
    		        left: '3%',
    		        right: '4%',
    		        bottom: '3%',
    		        containLabel: true
    		    },
    		    xAxis: {
    		        type: 'time',
    		    },
    		    yAxis: {
    		        type: 'value',
    		        axisLine: {
    		            show: true, 
    		        },
    		        splitLine: {
    		            show: true,
    		            lineStyle: {
    		                  type: 'dashed' ,
    		            }
    		        }
    		    },
    		    series: seriesdata,
    		};
        lifeChart = echarts.init(document.getElementById(id));
        lifeChart.setOption(option,true);
    }
      function echarts_bar(id,max,min,totle,legenddata,seriesdata,selected){
          var lifeChart = echarts.getInstanceByDom(document.getElementById(id)); 
          //有的话就获取已有echarts实例的DOM节点。
          if (lifeChart != null) { // 如果存在，就进行销毁。
            lifeChart.dispose();
          }
          var option = {
        		  color :[color[3],color[2]],
/*            <%-- title: {
                text: '{A|近十日供取水量}',
                textStyle: {
                color: fontcolor_black ,
                rich: {
                    A: {
                        fontSize: 16 ,
                        fontWeight: 'bold' ,
                         height: 24,
                         width: 164,
                         align:'center',
                         backgroundColor: {
                           image: ext.contextPath+'/IMG/smart/title_long'+img_name+'.png',
                         },
                      },
                },
              },
               subtext: '    最高供水  {A|'+max+'}    最低供水  {A|'+min+'}    总供水  {A|'+totle+'}   ',
              subtextStyle: {
                  color: fontcolor_grey ,
                  fontSize: 12 ,
                  rich: {
                      A: {
                          color: '#69f6f9' ,
                        },
                  },
              } , 
            }, --%>*/
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                data: legenddata,//['供水量', '取水量'],
                x:'right',
                textStyle: {
                    color: fontcolor_grey ,
                    fontSize: 12 ,
                  },
                  selected: selected
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: {
                type: 'category',
            },
            yAxis: {
                type: 'value',
                name:'万立方米',
                axisLine: {
                    show: true, 
                },
                splitLine: {
                    show: true,
                    lineStyle: {
                          type: 'dashed' ,
                    }
                }
            },
            series: seriesdata,
        };
        lifeChart = echarts.init(document.getElementById(id));
        lifeChart.setOption(option,true);
    }
      function echarts_line_bottom(id,legenddata,seriesdata){
        var lifeChart = echarts.getInstanceByDom(document.getElementById(id)); 
        //有的话就获取已有echarts实例的DOM节点。
        if (lifeChart != null) { // 如果存在，就进行销毁。
          lifeChart.dispose();
        }
        var option = {
            color:color,
  			    title: {
  			        text: '能耗曲线',
	                textStyle: {
	                    color: titleColor ,
	                    fontSize: 16
	                }
  			    },
  			    tooltip: {
  			        trigger: 'axis'
  			    },
  			    grid: {
  			        left: '3%',
  			        right: '4%',
  			        bottom: '3%',
	                containLabel: true
  			    },
  			    xAxis: {
  			        type: 'time',
  			        name:''
  			    },
  			    yAxis: {
  			        type: 'value',
  			    },
  			    series: seriesdata,
  			};
        lifeChart = echarts.init(document.getElementById(id));
        lifeChart.setOption(option,true);
    }
    function doendPie(id,data){
        var othVal = 100 - data.value;
          var myChart = echarts.init(document.getElementById(id));
          var option = {
                color: [color_blue_other], 
                title: {
                    text: data.value,
                    subtext: '%',
                    x: 'center',
                    y: 'center',
                    top:'30%',
                    textStyle: {
                        fontWeight: 'normal',
                        color: color_blue,
                        fontSize: '50'
                    },
                    subtextStyle: {
                        fontWeight: 'normal',
                        color: color_blue,
                        fontSize: '16',
                        verticalAlign :'top'
                    },
                },
                legend: {
                    data:[data.name],
                      left: '16%',
                      y: '5%',
                      icon:'none',
                      textStyle: {
                        color: '#a3a9af' ,
                        lineHeight: 16,
                        fontSize: 13 ,
                        fontWeight : 600 ,
                      },
                  },
                grid: {
                    top:0,
                    left:0,
                    right:0,
                    bottom:0,
                  },
                series: [{
                    name: 'Line 1',
                    type: 'pie',
                    clockWise: true,
                    radius: ['50%', '60%'],
                    center: ['50%', '50%'],
                    itemStyle: {
                        normal: {
                            label: {
                                show: false
                            },
                            labelLine: {
                                show: false
                            }
                        }
                    },
                    hoverAnimation: false, 
                    startAngle:90, //起始角度
                    data: [{
                        value: data.value,
                        name: data.name,
                        itemStyle: {
                            normal: {
                                color:  color_blue,
                                label: {
                                    show: false
                                },
                                labelLine: {
                                    show: false
                                }
                            } 
                        }
                    }, {
                        name: '02',
                        value: othVal
                    }]
                }]
            }
             myChart.clear();
            myChart.setOption(option, true);
    }

    function echarts_bar_right(id,legenddata,seriesdata){
        var lifeChart = echarts.getInstanceByDom(document.getElementById(id)); 
        //有的话就获取已有echarts实例的DOM节点。
        if (lifeChart != null) { // 如果存在，就进行销毁。
          lifeChart.dispose();
        }
        var option = {
          color:color,
          title: {
            text: '月度设备维修次数统计',
            textStyle: {
              color: titleColor ,
              fontSize: 16 ,
            },
          },
          tooltip: {
              trigger: 'axis'
          },
          legend: {
              data: legenddata,//['机械设备', '电气设备', '自动化设备', '水质设备'],
              top:'30',
              x:'right',
              textStyle: {
                  color: fontcolor_grey ,
                  fontSize: 14 ,
                }
          },
          grid: {
              left: '3%',
              right: '4%',
              bottom: '3%',
              top:'85',
              containLabel: true
          },
          xAxis: {
              type: 'category',
          },
          yAxis: {
              type: 'value',
              name:'次',
              axisLine: {
                  show: true, 
              },
              splitLine: {
                  show: true,
                  lineStyle: {
                        type: 'dashed' ,
                  }
              }
          },
          series: seriesdata,
      };
      lifeChart = echarts.init(document.getElementById(id));
      lifeChart.setOption(option,true);
  }

  //添加千分位符合
   function toThousands(num) {
    var nums =num;
    var re=/\d{1,3}(?=(\d{3})+$)/g;
    var n1=0;
    if(nums!=null && nums!='' && nums!=undefined){
      n1=nums.toString().replace(/^(\d+)((\.\d+)?)$/,function(s,s1,s2){return s1.replace(re,"$&,")+s2;});
    }
      return n1;
    }

     $(function () {
         left_top_height = $('.left-top').height();
         left_middle_height = $('.left-middle').height();
         left_bottom_height = $('.left-bottom').height();
         center_top_height = $('.center-top').height();
         center_middle_height = $('.center-middle').height();
         center_bottom_height = $('.center-bottom').height();
         right_top_height = $('.right-top').height();
         right_middle_height = $('.right-middle').height();
         right_bottom_height = $('.right-bottom').height();
         showElement();
         bizid = unitId;
         jsp_id = $('#jsp_id').val();
         $(document).on('click','.center-middle',function(e){
             var fun = "mapClick";  // 函数的名称 
             try {
             	if($.isFunction(eval(fun))){
                    var element = this;
               	 mapClick(element,e);
             	}
             } catch(e) {
                 console.log('mapClick函数不存在!'); 
             }
         });
         $(document).on('click','.new-element',function(event){
             //防止事件冒泡到DOM树上，也就是不触发的任何前辈元素上的事件处理函数。
             event.stopPropagation();
        });
         $(document).on('click','.edit-element',function(event){
             //防止事件冒泡到DOM树上，也就是不触发的任何前辈元素上的事件处理函数。
             event.stopPropagation();
             var element = this;
   		   	editElement(element,event);
        });
         $(document).on('click','.btn-box-tool',function(event){
             //防止事件冒泡到DOM树上，也就是不触发的任何前辈元素上的事件处理函数。
             event.stopPropagation();
             var widget = $(this).data("widget");
             if(widget=='remove'){
               $(this).parent().parent().parent().remove();
             }
        });
         
         $('#switch').bootstrapSwitch({    //初始化按钮
             onText:"  ",
             offText:"  ",
             onColor:"primary",
             offColor:"default",
             size:"mini",
             handleWidth:10,
             labelWidth:20,
             onSwitchChange:function(event,state){
                if(state==true){
                     console.log("深色");
                     addAndRemove4Class('content-wrapper-bg-grey','content-wrapper-bg-darkblue');
                     addAndRemove4Class('content-wrapper-bg-white','content-wrapper-bg-transparent');
                     addAndRemove4Class('font-color-lightBlack','font-color-white');
                     addAndRemove4Class('font-color-lightBlue','font-color-blue');
                     addAndRemove4Class('font-color-smalt','font-color-dark-blue');
                     addAndRemove4Class('font-color-lightWhite','font-color-black');
                     addAndRemove4Class('font-color-light-blue','font-color-dark-white');
                     addAndRemove4Class('bgcolor-white','bgcolor-blue');
                     addAndRemove4Class('right-title-blue','right-title');
                     fontcolor_black = '#0d2336';
                     color_blue = '#36FFF9';
                     color_blue_other = '#1D4F6D';
                     img_name = '';
                     titleColor = '#ffffff';
                     $('.switch-title').html("深色模式");
                   }else{
                    console.log("浅色");
                    addAndRemove4Class('content-wrapper-bg-darkblue','content-wrapper-bg-grey');
                    addAndRemove4Class('content-wrapper-bg-transparent','content-wrapper-bg-white');
                    addAndRemove4Class('font-color-white','font-color-lightBlack');
                    addAndRemove4Class('font-color-black','font-color-lightWhite');
                    addAndRemove4Class('font-color-blue','font-color-lightBlue');
                    addAndRemove4Class('font-color-dark-blue','font-color-smalt');
                    addAndRemove4Class('font-color-dark-white','font-color-light-blue');
                    addAndRemove4Class('bgcolor-blue','bgcolor-white');
                    addAndRemove4Class('right-title','right-title-blue');
                    fontcolor_black = '#fff';
                    color_blue = '#1790FF';
                    color_blue_other = '#E9E9E9';
                    titleColor = '#0d2336';
                    img_name = '_blue';
                    $('.switch-title').html("浅色模式");
                   }
                getData();
               }
          });
         echarts_line('left-middle-line',[],[]);
         echarts_bar('left-bottom-bar',0,0,0,[],[]);
         echarts_line_bottom('center-bottom-line',[],[]);
         var data = {value:0,name:'巡检完成率'};
         doendPie('right-top-pie-1',data);
         data = {value:0,name:'维修完成率'};
         doendPie('right-top-pie-2',data); 
         echarts_bar_right('right-bottom-bar',[],[]);
         getData();
         //setInterval("getData('"+bizid+"')",600000);

         $(window).resize(function() {
           showElement();
           getData();
         });
      });

     function showElement(){
       height = $(window).height();
         width = $(window).width();
         if(height<(global_height*0.1)){
           height = global_height;
         }
         if(width<(global_width*0.1)){
           width = global_width;
         }
         heightV = height/1080;
         widthV = width/1690;
         var proportion = height/1080;
         $('.left-top').height(left_top_height*proportion);
         $('.left-middle').height(left_middle_height*proportion);
         $('.left-bottom').height(left_bottom_height*proportion);
         $('.left-middle-line').height($('.left-middle').height()-60);
         $('.left-bottom-bar').height($('.left-bottom').height()-60);
         
         $('.center-top').height(center_top_height*proportion);
         $('.center-middle').height(center_middle_height*proportion);
         $('.center-bottom').height(center_bottom_height*proportion);
         $('.center-bottom-line').height($('.center-bottom').height()-30);
         
         $('.right-top').height(right_top_height*proportion);
         $('.right-top-pie').height($('.right-top').height()*0.5);
         $('.right-middle').height(right_middle_height*proportion);
         $('.right-bottom').height(right_bottom_height*proportion);
         $('.right-bottom-bar').height($('.right-bottom').height()-10);
     }
     function showLine(ele) {
         var mpcode = $(ele).attr("data-mpcode");
         $.post(ext.contextPath + '/data/showOnlyLine.do', {mpcode: mpcode, unitId: unitId}, function (data2) {
             $("#subDiv").html(data2);
             openModal('curveModal');
         });
     }