mirror of https://github.com/layui/layui
下拉菜单新增reloadData方法;form赋值的的时候对于单选进行调优,重新调整每个选项的checked避免出现多个checked或者无法清空的情况;表格修复有多级表头并且有部分字段宽度自动分配的情况下出现字段的宽度没有占满容器导出出现缝隙的问题;表格调整实例的记录时机,避免data模式下在一些场会遇到组件内部报错问题;表格新增getTrHtml方法可以将数据解析返回html代码方便外部调用;新增treeTable模块。
parent
abf6aff29a
commit
5d77e15fa3
|
@ -21,7 +21,7 @@ const config = {
|
||||||
,{pkg: pkg, js: ';'}
|
,{pkg: pkg, js: ';'}
|
||||||
]
|
]
|
||||||
//模块
|
//模块
|
||||||
,modules: 'lay,laytpl,laypage,laydate,jquery,layer,util,dropdown,slider,colorpicker,element,upload,form,table,tree,transfer,carousel,rate,flow,code'
|
,modules: 'lay,laytpl,laypage,laydate,jquery,layer,util,dropdown,slider,colorpicker,element,upload,form,table,treeTable,tree,transfer,carousel,rate,flow,code'
|
||||||
};
|
};
|
||||||
|
|
||||||
// 获取参数
|
// 获取参数
|
||||||
|
|
|
@ -60,6 +60,7 @@
|
||||||
,transfer: 'transfer' //穿梭框
|
,transfer: 'transfer' //穿梭框
|
||||||
,tree: 'tree' //树结构
|
,tree: 'tree' //树结构
|
||||||
,table: 'table' //表格
|
,table: 'table' //表格
|
||||||
|
,treeTable: 'treeTable' //树表
|
||||||
,element: 'element' //常用元素操作
|
,element: 'element' //常用元素操作
|
||||||
,rate: 'rate' //评分组件
|
,rate: 'rate' //评分组件
|
||||||
,colorpicker: 'colorpicker' //颜色选择器
|
,colorpicker: 'colorpicker' //颜色选择器
|
||||||
|
|
|
@ -48,6 +48,9 @@ layui.define(['jquery', 'laytpl', 'lay'], function(exports){
|
||||||
,reload: function(options){
|
,reload: function(options){
|
||||||
that.reload.call(that, options);
|
that.reload.call(that, options);
|
||||||
}
|
}
|
||||||
|
,reloadData: function(options){
|
||||||
|
dropdown.reloadData(id, options);
|
||||||
|
}
|
||||||
,close: function () {
|
,close: function () {
|
||||||
that.remove()
|
that.remove()
|
||||||
}
|
}
|
||||||
|
@ -83,14 +86,14 @@ layui.define(['jquery', 'laytpl', 'lay'], function(exports){
|
||||||
};
|
};
|
||||||
|
|
||||||
//重载实例
|
//重载实例
|
||||||
Class.prototype.reload = function(options){
|
Class.prototype.reload = function(options, type){
|
||||||
var that = this;
|
var that = this;
|
||||||
that.config = $.extend({}, that.config, options);
|
that.config = $.extend({}, that.config, options);
|
||||||
that.init(true);
|
that.init(true, type);
|
||||||
};
|
};
|
||||||
|
|
||||||
// 初始化准备
|
// 初始化准备
|
||||||
Class.prototype.init = function(rerender){
|
Class.prototype.init = function(rerender, type){
|
||||||
var that = this;
|
var that = this;
|
||||||
var options = that.config;
|
var options = that.config;
|
||||||
|
|
||||||
|
@ -113,7 +116,7 @@ layui.define(['jquery', 'laytpl', 'lay'], function(exports){
|
||||||
var newThat = thisModule.getThis(elem.data(MOD_INDEX));
|
var newThat = thisModule.getThis(elem.data(MOD_INDEX));
|
||||||
if(!newThat) return;
|
if(!newThat) return;
|
||||||
|
|
||||||
return newThat.reload(options);
|
return newThat.reload(options, type);
|
||||||
}
|
}
|
||||||
|
|
||||||
options.elem = $(options.elem);
|
options.elem = $(options.elem);
|
||||||
|
@ -122,13 +125,13 @@ layui.define(['jquery', 'laytpl', 'lay'], function(exports){
|
||||||
options.id = 'id' in options ? options.id : (
|
options.id = 'id' in options ? options.id : (
|
||||||
elem.attr('id') || that.index
|
elem.attr('id') || that.index
|
||||||
);
|
);
|
||||||
|
|
||||||
if(options.show) that.render(rerender); // 初始即显示
|
if(options.show || (type === 'reloadData' && that.elemView && $('body').find(that.elemView.get(0)).length)) that.render(rerender, type); //初始即显示或者面板弹出之后执行了刷新数据
|
||||||
that.events(); // 事件
|
that.events(); // 事件
|
||||||
};
|
};
|
||||||
|
|
||||||
//渲染
|
//渲染
|
||||||
Class.prototype.render = function(rerender){
|
Class.prototype.render = function(rerender, type){
|
||||||
var that = this
|
var that = this
|
||||||
,options = that.config
|
,options = that.config
|
||||||
,elemBody = $('body')
|
,elemBody = $('body')
|
||||||
|
@ -234,7 +237,7 @@ layui.define(['jquery', 'laytpl', 'lay'], function(exports){
|
||||||
}
|
}
|
||||||
|
|
||||||
//主模板
|
//主模板
|
||||||
,TPL_MAIN = ['<div class="layui-dropdown layui-border-box layui-panel layui-anim layui-anim-downbit">'
|
,TPL_MAIN = ['<div class="layui-dropdown layui-border-box layui-panel layui-anim layui-anim-downbit" lay-id="' + options.id + '">'
|
||||||
,'</div>'].join('');
|
,'</div>'].join('');
|
||||||
|
|
||||||
//如果是右键事件,则每次触发事件时,将允许重新渲染
|
//如果是右键事件,则每次触发事件时,将允许重新渲染
|
||||||
|
@ -244,26 +247,39 @@ layui.define(['jquery', 'laytpl', 'lay'], function(exports){
|
||||||
if(!rerender && options.elem.data(MOD_INDEX +'_opened')) return;
|
if(!rerender && options.elem.data(MOD_INDEX +'_opened')) return;
|
||||||
|
|
||||||
//记录模板对象
|
//记录模板对象
|
||||||
that.elemView = $(TPL_MAIN);
|
that.elemView = $('.' + STR_ELEM + '[lay-id="' + options.id + '"]');
|
||||||
that.elemView.append(options.content || getDefaultView());
|
if (type === 'reloadData' && that.elemView.length) {
|
||||||
|
that.elemView.html(options.content || getDefaultView());
|
||||||
//初始化某些属性
|
} else {
|
||||||
if(options.className) that.elemView.addClass(options.className);
|
that.elemView = $(TPL_MAIN);
|
||||||
if(options.style) that.elemView.attr('style', options.style);
|
that.elemView.append(options.content || getDefaultView());
|
||||||
|
|
||||||
|
//初始化某些属性
|
||||||
//记录当前执行的实例索引
|
if(options.className) that.elemView.addClass(options.className);
|
||||||
dropdown.thisId = options.id;
|
if(options.style) that.elemView.attr('style', options.style);
|
||||||
|
|
||||||
//插入视图
|
//记录当前执行的实例索引
|
||||||
that.remove(); //移除非当前绑定元素的面板
|
dropdown.thisId = options.id;
|
||||||
elemBody.append(that.elemView);
|
|
||||||
options.elem.data(MOD_INDEX +'_opened', true);
|
//插入视图
|
||||||
|
that.remove(); //移除非当前绑定元素的面板
|
||||||
|
elemBody.append(that.elemView);
|
||||||
|
options.elem.data(MOD_INDEX +'_opened', true);
|
||||||
|
|
||||||
|
//遮罩
|
||||||
|
var shade = options.shade ? ('<div class="'+ STR_ELEM_SHADE +'" style="'+ ('z-index:'+ (that.elemView.css('z-index')-1) +'; background-color: ' + (options.shade[1] || '#000') + '; opacity: ' + (options.shade[0] || options.shade)) +'"></div>') : '';
|
||||||
|
that.elemView.before(shade);
|
||||||
|
|
||||||
|
//如果是鼠标移入事件,则鼠标移出时自动关闭
|
||||||
|
if(options.trigger === 'mouseenter'){
|
||||||
|
that.elemView.on('mouseenter', function(){
|
||||||
|
clearTimeout(thisModule.timer);
|
||||||
|
}).on('mouseleave', function(){
|
||||||
|
that.delayRemove();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
//遮罩
|
|
||||||
var shade = options.shade ? ('<div class="'+ STR_ELEM_SHADE +'" style="'+ ('z-index:'+ (that.elemView.css('z-index')-1) +'; background-color: ' + (options.shade[1] || '#000') + '; opacity: ' + (options.shade[0] || options.shade)) +'"></div>') : '';
|
|
||||||
that.elemView.before(shade);
|
|
||||||
|
|
||||||
//坐标定位
|
//坐标定位
|
||||||
that.position();
|
that.position();
|
||||||
thisModule.prevElem = that.elemView; //记录当前打开的元素,以便在下次关闭
|
thisModule.prevElem = that.elemView; //记录当前打开的元素,以便在下次关闭
|
||||||
|
@ -301,15 +317,6 @@ layui.define(['jquery', 'laytpl', 'lay'], function(exports){
|
||||||
thisModule.spread(elemGroup);
|
thisModule.spread(elemGroup);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
//如果是鼠标移入事件,则鼠标移出时自动关闭
|
|
||||||
if(options.trigger === 'mouseenter'){
|
|
||||||
that.elemView.on('mouseenter', function(){
|
|
||||||
clearTimeout(thisModule.timer);
|
|
||||||
}).on('mouseleave', function(){
|
|
||||||
that.delayRemove();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 组件打开完毕的事件
|
// 组件打开完毕的事件
|
||||||
typeof options.ready === 'function' && options.ready(
|
typeof options.ready === 'function' && options.ready(
|
||||||
|
@ -542,14 +549,34 @@ layui.define(['jquery', 'laytpl', 'lay'], function(exports){
|
||||||
};
|
};
|
||||||
|
|
||||||
// 重载实例
|
// 重载实例
|
||||||
dropdown.reload = function(id, options){
|
dropdown.reload = function(id, options, type){
|
||||||
var that = thisModule.getThis(id);
|
var that = thisModule.getThis(id);
|
||||||
if(!that) return this;
|
if(!that) return this;
|
||||||
|
|
||||||
that.reload(options);
|
that.reload(options, type);
|
||||||
return thisModule.call(that);
|
return thisModule.call(that);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// 仅重载数据
|
||||||
|
dropdown.reloadData = function(){
|
||||||
|
var args = $.extend([], arguments);
|
||||||
|
args[2] = 'reloadData';
|
||||||
|
|
||||||
|
// 重载时,与数据相关的参数
|
||||||
|
var dataParams = new RegExp('^('+ [
|
||||||
|
'data', 'templet', 'content'
|
||||||
|
].join('|') + ')$');
|
||||||
|
|
||||||
|
// 过滤与数据无关的参数
|
||||||
|
layui.each(args[1], function (key, value) {
|
||||||
|
if(!dataParams.test(key)){
|
||||||
|
delete args[1][key];
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return dropdown.reload.apply(null, args);
|
||||||
|
};
|
||||||
|
|
||||||
// 核心入口
|
// 核心入口
|
||||||
dropdown.render = function(options){
|
dropdown.render = function(options){
|
||||||
var inst = new Class(options);
|
var inst = new Class(options);
|
||||||
|
|
|
@ -98,9 +98,7 @@ layui.define(['lay', 'layer', 'util'], function(exports){
|
||||||
itemElem[0].checked = value;
|
itemElem[0].checked = value;
|
||||||
} else if(type === 'radio') { // 如果为单选框
|
} else if(type === 'radio') { // 如果为单选框
|
||||||
itemElem.each(function(){
|
itemElem.each(function(){
|
||||||
if(this.value == value ){
|
this.checked = this.value == value;
|
||||||
this.checked = true
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
} else { // 其它类型的表单
|
} else { // 其它类型的表单
|
||||||
itemElem.val(value);
|
itemElem.val(value);
|
||||||
|
|
|
@ -46,11 +46,6 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||||
,options = that.config
|
,options = that.config
|
||||||
,id = options.id || options.index;
|
,id = options.id || options.index;
|
||||||
|
|
||||||
if(id){
|
|
||||||
thisTable.that[id] = that; // 记录当前实例对象
|
|
||||||
thisTable.config[id] = options; // 记录当前实例配置项
|
|
||||||
}
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
config: options
|
config: options
|
||||||
,reload: function(options, deep){
|
,reload: function(options, deep){
|
||||||
|
@ -322,10 +317,13 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||||
options.where = options.where || {};
|
options.where = options.where || {};
|
||||||
|
|
||||||
// 初始化 id 属性 - 优先取 options > 元素 id > 自增索引
|
// 初始化 id 属性 - 优先取 options > 元素 id > 自增索引
|
||||||
options.id = 'id' in options ? options.id : (
|
var id = options.id = 'id' in options ? options.id : (
|
||||||
options.elem.attr('id') || that.index
|
options.elem.attr('id') || that.index
|
||||||
);
|
);
|
||||||
|
|
||||||
|
thisTable.that[id] = that; // 记录当前实例对象
|
||||||
|
thisTable.config[id] = options; // 记录当前实例配置项
|
||||||
|
|
||||||
//请求参数的自定义格式
|
//请求参数的自定义格式
|
||||||
options.request = $.extend({
|
options.request = $.extend({
|
||||||
pageName: 'page'
|
pageName: 'page'
|
||||||
|
@ -810,13 +808,20 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||||
|
|
||||||
if(that.autoColNums > 0 && patchNums >= -colNums && patchNums <= colNums){
|
if(that.autoColNums > 0 && patchNums >= -colNums && patchNums <= colNums){
|
||||||
var getEndTh = function(th){
|
var getEndTh = function(th){
|
||||||
var field;
|
var field, thRet;
|
||||||
th = th || that.layHeader.eq(0).find('thead th:last-child')
|
th = th || that.layHeader.eq(0).find('thead th:last-child')
|
||||||
field = th.data('field');
|
layui.each(th, function (thIndex, thElem) {
|
||||||
|
thElem = $(thElem);
|
||||||
|
if (!thElem.children('.'+ELEM_GROUP).length) { // 排除合并表头
|
||||||
|
field = thElem.attr('data-field');
|
||||||
|
thRet = thElem;
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
if(!field && th.prev()[0]){
|
if(!field && th.prev()[0]){
|
||||||
return getEndTh(th.prev())
|
return getEndTh(th.prev())
|
||||||
}
|
}
|
||||||
return th
|
return thRet
|
||||||
}
|
}
|
||||||
,th = getEndTh()
|
,th = getEndTh()
|
||||||
,key = th.data('key');
|
,key = th.data('key');
|
||||||
|
@ -1034,6 +1039,152 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
Class.prototype.getTrHtml = function(data, sort, curr, trsObj) {
|
||||||
|
var that = this;
|
||||||
|
var options = that.config;
|
||||||
|
var trs = trsObj && trsObj.trs || [];
|
||||||
|
var trs_fixed = trsObj && trsObj.trs_fixed || [];
|
||||||
|
var trs_fixed_r = trsObj && trsObj.trs_fixed_r || [];
|
||||||
|
curr = curr || 1
|
||||||
|
|
||||||
|
layui.each(data, function(i1, item1){
|
||||||
|
var tds = [], tds_fixed = [], tds_fixed_r = []
|
||||||
|
,numbers = i1 + options.limit*(curr - 1) + 1; // 序号
|
||||||
|
|
||||||
|
// 数组值是否为 object,如果不是,则自动转为 object
|
||||||
|
if(typeof item1 !== 'object'){
|
||||||
|
data[i1] = item1 = {LAY_KEY: item1};
|
||||||
|
try {
|
||||||
|
table.cache[that.key][i1] = item1;
|
||||||
|
} catch(e) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
//若数据项为空数组,则不往下执行(因为删除数据时,会将原有数据设置为 [])
|
||||||
|
if(layui.type(item1) === 'array' && item1.length === 0) return;
|
||||||
|
|
||||||
|
// 加入序号保留字段
|
||||||
|
item1[table.config.numbersName] = numbers;
|
||||||
|
|
||||||
|
// 记录下标索引,用于恢复排序
|
||||||
|
if(!sort) item1[table.config.indexName] = i1;
|
||||||
|
|
||||||
|
// 遍历表头
|
||||||
|
that.eachCols(function(i3, item3){
|
||||||
|
var field = item3.field || i3;
|
||||||
|
var key = item3.key;
|
||||||
|
var content = item1[field];
|
||||||
|
|
||||||
|
if(content === undefined || content === null) content = '';
|
||||||
|
if(item3.colGroup) return;
|
||||||
|
|
||||||
|
// td 内容
|
||||||
|
var td = ['<td data-field="'+ field +'" data-key="'+ key +'" '+ function(){
|
||||||
|
//追加各种属性
|
||||||
|
var attr = [];
|
||||||
|
// 是否开启编辑。若 edit 传入函数,则根据函数的返回结果判断是否开启编辑
|
||||||
|
(function(edit){
|
||||||
|
if(edit) attr.push('data-edit="'+ edit +'"'); // 添加单元格编辑属性标识
|
||||||
|
})(typeof item3.edit === 'function' ? item3.edit(item1) : item3.edit);
|
||||||
|
if(item3.templet) attr.push('data-content="'+ util.escape(content) +'"'); //自定义模板
|
||||||
|
if(item3.toolbar) attr.push('data-off="true"'); //行工具列关闭单元格事件
|
||||||
|
if(item3.event) attr.push('lay-event="'+ item3.event +'"'); //自定义事件
|
||||||
|
if(item3.minWidth) attr.push('data-minwidth="'+ item3.minWidth +'"'); //单元格最小宽度
|
||||||
|
if(item3.maxWidth) attr.push('data-maxwidth="'+ item3.maxWidth +'"'); //单元格最大宽度
|
||||||
|
return attr.join(' ');
|
||||||
|
}() +' class="'+ function(){ //追加样式
|
||||||
|
var classNames = [];
|
||||||
|
if(item3.hide) classNames.push(HIDE); //插入隐藏列样式
|
||||||
|
if(!item3.field) classNames.push(ELEM_COL_SPECIAL); //插入特殊列样式
|
||||||
|
return classNames.join(' ');
|
||||||
|
}() +'">'
|
||||||
|
,'<div class="layui-table-cell laytable-cell-'+ function(){ //返回对应的CSS类标识
|
||||||
|
return item3.type === 'normal' ? key
|
||||||
|
: (key + ' laytable-cell-' + item3.type);
|
||||||
|
}() +'"'
|
||||||
|
+ (item3.align ? ' align="'+ item3.align +'"' : '')
|
||||||
|
+ function(){
|
||||||
|
var attr = [];
|
||||||
|
if(item3.style) attr.push('style="'+ item3.style +'"'); //自定义单元格样式
|
||||||
|
return attr.join(' ');
|
||||||
|
}() +'>'
|
||||||
|
+ function(){
|
||||||
|
var tplData = $.extend(true, {
|
||||||
|
LAY_COL: item3
|
||||||
|
}, item1);
|
||||||
|
var checkName = table.config.checkName;
|
||||||
|
var disabledName = table.config.disabledName;
|
||||||
|
|
||||||
|
//渲染不同风格的列
|
||||||
|
switch(item3.type){
|
||||||
|
case 'checkbox': // 复选
|
||||||
|
return '<input type="checkbox" name="layTableCheckbox" lay-skin="primary" '+ function(){
|
||||||
|
// 其他属性
|
||||||
|
var arr = [];
|
||||||
|
|
||||||
|
//如果是全选
|
||||||
|
if(item3[checkName]){
|
||||||
|
item1[checkName] = item3[checkName];
|
||||||
|
if(item3[checkName]) arr[0] = 'checked';
|
||||||
|
}
|
||||||
|
if(tplData[checkName]) arr[0] = 'checked';
|
||||||
|
|
||||||
|
// 禁选
|
||||||
|
if(tplData[disabledName]) arr.push('disabled');
|
||||||
|
|
||||||
|
return arr.join(' ');
|
||||||
|
}() +' lay-type="layTableCheckbox">';
|
||||||
|
break;
|
||||||
|
case 'radio': // 单选
|
||||||
|
if(tplData[checkName]){
|
||||||
|
that.thisCheckedRowIndex = i1;
|
||||||
|
}
|
||||||
|
return '<input type="radio" name="layTableRadio_'+ options.index +'" '
|
||||||
|
+ function(){
|
||||||
|
var arr = [];
|
||||||
|
if(tplData[checkName]) arr[0] = 'checked';
|
||||||
|
if(tplData[disabledName]) arr.push('disabled');
|
||||||
|
return arr.join(' ');
|
||||||
|
}() +' lay-type="layTableRadio">';
|
||||||
|
break;
|
||||||
|
case 'numbers':
|
||||||
|
return numbers;
|
||||||
|
break;
|
||||||
|
};
|
||||||
|
|
||||||
|
//解析工具列模板
|
||||||
|
if(item3.toolbar){
|
||||||
|
return laytpl($(item3.toolbar).html()||'').render(tplData);
|
||||||
|
}
|
||||||
|
return parseTempData.call(that, {
|
||||||
|
item3: item3
|
||||||
|
,content: content
|
||||||
|
,tplData: tplData
|
||||||
|
});
|
||||||
|
}()
|
||||||
|
,'</div></td>'].join('');
|
||||||
|
|
||||||
|
tds.push(td);
|
||||||
|
if(item3.fixed && item3.fixed !== 'right') tds_fixed.push(td);
|
||||||
|
if(item3.fixed === 'right') tds_fixed_r.push(td);
|
||||||
|
});
|
||||||
|
|
||||||
|
trs.push('<tr data-index="'+ i1 +'">'+ tds.join('') + '</tr>');
|
||||||
|
trs_fixed.push('<tr data-index="'+ i1 +'">'+ tds_fixed.join('') + '</tr>');
|
||||||
|
trs_fixed_r.push('<tr data-index="'+ i1 +'">'+ tds_fixed_r.join('') + '</tr>');
|
||||||
|
});
|
||||||
|
|
||||||
|
return {
|
||||||
|
trs: trs,
|
||||||
|
trs_fixed: trs_fixed,
|
||||||
|
trs_fixed_r: trs_fixed_r
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 返回行节点代码
|
||||||
|
table.getTrHtml = function (id, data) {
|
||||||
|
var that = getThisTable(id);
|
||||||
|
return that.getTrHtml(data);
|
||||||
|
}
|
||||||
|
|
||||||
// 数据渲染
|
// 数据渲染
|
||||||
Class.prototype.renderData = function(opts){
|
Class.prototype.renderData = function(opts){
|
||||||
|
@ -1057,7 +1208,7 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||||
options.HAS_SET_COLS_PATCH || that.setColsPatch();
|
options.HAS_SET_COLS_PATCH || that.setColsPatch();
|
||||||
options.HAS_SET_COLS_PATCH = true;
|
options.HAS_SET_COLS_PATCH = true;
|
||||||
|
|
||||||
var thisCheckedRowIndex;
|
that.thisCheckedRowIndex = '';
|
||||||
if(!sort && that.sortKey){
|
if(!sort && that.sortKey){
|
||||||
return that.sort({
|
return that.sort({
|
||||||
field: that.sortKey.field,
|
field: that.sortKey.field,
|
||||||
|
@ -1066,130 +1217,10 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||||
reloadType: opts.type
|
reloadType: opts.type
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
layui.each(data, function(i1, item1){
|
that.getTrHtml(data, sort, curr, {
|
||||||
var tds = [], tds_fixed = [], tds_fixed_r = []
|
trs: trs,
|
||||||
,numbers = i1 + options.limit*(curr - 1) + 1; // 序号
|
trs_fixed: trs_fixed,
|
||||||
|
trs_fixed_r: trs_fixed_r
|
||||||
// 数组值是否为 object,如果不是,则自动转为 object
|
|
||||||
if(typeof item1 !== 'object'){
|
|
||||||
data[i1] = item1 = {LAY_KEY: item1};
|
|
||||||
try {
|
|
||||||
table.cache[that.key][i1] = item1;
|
|
||||||
} catch(e) {}
|
|
||||||
}
|
|
||||||
|
|
||||||
//若数据项为空数组,则不往下执行(因为删除数据时,会将原有数据设置为 [])
|
|
||||||
if(layui.type(item1) === 'array' && item1.length === 0) return;
|
|
||||||
|
|
||||||
// 加入序号保留字段
|
|
||||||
item1[table.config.numbersName] = numbers;
|
|
||||||
|
|
||||||
// 记录下标索引,用于恢复排序
|
|
||||||
if(!sort) item1[table.config.indexName] = i1;
|
|
||||||
|
|
||||||
// 遍历表头
|
|
||||||
that.eachCols(function(i3, item3){
|
|
||||||
var field = item3.field || i3;
|
|
||||||
var key = item3.key;
|
|
||||||
var content = item1[field];
|
|
||||||
|
|
||||||
if(content === undefined || content === null) content = '';
|
|
||||||
if(item3.colGroup) return;
|
|
||||||
|
|
||||||
// td 内容
|
|
||||||
var td = ['<td data-field="'+ field +'" data-key="'+ key +'" '+ function(){
|
|
||||||
//追加各种属性
|
|
||||||
var attr = [];
|
|
||||||
// 是否开启编辑。若 edit 传入函数,则根据函数的返回结果判断是否开启编辑
|
|
||||||
(function(edit){
|
|
||||||
if(edit) attr.push('data-edit="'+ edit +'"'); // 添加单元格编辑属性标识
|
|
||||||
})(typeof item3.edit === 'function' ? item3.edit(item1) : item3.edit);
|
|
||||||
if(item3.templet) attr.push('data-content="'+ util.escape(content) +'"'); //自定义模板
|
|
||||||
if(item3.toolbar) attr.push('data-off="true"'); //行工具列关闭单元格事件
|
|
||||||
if(item3.event) attr.push('lay-event="'+ item3.event +'"'); //自定义事件
|
|
||||||
if(item3.minWidth) attr.push('data-minwidth="'+ item3.minWidth +'"'); //单元格最小宽度
|
|
||||||
if(item3.maxWidth) attr.push('data-maxwidth="'+ item3.maxWidth +'"'); //单元格最大宽度
|
|
||||||
return attr.join(' ');
|
|
||||||
}() +' class="'+ function(){ //追加样式
|
|
||||||
var classNames = [];
|
|
||||||
if(item3.hide) classNames.push(HIDE); //插入隐藏列样式
|
|
||||||
if(!item3.field) classNames.push(ELEM_COL_SPECIAL); //插入特殊列样式
|
|
||||||
return classNames.join(' ');
|
|
||||||
}() +'">'
|
|
||||||
,'<div class="layui-table-cell laytable-cell-'+ function(){ //返回对应的CSS类标识
|
|
||||||
return item3.type === 'normal' ? key
|
|
||||||
: (key + ' laytable-cell-' + item3.type);
|
|
||||||
}() +'"'
|
|
||||||
+ (item3.align ? ' align="'+ item3.align +'"' : '')
|
|
||||||
+ function(){
|
|
||||||
var attr = [];
|
|
||||||
if(item3.style) attr.push('style="'+ item3.style +'"'); //自定义单元格样式
|
|
||||||
return attr.join(' ');
|
|
||||||
}() +'>'
|
|
||||||
+ function(){
|
|
||||||
var tplData = $.extend(true, {
|
|
||||||
LAY_COL: item3
|
|
||||||
}, item1);
|
|
||||||
var checkName = table.config.checkName;
|
|
||||||
var disabledName = table.config.disabledName;
|
|
||||||
|
|
||||||
//渲染不同风格的列
|
|
||||||
switch(item3.type){
|
|
||||||
case 'checkbox': // 复选
|
|
||||||
return '<input type="checkbox" name="layTableCheckbox" lay-skin="primary" '+ function(){
|
|
||||||
// 其他属性
|
|
||||||
var arr = [];
|
|
||||||
|
|
||||||
//如果是全选
|
|
||||||
if(item3[checkName]){
|
|
||||||
item1[checkName] = item3[checkName];
|
|
||||||
if(item3[checkName]) arr[0] = 'checked';
|
|
||||||
}
|
|
||||||
if(tplData[checkName]) arr[0] = 'checked';
|
|
||||||
|
|
||||||
// 禁选
|
|
||||||
if(tplData[disabledName]) arr.push('disabled');
|
|
||||||
|
|
||||||
return arr.join(' ');
|
|
||||||
}() +' lay-type="layTableCheckbox">';
|
|
||||||
break;
|
|
||||||
case 'radio': // 单选
|
|
||||||
if(tplData[checkName]){
|
|
||||||
thisCheckedRowIndex = i1;
|
|
||||||
}
|
|
||||||
return '<input type="radio" name="layTableRadio_'+ options.index +'" '
|
|
||||||
+ function(){
|
|
||||||
var arr = [];
|
|
||||||
if(tplData[checkName]) arr[0] = 'checked';
|
|
||||||
if(tplData[disabledName]) arr.push('disabled');
|
|
||||||
return arr.join(' ');
|
|
||||||
}() +' lay-type="layTableRadio">';
|
|
||||||
break;
|
|
||||||
case 'numbers':
|
|
||||||
return numbers;
|
|
||||||
break;
|
|
||||||
};
|
|
||||||
|
|
||||||
//解析工具列模板
|
|
||||||
if(item3.toolbar){
|
|
||||||
return laytpl($(item3.toolbar).html()||'').render(tplData);
|
|
||||||
}
|
|
||||||
return parseTempData.call(that, {
|
|
||||||
item3: item3
|
|
||||||
,content: content
|
|
||||||
,tplData: tplData
|
|
||||||
});
|
|
||||||
}()
|
|
||||||
,'</div></td>'].join('');
|
|
||||||
|
|
||||||
tds.push(td);
|
|
||||||
if(item3.fixed && item3.fixed !== 'right') tds_fixed.push(td);
|
|
||||||
if(item3.fixed === 'right') tds_fixed_r.push(td);
|
|
||||||
});
|
|
||||||
|
|
||||||
trs.push('<tr data-index="'+ i1 +'">'+ tds.join('') + '</tr>');
|
|
||||||
trs_fixed.push('<tr data-index="'+ i1 +'">'+ tds_fixed.join('') + '</tr>');
|
|
||||||
trs_fixed_r.push('<tr data-index="'+ i1 +'">'+ tds_fixed_r.join('') + '</tr>');
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// 容器的滚动条位置
|
// 容器的滚动条位置
|
||||||
|
@ -1208,9 +1239,9 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
|
||||||
that.renderForm();
|
that.renderForm();
|
||||||
|
|
||||||
// 标注选中行样式
|
// 标注选中行样式
|
||||||
typeof thisCheckedRowIndex === 'number' && that.setRowChecked({
|
typeof that.thisCheckedRowIndex === 'number' && that.setRowChecked({
|
||||||
type: 'radio',
|
type: 'radio',
|
||||||
index: thisCheckedRowIndex
|
index: that.thisCheckedRowIndex
|
||||||
}, true);
|
}, true);
|
||||||
|
|
||||||
that.syncCheckAll();
|
that.syncCheckAll();
|
||||||
|
|
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue