<template> <div class='pickupviewpanel'> <component v-if="inited && view.viewname && !Object.is(view.viewname, '')" :is="view.viewname" class="viewcontainer3" :viewdata="viewdata" :viewparam="viewparam" :viewDefaultUsage="false" :isSingleSelect="isSingleSelect" :selectedData="selectedData" :isShowButton="isShowButton" @viewdataschange="onViewDatasChange" @viewdatasactivated="viewDatasActivated" @viewload="onViewLoad"> </component> </div> </template> <script lang='tsx'> import { Vue, Component, Prop, Provide, Emit, Watch, Model } from 'vue-property-decorator'; import { CreateElement } from 'vue'; import { Subject, Subscription } from 'rxjs'; import { ControlInterface } from '@/interface/control'; import { UIActionTool,Util } from '@/utils'; import SysPermissionService from '@/service/sys-permission/sys-permission-service'; import MPickupViewpickupviewpanelService from './mpickup-viewpickupviewpanel-pickupviewpanel-service'; import MPickupViewpickupviewpanelModel from './mpickup-viewpickupviewpanel-pickupviewpanel-model'; @Component({ components: { } }) export default class MPickupViewpickupviewpanelBase extends Vue implements ControlInterface { /** * 名称 * * @type {string} * @memberof MPickupViewpickupviewpanelBase */ @Prop() public name?: string; /** * 视图通讯对象 * * @type {Subject<ViewState>} * @memberof MPickupViewpickupviewpanelBase */ @Prop() public viewState!: Subject<ViewState>; /** * 应用上下文 * * @type {*} * @memberof MPickupViewpickupviewpanelBase */ @Prop() public context: any; /** * 视图参数 * * @type {*} * @memberof MPickupViewpickupviewpanelBase */ @Prop() public viewparams: any; /** * 视图状态事件 * * @public * @type {(Subscription | undefined)} * @memberof MPickupViewpickupviewpanelBase */ public viewStateEvent: Subscription | undefined; /** * 获取部件类型 * * @returns {string} * @memberof MPickupViewpickupviewpanelBase */ public getControlType(): string { return 'PICKUPVIEWPANEL' } /** * 建构部件服务对象 * * @type {MPickupViewpickupviewpanelService} * @memberof MPickupViewpickupviewpanelBase */ public service: MPickupViewpickupviewpanelService = new MPickupViewpickupviewpanelService({ $store: this.$store }); /** * 实体服务对象 * * @type {SysPermissionService} * @memberof MPickupViewpickupviewpanelBase */ public appEntityService: SysPermissionService = new SysPermissionService({ $store: this.$store }); /** * 关闭视图 * * @param {any} args * @memberof MPickupViewpickupviewpanelBase */ public closeView(args: any): void { let _this: any = this; _this.$emit('closeview', [args]); } /** * 计数器刷新 * * @memberof MPickupViewpickupviewpanelBase */ 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(); } }) } } /** * 选中数据字符串 * * @type {string} * @memberof MPickupViewpickupviewpanelBase */ @Prop() public selectedData?: string; /** * 获取多项数据 * * @returns {any[]} * @memberof MPickupViewpickupviewpanelBase */ public getDatas(): any[] { return []; } /** * 获取单项树 * * @returns {*} * @memberof MPickupViewpickupviewpanelBase */ public getData(): any { return {}; } /** * 视图名称 * * @type {*} * @memberof MPickupViewpickupviewpanelBase */ public view: any = { viewname: 'sys-permission-pickup-grid-view', data: {}, } /** * 局部上下文 * * @type {*} * @memberof MPickupViewpickupviewpanelBase */ public localContext: any = null; /** * 局部视图参数 * * @type {*} * @memberof PickupViewpickupviewpanel */ public localViewParam: any = null; /** * 视图数据 * * @type {*} * @memberof MPickupViewpickupviewpanelBase */ public viewdata: string = JSON.stringify(this.context); /** * 视图参数 * * @type {*} * @memberof PickupViewpickupviewpanel */ public viewparam: string = JSON.stringify(this.viewparams); /** * 是否显示按钮 * * @type {boolean} * @memberof MPickupViewpickupviewpanelBase */ @Prop({default: true}) public isShowButton!: boolean; /** * 是否单选 * * @type {boolean} * @memberof MPickupViewpickupviewpanelBase */ @Prop() public isSingleSelect?: boolean; /** * 初始化完成 * * @type {boolean} * @memberof MPickupViewpickupviewpanelBase */ public inited: boolean = false; /** * 视图数据变化 * * @param {*} $event * @memberof MPickupViewpickupviewpanelBase */ public onViewDatasChange($event: any): void { if($event.length>0){ $event.forEach((item:any,index:any) => { let srfmajortext = item['permissionname']; if(srfmajortext){ Object.assign($event[index],{srfmajortext: srfmajortext}); } }); } this.$emit('selectionchange', $event); } /** * 视图数据被激活 * * @param {*} $event * @memberof MPickupViewpickupviewpanelBase */ public viewDatasActivated($event: any): void { this.$emit('activated', $event); } /** * 视图加载完成 * * @param {*} $event * @memberof MPickupViewpickupviewpanelBase */ public onViewLoad($event: any): void { this.$emit('load', $event); } /** * vue 生命周期 * * @memberof MPickupViewpickupviewpanelBase */ public created() { this.afterCreated(); } /** * 执行created后的逻辑 * * @memberof MPickupViewpickupviewpanelBase */ public afterCreated(){ this.initNavParam(); if (this.viewState) { this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => { if (!Object.is(tag, this.name)) { return; } if (Object.is('load', action)) { this.viewdata = JSON.stringify(this.context); this.viewparam = JSON.stringify(Object.assign(data, this.viewparams)); this.inited = true; } }); } } /** * 初始化导航参数 * * @memberof MPickupViewpickupviewpanelBase */ public initNavParam(){ if(this.localContext && Object.keys(this.localContext).length >0){ let _context:any = this.$util.computedNavData({},this.context,this.viewparams,this.localContext); Object.assign(this.context,_context); } if(this.localViewParam && Object.keys(this.localViewParam).length >0){ let _param:any = this.$util.computedNavData({},this.context,this.viewparams,this.localViewParam); Object.assign(this.viewparams,_param); } this.viewdata = JSON.stringify(this.context); this.viewparam = JSON.stringify(this.viewparams); } /** * vue 生命周期 * * @memberof MPickupViewpickupviewpanelBase */ public destroyed() { this.afterDestroy(); } /** * 执行destroyed后的逻辑 * * @memberof MPickupViewpickupviewpanelBase */ public afterDestroy() { if (this.viewStateEvent) { this.viewStateEvent.unsubscribe(); } } } </script> <style lang='less'> @import './mpickup-viewpickupviewpanel-pickupviewpanel.less'; </style>