role.html 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174
  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-bordered">
  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. uniqueId: 'roleId',
  71. modalName: "角色",
  72. columns: [
  73. {
  74. title: "序号",
  75. align: 'center',
  76. formatter: function (value, row, index) {
  77. return $.table.serialNumber(index);
  78. }
  79. },
  80. {
  81. field: 'roleName',
  82. title: '角色名称',
  83. align: 'center',
  84. sortable: true
  85. },
  86. {
  87. field: 'roleKey',
  88. title: '权限字符',
  89. align: 'center',
  90. sortable: true
  91. },
  92. {
  93. field: 'roleSort',
  94. title: '显示顺序',
  95. align: 'center',
  96. sortable: true
  97. },
  98. {
  99. visible: editFlag == 'hidden' ? false : true,
  100. title: '角色状态',
  101. align: 'center',
  102. formatter: function (value, row, index) {
  103. return statusTools(row);
  104. }
  105. },
  106. {
  107. field: 'createTime',
  108. title: '创建时间',
  109. align: 'center',
  110. sortable: true
  111. },
  112. {
  113. title: '操作',
  114. align: 'center',
  115. formatter: function(value, row, index) {
  116. if (row.roleId != 1) {
  117. var actions = [];
  118. 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> ');
  119. /*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> ');*/
  120. /*var more = [];
  121. 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> ");
  122. 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>");
  123. 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>');*/
  124. return actions.join('');
  125. } else {
  126. return "";
  127. }
  128. }
  129. }]
  130. };
  131. $.table.init(options);
  132. });
  133. /* 角色管理-分配数据权限 */
  134. function authDataScope(roleId) {
  135. var url = prefix + '/authDataScope/' + roleId;
  136. $.modal.open("分配数据权限", url);
  137. }
  138. /* 角色管理-分配用户 */
  139. function authUser(roleId) {
  140. var url = prefix + '/authUser/' + roleId;
  141. $.modal.openTab("分配用户", url);
  142. }
  143. /* 角色状态显示 */
  144. function statusTools(row) {
  145. if (row.status == 1) {
  146. return '<i class=\"fa fa-toggle-off text-info fa-2x\" onclick="enable(\'' + row.roleId + '\')"></i> ';
  147. } else {
  148. return '<i class=\"fa fa-toggle-on text-info fa-2x\" onclick="disable(\'' + row.roleId + '\')"></i> ';
  149. }
  150. }
  151. /* 角色管理-停用 */
  152. function disable(roleId) {
  153. $.modal.confirm("确认要停用角色吗?", function() {
  154. $.operate.post(prefix + "/changeStatus", { "roleId": roleId, "status": 1 });
  155. })
  156. }
  157. /* 角色管理启用 */
  158. function enable(roleId) {
  159. $.modal.confirm("确认要启用角色吗?", function() {
  160. $.operate.post(prefix + "/changeStatus", { "roleId": roleId, "status": 0 });
  161. })
  162. }
  163. </script>
  164. </body>
  165. </html>