1 changed files with 355 additions and 0 deletions
@ -0,0 +1,355 @@ |
|||
<!DOCTYPE html> |
|||
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"> |
|||
<head> |
|||
<th:block th:include="include :: header('角色列表')" /> |
|||
<th:block th:include="include :: layout-latest-css" /> |
|||
<th:block th:include="include :: ztree-css" /> |
|||
</head> |
|||
<body class="gray-bg"> |
|||
<div class="ui-layout-west"> |
|||
<div class="box box-main"> |
|||
<div class="box-header"> |
|||
<div class="box-title"> |
|||
<i class="fa icon-grid"></i> 组织机构 |
|||
</div> |
|||
<div class="box-tools pull-right"> |
|||
<a type="button" class="btn btn-box-tool" href="#" onclick="dept()" title="管理部门"><i class="fa fa-edit"></i></a> |
|||
<button type="button" class="btn btn-box-tool" id="btnExpand" title="展开" style="display:none;"><i class="fa fa-chevron-up"></i></button> |
|||
<button type="button" class="btn btn-box-tool" id="btnCollapse" title="折叠"><i class="fa fa-chevron-down"></i></button> |
|||
<button type="button" class="btn btn-box-tool" id="btnRefresh" title="刷新部门"><i class="fa fa-refresh"></i></button> |
|||
</div> |
|||
</div> |
|||
<div class="ui-layout-content"> |
|||
<div id="tree" class="ztree"></div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="ui-layout-center"> |
|||
<div class="container-div"> |
|||
<div class="row"> |
|||
<div class="col-sm-12 search-collapse"> |
|||
<form id="user-form"> |
|||
<input type="hidden" id="deptId" name="deptId"> |
|||
<input type="hidden" id="parentId" name="parentId"> |
|||
<div class="select-list"> |
|||
<ul> |
|||
<li> |
|||
角色名称:<input type="text" name="roleName" placeholder="请输入角色名称"/> |
|||
</li> |
|||
<!--<li> |
|||
权限字符:<input type="text" name="roleKey"/> |
|||
</li>--> |
|||
<li> |
|||
角色状态:<select name="status" th:with="type=${@dict.getType('sys_normal_disable')}"> |
|||
<option value="">所有</option> |
|||
<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option> |
|||
</select> |
|||
</li> |
|||
<li class="select-time"> |
|||
<label>创建时间: </label> |
|||
<input type="text" class="time-input" id="startTime" placeholder="开始时间" name="params[beginTime]"/> |
|||
<span>-</span> |
|||
<input type="text" class="time-input" id="endTime" placeholder="结束时间" name="params[endTime]"/> |
|||
</li> |
|||
<li> |
|||
<a class="btn btn-success btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i> 搜索</a> |
|||
<a class="btn btn-reset btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i> 重置</a> |
|||
</li> |
|||
</ul> |
|||
</div> |
|||
</form> |
|||
</div> |
|||
|
|||
<div class="btn-group-sm" id="toolbar" role="group"> |
|||
<a class="btn btn-success" onclick="$.operate.add(100,1071,617)" shiro:hasPermission="system:user:add"> |
|||
<i class="fa fa-plus"></i> 新增 |
|||
</a> |
|||
<!--<a class="btn btn-primary single disabled" onclick="$.operate.edit(null,1071,617)" shiro:hasPermission="system:user:edit"> |
|||
<i class="fa fa-edit"></i> 修改 |
|||
</a>--> |
|||
<a class="btn btn-danger multiple disabled" onclick="$.operate.removeAll()" shiro:hasPermission="system:user:remove"> |
|||
<i class="fa fa-remove"></i> 全部删除 |
|||
</a> |
|||
<!--<a class="btn btn-info" onclick="$.table.importExcel()" shiro:hasPermission="system:user:import">--> |
|||
<!--<i class="fa fa-download"></i> 导入--> |
|||
<!--</a>--> |
|||
<!--<a class="btn btn-warning" onclick="$.table.exportExcel()" shiro:hasPermission="system:user:export">--> |
|||
<!--<i class="fa fa-upload"></i> 导出--> |
|||
<!--</a>--> |
|||
</div> |
|||
|
|||
<div class="col-sm-12 select-table table-bordered"> |
|||
<table id="bootstrap-table"></table> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<th:block th:include="include :: footer" /> |
|||
<th:block th:include="include :: layout-latest-js" /> |
|||
<th:block th:include="include :: ztree-js" /> |
|||
<script th:src="@{/project/support/js/viewUtils.js}"></script> |
|||
<script th:inline="javascript"> |
|||
var editFlag = [[${@permission.hasPermi('system:role:edit')}]]; |
|||
var removeFlag = [[${@permission.hasPermi('system:role:remove')}]]; |
|||
var dictionaryFlag = [[${@permission.hasPermi('system:role:dictionary')}]]; |
|||
var prefix = ctx + "system/user"; |
|||
|
|||
$(function() { |
|||
var panehHidden = false; |
|||
if ($(this).width() < 769) { |
|||
panehHidden = true; |
|||
} |
|||
$('body').layout( |
|||
{ |
|||
initClosed: panehHidden, |
|||
west__size: 185, |
|||
resizable:true, |
|||
resizerTip:"可调整大小" |
|||
} |
|||
); |
|||
|
|||
queryRoleList(); |
|||
queryDeptTree(); |
|||
}); |
|||
|
|||
function queryRoleList() { |
|||
var exportb = [[${@permission.hasPermi('system:role:export')}]]; |
|||
var exportboolen = (exportb==""?true:false) |
|||
|
|||
var options = { |
|||
url: ctx + "system/role/list", |
|||
createUrl: prefix + "/add", |
|||
updateUrl: prefix + "/edit/{id}", |
|||
removeUrl: prefix + "/remove", |
|||
exportUrl: prefix + "/export", |
|||
sortName: "roleSort", |
|||
modalName: "角色", |
|||
uniqueId:"roleId", |
|||
showCustomExport:exportboolen, |
|||
customExportFunction:function(){ |
|||
$.table.exportExcel(); |
|||
}, |
|||
columns: [{ |
|||
checkbox: true |
|||
}, |
|||
{ |
|||
title: '序号', |
|||
align: 'center', |
|||
formatter: function (value, row, index) { |
|||
return $.table.serialNumber(index); |
|||
} |
|||
}, |
|||
{ |
|||
field: 'roleId', |
|||
title: '角色编号', |
|||
visible: false |
|||
}, |
|||
{ |
|||
field: 'roleName', |
|||
title: '角色名称', |
|||
sortable: true |
|||
}, |
|||
/*{ |
|||
field: 'roleKey', |
|||
title: '权限字符', |
|||
sortable: true |
|||
},*/ |
|||
/*{ |
|||
field: 'roleSort', |
|||
title: '显示顺序', |
|||
sortable: true |
|||
},*/ |
|||
{ |
|||
visible: editFlag == 'hidden' ? false : true, |
|||
title: '角色状态', |
|||
align: 'center', |
|||
formatter: function (value, row, index) { |
|||
return statusTools(row); |
|||
} |
|||
}, |
|||
{ |
|||
field: 'createTime', |
|||
title: '创建时间', |
|||
sortable: true |
|||
}, |
|||
{ |
|||
title: '操作', |
|||
align: 'center', |
|||
formatter: function(value, row, index) { |
|||
var actions = []; |
|||
actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="$.operate.editFull(\'' + row.roleId + '\')"><i class="fa fa-edit"></i> 分配菜单</a> '); |
|||
actions.push('<a class="btn btn-primary btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="authDataScope(\'' + row.roleId + '\')"><i class="fa fa-check-square-o"></i> 数据权限</a> '); |
|||
actions.push('<a class="btn btn-info btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="authUser(\'' + row.roleId + '\')"><i class="fa fa-user"></i> 分配用户</a> '); |
|||
actions.push('<a class="btn btn-success btn-xs ' + dictionaryFlag + '" href="javascript:void(0)" onclick="dictionary(\'' + row.roleId + '\')"><i class="fa fa-book"></i> 业务字典</a> '); |
|||
actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="javascript:void(0)" onclick="$.operate.remove(\'' + row.roleId + '\')"><i class="fa fa-remove"></i> 删除</a> '); |
|||
return actions.join(''); |
|||
} |
|||
}] |
|||
}; |
|||
$.table.init(options); |
|||
} |
|||
|
|||
function queryDeptTree() |
|||
{ |
|||
var list = [1,2,3,4]; |
|||
var url = ctx + "system/dept/treeData?zoneList="+list; |
|||
var options = { |
|||
url: url, |
|||
expandLevel: 2, |
|||
onClick : zOnClick, |
|||
onAsyncSuccess: zTreeOnAsyncSuccess |
|||
}; |
|||
// treeInit(options); |
|||
viewUtils.treeInit(options, function (tree) { |
|||
// 默认选中第一个节点 |
|||
var allNode = tree.getNodes(); |
|||
var leafNode = viewUtils.getOneChildren(allNode[0]); |
|||
if (allNode.length > 0) { |
|||
tree.selectNode(leafNode); |
|||
// 初始化列表 |
|||
// queryTable(); |
|||
zOnClick(null, leafNode.id, leafNode); |
|||
} |
|||
}); |
|||
function zOnClick(event, treeId, treeNode) { |
|||
$("#deptId").val(treeNode.id); |
|||
$("#parentId").val(treeNode.pId); |
|||
$.table.search(); |
|||
} |
|||
} |
|||
|
|||
$('#btnExpand').click(function() { |
|||
$._tree.expandAll(true); |
|||
$(this).hide(); |
|||
$('#btnCollapse').show(); |
|||
}); |
|||
|
|||
$('#btnCollapse').click(function() { |
|||
$._tree.expandAll(false); |
|||
$(this).hide(); |
|||
$('#btnExpand').show(); |
|||
}); |
|||
|
|||
$('#btnRefresh').click(function() { |
|||
queryDeptTree(); |
|||
}); |
|||
|
|||
/* 用户管理-部门 */ |
|||
function dept() { |
|||
var url = ctx + "system/dept"; |
|||
$.modal.openTab("部门管理", url); |
|||
} |
|||
|
|||
/* 用户管理-重置密码 */ |
|||
function resetPwd(userId) { |
|||
var url = prefix + '/resetPwd/' + userId; |
|||
$.modal.open("重置密码", url, '800', '300'); |
|||
} |
|||
|
|||
/* 用户状态显示 */ |
|||
function statusTools(row) { |
|||
if (row.status == 1) { |
|||
return '<i class=\"fa fa-toggle-off text-info fa-2x\" onclick="enable(\'' + row.userId + '\')"></i> '; |
|||
} else { |
|||
return '<i class=\"fa fa-toggle-on text-info fa-2x\" onclick="disable(\'' + row.userId + '\')"></i> '; |
|||
} |
|||
} |
|||
|
|||
/* 用户管理-停用 */ |
|||
function disable(userId) { |
|||
$.modal.confirm("确认要停用用户吗?", function() { |
|||
$.operate.post(prefix + "/changeStatus", { "userId": userId, "status": 1 }); |
|||
}) |
|||
} |
|||
function updateLawCertificateNum(userId) { |
|||
$.modal.confirm("确认要更新用户吗?", function () { |
|||
$.operate.post(prefix + "/updateZfcode", { "userId": userId }); |
|||
}) |
|||
} |
|||
|
|||
/* 用户管理启用 */ |
|||
function enable(userId) { |
|||
$.modal.confirm("确认要启用用户吗?", function() { |
|||
$.operate.post(prefix + "/changeStatus", { "userId": userId, "status": 0 }); |
|||
}) |
|||
} |
|||
// 异步加载完成后的 事件 |
|||
function zTreeOnAsyncSuccess(event, treeId, treeNode, msg) { |
|||
var treeObjtt = $.fn.zTree.getZTreeObj("tree"); |
|||
} |
|||
|
|||
function treeInit(options) { |
|||
var defaults = { |
|||
id: "tree", // 属性ID |
|||
expandLevel: 0, // 展开等级节点 |
|||
view: { |
|||
selectedMulti: false, // 设置是否允许同时选中多个节点 |
|||
nameIsHTML: true // 设置 name 属性是否支持 HTML 脚本 |
|||
}, |
|||
check: { |
|||
enable: false, // 置 zTree 的节点上是否显示 checkbox / radio |
|||
nocheckInherit: true, // 设置子节点是否自动继承 |
|||
}, |
|||
data: { |
|||
key: { |
|||
title: "title" // 节点数据保存节点提示信息的属性名称 |
|||
}, |
|||
simpleData: { |
|||
enable: true // true / false 分别表示 使用 / 不使用 简单数据模式 |
|||
} |
|||
}, |
|||
}; |
|||
var options = $.extend(defaults, options); |
|||
$.tree._option = options; |
|||
// 树结构初始化加载 |
|||
var setting = { |
|||
callback: { |
|||
onClick: options.onClick, // 用于捕获节点被点击的事件回调函数 |
|||
onCheck: options.onCheck, // 用于捕获 checkbox / radio 被勾选 或 取消勾选的事件回调函数 |
|||
onDblClick: options.onDblClick // 用于捕获鼠标双击之后的事件回调函数 |
|||
}, |
|||
check: options.check, |
|||
view: options.view, |
|||
data: options.data |
|||
}; |
|||
$.get(options.url, function(data) { |
|||
var treeId = $("#treeId").val(); |
|||
tree = $.fn.zTree.init($("#" + options.id), setting, data); |
|||
$._tree = tree; |
|||
var nodes = tree.getNodesByParam("level", options.expandLevel - 1); |
|||
for (var i = 0; i < nodes.length; i++) { |
|||
tree.expandNode(nodes[i], true, false, false); |
|||
} |
|||
var node = tree.getNodesByParam("id", treeId, null)[0]; |
|||
$.tree.selectByIdName(treeId, node); |
|||
|
|||
var nodes = $._tree.getNodes(); |
|||
if (nodes.length > 0) { |
|||
console.log("sss"); |
|||
$._tree.selectNode(nodes[0]); |
|||
$("#deptId").val(nodes[0].id); |
|||
$("#parentId").val(nodes[0].pId); |
|||
$.table.search(); |
|||
} |
|||
}); |
|||
} |
|||
</script> |
|||
</body> |
|||
<!-- 导入区域 --> |
|||
<script id="importTpl" type="text/template"> |
|||
<form enctype="multipart/form-data" class="mt20 mb10"> |
|||
<div class="col-xs-offset-1"> |
|||
<input type="file" id="file" name="file"/> |
|||
<div class="mt10 pt5"> |
|||
<input type="checkbox" id="updateSupport" name="updateSupport" title="如果登录账户已经存在,更新这条数据。"> 是否更新已经存在的用户数据 |
|||
<a onclick="$.table.importTemplate()" class="btn btn-default btn-xs"><i class="fa fa-file-excel-o"></i> 下载模板</a> |
|||
</div> |
|||
<font color="red" class="pull-left mt10"> |
|||
提示:仅允许导入“xls”或“xlsx”格式文件! |
|||
</font> |
|||
</div> |
|||
</form> |
|||
</script> |
|||
</html> |
|||
Loading…
Reference in new issue