<link rel="stylesheet" th:href="@{bootstrap/css/bootstrap.min.css}" href="/static/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" th:href="@{bootstraptable/bootstrap-table.css}" href="/static/bootstraptable/bootstrap-table.css">
<link rel="stylesheet" th:href="@{css/userManage.css}" href="/static/css/userManage.css"/>
<div class="main-table">
<div class="main-title h3" style="padding-bottom: 12px;">
<span>后台用户管理</span>
</div>
<table id="user-table"></table>
</div>
<script th:src="@{js/lib/jquery-2.2.3.min.js}" src="/static/js/lib/jquery-2.2.3.min.js"></script>
<script th:src='@{js/lib/layer/layer.js}'></script>
<script th:src="@{bootstrap/js/bootstrap.js}" src="/static/bootstrap/js/bootstrap.js"></script>
<script th:src="@{bootstraptable/bootstrap-table.js}" src="/static/bootstraptable/bootstrap-table.js"></script>
<script th:src="@{bootstraptable/bootstrap-table-zh-CN.js}"
src="/static/bootstraptable/bootstrap-table-zh-CN.js"></script>
<script th:src="@{js/userManage.js}" src="/static/js/userManage.js"></script>
$(function () {
userTable.initTable();
})
var userTable = {
initTable: function () {
var self = this;
var $table = $("#user-table");
$table.width($table.parent().width() - 2);
var mainColumns = [
[
{
field: "userCode",
title: "用户编码",
valign: "middle",
align: "center",
sortable: true,
colspan: 1,
rowspan: 1
}, {
field: "userName",
title: "用户名",
valign: "middle",
align: "center",
colspan: 1,
rowspan: 1
}, {
field: "password",
title: "用户密码",
valign: "middle",
align: "center",
colspan: 1,
rowspan: 1
}, {
field: "cellphone",
title: "手机号",
valign: "middle",
align: "center",
colspan: 1,
rowspan: 1
}, {
field: "department",
title: "单位名称",
valign: "middle",
align: "center",
sortable: true,
colspan: 1,
rowspan: 1
}, {
field: "province",
title: "省份",
valign: "middle",
align: "center",
colspan: 1,
rowspan: 1
}, {
field: "city",
title: "城市",
valign: "middle",
align: "center",
colspan: 1,
rowspan: 1
}, {
field: "createDate",
title: "创建时间",
valign: "middle",
align: "center",
sortable: true,
colspan: 1,
rowspan: 1
}, {
field: "loginDate",
title: "最近登录时间",
valign: "middle",
align: "center",
sortable: true,
colspan: 1,
rowspan: 1
}, {
field: "loginTimes",
title: "登录次数",
valign: "middle",
align: "center",
sortable: true,
colspan: 1,
rowspan: 1
}, {
field: "userState",
title: "用户状态",
valign: "middle",
align: "center",
formatter: function (value, row, index) {
var isManager = row.isManager;
var us = row.userState;
if (isManager === 1){
return [
"<button type='button' class='TaskTableEditor btn btn-xs' disabled='false';>已激活</button> ",
].join("");
}else {
if (us === 1) {
return [
"<button type='button' class='TaskTableEditor btn btn-success btn-xs'>已激活</button> ",
].join("");
} else {
return [
"<button type='button' class='TaskTableEditor btn btn-danger btn-xs'>未激活</button> ",
].join("");
}
}
},
events: self.changeUserState,
colspan: 1,
rowspan: 1
},
// {
// field: 'operation',
// align: 'center',
// title: '操作',
// formatter: self._tableOperation,
// // events: self._tableOperationEvents,
// colspan: 1,
// rowspan: 1
// }
]
];
$table.bootstrapTable('destroy').bootstrapTable({
url: "userManage/getUserData",
striped: true,
// toolbar: '#selectDate',
// toolbarAlign: 'right',
columns: mainColumns,
singleselect: true, //单选
pagination: true,
pageSize: 10,
pageList: [5, 10, 20, 50],
// showRefresh: true,
data: []
});
},
changeUserState: {
/*改变用户状态*/
"click .TaskTableEditor": function (e, value, row, index) {
var self = this;
var userState = row.userState;
var params = {
userID: row.userCode,
}
if (userState === 1) {
params.state = 0;
} else {
params.state = 1;
}
$.get("userManage/changeUserState", params, function (data) {
if (data === 1) {
layer.msg("修改成功");
window.location.reload();
} else {
layer.msg("修改失败");
}
})
}
},
}
@ResponseBody
@RequestMapping("/getUserData")
public List<Map<String,Object>> getUserData(){
String sql = "SELECT * FROM INFO_USER";
List<Map<String, Object>> maps = jdbcTemplateSec.queryForList(sql);
//处理数据
return maps ;
}
image.png
