github
/
layui
mirror of https://github.com/layui/layui
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

新增 table 表头复选框的半选效果

pull/1284/head
贤心 2023-06-16 09:47:07 +08:00
parent 9a123ef69f
commit 6c4b1c7237
1 changed files with 24 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
src/modules/table.js
View File

@ -934,10 +934,10 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
}); });
} }
}; };
var done = function(res, isRenderData){ var done = function(res, origin){
that.setColsWidth(); that.setColsWidth();
typeof options.done === 'function' && options.done( typeof options.done === 'function' && options.done(
res, curr, res[response.countName], isRenderData res, curr, res[response.countName], origin
); );
}; };
@ -964,7 +964,7 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
curr: curr, curr: curr,
count: res[response.countName], count: res[response.countName],
type: opts.type, type: opts.type,
}), sort(), done(res, true); }), sort(), done(res, 'renderData');
} else if(options.url){ // Ajax请求 } else if(options.url){ // Ajax请求
var params = {}; var params = {};
// 当 page 开启，默认自动传递 page、limit 参数 // 当 page 开启，默认自动传递 page、limit 参数
@ -1470,9 +1470,9 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
// 同步全选按钮状态 // 同步全选按钮状态
Class.prototype.syncCheckAll = function(){ Class.prototype.syncCheckAll = function(){
var that = this var that = this;
var options = that.config var options = that.config;
var checkAllElem = that.layHeader.find('input[name="layTableCheckbox"]') var checkAllElem = that.layHeader.find('input[name="layTableCheckbox"]');
var syncColsCheck = function(checked){ var syncColsCheck = function(checked){
that.eachCols(function(i, item){ that.eachCols(function(i, item){
if(item.type === 'checkbox'){ if(item.type === 'checkbox'){
@ -1481,22 +1481,17 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
}); });
return checked; return checked;
}; };
var checkStatus = table.checkStatus(that.key);
if(!checkAllElem[0]) return; if(!checkAllElem[0]) return;
if(table.checkStatus(that.key).isAll){ // 选中状态
if(!checkAllElem[0].checked){ syncColsCheck(checkStatus.isAll);
checkAllElem.prop('checked', true); checkAllElem.prop({
that.renderForm('checkbox'); checked: checkStatus.isAll,
} indeterminate: !checkStatus.isAll && checkStatus.data.length // 半选
syncColsCheck(true); });
} else { form.render(checkAllElem);
if(checkAllElem[0].checked){
checkAllElem.prop('checked', false);
that.renderForm('checkbox');
}
syncColsCheck(false);
}
}; };
// 标记当前活动行背景色 // 标记当前活动行背景色
@ -1505,7 +1500,8 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
var options = that.config; var options = that.config;
var tr = that.layBody.find('tr[data-index="'+ index +'"]'); var tr = that.layBody.find('tr[data-index="'+ index +'"]');
className = className || 'layui-table-click'; className = className || 'layui-table-click';
tr.addClass(className).siblings('tr').removeClass(className); tr.addClass(className)
.siblings('tr').removeClass(className);
}; };
// 设置行选中状态 // 设置行选中状态
@ -1532,7 +1528,7 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
// 设置数据选中属性 // 设置数据选中属性
layui.each(thisData, function(i, item){ layui.each(thisData, function(i, item){
if(layui.type(item) === 'array') return; // 空项 if(layui.type(item) === 'array') return; // 空项
if(opts.index === i || opts.index === 'all'){ if(Number(opts.index) === i || opts.index === 'all'){
var checked = item[options.checkName] = getChecked(item[options.checkName]); var checked = item[options.checkName] = getChecked(item[options.checkName]);
tr[checked ? 'addClass' : 'removeClass'](ELEM_CHECKED); // 标记当前选中行背景色 tr[checked ? 'addClass' : 'removeClass'](ELEM_CHECKED); // 标记当前选中行背景色
// 若为 radio 类型，则取消其他行选中背景色 // 若为 radio 类型，则取消其他行选中背景色
@ -2645,15 +2641,15 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
// 获取表格选中状态 // 获取表格选中状态
table.checkStatus = function(id){ table.checkStatus = function(id){
var nums = 0 var nums = 0;
,invalidNum = 0 var invalidNum = 0;
,arr = [] var arr = [];
,data = table.cache[id] || []; var data = table.cache[id] || [];
//计算全选个数 //计算全选个数
layui.each(data, function(i, item){ layui.each(data, function(i, item){
if(layui.type(item) === 'array'){ if(layui.type(item) === 'array'){
invalidNum++; //无效数据，或已删除的 invalidNum++; // 无效数据，或已删除的
return; return;
} }
if(item[table.config.checkName]){ if(item[table.config.checkName]){
@ -2664,8 +2660,8 @@ layui.define(['lay', 'laytpl', 'laypage', 'form', 'util'], function(exports){
} }
}); });
return { return {
data: arr //选中的数据 data: arr, // 选中的数据
,isAll: data.length ? (nums === (data.length - invalidNum)) : false //是否全选 isAll: data.length ? (nums === (data.length - invalidNum)) : false // 是否全选
}; };
}; };