hdw
2018-10-25 bb65f33c9fdff40844f17e95e3e75aed2b42bda2
gx_tieta/WebRoot/pages/js/pages/siderbar.js
@@ -1,19 +1,652 @@
;(function($, window, document, gl) {
   // 定义TreeView的命名空间
   gl.namespace('pages.TreeView');
   /**
   * @param jquery ele jQuery 对象
   * @param Object first 第一层的数据对象
   */
   var TreeView = function (ele, options) {
      this.ele = ele;
      this.container;
      this.init(options);
   };
   var _prop = TreeView.prototype;
   // 初始化容器并设置基础的点击事件
   _prop.init = function(options) {
      var _this = this;
      // 清空容器
      this.ele.addClass('whyc-sider-menu-container');
      this.ele.text('');
      var whycTreeView = $('<div class="whyc-sider-menu"></div>');
      this.ele.append(whycTreeView);
      this.container = whycTreeView;
      this.setContainer();
      //this.resize(options);
      // 给容器内容添加绑定事件
      this.ele.off('click.treeView.folder').on('click.treeView.folder', '.sider-menu-folder', function() {
         $(this).parent().toggleClass('sider-menu-open');
      });
      this.ele.off('click.treeView.file').on('click.treeView.file', '.sider-menu-file', function() {
         if(!$(this).hasClass('active')) {
            _this.ele.find('.sider-menu-file').removeClass('active');
            $(this).addClass('active');
         }
      });
   };
   // 设置resizable
   _prop.resize = function(options) {
      var _this = this;
      var defaults = {
         minWidth: 200,
         maxWidth: 400
      };
      var opts = $.extend({}, defaults, options || {});
      if(this.ele.resizable) {
         this.ele.resizable({
            handles: 'e',
            maxWidth: opts.maxWidth,
            minWidth: opts.minWidth,
            alsoResize: this.container,
            stop:function() {
               _this.container.height('100%');
            }
         });
      }
   };
   // 设置容器的宽度
   _prop.setContainer = function() {
      var eleWidth = this.ele.width();
      this.container.width(eleWidth+20);
   };
   // 生成列表
   _prop.treeView = function(container, data, flush) {
      var defaults = {
         file: false
      };
      // 存在ul且当前不允许刷新
      if(container.find('ul').length !=0 && !flush) {
         return;
      }else if(flush) {
         container.text('');
      }
      // 删除等待框
      this.delProgress(container);
      // 生成元素
      var _ul = $('<ul></ul>');
      for(var i=0; i<data.length; i++) {
         var _data = $.extend({}, defaults, data[i]);
         // 设置内容容器
         var _li = $('<li></li>');
         var _a = $('<a href="javascript:;" id="'+_data.txt+'" class="sider-menu-folder"></a>');
         var _i = $('<i class="fa fa fa-caret-right"></i>');
         var _span = $('<span class="treeview-txt">'+_data.txt+'</span>');
         if(_data.file) {
            _a = $('<a href="javascript:;" id="'+_data.id+'" class="sider-menu-file"></a>');
            _i = $('<i class="fa"></i>');
         }
         _a.addClass(_data.cla);
         _a.append(_i);
         _a.append(_span);
         _li.append(_a);
         // 存储生成元素的值
         _a.data('attr', _data.attr);
         _ul.append(_li);
      }
      container.append(_ul);
   };
   // 获取folder的一条数据
   _prop.getFolder = function (txt, cla,attr) {
      var tmp = {};
      tmp.txt = txt;
      tmp.cla = cla;
      tmp.attr = attr;
      return tmp;
   };
   // 获取file的一条数据
   _prop.getFile =function(txt, cla, id, attr) {
      var tmp = {};
      tmp.txt = txt;
      tmp.cla = cla;
      tmp.id = id;
      tmp.file = true;
      tmp.attr = attr;
      return tmp;
   };
   // 添加progressBar
   _prop.addProgress = function(container) {
      // 存在就不用再添加
      if(container.find('.treeView-progressBar-container').length != 0) {
         return;
      }
      var cont = $('<div class="treeView-progressBar-container" style="margin-left: 15px; margin-right: 15px;"></div>');
      var progress = $('<div class="treeView-progressBar"></div>');
      var progressLabel = '<div class="progress-label">加载...</div>';
      progress.append(progressLabel);
      cont.append(progress);
      container.append(cont);
      // 设置样式
      progress.progressbar({
         value: false,
         change: function() {
            progressLabel.text( progressbar.progressbar( "value" ) + "%" );
         },
         complete: function() {
            progressLabel.text( "完成!" );
         }
      });
   };
   // 移除progressBar
   _prop.delProgress = function(container) {
      container.find('.treeView-progressBar-container').remove();
   };
   // 展开指定的
   _prop.spreadFolder = function(cla, txt, callback) {
      var rsCla = '.sider-menu-folder'+'.'+cla;
      var aFolders = this.ele.find(rsCla);
      // 没有获取到内容就返回false
      if(aFolders.length == 0) {
         return false;
      }
      var tgt = aFolders.eq(0);
      aFolders.each(function() {
         var _txt = $(this).find('.treeview-txt').text();
         if(txt == _txt) {
            tgt = $(this);
         }
      });
      tgt.parent().addClass('sider-menu-open');
      // 设置回调函数并且设置默认的值
      if(callback) {
         callback(this, tgt.parent(), tgt.data('attr'));
      }
   };
   _prop.activeFile = function(container, cla, id, callback) {
      var rsCla = '.sider-menu-file'+'.'+cla;
      var aFiles = container.find(rsCla);
      console.log(aFiles.length);
      // 没有获取到内容就返回false
      if(aFiles.length == 0) {
         return false;
      }
      var tgt = aFiles.eq(0);
      // 遍历列表
      aFiles.each(function() {
         var _id = $(this).attr('id');
         // id匹配
         if(_id == id) {
            tgt = $(this);
         }
      });
      tgt.click();
   };
   // 添加到gl.pages.TreeView的命名空间下
   gl.pages.TreeView = TreeView;
})(jQuery, window, document, GLOBAL);
// 定义页面中的siderbar组件
;(function($, window, document, gl, undefined) {
   gl.namespace('pages.siderbar');
   
   first();
   // 生成一级导航
   function first() {
   // 获取当前选中内容(省-市-机房-电池组)
   var province = getQueryString('province');   // 省
   var city = getQueryString('city');          // 市
   var home = getQueryString('home');         // 机房
   //console.log(province);
   // 生成一级导航-省
   function first(treeView, container) {
      //treeView.addProgress(container);
      $.ajax({    
           type: "post",             
           url: "BattInfAction!serchAllStation",            
           async:true,            
           dataType:'text',
           dataType:'json',
           data:null,   
           success: function(data){
              console.info(data);
              var rs = JSON.parse(data.result);
              if(rs.code == 1) {
                 var _data= rs.data;
                 var formatData = [];
                 for(var i=0; i<_data.length;i++) {
                    var __data = _data[i];
                    var tmp = treeView.getFolder(__data.StationName1, 'province', __data);
                    formatData.push(tmp);
                 }
                 treeView.treeView(container, formatData);
                 treeView.spreadFolder('province', province, firstSpread);
              }else {
              }
           }
      });
   }
})(jQuery, window, document, GLOBAL);
   // 将函数绑定到GLOBAL.pages.siderbar的命名空间下
   gl.pages.siderbar.first = first;
   // 展开一级导航
   function firstSpread(treeView, container, data) {
      second(treeView, container, data, true);
   }
   // 生成二级导航-市
   function second(treeView, container, data, spread) {
      // 已经存在
      if(container.find('ul').length !=0) {
         return;
      }
      treeView.addProgress(container);
      $.ajax({
           type: "post",
           url: "BattInfAction!serchStationName2",
           async:true,
           dataType:'json',
           data:"json = "+JSON.stringify(data),
           success: function(data){
              var rs = JSON.parse(data.result);
              treeView.delProgress(container);
              if(rs.code == 1) {
                 var _data= rs.data;
                 var formatData = [];
                 for(var i=0; i<_data.length;i++) {
                    var __data = _data[i];
                    var tmp = treeView.getFolder(__data.StationName2, 'city', __data);
                    formatData.push(tmp);
                 }
                 treeView.treeView(container, formatData);
                 if(spread) {
                    treeView.spreadFolder('city', city, secondSpread, true);
                 }
              }else {
              }
           }
      });
   }
   // 将函数绑定到GLOBAL.pages.siderbar的命名空间下
   gl.pages.siderbar.second = second;
   // 展开二级导航
   function secondSpread(treeView, container, data) {
      third(treeView, container, data, true);
   }
   // 生成 三级导航-机房
   function third(treeView, container, data, spread) {
      // 已经存在
      if(container.find('ul').length !=0) {
         return;
      }
      treeView.addProgress(container);
      $.ajax({
           type: "post",
           url: "BattInfAction!serchStationName3",
           async:true,
           dataType:'json',
           data:"json = "+JSON.stringify(data),
           success: function(data){
              var rs = JSON.parse(data.result);
              treeView.delProgress(container);
              if(rs.code == 1) {
                 var _data= rs.data;
                 var formatData = [];
                 for(var i=0; i<_data.length;i++) {
                    var __data = _data[i];
                    var tmp = treeView.getFolder(__data.StationName, 'home', __data);
                    formatData.push(tmp);
                 }
                 treeView.treeView(container, formatData);
                 if(spread) {
                    treeView.spreadFolder('home', home, thirdSpread, true);
                 }
              }else {
              }
           }
      });
   }
   // 将函数绑定到GLOBAL.pages.siderbar的命名空间下
   gl.pages.siderbar.third = third;
   // 展开三级导航
   function thirdSpread(treeView, container, data) {
      var tmp = {
         StationName1: data.StationName1,
         StationName2: data.StationName2,
         StationName: data.StationName,
         StationId: data.StationId
      };
      fourth(treeView, container, tmp, true);
   }
   // 生成 三级导航-机房
   function thirdFile(treeView, container, data) {
      // 已经存在
      if(container.find('ul').length !=0) {
         return;
      }
      treeView.addProgress(container);
      $.ajax({
           type: "post",
           url: "BattInfAction!serchStationName3",
           async:true,
           dataType:'json',
           data:"json = "+JSON.stringify(data),
           success: function(data){
              var rs = JSON.parse(data.result);
              treeView.delProgress(container);
              if(rs.code == 1) {
                 var _data= rs.data;
                 var formatData = [];
                 for(var i=0; i<_data.length;i++) {
                    var __data = _data[i];
                    var tmp = treeView.getFile(__data.StationName, 'home', '',__data);
                    formatData.push(tmp);
                 }
                 treeView.treeView(container, formatData);
              }else {
              }
           }
      });
   }
   // 将函数绑定到GLOBAL.pages.siderbar的命名空间下
   gl.pages.siderbar.thirdFile = thirdFile;
   // 生成 三级导航-电池组
   function fourth(treeView, container, data, active) {
      // 已经存在
      if(container.find('ul').length !=0) {
         return;
      }
      treeView.addProgress(container);
      $.ajax({
           type: "post",
           url: "BattInfAction!serchBattByStation",
           async:true,
           dataType:'json',
           data:"json = "+JSON.stringify(data),
           success: function(data){
              var rs = JSON.parse(data.result);
              treeView.delProgress(container);
              if(rs.code == 1) {
                 var _data= rs.data;
                 //console.log(_data);
                 var formatData = [];
                 for(var i=0; i<_data.length;i++) {
                    var __data = _data[i];
                    var tmp = treeView.getFile(__data.BattGroupName, 'eleGroup', __data.BattGroupId, __data);
                    formatData.push(tmp);
                 }
                 treeView.treeView(container, formatData);
                 //console.info(formatData);
                 if(active) {
                    treeView.activeFile(container,'eleGroup', '');
                    var battId = formatData[0].id;
                    location.hash="#"+battId;
                    location.hash = "";
                 }
              }else {
              }
           }
      });
   }
   // 将函数绑定到GLOBAL.pages.siderbar的命名空间下
   gl.pages.siderbar.fourth = fourth;
})(jQuery, window, document, GLOBAL);
// 设置根据省市机房和电池进行定位
;(function($, window, document, gl, undefined) {
   gl.namespace('pages.siderbar');
   var homeInfo = {
      StationName1: '',
      StationName2: '',
      StationName: '',
      StationId: ''
   };
   var battId=undefined;
   // 定位机房
   function localSideBar(treeView, container, data) {
      // 关闭所有的
      treeView.ele.find('li').removeClass('sider-menu-open');
      first(treeView, container);
      homeInfo.StationName1 = data.province;
      homeInfo.StationName2 = data.city;
      homeInfo.StationName = data.home;
      homeInfo.StationId = data.homeid;
      battId = data.battid;
   }
   // 将函数绑定到GLOBAL.pages.siderbar的命名空间下
   gl.pages.siderbar.localSideBar = localSideBar;
   // 生成一级导航-省
   function first(treeView, container) {
      //treeView.addProgress(container);
      $.ajax({
           type: "post",
           url: "BattInfAction!serchAllStation",
           async:true,
           dataType:'json',
           data:null,
           success: function(data){
              var rs = JSON.parse(data.result);
              if(rs.code == 1) {
                 var _data= rs.data;
                 var formatData = [];
                 for(var i=0; i<_data.length;i++) {
                    var __data = _data[i];
                    var tmp = treeView.getFolder(__data.StationName1, 'province', __data);
                    formatData.push(tmp);
                 }
                 treeView.treeView(container, formatData);
                 treeView.spreadFolder('province', homeInfo.StationName1, firstSpread);
              }else {
              }
           }
      });
   }
   // 展开一级导航
   function firstSpread(treeView, container) {
      second(treeView, container, homeInfo, true);
   }
   // 生成二级导航-市
   function second(treeView, container, data, spread) {
      // 已经存在
      if(container.find('ul').length !=0) {
         treeView.spreadFolder('city', homeInfo.StationName2, secondSpread, true);
         return;
      }
      treeView.addProgress(container);
      $.ajax({
           type: "post",
           url: "BattInfAction!serchStationName2",
           async:true,
           dataType:'json',
           data:"json = "+JSON.stringify(data),
           success: function(data){
              var rs = JSON.parse(data.result);
              treeView.delProgress(container);
              if(rs.code == 1) {
                 var _data= rs.data;
                 var formatData = [];
                 for(var i=0; i<_data.length;i++) {
                    var __data = _data[i];
                    var tmp = treeView.getFolder(__data.StationName2, 'city', __data);
                    formatData.push(tmp);
                 }
                 treeView.treeView(container, formatData);
                 if(spread) {
                    treeView.spreadFolder('city', homeInfo.StationName2, secondSpread);
                 }
              }
           }
      });
   }
   // 展开二级导航
   function secondSpread(treeView, container) {
      third(treeView, container, homeInfo, true);
   }
   // 生成 三级导航-机房
   function third(treeView, container, data, spread) {
      // 已经存在
      if(container.find('ul').length !=0) {
         location.hash="#"+homeInfo.StationName;
          location.hash="";
          treeView.spreadFolder('home', homeInfo.StationName, thirdSpread, true);
         return;
      }
      treeView.addProgress(container);
      $.ajax({
           type: "post",
           url: "BattInfAction!serchStationName3",
           async:true,
           dataType:'json',
           data:"json = "+JSON.stringify(data),
           success: function(data){
              var rs = JSON.parse(data.result);
              treeView.delProgress(container);
              if(rs.code == 1) {
                 var _data= rs.data;
                 var formatData = [];
                 for(var i=0; i<_data.length;i++) {
                    var __data = _data[i];
                    var tmp = treeView.getFolder(__data.StationName, 'home', __data);
                    formatData.push(tmp);
                 }
                 treeView.treeView(container, formatData);
                 if(spread) {
                    treeView.spreadFolder('home', homeInfo.StationName, thirdSpread, true);
                 }
              }
           }
      });
   }
   // 展开三级导航
   function thirdSpread(treeView, container, data) {
      fourth(treeView, container, homeInfo, true);
   }
   // 生成 三级导航-电池组
   function fourth(treeView, container, data, active) {
      // 已经存在
      if(container.find('ul').length !=0) {
         container.addClass('sider-menu-open');
         if(battId) {
            treeView.activeFile(container,'eleGroup', battId);
         }else {
            treeView.activeFile(container,'eleGroup', '');
         }
         return;
      }
      treeView.addProgress(container);
      $.ajax({
           type: "post",
           url: "BattInfAction!serchBattByStation",
           async:true,
           dataType:'json',
           data:"json = "+JSON.stringify(data),
           success: function(data){
              var rs = JSON.parse(data.result);
              treeView.delProgress(container);
              if(rs.code == 1) {
                 var _data= rs.data;
                 //console.log(_data);
                 var formatData = [];
                 for(var i=0; i<_data.length;i++) {
                    var __data = _data[i];
                    var tmp = treeView.getFile(__data.BattGroupName, 'eleGroup', __data.BattGroupId, __data);
                    formatData.push(tmp);
                 }
                 treeView.treeView(container, formatData);
                 if(active) {
                    if(battId) {
                       treeView.activeFile(container,'eleGroup', battId);
                       location.hash="#"+battId;
                        location.hash="";
                    }else {
                       treeView.activeFile(container,'eleGroup', '');
                    }
                 }
              }
           }
      });
   }
})(jQuery, window, document, GLOBAL);
//生成充放电监测模块内容
function createBattListen(ele, list) {
   ele.text("");
   var discharge_num = 0;
   var charge_num = 0;
   var ul = $('<ul></ul>');
   for(var i = 0; i < list.length; i++) {
      var li = "";
      if(list[i].isCharge) {
         li = $('<li><a href="javascript:;" class="batt-charge" value="'+list[i].val+'" note="'+list[i].note+'">'+list[i].val+'电池组充电测试!</a></li>');
         charge_num++;
      }else {
         li = $('<li><a href="javascript:;" class="batt-discharge" value="'+list[i].val+'" note="'+list[i].note+'">'+list[i].val+'电池组放电测试!</a></li>');
         discharge_num++;
      }
      li.data('attr', list[i]);
      ul.append(li);
   }
   $('#ele_content .batt-listen .count-num').find('span').eq(0).text(discharge_num);
   $('#ele_content .batt-listen .count-num').find('span').eq(1).text(charge_num);
   ele.append(ul);
}