user.html 8.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221
  1. <!DOCTYPE html>
  2. <html lang="zh" xmlns:th="http://www.thymeleaf.org"
  3. xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
  4. <meta charset="utf-8">
  5. <head th:include="include :: header"></head>
  6. <link href="/ajax/libs/jquery-layout/jquery.layout-latest.css" th:href="@{/ajax/libs/jquery-layout/jquery.layout-latest.css}" rel="stylesheet"/>
  7. <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"/>
  8. <body class="gray-bg">
  9. <div class="ui-layout-west">
  10. <div class="main-content">
  11. <div class="box box-main">
  12. <div class="box-header">
  13. <div class="box-title">
  14. <i class="fa icon-grid"></i> 组织机构
  15. </div>
  16. <div class="box-tools pull-right">
  17. <a type="button" class="btn btn-box-tool menuItem" href="#" onclick="dept()" title="管理机构"><i class="fa fa-edit"></i></a>
  18. <button type="button" class="btn btn-box-tool" id="btnExpand" title="展开" style="display:none;"><i class="fa fa-chevron-up"></i></button>
  19. <button type="button" class="btn btn-box-tool" id="btnCollapse" title="折叠"><i class="fa fa-chevron-down"></i></button>
  20. <button type="button" class="btn btn-box-tool" id="btnRefresh" title="刷新机构"><i class="fa fa-refresh"></i></button>
  21. </div>
  22. </div>
  23. <div class="ui-layout-content">
  24. <div id="tree" class="ztree"></div>
  25. </div>
  26. </div>
  27. </div>
  28. </div>
  29. <div class="container-div ui-layout-center">
  30. <div class="row">
  31. <div class="col-sm-12 select-info">
  32. <form id="user-form">
  33. <input type="hidden" id="deptId" name="deptId">
  34. <input type="hidden" id="parentId" name="parentId">
  35. <div class="select-list gd">
  36. <ul>
  37. <li>
  38. 登录名称:<input type="text" name="loginName"/>
  39. </li>
  40. <li>
  41. 手机号码:<input type="text" name="phonenumber"/>
  42. </li>
  43. <li>
  44. 用户状态:<select name="status" th:with="type=${@dictService.selectDictData('sys_normal_disable')}">
  45. <option value="">所有</option>
  46. <option th:each="e : ${type}" th:text="${e['dictLabel']}" th:value="${e['dictValue']}"></option>
  47. </select>
  48. </li>
  49. <li class="time">
  50. <label>创建时间: </label>
  51. <input type="text" class="layui-input" id="startTime" placeholder="开始时间" name="params[beginTime]"/>
  52. <span>-</span>
  53. <input type="text" class="layui-input" id="endTime" placeholder="结束时间" name="params[endTime]"/>
  54. </li>
  55. <li>
  56. <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search($('form').attr('id'))"><i class="fa fa-search"></i>&nbsp;搜索</a>
  57. <a class="btn btn-success btn-rounded btn-sm" onclick="$.table.exportExcel($('form').attr('id'))"><i class="fa fa-download"></i>&nbsp;下载</a>
  58. </li>
  59. </ul>
  60. </div>
  61. </form>
  62. </div>
  63. <div class="btn-group hidden-xs" id="toolbar" role="group">
  64. <a class="btn btn-outline btn-success btn-rounded" onclick="$.operate.add()" shiro:hasPermission="system:user:add">
  65. <i class="fa fa-plus"></i> 新增
  66. </a>
  67. <a class="btn btn-outline btn-danger btn-rounded" onclick="$.operate.batRemove()" shiro:hasPermission="system:user:remove">
  68. <i class="fa fa-trash-o"></i> 删除
  69. </a>
  70. </div>
  71. <div class="col-sm-12 select-info table-striped">
  72. <table id="bootstrap-table" data-mobile-responsive="true"></table>
  73. </div>
  74. </div>
  75. </div>
  76. <div th:include="include :: footer"></div>
  77. <script th:src="@{/ajax/libs/jquery-layout/jquery.layout-latest.js}"></script>
  78. <script th:src="@{/ajax/libs/jquery-ztree/3.5/js/jquery.ztree.all-3.5.js}"></script>
  79. <script th:inline="javascript">
  80. var editFlag = [[${@permissionService.hasPermi('system:user:edit')}]];
  81. var removeFlag = [[${@permissionService.hasPermi('system:user:remove')}]];
  82. var resetPwdFlag = [[${@permissionService.hasPermi('system:user:resetPwd')}]];
  83. var prefix = ctx + "system/user"
  84. $(document).ready(function(){
  85. $('body').layout({ west__size: 185 });
  86. queryUserList();
  87. queryDeptTreeDaTa();
  88. });
  89. function queryUserList() {
  90. var options = {
  91. url: prefix + "/list",
  92. createUrl: prefix + "/add",
  93. updateUrl: prefix + "/edit/{id}",
  94. removeUrl: prefix + "/remove",
  95. exportUrl: prefix + "/export",
  96. sortName: "createTime",
  97. sortOrder: "desc",
  98. modalName: "用户",
  99. search: false,
  100. showExport: false,
  101. columns: [{
  102. checkbox: true
  103. },
  104. {
  105. field: 'userId',
  106. title: '用户ID'
  107. },
  108. {
  109. field: 'loginName',
  110. title: '登录名称',
  111. sortable: true
  112. },
  113. {
  114. field: 'userName',
  115. title: '用户名称'
  116. },
  117. {
  118. field: 'dept.deptName',
  119. title: '部门'
  120. },
  121. {
  122. field: 'email',
  123. title: '邮箱'
  124. },
  125. {
  126. field: 'phonenumber',
  127. title: '手机'
  128. },
  129. {
  130. field: 'status',
  131. title: '状态',
  132. align: 'center',
  133. formatter: function(value, row, index) {
  134. if (value == '0') {
  135. return '<span class="badge badge-primary">正常</span>';
  136. } else if (value == '1') {
  137. return '<span class="badge badge-danger">停用</span>';
  138. }
  139. }
  140. },
  141. {
  142. field: 'createTime',
  143. title: '创建时间',
  144. sortable: true
  145. },
  146. {
  147. title: '操作',
  148. align: 'center',
  149. formatter: function(value, row, index) {
  150. var actions = [];
  151. actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="#" onclick="$.operate.edit(\'' + row.userId + '\')"><i class="fa fa-edit"></i>编辑</a> ');
  152. actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="#" onclick="$.operate.remove(\'' + row.userId + '\')"><i class="fa fa-remove"></i>删除</a> ');
  153. actions.push('<a class="btn btn-info btn-xs ' + resetPwdFlag + '" href="#" onclick="resetPwd(\'' + row.userId + '\')"><i class="fa fa-key"></i>重置</a>');
  154. return actions.join('');
  155. }
  156. }]
  157. };
  158. $.table.init(options);
  159. }
  160. function queryDeptTreeDaTa()
  161. {
  162. // 树结构初始化加载
  163. var setting = {view:{selectedMulti:false},data:{key:{title:"title"},simpleData:{enable:true}},
  164. callback:{onClick:function(event, treeId, treeNode){
  165. tree.expandNode(treeNode);
  166. $("#deptId").val(treeNode.id);
  167. $("#parentId").val(treeNode.pId);
  168. $.table.search($('form').attr('id'));
  169. }}
  170. }, tree, loadTree = function(){
  171. $.get(ctx + "system/dept/treeData", function(data) {
  172. tree = $.fn.zTree.init($("#tree"), setting, data); //.expandAll(true);
  173. // 展开第一级节点
  174. var nodes = tree.getNodesByParam("level", 0);
  175. for (var i = 0; i < nodes.length; i++) {
  176. tree.expandNode(nodes[i], true, false, false);
  177. }
  178. // 展开第二级节点
  179. nodes = tree.getNodesByParam("level", 1);
  180. for (var i = 0; i < nodes.length; i++) {
  181. tree.expandNode(nodes[i], true, false, false);
  182. }
  183. }, null, null, "正在加载,请稍后...");
  184. };loadTree();
  185. $('#btnExpand').click(function() {
  186. tree.expandAll(true);
  187. $(this).hide();
  188. $('#btnCollapse').show();
  189. });
  190. $('#btnCollapse').click(function() {
  191. tree.expandAll(false);
  192. $(this).hide();
  193. $('#btnExpand').show();
  194. });
  195. $('#btnRefresh').click(function() {
  196. loadTree();
  197. });
  198. }
  199. /*用户管理-部门*/
  200. function dept() {
  201. var url = ctx + "system/dept";
  202. createMenuItem(url, "部门管理");
  203. }
  204. /*用户管理-重置密码*/
  205. function resetPwd(userId) {
  206. var url = prefix + '/resetPwd/' + userId;
  207. $.modal.open("重置密码", url, '800', '300');
  208. }
  209. </script>
  210. </body>
  211. </html>