在业务中要求查询到某个数据时不展示某一列。但是发现使用$(".layui-table-box").find("[data-field='stay']").remove();无法填充整个页面。
最后使用一下方法完美解决且可保证填充后数据的居中展示。
<div class="layui-fluid">
<div class="layui-card">
<div class="layui-card-body">
<div class="layui-form toolbar">
<div class="layui-form-item" id="searchPosId"></div>
<div
class="layui-form-item"
id="toolBtnId"
style="margin-bottom: 0px"
></div>
</div>
<table
class="layui-table"
id="TrackWarnTable"
lay-filter="TrackWarnTable"
></table>
</div>
</div>
</div>
<script type="text/html" id="itemStatus">
<input type="checkbox" lay-filter="itemStatus" value="{{d.id}}"
lay-skin="switch" lay-text="是|否" {{d.status==1?'checked':''}}/>
</script>
<script type="text/html" id="itemContent">
<input type="checkbox" lay-filter="itemContent" value="{{d.id}}"
lay-skin="switch" lay-text="是|否" {{d.isContent==1?'checked':''}}/>
</script>
<style>
/*表头居中*/
.layui-table-header thead .layui-table-cell{text-align: center}
</style>
<script>
layui.use(
["syTableSet", "syCrudUtil", "syDialogUtil", "syTableSimpleSet"],
function () {
var $ = layui.jquery;
var opt1 = {
key: "TrackWarn",
tableOptions: {
url: "warn/warn/studentTrackWarn",
id: "TrackWarnTable",
fixed: "right",
idAutoSort: true,
page: false,
limit: 5000,
cols: [
[
{ type: "numbers" },
{ field: "departCode", hide: true },
{ field: "areano", hide: true },
{
field: "departName",
title: "学院 ",
minWidth:200,
align: "center",
},
{
field: "allnum",
title: "总人数",
width: "15%",
align: "center",
templet: function (data) {
return (
"<div style='cursor:pointer;color:#4f98ed;' onclick=\"showAll('" +
data.departCode +
"','" +
data.areano +
"');\">" +
data.allnum +
"</div>"
);
},
},
{
field: "stay",
title: "在校人数",
width: 0,
align: "center",
templet: function (data) {
return (
"<div style='cursor:pointer;color:#4f98ed;' onclick=\"showStay('" +
data.departCode +
"','" +
data.areano +
"');\">" +
data.stay +
"</div>"
);
},
},
{
field: "tf",
title: "24小时异常人数",
width: "15%",
align: "center",
templet: function (data) {
return (
"<div style='cursor:pointer;color:#4f98ed;' onclick=\"showTf('" +
data.departCode +
"','" +
data.areano +
"');\">" +
data.tf +
"</div>"
);
},
},
{
field: "fe",
title: "48小时异常人数",
width: "15%",
align: "center",
templet: function (data) {
return (
"<div style='cursor:pointer;color:#4f98ed;' onclick=\"showFe('" +
data.departCode +
"','" +
data.areano +
"');\">" +
data.fe +
"</div>"
);
},
},
{
field: "leaves",
title: "请假人数",
width: "15%",
align: "center",
templet: function (data) {
return (
"<div style='cursor:pointer;color:#4f98ed;' onclick=\"showLeave('" +
data.departCode +
"','" +
data.areano +
"');\">" +
data.leaves +
"</div>"
);
},
},
],
],
sort: {
field: "to_number(sortNo)",
type: "asc",
},
done: function (data) {
//根据条件隐藏相关列
if (data.data[0].areano == "1") {
$(".layui-table-box").find("[data-field='stay']").remove();
}
//填充整个页面保持居中展示
$('.layui-table').css("width", "100%");
$(".layui-table").find("[data-field]").css("text-align", "center");
$("th[data-field='delete']").css("border-right", 'none');
},
isOperate: false,
},
};
if (layui.syconf.renderMethod == "simple") {
console.log(111111111);
layui.syTableSimpleSet.initTableSet(opt1);
} else {
layui.syTableSet.initTableSet(opt1);
}
window.showAll = function (departCode, areaNo) {
layui.syDialogUtil.popupRight(
"xy-queryRole",
1000,
"business/student/track/warn/userList",
{ departCode: departCode, type: "1", areaNo: areaNo }
);
};
window.showStay = function (departCode, areaNo) {
layui.syDialogUtil.popupRight(
"xy-queryRole",
1000,
"business/student/track/warn/userList",
{ departCode: departCode, type: "2", areaNo: areaNo }
);
};
window.showTf = function (departCode, areaNo) {
layui.syDialogUtil.popupRight(
"xy-queryRole",
1000,
"business/student/track/warn/userList",
{ departCode: departCode, type: "3", areaNo: areaNo }
);
};
window.showFe = function (departCode, areaNo) {
layui.syDialogUtil.popupRight(
"xy-queryRole",
1000,
"business/student/track/warn/userList",
{ departCode: departCode, type: "4", areaNo: areaNo }
);
};
window.showLeave = function (departCode, areaNo) {
layui.syDialogUtil.popupRight(
"xy-queryRole",
1000,
"business/student/track/warn/userList",
{ departCode: departCode, type: "5", areaNo: areaNo }
);
};
}
);
</script>