permission.blade.php 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335
  1. @extends('admin/layout')
  2. @section('header')
  3. <link rel="stylesheet" href="{{asset('js/plugins/zTree_v3-master/css/zTreeStyle/zTreeStyle.css')}}">
  4. <style type="text/css">
  5. .ztree li span.button.add {
  6. margin-left: 2px;
  7. margin-right: -1px;
  8. background-position: -144px 0;
  9. vertical-align: top;
  10. *vertical-align: middle
  11. }
  12. .ztree li span.button.reset {
  13. margin-right: 2px;
  14. background-position: -110px -48px;
  15. vertical-align: top;
  16. *vertical-align: middle
  17. }
  18. </style>
  19. @endsection
  20. @section('content')
  21. <body class="gray-bg">
  22. <div class="wrapper wrapper-content animated fadeInRight">
  23. <div class="row">
  24. <div class="col-sm-3">
  25. <div class="ibox float-e-margins">
  26. <div class="ibox-title">
  27. 菜单配置
  28. </div>
  29. <div class="ibox-content">
  30. <button class="btn btn-info btn-sm" type="button" onclick="units.saveView(0,1)">添加一级菜单</button>
  31. <ul id="treeDemo" class="ztree"></ul>
  32. </div>
  33. </div>
  34. </div>
  35. <div class="col-sm-9">
  36. <div class="ibox float-e-margins">
  37. <div class="ibox-title">权限配置
  38. <button class="btn btn-info" type="button" style="float: right;margin: 0 5px;padding: 4px 12px"
  39. onclick="units.batchDelete()">删除
  40. </button>
  41. <button class="btn btn-info" type="button" style="float: right;margin: 0 5px;padding: 4px 12px"
  42. onclick="units.saveView(0)">添加
  43. </button>
  44. </div>
  45. <div class="ibox-content">
  46. <table id="table" class="table table-condensed" data-mobile-responsive="true"></table>
  47. </div>
  48. </div>
  49. </div>
  50. </div>
  51. </div>
  52. </body>
  53. @endsection
  54. @section('footer')
  55. <script src="{{asset('js/plugins/zTree_v3-master/js/jquery.ztree.core.min.js')}}"></script>
  56. <script src="{{asset('js/plugins/zTree_v3-master/js/jquery.ztree.exedit.min.js')}}"></script>
  57. <script>
  58. var units = {
  59. search: function () {
  60. tips.selectPage();
  61. },
  62. getIdsBySelections: function () {
  63. var selections = $("#table").bootstrapTable('getSelections');
  64. var ids = [];
  65. $.each(selections, function (inx, val) {
  66. ids.push(val.id);
  67. });
  68. return ids;
  69. },
  70. saveView: function (id, type) { //功能权限添加修改 带 type的 是菜单权限添加一级菜单
  71. if (id === 0 && type !== 1) {
  72. var nodes = zTreeObj.getSelectedNodes();
  73. // console.log(nodes);
  74. if (nodes.length === 0) {
  75. layer.alert('请先在左侧菜单选择你要添加的位置', {icon: 0});
  76. return;
  77. }
  78. }
  79. var url = '/admin/system/permissions/' + id + '?type=2';
  80. if (type === 1) {
  81. url = '/admin/system/permissions/' + id + '?type=1';
  82. }
  83. layer.open({
  84. type: 2,
  85. content: url,
  86. area: ['60%', '50%'],
  87. title: '保存',
  88. btn: ['确认', '取消'],
  89. yes: function (index, layero) {
  90. var son = $(layero).find('iframe')[0].contentWindow;
  91. var data = son.tips.getFormValues('#form');
  92. layer.close(index);
  93. data.type = 2;
  94. if (type === 1) { // 菜单权限添加一级菜单
  95. data.type = 1;
  96. data.parent_id = 0;
  97. } else {
  98. if (id === 0) {
  99. data.parent_id= nodes[0].id
  100. }
  101. }
  102. var config = {
  103. type: 'PUT',
  104. url: url,
  105. data: data,
  106. success: function (result) {
  107. if (type === 1) {
  108. zTreeObj.addNodes(null, {
  109. id: result.data.id,
  110. pId: result.data.parent_id,
  111. name: result.data.title
  112. });
  113. } else {
  114. layer.msg(result.message, {icon: 6, time: 1500}, function () {
  115. tips.tableRefresh('#table');
  116. });
  117. }
  118. }
  119. };
  120. tips.ajax(config);
  121. }
  122. });
  123. },
  124. batchDelete: function () {
  125. var ids = units.getIdsBySelections();
  126. if (ids.length === 0) {
  127. layer.alert('请先选择您所要操作的对象');
  128. return;
  129. }
  130. layer.confirm('您确定要删除吗?', {icon: 3, title: '删除信息'}, function () {
  131. tips.ajax({url: '/admin/system/permissions', type: 'delete', data: {ids: ids}});
  132. tips.tableRefresh('#table');
  133. });
  134. },
  135. addHoverDom: function (treeId, treeNode) {
  136. var sObj = $("#" + treeNode.tId + "_span");
  137. var addBtn = "#addBtn_" + treeNode.tId;
  138. // if (treeNode.editNameFlag || $("#addBtn_" + treeNode.tId).length > 0) return;
  139. if (treeNode.editNameFlag || $(addBtn).length > 0) return;
  140. var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
  141. + "' title='add node' onfocus='this.blur();'></span>" +
  142. "<span class='button reset' id='resetBtn_" + treeNode.tId + "' title='reset node' onfocus='this.blur();'></span>";
  143. sObj.after(addStr);
  144. var btn = $(addBtn);
  145. if (btn) btn.bind("click", function () { //菜单权限添加
  146. layer.open({
  147. type: 2,
  148. content: ['/admin/system/permissions/0?type=1'],
  149. area: ['60%', '60%'],
  150. title: '保存',
  151. btn: ['确认', '取消'],
  152. yes: function (index, layero) {
  153. var son = $(layero).find('iframe')[0].contentWindow;
  154. var data = son.tips.getFormValues('#form');
  155. data.type = 1;
  156. data.parent_id = treeNode.id;
  157. var config = {
  158. type: 'PUT',
  159. url: '/admin/system/permissions/0',
  160. data: data,
  161. success: function (result) {
  162. layer.msg(result.message, {icon: 6, time: 1500}, function () {
  163. layer.close(index);
  164. });
  165. zTreeObj.addNodes(treeNode, {
  166. id: result.data.id,
  167. pId: result.data.parent_id,
  168. name: result.data.title
  169. });
  170. }
  171. };
  172. tips.ajax(config);
  173. }
  174. });
  175. return false;
  176. });
  177. var resetBtn = $("#resetBtn_" + treeNode.tId);
  178. if (resetBtn) resetBtn.bind("click", function () { //菜单权限修改
  179. layer.open({
  180. type: 2,
  181. content: ['/admin/system/permissions/' + treeNode.id + '?type=1'],
  182. area: ['60%', '60%'],
  183. title: '保存',
  184. btn: ['确认', '取消'],
  185. yes: function (index, layero) {
  186. var son = $(layero).find('iframe')[0].contentWindow;
  187. var data = son.tips.getFormValues('#form');
  188. data.type = 1;
  189. var config = {
  190. type: 'PUT',
  191. url: '/admin/system/permissions/' + treeNode.id,
  192. data: data,
  193. success: function (result) {
  194. layer.msg(result.message, {icon: 6, time: 1500}, function () {
  195. layer.close(index);
  196. });
  197. treeNode.name = result.data.title;
  198. zTreeObj.updateNode(treeNode);
  199. }
  200. };
  201. tips.ajax(config);
  202. }
  203. });
  204. return false;
  205. });
  206. }
  207. };
  208. var zTreeObj;
  209. // zTree 的参数配置,深入使用请参考 API 文档(setting 配置详解)
  210. var setting = {
  211. callback: {
  212. onClick: function (event, treeId, treeNode) {
  213. config.otherParams = {parentId: treeNode.id};
  214. tips.tableRefresh();
  215. },
  216. beforeRemove: function (treeId, treeNode) {
  217. zTreeObj.selectNode(treeNode);
  218. layer.confirm('是否删除所有选中的数据?', {icon: 3, title: '提示'}, function (index) {
  219. layer.close(index);
  220. var config = {
  221. type: 'delete',
  222. url: '/admin/system/permissions/' + treeNode.id,
  223. success: function (result) {
  224. layer.msg(result.message, {icon: 6, time: 1500}, function () {
  225. layer.close(index);
  226. });
  227. zTreeObj.removeNode(treeNode);
  228. }
  229. };
  230. tips.ajax(config);
  231. });
  232. return false;
  233. }
  234. },
  235. edit: {
  236. enable: true,
  237. showRenameBtn: false,
  238. showRemoveBtn: true
  239. },
  240. view: {
  241. addHoverDom: units.addHoverDom,
  242. removeHoverDom: function (treeId, treeNode) {
  243. $("#addBtn_" + treeNode.tId).unbind().remove();
  244. $("#resetBtn_" + treeNode.tId).unbind().remove();
  245. },
  246. selectedMulti: false
  247. }
  248. };
  249. // zTree 的数据属性,深入使用请参考 API 文档(zTreeNode 节点数据详解)
  250. var trees = JSON.parse('{!! json_encode($trees) !!}');
  251. $(document).ready(function () {
  252. zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, trees);
  253. });
  254. var config = {};
  255. config.url = '/admin/system/permissions';
  256. config.columns = [ //字段
  257. /*{checkbox: true},*/
  258. {
  259. title: '序号', align: 'center', formatter: function (value, item, index) {
  260. return index + 1;
  261. }
  262. },
  263. {title: '名称', field: 'title', align: 'center'},
  264. {title: '规则', field: 'rule', align: 'center'},
  265. {title: '创建时间', field: 'created_at', align: 'center'},
  266. {
  267. title: '操作', field: 'id', align: 'center',
  268. formatter: function (value) {
  269. return (
  270. '<button onclick="units.saveView(' + value + ')" class="btn btn-xs"><span class="glyphicon glyphicon-edit"></span>编辑</button>'
  271. // '<button onclick="units.detail(' + value + ')" class="btn btn-xs"><span class="glyphicon glyphicon-menu-hamburger"></span>详情</button>'
  272. );
  273. }
  274. }
  275. ];
  276. tips.bootstrapTable(config);
  277. $(document).on('click', '#on', function () {
  278. var ids = units.getIdsBySelections();
  279. if (ids.length === 0) {
  280. layer.alert('请先选择您所要操作的对象');
  281. return;
  282. }
  283. tips.ajax({url: '/admin/system/users/on', type: 'put', data: {ids: ids}});
  284. tips.tableRefresh('#table');
  285. });
  286. $(document).on('click', '#off', function () {
  287. var ids = units.getIdsBySelections();
  288. if (ids.length === 0) {
  289. layer.alert('请先选择您所要操作的对象');
  290. return;
  291. }
  292. tips.ajax({url: '/admin/system/users/off', type: 'put', data: {ids: ids}});
  293. tips.tableRefresh('#table');
  294. });
  295. $(document).on('click', '#add', function () {
  296. layer.open({
  297. type: 2,
  298. content: ['/admin/system/user/show/0'],
  299. area: ['60%', '70%'],
  300. title: '添加用户'
  301. });
  302. });
  303. </script>
  304. @endsection