role.html 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190
  1. <!DOCTYPE html>
  2. <html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
  3. <head>
  4. <th:block th:include="include :: header('角色列表')" />
  5. </head>
  6. <body class="gray-bg">
  7. <div class="container-div">
  8. <div class="row">
  9. <div class="col-sm-12 search-collapse">
  10. <form id="role-form">
  11. <div class="select-list">
  12. <ul>
  13. <li>
  14. 角色名称:<input type="text" name="roleName"/>
  15. </li>
  16. <li>
  17. 权限字符:<input type="text" name="roleKey"/>
  18. </li>
  19. <li>
  20. 角色状态:<select name="status" th:with="type=${@dict.getType('sys_normal_disable')}">
  21. <option value="">所有</option>
  22. <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
  23. </select>
  24. </li>
  25. <li class="select-time">
  26. <label>创建时间: </label>
  27. <input type="text" class="time-input" id="startTime" placeholder="开始时间" name="params[beginTime]"/>
  28. <span>-</span>
  29. <input type="text" class="time-input" id="endTime" placeholder="结束时间" name="params[endTime]"/>
  30. </li>
  31. <li>
  32. <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
  33. <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
  34. </li>
  35. </ul>
  36. </div>
  37. </form>
  38. </div>
  39. <div class="btn-group-sm" id="toolbar" role="group">
  40. <a class="btn btn-success" onclick="$.operate.add()" shiro:hasPermission="system:role:add">
  41. <i class="fa fa-plus"></i> 新增
  42. </a>
  43. <a class="btn btn-primary single disabled" onclick="$.operate.edit()" shiro:hasPermission="system:role:edit">
  44. <i class="fa fa-edit"></i> 修改
  45. </a>
  46. <a class="btn btn-danger multiple disabled" onclick="$.operate.removeAll()" shiro:hasPermission="system:role:remove">
  47. <i class="fa fa-remove"></i> 删除
  48. </a>
  49. <a class="btn btn-warning" onclick="$.table.exportExcel()" shiro:hasPermission="system:role:export">
  50. <i class="fa fa-download"></i> 导出
  51. </a>
  52. </div>
  53. <div class="col-sm-12 select-table table-striped">
  54. <table id="bootstrap-table"></table>
  55. </div>
  56. </div>
  57. </div>
  58. <th:block th:include="include :: footer" />
  59. <script th:inline="javascript">
  60. var editFlag = [[${@permission.hasPermi('system:role:edit')}]];
  61. var removeFlag = [[${@permission.hasPermi('system:role:remove')}]];
  62. var prefix = ctx + "system/role";
  63. $(function() {
  64. var options = {
  65. url: prefix + "/list",
  66. createUrl: prefix + "/add",
  67. updateUrl: prefix + "/edit/{id}",
  68. removeUrl: prefix + "/remove",
  69. exportUrl: prefix + "/export",
  70. sortName: "roleSort",
  71. modalName: "角色",
  72. columns: [{
  73. checkbox: true
  74. },
  75. {
  76. field: 'roleId',
  77. title: '角色编号'
  78. },
  79. {
  80. field: 'roleName',
  81. title: '角色名称',
  82. sortable: true
  83. },
  84. {
  85. field: 'roleKey',
  86. title: '权限字符',
  87. sortable: true
  88. },
  89. {
  90. field: 'dataScope',
  91. title: '数据权限',
  92. formatter: function(value, item, index) {
  93. if (item.dataScope == '1') {
  94. return '<span class="badge badge-primary">全部数据权限</span>';
  95. }
  96. else if (item.dataScope == '2') {
  97. return '<span class="badge badge-success">自定义数据权限</span>';
  98. }
  99. else if (item.dataScope == '3') {
  100. return '<span class="badge badge-info">本部门数据权限</span>';
  101. }
  102. else if (item.dataScope == '4') {
  103. return '<span class="badge badge-warning">本部门及以下数据权限</span>';
  104. }
  105. else if (item.dataScope == '5') {
  106. return '<span class="badge badge-danger">仅本人数据权限</span>';
  107. }
  108. }
  109. },
  110. {
  111. field: 'roleSort',
  112. title: '显示顺序',
  113. sortable: true
  114. },
  115. {
  116. visible: editFlag == 'hidden' ? false : true,
  117. title: '角色状态',
  118. align: 'center',
  119. formatter: function (value, row, index) {
  120. return statusTools(row);
  121. }
  122. },
  123. {
  124. field: 'createTime',
  125. title: '创建时间',
  126. sortable: true
  127. },
  128. {
  129. title: '操作',
  130. align: 'center',
  131. formatter: function(value, row, index) {
  132. if (row.roleId != 1) {
  133. var actions = [];
  134. actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="$.operate.edit(\'' + row.roleId + '\')"><i class="fa fa-edit"></i>编辑</a> ');
  135. 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> ');
  136. var more = [];
  137. more.push("<a class='btn btn-default btn-xs " + editFlag + "' href='javascript:void(0)' onclick='authDataScope(" + row.roleId + ")'><i class='fa fa-check-square-o'></i>数据权限</a> ");
  138. more.push("<a class='btn btn-default btn-xs " + editFlag + "' href='javascript:void(0)' onclick='authUser(" + row.roleId + ")'><i class='fa fa-user'></i>分配用户</a>");
  139. actions.push('<a tabindex="0" class="btn btn-info btn-xs" role="button" data-container="body" data-placement="left" data-toggle="popover" data-html="true" data-trigger="hover" data-content="' + more.join('') + '"><i class="fa fa-chevron-circle-right"></i>更多操作</a>');
  140. return actions.join('');
  141. } else {
  142. return "";
  143. }
  144. }
  145. }]
  146. };
  147. $.table.init(options);
  148. });
  149. /* 角色管理-分配数据权限 */
  150. function authDataScope(roleId) {
  151. var url = prefix + '/authDataScope/' + roleId;
  152. $.modal.open("分配数据权限", url);
  153. }
  154. /* 角色管理-分配用户 */
  155. function authUser(roleId) {
  156. var url = prefix + '/authUser/' + roleId;
  157. $.modal.openTab("分配用户", url);
  158. }
  159. /* 角色状态显示 */
  160. function statusTools(row) {
  161. if (row.status == 1) {
  162. return '<i class=\"fa fa-toggle-off text-info fa-2x\" onclick="enable(\'' + row.roleId + '\')"></i> ';
  163. } else {
  164. return '<i class=\"fa fa-toggle-on text-info fa-2x\" onclick="disable(\'' + row.roleId + '\')"></i> ';
  165. }
  166. }
  167. /* 角色管理-停用 */
  168. function disable(roleId) {
  169. $.modal.confirm("确认要停用角色吗?", function() {
  170. $.operate.post(prefix + "/changeStatus", { "roleId": roleId, "status": 1 });
  171. })
  172. }
  173. /* 角色管理启用 */
  174. function enable(roleId) {
  175. $.modal.confirm("确认要启用角色吗?", function() {
  176. $.operate.post(prefix + "/changeStatus", { "roleId": roleId, "status": 0 });
  177. })
  178. }
  179. </script>
  180. </body>
  181. </html>