<!DOCTYPE html> <html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"> <meta charset="utf-8"> <head th:include="include :: header"></head> <link href="/ajax/libs/jquery-layout/jquery.layout-latest.css" th:href="@{/ajax/libs/jquery-layout/jquery.layout-latest.css}" rel="stylesheet"/> <link href="/ajax/libs/jquery-ztree/3.5/css/metro/zTreeStyle.css" th:href="@{/ajax/libs/jquery-ztree/3.5/css/metro/zTreeStyle.css}" rel="stylesheet"/> <body class="gray-bg"> <div class="ui-layout-west"> <div class="main-content"> <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 menuItem" 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> <div class="container-div ui-layout-center"> <div class="row"> <div class="col-sm-12 select-info"> <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="loginName"/> </li> <li> 用户名称:<input type="text" name="userName"/> </li> <li> 手机号码:<input type="text" name="phoneNumber"/> </li> <li> 用户状态: <select name="enable" th:with="type=${@dict.getType('sys_normal_disable')}"> <option th:each="e : ${type}" th:text="${e['dictLabel']}" th:value="${e['dictValue']}"></option> </select> </li> <!--<li class="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-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i> 搜索</a> <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset('user-form')"><i class="fa fa-refresh"></i> 重置</a> <!--<a class="btn btn-success btn-rounded btn-sm" onclick="$.table.exportExcel()" shiro:hasPermission="system:user:export"><i class="fa fa-download"></i> 导出</a>--> </li> </ul> </div> </form> </div> <div class="btn-group hidden-xs" id="toolbar" role="group"> <a class="btn btn-outline btn-success btn-rounded" onclick="$.operate.add()" shiro:hasPermission="system:user:add"> <i class="fa fa-plus"></i> 新增 </a> <a class="btn btn-outline btn-danger btn-rounded" onclick="$.operate.batRemove()" shiro:hasPermission="system:user:remove"> <i class="fa fa-trash-o"></i> 删除 </a> </div> <div class="col-sm-12 select-info"> <table id="bootstrap-table" data-mobile-responsive="true" class="table table-bordered table-hover"></table> </div> </div> </div> <div th:include="include :: footer"></div> <script th:src="@{/ajax/libs/jquery-layout/jquery.layout-latest.js}"></script> <script th:src="@{/ajax/libs/jquery-ztree/3.5/js/jquery.ztree.all-3.5.js}"></script> <script th:inline="javascript"> var editFlag = [[${@permission.hasPermi('system:user:edit')}]]; var removeFlag = [[${@permission.hasPermi('system:user:remove')}]]; var resetPwdFlag = [[${@permission.hasPermi('system:user:resetPwd')}]]; var datas = [[${@dict.getType('sys_normal_disable')}]]; var prefix = ctx + "system/user" $(document).ready(function(){ $('body').layout({ west__size: 185 }); queryUserList(); queryDeptTreeDaTa(); }); function queryUserList() { var options = { url: prefix + "/list", createUrl: prefix + "/add", updateUrl: prefix + "/edit/{id}", removeUrl: prefix + "/remove", exportUrl: prefix + "/export", sortName: "createTime", sortOrder: "desc", modalName: "用户", search: false, showExport: false, columns: [{ checkbox: true }, { field: 'id', title: '用户ID' }, { field: 'loginName', title: '登录名称', sortable: true }, { field: 'userName', title: '用户名称' }, { field: 'dept.deptName', title: '部门' }, { field: 'email', title: '邮箱', visible: false }, { field: 'phoneNumber', title: '手机' }, { field: 'enable', title: '启用', align: 'center', formatter: function(value, row, index) { return $.table.selectDictLabel(datas, value); } }, { 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="#" onclick="$.operate.edit(\'' + row.id + '\')"><i class="fa fa-edit"></i>编辑</a> '); actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="#" onclick="$.operate.remove(\'' + row.id + '\')"><i class="fa fa-trash-o"></i>删除</a> '); actions.push('<a class="btn btn-info btn-xs ' + resetPwdFlag + '" href="#" onclick="resetPwd(\'' + row.id + '\')"><i class="fa fa-key"></i>修改密码</a>'); return actions.join(''); } }] }; $.table.init(options); } function queryDeptTreeDaTa() { // 树结构初始化加载 var setting = {view:{selectedMulti:false},data:{key:{title:"title"},simpleData:{enable:true}}, callback:{onClick:function(event, treeId, treeNode){ $("#deptId").val(treeNode.id); $("#parentId").val(treeNode.pId); $.table.search(); }} }, tree, loadTree = function(){ $.get(ctx + "system/dept/treeData", function(data) { tree = $.fn.zTree.init($("#tree"), setting, data); //.expandAll(true); // 展开第一级节点 var nodes = tree.getNodesByParam("level", 0); for (var i = 0; i < nodes.length; i++) { tree.expandNode(nodes[i], true, false, false); } // 展开第二级节点 nodes = tree.getNodesByParam("level", 1); for (var i = 0; i < nodes.length; i++) { tree.expandNode(nodes[i], true, false, false); } }, null, null, "正在加载,请稍后..."); };loadTree(); $('#btnExpand').click(function() { tree.expandAll(true); $(this).hide(); $('#btnCollapse').show(); }); $('#btnCollapse').click(function() { tree.expandAll(false); $(this).hide(); $('#btnExpand').show(); }); $('#btnRefresh').click(function() { loadTree(); }); } /*用户管理-部门*/ function dept() { var url = ctx + "system/dept"; createMenuItem(url, "部门管理"); } /*用户管理-重置密码*/ function resetPwd(id) { var url = prefix + '/resetPwd/' + id; $.modal.open("重置密码", url, '800', '300'); } </script> </body> </html>