@extends('admin/layout')
@section('header')
<link rel="stylesheet" href="{{asset('js/plugins/zTree_v3-master/css/zTreeStyle/zTreeStyle.css')}}">
<style type="text/css">
.ztree li span.button.add {
margin-left: 2px;
margin-right: -1px;
background-position: -144px 0;
vertical-align: top;
*vertical-align: middle
}
.ztree li span.button.reset {
margin-right: 2px;
background-position: -110px -48px;
vertical-align: top;
*vertical-align: middle
}
</style>
@endsection
@section('content')
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
<div class="row">
<div class="col-sm-3">
<div class="ibox float-e-margins">
<div class="ibox-title">
菜单配置
</div>
<div class="ibox-content">
<button class="btn btn-info btn-sm" type="button" onclick="units.saveView(0,1)">添加一级菜单</button>
<ul id="treeDemo" class="ztree"></ul>
</div>
</div>
</div>
<div class="col-sm-9">
<div class="ibox float-e-margins">
<div class="ibox-title">权限配置
<button class="btn btn-info" type="button" style="float: right;margin: 0 5px;padding: 4px 12px"
onclick="units.batchDelete()">删除
</button>
<button class="btn btn-info" type="button" style="float: right;margin: 0 5px;padding: 4px 12px"
onclick="units.saveView(0)">添加
</button>
</div>
<div class="ibox-content">
<table id="table" class="table table-condensed" data-mobile-responsive="true"></table>
</div>
</div>
</div>
</div>
</div>
</body>
@endsection
@section('footer')
<script src="{{asset('js/plugins/zTree_v3-master/js/jquery.ztree.core.min.js')}}"></script>
<script src="{{asset('js/plugins/zTree_v3-master/js/jquery.ztree.exedit.min.js')}}"></script>
<script>
var units = {
search: function () {
tips.selectPage();
},
getIdsBySelections: function () {
var selections = $("#table").bootstrapTable('getSelections');
var ids = [];
$.each(selections, function (inx, val) {
ids.push(val.id);
});
return ids;
},
saveView: function (id, type) { //功能权限添加修改 带 type的 是菜单权限添加一级菜单
if (id === 0 && type !== 1) {
var nodes = zTreeObj.getSelectedNodes();
// console.log(nodes);
if (nodes.length === 0) {
layer.alert('请先在左侧菜单选择你要添加的位置', {icon: 0});
return;
}
}
var url = '/admin/system/permissions/' + id + '?type=2';
if (type === 1) {
url = '/admin/system/permissions/' + id + '?type=1';
}
layer.open({
type: 2,
content: url,
area: ['60%', '50%'],
title: '保存',
btn: ['确认', '取消'],
yes: function (index, layero) {
var son = $(layero).find('iframe')[0].contentWindow;
var data = son.tips.getFormValues('#form');
layer.close(index);
data.type = 2;
if (type === 1) { // 菜单权限添加一级菜单
data.type = 1;
data.parent_id = 0;
} else {
if (id === 0) {
data.parent_id= nodes[0].id
}
}
var config = {
type: 'PUT',
url: url,
data: data,
success: function (result) {
if (type === 1) {
zTreeObj.addNodes(null, {
id: result.data.id,
pId: result.data.parent_id,
name: result.data.title
});
} else {
layer.msg(result.message, {icon: 6, time: 1500}, function () {
tips.tableRefresh('#table');
});
}
}
};
tips.ajax(config);
}
});
},
batchDelete: function () {
var ids = units.getIdsBySelections();
if (ids.length === 0) {
layer.alert('请先选择您所要操作的对象');
return;
}
layer.confirm('您确定要删除吗?', {icon: 3, title: '删除信息'}, function () {
tips.ajax({url: '/admin/system/permissions', type: 'delete', data: {ids: ids}});
tips.tableRefresh('#table');
});
},
addHoverDom: function (treeId, treeNode) {
var sObj = $("#" + treeNode.tId + "_span");
var addBtn = "#addBtn_" + treeNode.tId;
// if (treeNode.editNameFlag || $("#addBtn_" + treeNode.tId).length > 0) return;
if (treeNode.editNameFlag || $(addBtn).length > 0) return;
var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
+ "' title='add node' onfocus='this.blur();'></span>" +
"<span class='button reset' id='resetBtn_" + treeNode.tId + "' title='reset node' onfocus='this.blur();'></span>";
sObj.after(addStr);
var btn = $(addBtn);
if (btn) btn.bind("click", function () { //菜单权限添加
layer.open({
type: 2,
content: ['/admin/system/permissions/0?type=1'],
area: ['60%', '60%'],
title: '保存',
btn: ['确认', '取消'],
yes: function (index, layero) {
var son = $(layero).find('iframe')[0].contentWindow;
var data = son.tips.getFormValues('#form');
data.type = 1;
data.parent_id = treeNode.id;
var config = {
type: 'PUT',
url: '/admin/system/permissions/0',
data: data,
success: function (result) {
layer.msg(result.message, {icon: 6, time: 1500}, function () {
layer.close(index);
});
zTreeObj.addNodes(treeNode, {
id: result.data.id,
pId: result.data.parent_id,
name: result.data.title
});
}
};
tips.ajax(config);
}
});
return false;
});
var resetBtn = $("#resetBtn_" + treeNode.tId);
if (resetBtn) resetBtn.bind("click", function () { //菜单权限修改
layer.open({
type: 2,
content: ['/admin/system/permissions/' + treeNode.id + '?type=1'],
area: ['60%', '60%'],
title: '保存',
btn: ['确认', '取消'],
yes: function (index, layero) {
var son = $(layero).find('iframe')[0].contentWindow;
var data = son.tips.getFormValues('#form');
data.type = 1;
var config = {
type: 'PUT',
url: '/admin/system/permissions/' + treeNode.id,
data: data,
success: function (result) {
layer.msg(result.message, {icon: 6, time: 1500}, function () {
layer.close(index);
});
treeNode.name = result.data.title;
zTreeObj.updateNode(treeNode);
}
};
tips.ajax(config);
}
});
return false;
});
}
};
var zTreeObj;
// zTree 的参数配置，深入使用请参考 API 文档（setting 配置详解）
var setting = {
callback: {
onClick: function (event, treeId, treeNode) {
config.otherParams = {parentId: treeNode.id};
tips.tableRefresh();
},
beforeRemove: function (treeId, treeNode) {
zTreeObj.selectNode(treeNode);
layer.confirm('是否删除所有选中的数据？', {icon: 3, title: '提示'}, function (index) {
layer.close(index);
var config = {
type: 'delete',
url: '/admin/system/permissions/' + treeNode.id,
success: function (result) {
layer.msg(result.message, {icon: 6, time: 1500}, function () {
layer.close(index);
});
zTreeObj.removeNode(treeNode);
}
};
tips.ajax(config);
});
return false;
}
},
edit: {
enable: true,
showRenameBtn: false,
showRemoveBtn: true
},
view: {
addHoverDom: units.addHoverDom,
removeHoverDom: function (treeId, treeNode) {
$("#addBtn_" + treeNode.tId).unbind().remove();
$("#resetBtn_" + treeNode.tId).unbind().remove();
},
selectedMulti: false
}
};
// zTree 的数据属性，深入使用请参考 API 文档（zTreeNode 节点数据详解）
var trees = JSON.parse('{!! json_encode($trees) !!}');
$(document).ready(function () {
zTreeObj = $.fn.zTree.init($("#treeDemo"), setting, trees);
});
var config = {};
config.url = '/admin/system/permissions';
config.columns = [ //字段
/*{checkbox: true},*/
{
title: '序号', align: 'center', formatter: function (value, item, index) {
return index + 1;
}
},
{title: '名称', field: 'title', align: 'center'},
{title: '规则', field: 'rule', align: 'center'},
{title: '创建时间', field: 'created_at', align: 'center'},
{
title: '操作', field: 'id', align: 'center',
formatter: function (value) {
return (
'<button onclick="units.saveView(' + value + ')" class="btn btn-xs"><span class="glyphicon glyphicon-edit"></span>编辑</button>'
// '<button onclick="units.detail(' + value + ')" class="btn btn-xs"><span class="glyphicon glyphicon-menu-hamburger"></span>详情</button>'
);
}
}
];
tips.bootstrapTable(config);
$(document).on('click', '#on', function () {
var ids = units.getIdsBySelections();
if (ids.length === 0) {
layer.alert('请先选择您所要操作的对象');
return;
}
tips.ajax({url: '/admin/system/users/on', type: 'put', data: {ids: ids}});
tips.tableRefresh('#table');
});
$(document).on('click', '#off', function () {
var ids = units.getIdsBySelections();
if (ids.length === 0) {
layer.alert('请先选择您所要操作的对象');
return;
}
tips.ajax({url: '/admin/system/users/off', type: 'put', data: {ids: ids}});
tips.tableRefresh('#table');
});
$(document).on('click', '#add', function () {
layer.open({
type: 2,
content: ['/admin/system/user/show/0'],
area: ['60%', '70%'],
title: '添加用户'
});
});
</script>
@endsection