import { IPSAppDEWFDynaEditView, IPSDEDRTab, IPSDEDRTabPage, IPSDEForm } from '@ibiz/dynamic-model-api'; import { Util, ModelTool, MobWFDynaEdit3ViewInterface } from 'ibiz-core'; import { MainViewBase } from './main-view-base'; /** * 工作流动态编辑视图(分页关系)基类 * * @export * @class MobWFDynaEditView3Base * @extends {MainViewBase} * @implements {MobWFDynaEdit3ViewInterface} */ export class MobWFDynaEditView3Base extends MainViewBase implements MobWFDynaEdit3ViewInterface { /** * 视图实例 * * @memberof MobWFDynaEditView3Base */ public declare viewInstance: IPSAppDEWFDynaEditView; /** * 编辑表单实例 * * @type {IPSDEForm} * @memberof MobWFDynaEditView3Base */ public editFormInstance!: IPSDEForm; /** * 数据关系分页部件实例 * * @type {IPSDEDRTab} * @memberof MobWFDynaEditView3Base */ public drtabInstance!: IPSDEDRTab; /** * 工具栏模型数据 * * @memberof MobWFDynaEditView3Base */ public linkModel: Array<any> = []; /** * 视图引用数据 * * @memberof MobWFDynaEditView3Base */ public viewRefData: any = {}; /** * 工作流按钮显示状态 * * @memberof MobWFDynaEditView3Base */ public toolBarVisible = false; /** * 关系数据分页部件分页 * * @type {IPSDEDRTabPage[] | null} * @memberof MobWFDynaEditView3Base */ public deDRTabPages: IPSDEDRTabPage[] | null = []; /** * 工作流附加功能类型映射关系对象 * * @memberof MobWFDynaEditView3Base */ public wfAddiFeatureRef: any = { reassign: { featureTag: 'REASSIGN', action: 'TransFerTask' }, addstepbefore: { featureTag: 'ADDSTEPBEFORE', action: 'BeforeSign' }, sendback: { featureTag: 'SENDBACK', action: 'SendBack' }, sendcopy: { featureTag: 'SENDCOPY', action: 'sendCopy' }, }; /** * 引擎初始化 * * @public * @memberof MobWFDynaEditView3Base */ public engineInit(): void { if (this.Environment && this.Environment.isPreviewMode) { return; } this.engine.init({ view: this, keyPSDEField: this.appDeCodeName.toLowerCase(), majorPSDEField: this.appDeMajorFieldName.toLowerCase(), isLoadDefault: this.viewInstance.loadDefault, }); } /** * 初始化挂载状态集合 * * @memberof MobWFDynaEditView3Base */ public initUIContainerMountedMap() { this.mountedMap.set('self', false); } /** * 设置已经绘制完成状态 * * @memberof MobWFDynaEditView3Base */ public setContainerIsMounted(name: string = 'self') { super.setContainerIsMounted(name); if (this.editFormInstance?.name == name) { this.viewState.next({ tag: this.editFormInstance.name, action: 'autoload', data: { srfkey: this.context[this.appDeCodeName.toLowerCase()], }, }); } } /** * 初始化编辑视图实例 * * @memberof MobWFDynaEditView3Base */ public async viewModelInit() { await super.viewModelInit(); this.viewRefData = await ModelTool.loadedAppViewRef(this.viewInstance); this.drtabInstance = ModelTool.findPSControlByName('drtab', this.viewInstance.getPSControls()) as IPSDEDRTab; this.deDRTabPages = this.drtabInstance?.getPSDEDRTabPages(); } /** * 初始化工具栏数据 * * @memberof MobWFDynaEditView3Base */ public renderToolBar() { return ( <div class="wf-button-content"> <div class="toolbar-container" on-click={() => { this.WFViewEvent({ tag: 'toolBarVisibleChange' }) }}> <ion-fab-button> <ion-icon name="chevron-back-circle-outline"></ion-icon> </ion-fab-button> </div> </div> ); } /** * 绘制工作流按钮 * * @return {*} * @memberof MobWFDynaEditView3Base */ public renderToolBarInfo() { return ( <van-action-sheet class="wf-action-sheet" cancel-text="取消" get-container="#app" actions={this.linkModel} value={this.toolBarVisible} on-select={(item: any) => { this.WFViewEvent({ tag: 'WFButtonClick', value: item }) }} on-cancel={() => { this.WFViewEvent({ tag: 'toolBarVisibleChange' }) }} on-click-overlay={() => { this.WFViewEvent({ tag: 'toolBarVisibleChange' }) }}> </van-action-sheet> ) } /** * 绘制分页关系 * * @return {*} * @memberof MobWFDynaEditView3Base */ public renderDrTabPage() { const tempContext = Util.deepCopy(this.context); const tabsName = `${this.appDeCodeName?.toLowerCase()}_${this.viewInstance.codeName.toLowerCase()}`; const title = this.drtabInstance.M?.editItemCaption ? this.drtabInstance.M?.editItemCaption : this.editFormInstance.logicName; return [ <van-tabs animated={false} name={tabsName} type="card" > <van-tab tab={tabsName} title={title} > {this.renderFormContent()} </van-tab> {this.deDRTabPages?.map((deDRTabPage: IPSDEDRTabPage) => { const tabTitle = this.$tl(deDRTabPage.getCapPSLanguageRes()?.lanResTag, deDRTabPage.caption); return ( <van-tab tab={tabsName} title={tabTitle} > {this.$createElement('app-view-shell', { props: { staticProps: { appDeCodeName: this.appDeCodeName, }, dynamicProps: { _context: JSON.stringify( Object.assign(tempContext, { viewpath: deDRTabPage?.M?.getPSAppView?.path, }) ), _viewparams: JSON.stringify( this.viewparams ), }, }, class: 'view-container2' })} </van-tab> ); })} </van-tabs>, ] } /** * 渲染流程表单内容区 * * @memberof MobWFDynaEditView3Base */ public renderFormContent() { if (!this.editFormInstance) { return; } let { targetCtrlName, targetCtrlParam, targetCtrlEvent, } = this.computeTargetCtrlData(this.editFormInstance); Object.assign(targetCtrlParam.staticProps, { isautoload: true, }); return this.$createElement(targetCtrlName, { slot: 'default', props: targetCtrlParam, ref: this.editFormInstance.name, on: targetCtrlEvent, }); } /** * 渲染视图主体内容区 * * @memberof MobWFDynaEditView3Base */ public renderMainContent() { if (!this.editFormInstance) { return; } return <div class="app-vc-form"> { this.deDRTabPages && this.deDRTabPages.length > 0 ? this.renderDrTabPage() : this.renderFormContent() } </div> } /** * 渲染视图底部 * * @return {*} * @memberof MobWFDynaEditView3Base */ renderViewFooter() { return <div class="view-footer__buttons"> {this.renderToolBar()} {this.renderToolBarInfo()} </div> } /** * 视图事件 * * @param {*} $event * @return {*} * @memberof MobWFDynaEditView3Base */ public WFViewEvent($event: any) { const { tag, value } = $event; if (!tag) { console.log('视图事件tag 异常'); return; } this.engine.onViewEvent(tag, value); } }