| | |
|---|
| | | ;(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:;" class="sider-menu-folder"></a>');
|
|---|
| | | _a.addClass(_data.cla);
|
|---|
| | | var _i = $('<i class="fa fa fa-caret-right"></i>');
|
|---|
| | | var _span = $('<span>'+_data.txt+'</span>');
|
|---|
| | | if(_data.file) {
|
|---|
| | | _a = $('<a href="javascript:;" class="sider-menu-file"></a>');
|
|---|
| | | _i = $('<i class="fa"></i>');
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | _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, attr) {
|
|---|
| | | var tmp = {};
|
|---|
| | | tmp.txt = txt;
|
|---|
| | | tmp.cla = cla;
|
|---|
| | | 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();
|
|---|
| | | };
|
|---|
| | |
|
|---|
| | | // 添加到gl.pages.TreeView的命名空间下
|
|---|
| | | gl.pages.TreeView = TreeView;
|
|---|
| | | })(jQuery, window, document, GLOBAL);
|
|---|
| | |
|
|---|
| | | // 定义页面中的siderbar组件
|
|---|
| | | ;(function($, window, document, gl, undefined) {
|
|---|
| | | gl.namespace('pages.siderbar');
|
|---|
| | | |
|---|
| | | first();
|
|---|
| | | // 生成一级导航
|
|---|
| | | function first() {
|
|---|
| | | // 生成一级导航-省
|
|---|
| | | 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);
|
|---|
| | | }else {
|
|---|
| | | |
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | });
|
|---|
| | | }
|
|---|
| | | |
|---|
| | | // 将函数绑定到GLOBAL.pages.siderbar的命名空间下
|
|---|
| | | gl.pages.siderbar.first = first;
|
|---|
| | | |
|---|
| | | // 生成二级导航-市
|
|---|
| | | function second(treeView, container, data) {
|
|---|
| | | // 已经存在
|
|---|
| | | 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);
|
|---|
| | | 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);
|
|---|
| | | }else {
|
|---|
| | | |
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | });
|
|---|
| | | }
|
|---|
| | | |
|---|
| | | // 将函数绑定到GLOBAL.pages.siderbar的命名空间下
|
|---|
| | | gl.pages.siderbar.second = second;
|
|---|
| | | |
|---|
| | | // 生成 三级导航-机房
|
|---|
| | | function third(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);
|
|---|
| | | 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.StationName3, 'home', __data);
|
|---|
| | | formatData.push(tmp);
|
|---|
| | | }
|
|---|
| | | treeView.treeView(container, formatData);
|
|---|
| | | }else {
|
|---|
| | | |
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | });
|
|---|
| | | }
|
|---|
| | | |
|---|
| | | // 将函数绑定到GLOBAL.pages.siderbar的命名空间下
|
|---|
| | | gl.pages.siderbar.third = third;
|
|---|
| | | |
|---|
| | | // 生成 三级导航-电池组
|
|---|
| | | function fourth(treeView, container, data) {
|
|---|
| | | // 已经存在
|
|---|
| | | 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);
|
|---|
| | | console.info(rs);
|
|---|
| | | if(rs.code == 1) {
|
|---|
| | | var _data= rs.data;
|
|---|
| | | var formatData = [];
|
|---|
| | | console.log(_data);
|
|---|
| | | return;
|
|---|
| | | for(var i=0; i<_data.length;i++) {
|
|---|
| | | var __data = _data[i];
|
|---|
| | | var tmp = treeView.getFolder(__data.StationName3, 'eleGroup', __data);
|
|---|
| | | formatData.push(tmp);
|
|---|
| | | }
|
|---|
| | | treeView.treeView(container, formatData);
|
|---|
| | | }else {
|
|---|
| | | |
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | });
|
|---|
| | | }
|
|---|
| | | |
|---|
| | | // 将函数绑定到GLOBAL.pages.siderbar的命名空间下
|
|---|
| | | gl.pages.siderbar.fourth = fourth;
|
|---|
| | | })(jQuery, window, document, GLOBAL); |
|---|
