231 lines
11 KiB
HTML
231 lines
11 KiB
HTML
|
{extend name="$_admin_base_layout" /}
|
||
|
|
|
||
|
|
{block name="style"}
|
||
|
|
<link href="__LIBS__/jstree/themes/default/style.min.css" rel="stylesheet" />
|
||
|
|
{/block}
|
||
|
|
|
||
|
|
{block name="content"}
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-md-12">
|
||
|
|
<div class="block">
|
||
|
|
<ul class="nav nav-tabs" data-toggle="tabs">
|
||
|
|
<li class="active">
|
||
|
|
<a href="#tab1">角色信息</a>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<a href="#tab2">访问授权</a>
|
||
|
|
</li>
|
||
|
|
<li class="pull-right">
|
||
|
|
<ul class="block-options push-10-t push-10-r">
|
||
|
|
<li>
|
||
|
|
<button type="button" data-toggle="block-option" data-action="fullscreen_toggle"></button>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<button type="button" data-toggle="block-option" data-action="refresh_toggle" data-action-mode="demo"><i class="si si-refresh"></i></button>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<button type="button" data-toggle="block-option" data-action="content_toggle"></button>
|
||
|
|
</li>
|
||
|
|
<li>
|
||
|
|
<button type="button" data-toggle="block-option" data-action="close"><i class="si si-close"></i></button>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
|
||
|
|
<form name="form-builder" id="form" class="form-horizontal form-builder">
|
||
|
|
<div class="block-content tab-content">
|
||
|
|
<div class="tab-pane fade in active push-20" id="tab1">
|
||
|
|
<div class="form-group">
|
||
|
|
<label class="col-xs-12" for="pid">所属角色</label>
|
||
|
|
<div class="col-sm-12">
|
||
|
|
<select class="form-control" id="pid" name="pid">
|
||
|
|
<option value="">请选择：</option>
|
||
|
|
{volist name="role_list" id="role"}
|
||
|
|
<option value="{$key}">{$role|raw}</option>
|
||
|
|
{/volist}
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label class="col-xs-12" for="title">角色名称</label>
|
||
|
|
<div class="col-sm-12">
|
||
|
|
<input class="form-control" type="text" id="title" name="name" value="" placeholder="请输入角色名称">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label class="col-xs-12" for="description">角色描述</label>
|
||
|
|
<div class="col-sm-12">
|
||
|
|
<textarea class="form-control" id="description" rows="7" name="description" placeholder="请输入角色描述"></textarea>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label class="col-xs-12" for="pid">默认模块</label>
|
||
|
|
<div class="col-sm-12">
|
||
|
|
<select class="form-control" id="default_module" name="default_module">
|
||
|
|
{volist name="module_list" id="module"}
|
||
|
|
<option value="{$key}">{$module|raw}</option>
|
||
|
|
{/volist}
|
||
|
|
</select>
|
||
|
|
<div class="help-block">该角色登录后，默认跳转的模块。注意，该角色必须有该模块的节点访问权限。</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label class="col-xs-12">是否可登录后台</label>
|
||
|
|
<div class="col-xs-12">
|
||
|
|
<label class="css-input css-radio css-radio-primary css-radio-sm push-10-r">
|
||
|
|
<input type="radio" name="access" id="access1" value="0" checked="">
|
||
|
|
<span></span> 否</label>
|
||
|
|
<label class="css-input css-radio css-radio-primary css-radio-sm push-10-r">
|
||
|
|
<input type="radio" name="access" id="access2" value="1">
|
||
|
|
<span></span> 是</label>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group">
|
||
|
|
<label class="col-xs-12" for="sort">排序</label>
|
||
|
|
<div class="col-sm-12">
|
||
|
|
<input class="form-control" type="text" id="sort" name="sort" value="100" placeholder="请输入排序">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="tab-pane fade auth-node" id="tab2">
|
||
|
|
<div class="row data-table-toolbar">
|
||
|
|
<div class="col-sm-12">
|
||
|
|
<div class="toolbar-btn-action">
|
||
|
|
<button title="全选" type="button" class="btn btn-info" id="check-all"><i class="fa fa-check-circle-o"></i> 全选</button>
|
||
|
|
<button title="取消全选" type="button" class="btn btn-danger" id="uncheck-all"><i class="fa fa-ban"></i> 取消全选</button>
|
||
|
|
<button title="展开所有节点" type="button" class="btn btn-success" id="expand-all"><i class="fa fa-plus"></i> 展开所有节点</button>
|
||
|
|
<button title="收起所有节点" type="button" class="btn btn-warning" id="collapse-all"><i class="fa fa-minus"></i> 收起所有节点</button>
|
||
|
|
<span class="form-inline">
|
||
|
|
<input class="form-control" id="search-auth" onkeydown="if(event.keyCode === 13){return false;}" type="text" value="" placeholder="输入关键字搜索">
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{notempty name="menus"}
|
||
|
|
<div class="block">
|
||
|
|
<ul class="nav nav-tabs nav-tabs-alt" data-toggle="tabs" id="menu-tab">
|
||
|
|
{volist name="menus" id="vo"}
|
||
|
|
<li class="{$curr_tab == $key ?= 'active'}">
|
||
|
|
<a href="#{$key}" data-tab="{$key}">{$vo.title}</a>
|
||
|
|
</li>
|
||
|
|
{/volist}
|
||
|
|
</ul>
|
||
|
|
<div class="block-content tab-content">
|
||
|
|
{volist name="menus" id="vo"}
|
||
|
|
<div class="tab-pane {$curr_tab == $key ?= 'active'}" id="{$key}">
|
||
|
|
<div class="push js-tree" data-tab="{$key}">{$vo.menus|raw|default=''}</div>
|
||
|
|
</div>
|
||
|
|
{/volist}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{else/}
|
||
|
|
<p class="text-center text-muted">暂无可分配节点</p>
|
||
|
|
{/notempty}
|
||
|
|
</div>
|
||
|
|
<div class="push-20">
|
||
|
|
<button class="btn btn-minw btn-primary" type="submit">
|
||
|
|
确定
|
||
|
|
</button>
|
||
|
|
<button class="btn btn-default" type="button" onclick="javascript:history.back(-1);return false;">
|
||
|
|
返回
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{/block}
|
||
|
|
|
||
|
|
{block name="script"}
|
||
|
|
<script src="__LIBS__/jstree/jstree.min.js"></script>
|
||
|
|
<script>
|
||
|
|
$(document).ready(function(){
|
||
|
|
const $tree_list = {};
|
||
|
|
const $key_auth = {};
|
||
|
|
let curr_tab = '{$curr_tab}';
|
||
|
|
|
||
|
|
// 切换节点tab
|
||
|
|
$('#menu-tab > li > a').click(function () {
|
||
|
|
curr_tab = $(this).data('tab');
|
||
|
|
$('#search-auth').val($key_auth[curr_tab]);
|
||
|
|
});
|
||
|
|
// 初始化节点
|
||
|
|
$('.js-tree').each(function () {
|
||
|
|
const $tree = $(this);
|
||
|
|
const tab = $(this).data('tab');
|
||
|
|
|
||
|
|
$key_auth[tab] = '';
|
||
|
|
|
||
|
|
$tree.jstree({
|
||
|
|
plugins: ["checkbox", "search"],
|
||
|
|
"checkbox" : {
|
||
|
|
"keep_selected_style" : false,
|
||
|
|
"three_state" : false,
|
||
|
|
"cascade" : 'down+up'
|
||
|
|
},
|
||
|
|
"search" : {
|
||
|
|
'show_only_matches' : true,
|
||
|
|
'show_only_matches_children' : true
|
||
|
|
}
|
||
|
|
});
|
||
|
|
$tree_list[tab] = $tree;
|
||
|
|
});
|
||
|
|
|
||
|
|
// 全选
|
||
|
|
$('#check-all').click(function () {
|
||
|
|
$tree_list[curr_tab].jstree(true).check_all();
|
||
|
|
});
|
||
|
|
// 取消全选
|
||
|
|
$('#uncheck-all').click(function () {
|
||
|
|
$tree_list[curr_tab].jstree(true).uncheck_all();
|
||
|
|
});
|
||
|
|
// 展开所有
|
||
|
|
$('#expand-all').click(function () {
|
||
|
|
$tree_list[curr_tab].jstree(true).open_all();
|
||
|
|
});
|
||
|
|
// 收起所有
|
||
|
|
$('#collapse-all').click(function () {
|
||
|
|
$tree_list[curr_tab].jstree(true).close_all();
|
||
|
|
});
|
||
|
|
|
||
|
|
var to = false;
|
||
|
|
$('#search-auth').keyup(function (event) {
|
||
|
|
if(to) { clearTimeout(to); }
|
||
|
|
to = setTimeout(function () {
|
||
|
|
var v = $('#search-auth').val();
|
||
|
|
$key_auth[curr_tab] = v;
|
||
|
|
$tree_list[curr_tab].jstree(true).search(v);
|
||
|
|
}, 250);
|
||
|
|
});
|
||
|
|
|
||
|
|
// 提交表单
|
||
|
|
$('#form').submit(function () {
|
||
|
|
var form_data = $(this).serialize();
|
||
|
|
var auth_node = [];
|
||
|
|
$.each($tree_list, function () {
|
||
|
|
auth_node.push.apply(auth_node, $(this).jstree(true).get_checked());
|
||
|
|
});
|
||
|
|
|
||
|
|
if (auth_node.length) {
|
||
|
|
form_data += '&menu_auth='+auth_node.join(',');
|
||
|
|
}
|
||
|
|
$.post("{:url('')}", form_data).success(function (res) {
|
||
|
|
if (res.code) {
|
||
|
|
Dolphin.notify(res.msg, 'success');
|
||
|
|
setTimeout(function () {
|
||
|
|
location.href = res.url;
|
||
|
|
}, 1500);
|
||
|
|
} else {
|
||
|
|
Dolphin.notify(res.msg, 'danger');
|
||
|
|
}
|
||
|
|
}).fail(function () {
|
||
|
|
Dolphin.notify('服务器发生错误~', 'danger');
|
||
|
|
});
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
{/block}
|