<div id="test12" class="demo-tree-more"></div>
layui.use(['form', 'layedit', 'laydate', 'util','tree'], function () {
var tree = layui.tree
,form = layui.form
, layer = layui.layer
,util = layui.util
,data = JSON.parse('{$reList|raw}') //用的tp5.1穿的assign传的数据
//树形组件初始化
tree.render({
elem: '#test12'
,data: data
,showCheckbox: true //是否显示复选框
,id: 'demoId1'
,showLine: true //是否开启连接线
});
//获取选中的复选框的id，拼接为字符串
function getCheckedId(jsonObj) {
let id = "";
$.each(jsonObj, function (index, item) {
if (id != "") {
id = id + "," + item.id;
}
else {
id = item.id;
}
//判断是否有子节点
let child = item.hasOwnProperty('children')
if (child != false){
let i = getCheckedId(item.children);
if (i != "") {
id = id + "," + i;
}
}
});
return id;
}
//监听提交
form.on('submit(demo1)', function (data) {
var checkedData = tree.getChecked('demoId1'); //获取选中节点的数据
var ids = getCheckedId(checkedData); //获取选中的id
$.post("/admin/roles/xxx", {p_id:ids,r_id:data.field.r_id},function (e) {
if(e.code == 200 ){
layer.msg('更新成功');
}else{
layer.msg(e.msg);
}
} );
return false;
});
})后台获取数据
public function addpower()
{
//数据展示
$r_id = Request::param('id');
//获取权限数据
$rower = new Power();
$list = $rower->orderByTow();
//获取去用户拥有的权限id
$RolesPowerId = RolesPower::where('r_id',$r_id)->column('p_id');
//因为我无限递归后的数据和layui需要的数据结构有差异，所以重构啦一下
$reList = json_encode( $this->relist($list,$RolesPowerId));//json格式输出
$this->view->assign('reList',$reList);
$this->view->assign('id',$r_id);
return $this->view->fetch();
}
public function relist($arr,$RolesPowerId){
$reList=[];
$i = 0;
foreach ($arr as $k => $v){
$reList[$i]=[
'title' => $v['authorityName'],
'id' => $v['id'],
'field' => '',
'spread' =>true,
];
//只给最后一级中的节点设置选中。因为layui只要上级有默认选中，就不管你下级有没有选中全选中。
if ($v['level'] == 2 && in_array($v['id'],$RolesPowerId)){
$reList[$i]['checked'] = true;
}else{
$reList[$i]['checked'] = false;
}
if (isset($v['child'])&& !empty($v['child']) && is_array($v['child'])){
//递归调用
$reList[$i]['children'] = $this->relist($v['child'],$RolesPowerId);
}
$i ++;
}
return $reList;
}