var example = null;
var layer, form;
$(function () {
layui.use(['form', 'layer'], function () {
layer = layui.layer;
form = layui.form; //只有执行了这一步,部分表单元素才会自动修饰成功
// 修复1:重新配置 layer,避免对话框出现在可视区域外
layer.config({
offset: '100px', // 默认距离顶部 100px
fixed: true, // 固定定位
move: false, // 禁止拖动(可选)
zIndex: 19891014 // 设置合理的 z-index
});
});
init();
$("#searchBt").click(function () {
example.ajax.reload();
});
})
function init() {
example =
$('#dt-table').DataTable({
"searching": false,
"processing": true, //加载数据时显示进度状态
"serverSide": true,
"pagingType": "full_numbers", //首页|尾页
"language": {
"url": "../login/js/plugin/datatables/Chinese.lang"
},
"ajax": {
"url": request_url + "/realname/publicLogin/getUserList",
"type": "POST",
"headers": {
"Authorization": "Bearer " + localStorage.getItem("public_token"),
},
"data": function (d) {
d.keyWord = $("#keyWord").val();
},
"error": function (xhr, textStatus, errorThrown) {
var msg = xhr.responseText;
console.log(msg);
var response = JSON.parse(msg);
var code = response.code;
var message = response.message;
if (code == 400) {
layer.msg(message);
} else if (code == 401) {
localStorage.removeItem("public_token");
layer.msg("token过期,请先登录", {shift: -1, time: 1000}, function () {
top.location.href = window.location.origin + contentPath + '/login.html';
});
} else if (code == 403) {
console.log("未授权:" + message);
layer.msg('未授权');
} else if (code == 500) {
console.log('系统错误:' + message);
}
}
},
"lengthMenu": [[10, 20, 50], [10, 20, 50]], // 设置每页显示数据量选项
"drawCallback": function () {
// alert( '表格重绘了' );
var thisDataTable = $('#dt-table').DataTable();
$(".pagination").append("
" +
"到 页" +
"确认");
//点击按钮跳转指定页数
$('#dataTable-btn').click(function (e) {
if ($("#changePage").val() && $("#changePage").val() > 0) {
var redirectpage = $("#changePage").val() - 1;
} else {
var redirectpage = 0;
}
thisDataTable.page(redirectpage).draw('page');
});
//敲击回车键跳转指定页数
$("#changePage").keypress(function (e) {
if (event.keyCode == 13) {
if ($("#changePage").val() && $("#changePage").val() > 0) {
var redirectpage = $("#changePage").val() - 1;
} else {
var redirectpage = 0;
}
thisDataTable.page(redirectpage).draw('page');
}
});
},
"dom": "<'dt-toolbar'r>t<'dt-toolbar-footer'<'col-sm-4 col-xs-4 hidden-xs'i><'col-xs-8 col-sm-8' p v>><'dt-table-length'l>",
"columns": [
{
width: '40px',
"orderable": false,
data: function (row, type, set, meta) {
var c = meta.settings._iDisplayStart + meta.row + 1;
return c;
}
},
{"data": "userName", "defaultContent": ""},
{"data": "loginName", "defaultContent": ""},
{
"data": "", "defaultContent": "", "render": function (data, type, row) {
var dataType = row['dataType'];
// 如果 data 是空或 undefined,返回空
if (!dataType) return '';
// 定义映射关系
const labelMap = {
'1': '承载力后台',
'2': '承载力大屏',
'3': '领导履职',
'4': '自有人员',
'5': '自有人员大屏'
};
// 分割字符串为数组,去空格并过滤无效值
const types = String(dataType).split(',').map(item => item.trim()).filter(item => item in labelMap);
// 转换为对应的中文标签
const labels = types.map(type => `${labelMap[type]}`);
// 用空格、逗号或其他方式拼接(这里用空格)
return labels.join(', ');
}
},
{"data": "userPhone", "defaultContent": ""},
{"data": "idCard", "defaultContent": ""},
{"data": "createTime", "defaultContent": ""},
{"data": "updateTime", "defaultContent": ""},
{
"data": "",
"defaultContent": "",
"orderable": false,
"render": function (data, type, row) {
var id = row['id'];
var html = '';
html += buttonEdits(id,);
html += buttonDel(id);
return html;
}
},
],
"order": [[1, "desc"], [2, "desc"], [3, "desc"], [4, "desc"], [5, "desc"], [6, "desc"]] //在栏目列上显示排序功能
});
}
/**
* 新增页面
* */
function insertTeamManager() {
var height = '35%';
var width = '75%';
var index = layer.open({
title: '新增',
type: 2,
content: 'userForm.html',
area: [width, height],
maxmin: false,
btn: ['确定', '关闭'],
offset: '80px', // 固定偏移量,避免太靠下
fixed: true, // 固定定位
scrollbar: false, // 不锁定滚动条
success: function (layero, index) {
var myIframe = window[layero.find('iframe')[0]['name']];
},
yes: function (index, layero) {
// 获取弹出层中的form表单元素
var formSubmit = layer.getChildFrame('form', index);
var submited = formSubmit.find('button')[0];
// 触发点击事件,会对表单进行验证,验证成功则提交表单,失败则返回错误信息
submited.click();
},
btn2: function (index, layero) {
}
});
}
/**
* 删除班组
* */
function del(id) {
var data = {"id": id};
layer.confirm("确定删除吗?", {
title: '删除确认',
btn: ['确定', '取消'],
// 关键:固定位置在屏幕中央
offset: '200px', // 距离顶部的固定偏移
fixed: true, // 固定定位
scrollbar: false, // 不锁定滚动条
// 或者使用百分比
// offset: '30%',
// 或者自动计算
// offset: 'auto',
// 或者限制在可视区域内
success: function (layero) {
// 对话框创建后的回调,确保在可视区域内
var $layer = $(layero);
var top = $layer.css('top');
var topNum = parseInt(top);
// 如果 top 值太大,调整到合理位置
if (topNum > 500) {
$layer.css('top', '100px');
}
// 确保对话框可见
$layer.css({
'display': 'block',
'visibility': 'visible'
});
}
}, function (index) {
layer.close(index);
$.ajax({
type: 'post',
contentType: "application/json; charset=utf-8",
url: request_url + '/realname/publicLogin/delUserData',
data: JSON.stringify(data),
dataType: 'json',
success: function (data) {
if (data.code == 200) {
layer.alert('删除成功', {icon: 1});
example.ajax.reload(null, false); // 刷新页面
} else {
layer.msg("删除失败", {icon: 2});
example.ajax.reload(null, false); // 刷新页面
}
}
})
})
}
// 删除按钮
function buttonDel(id) {
var btn = $("");
return btn.prop("outerHTML");
}
// 编辑按钮
function buttonEdits(id) {
var btn = $("");
return btn.prop("outerHTML");
}
/**
* 编辑页面
*/
function edit(id) {
$.ajax({
type: 'POST',
contentType: "application/x-www-form-urlencoded",
url: ctxPath + '/TeamManager/getTeamById',
data: {"id": id},
dataType: 'json',
success: function (data) {
var height = '35%';
var width = '75%';
var index = layer.open({
title: ['修改', 'color:#3B70A1;background-color:#E8ECEB;font-size:20px'],
type: 2,
content: 'userForm.html',
area: [width, height],
maxmin: false,
offset: '80px', // 固定偏移量,避免太靠下
fixed: true, // 固定定位
scrollbar: false, // 不锁定滚动条
btn: ['确定', '关闭'],
success: function (layero, index) {
var myIframe = window[layero.find('iframe')[0]['name']];
var fnc = myIframe.setData(data); //aaa()为子页面的方法
},
yes: function (index, layero) {
// 获取弹出层中的form表单元素
var formSubmit = layer.getChildFrame('form', index);
var submited = formSubmit.find('button')[0];
// 触发点击事件,会对表单进行验证,验证成功则提交表单,失败则返回错误信息
submited.click();
},
btn2: function (index, layero) {
}
});
}
})
}