410 lines
16 KiB
JavaScript
410 lines
16 KiB
JavaScript
layui.define(['http', 'layer', 'laydate', 'util', 'auth'], function (exports) {
|
||
var $ = layui.$
|
||
, table = layui.table
|
||
, form = layui.form
|
||
, layer = layui.layer
|
||
, laydate = layui.laydate
|
||
, util = layui.util
|
||
, http = layui.http
|
||
, laytpl = layui.laytpl; var auth = layui.auth;
|
||
|
||
// 使用登录时后端返回的真实权限（已存入 layui.data），并以当前控制器解析裸动作 token
|
||
var _savedPerms = (layui.data('backend').permission) || [];
|
||
auth.init(_savedPerms);
|
||
auth.setController('admin');
|
||
var dataTable = table.render({
|
||
elem: '#dataTable'
|
||
, url: "index" // 后端数据接口
|
||
, page: true
|
||
, limit: 15
|
||
//, toolbar: '#tableBar'
|
||
// , defaultToolbar: auth.renderToolbar(tableActions)
|
||
, cols: [[
|
||
{ type: 'checkbox', fixed: 'left' }
|
||
, { field: 'id', title: 'ID', width: 72, align: 'center', sort: true, fixed: 'left' }
|
||
, { field: 'account', title: '账户', width: 120, align: 'center', fixed: 'left' }
|
||
, { field: 'nickname', title: '昵称', width: 100, align: 'center' }
|
||
// , { field: 'role_id', title: '角色', width: 100, align: 'center', templet: '#roleTpl' }
|
||
, { field: 'email', title: '邮箱', minWidth: 180, align: 'center' }
|
||
, { field: 'mobile', title: '手机', width: 120, align: 'center' }
|
||
, { field: 'login_info', title: '登录信息', width: 160, align: 'center', templet: '#loginInfoTpl' }
|
||
, { field: 'status', title: '状态', width: 90, align: 'center', templet: '#statusTpl', unresize: true }
|
||
, { field: 'create_at', title: '创建时间', width: 160, align: 'center', sort: true }
|
||
, { title: '操作', width: 120, align: 'left', toolbar: '#dataBar', fixed: 'right', unresize: true }
|
||
]],
|
||
done: function (res, curr, count) {
|
||
// 行内按钮按真实权限显隐（data-perm 为完整权限 key，如 admin:edit）
|
||
$('#dataTable').next('.layui-table-view').find('[data-perm]').each(function () {
|
||
var perm = $(this).attr('data-perm');
|
||
if (perm && !auth.has(perm)) {
|
||
$(this).remove();
|
||
}
|
||
});
|
||
}
|
||
});
|
||
|
||
// 搜索
|
||
form.on('submit(searchBtn)', function (data) {
|
||
adminTable.reload({
|
||
where: data.field,
|
||
page: { curr: 1 }
|
||
});
|
||
return false;
|
||
});
|
||
|
||
// 状态开关
|
||
form.on('switch(statusSwitch)', function (obj) {
|
||
var id = this.value;
|
||
var status = obj.elem.checked ? 1 : 0;
|
||
layer.confirm('确定要' + (status ? '启用' : '禁用') + '该管理员账号吗？', function (index) {
|
||
layui.request.post('update', { id: id, status: status }
|
||
).then(function (res) {
|
||
if (res.code === 0) {
|
||
layer.msg(res.msg, { icon: 1 });
|
||
table.reload('dataTable', {}, true);
|
||
} else {
|
||
layer.msg(res.msg, { icon: 2 });
|
||
obj.elem.checked = !obj.elem.checked;
|
||
form.render('checkbox');
|
||
}
|
||
});
|
||
layer.close(index);
|
||
}, function () {
|
||
obj.elem.checked = !obj.elem.checked;
|
||
form.render('checkbox');
|
||
});
|
||
});
|
||
|
||
table.on('toolbar(dataTable)', function (elem) {
|
||
switch (elem.event) {
|
||
case 'dataCreate':
|
||
active.dataCreate({ pid: 0, type: 1 });
|
||
break;
|
||
case 'dataDelete':
|
||
var checkStatus = table.checkStatus('dataTable'), checkData = checkStatus.data;
|
||
let ids = checkData.map((item, index, array) => { return item.id; });
|
||
active.dataDelete(ids);
|
||
break;
|
||
case 'dataRecybin':
|
||
active.dataRecybin();
|
||
break;
|
||
};
|
||
});
|
||
table.on('tool(dataTable)', function (elem) {
|
||
var data = elem.data;
|
||
switch (elem.event) {
|
||
case 'update':
|
||
active.dataEdit(data);
|
||
break;
|
||
case 'delete':
|
||
active.dataDelete([data.id]);
|
||
break;
|
||
}
|
||
});
|
||
|
||
var dataFromFun = function (data, callback, done) {
|
||
var title = data ? '编辑数据[' + data.account + ']' : '添加数据';
|
||
var formHtml = laytpl($('#dataFormTpl').html()).render(data || {});
|
||
layer.open({
|
||
title: data.id ? '编辑菜单' : (data.pid ? '添加子菜单' : '添加根菜单'),
|
||
content: formHtml,
|
||
anim: "slideLeft",
|
||
offset: "r",
|
||
btnAlign: "l",
|
||
area: ['50% ', '99%'],
|
||
shade: 0.1,
|
||
shadeClose: true,
|
||
btn: ['确定', '取消'],
|
||
success: function (layero, index) {
|
||
callback(layero, index);
|
||
form.render();
|
||
},
|
||
yes: function (index, layero) {
|
||
window.layui.form.on('submit(wxapp-form-submit)', function (elem) {
|
||
done(layero, index, elem);
|
||
layui.off('submit(wxapp-form)', 'from');
|
||
return false;
|
||
});
|
||
layero.contents().find("#wxapp-form-submit").trigger('click');
|
||
}
|
||
});
|
||
};
|
||
//事件
|
||
var active = {
|
||
dataDelete: function (ids, force = 0) {
|
||
if (ids.length === 0) {
|
||
return layer.msg('请选择数据');
|
||
}
|
||
layer.prompt({
|
||
formType: 1
|
||
, title: '敏感操作，请验证口令'
|
||
}, function (value, index) {
|
||
layer.close(index);
|
||
layer.confirm('确定删除吗？', function (index) {
|
||
http.delete('delete', { ids: ids.join(','), force: force })
|
||
.then((res) => {
|
||
if (res.code === 0) {
|
||
layer.close(index);
|
||
table.reload('dataTable', {}, true);
|
||
} else {
|
||
layer.msg(res.msg || '操作失败');
|
||
}
|
||
});
|
||
});
|
||
});
|
||
},
|
||
dataCreate: function (data = {}) {
|
||
dataFromFun(data,
|
||
function (layero, index) { },
|
||
function (layero, index, elem) {
|
||
var field = elem.field;
|
||
field.icon = 'layui-icon ' + field.icon;
|
||
field.status = field.status ? 1 : 0;
|
||
http.post('create', field)
|
||
.then((res) => {
|
||
if (res.code === 0) {
|
||
layer.close(index);
|
||
table.reload('dataTable', {}, true);
|
||
} else {
|
||
layer.msg(res.msg || '操作失败');
|
||
}
|
||
});
|
||
}
|
||
);
|
||
},
|
||
dataEdit: function (data = {}) {
|
||
dataFromFun(data,
|
||
function (layero, index) { },
|
||
function (layero, index, elem) {
|
||
var field = elem.field;
|
||
field.icon = 'layui-icon ' + field.icon;
|
||
field.status = field.status ? 1 : 0;
|
||
http.put('update', field)
|
||
.then((res) => {
|
||
if (res.code === 0) {
|
||
layer.close(index);
|
||
table.reload('dataTable', {}, true);
|
||
} else {
|
||
layer.msg(res.msg || '操作失败');
|
||
}
|
||
});
|
||
}
|
||
);
|
||
},
|
||
dataRecybin: function (data = {}) {
|
||
var formHtml = laytpl($('#dataRecybinTpl').html()).render(data || {});
|
||
layer.open({
|
||
title: '资源回收站',
|
||
content: formHtml,
|
||
anim: "slideLeft",
|
||
offset: "r",
|
||
area: ['50%', '99%'],
|
||
shade: 0.1,
|
||
shadeClose: true,
|
||
success: function (layero, index) {
|
||
layui.table.render({
|
||
elem: '#dataRecybinTable',
|
||
url: "recyclebin",
|
||
height: 'full-100',
|
||
defaultToolbar: [{
|
||
title: '批量删除数据',
|
||
layEvent: 'dataDelete',
|
||
icon: 'layui-icon-delete',
|
||
onClick: function (obj) {
|
||
var checkStatus = table.checkStatus('dataRecybinTable'), checkData = checkStatus.data;
|
||
let ids = checkData.map((item, index, array) => { return item.id; });
|
||
console.log(ids);
|
||
}
|
||
}, 'filter', 'exports', 'print'],
|
||
cols: [[
|
||
{ type: 'checkbox', fixed: 'left' },
|
||
{ field: 'id', title: 'ID', width: 80, sort: true, fixed: 'left' },
|
||
{ field: 'title', title: '名称', width: 180, fixed: 'left' },
|
||
{ field: 'code', title: '代码', width: 180, fixed: 'left' },
|
||
{ field: 'description', title: '描述', minWidth: 200, sort: true },
|
||
{ fixed: "right", title: "操作", width: 181, align: "center", toolbar: "#dataRecybinBarTpl" }
|
||
]],
|
||
page: true,
|
||
done: function (res, curr, count, origin) {
|
||
console.log('表格渲染完成');
|
||
}
|
||
});
|
||
}
|
||
});
|
||
},
|
||
dataRestore: function (data = {}) {
|
||
http.put("restore", { id: data.id })
|
||
.then((res) => {
|
||
if (res.code === 0) {
|
||
layer.msg('恢复成功');
|
||
table.reload('dataTable', {}, true);
|
||
} else {
|
||
layer.msg(res.msg || '恢复失败');
|
||
}
|
||
});
|
||
}
|
||
};
|
||
|
||
// 打开管理员表单
|
||
function opendataForm(data) {
|
||
var title = data ? '编辑管理员 [' + data.account + ']' : '添加管理员';
|
||
var formHtml = laytpl($('#dataFormTpl').html()).render(data || {});
|
||
|
||
layer.open({
|
||
type: 1,
|
||
title: title,
|
||
area: ['500px', '520px'],
|
||
shadeClose: true,
|
||
content: formHtml,
|
||
success: function (layero, index) {
|
||
// 显示/隐藏密码字段
|
||
if (data) {
|
||
$('#passwordGroup').hide();
|
||
} else {
|
||
$('#passwordGroup').show();
|
||
}
|
||
|
||
// 表单验证规则
|
||
layui.form.verify({
|
||
username: function (value) {
|
||
if (!/^[\w\u4e00-\u9fa5]{2,20}$/.test(value)) {
|
||
return '用户名必须2-20位字符，支持中文、字母、数字和下划线';
|
||
}
|
||
},
|
||
pass: [
|
||
/^[\S]{6,20}$/
|
||
, '密码必须6到20位，且不能出现空格'
|
||
]
|
||
});
|
||
|
||
// 提交表单
|
||
form.on('submit(adminFormSubmit)', function (formData) {
|
||
var url = data ? "update" : "create";
|
||
$.ajax({
|
||
url: url,
|
||
type: 'POST',
|
||
data: formData.field,
|
||
success: function (res) {
|
||
if (res.code === 1) {
|
||
layer.msg(res.msg, { icon: 1, time: 1000 }, function () {
|
||
layer.close(index);
|
||
adminTable.reload();
|
||
});
|
||
} else {
|
||
layer.msg(res.msg, { icon: 2 });
|
||
}
|
||
},
|
||
error: function () {
|
||
layer.msg('操作失败', { icon: 2 });
|
||
}
|
||
});
|
||
|
||
return false;
|
||
});
|
||
|
||
form.render();
|
||
},
|
||
btn: ['保存', '取消'],
|
||
yes: function (index, layero) {
|
||
// 触发表单提交
|
||
layero.find('form').find('button[lay-filter=adminFormSubmit]').click();
|
||
}
|
||
});
|
||
}
|
||
|
||
// 重置密码
|
||
function resetPassword(data) {
|
||
layer.confirm('确定要重置管理员 [' + data.username + '] 的密码吗？重置后密码将变为123456', {
|
||
btn: ['确定', '取消'],
|
||
title: '重置密码'
|
||
}, function (index) {
|
||
$.ajax({
|
||
url: "resetPassword",
|
||
type: 'POST',
|
||
data: { id: data.id },
|
||
success: function (res) {
|
||
layer.close(index);
|
||
if (res.code === 1) {
|
||
layer.msg(res.msg, { icon: 1 });
|
||
} else {
|
||
layer.msg(res.msg, { icon: 2 });
|
||
}
|
||
},
|
||
error: function () {
|
||
layer.msg('操作失败', { icon: 2 });
|
||
}
|
||
});
|
||
});
|
||
}
|
||
|
||
// 删除管理员
|
||
function deleteAdmin(data) {
|
||
layer.confirm('确定要删除管理员 [' + data.username + '] 吗？此操作不可恢复！', {
|
||
btn: ['确定', '取消'],
|
||
title: '删除管理员',
|
||
icon: 3
|
||
}, function (index) {
|
||
$.ajax({
|
||
url: "delete",
|
||
type: 'POST',
|
||
data: { id: data.id },
|
||
success: function (res) {
|
||
layer.close(index);
|
||
if (res.code === 1) {
|
||
layer.msg(res.msg, { icon: 1, time: 1000 }, function () {
|
||
adminTable.reload();
|
||
});
|
||
} else {
|
||
layer.msg(res.msg, { icon: 2 });
|
||
}
|
||
},
|
||
error: function () {
|
||
layer.msg('操作失败', { icon: 2 });
|
||
}
|
||
});
|
||
});
|
||
}
|
||
|
||
// 批量删除
|
||
function batchDelete(data) {
|
||
if (data.length === 0) {
|
||
layer.msg('请先选择要删除的管理员', { icon: 3 });
|
||
return;
|
||
}
|
||
var superAdmins = data.filter(function (item) {
|
||
return item.is_super == 1;
|
||
});
|
||
if (superAdmins.length > 0) {
|
||
layer.msg('不能删除超级管理员账号', { icon: 2 });
|
||
return;
|
||
}
|
||
var ids = data.map(function (item) {
|
||
return item.id;
|
||
});
|
||
layer.confirm('确定要删除选中的 ' + data.length + ' 个管理员吗？此操作不可恢复！', {
|
||
btn: ['确定', '取消'],
|
||
title: '批量删除',
|
||
icon: 3
|
||
}, function (index) {
|
||
$.ajax({
|
||
url: "batchDelete",
|
||
type: 'POST',
|
||
data: { ids: ids },
|
||
success: function (res) {
|
||
layer.close(index);
|
||
if (res.code === 1) {
|
||
layer.msg(res.msg, { icon: 1, time: 1000 }, function () {
|
||
adminTable.reload();
|
||
});
|
||
} else {
|
||
layer.msg(res.msg, { icon: 2 });
|
||
}
|
||
},
|
||
error: function () {
|
||
layer.msg('操作失败', { icon: 2 });
|
||
}
|
||
});
|
||
});
|
||
}
|
||
exports('admin', {});
|
||
}); |