iweb-tool
Version:
a build tool based gulp & webpack
1,461 lines (1,364 loc) • 188 kB
JavaScript
;
(function($, window, document, undefined) {
/*
* 对象所支持的属性及默认值
*/
var dataSource = function(options, gridComp) {
this.defaults = {
}
this.gridComp = gridComp;
this.options = $.extend({}, this.defaults, options);
this.rows = new Array(); // 存储数据行
this.hasParentRows = new Array(); // 存在父项
this.nothasParentRows = new Array(); // 不存在父项
this.sortRows();
};
var gridCompColumn = function(options, gridOptions) {
this.defaults = {
width:200, // 默认宽度为200
sortable: true, // 是否可以排序
canDrag: true, // 是否可以拖动
fixed: false, // 是否固定列
visible: true, // 是否显示
canVisible: true, // 是否可以隐藏
sumCol:false, // 是否计算合计
editable:true, // 是否可修改
editFormShow:true, // 是否可修改
autoExpand:false, // 是否自动扩展列
editType:'text', // 编辑类型,支持传入function扩展
dataType:'String', // 数据类型,string, date, datetime, integer, float
//precision: //精度
format:'yyyy-MM-dd hh:mm:ss',
//renderType:'', 渲染类型
//headerColor
headerLevel:1 //header层级
// parentHeader 对应的父header的title
// 目前仅支持两级,多级的话需要改变头的高度,另外处理当前级别的时候需要看下是否存在上级,如果存在上级的话
// 则创建新的div,这就涉及到需要躲变量计算每级的宽度,需要考虑下如何实现。
};
// 从grid继承的属性
var gridDefault = {
sortable: gridOptions.sortable,
canDrag: gridOptions.canDrag,
// editable: gridOptions.editable,
width: gridOptions.columnWidth
};
if(options.dataType == 'Date'){
this.defaults.format = 'yyyy-MM-dd';
}
// 树表暂时不支持排序
if(gridOptions.showTree){
options.sortable = false;
}
this.options = $.extend({}, this.defaults, gridDefault, options);
// 转成数字
this.options.width = parseInt(this.options.width);
this.firstColumn = false;
};
var gridComp = function(ele, options) {
this.dataSource = dataSource;
this.gridCompColumn = gridCompColumn;
this.ele = ele[0];
this.$ele = ele;
this.defaults = {
id: 'grid',
//width: '100%',
//height: '100%',
columnWidth:200,
sortable: true, // 是否可以排序
canDrag: true, // 是否可以拖动
canSwap: true, // 是否可以交换列位置
showHeader: true, // 是否显示表头
columnMenu: true, // 是否存在列头操作按钮
showNumCol: false, // 是否显示数字列
multiSelect:false, // 是否显示复选框
showSumRow: false, // 是否显示合计行
editable: false, // 是否可修改
noneEditableFormShow:true,// form编辑器是否显示不可编辑字段
editType: 'default', // 编辑方式,default为行编辑,form为在行下方以form编辑
showTree:false, // 是否显示树表
autoExpand:true, // 是否默认展开
cancelFocus:false, // 第二次点击是否取消focus
maxHeaderLevel:1 // header的最高层级,用于计算header区域的高度
}
this.transDefault = {
ml_show_column:trans('gridComp.show_column', '显示/隐藏列'),
ml_clear_set:trans('gridComp.clear_set', '清除设置'),
ml_no_rows:trans('gridComp.no_rows', '无数据'),
ml_sum:trans('gridComp.sum', '合计:'),
ml_close:trans('gridComp.close', '关闭')
}
this.transMap = $.extend({},this.transDefault,options.transMap);
if(options.maxHeaderLevel > 1){
options.canSwap = false;
}
this.options = $.extend({}, this.defaults, options);
if(this.options.showTree){
this.options.showNumCol = false;
}
this.gridCompColumnArr = new Array(); // 存储设置默认值之后的columns对象
this.gridCompColumnFixedArr = new Array(); // 存储设置默认值之后的固定列columns对象
this.basicGridCompColumnArr = new Array(); // 存储基本的columns对象,用于清除设置
this.gridCompLevelColumn = new Array(); // 存储多级表头时的多级
this.treeLeft = 10; // 树表时每一级之间的差值
this.multiSelectWidth = 40; // 复选框列宽度
this.numWidth = 40; // 数字列宽度
this.multiWidth = 40; // 复选框宽度
this.headerHeight = 34; // header区域高度
this.headerHeight = 34 * parseInt(this.options.maxHeaderLevel);
this.countContentHeight = true;// 是否计算内容区的高度(是否为流式)
this.minColumnWidth = 80; // 最小列宽
this.columnMenuWidth = 160; // column menu的宽度
this.scrollBarHeight = 16; // 滚动条高度
this.columnMenuHeight = 33;
this.initGrid();
};
/*
* 对象提供的方法
*/
gridComp.prototype = {
/*
* 创建grid
*/
initGrid: function() {
var oThis = this;
this.initOptions();
this.initVariable();
this.initWidthVariable();
this.initGridCompColumn();
this.initDataSource();
this.createDivs();
// UAP-NC 轻量化项目:切换tab时添加form会消失问题
this.inte = setInterval(function(){oThis.setIntervalFun.call(oThis)}, 300);
},
destroySelf: function(){
clearInterval(this.inte);
this.$ele.data('gridComp',null);
this.ele.innerHTML = '';
},
/*
* 对传入参数进行格式化处理
* 宽度、高度处理
* 左侧区域宽度计算
* 除去内容区域的高度
*/
initOptions: function() {
this.options.width = this.formatWidth(this.options.width);
this.options.height = this.formatWidth(this.options.height);
if(this.options.height == '100%' || !this.options.height){
this.countContentHeight = false;
}
this.leftW = 0; // 左侧区域宽度(数字列复选框等)
if (this.options.showNumCol) {
this.leftW += this.numWidth;
}
if(this.options.multiSelect){
this.leftW += this.multiWidth;
}
this.exceptContentHeight = 0; // 内容区域之外的高度
if(this.options.showHeader){
this.exceptContentHeight +=this.headerHeight;
}
// 缓存id
var url = window.location.href;
var index = url.indexOf('?');
if(index > 0){
url = url.substring(0,index);
}
this.localStorageId = this.options.id + url;
},
/*
* 初始化变量
*/
initVariable:function(){
this.initDataSourceVariable();
// 鼠标点击移动时位置记录
this.mouseUpX = 'mouseUpX';
this.mouseUpY = 'mouseUpY';
this.mouseDownX = 'mouseDownX';
this.mouseDownY = 'mouseDownY';
this.mouseMoveX = 'mouseMoveX';
this.mouseMoveY = 'mouseMoveY';
this.scrollLeft = 0; // 记录横向滚动条
this.scrollTop = 0;// 记录纵向滚动条
this.showType = ''; // 记录grid显示方式,form和grid
this.createGridFlag = false; // 是否已经创建grid展示
this.createFormFlag = false; // 是否已经创建form展示
this.columnClickX = 0; // 点击处的X坐标
this.columnClickY = 0; // 点击处的Y坐标
this.$sd_storageData = null;// 本地缓存内容为object
this.columnMenuMove = false;// 是否在column menu区域移动
this.createColumnMenuFlage = false;
this.firstColumn = true; // 用于记录是否已经存在第一列,true表示还没有,false表示已经存在
this.lastVisibleColumn = null;
this.lastVisibleColumnWidth = 0;
this.menuColumnsHeight = 0;
},
/*
* 初始化datasource相关变量
*/
initDataSourceVariable:function(){
this.selectRows = new Array();
this.selectRowsObj = new Array();
this.selectRowsIndex = new Array();
this.allRows = new Array();
this.eidtRowIndex = -1; // 当前修改行
},
// 初始化宽度相关变量
initWidthVariable:function(){
// 计算用变量
this.wholeWidth = 0; // 整体宽度
this.wholeHeight = 0; // 整体高度
this.rowHeight = 0; // 数据行高度
this.fixedRealWidth = 0; // 固定区域真实宽度
this.fixedWidth = 0; // 固定区域宽度
this.contentRealWidth = 0; // 内容区真实宽度,严格按照设置的width计算的宽度
this.contentWidth = 0; // 内容区宽度,自动扩展之后的宽度
this.contentMinWidth = 0; // 内容区最小宽度,即可视宽度
this.contentHeight = 0; //内容区高度
},
/*
* 创建gridCompColumn对象方便后续处理
*/
initGridCompColumn: function() {
var oThis = this;
oThis.gridCompColumnFixedArr = new Array();
if (this.options.columns) {
$.each(this.options.columns, function(i) {
if(!(this.headerLevel > 1)){
var column = new gridCompColumn(this, oThis.options);
oThis.gridCompColumnArr.push(column);
var column1 = new gridCompColumn(this, oThis.options);
oThis.basicGridCompColumnArr.push(column1);
}else{
oThis.gridCompLevelColumn.push(this);
}
});
}
var localGridCompColumnArr = this.getGridCompColumnArrFromLocal();
// 获取本地缓存中的数据
if(localGridCompColumnArr != null){
this.gridCompColumnArr = localGridCompColumnArr;
$.each(this.gridCompColumnArr,function(){
var field = this.options.field;
for(var i =0;i < oThis.options.columns.length;i++){
var c = oThis.options.columns[i];
if(c.field == field){
var options = $.extend({},c,this.options);
this.options = options;
break;
}
}
});
}
this.menuColumnsHeight = this.gridCompColumnArr.length * this.columnMenuHeight;
this.initGridCompFixedColumn();
this.columnsVisibleFun();
},
setRequired: function(field, value){
var oThis = this;
$.each(this.gridCompColumnArr,function(i){
if(this.options.field == field){
this.options.required = value;
if(!value) {
$('#' + oThis.options.id + '_edit_' + this.options.field).parent().find('.u-grid-edit-mustFlag').hide()
} else {
$('#' + oThis.options.id + '_edit_' + this.options.field).parent().find('.u-grid-edit-mustFlag').show()
}
}
});
},
getLevelTitleByField:function(field){
for(var i = 0; i < this.gridCompLevelColumn.length; i++){
var columnField = this.gridCompLevelColumn[i].field;
if(columnField == field){
return this.gridCompLevelColumn[i].title;
}
}
return '';
},
/*
* 将固定列放入gridCompColumnFixedArr
*/
initGridCompFixedColumn:function(){
var oThis = this;
var w = 0;
$.each(this.gridCompColumnArr,function(i){
if(this.options.fixed == true){
oThis.gridCompColumnFixedArr.push(this);
}
});
$.each(this.gridCompColumnFixedArr,function(i){
for(var i = oThis.gridCompColumnArr.length;i >-1;i-- ){
if(oThis.gridCompColumnArr[i] == this){
oThis.gridCompColumnArr.splice(i,1);
break;
}
}
});
},
/*
* 创建dataSource对象方便后续处理
*/
initDataSource: function() {
var oThis = this;
this.dataSourceObj = new dataSource(this.options.dataSource,this);
},
/*
* 创建顶层div以及_top div层
* 添加顶层div相关监听
*/
createDivs: function() {
var oThis = this;
this.ele.innerHTML = '';
// 创建顶层div
var styleStr = '',str = '';
if(this.options.width){
str += 'width:' + this.options.width + ';';
}else{
str += 'width:auto;';
}
if(this.options.height){
str += 'height:' + this.options.height + ';';
}else{
str += 'height:auto;';
}
if(str != ''){
styleStr = 'style="' + str + '"';
}
var htmlStr = '<div id="' + this.options.id + '" data-role="grid" class="u-grid" ' + styleStr + '>';
htmlStr += '</div>';
this.ele.insertAdjacentHTML('afterBegin', htmlStr);
// 创建屏幕div,用于拖动等操作
var htmlStr = '<div id="' + this.options.id + '_top" class="u-grid-top"></div>';
this.ele.insertAdjacentHTML('afterBegin', htmlStr);
this.initEventFun(); //创建完成之后顶层div添加监听
this.widthChangeFun(); // 根据整体宽度创建grid或form展示区域
},
/*
* 创建div区域
*/
repaintDivs:function(){
// 后期可以考虑form展示
this.repaintGridDivs();
this.realtimeTableRows = null;
}, /*
* 创建grid形式下div区域
*/
createGridDivs: function() {
if (this.createGridFlag) {
return;
}
// 为避免重复渲染,在开始清空里面内容
if($('#' + this.options.id)[0])
$('#' + this.options.id)[0].innerHTML = '';
var htmlStr = '<div id="' + this.options.id + '_grid" class="u-grid-grid">';
// if(this.options.showHeader){//由于可以动态修改showHeader,所以提前创建
htmlStr += this.createColumnMenu();
htmlStr += this.createHeader();
// }
htmlStr += this.createContent();
// if(this.options.editable){ //由于可以动态修改editable,所以提前创建
// htmlStr += this.createContentEditMenu();
// }
htmlStr += '</div>';
if($('#' + this.options.id)[0])
//$('#' + this.options.id)[0].insertAdjacentHTML('afterBegin', htmlStr);
$('#' + this.options.id).html(htmlStr);
this.headerFirstClassFun();
this.initGridEventFun();
this.afterGridDivsCreate();
this.createGridFlag = true;
this.realtimeTableRows = null;
},
/*
* 重画grid
*/
repaintGridDivs: function() {
$('#' + this.options.id + '_grid').remove(null, true);
this.showType = '';
this.wholeWidth = 0;
this.createGridFlag = false;
this.columnsVisibleFun();
this.widthChangeFun();
this.realtimeTableRows = null;
},
/*
* 创建columnMenu区域
*/
createColumnMenu: function() {
var oThis = this;
var htmlStr = '<div class="u-grid-column-menu" id="' + this.options.id + '_column_menu">';
htmlStr += '<ul data-role="menu" role="menubar" class="u-grid-column-menu-ul" id="' + this.options.id + '_column_menu_ul">';
// 创建显示/隐藏列
htmlStr += '<li class="u-grid-column-menu-li" role="menuitem">';
htmlStr += '<div class="u-grid-column-menu-div1" id="' + this.options.id + '_showColumn">';
htmlStr += '<span class="u-grid-column-menu-span">' + this.transMap.ml_show_column + '</span>';
htmlStr += '<div class="u-grid-column-menu-div3 fa fa-caret-right"></div>';
htmlStr += '</div></li>';
// 创建清除设置
htmlStr += '<li class="u-grid-column-menu-li" role="menuitem">';
htmlStr += '<div class="u-grid-column-menu-div1" id="' + this.options.id + '_clearSet">';
htmlStr += '<span class="u-grid-column-menu-span">' + this.transMap.ml_clear_set + '</span>';
htmlStr += '</div></li>';
htmlStr += '</ul></div>';
// 创建数据列区域
htmlStr += '<div class="u-grid-column-menu-columns" id="' + this.options.id + '_column_menu_columns">';
htmlStr += '<ul data-role="menu" role="menubar" class="u-grid-column-menu-columns-ul" id="' + this.options.id + '_column_menu_columns_ul">';
$.each(this.gridCompColumnArr, function(i) {
if(oThis.getString(this.options.title,'') != ''){
htmlStr += '<li class="u-grid-column-menu-columns-li" role="menuitem" index="' + i + '">';
htmlStr += '<div class="u-grid-column-menu-columns-div1">';
var checkedStr = "";
if(this.options.visible)
checkedStr = ' checked';
if(!this.options.canVisible)
checkedStr += ' style="display:none;"';
htmlStr += '<div class="u-grid-column-menu-columns-div2"><input type="checkbox" ' + checkedStr + '></div>';
htmlStr += '<span class="u-grid-column-menu-columns-span">' + this.options.title + '</span>';
htmlStr += '</div></li>';
}
});
htmlStr += '</ul></div>';
return htmlStr;
},
/*
* 创建header区域
*/
createHeader: function() {
var wrapStr = ''
if(this.wholeWidth > 0){
// wrapStr = 'style="max-width:' + this.wholeWidth + 'px;"'
}
var headerShowStr = '';
if(!this.options.showHeader)
headerShowStr = 'style="display:none;"';
var htmlStr = '<div class="u-grid-header" id="' + this.options.id + '_header" ' + headerShowStr + '><div class="u-grid-header-wrap" id="' + this.options.id + '_header_wrap" data-role="resizable" ' + wrapStr + '>';
if (this.options.multiSelect || this.options.showNumCol) {
htmlStr += '<div id="' + this.options.id + '_header_left" class="u-grid-header-left" style="width:' + this.leftW + 'px;">';
if (this.options.multiSelect) {
if(iweb.browser.isIE8){
htmlStr += '<div class="u-grid-header-multi-select" style="width:' + this.multiWidth + 'px;"><input class="u-grid-multi-input" type="checkbox" id="' + this.options.id + '_header_multi_input"></div>'
}else{
htmlStr += '<div class="u-grid-header-multi-select checkbox check-success" style="width:' + this.multiWidth + 'px;"><input class="u-grid-multi-input" type="checkbox" id="' + this.options.id + '_header_multi_input"><label for="' + this.options.id + '_header_multi_input"></label></div>'
}
}
if (this.options.showNumCol) {
htmlStr += '<div class="u-grid-header-num" style="width:' + this.numWidth + 'px;"></div>';
}
htmlStr += '</div>';
}
htmlStr += this.createHeaderTable('fixed');
htmlStr += this.createHeaderTable();
htmlStr += '</div>';
htmlStr += '<div class="u-grid-header-resize-handle" id="' + this.options.id + '_resize_handle"><div class="u-grid-header-resize-handle-inner"></div></div>';
htmlStr += '</div>';
return htmlStr;
},
/*
* 创建header区域table
*/
createHeaderTable:function(createFlag){
var leftW,positionStr,idStr;
if(createFlag == 'fixed'){
leftW = parseInt(this.leftW);
positionStr = 'absolute;width:'+this.fixedWidth+'px;z-index:11;background:#F9F9F9;';
idStr = 'fixed_';
}else{
leftW = parseInt(this.leftW) + parseInt(this.fixedWidth);
positionStr = 'relative;';
idStr = '';
if(this.contentMinWidth > 0){
positionStr += 'width:'+this.contentMinWidth+'px;';
}
}
var htmlStr = '<table role="grid" id="' + this.options.id + '_header_'+idStr+'table" style="position:'+ positionStr+';left:' + leftW + 'px">';
htmlStr += this.createColgroup(createFlag);
htmlStr += '<thead role="rowgroup" id="' + this.options.id + '_header_'+idStr+'thead">';
htmlStr += this.createThead(createFlag);
htmlStr += '</thead></table>';
return htmlStr;
},
/*
* 创建colgroup
*/
createColgroup: function(createFlag) {
var oThis = this,
htmlStr = '<colgroup>',gridCompColumnArr;
if(createFlag == 'fixed'){
gridCompColumnArr = this.gridCompColumnFixedArr;
}else{
gridCompColumnArr = this.gridCompColumnArr;
}
$.each(gridCompColumnArr, function() {
if(this.options.visible){
htmlStr += '<col';
htmlStr += ' style="width:' + oThis.formatWidth(this.options.width) + '"';
htmlStr += '>';
}
});
htmlStr += '</colgroup>';
return htmlStr;
},
/*
* 创建thead区域
*/
createThead: function(createFlag) {
var oThis = this;
var visibleIndex = 0;
var gridCompColumnArr;
var trStyle = '';
if(this.options.maxHeaderLevel >1){
trStyle = 'style="height:' + this.headerHeight + 'px;"';
}
var htmlStr = '<tr role="row" ' + trStyle + '>';
if(createFlag == 'fixed'){
gridCompColumnArr = this.gridCompColumnFixedArr;
}else{
gridCompColumnArr = this.gridCompColumnArr;
}
$.each(gridCompColumnArr, function(i) {
var vi = visibleIndex;
var displayStyle = '';
if(this.options.visible == false){
vi = -1;
displayStyle = 'style="display:none;"';
}else{
visibleIndex++;
}
// 低版本浏览器不支持th position为relative,因此加入空div
htmlStr += '<th role="columnheader" data-filed="' + this.options.field + '" rowspan="1" class="u-grid-header-th" ' + displayStyle + 'field="' + this.options.field + '" index="' + i + '" visibleIndex="' + vi + '"><div style="position:relative;">';
var colorStype = '';
if(this.options.headerColor){
colorStype = 'style="color:' + this.options.headerColor + '"';
}
htmlStr += '<div class="u-grid-header-link" field="' + this.options.field + '" title="' + this.options.title + '" ' + colorStype + '>' + this.options.title + '</div>';
if(oThis.options.columnMenu && createFlag != 'fixed'){
// 创建右侧按钮图标
htmlStr += '<div class="u-grid-header-columnmenu fa fa-bars " field="' + this.options.field + '" style="display:none;"></div>';
}
htmlStr += '</div></th>';
});
htmlStr += '</tr>';
return htmlStr;
}, /*
* 创建内容区域
*/
createContent: function() {
var h = '',displayStr = '',bottonStr='';
if(this.countContentHeight){
var wh = $('#' + this.options.id)[0].offsetHeight;
this.wholeHeight = wh;
if (wh > 0) {
this.contentHeight = parseInt(wh) - this.exceptContentHeight > 0?parseInt(wh) - this.exceptContentHeight:0;
if(this.contentHeight > 0){
h = 'style="max-height:' + this.contentHeight + 'px;"';
}
}
}
var htmlStr = '<div id="' + this.options.id + '_content" class="u-grid-content" ' + h + '>';
if (this.options.showNumCol || this.options.multiSelect) {
htmlStr += this.createContentLeft();
if(!(this.contentWidth > this.contentMinWidth)){
displayStr = 'display:none;';
bottonStr = 'bottom:0px;'
}
if(this.options.showSumRow){
htmlStr += '<div class="u-grid-content-left-sum-bottom" id="' + this.options.id + '_content_left_sum_bottom" style="width:' + (this.leftW + this.fixedWidth) + 'px;'+bottonStr+'">';
htmlStr += '</div>';
}
htmlStr += '<div class="u-grid-content-left-bottom" id="' + this.options.id + '_content_left_bottom" style="width:' + (this.leftW + this.fixedWidth) + 'px;'+displayStr+'">';
htmlStr += '</div>';
}
htmlStr += this.createContentTable('fixed');
htmlStr += this.createContentTable();
htmlStr += '</div>';
return htmlStr;
},
/*
* 创建内容区左侧区域
*/
createContentLeft: function() {
var oThis = this,
htmlStr = "",
left = 0;
if(this.options.multiSelect){
htmlStr += '<div class="u-grid-content-left" id="' + this.options.id + '_content_multiSelect" style="width:' + this.multiSelectWidth + 'px;">';
// 遍历生成所有行
if (this.dataSourceObj.rows) {
$.each(this.dataSourceObj.rows, function(i) {
htmlStr += oThis.createContentLeftMultiSelectRow(this);
});
}
htmlStr += '</div>';
left += this.multiSelectWidth;
}
if (this.options.showNumCol) {
htmlStr += '<div class="u-grid-content-left" id="' + this.options.id + '_content_numCol" style="width:' + this.numWidth + 'px;left:' + left + 'px;">';
// 遍历生成所有行
if (this.dataSourceObj.rows) {
$.each(this.dataSourceObj.rows, function(i) {
htmlStr += oThis.createContentLeftNumColRow(i);
});
}
htmlStr += '</div>';
}
return htmlStr;
},
/*
* 创建内容区左侧区域复选区(一行)
*/
createContentLeftMultiSelectRow:function(row,displayFlag){
var displayStr = '';
if(!this.options.autoExpand && row.level > 0 && displayFlag != 'block'){
displayStr = 'display:none;'
}
var tmpcheck = row.value["$_#_@_id"]
if(!tmpcheck) {
tmpcheck = setTimeout(function(){});
}
if(iweb.browser.isIE8){
var htmlStr = '<div style="width:' + this.multiSelectWidth + 'px;' + displayStr + '" class="u-grid-content-multiSelect " ><input class="u-grid-multi-input" id="checkbox'+tmpcheck+'" type="checkbox" value="1" ></div>'
}else{
var htmlStr = '<div style="width:' + this.multiSelectWidth + 'px;' + displayStr + '" class="u-grid-content-multiSelect checkbox check-success" ><input class="u-grid-multi-input" id="checkbox'+tmpcheck+'" type="checkbox" value="1" ><label for="checkbox'+tmpcheck+'"></label></div>'
}
return htmlStr;
},
/*
* 创建内容区左侧区域数字列(一行)
*/
createContentLeftNumColRow:function(index){
var htmlStr = '<div style="width:' + this.numWidth + 'px;" class="u-grid-content-num">' + (index+1) + '</div>';
return htmlStr;
},
/*
* 创建内容区table
*/
createContentTable:function(createFlag){
var leftW,idStr,styleStr,hStr,cssStr,tableStyleStr;
if(this.countContentHeight && parseInt(this.contentHeight) > 0){
hStr = 'max-height:' + this.contentHeight + 'px;';
}else{
hStr = "";
}
if(createFlag == 'fixed'){
leftW = parseInt(this.leftW);
idStr = 'fixed_';
cssStr = 'fixed-';
styleStr = 'style="position:absolute;width:'+this.fixedWidth+'px;left:' + leftW + 'px;' +hStr+'"';
tableStyleStr = 'style="width:'+this.fixedWidth+'px;"';
}else{
leftW = parseInt(this.leftW) + parseInt(this.fixedWidth);
idStr = '';
cssStr = '';
styleStr = 'style="position:relative;left:' + leftW + 'px;' +hStr;
if(this.contentMinWidth > 0){
styleStr += 'width:' + this.contentMinWidth + 'px;';
}
styleStr += '"';
tableStyleStr = '';
if(this.contentMinWidth > 0){
if(this.contentWidth > 0){
tableStyleStr = 'style="min-width:' + this.contentMinWidth + 'px;width:' + this.contentWidth + 'px;"';
}else{
tableStyleStr = 'style="min-width:' + this.contentMinWidth + 'px;"';
}
}
}
var htmlStr = '<div id="' + this.options.id + '_content_'+idStr+'div" class="u-grid-content-'+cssStr+'div" '+styleStr+'>';
htmlStr += '<div style="height:30px;position:absolute;top:-30px;width:100%;"></div><table role="grid" id="' + this.options.id + '_content_'+idStr+'table" ' + tableStyleStr+'>';
htmlStr += this.createColgroup(createFlag);
htmlStr += '<thead role="rowgroup" id="' + this.options.id + '_content_'+idStr+'thead" style="display:none">';
htmlStr += this.createThead(createFlag);
htmlStr += '</thead>';
htmlStr += this.createContentRows(createFlag);
htmlStr += '</table>';
if(createFlag != 'fixed'){
htmlStr += this.createNoRowsDiv();
}
htmlStr += '</div>';
return htmlStr;
},
/*
* 创建无数据区域
*/
createNoRowsDiv:function(){
var styleStr = '',styleStr1 = '';
if(this.contentMinWidth > 0){
styleStr += 'style="width:' + this.contentMinWidth + 'px;"';
}
if(this.contentWidth > 0){
styleStr1 += 'style="width:' + this.contentWidth + 'px;"';
}
var htmlStr = '<div class="u-grid-noRowsDiv"' + styleStr1 + ' id="' + this.options.id + '_noRows"></div>';
htmlStr += '<div class="u-grid-noRowsShowDiv"' + styleStr + ' id="' + this.options.id + '_noRowsShow">' + this.transMap.ml_no_rows + '</div>';
return htmlStr;
},
/*
* 创建内容区域所有行
*/
createContentRows: function(createFlag) {
var oThis = this,
htmlStr = "",idStr;
if(createFlag == 'fixed'){
idStr = 'fixed_';
}else{
idStr = '';
}
// 遍历生成所有行
if (this.dataSourceObj.rows) {
htmlStr += '<tbody role="rowgroup" id="' + this.options.id + '_content_'+idStr+'tbody">';
$.each(this.dataSourceObj.rows, function(i) {
htmlStr += oThis.createContentOneRow(this,createFlag);
});
if(oThis.options.showSumRow && this.dataSourceObj.rows && this.dataSourceObj.rows.length > 0){
htmlStr += oThis.createSumRow(createFlag);
}
htmlStr += '</tbody>';
}
return htmlStr;
},
/*
* 创建内容区域数据行
*/
createContentOneRow: function(row,createFlag,displayFlag) {
var styleStr = '';
if(!this.options.autoExpand && row.level > 0 && displayFlag != 'block'){
styleStr = 'style="display:none"';
}
var htmlStr = '<tr role="row" ' + styleStr + '>';
htmlStr += this.createContentOneRowTd(row,createFlag);
htmlStr += '</tr>';
return htmlStr;
},
/*
* 创建内容区域数据行,针对IE
*/
createContentOneRowForIE:function(table,index,rowObj,createFlag,displayFlag){
var row = table.insertRow(index + 1);
//row.role = 'row';
row.setAttribute("role","row");
if(!this.options.autoExpand && row.level > 0 && displayFlag != 'block'){
row.style.display = 'none';
}
this.createContentOneRowTdForIE(row,rowObj,createFlag);
},
/*
* 数据更新重画当前行
*/
// repaintRow:function(tr,row,createFlag){
repaintRow:function(rowIndex){
var tr = $('#' + this.options.id + '_content_tbody').find('tr[role="row"]')[ rowIndex];
var fixedtr = $('#' + this.options.id + '_content_fixed_tbody').find('tr[role="row"]')[rowIndex];
var row = this.dataSourceObj.rows[rowIndex];
var $tr = $(tr);
var index = this.getTrIndex($tr);
if(iweb.browser.isIE8 || iweb.browser.isIE9){
var table = $('#' + this.options.id + '_content_table')[0];
var fixedtable = $('#' + this.options.id + '_content_fixed_table')[0];
//table.deleteRow(this.eidtRowIndex + 1);
//fixedtable.deleteRow(this.eidtRowIndex + 1);
this.createContentOneRowTdForIE(tr,row)
this.createContentOneRowTdForIE(fixedtr,row,'fixed')
}else{
tr.innerHTML = this.createContentOneRowTd(row);
fixedtr.innerHTML = this.createContentOneRowTd(row,'fixed');
}
var obj = {};
obj.begin = index;
obj.length = 1;
// obj.createFlag = createFlag;
this.renderTypeFun(obj);
},
/*
* 创建行td对应的html
*/
createContentOneRowTd:function(row,createFlag){
var oThis = this;
var htmlStr = '',gridCompColumnArr;
if(createFlag == 'fixed'){
gridCompColumnArr = this.gridCompColumnFixedArr;
}else{
gridCompColumnArr = this.gridCompColumnArr;
}
var value = row.value;
$.each(gridCompColumnArr, function() {
var f = this.options.field,
v = $(value).attr(f);
v = oThis.getString(v,'');
// tianxq begin
if($.type(v) == 'object') {
v = v.showValue
}
// tianxq end
var renderType = this.options.renderType;
var treeStyle = '';
var spanStr ='';
var iconStr = '';
var vStr= '';
var tdStyle = '';
if(oThis.options.showTree && this.firstColumn){
var l = parseInt(oThis.treeLeft)*parseInt(row.level);
treeStyle = 'style="position:relative;';
if(row.hasChild){
if(oThis.options.autoExpand){
spanStr = '<span class=" fa fa-minus-square-o u-grid-content-tree-span"></span>';
}else{
spanStr = '<span class=" fa fa-plus-square-o u-grid-content-tree-span"></span>';
}
}else{
l += 16;
}
treeStyle += 'left:'+ l +'px;"';
}
if(!this.options.visible){
tdStyle = 'style="display:none;"';
}
if(this.options.icon){
iconStr = '<span class="' + this.options.icon + '"></span>';
}
// title="' + v + '" 创建td的时候不在设置title,在renderType中设置,处理现实xml的情况
htmlStr += '<td role="rowcell" '+ tdStyle +' title="' + v.replace(/\</g,'\<').replace(/\>/g,'\>') + '"><div class="u-grid-content-td-div" ' + treeStyle+'>' + spanStr + iconStr + '<span>' + v.replace(/\</g,'<').replace(/\>/g,'>') + '</span></div></td>';
});
return htmlStr;
},
/*
* 创建行td,针对IE
*/
createContentOneRowTdForIE:function(row,rowObj,createFlag){
var oThis = this,gridCompColumnArr;
if(createFlag == 'fixed'){
gridCompColumnArr = this.gridCompColumnFixedArr;
}else{
gridCompColumnArr = this.gridCompColumnArr;
}
var value = rowObj.value;
$.each(gridCompColumnArr, function() {
var f = this.options.field,
v = $(value).attr(f);
v = oThis.getString(v,'');
// tianxq begin
if($.type(v) == 'object') {
v = v.showValue
}
// tianxq end
var renderType = this.options.renderType;
var treeStyle = '';
var spanStr ='';
var iconStr = '';
var vStr= '';
var htmlStr = '';
var newCell= row.insertCell();
//newCell.row = 'rowcell';
newCell.setAttribute("role","rowcell");
newCell.title = v.replace(/\</g,'\<').replace(/\>/g,'\>');
if(oThis.options.showTree && this.firstColumn){
var l = parseInt(oThis.treeLeft)*parseInt(rowObj.level);
treeStyle = 'style="position:relative;';
if(rowObj.hasChild){
if(oThis.options.autoExpand){
spanStr = '<span class=" fa fa-minus-square-o u-grid-content-tree-span"></span>';
}else{
spanStr = '<span class=" fa fa-plus-square-o u-grid-content-tree-span"></span>';
}
}else{
l += 18;
}
treeStyle += 'left:'+ l +'px;"';
}
if(!this.options.visible){
newCell.style.display="none";
}
if(this.options.icon){
iconStr = '<span class="' + this.options.icon + '"></span>';
}
htmlStr += '<div class="u-grid-content-td-div" ' + treeStyle+'>' + spanStr + iconStr + '<span>' + v.replace(/\</g,'<').replace(/\>/g,'>') + '</span></div>';
newCell.insertAdjacentHTML('afterBegin',htmlStr);
});
},
/*
* 创建合计行
*/
createSumRow:function(createFlag){
if(this.options.showSumRow){
var oThis = this,idStr,gridCompColumnArr;
if(createFlag == 'fixed'){
idStr = 'fixed_';
gridCompColumnArr = this.gridCompColumnFixedArr;
}else{
idStr = '';
gridCompColumnArr = this.gridCompColumnArr;
}
var t = parseInt(this.wholeHeight) - this.exceptContentHeight - 48 - this.scrollBarHeight;
t = t> 0?t:0;
var htmlStr = '<tr role="row" class="u-grid-content-sum-row" id="' + this.options.id + '_content_'+idStr+'sum_row" style="top:'+t+'px;">';
$.each(gridCompColumnArr, function() {
var f = this.options.field;
var sumValue = oThis.dataSourceObj.getSumValue(f,this,oThis);
var tdStyle = '';
if(!this.options.visible){
tdStyle = 'style="display:none;"';
}
htmlStr += '<td role="rowcell" title="' + sumValue + '" ' + tdStyle + '>';
if(this.firstColumn){
htmlStr += '<div class="u-gird-centent-sum-div"><span>' + oThis.transMap.ml_sum + '</span></div>';
}
var contentStyle = '';
if(this.options.dataType == 'integer' || this.options.dataType == 'float') {
contentStyle = 'style="text-align: right;"'
}
htmlStr += '<div class="u-grid-content-td-div" ' + contentStyle + '><span>' + sumValue + '</span></div></td>'; });
htmlStr += '</tr>';
return htmlStr;
}
},
/*
* 创建合计行 for ie
*/
createSumRowForIE:function(table,createFlag){
if(this.options.showSumRow){
var oThis = this,idStr,gridCompColumnArr;
if(createFlag == 'fixed'){
idStr = 'fixed_';
gridCompColumnArr = this.gridCompColumnFixedArr;
}else{
idStr = '';
gridCompColumnArr = this.gridCompColumnArr;
}
var t = parseInt(this.wholeHeight) - this.exceptContentHeight - 48 - this.scrollBarHeight;
t = t> 0?t:0;
var row = table.insertRow();
row.row = 'row';
row.className = 'u-grid-content-sum-row';
row.id = this.options.id + '_content_'+idStr+'sum_row';
row.style.top = t + 'px';
$.each(gridCompColumnArr, function() {
var f = this.options.field;
var sumValue = oThis.dataSourceObj.getSumValue(f,this,oThis);
var newCell= row.insertCell();
newCell.role = 'rowcell';
newCell.title = sumValue;
var contentStyle = '';
if(this.options.dataType == 'integer' || this.options.dataType == 'float') {
contentStyle = 'style="text-align: right;"'
}
var htmlStr = '<div class="u-grid-content-td-div" ' + contentStyle + '><span>' + sumValue + '</span></div>';
newCell.insertAdjacentHTML('afterBegin',htmlStr);
});
}
},
/*
* 重画合计行
*/
repairSumRow:function(){
if(this.options.showSumRow){
$('#' + this.options.id + '_content_div tbody .u-grid-content-sum-row').remove();
$('#' + this.options.id + '_content_fixed_div tbody .u-grid-content-sum-row').remove();
try{
if(this.dataSourceObj.rows && this.dataSourceObj.rows.length > 0){
var htmlStr = this.createSumRow();
$('#' + this.options.id + '_content_div tbody')[0].insertAdjacentHTML('beforeEnd',htmlStr);
var htmlStr = this.createSumRow('fixed');
$('#' + this.options.id + '_content_fixed_div tbody')[0].insertAdjacentHTML('beforeEnd',htmlStr);
}
}catch(e){
var table = $('#' + this.options.id + '_content_div table')[0];
var fixedTable = $('#' + this.options.id + '_content_fixed_div table')[0];
this.createSumRowForIE(table);
this.createSumRowForIE(table,'fixed');
}
}
},
/*
* 重画内容区域
*/
repairContent: function(){
var $pDiv = $('#' + this.options.id + '_content').parent();
$('#' + this.options.id + '_content').remove(null, true);
if($pDiv[0]){
var htmlStr = this.createContent();
$pDiv[0].insertAdjacentHTML('beforeEnd', htmlStr);
this.renderTypeFun();
this.initContentDivEventFun();
if($('#' + this.options.id + '_content_div')[0]){
$('#' + this.options.id + '_content_div')[0].scrollLeft = this.scrollLeft;
}
$('#' +this.options.id + '_content_edit_menu').css('display','none');
}
this.realtimeTableRows = null;
},
/*
* 创建form形式下div
*/
createFromDivs: function() {
if (this.createFormFlag) {
return;
}
var htmlStr = '<div id="' + this.options.id + '_form" class="u-grid-form">';
htmlStr += this.createFromContent();
$('#' + this.options.id)[0].insertAdjacentHTML('afterBegin', htmlStr);
this.createFormFlag = true;
},
/*
* 创建form形式下内容区域
*/
createFromContent: function() {
var htmlStr = '<div class="u-grid-form-content" id="' + this.options.id + '_form_content" class="u-grid-content">';
htmlStr += '<table role="grid" id="' + this.options.id + '_form_content_table">';
htmlStr += this.createFormContentRows();
htmlStr += '</table>';
return htmlStr;
},
/*
* 创建form形式下内容区域所有行
*/
createFormContentRows: function() {
var oThis = this,
htmlStr = "";
// 遍历生成所有行
if (this.dataSourceObj.rows) {
htmlStr += '<tbody role="rowgroup" id="' + this.options.id + '_form_content_tbody">';
$.each(this.dataSourceObj.rows, function() {
htmlStr += '<tr role="row"><td role="rowcell">';
var value = this.value;
$.each(oThis.gridCompColumnArr, function() {
var f = this.options.field,
t = this.options.title,
v = $(value).attr(f);
htmlStr += '<div>' + t + ':</div>';
htmlStr += '<div>' + v + '</div>';
});
htmlStr += '</td></tr>';
});
htmlStr += '</tbody>';
}
return htmlStr;
},
/*
* 创建完成之后顶层div添加监听
*/
initEventFun: function() {
var oThis = this;
$('#' + this.options.id).on('mousedown', function(e) {
if ($(e.target).closest('#' + oThis.options.id + '_header').length > 0) {
// 点击的是header区域
oThis.mouseDownX = e.clientX;
oThis.mouseDownY = e.clientY;
var eleTh = $(e.target).closest('th')[0];
if(oThis.canSwap){
oThis.swapColumnStart(e, eleTh);
}
e.preventDefault();
} else if ($(e.target).closest('#' + oThis.options.id + '_content').length > 0) {
// 点击的是数据区域
}
});
$('#' + this.options.id).on('mousemove', function(e) {
// if (!oThis.countWidthFlag) {
// oThis.countWidth(e); //某些情况下不是创建完就显示的,所以在mousemove中处理
// oThis.countWidthFlag = true;
// }
if ($(e.target).closest('#' + oThis.options.id + '_header').length > 0) {
// 在header区域移动
var eleTh = $(e.target).closest('th')[0];
// 将其他列的操作按钮隐藏,显示当前列的
oThis.headerThDrag(e, eleTh);
}
oThis.mouseMoveX = e.clientX;
oThis.mouseMoveY = e.clientY;
if ((oThis.mouseMoveX != oThis.mouseDownX || oThis.mouseDownY != oThis.mouseMoveY) && oThis.mouseDownX != 'mouseDownX' && oThis.canSwap) {
// 鼠标按下之后移动了
oThis.swapColumnFlag = true;
}
oThis.dragFun(e);
oThis.swapColumnFun(e);
e.stopPropagation();
});
$('#' + this.options.id + '_top').on('mousemove', function(e) {
oThis.mouseMoveX = e.clientX;
oThis.mouseMoveY = e.clientY;
if ((oThis.mouseMoveX != oThis.mouseDownX || oThis.mouseDownY != oThis.mouseMoveY) && oThis.mouseDownX != 'mouseDownX' && oThis.canSwap) {
// 鼠标按下之后移动了
oThis.swapColumnFlag = true;
}
oThis.dragFun(e);
oThis.swapColumnFun(e);
e.stopPropagation();
});
$('#' + this.options.id).on('mouseup', function(e) {
if ($(e.target).closest('#' + oThis.options.id + '_header').length > 0) {
// 点击的是header区域
oThis.mouseUpX = e.clientX;
oThis.mouseUpY = e.clientY;
//点击过程中鼠标没有移动
if (oThis.mouseDownX == oThis.mouseUpX && oThis.mouseDownY == oThis.mouseUpY) {
//或者移动距离小于5px(由于移动之后会显示屏幕div,暂时不做处理)
// if( Math.abs(parseInt(oThis.mouseDownX) - parseInt(oThis.mouseUpX)) <=5 && Math.abs(parseInt(oThis.mouseDownY) - parseInt(oThis.mouseUpY)) <=5){
oThis.columnClickX = e.clientX;
oThis.columnClickY = e.clientY;
var eleTh = $(e.target).closest('th')[0];
if($(e.target).hasClass('u-grid-header-columnmenu')){
//点击的是columnmenu
$('#' + oThis.options.id + '_column_menu').css('display','block');
var left = eleTh.attrRightTotalWidth - oThis.scrollLeft + oThis.leftW + oThis.fixedWidth - 20;
if(left + oThis.columnMenuWidth > oThis.wholeWidth)
left = eleTh.attrRightTotalWidth - oThis.scrollLeft + oThis.leftW + oThis.fixedWidth - oThis.columnMenuWidth + 1;
$('#' + oThis.options.id + '_column_menu').css('left',left);
$('#' + oThis.options.id + '_column_menu').css('top',oThis.headerHeight);
oThis.ele.createColumnMenuFlage = true;
}else{
// 执行click操作,进行排序
oThis.canSortable(e, eleTh);
}
}
} else if ($(e.target).closest('#' + oThis.options.id + '_content').length > 0) {
// 点击的是数据区域
}
oThis.dragEnd(e);
oThis.swapColumnEnd(e);
oThis.mouseUpX = 'mouseUpX';
oThis.mouseUpY = 'mouseUpY';
oThis.mouseDownX = 'mouseDownX';
oThis.mouseDownY = 'mouseDownY';
oThis.mouseMoveX = 'mouseMoveX';
oThis.mouseMoveY = 'mouseMoveY';
});
$('#' + this.options.id+ '_top').on('mouseup', function(e) {
oThis.dragEnd(e);
oThis.swapColumnEnd(e);
oThis.mouseUpX = 'mouseUpX';
oThis.mouseUpY = 'mouseUpY';
oThis.mouseDownX = 'mouseDownX';
oThis.mouseDownY = 'mouseDownY';
oThis.mouseMoveX = 'mouseMoveX';
oThis.mouseMoveY = 'mouseMoveY';
});
$(document).on('click',function(){
if(oThis.columnMenuMove == false && oThis.ele.createColumnMenuFlage == false){
$('#' + oThis.options.id + '_column_menu',oThis.$ele).css('display','none');
}
oThis.ele.createColumnMenuFlage = false;
});
},
/*
* 创建完成之后grid层 div添加监听
*/
initGridEventFun: function() {
var oThis = this;
// 拖动
$('#' + this.options.id + '_resize_handle').on('mousedown', function(e) {
oThis.dragStart(e);
return false;
});
// 列头按钮显示/隐藏
$('#' + this.options.id + '_header_table th').on('mousemove',function(e){
$('.u-grid-header-columnmenu',$(this)).css('display','block');
});
$('#' + this.options.id + '_header_table th').on('mouseout',function(e){
$('.u-grid-header-columnmenu',$(this)).css('display','none');
});
this.initContentDivEventFun();
// 全选
$('#' + this.options.id + '_header_multi_input').on('click', function(e) {
if(this.checked){
oThis.setAllRowSelect();
}else{
oThis.setAllRowUnSelect();
}
});
/*header 按钮处理开始*/
// column按钮
$('#' + this.options.id + '_column_menu_ul').on('mousemove', function(e) {
oThis.columnMenuMove = true;
});
$('#' + this.options.id + '_column_menu_ul').on('mouseout', function(e) {
oThis.columnMenuMove = false;
});
// 显示/隐藏列按钮
$('#' + this.options.id + '_showColumn').on('mousemove', function(e) {
//待完善 考虑屏幕高度决定columnMenu显示形式
if(oThis.hideMenuColumns)
clearTimeout(oThis.hideMenuColumns);
if($('#' + oThis.options.id + '_column_menu_columns').css('display') == 'block')
return;
var sX = $(window).width();
var sH = $(window).height();
var menuLeft = $('#' + oThis.options.id + '_column_menu').css('left');
var columnsLeft = parseInt(menuLeft) + oThis.columnMenuWidth;
var maxLeft = oThis.columnClickX + oThis.columnMenuWidth * 2;
if(maxLeft > sX)
columnsLeft = parseInt(menuLeft) - oThis.columnMenuWidth;
$('#' + oThis.options.id + '_column_menu_columns').css('left',columnsLeft);
var columnsTop = oThis.headerHeight;
var cY = e.clientY;
// 如果数据列高度高于屏幕高度则数据列高度设置为屏幕高度-10;
var columnsHeight = oThis.menuColumnsHeight;
var hh = 0;
if((oThis.menuColumnsHeight + 30) > sH){
columnsHeight = sH - 30;
$('#' + oThis.options.id + '_column_menu_columns').css('height',columnsHeight + 'px');
}else{
$('#' + oThis.options.id + '_column_menu_columns').css('height','');
}
var maxHeight = cY + columnsHeight;
if(maxHeight > sH)
columnsTop = (cY - (sH - columnsHeight)) * -1 + 30;
$('#' + oThis.options.id + '_column_menu_columns').css('top',columnsTop);
$('#' + oThis.options.id + '_column_menu_columns').css('display','block');
oThis.columnMenuMove = true;
});
$('#' + this.options.id + '_showColumn').on('mouseout', function(e) {
oThis.hideMenuColumns = setTimeout(function(){
$('#' + oThis.options.id + '_column_menu_columns').css('display','none');
oThis.columnMenuMove = false;
},200);
});
$('#' + this.options.id + '_column_menu_columns').on('mousemove', function(e) {
if(oThis.hideMenuColumns)
clearTimeout(oThis.hideMenuColumns);
$('#' + oThis.options.id + '_column_menu_columns').css('display','block');
oThis.columnMenuMove = true;
});
$('#' + this.options.id + '_column_menu_columns').on('mouseout', function(e) {
oThis.hideMenuColumns = setTimeout(function(){
$('#' + oThis.options.id + '_column_menu_columns').css('display','none');
oThis.columnMenuMove = false;
},200);
});
// 清除设置按钮
$('#' + this.options.id + '_clearSet').on('click', function(e) {
oThis.clearLocalData();
oThis.initGridCompColumn();
// 清除排序
oThis.dataSourceObj.sortRows();
oThis.repaintGridDivs();
if(typeof oThis.options.onClearSetFun == 'function'){
oThis.options.onClearSetFun(oThis);
}
});
// 显示/隐藏列 对应所有列的点击处理
$('#' + this.options.id + '_column_menu_columns_ul li input').on('click', function(e) {
//待完善 优化与li的click的代码整合
var index = $(this).closest('li').attr('index');
if(oThis.gridCompColumnArr[index].options.visible){
$(this)[0].checked = false;
var ll = $('input:checked',$('#' + oThis.options.id + '_column_menu_columns_ul')).length;
if(ll == 0){
$(this)[0].checked = true;
return;
}
if(document.documentMode == 8){
oThis.gridCompColumnArr[index].options.visible = false;
oThis.repaintGridDivs();
}else{
oThis.setColumnVisibleByIndex(index,false);
oThis.gridCompColumnArr[index].options.visible = false;
}
}else{
$(this)[0].checked = true;
if(document.documentMode == 8){
oThis.gridCompColumnArr[index].options.visible = true;
oThis.repaintGridDivs();
}else{
oThis.setColumnVisibleByIndex(index,true);
oThis.gridCompColumnArr[index].options.visible = true;
}
}
oThis.saveGridCompColumnArrToLocal();
e.stopPropagation();
});
$('#' + this.options.id + '_column_menu_columns_ul li').on('click', function(e) {
var index = $(this).attr('index');
var gridCompColumn = oThis.gridCompColumnArr[index];
if(!gridCompColumn.options.canVisible){
return false;
}
//获取选中列数量,不能小于1
if(gridCompColumn.options.visible){
$('input',$(this))[0].checked = false;
var ll = $('input:checked',$('#' + oThis.options.id + '_column_menu_columns_ul')).length;
if(ll == 0){
$('input',$(this))[0].checked = true;
return;
}
oThis.setColumnVisibleByIndex(index,false);
oThis.gridCompColumnArr[index].options.visible = false;
}else{
$('input',$(this))[0].checked = true;
oThis.setColumnVisibleByIndex(index,true);
oThis.gridCompColumnArr[index].options.visible = true;
}
oThis.saveGridCompColumnArrToLocal();
});
/*header 按钮处理结束*/
// 行编辑按钮相关事件
/*$('#' + this.options.id + '_content_edit_menu_ok').on('click',function(e){
oThis.editOk();
});
$('#' + this.options.id + '_content_edit_menu_cancel').on('click',function(e){
oThis.editCancel();
});*/
},
/*
* 内容区 div添加监听
*/
initContentDivEventFun:function(){
var oThis = this;
// 通过复选框设置选中行
$('#' + oThis.options.id + '_content .u-grid-content-left').on('click',function(e){
var $input = $(e.target).closest('input');
if($input.length > 0){
var $div = $($input.parent());
var index = $('.u-grid-content-multiSelect',$div.parent()).index($div);
if($input[0].checked){
oThis.setRowSelect(index);
}else{
oThis.setRowUnselect(index);
}
}
});
// 同步滚动条
$('#' + this.options.id + '_content_div').on('scroll', function(e) {
oThis.scrollLeft = this.scrollLeft;
oThis.scrollTop = this.scrollTop;
$('#' + oThis.options.id + '_header_table').css('left', oThis.leftW - oThis.scrollLeft + oThis.fixedWidth + "px");
$('#' + oThis.options.id + '_noRowsShow').css('left', oThis.scrollLeft + "px");
$('#' + oThis.options.id + '_edit_form').css('left', oThis.scrollLeft + "px");
$('#' + oThis.options.id + '_content_multiSelect').css('top', -oThis.scrollTop + "px");
$('#' + oThis.options.id + '_content_numCol').css('top', -oThis.scrollTop + "px");
$('#' + oThis.options.id + '_content_fixed_div').css('top', -oThis.scrollTop + "px");
});
// 数据行相关事件
$('#' + this.options.id + '_content_tbody').on('click',function(e){
// 双击处理
if(typeof oThis.options.onDblClickFun == 'function'){
oThis.isDblEvent('tbodyClick',oThis.dblClickFun,e,oThis.clickFun,e);
}else{
oThis.clickFun(e);
}
});
$('#' + this.options.id + '_content_fixed_tbody').on('click',function(e){
// 双击处理
if(typeof oThis.options.onDblClickFun == 'function'){
oThis.isDblEvent('tbodyClick',oThis.dblClickFun,e,oThis.clickFun,e);
}else{
oThis.clickFun(e);
}
});
$('#' + this.options.id + '_content_tbody').on('mousemove', function(e) {
var $tr = $(e.target).closest('tr');
// 首先清除所有的背景
$('#' + oThis.options.id + '_content_tbody').find('tr').removeClass('u-grid-move-bg');
$('#' + oThis.options.id + '_content_fixed_tbody').find('tr').removeClass('u-grid-move-bg');
if(oThis.options.multiSelect)
$('#' + oThis.options.id + '_content_multiSelect').find('div').removeClass('u-grid-move-bg');
if(oThis.options.showNumCol)
$('#' + oThis.options.id + '_content_numCol').find('div').removeClass('u-grid-move-bg');
if($tr[0].id && $tr[0].id == oThis.options.id + '_edit_tr'){
return;
}
if($tr.length > 0){
var mousemoveIndex = $('tr',$tr.parent()).index($tr);
$('#' + oThis.options.id + '_content_tbody').find('tr').eq(mousemoveIndex).addClass('u-grid-move-bg');
$('#' + oThis.options.id + '_content_fixed_tbody').find('tr').eq(mousemoveIndex).addClass('u-grid-move-bg');
if(oThis.options.multiS