<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>用户列表</title>
<%@include file="../../include/resource_header.html" %>
<link rel="stylesheet" type="text/css" href="/static/js/plugins/easyui/easyui.css">
<style>
.datagrid-header-row, .datagrid-row {
height: 34px;
}
.panel-header, .panel-body {
border-color: #ddd;
}
</style>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
<!-- 品牌列表展示 -->
<div class="row">
<div class="col-sm-3">
<div class="ibox float-e-margins">
<!-- S 列表头部信息 -->
<div class="ibox-title">
<h5>角色列表</h5>
<div class="ibox-tools">
<a class="collapse-link">
<i class="fa fa-chevron-up"></i>
</a>
</div>
</div>
<!--E 列表头部信息 -->
<!-- 品牌数据列表开始 -->
<div class="ibox-content J_iboxContent">
<div class="table-responsive">
<table id="dg" class="easyui-treegrid" style="width:100%;height:660px"
data-options="
animate: true,
fitColumns: true,
url: '/authority/role/roleList.do',
method: 'get',
idField: 'id',
treeField: 'name',
onClickRow: function (row){showUser(row)}">
<thead>
<tr>
<th field="name" width="150" align="left">角色名</th>
</tr>
</thead>
</table>
</div>
</div>
<!-- 品牌数据列表结束 -->
</div>
</div>
<div class="col-sm-9">
<div class="ibox float-e-margins">
<!-- S 列表头部信息 -->
<div class="ibox-title">
<h5>用户列表</h5>
<div class="ibox-tools">
<a class="collapse-link">
<i class="fa fa-chevron-up"></i>
</a>
</div>
<form class="form-horizontal" id="queryForm">
<div class="ibox-content">
<div class="row">
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
<div class="form-group">
<label class="control-label col-sm-4">手机号</label>
<div class="col-sm-8">
<input class="form-control input-sm" id="mobile"/>
</div>
</div>
</div>
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
<div class="form-group">
<label class="control-label col-sm-4">锁定状态</label>
<div class="col-sm-8">
<select class="form-control input-sm" id="isLocked">
<option value="">全部</option>
<option value="Y">锁定</option>
<option value="N">未锁定</option>
</select>
</div>
</div>
</div>
<div class="text-right">
<a class="btn btn-primary" type="button" id="addSysUserView"><i class="fa fa-plus"></i> 添加</a>
<a class="btn btn-primary" id="searchUser">搜索</a>
<a class="btn btn-white" type="reset" onclick="reset()">重置</a>
</div>
</div>
</div>
</form>
</div>
<!--E 列表头部信息 -->
<!-- 品牌数据列表开始 -->
<div class="ibox-content J_iboxContent">
<div class="table-responsive" id="userContainer">
<table id="userList" class="easyui-datagrid" style="width:99%;height:620px"
pagination="true" >
<thead frozen="true">
<tr>
<th field="userName" width="150" align="center">用户名</th>
<th field="name" width="150" align="center">对应员工</th>
<th field="phone" width="150" align="center">手机号</th>
<th field="role" width="150" align="center">角色</th>
<th field="updTime" width="150" align="center" formatter="forDateForLong">更新时间</th>
<th field="isEnable" width="150" align="center" formatter="isLockedformarter" >锁定状态</th>
<th field="id" width="180" align="center" formatter="formatEdit">管理</th>
</tr>
</thead>
</table>
</div>
<div class="table-noData" id="userNodata">
<img class="img-noData" src="/static/images/noData.png">
<p class="info-noData">暂无数据</p>
</div>
</div>
<!-- 品牌数据列表结束 -->
</div>
</div>
</div>
<!-- 品牌列表展示结束 -->
</div>
<%@ include file="../../include/resource_footer.html" %>
<script src="/static/js/plugins/jqueryForm/jquery.form.min.js"></script>
<script src="/static/js/plugins/jqueryValidate/jquery.validate.min.js"></script>
<script src="/static/js/plugins/jqueryValidate/localization/messages_zh.js"></script>
<script src="/static/js/plugins/easyui/jquery.easyui.min.js"></script>
<script src="/static/js/plugins/easyui/easyui-lang-zh_CN.js"></script>
<script type="text/javascript" src="/static/js/plugins/easyui/jquery.easyui.min.ljy.js"></script>
<script>
var roleId='';
//初始化页面时加载列表数据.
//绑定用户搜索按钮
$('#searchUser').bind('click',function() {
searchUser();
});
var layerIndex;
//绑定添加用户按钮
$('#addSysUserView').bind('click', function() {
addSysUserView();
});
var format = function(time, format){
var t = new Date(time);
var tf = function(i){return (i < 10 ? '0' : '') + i};
return format.replace(/yyyy|MM|dd|HH|mm|ss/g, function(a){
switch(a){
case 'yyyy':
return tf(t.getFullYear());
break;
case 'MM':
return tf(t.getMonth() + 1);
break;
case 'mm':
return tf(t.getMinutes());
break;
case 'dd':
return tf(t.getDate());
break;
case 'HH':
return tf(t.getHours());
break;
case 'ss':
return tf(t.getSeconds());
break;
}
})
};
function forDateForLong(val,rows) {
if (rows.updateTime) {
return format(rows.updateTime,"yyyy-MM-dd HH:mm:ss");
}else{
return format(val,"yyyy-MM-dd HH:mm:ss");
}
};
function forUser(val,rows) {
if (rows.updateUser) {
return rows.updateUser;
}else{
return val;
}
};
function loadsfd(){
$("#userList").datagrid("reload");
}
function isLockedformarter(value,rowData,rowIndex) {
if (rowData["isEnable"] == "Y")
return "已锁定";
else if(rowData["isEnable"] == "N"){
return "未锁定";
}
}
function showUser(row){
roleId = row.id;
searchUser()
};
function searchUser() {
$('#userList').datagrid({
singleSelect:true,
url:'/authority/user/userListVo',
queryParams : {
roleId:roleId,
mobile:$("#mobile").val(),
isLocked:$("#isLocked").val(),
},
onLoadSuccess:function(data) {
if (data.total == 0) {
$('#userContainer').hide();
$('#userNodata').show();
}else {
$('#userContainer').show();
$('#userNodata').hide();
$("#userList").datagrid('resize');
}
}
});
}
function formatEdit(val, row){
var str = "" ;
str += '<a href="javascript:updateSysUserView(' + row.id + ');" >修改</a> ';
str += '<a href="javascript:delSysUser(' + row.id + ');" >删除</a> ';
if(row.isEnable == 'Y'){
str += '<a href="javascript:userUnIsLocked('+row.id+');">解锁</a> ';
}else if(row.isEnable == 'N'){
str += '<a href="javascript:userIsLocked('+row.id+');" >锁定</a> ';
}
str += '<a href="javascript:reSetSysUserPwd('+row.id+');" >重置密码</a>';
return str ;
}
function addSysUserView() {
layerIndex = top.layer.open({
type: 2,
title:'新增用户',
skin: 'layui-layer-rim', //加上边框
area: ['500px','600px'] ,//宽高
content: '/authority/userAddView',
success: function(layero, index){
var childDom = top.layer.getChildFrame("body", index);
childDom.find("#parentIframeName").val(window.frameElement.name);
}
});
}
function updateSysUserView(id) {
layerIndex = top.layer.open({
type: 2,
title:'修改用户',
skin: 'layui-layer-rim', //加上边框
area: ['600px','700px'] ,//宽高
content: '/authority/userEditView?id='+id,
success: function(layero, index){
var childDom = top.layer.getChildFrame("body", index);
childDom.find("#parentIframeName").val(window.frameElement.name);
}
});
}
function delSysUser(id) {
parent.layer.confirm('确定要删除吗？', function(index){
ajaxRequest("/authority/user/deleteUser", {id:id}, function(data) {
if(data.status) {
parent.layer.alert('操作成功');
$('#userList').datagrid('reload');
}else{
parent.layer.alert(data.msg);
$('#userList').datagrid('reload');
}
});
parent.layer.close(index);
});
}
function reSetSysUserPwd(id){
parent.layer.confirm('确定要重置密码吗？', function(index){
ajaxRequest("/authority/user/userResetPwd", {id:id}, function(data) {
if(data.status) {
parent.layer.alert('操作成功');
}else{
parent.layer.alert(data.msg);
}
});
parent.layer.close(index);
});
}
function userIsLocked(id){
parent.layer.confirm('确定要锁定吗？', function(index){
ajaxRequest("/authority/user/userIsLocked", {id:id}, function(data) {
if(data.status) {
parent.layer.alert('锁定成功');
$('#userList').datagrid('reload');
}else{
parent.layer.alert(data.msg);
$('#userList').datagrid('reload');
}
});
parent.layer.close(index);
});
}
function userUnIsLocked(id){
parent.layer.confirm('确定要解锁吗？', function(index){
ajaxRequest("/authority/user/userUnIsLocked", {id:id}, function(data) {
if(data.status) {
parent.layer.alert('解锁成功');
$('#userList').datagrid('reload');
}else{
parent.layer.alert(data.msg);
$('#userList').datagrid('reload');
}
});
parent.layer.close(index);
});
}
function reset(){
$("#queryForm").form('reset');
}
</script>
</body>
</html>