RBAC基於角色許可權分配問題中的(父許可權選中同時子許可權全部選中,選中子許可權時父許可權也隨之選中效果)
阿新 • • 發佈:2018-12-24
說明:以下程式碼是在thinkphp5.2版本下程式設計.
實現功能:父許可權選中同時子許可權全部選中,選中子許可權時父許可權也隨之選中
解決方式:
一 . 前端通過給多選框設定onchange事件,通過ajax向後端發起請求(傳遞id),
二 . 後端通過ID獲取子分類----通過pid獲取父類 ,通過標識父類和子類傳遞到前臺(json_decode後)
三 . 前端通過物件的下標區別是父類資料 還是子類資料
若為父類 則在勾選的時候處理 否則不處理 這就導致了 (當子類一個沒有時,可能父類也會有勾選)
若為子類 則在勾選的時候全部將子類勾選 若是在取消勾選時 將子類全部取消勾選
後臺類:
<?php namespace app\index\controller; use think\Controller; class Test extends Controller { public function getPris(){ $pri = [ ['id'=>1,'name'=>'角色管理','pid'=>0], ['id'=>2,'name'=>'商品管理','pid'=>0], ['id'=>3,'name'=>'許可權管理','pid'=>0], ['id'=>4,'name'=>'角色新增','pid'=>1], ['id'=>5,'name'=>'角色修改','pid'=>1], ['id'=>6,'name'=>'角色列表','pid'=>1], ['id'=>7,'name'=>'商品新增','pid'=>2], ['id'=>8,'name'=>'商品修改','pid'=>2], ['id'=>9,'name'=>'商品列表','pid'=>2], ['id'=>10,'name'=>'許可權新增','pid'=>3], ['id'=>11,'name'=>'許可權修改','pid'=>3], ['id'=>12,'name'=>'許可權列表','pid'=>3], ]; $id = input('id'); $pid = input('pid'); //通過ID獲取子類 $children =$this->getTree($pri,$id); $parent = $this->getFather($pri,$pid); // foreach ($parent as $value) { // array_push($children,$value); // } // return json($children); $data = [ 'father'=>$parent, 'children' =>$children, ]; return json($data); } public function day3() { //許可權認證夫許可權選中 子許可權全部選中 子許可權選中 父許可權全部選中 $pri = [ ['id'=>1,'name'=>'角色管理','pid'=>0], ['id'=>2,'name'=>'商品管理','pid'=>0], ['id'=>3,'name'=>'許可權管理','pid'=>0], ['id'=>4,'name'=>'角色新增','pid'=>1], ['id'=>5,'name'=>'角色修改','pid'=>1], ['id'=>6,'name'=>'角色列表','pid'=>1], ['id'=>7,'name'=>'商品新增','pid'=>2], ['id'=>8,'name'=>'商品修改','pid'=>2], ['id'=>9,'name'=>'商品列表','pid'=>2], ['id'=>10,'name'=>'許可權新增','pid'=>3], ['id'=>11,'name'=>'許可權修改','pid'=>3], ['id'=>12,'name'=>'許可權列表','pid'=>3], ]; $res = $this->getTree($pri); $this->assign('pris',$res); // dump($res); return $this->fetch(); } public function getFather($arr,$pid,$lev=1) { static $tree = []; foreach ($arr as $key => $value) { if($value['id']==$pid){ $value['lev'] =$lev; $tree[] = $value; $this->getFather($arr,$value['pid'],$lev+1); } } return $tree; } public function getTree($arr,$pid=0,$lev=1) { static $tree = []; foreach ($arr as $key => $value) { if($value['pid']==$pid){ $value['lev'] =$lev; $tree[] = $value; $this->getTree($arr,$value['id'],$lev+1); } } return $tree; } }
前臺程式碼:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <table> {volist name="pris" id="vo"} <tr> {eq name="vo.pid" value="0"} <td> <input type="checkbox" name="pri[]" value="{$vo.id}" data-value="{$vo.pid}">{$vo.name} </td> {volist name="pris" id="v2"} {eq name="v2.pid" value="$vo.id"} <td> <input type="checkbox" name="pri[]" value="{$v2.id}" data-value="{$v2.pid}">{$v2.name} </td> {/eq} {/volist} {/eq} </tr> {/volist} </table> </body> <script type="text/javascript" src="__HOME__/js/jquery.js"></script> <script type="text/javascript"> $('input[name="pri[]"]').on('change',function(){ var id=$(this).val(); var pid=$(this).attr('data-value'); var status = $(this).attr('checked'); //通過該許可權id獲取其父類 和 其子類 $.ajax({ url:'{:url("getPris")}', type:'post', data:{id:id,pid:pid}, success:function(data){ //獲取所有的物件(方式一) // var pris = $('input[name="pri[]"]'); // for(var j in data){ // for(var i in pris){ // if(pris[i].nodeType==1 && $(pris[i]).val()==data[j].id){ // if(status==='checked'){ // $(pris[i]).attr('checked','checked'); // }else{ // $(pris[i]).removeAttr('checked'); // } // } // } // } //方式二(bug當子類一個沒有時,可能父類也會有勾選) var children = data.children; var father = data.father; var pris = $('input[name="pri[]"]'); for(var j in children){ for(var i in pris){ if(pris[i].nodeType==1 && $(pris[i]).val()==children[j].id){ if(status==='checked'){ $(pris[i]).attr('checked','checked'); }else{ $(pris[i]).removeAttr('checked'); } } } } for(var j in father){ for(var i in pris){ if(pris[i].nodeType==1 && $(pris[i]).val()==father[j].id){ if(status==='checked'){ $(pris[i]).attr('checked','checked'); } } } } } }) }) </script> </html>