提交 692c6bf1 编写于 作者: laizhilong's avatar laizhilong

三棵树添加搜索,去掉重复的视图

上级 4be48599
.sys-role-permission-custom-view{
.ivu-tabs-no-animation>.ivu-tabs-content{
padding: 0 4px !important;
}
.sys-permissionmpickup-view{
position: relative;
.tree-right-menu {
.ivu-divider-horizontal {
width: calc(100% - 32px);
min-width: calc(100% - 32px);
margin: 0 auto;
}
.ivu-dropdown-item {
position: relative;
padding-left: 32px;
> i {
position: absolute;
left: 16px;
top: 10px;
}
.ivu-icon-ios-arrow-forward {
left: initial;
right: 4px;
}
}
.ivu-dropdown {
.ivu-select-dropdown {
margin: 0;
}
}
}
.text{
font-weight: 700;color: #303133;font-size: 15px;margin-left:10px;margin-top:20px;
}
.col{
display: inline-block;
width: 400px;
}
.search{
width:200px;margin-left:20px;margin-top:30px;margin-bottom:20px;
}
.save{
margin-top:30px;margin-bottom:20px;margin-left:40px;
}
.roll{
height:calc(100vh - 370px);
overflow:hidden;
overflow-x: hidden;
overflow-y: scroll;
padding-right: 18px;
}
.tre{
margin-left:20px;
}
}
selector::-webkit-scrollbar{
width:0;
}
.pickup-view {
>.translate-contant {
flex-grow: 1;
display: flex;
justify-content: flex-end;
height: calc(100% - 64px);
.translate-buttons {
width: 80px;
display: flex;
align-items: center;
text-align: center;
button {
margin-bottom: 5px;
}
}
.left, .right {
width: 300px;
}
.right {
border: 1px solid #e9e9e9;
.mpicker-select {
font-family: helvetica, sans-serif;
font-size: 16px;
text-align: justify;
word-spacing: -3.8pt;
line-height: 1.6;
font-weight: bold;
word-spacing: 10px;
//height: 100%;
overflow: auto;
}
.mpicker-select > div {
padding: 3px 10px;
font-size: 14px;
color: rgba(0, 0, 0, 0.85);
font-weight: initial;
cursor: pointer;
min-height: 28px;
border: 1px solid #e9e9e9;
margin: 4px 4px;
transition: all .3s;
}
.mpicker-select > div:hover {
background: #ecf6fd;
}
.mpicker-select > .select{
color: #108ee9;
background: #ecf6fd;
}
}
.center{
width: calc(100% - 380px);
.pickupviewpanel {
width: 100%;
//height: 100%;
}
}
}
}
.view-permissionmp-center{
padding: 0 !important;
}
// this is less
<template>
<div class="view-container dempickupview sys-permissionmpickup-view">
<card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :padding="0" :bordered="false">
<div class="content-container pickup-view">
<div class="translate-contant">
<!--应用菜单-->
<div class="center" :style="{width : '33%',border:'1px solid #dcdee2', margin: '0 10px 0 0'}">
<context-menu-container class='design-tree-container'>
<div>
<!--<div class="text">应用菜单</div>-->
<div style="margin: 20px 20px 0 20px;">
<el-input size="medium" placeholder="搜索应用菜单..." v-model="CDtreefilterText" @input="filterChangeCDtree">
<i slot="prefix" class="el-input__icon el-icon-search"></i>
</el-input>
</div>
<div class="roll">
<el-tree
:filter-node-method="fiterNode"
class="tre"
:data="this.CDdata"
ref="CDtree"
show-checkbox
node-key="id"
:default-expand-all="false"
highlight-current
:default-expanded-keys="this.CDdataexpandedKeys"
:props="this.defaultProps"
@check-change="handleCheckChange"
>
</el-tree>
</div>
</div>
</context-menu-container>
</div>
<!--数据能力-->
<div class="center" :style="{width : '33%',border:'1px solid #dcdee2', margin: '0 10px 0 0' }">
<context-menu-container class='design-tree-container'>
<div>
<!--<div class="text">数据能力</div>-->
<div style="margin: 20px 20px 0 20px;">
<el-input size="medium" placeholder="搜索数据能力..." v-model="QXtreefilterText" @input="filterChangeQXtree">
<i slot="prefix" class="el-input__icon el-icon-search"></i>
</el-input>
</div>
<div class="roll">
<el-tree
:filter-node-method="fiterNode"
class="tre"
:data="this.QXdata"
ref="QXtree"
show-checkbox
node-key="id"
:default-expand-all="false"
highlight-current
:default-expanded-keys="this.QXdataexpandedKeys"
:props="this.defaultProps"
@check-change="handleCheckChange"
>
</el-tree>
</div>
</div>
</context-menu-container>
</div>
<!--统一资源-->
<div class="center" :style="{width : '33%',border:'1px solid #dcdee2' }">
<context-menu-container class='design-tree-container'>
<div>
<!--<div class="text">统一资源</div>-->
<div style="margin: 20px 20px 0 20px;">
<el-input size="medium" placeholder="搜索自定义资源..." v-model="ZYtreefilterText" @input="filterChangeZYtree">
<i slot="prefix" class="el-input__icon el-icon-search"></i>
</el-input>
</div>
<div class="roll">
<el-tree
:filter-node-method="fiterNode"
class="tre"
:data="this.ZYdata"
ref="ZYtree"
show-checkbox
node-key="id"
:default-expand-all="false"
highlight-current
:default-expanded-keys="this.ZYdataexpandedKeys"
:props="this.defaultProps"
@check-change="handleCheckChange"
>
</el-tree>
</div>
</div>
</context-menu-container>
</div>
</div>
</div>
</card>
</div>
</template>
<script lang='tsx'>
import { Component } from 'vue-property-decorator';
import SysRolePermissionCustomViewBase from './sys-role-permission-custom-view-base.vue';
@Component({
components: {
},
beforeRouteEnter: (to: any, from: any, next: any) => {
next((vm: any) => {
if(!Object.is(vm.navModel,"route")){
vm.initNavDataWithTab(vm.viewCacheData);
}
vm.$store.commit('addCurPageViewtag', { fullPath: to.fullPath, viewtag: vm.viewtag });
});
},
})
export default class SysRolePermissionCustomView extends SysRolePermissionCustomViewBase {
}
</script>
\ No newline at end of file
import {Component, Prop, Vue} from 'vue-property-decorator';
import view_pickupviewpanel
from '@widgets/sys-permission/mpickup-viewpickupviewpanel-pickupviewpanel/mpickup-viewpickupviewpanel-pickupviewpanel.vue';
import ContextMenuContainer from "@components/context-menu-container/context-menu-container.vue";
import {Subject} from "rxjs";
@Component({
components: {
ContextMenuContainer,
view_pickupviewpanel,
},
beforeRouteEnter: (to: any, from: any, next: any) => {
next((vm: any) => {
vm.$store.commit('addCurPageViewtag', {fullPath: to.fullPath, viewtag: vm.viewtag});
});
},
})
export default class SYS_ROLE_PERMISSIONCustomView extends Vue {
// 应用菜单树搜索文本
public CDtreefilterText:any = '';
// 数据能力树搜索文本
public QXtreefilterText:any = '';
// 统一资源树搜索文本
public ZYtreefilterText:any = '';
/**
* 过滤节点
*/
public fiterNode(value:any,data:any){
if (!value) return true;
return data.label.indexOf(value) !==-1;
}
/**
* 应用菜单树搜索触发
*/
public filterChangeCDtree(){
const CDtree:any = this.$refs.CDtree;
CDtree.filter(this.CDtreefilterText);
}
/**
* 数据能力树搜索触发
*/
public filterChangeQXtree(){
const QXtree:any = this.$refs.QXtree;
QXtree.filter(this.QXtreefilterText);
}
/**
* 统一资源树搜索触发
*/
public filterChangeZYtree(){
const ZYtree:any = this.$refs.ZYtree;
ZYtree.filter(this.ZYtreefilterText);
}
/*应用菜单数据*/
protected CDdata: any = [];
/*数据能力数据*/
protected QXdata: any = [];
/*统一资源数据*/
protected ZYdata: any = [];
/*默认选中节点*/
protected defaultCheckedNodes: any = [];
/*应用菜单数据默认展开节点*/
protected CDdataexpandedKeys: any = [];
/*数据能力数据默认展开节点*/
protected QXdataexpandedKeys: any = [];
/*统一资源数据默认展开节点*/
protected ZYdataexpandedKeys: any = [];
/**
* 树显示说明:子树为节点对象的children,节点标签为节点对象的label
*/
protected defaultProps: any = {
children: 'children',
label: 'label'
}
/**
* 选中数据
*/
protected selectData: any = {};
/**
* 初始选中的数据
*/
protected ininselectData: any = {};
/**
* 视图选中数据
*/
public viewSelections: any[] = [];
/**
* 父数据
*/
protected parentData: any = {};
/**
* 父数据主键
*/
protected srfparentkey: any;
/**
* 视图标识
*
* @type {string}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public viewtag: string = 'e791be173ed0f4bbe9cce942b6edde63';
/**
* 是否嵌入关系界面
*
* @type {boolean}
* @memberof SYS_USER_ROLEGridViewBase
*/
@Prop({default:false}) public isformDruipart?: boolean;
/**
* 界面关系通讯对象
*
* @type {Subject<ViewState>}
* @memberof SYS_USER_ROLEGridViewBase
*/
@Prop() public formDruipart?: Subject<ViewState>;
/**
* 应用上下文
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public context:any = {};
/**
* 视图参数
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public viewparams:any = {};
/**
* 传入视图上下文
*
* @type {string}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
@Prop() public viewdata!: string;
/**
* 视图默认使用
*
* @type {boolean}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
@Prop({ default: true }) public viewDefaultUsage!: boolean;
/**
* 自定义视图导航上下文集合
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public customViewNavContexts:any ={};
/**
* 自定义视图导航参数集合
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public customViewParams:any ={};
/**
* 解析视图参数
*
* @public
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public parseViewParam(): void {
for(let key in this.context){
delete this.context[key];
}
if (!this.viewDefaultUsage && this.viewdata && !Object.is(this.viewdata, '')) {
Object.assign(this.context, JSON.parse(this.viewdata));
if(this.context && this.context.srfparentdename){
Object.assign(this.viewparams,{srfparentdename:this.context.srfparentdename});
}
if(this.context && this.context.srfparentkey){
Object.assign(this.viewparams,{srfparentkey:this.context.srfparentkey});
}
this.handleCustomViewData();
return;
}
const path = (this.$route.matched[this.$route.matched.length - 1]).path;
const keys: Array<any> = [];
const curReg = this.$pathToRegExp.pathToRegexp(path, keys);
const matchArray = curReg.exec(this.$route.path);
let tempValue: Object = {};
keys.forEach((item: any, index: number) => {
Object.defineProperty(tempValue, item.name, {
enumerable: true,
value: matchArray[index + 1]
});
});
this.$viewTool.formatRouteParams(tempValue,this.$route,this.context,this.viewparams);
if(this.$store.getters.getAppData() && this.$store.getters.getAppData().context){
Object.assign(this.context,this.$store.getters.getAppData().context);
}
//初始化视图唯一标识
Object.assign(this.context,{srfsessionid:this.$util.createUUID()});
this.handleCustomViewData();
}
/**
* 处理自定义视图数据
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public handleCustomViewData(){
if(Object.keys(this.customViewNavContexts).length > 0){
Object.keys(this.customViewNavContexts).forEach((item:any) =>{
let tempContext:any = {};
let curNavContext:any = this.customViewNavContexts[item];
this.handleCustomDataLogic(curNavContext,tempContext,item);
Object.assign(this.context,tempContext);
})
}
if(Object.keys(this.customViewParams).length > 0){
Object.keys(this.customViewParams).forEach((item:any) =>{
let tempParam:any = {};
let curNavParam:any = this.customViewParams[item];
this.handleCustomDataLogic(curNavParam,tempParam,item);
Object.assign(this.viewparams,tempParam);
})
}
}
/**
* 处理自定义视图数据逻辑
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public handleCustomDataLogic(curNavData:any,tempData:any,item:string){
// 直接值直接赋值
if(curNavData.isRawValue){
if(Object.is(curNavData.value,"null") || Object.is(curNavData.value,"")){
Object.defineProperty(tempData, item.toLowerCase(), {
value: null,
writable : true,
enumerable : true,
configurable : true
});
}else{
Object.defineProperty(tempData, item.toLowerCase(), {
value: curNavData.value,
writable : true,
enumerable : true,
configurable : true
});
}
}else{
// 先从导航上下文取数,没有再从导航参数(URL)取数,如果导航上下文和导航参数都没有则为null
if(this.context[(curNavData.value).toLowerCase()]){
Object.defineProperty(tempData, item.toLowerCase(), {
value: this.context[(curNavData.value).toLowerCase()],
writable : true,
enumerable : true,
configurable : true
});
}else{
if(this.viewparams[(curNavData.value).toLowerCase()]){
Object.defineProperty(tempData, item.toLowerCase(), {
value: this.viewparams[(curNavData.value).toLowerCase()],
writable : true,
enumerable : true,
configurable : true
});
}else{
Object.defineProperty(tempData, item.toLowerCase(), {
value: null,
writable : true,
enumerable : true,
configurable : true
});
}
}
}
}
/**
* vue 创建
*/
public created() {
this.afterCreated();
}
/**
* 执行created后的逻辑
*
* @memberof SYS_USER_ROLEGridViewBase
*/
public afterCreated(){
const secondtag = this.$util.createUUID();
this.$store.commit('viewaction/createdView', { viewtag: this.viewtag, secondtag: secondtag });
this.viewtag = secondtag;
this.parseViewParam();
const _this: any = this;
// 获取父数据
if (_this && _this.viewdata) {
_this.parentData = JSON.parse(_this.viewdata);
}
if (_this.parentData && _this.parentData.sysrole) {
// console.log("当前角色id:" + _this.parentData.sysrole);
_this.srfparentkey = _this.parentData.sysrole;
}
// 监听父页面
if(this.formDruipart){
this.formDruipart.subscribe((res:any) =>{
if(Object.is(res.action,'load')){
// 如果是新建角色保存,需要从res中获取父数据主键
if (res.data) {
let parentData = res.data;
this.srfparentkey = parentData.srfparentkey;
}
// 父数据保存时调用当前视图的事件
if(this.selectData.length>0){
// 选中了数据
this.onClickOk();
}else{
// 没选中数据
this.onClear();
}
}
});
}
}
/**
* vue 挂载
*/
public mounted() {
this.initTree();
}
/**
* 初始化树
*/
private initTree() {
const _this = this;
// get全部菜单和数据能力和统一资源的请求路径
const url = `sysroles/`+_this.srfparentkey+`/sysrolepermissions/tree`;
this.$http.get(url).then((response: any) => {
if (!response || response.status !== 200) {
this.$Notice.error({title: '错误', desc: response.message});
return;
} else {
// 给树赋值,数据结构在后台已经按照eltree格式化
_this.CDdata = response.data.APPMENU;
_this.QXdata = response.data.OPPRIV;
_this.ZYdata = response.data.UNIRES;
_this.defaultCheckedNodes = response.data.SELECTED;
// 设置默认第一级展开
for (let i = 0; i < _this.CDdata.length; i++) {
_this.CDdataexpandedKeys.push(_this.CDdata[i].id);
}
for (let i = 0; i < _this.QXdata.length; i++) {
_this.QXdataexpandedKeys.push(_this.QXdata[i].id);
}
for (let i = 0; i < _this.ZYdata.length; i++) {
_this.ZYdataexpandedKeys.push(_this.ZYdata[i].id);
}
// 设置默认选中节点,即当前角色所有权限
this.$nextTick(()=>{
const CDtree: any = this.$refs.CDtree;
const QXtree: any = this.$refs.QXtree;
const ZYtree: any = this.$refs.ZYtree;
CDtree.setCheckedNodes(_this.defaultCheckedNodes);
QXtree.setCheckedNodes(_this.defaultCheckedNodes);
ZYtree.setCheckedNodes(_this.defaultCheckedNodes);
// 保存初始选中的节点数据,便于后续保存时比较
const arr = CDtree.getCheckedNodes().concat(QXtree.getCheckedNodes()).concat(ZYtree.getCheckedNodes());
this.ininselectData = arr;
});
}
}).catch((e) => {
console.log(e);
});
}
/**
* 销毁之前
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public beforeDestroy() {
// 清空选中数据
this.selectData = {};
// 清空视图选中数据
this.viewSelections = [];
this.$store.commit('viewaction/removeView', this.viewtag);
}
/**
* 处理选中节点
*/
protected handleCheckChange() {
// console.log("SYS_PERMISSIONMPickupView执行了handleCheckChange")
// 获取当前三棵树
const CDtree: any = this.$refs.CDtree;
const QXtree: any = this.$refs.QXtree;
const ZYtree: any = this.$refs.ZYtree;
// 获取选中状态的节点
const arr = CDtree.getCheckedNodes().concat(QXtree.getCheckedNodes()).concat(ZYtree.getCheckedNodes());
this.selectData = arr;
// console.log("选中的node:" + JSON.stringify(this.selectData));
}
/**
* 容器模型
*/
public containerModel: any = {
view_okbtn: {name: 'okbtn', type: 'button', text: '确定', disabled: true},
};
/**
* 确定
*/
public onClickOk(): void {
// 处理选中的数据
if (this.selectData && this.selectData.length > 0) {
// 判断选中的数据和初始数据
if (JSON.stringify(this.selectData) == JSON.stringify(this.ininselectData)) {
return;
}
this.selectData.forEach((item: any) => {
let _itemTemp: any = JSON.parse(JSON.stringify(item));
let _item: any = {};
if (_itemTemp.type) {
_item.permissionid = _itemTemp.id;
_item.permissiontype = _itemTemp.type;
_item.permissionname = _itemTemp.fullName;
Object.assign(_item, {_select: false})
this.viewSelections.push(_item);
}
});
// 保存选中的权限信息
let url = '/sysroles/'+this.srfparentkey+'/sysrolepermissions/refreshbatch';
this.$http.post(url,this.viewSelections).then((response: any) => {
if (!(!response || response.status !== 200)) {
} else {
this.$Notice.error({title: '错误', desc: response.message});
return;
}
}).catch((e) => {
});
}
// 清空视图选中数据,避免重复添加
this.viewSelections = [];
}
/**
* 清除
*/
private onClear(){
// 未选中数据,即没有赋予任何权限,需要清除当前角色的所有权限
if (this.selectData.length==0) {
// 保存选中的权限信息
let url = '/sysroles/'+this.srfparentkey+'/sysrolepermissions/refreshbatch';
this.$http.post(url,[]).then((response: any) => {
if (!(!response || response.status !== 200)) {
} else {
this.$Notice.error({title: '错误', desc: response.message});
return;
}
}).catch((e) => {
});
}
}
}
</script>
<style lang='less'>
@import './sys-role-permission-custom-view';
</style>
\ No newline at end of file
<template>
<div class="view-container decustomview sys-role-permissioncustom-view">
<app-studioaction :viewTitle="$t(model.srfTitle)" viewName="sys_role_permissioncustomview"></app-studioaction>
<card class='view-card view-no-toolbar' :disHover="true" :padding="0" :bordered="false">
<div slot='title' class="header-container">
<span class='caption-info'>{{$t(model.srfTitle)}}</span>
</div>
<div class="content-container">
</div>
</card>
</div>
</template>
<script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator';
import { UIActionTool,Util } from '@/utils';
import NavDataService from '@/service/app/navdata-service';
import { Subject,Subscription } from 'rxjs';
import SysRolePermissionService from '@/service/sys-role-permission/sys-role-permission-service';
@Component({
components: {
},
})
export default class SYS_ROLE_PERMISSIONCustomViewBase extends Vue {
/**
* 实体服务对象
*
* @type {SysRolePermissionService}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public appEntityService: SysRolePermissionService = new SysRolePermissionService;
/**
* 计数器服务对象集合
*
* @type {Array<*>}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public counterServiceArray:Array<any> = [];
/**
* 数据变化
*
* @param {*} val
* @returns {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
@Emit()
public viewDatasChange(val: any):any {
return val;
}
/**
* 传入视图上下文
*
* @type {string}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
@Prop() public viewdata!: string;
/**
* 传入视图参数
*
* @type {string}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
@Prop() public viewparam!: string;
/**
* 视图默认使用
*
* @type {boolean}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
@Prop({ default: true }) public viewDefaultUsage!: boolean;
/**
* 视图默认使用
*
* @type {string}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
@Inject({from:'navModel',default: 'tab'})
public navModel!:string;
/**
* 视图标识
*
* @type {string}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public viewtag: string = 'e791be173ed0f4bbe9cce942b6edde63';
/**
* 自定义视图导航上下文集合
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public customViewNavContexts:any ={
};
/**
* 自定义视图导航参数集合
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public customViewParams:any ={
};
/**
* 视图模型数据
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public model: any = {
srfCaption: 'entities.sysrolepermission.views.customview.caption',
srfTitle: 'entities.sysrolepermission.views.customview.title',
srfSubTitle: 'entities.sysrolepermission.views.customview.subtitle',
dataInfo: ''
}
/**
* 视图参数变化
*
* @param {*} newVal
* @param {*} oldVal
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
@Watch('viewparam',{immediate: true, deep: true})
onParamData(newVal: any, oldVal: any) {
if(newVal){
for(let key in this.viewparams){
delete this.viewparams[key];
}
Object.assign(this.viewparams, JSON.parse(this.viewparam));
}
}
/**
* 处理应用上下文变化
*
* @param {*} newVal
* @param {*} oldVal
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
@Watch('viewdata')
onViewData(newVal: any, oldVal: any) {
const _this: any = this;
if (!Object.is(newVal, oldVal) && _this.engine) {
this.$nextTick(()=>{
_this.parseViewParam();
_this.engine.load();
});
}
}
/**
* 容器模型
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public containerModel: any = {
};
/**
* 计数器刷新
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public counterRefresh(){
const _this:any =this;
if(_this.counterServiceArray && _this.counterServiceArray.length >0){
_this.counterServiceArray.forEach((item:any) =>{
if(item.refreshData && item.refreshData instanceof Function){
item.refreshData();
}
})
}
}
/**
* 视图状态订阅对象
*
* @public
* @type {Subject<{action: string, data: any}>}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public viewState: Subject<ViewState> = new Subject();
/**
* 引擎初始化
*
* @public
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public engineInit(): void {
}
/**
* 应用导航服务
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public navDataService = NavDataService.getInstance(this.$store);
/**
* 导航服务事件
*
* @public
* @type {(Subscription | undefined)}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public serviceStateEvent: Subscription | undefined;
/**
* 应用上下文
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public context:any = {};
/**
* 视图参数
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public viewparams:any = {};
/**
* 视图缓存数据
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public viewCacheData:any;
/**
* 解析视图参数
*
* @public
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public parseViewParam(inputvalue:any = null): void {
for(let key in this.context){
delete this.context[key];
}
if (!this.viewDefaultUsage && this.viewdata && !Object.is(this.viewdata, '')) {
Object.assign(this.context, JSON.parse(this.viewdata));
if(this.context && this.context.srfparentdename){
Object.assign(this.viewparams,{srfparentdename:this.context.srfparentdename});
}
if(this.context && this.context.srfparentkey){
Object.assign(this.viewparams,{srfparentkey:this.context.srfparentkey});
}
if(this.$store.getters.getAppData() && this.$store.getters.getAppData().context){
Object.assign(this.context,this.$store.getters.getAppData().context);
}
this.handleCustomViewData();
return;
}
const path = (this.$route.matched[this.$route.matched.length - 1]).path;
const keys: Array<any> = [];
const curReg = this.$pathToRegExp.pathToRegexp(path, keys);
const matchArray = curReg.exec(this.$route.path);
let tempValue: Object = {};
keys.forEach((item: any, index: number) => {
Object.defineProperty(tempValue, item.name, {
enumerable: true,
value: matchArray[index + 1]
});
});
this.$viewTool.formatRouteParams(tempValue,this.$route,this.context,this.viewparams);
if(inputvalue){
Object.assign(this.context,{'sysrolepermission':inputvalue});
}
if(this.$store.getters.getAppData() && this.$store.getters.getAppData().context){
Object.assign(this.context,this.$store.getters.getAppData().context);
}
//初始化视图唯一标识
Object.assign(this.context,{srfsessionid:this.$util.createUUID()});
this.handleCustomViewData();
//初始化导航数据
this.initNavDataWithRoute();
}
/**
* 处理自定义视图数据
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public handleCustomViewData(){
if(Object.keys(this.customViewNavContexts).length > 0){
Object.keys(this.customViewNavContexts).forEach((item:any) =>{
let tempContext:any = {};
let curNavContext:any = this.customViewNavContexts[item];
this.handleCustomDataLogic(curNavContext,tempContext,item);
Object.assign(this.context,tempContext);
})
}
if(Object.keys(this.customViewParams).length > 0){
Object.keys(this.customViewParams).forEach((item:any) =>{
let tempParam:any = {};
let curNavParam:any = this.customViewParams[item];
this.handleCustomDataLogic(curNavParam,tempParam,item);
Object.assign(this.viewparams,tempParam);
})
}
}
/**
* 处理自定义视图数据逻辑
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public handleCustomDataLogic(curNavData:any,tempData:any,item:string){
// 直接值直接赋值
if(curNavData.isRawValue){
if(Object.is(curNavData.value,"null") || Object.is(curNavData.value,"")){
Object.defineProperty(tempData, item.toLowerCase(), {
value: null,
writable : true,
enumerable : true,
configurable : true
});
}else{
Object.defineProperty(tempData, item.toLowerCase(), {
value: curNavData.value,
writable : true,
enumerable : true,
configurable : true
});
}
}else{
// 先从导航上下文取数,没有再从导航参数(URL)取数,如果导航上下文和导航参数都没有则为null
if(this.context[(curNavData.value).toLowerCase()]){
Object.defineProperty(tempData, item.toLowerCase(), {
value: this.context[(curNavData.value).toLowerCase()],
writable : true,
enumerable : true,
configurable : true
});
}else{
if(this.viewparams[(curNavData.value).toLowerCase()]){
Object.defineProperty(tempData, item.toLowerCase(), {
value: this.viewparams[(curNavData.value).toLowerCase()],
writable : true,
enumerable : true,
configurable : true
});
}else{
Object.defineProperty(tempData, item.toLowerCase(), {
value: null,
writable : true,
enumerable : true,
configurable : true
});
}
}
}
}
/**
* 初始化导航数据(路由模式)
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public initNavDataWithRoute(data:any = null, isNew:boolean = false, isAlways:boolean = false){
if( isAlways || (this.viewDefaultUsage && Object.is(this.navModel,"route")) ){
this.navDataService.addNavData({id:'sys-role-permissioncustom-view',tag:this.viewtag,srfkey:isNew ? null : this.context.sysrolepermission,title:this.$t(this.model.srfTitle),data:data,context:this.context,viewparams:this.viewparams,path:this.$route.fullPath});
}
}
/**
* 初始化导航数据(分页模式)
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public initNavDataWithTab(data:any = null,isOnlyAdd:boolean = true, isAlways:boolean = false){
if( isAlways || (this.viewDefaultUsage && !Object.is(this.navModel,"route")) ){
this.navDataService.addNavDataByOnly({id:'sys-role-permissioncustom-view',tag:this.viewtag,srfkey:this.context.sysrolepermission,title:this.$t(this.model.srfTitle),data:data,context:this.context,viewparams:this.viewparams,path:this.$route.fullPath},isOnlyAdd);
}
}
/**
* Vue声明周期
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public created() {
this.afterCreated();
}
/**
* 执行created后的逻辑
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public afterCreated(){
let _this:any = this;
const secondtag = _this.$util.createUUID();
_this.$store.commit('viewaction/createdView', { viewtag: _this.viewtag, secondtag: secondtag });
_this.viewtag = secondtag;
_this.parseViewParam();
_this.serviceStateEvent = _this.navDataService.serviceState.subscribe(({ action,name, data }:{ action:string,name:any,data:any }) => {
if(!Object.is(name,'sys-role-permissioncustom-view')){
return;
}
if (Object.is(action, 'viewrefresh')) {
_this.$nextTick(()=>{
_this.parseViewParam(data);
if(_this.engine){
_this.engine.load();
}
});
}
});
}
/**
* 销毁之前
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public beforeDestroy() {
this.$store.commit('viewaction/removeView', this.viewtag);
}
/**
* Vue声明周期(组件初始化完毕)
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public mounted() {
this.afterMounted();
}
/**
* 执行mounted后的逻辑
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public afterMounted(){
const _this: any = this;
_this.engineInit();
if (_this.loadModel && _this.loadModel instanceof Function) {
_this.loadModel();
}
}
/**
* 关闭视图
*
* @param {any[]} args
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public closeView(args: any[]): void {
let _view: any = this;
if (_view.viewdata) {
_view.$emit('viewdataschange', [args]);
_view.$emit('close', [args]);
} else if (_view.$tabPageExp) {
_view.$tabPageExp.onClose(_view.$route.fullPath);
}
}
/**
* 销毁视图回调
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public destroyed(){
this.afterDestroyed();
}
/**
* 执行destroyed后的逻辑
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public afterDestroyed(){
if(this.viewDefaultUsage){
let localStoreLength = Object.keys(localStorage);
if(localStoreLength.length > 0){
localStoreLength.forEach((item:string) =>{
if(item.startsWith(this.context.srfsessionid)){
localStorage.removeItem(item);
}
})
}
if(Object.is(this.navModel,"tab")){
this.navDataService.removeNavDataByTag(this.viewtag);
}
if (this.serviceStateEvent) {
this.serviceStateEvent.unsubscribe();
}
}
}
}
</script>
<style lang='less'>
@import './sys-role-permissioncustom-view.less';
</style>
\ No newline at end of file
.sys-permissionmpickup-view{
position: relative;
.tree-right-menu {
.ivu-divider-horizontal {
width: calc(100% - 32px);
min-width: calc(100% - 32px);
margin: 0 auto;
}
.ivu-dropdown-item {
position: relative;
padding-left: 32px;
> i {
position: absolute;
left: 16px;
top: 10px;
}
.ivu-icon-ios-arrow-forward {
left: initial;
right: 4px;
}
}
.ivu-dropdown {
.ivu-select-dropdown {
margin: 0;
}
}
}
.text{
font-weight: 700;color: #303133;font-size: 15px;margin-left:10px;margin-top:20px;
}
.col{
display: inline-block;
width: 400px;
}
.search{
width:200px;margin-left:20px;margin-top:30px;margin-bottom:20px;
}
.save{
margin-top:30px;margin-bottom:20px;margin-left:40px;
}
.roll{
height:calc(100vh - 355px) ;overflow:hidden;overflow-x: hidden;overflow-y: auto;
}
.tre{
margin-left:20px;
}
}
.pickup-view {
>.translate-contant {
flex-grow: 1;
display: flex;
justify-content: flex-end;
height: calc(100% - 64px);
.translate-buttons {
width: 80px;
display: flex;
align-items: center;
text-align: center;
button {
margin-bottom: 5px;
}
}
.left, .right {
width: 300px;
}
.right {
border: 1px solid #e9e9e9;
.mpicker-select {
font-family: helvetica, sans-serif;
font-size: 16px;
text-align: justify;
word-spacing: -3.8pt;
line-height: 1.6;
font-weight: bold;
word-spacing: 10px;
//height: 100%;
overflow: auto;
}
.mpicker-select > div {
padding: 3px 10px;
font-size: 14px;
color: rgba(0, 0, 0, 0.85);
font-weight: initial;
cursor: pointer;
min-height: 28px;
border: 1px solid #e9e9e9;
margin: 4px 4px;
transition: all .3s;
}
.mpicker-select > div:hover {
background: #ecf6fd;
}
.mpicker-select > .select{
color: #108ee9;
background: #ecf6fd;
}
}
.center{
width: calc(100% - 380px);
.pickupviewpanel {
width: 100%;
//height: 100%;
}
}
}
}
// this is less
<template>
<div class="view-container dempickupview sys-permissionmpickup-view">
<card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :padding="0" :bordered="false">
<div class="content-container pickup-view">
<div class="translate-contant">
<!--应用菜单-->
<div class="center" :style="{width : '33%',border:'1px solid #dcdee2', margin: '0 10px 0 0'}">
<context-menu-container class='design-tree-container'>
<div>
<div class="text">应用菜单</div>
<div>
<el-input size="medium" placeholder="搜索..." v-model="CDtreefilterText" @input="filterChangeCDtree">
<i slot="prefix" class="el-input__icon el-icon-search"></i>
</el-input>
</div>
<div class="roll">
<el-tree
:filter-node-method="fiterNode"
class="tre"
:data="this.CDdata"
ref="CDtree"
show-checkbox
node-key="id"
:default-expand-all="false"
highlight-current
:default-expanded-keys="this.CDdataexpandedKeys"
:props="this.defaultProps"
@check-change="handleCheckChange"
>
</el-tree>
</div>
</div>
</context-menu-container>
</div>
<!--数据能力-->
<div class="center" :style="{width : '33%',border:'1px solid #dcdee2', margin: '0 10px 0 0' }">
<context-menu-container class='design-tree-container'>
<div>
<div class="text">数据能力</div>
<div>
<el-input size="medium" placeholder="搜索..." v-model="QXtreefilterText" @input="filterChangeQXtree">
<i slot="prefix" class="el-input__icon el-icon-search"></i>
</el-input>
</div>
<div class="roll">
<el-tree
:filter-node-method="fiterNode"
class="tre"
:data="this.QXdata"
ref="QXtree"
show-checkbox
node-key="id"
:default-expand-all="false"
highlight-current
:default-expanded-keys="this.QXdataexpandedKeys"
:props="this.defaultProps"
@check-change="handleCheckChange"
>
</el-tree>
</div>
</div>
</context-menu-container>
</div>
<!--统一资源-->
<div class="center" :style="{width : '33%',border:'1px solid #dcdee2' }">
<context-menu-container class='design-tree-container'>
<div>
<div class="text">统一资源</div>
<div>
<el-input size="medium" placeholder="搜索..." v-model="ZYtreefilterText" @input="filterChangeZYtree">
<i slot="prefix" class="el-input__icon el-icon-search"></i>
</el-input>
</div>
<div class="roll">
<el-tree
:filter-node-method="fiterNode"
class="tre"
:data="this.ZYdata"
ref="ZYtree"
show-checkbox
node-key="id"
:default-expand-all="false"
highlight-current
:default-expanded-keys="this.ZYdataexpandedKeys"
:props="this.defaultProps"
@check-change="handleCheckChange"
>
</el-tree>
</div>
</div>
</context-menu-container>
</div>
</div>
</div>
</card>
</div>
</template>
<script lang='tsx'>
import {Component, Prop, Vue, Watch} from 'vue-property-decorator';
import view_pickupviewpanel
from '@widgets/sys-permission/mpickup-viewpickupviewpanel-pickupviewpanel/mpickup-viewpickupviewpanel-pickupviewpanel.vue';
import ContextMenuContainer from "@components/context-menu-container/context-menu-container.vue";
import {Subject} from "rxjs";
@Component({
components: {
ContextMenuContainer,
view_pickupviewpanel,
},
beforeRouteEnter: (to: any, from: any, next: any) => {
next((vm: any) => {
vm.$store.commit('addCurPageViewtag', {fullPath: to.fullPath, viewtag: vm.viewtag});
});
},
})
export default class SYS_ROLE_PERMISSIONCustomView extends Vue {
/*应用菜单数据*/
protected CDdata: any = [];
/*数据能力数据*/
protected QXdata: any = [];
/*统一资源数据*/
protected ZYdata: any = [];
/*默认选中节点*/
protected defaultCheckedNodes: any = [];
/*应用菜单数据默认展开节点*/
protected CDdataexpandedKeys: any = [];
/*数据能力数据默认展开节点*/
protected QXdataexpandedKeys: any = [];
/*统一资源数据默认展开节点*/
protected ZYdataexpandedKeys: any = [];
/**
* 树显示说明:子树为节点对象的children,节点标签为节点对象的label
*/
protected defaultProps: any = {
children: 'children',
label: 'label'
}
/**
* 选中数据
*/
protected selectData: any = {};
/**
* 初始选中的数据
*/
protected ininselectData: any = {};
/**
* 视图选中数据
*/
public viewSelections: any[] = [];
/**
* 父数据
*/
protected parentData: any = {};
/**
* 父数据主键
*/
protected srfparentkey: any;
// 应用菜单树搜索文本
public CDtreefilterText:any = '';
// 数据能力树搜索文本
public QXtreefilterText:any = '';
// 统一资源树搜索文本
public ZYtreefilterText:any = '';
/**
* 过滤节点
*/
public fiterNode(value:any,data:any){
if (!value) return true;
return data.label.indexOf(value) !==-1;
}
/**
* 应用菜单树搜索触发
*/
public filterChangeCDtree(){
const CDtree:any = this.$refs.CDtree;
CDtree.filter(this.CDtreefilterText);
}
/**
* 数据能力树搜索触发
*/
public filterChangeQXtree(){
const QXtree:any = this.$refs.QXtree;
QXtree.filter(this.QXtreefilterText);
}
/**
* 统一资源树搜索触发
*/
public filterChangeZYtree(){
const ZYtree:any = this.$refs.ZYtree;
ZYtree.filter(this.ZYtreefilterText);
}
/**
* 视图标识
*
* @type {string}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public viewtag: string = 'e791be173ed0f4bbe9cce942b6edde63';
/**
* 是否嵌入关系界面
*
* @type {boolean}
* @memberof SYS_USER_ROLEGridViewBase
*/
@Prop({default:false}) public isformDruipart?: boolean;
/**
* 界面关系通讯对象
*
* @type {Subject<ViewState>}
* @memberof SYS_USER_ROLEGridViewBase
*/
@Prop() public formDruipart?: Subject<ViewState>;
/**
* 应用上下文
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public context:any = {};
/**
* 视图参数
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public viewparams:any = {};
/**
* 传入视图上下文
*
* @type {string}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
@Prop() public viewdata!: string;
/**
* 视图默认使用
*
* @type {boolean}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
@Prop({ default: true }) public viewDefaultUsage!: boolean;
/**
* 自定义视图导航上下文集合
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public customViewNavContexts:any ={};
/**
* 自定义视图导航参数集合
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public customViewParams:any ={};
/**
* 解析视图参数
*
* @public
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public parseViewParam(): void {
for(let key in this.context){
delete this.context[key];
}
if (!this.viewDefaultUsage && this.viewdata && !Object.is(this.viewdata, '')) {
Object.assign(this.context, JSON.parse(this.viewdata));
if(this.context && this.context.srfparentdename){
Object.assign(this.viewparams,{srfparentdename:this.context.srfparentdename});
}
if(this.context && this.context.srfparentkey){
Object.assign(this.viewparams,{srfparentkey:this.context.srfparentkey});
}
this.handleCustomViewData();
return;
}
const path = (this.$route.matched[this.$route.matched.length - 1]).path;
const keys: Array<any> = [];
const curReg = this.$pathToRegExp.pathToRegexp(path, keys);
const matchArray = curReg.exec(this.$route.path);
let tempValue: Object = {};
keys.forEach((item: any, index: number) => {
Object.defineProperty(tempValue, item.name, {
enumerable: true,
value: matchArray[index + 1]
});
});
this.$viewTool.formatRouteParams(tempValue,this.$route,this.context,this.viewparams);
if(this.$store.getters.getAppData() && this.$store.getters.getAppData().context){
Object.assign(this.context,this.$store.getters.getAppData().context);
}
//初始化视图唯一标识
Object.assign(this.context,{srfsessionid:this.$util.createUUID()});
this.handleCustomViewData();
}
/**
* 处理自定义视图数据
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public handleCustomViewData(){
if(Object.keys(this.customViewNavContexts).length > 0){
Object.keys(this.customViewNavContexts).forEach((item:any) =>{
let tempContext:any = {};
let curNavContext:any = this.customViewNavContexts[item];
this.handleCustomDataLogic(curNavContext,tempContext,item);
Object.assign(this.context,tempContext);
})
}
if(Object.keys(this.customViewParams).length > 0){
Object.keys(this.customViewParams).forEach((item:any) =>{
let tempParam:any = {};
let curNavParam:any = this.customViewParams[item];
this.handleCustomDataLogic(curNavParam,tempParam,item);
Object.assign(this.viewparams,tempParam);
})
}
}
/**
* 处理自定义视图数据逻辑
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public handleCustomDataLogic(curNavData:any,tempData:any,item:string){
// 直接值直接赋值
if(curNavData.isRawValue){
if(Object.is(curNavData.value,"null") || Object.is(curNavData.value,"")){
Object.defineProperty(tempData, item.toLowerCase(), {
value: null,
writable : true,
enumerable : true,
configurable : true
});
}else{
Object.defineProperty(tempData, item.toLowerCase(), {
value: curNavData.value,
writable : true,
enumerable : true,
configurable : true
});
}
}else{
// 先从导航上下文取数,没有再从导航参数(URL)取数,如果导航上下文和导航参数都没有则为null
if(this.context[(curNavData.value).toLowerCase()]){
Object.defineProperty(tempData, item.toLowerCase(), {
value: this.context[(curNavData.value).toLowerCase()],
writable : true,
enumerable : true,
configurable : true
});
}else{
if(this.viewparams[(curNavData.value).toLowerCase()]){
Object.defineProperty(tempData, item.toLowerCase(), {
value: this.viewparams[(curNavData.value).toLowerCase()],
writable : true,
enumerable : true,
configurable : true
});
}else{
Object.defineProperty(tempData, item.toLowerCase(), {
value: null,
writable : true,
enumerable : true,
configurable : true
});
}
}
}
}
/**
* vue 创建
*/
public created() {
this.afterCreated();
}
/**
* 执行created后的逻辑
*
* @memberof SYS_USER_ROLEGridViewBase
*/
public afterCreated(){
const secondtag = this.$util.createUUID();
this.$store.commit('viewaction/createdView', { viewtag: this.viewtag, secondtag: secondtag });
this.viewtag = secondtag;
this.parseViewParam();
const _this: any = this;
// 获取父数据
if (_this && _this.viewdata) {
_this.parentData = JSON.parse(_this.viewdata);
}
if (_this.parentData && _this.parentData.sysrole) {
// console.log("当前角色id:" + _this.parentData.sysrole);
_this.srfparentkey = _this.parentData.sysrole;
}
// 监听父页面
if(this.formDruipart){
this.formDruipart.subscribe((res:any) =>{
if(Object.is(res.action,'load')){
// 如果是新建角色保存,需要从res中获取父数据主键
if (res.data) {
let parentData = res.data;
this.srfparentkey = parentData.srfparentkey;
}
// 父数据保存时调用当前视图的事件
if(this.selectData.length>0){
// 选中了数据
this.onClickOk();
}else{
// 没选中数据
this.onClear();
}
}
});
}
}
/**
* vue 挂载
*/
public mounted() {
this.initTree();
}
/**
* 初始化树
*/
private initTree() {
const _this = this;
// get全部菜单和数据能力和统一资源的请求路径
const url = `sysroles/`+_this.srfparentkey+`/sysrolepermissions/tree`;
this.$http.get(url).then((response: any) => {
if (!response || response.status !== 200) {
this.$Notice.error({title: '错误', desc: response.message});
return;
} else {
// 给树赋值,数据结构在后台已经按照eltree格式化
_this.CDdata = response.data.APPMENU;
_this.QXdata = response.data.OPPRIV;
_this.ZYdata = response.data.UNIRES;
_this.defaultCheckedNodes = response.data.SELECTED;
// 设置默认第一级展开
for (let i = 0; i < _this.CDdata.length; i++) {
_this.CDdataexpandedKeys.push(_this.CDdata[i].id);
}
for (let i = 0; i < _this.QXdata.length; i++) {
_this.QXdataexpandedKeys.push(_this.QXdata[i].id);
}
for (let i = 0; i < _this.ZYdata.length; i++) {
_this.ZYdataexpandedKeys.push(_this.ZYdata[i].id);
}
// 设置默认选中节点,即当前角色所有权限
this.$nextTick(()=>{
const CDtree: any = this.$refs.CDtree;
const QXtree: any = this.$refs.QXtree;
const ZYtree: any = this.$refs.ZYtree;
CDtree.setCheckedNodes(_this.defaultCheckedNodes);
QXtree.setCheckedNodes(_this.defaultCheckedNodes);
ZYtree.setCheckedNodes(_this.defaultCheckedNodes);
// 保存初始选中的节点数据,便于后续保存时比较
const arr = CDtree.getCheckedNodes().concat(QXtree.getCheckedNodes()).concat(ZYtree.getCheckedNodes());
this.ininselectData = arr;
});
}
}).catch((e) => {
console.log(e);
});
}
/**
* 销毁之前
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
*/
public beforeDestroy() {
// 清空选中数据
this.selectData = {};
// 清空视图选中数据
this.viewSelections = [];
this.$store.commit('viewaction/removeView', this.viewtag);
}
/**
* 处理选中节点
*/
protected handleCheckChange() {
// console.log("SYS_PERMISSIONMPickupView执行了handleCheckChange")
// 获取当前三棵树
const CDtree: any = this.$refs.CDtree;
const QXtree: any = this.$refs.QXtree;
const ZYtree: any = this.$refs.ZYtree;
// 获取选中状态的节点
const arr = CDtree.getCheckedNodes().concat(QXtree.getCheckedNodes()).concat(ZYtree.getCheckedNodes());
this.selectData = arr;
// console.log("选中的node:" + JSON.stringify(this.selectData));
}
/**
* 容器模型
*/
public containerModel: any = {
view_okbtn: {name: 'okbtn', type: 'button', text: '确定', disabled: true},
};
/**
* 确定
*/
public onClickOk(): void {
// 处理选中的数据
if (this.selectData && this.selectData.length > 0) {
// 判断选中的数据和初始数据
if (JSON.stringify(this.selectData) == JSON.stringify(this.ininselectData)) {
return;
}
this.selectData.forEach((item: any) => {
let _itemTemp: any = JSON.parse(JSON.stringify(item));
let _item: any = {};
if (_itemTemp.type) {
_item.permissionid = _itemTemp.id;
_item.permissiontype = _itemTemp.type;
_item.permissionname = _itemTemp.fullName;
Object.assign(_item, {_select: false})
this.viewSelections.push(_item);
}
});
// 保存选中的权限信息
let url = '/sysroles/'+this.srfparentkey+'/sysrolepermissions/refreshbatch';
this.$http.post(url,this.viewSelections).then((response: any) => {
if (!(!response || response.status !== 200)) {
} else {
this.$Notice.error({title: '错误', desc: response.message});
return;
}
}).catch((e) => {
});
}
// 清空视图选中数据,避免重复添加
this.viewSelections = [];
}
/**
* 清除
*/
private onClear(){
// 未选中数据,即没有赋予任何权限,需要清除当前角色的所有权限
if (this.selectData.length==0) {
// 保存选中的权限信息
let url = '/sysroles/'+this.srfparentkey+'/sysrolepermissions/refreshbatch';
this.$http.post(url,[]).then((response: any) => {
if (!(!response || response.status !== 200)) {
} else {
this.$Notice.error({title: '错误', desc: response.message});
return;
}
}).catch((e) => {
});
}
}
}
</script>
<style lang='less'>
@import './sys-role-permissioncustom-view';
</style>
\ No newline at end of file
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册