<template> <layout class='app-dr-bar'> <sider :width="width"> <el-menu :default-openeds="defaultOpeneds" :default-active="items[0].id" @select="onSelect" @open="onOpen" @close="onClose"> <app-sider-menus :menus="items"></app-sider-menus> </el-menu> </sider> <content <#noparse>:style="{ width: `calc(100% - ${this.width + 1}px)` }"</#noparse>> <div class='main-data' v-show="Object.is(this.selection.id, 'form')"> <slot></slot> </div> <component v-if="!Object.is(this.selection.id, 'form') && this.selection.view && !Object.is(this.selection.view.viewname, '')" :is="selection.view.viewname" class="viewcontainer2" :viewDefaultUsage="false" :viewdata="JSON.stringify(selection.data)" :viewparam="JSON.stringify(selection.param)" :key="this.$util.createUUID()"> </component> </content> </layout> </template> <#ibizinclude> ../@MACRO/CONTROL/CONTROL_HEADER-BASE.vue.ftl </#ibizinclude> /** * 获取多项数据 * * @returns {any[]} * @memberof ${srfclassname('${ctrl.codeName}')} */ public getDatas(): any[] { return this.items; } /** * 获取单项树 * * @returns {*} * @memberof ${srfclassname('${ctrl.codeName}')} */ public getData(): any { return this.selection; } /** * 加载行为 * * @type {string} * @memberof ${srfclassname('${ctrl.codeName}')} */ @Prop() public loadAction?: string; /** * 数据选中项 * * @type {*} * @memberof ${srfclassname('${ctrl.codeName}')} */ public selection: any = {}; /** * 关系栏数据项 * * @type {any[]} * @memberof ${srfclassname('${ctrl.codeName}')} */ public items: any[] = [ <#if view.hasPSControl('form')> { text: "主表单", disabled: false, id: "form", }, </#if> <#list ctrl.getPSDEDataRelation().getPSDEDRDetails() as item> { text: "${item.getCaption()}", disabled: false, id: "${item.getName()?lower_case}", <#if item.getPSSysImage()??> iconcls: '${item.getPSSysImage().getCssClass()}', icon: '${item.getPSSysImage().getImagePath()}', </#if> }, </#list> ]; /** * 默认打开项 * * @type {string[]} * @memberof ${srfclassname('${ctrl.codeName}')} */ public defaultOpeneds: string[] = []; /** * 父数据 * * @public * @type {*} * @memberof ${srfclassname('${ctrl.codeName}')} */ public parentData: any = {}; /** * 宽度 * * @type {number} * @memberof ${srfclassname('${ctrl.codeName}')} */ public width: number = <#if ctrl.getWidth() gt 240><#else>240</#if>; /** * 生命周期 * * @memberof ${srfclassname('${ctrl.codeName}')} */ public created(): void { if (this.viewState) { this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => { if (!Object.is(tag, this.name)) { return; } if (Object.is('state', action)) { const state = !this.context.${ctrl.getPSAppDataEntity().getCodeName()?lower_case} ? true : false; this.setItemDisabled(this.items, state); } }); } this.$nextTick(() => { this.onSelect(this.items[0].id) this.$emit('selectionchange', [this.items[0]]); }); } /** * vue 生命周期 * * @memberof ${srfclassname('${ctrl.codeName}')} */ public destroyed() { if (this.viewStateEvent) { this.viewStateEvent.unsubscribe(); } <#if destroyed_block??> ${destroyed_block} </#if> } /** * 获取关系项 * * @public * @param {*} [arg={}] * @returns {*} * @memberof ${srfclassname('${ctrl.codeName}')} */ public getDRBarItem(arg: any = {}): any { let expmode = arg.nodetype; if (!expmode) { expmode = ''; } <#list ctrl.getPSAppViewRefs() as item> <#if (item.getName()?index_of("DRITEM:")==0)> <#assign refview = item.getRefPSAppView()> if (Object.is(expmode, '${item.getName()?substring(7)?lower_case}')) { return { viewname: '${srffilepath2(refview.codeName)}', parentdatajo: <#if item.getParentDataJO()??>${item.getParentDataJO()}<#else>{},</#if> }; } </#if> </#list> return undefined; } /** * 处理数据 * * @public * @param {any[]} items * @memberof ${srfclassname('${ctrl.codeName}')} */ public dataProcess(items: any[]): void { items.forEach((_item: any) => { if (_item.expanded) { this.defaultOpeneds.push(_item.id); } _item.disabled = false; if (_item.items && Array.isArray(_item.items) && _item.items.length > 0) { this.dataProcess(_item.items); } }); } /** * 获取子项 * * @param {any[]} items * @param {string} id * @returns {*} * @memberof ${srfclassname('${ctrl.codeName}')} */ public getItem(items: any[], id: string): any { const item: any = {}; items.some((_item: any) => { if (Object.is(_item.id, id)) { Object.assign(item, _item); return true; } if (_item.items && _item.items.length > 0) { const subItem = this.getItem(_item.items, id); if (Object.keys(subItem).length > 0) { Object.assign(item, subItem); return true; } } return false; }); return item; } /** * 节点选中 * * @param {*} $event * @memberof ${srfclassname('${ctrl.codeName}')} */ public onSelect($event: any): void { const item = this.getItem(this.items, $event); if (Object.is(item.id, this.selection.id)) { return; } this.$emit('selectionchange', [item]); const refview = this.getDRBarItem({ nodetype: item.id }); this.selection = {}; const _context: any = { ...JSON.parse(JSON.stringify(this.context)) }; const _params: any = { ...JSON.parse(JSON.stringify(this.viewparams)) }; if (refview && refview.parentdatajo) { Object.assign(_context, refview.parentdatajo); Object.assign(this.selection, { view: { viewname: refview.viewname }, data: _context, param: _params }); } Object.assign(this.selection, item); } /** * 子节点打开 * * @param {*} $event * @memberof ${srfclassname('${ctrl.codeName}')} */ public onOpen($event: any): void { const item = this.getItem(this.items, $event); if (Object.is(item.id, this.selection.id)) { return; } this.selection = {}; Object.assign(this.selection, item); if (Object.is(item.id, 'form') || (item.viewname && !Object.is(item.viewname, ''))) { this.$emit('selectionchange', [this.selection]); } } /** * 子节点关闭 * * @param {*} $event * @memberof ${srfclassname('${ctrl.codeName}')} */ public onClose($event: any): void { const item = this.getItem(this.items, $event); if (Object.is(item.id, this.selection.id)) { return; } this.selection = {}; Object.assign(this.selection, item); if (Object.is(item.id, 'form') || (item.viewname && !Object.is(item.viewname, ''))) { this.$emit('selectionchange', [this.selection]); } } /** * 设置关系项状态 * * @param {any[]} items * @param {boolean} state * @memberof ${srfclassname('${ctrl.codeName}')} */ public setItemDisabled(items: any[], state: boolean) { items.forEach((item: any) => { if (!Object.is(item.id, 'form')) { item.disabled = state; } if (item.items && Array.isArray(item.items)) { this.setItemDisabled(item.items, state); } }); } <#ibizinclude> ../@MACRO/CONTROL/CONTROL_BOTTOM-BASE.vue.ftl </#ibizinclude> <#ibizinclude> ../@MACRO/CONTROL/CONTROL-BASE.style.ftl </#ibizinclude>