104 lines
3.3 KiB
PHP
104 lines
3.3 KiB
PHP
<div class="{{$viewClass['form-group']}}">
|
|
|
|
<label class="{{$viewClass['label']}} control-label">{!! $label !!}</label>
|
|
|
|
<div class="{{$viewClass['field']}}">
|
|
|
|
@include('admin::form.error')
|
|
|
|
<div class="{{ $class }}" style="padding-left: 40px;" >
|
|
<el-tree
|
|
show-checkbox
|
|
node-key="id"
|
|
ref="tree"
|
|
highlight-current
|
|
:data="permissionNodes"
|
|
:indent="25"
|
|
:render-after-expand="false"
|
|
:default-expand-all="true"
|
|
:default-checked-keys="defaultKeys"
|
|
:props="defaultProps" v-on:check-change="nodeChange">
|
|
<span class="custom-tree-node" slot-scope="{ node, permissionNodes }" >
|
|
<span v-on:click="getCheckedNode(node)">@{{ node.label }}</span>
|
|
<template v-if="node.level==1">
|
|
<span class="tran el-icon-arrow-right" :class="{isactive:node.expanded}"></span>
|
|
</template>
|
|
</span>
|
|
</el-tree>
|
|
|
|
<input type="hidden" ref="format_attr_value" name="format_attr_value" value="{{ $value }}">
|
|
<input type="hidden" name="{{ $name }}" :value="getCheck">
|
|
</div>
|
|
@include('admin::form.help-block')
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<script init="{!! $selector !!}">
|
|
|
|
var app = new Vue({
|
|
el: '#' + id,
|
|
data: {
|
|
defaultProps: {
|
|
children: 'children',
|
|
label: 'label'
|
|
},
|
|
checkPermissions:[],
|
|
defaultKeys:[],
|
|
permissionNodes:[]
|
|
},
|
|
computed: {
|
|
getCheck() {
|
|
// console.log(this.checkPermissions);
|
|
return JSON.stringify(this.checkPermissions);
|
|
}
|
|
},
|
|
created() {
|
|
this.createStart()
|
|
},
|
|
methods:{
|
|
createStart(){
|
|
//初始化权限可选项;
|
|
var url_path = "{{ admin_route('api.get_permissions') }}";
|
|
var that = this;
|
|
$.ajax({
|
|
type: 'get',
|
|
dataType: 'json',
|
|
url: url_path,
|
|
success: function (result) {
|
|
that.permissionNodes = result;
|
|
}
|
|
})
|
|
|
|
setTimeout(()=>{
|
|
var formatAttrValue = this.$refs.format_attr_value.defaultValue
|
|
//编辑时默认选中项
|
|
if(formatAttrValue){
|
|
formatAttrValue = JSON.parse(formatAttrValue)
|
|
// console.log(formatAttrValue)
|
|
//赋予defaultKeys值
|
|
this.defaultKeys = formatAttrValue
|
|
this.checkPermissions = formatAttrValue;
|
|
}
|
|
}, 100)
|
|
},
|
|
getCheckedNode(node){
|
|
if(this.checkPermissions.indexOf(node.key) != -1){//如果该节点已存在，则取消选中
|
|
this.$refs.tree.setChecked(node, false);
|
|
}else{
|
|
this.$refs.tree.setChecked(node, true);
|
|
}
|
|
},
|
|
nodeChange(node, hasChecked, childrenNodes){
|
|
if(node.children.length == 0){
|
|
if(hasChecked){
|
|
this.checkPermissions.push(node.id);
|
|
}else{
|
|
this.checkPermissions.splice(this.checkPermissions.indexOf(node.id), 1);
|
|
}
|
|
}
|
|
},
|
|
}
|
|
})
|
|
</script>
|