search

博客列表 >laravel--通用后台管理系统--添加菜单--角色添加权限--根据用户权限显示菜单

laravel--通用后台管理系统--添加菜单--角色添加权限--根据用户权限显示菜单

王娇
王娇原创
2020年06月22日 17:29:253123浏览

学习总结

1.layui中的form.render()方法在使用过程中，只能渲染2次，问题在角色权限的添加和修改，全选和一级菜单只能选中和取消只能使用一次，第2次点击就不能渲染到复选框上了

2.在权限中间件RightsVerify.php中为Request对象添加rights属性，在Home控制器中使用whereIn()方法查找符合当前用户的权限菜单。

**问题**

使用form.render()方法无法连续渲染复选框，实现复选框菜单联动

**解决方法

不使用layui中的form.render()方法，使用jquery实现渲染$('input[type="checkbox"]~div').addClass('layui-form-checked'); 因为美化后的复选框是一个div,并且和input的checkbox在同一个大的div中，所以使用同级选择器，选中美化后的div,然后添加css样式。

1.菜单控制器Menu.php

  2. <?php
  4. namespace App\Http\Controllers\admins;
  6. use App\Http\Controllers\Controller;
  8. use Illuminate\Support\Facades\Hash;//哈希密码加密
  10. use Illuminate\Http\Request;
  11. //引入数据库查询构造器，链式调用
  12. use Illuminate\Support\Facades\DB;
  13. //后台菜单管理控制器
  14. class Menus extends Controller
  15. {
  16.     //菜单列表
  17.     public function index(Request $req)
  18.     {
  20.         $pid =(int)$req->pid;
  21.         if($pid):
  22.             //找到菜单的上一级菜单
  23.             $res['pMenu']=DB::table('admin_menu')->select('mid','pid','title')->where('mid',$pid)->item();
  24.         else:
  25.             $res['pMenu']['mid']=0;
  26.         endif;
  27.         $res['menus']=DB::table('admin_menu')->where('pid',$pid)->lists();
  28.         return view('/admins/menus/index',$res); 
  29.         // echo '<pre>';
  30.         // print_r($res);
  31.         // exit;
  32.     }
  33.     //添加菜单
  34.     public function add(Request $req)
  35.     {   
  36.         $res['pid'] = $req->pid;
  37.         return view('/admins/menus/add',$res);
  39.     }
  41.     //保存菜单
  42.     public function save(Request $req)
  43.     {
  44.         $mid =(int) $req->mid;
  45.         //如果mid为0，代表是添加，否则代表是修改
  46.         //菜单的pid,上一级菜单的id
  47.         $data['pid'] =(int) $req->pid;
  48.         //判断菜单名称是否为空
  49.         if(trim($req->title)===''):
  50.             return json_encode(['status'=>'1','msg'=>'菜单名称不能为空']);
  51.          endif;
  52.          $data['title'] = trim($req->title);
  54.          //如果ishidden='on',正常显示的菜单
  55.          if($req->ishidden):
  56.             $data['ishidden'] = (int)'0';//代表正常显示菜单
  57.          else:
  58.             $data['ishidden'] = (int)'1';//代表隐藏菜单
  59.          endif;
  60.          //排序
  61.          $data['ord'] =(int)$req->ord;
  63.          //判断是否输入控制器
  64.          if(trim($req->controller)===''):
  65.             return json_encode(['status'=>'1','msg'=>'控制器名称不能为空']);
  66.          endif;
  67.          $data['controller'] = trim($req->controller);
  68.          //控制器方法
  69.          $data['action'] = trim($req->action);
  71.         if($mid):
  72.             $res = DB::table('admin_menu')->where('mid',$mid)->update($data);
  73.         else:
  74.             $res = DB::table('admin_menu')->insert($data);
  75.         endif;
  77.         if($res):
  78.             return json_encode(['status'=>'0','msg'=>'保存成功']);
  79.         else:
  80.             return json_encode(['status'=>'1','msg'=>'保存失败']);
  81.         endif;
  82.     }
  84.     public function del(Request $req)
  85.     {
  86.         $mid = $req->mid;
  87.         $res = DB::table('admin_menu')->where('mid',$mid)->delete();
  88.         if($res)
  89.         {
  90.             return json_encode(['status'=>'0','msg'=>'删除成功']);
  91.         }
  92.         else
  93.         {
  94.             return json_encode(['status'=>'1','msg'=>'删除失败']);
  95.         }
  96.     }
  98.     public function edit(Request $req)
  99.     {
  100.         $mid = $req->mid;
  101.         $res['menu'] = DB::table('admin_menu')->where('mid',$mid)->item();
  102.         return view('/admins/menus/edit',$res);
  103.     }
  104. }

1.1菜单列表的显示index.blade.php

  2. <!DOCTYPE html>
  3. <html lang="en">
  5. <head>
  6.     <meta charset="UTF-8">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
  9.     <script src="/static/plugins/layui/layui.js"></script>
  10.     <title>菜单管理</title>
  11. </head>
  12. <style>
  13. .addBtn {
  14.     margin-top: 10px;
  15.     width: 120px;
  16.     margin-left: auto;
  17.     margin-right: 50px;
  18. }
  20. .pMenuBtn {
  21.     margin-left: 10px;
  22. }
  24. .layui-table {
  25.     width: 95%;
  26.     margin: 20px;
  27. }
  28. </style>
  30. <body>
  31.     <div class="addBtn">
  32.         <button class="layui-btn" onclick="add({{$pMenu['mid']}})">添加菜单</button>
  33.     </div>
  34.     @if($pMenu['mid'])
  35.     <div class="pMenuBtn">
  36.         <button class="layui-btn layui-btn-primary" onclick="back({{$pMenu['pid']}})">返回『{{$pMenu['title']}}』菜单</button>
  37.     </div>
  38.     @endif
  39.     <table class="layui-table">
  40.         <thead>
  41.             <tr>
  42.                 <th>MID</th>
  43.                 <th>菜单名称</th>
  44.                 <th>是否隐藏</th>
  45.                 <th>排序</th>
  46.                 <th>controller</th>
  47.                 <th>action</th>
  48.                 <th>操作</th>
  49.             </tr>
  50.         </thead>
  51.         <tbody>
  53.             @foreach($menus as $menu)
  54.             <tr>
  55.                 <td>{{$menu['mid']}}</td>
  56.                 <td>{{$menu['title']}}</td>
  57.                 <td>{{$menu['ishidden']?'是':'否'}}</td>
  58.                 <td>{{$menu['ord']}}</td>
  59.                 <td>{{$menu['controller']}}</td>
  60.                 <td>{{$menu['action']}}</td>
  61.                 <td>
  62.                     <button class="layui-btn layui-btn-xs layui-btn-primary"
  63.                         onclick="child({{$menu['mid']}})">下级菜单</button>
  64.                     <button class="layui-btn layui-btn-xs" onclick="edit({{$menu['mid']}})">修改</button>
  65.                     <button class="layui-btn layui-btn-xs layui-btn-danger" onclick="del({{$menu['mid']}})">删除</button>
  66.                 </td>
  67.             </tr>
  68.             @endforeach
  69.         </tbody>
  70.     </table>
  71. </body>
  72. <script>
  73. layui.use(['layer'], function() {
  74.     layer = layui.layer;
  75.     $ = layui.jquery;
  76. });
  79. //显示下级菜单
  80. function child(id) {
  81.     window.location.href = '/admins/menus/index?pid=' + id;
  82. }
  84. //返回上级菜单
  85. function back(id) {
  86.     window.location.href = '/admins/menus/index?pid=' + id;
  87. }
  88. //添加菜单
  89. function add(pid) {
  90.     //iframe层
  91.     layer.open({
  92.         type: 2,
  93.         title: '添加菜单',
  94.         shadeClose: true,
  95.         shade: 0.8,
  96.         area: ['380px', '80%'],
  97.         content: '/admins/menus/add?pid=' + pid, //iframe的url
  98.         btn: ['保存'],
  99.         yes: function(index, layero) {
  100.             //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.子页面的方法名称();
  101.             var iframeWin = window[layero.find('iframe')[0]['name']];;
  102.             iframeWin.save();
  103.         }
  105.     });
  106. }
  108. //修改菜单
  109. function edit(id) {
  110.     //iframe层
  111.     layer.open({
  112.         type: 2,
  113.         title: '修改菜单',
  114.         shadeClose: true,
  115.         shade: 0.8,
  116.         area: ['380px', '80%'],
  117.         content: '/admins/menus/edit?mid=' + id, //iframe的url
  118.         btn: ['保存'],
  119.         yes: function(index, layero) {
  120.             //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.子页面的方法名称();
  121.             var iframeWin = window[layero.find('iframe')[0]['name']];;
  122.             iframeWin.save();
  123.         }
  125.     });
  126. }
  129. //删除菜单
  130. function del(id) {
  131.     layer.confirm('确认要删除菜单吗？', function() {
  132.         $.get('/admins/menus/del?mid=' + id, function(res) {
  133.             if (res.status > 0) {
  134.                 layer.alert(res.msg, {
  135.                     icon: 2
  136.                 });
  137.             } else {
  138.                 layer.msg(res.msg, {
  139.                     time: 3000
  140.                 });
  141.                 window.location.reload();
  142.             }
  143.         }, 'json');
  144.     });
  147. }
  148. </script>
  150. </html>
  • 一级菜单

  • 一级菜单下的子菜单

1.2 添加菜单add.blade.php

  2. <!DOCTYPE html>
  3. <html lang="en">
  5. <head>
  6.     <meta charset="UTF-8">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
  9.     <script src="/static/plugins/layui/layui.js"></script>
  10.     <title>添加菜单</title>
  11.     <style>
  12.     .layui-form {
  13.         margin-top: 20px;
  14.         margin-right: 20px;
  15.     }
  16.     </style>
  17. </head>
  19. <body>
  20.     <form action="" class="layui-form">
  21.         @csrf
  22.         <input type="hidden" name="pid" value="{{$pid}}">
  23.         <div class="layui-form-item">
  24.             <label for="" class="layui-form-label">菜单名称</label>
  25.             <div class="layui-input-inline">
  26.                 <input type="text" class="layui-input" name="title">
  27.             </div>
  28.         </div>
  29.         <div class="layui-form-item">
  30.             <label for="" class="layui-form-label">是否隐藏</label>
  31.             <div class="layui-input-inline">
  32.                 <input type="checkbox" name="ishidden" lay-skin='switch' lay-text='正常|隐藏'>
  33.             </div>
  34.         </div>
  35.         <div class="layui-form-item">
  36.             <label for="" class="layui-form-label">排序</label>
  37.             <div class="layui-input-inline">
  38.                 <input type="number" class="layui-input" name="ord" value="0">
  39.             </div>
  40.         </div>
  42.         <div class="layui-form-item">
  43.             <label for="" class="layui-form-label">controller</label>
  44.             <div class="layui-input-inline">
  45.                 <input type="text" class="layui-input" name="controller">
  46.             </div>
  47.         </div>
  49.         <div class="layui-form-item">
  50.             <label for="" class="layui-form-label">action</label>
  51.             <div class="layui-input-inline">
  52.                 <input type="text" class="layui-input" name="action">
  53.             </div>
  54.         </div>
  57.     </form>
  58. </body>
  60. <script>
  61. layui.use(['form', 'layer'], function() {
  62.     var form = layui.form;
  63.     var layer = layui.layer;
  64.     $ = layui.jquery;
  65. });
  67. //在父窗口中调用了save方法
  68. function save() {
  70.     if ($('input[name="title"]').val().trim() === '') {
  71.         error('请输入菜单名称');
  72.         return false;
  73.     }
  74.     if ($('input[name="controller"]').val().trim() === '') {
  75.         error('请输入控制器');
  76.         return false;
  77.     }
  79.     //把form表单中的数据序列化后通过post提交
  80.     var form = $('form').serialize();
  81.     console.log(form);
  82.     $.post('/admins/menus/save',
  83.         form,
  84.         function(res) {
  85.             if (res.status > 0) {
  86.                 error(res.msg);
  87.             } else {
  88.                 layer.msg(res.msg);
  89.                 setTimeout(function() {
  90.                     //假设这是iframe页
  91.                     var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
  92.                     //关闭当前窗口
  93.                     parent.layer.close(index); //再执行关闭  
  94.                     //刷新父窗口，重新显示账号管理员列表
  95.                     parent.window.location.reload();
  96.                 }, 1000);
  98.             }
  99.         }, 'json');
  101.     function error(msg) {
  102.         layer.alert(msg, {
  103.             icon: 2
  104.         });
  105.     }
  106. }
  107. </script>
  109. </html>

1.3修改菜单edit.blade.php

  2. <!DOCTYPE html>
  3. <html lang="en">
  5. <head>
  6.     <meta charset="UTF-8">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
  9.     <script src="/static/plugins/layui/layui.js"></script>
  10.     <title>添加菜单</title>
  11.     <style>
  12.     .layui-form {
  13.         margin-top: 20px;
  14.         margin-right: 20px;
  15.     }
  16.     </style>
  17. </head>
  19. <body>
  20.     <form action="" class="layui-form">
  21.         @csrf
  22.         <input type="hidden" name="mid" value="{{$menu['mid']}}">
  23.         <input type="hidden" name="pid" value="{{$menu['pid']}}">
  24.         <div class="layui-form-item">
  25.             <label for="" class="layui-form-label">菜单名称</label>
  26.             <div class="layui-input-inline">
  27.                 <input type="text" class="layui-input" name="title" value="{{$menu['title']}}">
  28.             </div>
  29.         </div>
  30.         <div class="layui-form-item">
  31.             <label for="" class="layui-form-label">是否隐藏</label>
  32.             <div class="layui-input-inline">
  33.                 <input type="checkbox" name="ishidden" lay-skin='switch' lay-text='正常|隐藏'
  34.                     {{$menu['ishidden']?'':'checked'}}>
  35.             </div>
  36.         </div>
  37.         <div class="layui-form-item">
  38.             <label for="" class="layui-form-label">排序</label>
  39.             <div class="layui-input-inline">
  40.                 <input type="number" class="layui-input" name="ord" value="{{$menu['ord']}}">
  41.             </div>
  42.         </div>
  44.         <div class="layui-form-item">
  45.             <label for="" class="layui-form-label">controller</label>
  46.             <div class="layui-input-inline">
  47.                 <input type="text" class="layui-input" name="controller" value="{{$menu['controller']}}">
  48.             </div>
  49.         </div>
  51.         <div class="layui-form-item">
  52.             <label for="" class="layui-form-label">action</label>
  53.             <div class="layui-input-inline">
  54.                 <input type="text" class="layui-input" name="action" value="{{$menu['action']}}">
  55.             </div>
  56.         </div>
  59.     </form>
  60. </body>
  62. <script>
  63. layui.use(['form', 'layer'], function() {
  64.     var form = layui.form;
  65.     var layer = layui.layer;
  66.     $ = layui.jquery;
  67. });
  69. //在父窗口中调用了save方法
  70. function save() {
  72.     if ($('input[name="title"]').val().trim() === '') {
  73.         error('请输入菜单名称');
  74.         return false;
  75.     }
  76.     if ($('input[name="controller"]').val().trim() === '') {
  77.         error('请输入控制器');
  78.         return false;
  79.     }
  81.     //把form表单中的数据序列化后通过post提交
  82.     var form = $('form').serialize();
  83.     console.log(form);
  84.     $.post('/admins/menus/save',
  85.         form,
  86.         function(res) {
  87.             if (res.status > 0) {
  88.                 error(res.msg);
  89.             } else {
  90.                 layer.msg(res.msg);
  91.                 setTimeout(function() {
  92.                     //假设这是iframe页
  93.                     var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
  94.                     //关闭当前窗口
  95.                     parent.layer.close(index); //再执行关闭  
  96.                     //刷新父窗口，重新显示账号管理员列表
  97.                     parent.window.location.reload();
  98.                 }, 1000);
  99.             }
  100.         }, 'json');
  102.     function error(msg) {
  103.         layer.alert(msg, {
  104.             icon: 2
  105.         });
  106.     }
  107. }
  108. </script>
  110. </html>

2.角色控制器Groups.php

  2. <?php
  4. namespace App\Http\Controllers\admins;
  6. use App\Http\Controllers\Controller;
  8. use Illuminate\Support\Facades\Hash;//哈希密码加密
  10. use Illuminate\Http\Request;
  11. //引入数据库查询构造器，链式调用
  12. use Illuminate\Support\Facades\DB;
  13. //后台角色管理控制器
  14. class Groups extends Controller
  15. {
  16.     public function index()
  17.     {
  18.         $res['groups'] = DB::table('admin_group')->lists();
  19.         return view('/admins/groups/index',$res);
  20.     }
  22.     public function add()
  23.     {
  24.         //查出所有可用的菜单
  25.         $menus = [];
  26.         $menus = DB::table('admin_menu')->where('status',0)->lists();
  27.         $res['pMenus'] = [];
  28.         foreach($menus as $menu):
  29.             if($menu['pid']=='0'):
  30.                 $res['pMenus'][]=$menu;
  31.                 $res['cMenus'][$menu['mid']]=[];        
  32.             else:
  33.                 $res['cMenus'][$menu['pid']][]=$menu;
  34.             endif;
  35.         endforeach;
  36.         // echo '<pre>';
  37.         // print_r($res);
  38.         // exit;
  39.         return view('/admins/groups/add',$res);
  40.     }
  42.     public function save(Request $req)
  43.     {
  44.         if(trim($req->title)==""):
  45.             return json_encode(['status'=>'1','msg'=>'必须输入角色名称']);
  46.         endif;
  47.         $data['title'] =trim($req->title) ;
  49.         if($req->menus):
  50.             $data['rights'] =json_encode(array_keys($req->menus));
  51.         else:
  52.             $data['rights']='';
  53.         endif;
  54.         $gid = (int)$req->gid;
  55.         if($gid):
  56.             $res = DB::table('admin_group')->where('gid',$gid)->update($data);
  57.         else:
  58.             $res = DB::table('admin_group')->insert($data);
  59.         endif;
  61.         if($res):
  62.             return json_encode(['status'=>'0','msg'=>'保存成功']);
  63.         else:
  64.             return json_encode(['status'=>'1','msg'=>'保存失败']);
  65.         endif;
  66.         exit;
  67.     }
  69.     public function edit(Request $req)
  70.     {   
  71.         $gid = $req->gid;
  72.         $res['group'] = DB::table('admin_group')->where('gid',$gid)->item();
  73.         $menus = [];
  74.         $menus = DB::table('admin_menu')->where('status',0)->lists();
  75.         $res['pMenus'] = [];
  76.         foreach($menus as $menu):
  77.             if($menu['pid']=='0'):
  78.                 $res['pMenus'][]=$menu;
  79.                 $res['cMenus'][$menu['mid']]=[];        
  80.             else:
  81.                 $res['cMenus'][$menu['pid']][]=$menu;
  82.             endif;
  83.         endforeach;
  84.         $res['group']['rights']=json_decode($res['group']['rights'],true);
  85.         // echo '<pre>';
  86.         // print_r($res);
  87.         // exit;
  88.         return view('/admins/groups/edit',$res);
  89.     }
  91.     public function del(Request $req)
  92.     {
  93.         $gid = $req->gid;
  94.         $res =DB::table('admin_group')->where('gid',$gid)->delete();
  95.         if($res)
  96.         {
  97.             return json_encode(['status'=>'0','msg'=>'删除成功']);
  98.         }
  99.         else
  100.         {
  101.             return json_encode(['status'=>'1','msg'=>'删除失败']);
  102.         }
  103.     }
  104. }

2.1角色列表index.blade.php

  2. <!DOCTYPE html>
  3. <html lang="en">
  5. <head>
  6.     <meta charset="UTF-8">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
  9.     <script src="/static/plugins/layui/layui.js"></script>
  10.     <title>角色管理</title>
  11. </head>
  12. <style>
  13. .addBtn {
  14.     margin-top: 10px;
  15.     width: 120px;
  16.     margin-left: auto;
  17.     margin-right: 50px;
  18. }
  20. .layui-table {
  21.     width: 95%;
  22.     margin: 20px;
  23. }
  24. </style>
  26. <body>
  27.     <div class="addBtn">
  28.         <button class="layui-btn" onclick="add()">添加角色</button>
  29.     </div>
  30.     <table class="layui-table">
  31.         <thead>
  32.             <tr>
  33.                 <th>编号</th>
  34.                 <th>角色名称</th>
  35.                 <th>操作</th>
  36.             </tr>
  37.         </thead>
  38.         <tbody>
  40.             @foreach($groups as $group)
  41.             <tr>
  42.                 <td>{{$group['gid']}}</td>
  43.                 <td>{{$group['title']}}</td>
  44.                 <td>
  45.                     <button class="layui-btn layui-btn-xs" onclick="edit({{$group['gid']}})">修改</button>
  46.                     <button class="layui-btn layui-btn-xs layui-btn-danger" onclick="del({{$group['gid']}})">删除</button>
  47.                 </td>
  48.             </tr>
  49.             @endforeach
  50.         </tbody>
  51.     </table>
  52. </body>
  53. <script>
  54. layui.use(['layer'], function() {
  55.     layer = layui.layer;
  56.     $ = layui.jquery;
  57. });
  59. //添加角色
  60. function add() {
  61.     //iframe层
  62.     layer.open({
  63.         type: 2,
  64.         title: '添加角色',
  65.         shadeClose: true,
  66.         shade: 0.8,
  67.         area: ['380px', '80%'],
  68.         content: '/admins/groups/add', //iframe的url
  69.         btn: ['保存'],
  70.         yes: function(index, layero) {
  71.             //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.子页面的方法名称();
  72.             var iframeWin = window[layero.find('iframe')[0]['name']];;
  73.             iframeWin.save();
  74.         }
  76.     });
  77. }
  79. //修改角色
  80. function edit(id) {
  81.     //iframe层
  82.     layer.open({
  83.         type: 2,
  84.         title: '修改角色',
  85.         shadeClose: true,
  86.         shade: 0.8,
  87.         area: ['380px', '80%'],
  88.         content: '/admins/groups/edit?gid=' + id, //iframe的url
  89.         btn: ['保存'],
  90.         yes: function(index, layero) {
  91.             //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.子页面的方法名称();
  92.             var iframeWin = window[layero.find('iframe')[0]['name']];;
  93.             iframeWin.save();
  94.         }
  96.     });
  97. }
  99. //删除角色
  100. function del(id) {
  101.     layer.confirm('确认要删除角色吗？', function() {
  102.         $.get('/admins/groups/del?gid=' + id, function(res) {
  103.             if (res.status > 0) {
  104.                 layer.alert(res.msg, {
  105.                     icon: 2
  106.                 });
  107.             } else {
  108.                 layer.msg(res.msg, {
  109.                     time: 3000
  110.                 });
  111.                 window.location.reload();
  112.             }
  113.         }, 'json');
  114.     });
  115. }
  116. </script>
  118. </html>

2.2添加角色权限add.blade.php

  2. <!DOCTYPE html>
  3. <html lang="en">
  5. <head>
  6.     <meta charset="UTF-8">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
  9.     <script src="/static/plugins/layui/layui.js"></script>
  10.     <title>添加角色</title>
  11.     <style>
  12.     .layui-form {
  13.         margin-top: 20px;
  14.         margin-right: 20px;
  15.     }
  16.     </style>
  17. </head>
  19. <body>
  20.     <form action="" class="layui-form" lay-filter='groupForm'>
  21.         @csrf
  22.         <div class="layui-form-item">
  23.             <label for="" class="layui-form-label">角色名称</label>
  24.             <div class="layui-input-inline">
  25.                 <input type="text" class="layui-input" name="title">
  26.             </div>
  27.         </div>
  28.         <div class="layui-form-item">
  29.             <div class="layui-input-inline" style="margin-left: 10px;">
  30.                 <input type="checkbox" title="全选" lay-filter="checkAll">
  31.             </div>
  32.         </div>
  33.         @foreach($pMenus as $pMenu)
  34.         <hr>
  35.         <div class="layui-form-item">
  36.             <div class="layui-input-inline" style="margin-left: 10px;">
  37.                 <input type="checkbox" title="{{$pMenu['title']}}" value="{{$pMenu['mid']}}"
  38.                     name="menus[{{$pMenu['mid']}}]" lay-filter="pmenus" group="{{$pMenu['mid']}}">
  39.             </div>
  40.         </div>
  41.         <div class="layui-form-item">
  42.             <div class="layui-input-inline" style="margin-left: 50px;">
  43.                 <?php $childs = $cMenus[$pMenu['mid']]?>
  44.                 @foreach($childs as $child)
  45.                 <input type="checkbox" lay-skin="primary" title="{{$child['title']}}" value="{{$child['mid']}}"
  46.                     name="menus[{{$child['mid']}}]" lay-filter="cmenus-{{$child['pid']}}">
  47.                 @endforeach()
  48.             </div>
  49.         </div>
  50.         @endforeach
  52.     </form>
  53. </body>
  55. <script>
  56. layui.use(['form', 'layer'], function() {
  57.     var form = layui.form;
  58.     var layer = layui.layer;
  59.     $ = layui.jquery;
  61. //全选按钮点击事件
  62.     form.on('checkbox(checkAll)', function(data) {
  63.         //data.elem.checked检查是否被选中
  64.         if (data.elem.checked) {
  65.             //全选按钮被选中
  66.             $('input[type="checkbox"]').attr('checked', 'true');
  67.             //渲染美化后的checkbox
  68.             $('input[type="checkbox"]~div').addClass('layui-form-checked');
  70.         } else {
  71.             $('input[type="checkbox"]').removeAttr('checked');
  72.             $('input[type="checkbox"]~div').removeClass('layui-form-checked');
  73.             //全选按钮未选中
  74.         }
  75.         // form.render('checkbox', 'groupForm');
  77.     });
  79.     //父级菜单选中事件
  80.     form.on('checkbox(pmenus)', function(data) {
  81.         //data.elem.checked检查是否被选中
  82.         var pIndex = $(data.elem).attr('group');
  83.         if (data.elem.checked) {
  84.             $('input[lay-filter="cmenus-' + pIndex + '"]').attr('checked', 'true');
  85.             //渲染美化后的checkbox
  86.             $('input[lay-filter="cmenus-' + pIndex + '"]~div').addClass('layui-form-checked');
  87.         } else {
  88.             $('input[lay-filter="cmenus-' + pIndex + '"]').removeAttr('checked');
  89.             $('input[lay-filter="cmenus-' + pIndex + '"]~div').removeClass('layui-form-checked');
  90.         }
  91.         // form.render('checkbox', 'groupForm');
  92.     });
  95. });
  97. //在父窗口中调用了save方法
  98. function save() {
  99.     console.log('save');
  100.     if ($('input[name="title"]').val().trim() === '') {
  101.         error('请输入角色名称');
  102.         return false;
  103.     }
  104.     //把form表单中的数据序列化后通过post提交
  105.     var form = $('form').serialize();
  107.     $.post('/admins/groups/save',
  108.         form,
  109.         function(res) {
  110.             if (res.status > 0) {
  111.                 error(res.msg);
  112.             } else {
  113.                 layer.msg(res.msg);
  114.                 setTimeout(function() {
  115.                     //假设这是iframe页
  116.                     var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
  117.                     //关闭当前窗口
  118.                     parent.layer.close(index); //再执行关闭  
  119.                     //刷新父窗口，重新显示账号管理员列表
  120.                     parent.window.location.reload();
  121.                 }, 1000);
  123.             }
  124.         }, 'json');
  125. }
  127. function error(msg) {
  128.     layer.alert(msg, {
  129.         icon: 2
  130.     });
  131. }
  132. </script>
  134. </html>

2.3修改角色权限edit.blade.php

  2. <!DOCTYPE html>
  3. <html lang="en">
  5. <head>
  6.     <meta charset="UTF-8">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
  9.     <script src="/static/plugins/layui/layui.js"></script>
  10.     <title>修改角色</title>
  11.     <style>
  12.     .layui-form {
  13.         margin-top: 20px;
  14.         margin-right: 20px;
  15.     }
  16.     </style>
  17. </head>
  19. <body>
  20.     <form action="" class="layui-form" lay-filter='groupForm'>
  21.         @csrf
  22.         <input type="hidden" name="gid" value="{{$group['gid']}}">
  23.         <div class="layui-form-item">
  24.             <label for="" class="layui-form-label">角色名称</label>
  25.             <div class="layui-input-inline">
  26.                 <input type="text" class="layui-input" name="title" value="{{$group['title']}}">
  27.             </div>
  28.         </div>
  29.         <div class="layui-form-item">
  30.             <div class="layui-input-inline" style="margin-left: 10px;">
  31.                 <input type="checkbox" title="全选" lay-filter="checkAll">
  32.             </div>
  33.         </div>
  34.         @foreach($pMenus as $pMenu)
  35.         <hr>
  36.         <div class="layui-form-item">
  37.             <div class="layui-input-inline" style="margin-left: 10px;">
  38.                 <input type="checkbox" title="{{$pMenu['title']}}" value="{{$pMenu['mid']}}"
  39.                     name="menus[{{$pMenu['mid']}}]" {{in_array($pMenu['mid'],$group['rights'])?'checked':''}}>
  40.             </div>
  41.         </div>
  42.         <div class="layui-form-item">
  43.             <div class="layui-input-inline" style="margin-left: 50px;">
  44.                 <?php $childs = $cMenus[$pMenu['mid']]?>
  45.                 @foreach($childs as $child)
  46.                 <input type="checkbox" lay-skin="primary" title="{{$child['title']}}" value="{{$child['mid']}}"
  47.                     name="menus[{{$child['mid']}}]" {{in_array($child['mid'],$group['rights'])?'checked':''}}>
  48.                 @endforeach()
  49.             </div>
  50.         </div>
  51.         @endforeach
  53.     </form>
  54. </body>
  56. <script>
  57. layui.use(['form', 'layer'], function() {
  58.     var form = layui.form;
  59.     var layer = layui.layer;
  60.     $ = layui.jquery;
  62.   //全选按钮点击事件
  63.     form.on('checkbox(checkAll)', function(data) {
  64.         //data.elem.checked检查是否被选中
  65.         if (data.elem.checked) {
  66.             //全选按钮被选中
  67.             $('input[type="checkbox"]').attr('checked', 'true');
  68.             //渲染美化后的checkbox
  69.             $('input[type="checkbox"]~div').addClass('layui-form-checked');
  71.         } else {
  72.             $('input[type="checkbox"]').removeAttr('checked');
  73.             $('input[type="checkbox"]~div').removeClass('layui-form-checked');
  74.             //全选按钮未选中
  75.         }
  76.         // form.render('checkbox', 'groupForm');
  78.     });
  80.     //父级菜单选中事件
  81.     form.on('checkbox(pmenus)', function(data) {
  82.         //data.elem.checked检查是否被选中
  83.         var pIndex = $(data.elem).attr('group');
  84.         if (data.elem.checked) {
  85.             $('input[lay-filter="cmenus-' + pIndex + '"]').attr('checked', 'true');
  86.             //渲染美化后的checkbox
  87.             $('input[lay-filter="cmenus-' + pIndex + '"]~div').addClass('layui-form-checked');
  88.         } else {
  89.             $('input[lay-filter="cmenus-' + pIndex + '"]').removeAttr('checked');
  90.             $('input[lay-filter="cmenus-' + pIndex + '"]~div').removeClass('layui-form-checked');
  91.         }
  92.         // form.render('checkbox', 'groupForm');
  93.     });
  94. });
  96. //在父窗口中调用了save方法
  97. function save() {
  98.     console.log('save');
  99.     if ($('input[name="title"]').val().trim() === '') {
  100.         error('请输入角色名称');
  101.         return false;
  102.     }
  103.     //把form表单中的数据序列化后通过post提交
  104.     var form = $('form').serialize();
  106.     $.post('/admins/groups/save',
  107.         form,
  108.         function(res) {
  109.             if (res.status > 0) {
  110.                 error(res.msg);
  111.             } else {
  112.                 layer.msg(res.msg);
  113.                 setTimeout(function() {
  114.                     //假设这是iframe页
  115.                     var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
  116.                     //关闭当前窗口
  117.                     parent.layer.close(index); //再执行关闭  
  118.                     //刷新父窗口，重新显示账号管理员列表
  119.                     parent.window.location.reload();
  120.                 }, 1000);
  122.             }
  123.         }, 'json');
  124. }
  126. function error(msg) {
  127.     layer.alert(msg, {
  128.         icon: 2
  129.     });
  130. }
  131. </script>
  133. </html>

3.权限中间件RightsVerify.php

  2. <?php
  4. namespace App\Http\Middleware;
  6. use Closure;
  7. use Hamcrest\Arrays\IsArray;
  8. //引入数据库查询构造器，链式调用
  9. use Illuminate\Support\Facades\DB;
  10. //引入Auth类，获取当前登录的用户
  11. use Illuminate\Support\Facades\Auth;
  13. use function GuzzleHttp\json_decode;
  15. class RightsVerify
  16. {
  17.     /**
  18.      * Handle an incoming request.
  19.      *
  20.      * @param  \Illuminate\Http\Request  $request
  21.      * @param  \Closure  $next
  22.      * @return mixed
  23.      */
  24.     public function handle($request, Closure $next)
  25.     {
  26.         //获取当前登录用户的用户信息
  27.         $user = Auth::user();
  28.         //获取当前登录用户的角色id
  29.         $gid = $user->gid;
  30.         $gInfo = DB::table('admin_group')->where('gid',$gid)->item();
  31.         if(!$gInfo):
  32.             return response('不存在该角色',200);
  33.         endif;
  35.         //把所有当前用户可用的菜单保存在数组中
  36.         $rights = [];
  37.         if($gInfo['rights']):
  38.            $rights = json_decode($gInfo['rights'],true);
  39.         endif;
  41.         //检查当前用户访问的是哪个菜单，是否有权限访问，是否有该菜单
  43.         $curUrl = $request->route()->action['controller'];//返回当前访问的路由所对应的控制器和方法
  44.         //App\Http\Controllers\admins\Home@index
  45.         $pos = strrpos($curUrl,'\\');//从字符串右边开始查找\在字符串中的位置
  46.         $curUrl = substr($curUrl,$pos+1);
  47.         //Home@index
  48.         $pos = strpos($curUrl,'@');//获取分隔符的位置
  49.         $con = substr($curUrl,0,$pos);//获取要访问的控制器
  50.         $act = substr($curUrl,$pos+1);//获取要访问的方法
  51.         //在数据库中查找对应的菜单
  52.         $curMenu = DB::table('admin_menu')->where('controller',$con)->where('action',$act)->item();
  53.         if(!$curMenu):
  54.             return response('不存在此功能',200);
  55.         endif;
  56.         if($curMenu['status']==1):
  57.             return response('此功能已被禁用,请联系管理员开启此功能',200);
  58.         endif;
  59.         if(!(in_array($curMenu['mid'],$rights))):
  60.             return response('没有权限使用此菜单，请更改权限后使用',200);
  61.         endif;
  62.         // echo '<pre>';
  63.         // print_r($curMenu);
  64.         // exit;
  65.         //把登录用户的权限保存在request中的rights自定义属性中
  66.         $request->rights = $rights;
  67.         return $next($request);
  68.     }
  69. }

4.Home控制器，根据用户权限查找对应菜单Home.php

  2. <?php
  4. namespace App\Http\Controllers\admins;
  6. use App\Http\Controllers\Controller;
  8. use Illuminate\Support\Facades\Auth;
  10. use Illuminate\Http\Request;
  11. //引入数据库查询构造器，链式调用
  12. use Illuminate\Support\Facades\DB;
  13. //后台主页
  14. class Home extends Controller
  15. {
  16.     public function index(Request $req)
  17.     {
  18.         //通过req中的自定义rights属性取得当前用户的权限菜单，rights属性在中间件RightsVerify.php中自定义
  19.         $rights = $req->rights;
  20.         //然后通过whereIn判断菜单是否在权限菜单中
  21.         $menus = DB::table('admin_menu')->whereIn('mid',$rights)->where('status',0)->lists();
  22.         $res = [];
  23.         foreach($menus as $menu ):
  24.             //ishidden为0代表该显示该菜单
  25.             //pid等于0的并且的为顶级菜单存储在pmenus中
  26.             if($menu['pid']=='0' && $menu['ishidden']=='0'):
  27.                 $res['pmenus'][] = $menu;
  28.                 //为每一个一级菜单创建一个数组用来存放二级菜单
  29.                 $res['cmenus'][$menu['mid']] = [];
  30.             endif;
  31.             //pid不等于0的为子菜单，按照pid进行分组存储在cmenus中
  32.             if(($menu['pid']!='0')&&($menu['ishidden']=='0')):
  33.                 //把子菜单放在对应的一级菜单的数据中
  34.                 $res['cmenus'][$menu['pid']][] = $menu;
  35.             endif;
  36.         endforeach;
  38.         $res['username'] = Auth::user()->real_name;
  39.         // echo '<pre>';
  40.         // print_r($res);
  41.         // exit;
  42.         return view('/admins/home/index',$res);
  43.     }
  45.     public function welcome()
  46.     {
  47.         return view('/admins/home/welcome');
  48.     }
  50.     public function logout()
  51.     {
  52.         Auth::logout();
  53.         return view('/admins/account/login');
  54.     }
  55. }
  57. ?>

上一条：浮动元素高度坍塌原因及解决方案与三列布局下一条：阿里字体图标的完整引用流程
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议
王娇2020-06-21 20:17:321楼
//全选按钮点击事件 form.on('checkbox(checkAll)', function(data) { //data.elem.checked检查是否被选中 if (data.elem.checked) { //全选按钮被选中 $('input[type="checkbox"]').attr('checked', 'true'); //渲染美化后的checkbox $('input[type="checkbox"]~div').addClass('layui-form-checked'); } else { $('input[type="checkbox"]').removeAttr('checked'); $('input[type="checkbox"]~div').removeClass('

相关文章

查看更多