You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
133 lines
4.7 KiB
133 lines
4.7 KiB
<!DOCTYPE html>
|
|
<html lang="zh-cn">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<!--#include file="/widget/head.html"-->
|
|
<script>
|
|
|
|
</script>
|
|
|
|
</head>
|
|
|
|
<body class="layui-layout-body" layadmin-themealias="default">
|
|
<div id="wrapper">
|
|
<!-- Navigation -->
|
|
<!--#include file="/widget/nav.html"-->
|
|
<div id="page-wrapper" class="layui-body layadmin-tabsbody-item layui-show layui-fluid layui-row layui-col-space15" lay-filter="mform">
|
|
<div class="layui-card" id="card-page-wrapper">
|
|
<div class="row">
|
|
<div class="container" style="margin-left: 10px">
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row table-responsive" id="form" style="width: 100%">
|
|
<div style="width:100%;">
|
|
<div id="ID-tree"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--#include file="/widget/tail.html"-->
|
|
<script type="text/javascript">
|
|
|
|
layui.use(function () {
|
|
var tree = layui.tree;
|
|
var layer = layui.layer;
|
|
var util = layui.util;
|
|
|
|
$.get(Page.SvrIp + "/api/all_permission",
|
|
{
|
|
token: cookie.get("token")
|
|
},
|
|
function (d) {
|
|
let menus=d.data;
|
|
let data = [];
|
|
for (const menusKey in menus) {
|
|
let menu = menus[menusKey];
|
|
let subMenus = menu.SubPermissions;
|
|
let subData = [];
|
|
for (const subMenusKey in subMenus) {
|
|
let subMenu = subMenus[subMenusKey];
|
|
let subItem = {
|
|
title: subMenu.Name,
|
|
id: subMenu.Id,
|
|
field: 'permission' + subMenu.Id,
|
|
checked: false,
|
|
spread: true,
|
|
|
|
}
|
|
subData.push(subItem)
|
|
}
|
|
let item = {
|
|
title: menu.Name,
|
|
id: menu.MenuId,
|
|
field: 'menu' + menu.MenuId,
|
|
checked: false,
|
|
spread: true,
|
|
children: subData,
|
|
|
|
}
|
|
data.push(item)
|
|
}
|
|
|
|
// 渲染
|
|
tree.render({
|
|
elem: '#ID-tree',
|
|
data: data,
|
|
showCheckbox: true, // 是否显示复选框
|
|
onlyIconControl: true, // 是否仅允许节点左侧图标控制展开收缩
|
|
id: 'demo-id-1',
|
|
edit:['update', 'del'],
|
|
// isJump: true, // 是否允许点击节点时弹出新窗口跳转
|
|
click: function (obj) {
|
|
var data = obj.data; //获取当前点击的节点数据
|
|
layer.msg('状态:' + obj.state + '<br>节点数据:' + JSON.stringify(data));
|
|
},
|
|
operate:function (obj) {
|
|
var type = obj.type; // 得到操作类型:add、edit、del
|
|
var data = obj.data; // 得到当前节点的数据
|
|
var elem = obj.elem; // 得到当前节点元素
|
|
// Ajax 操作
|
|
var id = data.id; // 得到节点索引
|
|
if(type === 'update'){ // 修改节点
|
|
layer.msg('<br>更新节点数据:' + JSON.stringify(data));
|
|
console.log(elem.find('.layui-tree-txt').html()); // 得到修改后的内容
|
|
} else if(type === 'del'){ // 删除节点
|
|
layer.msg('<br>删除节点数据:' + JSON.stringify(data));
|
|
}
|
|
}
|
|
});
|
|
// 按钮事件
|
|
util.event('lay-on', {
|
|
getChecked: function (othis) {
|
|
var checkedData = tree.getChecked('demo-id-1'); // 获取选中节点的数据
|
|
|
|
layer.alert(JSON.stringify(checkedData), {shade: 0});
|
|
console.log(checkedData);
|
|
},
|
|
setChecked: function () {
|
|
tree.setChecked('demo-id-1', [12, 16]); // 勾选对应 id 值的节点
|
|
},
|
|
reload: function () {
|
|
tree.reload('demo-id-1', {}); // 重载实例
|
|
}
|
|
});
|
|
}
|
|
);
|
|
|
|
});
|
|
|
|
|
|
$(function () {
|
|
initPage('权限管理');
|
|
});
|
|
|
|
</script>
|
|
<script src="../js/coupon.js"></script>
|
|
|
|
</body>
|
|
|
|
</html>
|
|
|