mirror of https://github.com/1099438829/apeblog
304 lines
14 KiB
HTML
304 lines
14 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh">
|
|
<head>
|
|
<title>用户管理 - {:system_config('title')}后台管理系统</title>
|
|
{include file="public/header" /}
|
|
</head>
|
|
<body>
|
|
<div class="container-fluid p-t-15">
|
|
<div class="row">
|
|
<div class="col-lg-12">
|
|
<div class="card">
|
|
<div class="card-header"><h4>搜索</h4></div>
|
|
<div class="card-body">
|
|
<form class="form-inline searchForm" onsubmit="return false;">
|
|
<div class="form-group">
|
|
<label for="username">账号昵称</label>
|
|
<div class="input-group">
|
|
<div class="input-group">
|
|
<input type="text" class="form-control" id="username" value="" name="username"
|
|
placeholder="请输入账号或者昵称搜索">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="tel">电话邮箱</label>
|
|
<div class="input-group">
|
|
<div class="input-group">
|
|
<input type="text" class="form-control" id="tel" value="" name="tel"
|
|
placeholder="请输入电话或者邮箱">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="start_time">创建时间</label>
|
|
<div class="input-group">
|
|
<input class="form-control js-datetimepicker" type="text" id="start_time"
|
|
name="start_time" value="" autocomplete="off" data-side-by-side="true"
|
|
data-locale="zh-cn" data-format="YYYY-MM-DD" placeholder="开始时间">
|
|
<span class="input-group-addon">~</span>
|
|
<input class="form-control js-datetimepicker" type="text" name="end_time" value=""
|
|
autocomplete="off" data-side-by-side="true" data-locale="zh-cn"
|
|
data-format="YYYY-MM-DD" placeholder="结束时间">
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="status">状态</label>
|
|
<select name="status" id="status" class="form-control">
|
|
<option value="">所有</option>
|
|
<option value="1">启用</option>
|
|
<option value="0">禁用</option>
|
|
</select>
|
|
</div>
|
|
<button type="submit" class="btn btn-success" style="margin: -10px 0 0 10px;" id="search">搜索
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-12">
|
|
<div class="card">
|
|
<div class="card-header"><h4>用户管理</h4></div>
|
|
<div class="card-body">
|
|
<div id="toolbar" class="toolbar-btn-action">
|
|
<button id="btn_add" type="button" class="btn btn-primary m-r-5"
|
|
onclick="iframe.createIframe('添加用户','/admin/user/add')">
|
|
<span class="mdi mdi-plus" aria-hidden="true"></span>新增
|
|
</button>
|
|
<button id="btn_edit" type="button" class="btn btn-success m-r-5" onclick="isEnable('enable')">
|
|
<span class="mdi mdi-check" aria-hidden="true"></span>启用
|
|
</button>
|
|
<button id="btn_disable" type="button" class="btn btn-warning m-r-5"
|
|
onclick="isEnable('disable')">
|
|
<span class="mdi mdi-block-helper" aria-hidden="true"></span>禁用
|
|
</button>
|
|
<button id="btn_delete" type="button" class="btn btn-danger" onclick="del()">
|
|
<span class="mdi mdi-window-close" aria-hidden="true"></span>删除
|
|
</button>
|
|
</div>
|
|
<table id="tb_departments"></table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{include file="public/footer"/}
|
|
<script type="text/javascript">
|
|
$('#tb_departments').bootstrapTable({
|
|
classes: 'table table-bordered table-hover table-striped',
|
|
url: '/admin/user/lst',
|
|
method: 'post',
|
|
dataType: 'json', // 因为本示例中是跨域的调用,所以涉及到ajax都采用jsonp,
|
|
uniqueId: 'id',
|
|
idField: 'id', // 每行的唯一标识字段
|
|
toolbar: '#toolbar', // 工具按钮容器
|
|
showColumns: true, // 是否显示所有的列
|
|
showRefresh: true, // 是否显示刷新按钮
|
|
responseHandler: function (res) {
|
|
return {
|
|
"total": res.count,
|
|
"rows": res.data,
|
|
};
|
|
},
|
|
pagination: true,
|
|
queryParams: function (params) {
|
|
var temp = toArrayList($(".searchForm").serializeArray());
|
|
temp['limit'] = params.limit;
|
|
temp['page'] = (params.offset / params.limit) + 1;
|
|
return temp;
|
|
},
|
|
sidePagination: "server",
|
|
pageNumber: 1,
|
|
pageSize: 20,
|
|
pageList: [20, 50, 100],
|
|
columns: [{
|
|
checkbox: true // 是否显示复选框
|
|
}, {
|
|
field: 'id',
|
|
title: 'ID',
|
|
sortable: true // 是否排序
|
|
}, {
|
|
field: 'username',
|
|
title: '账号'
|
|
}, {
|
|
field: 'nickname',
|
|
title: '昵称',
|
|
}, {
|
|
field: 'avatar',
|
|
title: '头像',
|
|
formatter: function (value, row, index) {
|
|
return '<img src="' + value + '" style="width: 64px;"/>';
|
|
},
|
|
}, {
|
|
field: 'tel',
|
|
title: '电话'
|
|
}, {
|
|
field: 'email',
|
|
title: '邮箱'
|
|
}, {
|
|
field: 'is_admin',
|
|
title: '是否是管理员',
|
|
formatter: function (value, row, index) {
|
|
return value === 1 ? '是' : '否';
|
|
},
|
|
}, {
|
|
field: 'create_time',
|
|
title: '创建时间'
|
|
}
|
|
, {
|
|
field: 'status',
|
|
title: '状态',
|
|
formatter: function (value, row, index) {
|
|
return value === 1 ? '启用' : '冻结';
|
|
},
|
|
}, {
|
|
field: 'operate',
|
|
title: '操作',
|
|
formatter: btnGroup, // 自定义方法
|
|
events: {
|
|
'click .btn-edit': function (event, value, row, index) {
|
|
iframe.createIframe('修改用户', '/admin/user/edit?id=' + row.id)
|
|
},
|
|
'click .btn-del': function (event, value, row, index) {
|
|
$.alert({
|
|
title: '系统提示',
|
|
content: '删除提醒',
|
|
buttons: {
|
|
confirm: {
|
|
text: '确认',
|
|
btnClass: 'btn-primary',
|
|
action: function () {
|
|
$.post(url = "/admin/user/del", data = {"id": row.id}, function (res) {
|
|
if (res.status == 200) {
|
|
parent.lightyear.notify('删除成功', 'success', 3000, 'mdi mdi-emoticon-happy', 'top', 'center');
|
|
$("#tb_departments").bootstrapTable('refresh');
|
|
} else parent.lightyear.notify('删除失败', 'danger', 3000, 'mdi mdi-emoticon-happy', 'top', 'center');
|
|
});
|
|
}
|
|
},
|
|
cancel: {
|
|
text: '取消'
|
|
}
|
|
}
|
|
});
|
|
}
|
|
}
|
|
}],
|
|
|
|
onEditableSave: function (field, row, oldValue, $el) {
|
|
$.ajax({
|
|
type: "get",
|
|
url: "/admin/user/lst",
|
|
data: row,
|
|
dataType: 'jsonp',
|
|
success: function (data, status) {
|
|
if (data.code == '200') {
|
|
// 这里的状态显示有自定义样式区分，做单行的更新
|
|
$('.example-table').bootstrapTable('updateRow', {index: row.id, row: row});
|
|
} else {
|
|
alert(data.msg);
|
|
}
|
|
},
|
|
error: function () {
|
|
alert('修改失败，请稍后再试');
|
|
}
|
|
});
|
|
},
|
|
|
|
onLoadSuccess: function (data) {
|
|
$("[data-toggle='tooltip']").tooltip();
|
|
}
|
|
});
|
|
|
|
$("#search").click(function () {
|
|
$("#tb_departments").bootstrapTable('refresh', {query: {page: 1}, pageNumber: 1});
|
|
});
|
|
|
|
// 操作按钮
|
|
function btnGroup() {
|
|
let html =
|
|
'<a href="#!" class="btn btn-xs btn-default m-r-5 btn-edit" title="编辑" data-toggle="tooltip"><i class="mdi mdi-pencil"></i></a>' +
|
|
'<a href="#!" class="btn btn-xs btn-default btn-del" title="删除" data-toggle="tooltip"><i class="mdi mdi-window-close"></i></a>';
|
|
return html;
|
|
}
|
|
|
|
// 删除
|
|
function del() {
|
|
var checkID = "";
|
|
var selectedItem = $('#tb_departments').bootstrapTable('getAllSelections');
|
|
if (selectedItem == "") return lightyear.notify("没有选中项", 'danger', 3000, 'mdi mdi-emoticon-neutral', 'top', 'center');
|
|
for (var i = 0; i < selectedItem.length; i++) {
|
|
checkID += selectedItem[i]['id'] + ",";
|
|
}
|
|
if (checkID == "") return lightyear.notify("没有选中项", 'danger', 3000, 'mdi mdi-emoticon-neutral', 'top', 'center');
|
|
$.confirm({
|
|
title: '重要提醒!',
|
|
content: '选中项将全部被删除，请谨慎操作!',
|
|
backgroundDismiss: true,
|
|
buttons: {
|
|
ok: {
|
|
text: '确认',
|
|
btnClass: 'btn-danger',
|
|
action: function () {
|
|
$.post("/admin/user/del", data = {id: checkID}, function (res) {
|
|
if (res.status == 200) {
|
|
lightyear.notify(res.msg, 'success', 3000, 'mdi mdi-emoticon-happy', 'top', 'center');
|
|
location.reload();
|
|
} else lightyear.notify(res.msg, 'danger', 3000, 'mdi mdi-emoticon-neutral', 'top', 'center');
|
|
})
|
|
}
|
|
},
|
|
cancel: {
|
|
text: '取消',
|
|
btnClass: 'btn-primary'
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
// 批量启用或者禁用
|
|
function isEnable(type) {
|
|
var checkID = "";
|
|
var selectedItem = $('#tb_departments').bootstrapTable('getAllSelections');
|
|
if (selectedItem == "") return lightyear.notify("没有选中项", 'danger', 3000, 'mdi mdi-emoticon-neutral', 'top', 'center');
|
|
for (var i = 0; i < selectedItem.length; i++) {
|
|
checkID += selectedItem[i]['id'] + ",";
|
|
}
|
|
if (checkID == "") return lightyear.notify("没有选中项", 'danger', 3000, 'mdi mdi-emoticon-neutral', 'top', 'center');
|
|
$.confirm({
|
|
title: '重要提醒!',
|
|
content: type == 'enable' ? '选中项将全部启用，请谨慎操作!' : '选中项将全部禁用，请谨慎操作!',
|
|
backgroundDismiss: true,
|
|
buttons: {
|
|
ok: {
|
|
text: '确认',
|
|
btnClass: 'btn-danger',
|
|
action: function () {
|
|
if (type == 'enable') {
|
|
$.post("/admin/user/enabled", data = {id: checkID}, function (res) {
|
|
if (res.status == 200) {
|
|
lightyear.notify(res.msg, 'success', 3000, 'mdi mdi-emoticon-happy', 'top', 'center');
|
|
location.reload();
|
|
} else lightyear.notify(res.msg, 'danger', 3000, 'mdi mdi-emoticon-neutral', 'top', 'center');
|
|
|
|
})
|
|
} else {
|
|
$.post("/admin/user/disabled", data = {id: checkID}, function (res) {
|
|
if (res.status == 200) {
|
|
lightyear.notify(res.msg, 'success', 3000, 'mdi mdi-emoticon-happy', 'top', 'center');
|
|
location.reload();
|
|
} else lightyear.notify(res.msg, 'danger', 3000, 'mdi mdi-emoticon-neutral', 'top', 'center');
|
|
})
|
|
}
|
|
}
|
|
},
|
|
cancel: {
|
|
text: '取消',
|
|
btnClass: 'btn-primary'
|
|
}
|
|
}
|
|
});
|
|
}
|
|
</script>
|
|
</body>
|
|
</html> |