<template> <app-layout viewName="pimpersonltxyggridview" viewTitle="离(退)休人员" :className="{ 'view-container': true, 'default-mode-view': true, 'degridview': true, 'pimpersonltxyggrid-view': true }" layoutMode="VIEW" :isShowUserInfo="isDefaultView()" :openMode="openMode" @close-view="closeView($event)"> <template slot="headerLeft"> <div class="view-header-left"> <div class="view-caption" v-if="isDefaultView()">{{$t(model.srfCaption)}}</div> <modal-breadcrumb v-if="isModalView()"/> </div> </template> <template slot="headerRight"> <div class="view-header-right"> <app-header-menus :toolbarModel="toolBarModels" @menu-click="toolbar_click($event)" mode="view" :openMode="openMode" :isEnableQuickSearch="true" v-model="query" @search="onSearch($event)"/> </div> </template> <template slot="content"> <div class="view-content-wrapper"> <view_searchform :viewState="viewState" :viewparams="viewparams" :context="context" :showBusyIndicator="true" v-show="isExpandSearchForm" loaddraftAction="FilterGetDraft" loadAction="FilterGet" name="searchform" ref='searchform' @save="searchform_save($event)" @search="searchform_search($event)" @load="searchform_load($event)" @closeview="closeView($event)"> </view_searchform> <view_grid :viewState="viewState" :viewparams="viewparams" :context="context" :isSingleSelect="isSingleSelect" :showBusyIndicator="true" :isOpenEdit="false" :gridRowActiveMode="gridRowActiveMode" @save="onSave" updateAction="" removeAction="Remove" loaddraftAction="" loadAction="" createAction="" fetchAction="FetchLTXSTAFF" :newdata="newdata" :opendata="opendata" name="grid" ref='grid' @selectionchange="grid_selectionchange($event)" @beforeload="grid_beforeload($event)" @rowdblclick="grid_rowdblclick($event)" @remove="grid_remove($event)" @load="grid_load($event)" @closeview="closeView($event)"> </view_grid> </div> </template> </app-layout> </template> <script lang='tsx'> import { Vue, Component, Prop, Provide, Emit, Watch } from 'vue-property-decorator'; import { Subject } from 'rxjs'; import { UIActionTool, Util } from '@/utils'; import { VueLifeCycleProcessing, GridViewBase } from '@/crm-core'; import PIMPERSONService from '@/service/pimperson/pimperson-service'; import GridViewEngine from '@engine/view/grid-view-engine'; /** * 离(退)休人员基类 * * @export * @class PIMPERSONLTXYGGridViewBase * @extends {GridViewBase} */ @Component({}) @VueLifeCycleProcessing export default class PIMPERSONLTXYGGridViewBase extends GridViewBase { /** * 实体服务对象 * * @type {PIMPERSONService} * @memberof PIMPERSONLTXYGGridViewBase */ public appEntityService: PIMPERSONService = new PIMPERSONService; /** * 数据变化 * * @param {*} val * @returns {*} * @memberof PIMPERSONLTXYGGridViewBase */ @Emit() public viewDatasChange(val: any):any { return val; } /** * 视图标识 * * @type {string} * @memberof PIMPERSONLTXYGGridViewBase */ public viewtag: string = 'a9ed8a2bef67f5ccfcde130ed72c28ba'; /** * 父数据对象 * * @protected * @type {*} * @memberof PIMPERSONLTXYGGridViewBase */ protected srfparentdata: any = {}; /** * 自定义视图导航上下文集合 * * @type {*} * @memberof PIMPERSONLTXYGGridViewBase */ protected customViewNavContexts:any ={ }; /** * 自定义视图导航参数集合 * * @type {*} * @memberof PIMPERSONLTXYGGridViewBase */ protected customViewParams:any ={ }; /** * 视图模型数据 * * @type {*} * @memberof PIMPERSONLTXYGGridViewBase */ public model: any = { srfCaption: 'entities.pimperson.views.ltxyggridview.caption', srfTitle: 'entities.pimperson.views.ltxyggridview.title', srfSubTitle: 'entities.pimperson.views.ltxyggridview.subtitle', dataInfo: '' } /** * 容器模型 * * @type {*} * @memberof PIMPERSONLTXYGGridViewBase */ public containerModel: any = { view_toolbar: { name: 'toolbar', type: 'TOOLBAR' }, view_grid: { name: 'grid', type: 'GRID' }, view_searchform: { name: 'searchform', type: 'SEARCHFORM' }, }; /** * 视图状态订阅对象 * * @private * @type {Subject<{action: string, data: any}>} * @memberof PIMPERSONLTXYGGridViewBase */ public viewState: Subject<ViewState> = new Subject(); /** * 工具栏模型 * * @type {*} * @memberof PIMPERSONLTXYGGridView */ public toolBarModels: any = { deuiaction6: { name: 'deuiaction6', caption: '导出','isShowCaption':true,'isShowIcon':true, tooltip: '导出', iconcls: 'fa fa-file-excel-o', icon: '', disabled: false, type: 'DEUIACTION', visabled: true, dataaccaction: '', uiaction: { tag: 'ExportExcel', target: '' }, MaxRowCount: 5000, class: '' }, deuiaction2: { name: 'deuiaction2', caption: '过滤','isShowCaption':true,'isShowIcon':true, tooltip: '过滤', iconcls: 'fa fa-filter', icon: '', disabled: false, type: 'DEUIACTION', visabled: true, dataaccaction: 'SRFUR__JGLYKQLX', uiaction: { tag: 'ToggleFilter', target: '' }, class: '' }, }; /** * 视图引擎 * * @protected * @type {Engine} * @memberof PIMPERSONLTXYGGridViewBase */ protected engine: GridViewEngine = new GridViewEngine(); /** * 引擎初始化 * * @protected * @memberof PIMPERSONLTXYGGridViewBase */ protected engineInit(): void { this.engine.init({ view: this, opendata: (args: any[], params?: any, $event?: any, xData?: any) => { this.opendata(args, params, $event, xData); }, newdata: (args: any[], params?: any, $event?: any, xData?: any) => { this.newdata(args, params, $event, xData); }, grid: this.$refs.grid, searchform: this.$refs.searchform, keyPSDEField: 'pimperson', majorPSDEField: 'pimpersonname', isLoadDefault: true, }); } /** * toolbar 部件 click 事件 * * @param {*} [args={}] * @param {*} $event * @memberof PIMPERSONLTXYGGridViewBase */ public toolbar_click($event: any, $event2?: any) { if (Object.is($event.tag, 'deuiaction3')) { this.toolbar_deuiaction3_click($event, '', $event2); } if (Object.is($event.tag, 'deuiaction6')) { this.toolbar_deuiaction6_click($event, '', $event2); } if (Object.is($event.tag, 'deuiaction2')) { this.toolbar_deuiaction2_click($event, '', $event2); } } /** * grid 部件 selectionchange 事件 * * @param {*} [args={}] * @param {*} $event * @memberof PIMPERSONLTXYGGridViewBase */ public grid_selectionchange($event: any, $event2?: any) { this.engine.onCtrlEvent('grid', 'selectionchange', $event); } /** * grid 部件 beforeload 事件 * * @param {*} [args={}] * @param {*} $event * @memberof PIMPERSONLTXYGGridViewBase */ public grid_beforeload($event: any, $event2?: any) { this.engine.onCtrlEvent('grid', 'beforeload', $event); } /** * grid 部件 rowdblclick 事件 * * @param {*} [args={}] * @param {*} $event * @memberof PIMPERSONLTXYGGridViewBase */ public grid_rowdblclick($event: any, $event2?: any) { this.engine.onCtrlEvent('grid', 'rowdblclick', $event); } /** * grid 部件 remove 事件 * * @param {*} [args={}] * @param {*} $event * @memberof PIMPERSONLTXYGGridViewBase */ public grid_remove($event: any, $event2?: any) { this.engine.onCtrlEvent('grid', 'remove', $event); } /** * grid 部件 load 事件 * * @param {*} [args={}] * @param {*} $event * @memberof PIMPERSONLTXYGGridViewBase */ public grid_load($event: any, $event2?: any) { this.engine.onCtrlEvent('grid', 'load', $event); } /** * searchform 部件 save 事件 * * @param {*} [args={}] * @param {*} $event * @memberof PIMPERSONLTXYGGridViewBase */ public searchform_save($event: any, $event2?: any) { this.engine.onCtrlEvent('searchform', 'save', $event); } /** * searchform 部件 search 事件 * * @param {*} [args={}] * @param {*} $event * @memberof PIMPERSONLTXYGGridViewBase */ public searchform_search($event: any, $event2?: any) { this.engine.onCtrlEvent('searchform', 'search', $event); } /** * searchform 部件 load 事件 * * @param {*} [args={}] * @param {*} $event * @memberof PIMPERSONLTXYGGridViewBase */ public searchform_load($event: any, $event2?: any) { this.engine.onCtrlEvent('searchform', 'load', $event); } /** * 逻辑事件 * * @param {*} [params={}] * @param {*} [tag] * @param {*} [$event] * @memberof */ protected toolbar_deuiaction3_click(params: any = {}, tag?: any, $event?: any) { // 参数 // 取数 let datas: any[] = []; let xData: any = null; // _this 指向容器对象 const _this: any = this; let paramJO:any = {}; let contextJO:any = {}; xData = this.$refs.grid; if (xData.getDatas && xData.getDatas instanceof Function) { datas = [...xData.getDatas()]; } // 界面行为 this.OpenRowEdit(datas, contextJO,paramJO, $event, xData,this,"PIMPERSON"); } /** * 逻辑事件 * * @param {*} [params={}] * @param {*} [tag] * @param {*} [$event] * @memberof */ protected toolbar_deuiaction6_click(params: any = {}, tag?: any, $event?: any) { // 参数 // 取数 let datas: any[] = []; let xData: any = null; // _this 指向容器对象 const _this: any = this; let paramJO:any = {}; let contextJO:any = {}; xData = this.$refs.grid; if (xData.getDatas && xData.getDatas instanceof Function) { datas = [...xData.getDatas()]; } // 界面行为 this.ExportExcel(datas, contextJO,paramJO, $event, xData,this,"PIMPERSON"); } /** * 逻辑事件 * * @param {*} [params={}] * @param {*} [tag] * @param {*} [$event] * @memberof */ protected toolbar_deuiaction2_click(params: any = {}, tag?: any, $event?: any) { // 参数 // 取数 let datas: any[] = []; let xData: any = null; // _this 指向容器对象 const _this: any = this; let paramJO:any = {}; let contextJO:any = {}; xData = this.$refs.grid; if (xData.getDatas && xData.getDatas instanceof Function) { datas = [...xData.getDatas()]; } // 界面行为 this.ToggleFilter(datas, contextJO,paramJO, $event, xData,this,"PIMPERSON"); } /** * 打开新建数据视图 * * @param {any[]} args * @param {*} [params] * @param {*} [fullargs] * @param {*} [$event] * @param {*} [xData] * @memberof PIMPERSONLTXYGGridView */ protected newdata(args: any[],fullargs?:any[], params?: any, $event?: any, xData?: any) { const data: any = {}; let curViewParam = JSON.parse(JSON.stringify(this.context)); if(args.length >0){ Object.assign(curViewParam,args[0]); } const deResParameters: any[] = []; const parameters: any[] = [ { pathName: 'pimpeople', parameterName: 'pimperson' }, ]; const _this: any = this; const openDrawer = (view: any, data: any) => { let container: Subject<any> = this.$appdrawer.openDrawer(view, curViewParam, data); container.subscribe((result: any) => { if (!result || !Object.is(result.ret, 'OK')) { return; } if (!xData || !(xData.refresh instanceof Function)) { return; } xData.refresh(result.datas); }); } const view: any = { viewname: 'pimpersonedit-view2', height: 0, width: 0, title: this.$t('entities.pimperson.views.editview2.title'), placement: 'DRAWER_TOP', }; openDrawer(view, data); } /** * 打开编辑数据视图 * * @param {any[]} args * @param {*} [params] * @param {*} [fullargs] * @param {*} [$event] * @param {*} [xData] * @memberof PIMPERSONLTXYGGridView */ protected opendata(args: any[],fullargs?:any[],params?: any, $event?: any, xData?: any) { const data: any = {}; let curViewParam = JSON.parse(JSON.stringify(this.context)); if(args.length >0){ Object.assign(curViewParam,args[0]); } const deResParameters: any[] = []; const parameters: any[] = [ { pathName: 'pimpeople', parameterName: 'pimperson' }, ]; const _this: any = this; const openDrawer = (view: any, data: any) => { let container: Subject<any> = this.$appdrawer.openDrawer(view, curViewParam, data); container.subscribe((result: any) => { if (!result || !Object.is(result.ret, 'OK')) { return; } if (!xData || !(xData.refresh instanceof Function)) { return; } xData.refresh(result.datas); }); } const view: any = { viewname: 'pimpersonedit-view2', height: 0, width: 0, title: this.$t('entities.pimperson.views.editview2.title'), placement: 'DRAWER_TOP', }; openDrawer(view, data); } /** * 开启行编辑 * * @param {any[]} args 当前数据 * @param {any} contextJO 行为附加上下文 * @param {*} [params] 附加参数 * @param {*} [$event] 事件源 * @param {*} [xData] 执行行为所需当前部件 * @param {*} [actionContext] 执行行为上下文 * @memberof PIMPERSONLTXYGGridViewBase */ protected OpenRowEdit(args: any[],contextJO?:any, params?: any, $event?: any, xData?: any,actionContext?:any,srfParentDeName?:string) { } /** * 导出 * * @param {any[]} args 当前数据 * @param {any} contextJO 行为附加上下文 * @param {*} [params] 附加参数 * @param {*} [$event] 事件源 * @param {*} [xData] 执行行为所需当前部件 * @param {*} [actionContext] 执行行为上下文 * @memberof PIMPERSONLTXYGGridViewBase */ protected ExportExcel(args: any[],contextJO?:any, params?: any, $event?: any, xData?: any,actionContext?:any,srfParentDeName?:string) { const _this: any = this; if (!xData || !(xData.exportExcel instanceof Function) || !$event) { return ; } xData.exportExcel($event.exportparms); } /** * 过滤 * * @param {any[]} args 当前数据 * @param {any} contextJO 行为附加上下文 * @param {*} [params] 附加参数 * @param {*} [$event] 事件源 * @param {*} [xData] 执行行为所需当前部件 * @param {*} [actionContext] 执行行为上下文 * @memberof PIMPERSONLTXYGGridViewBase */ protected ToggleFilter(args: any[],contextJO?:any, params?: any, $event?: any, xData?: any,actionContext?:any,srfParentDeName?:string) { const _this: any = this; if (_this.hasOwnProperty('isExpandSearchForm')) { _this.isExpandSearchForm = !_this.isExpandSearchForm; } } /** * 销毁视图回调 * * @memberof PIMPERSONLTXYGGridViewBase */ public destroyed(){ 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); } }) } } } /** * 是否单选 * * @type {boolean} * @memberof PIMPERSONLTXYGGridViewBase */ public isSingleSelect: boolean = false; /** * Vue声明周期 * * @memberof ViewBase */ public created() { super.created(); if(this.formDruipart){ this.formDruipart.subscribe((res:any) =>{ if(Object.is(res.action,'save')){ this.viewState.next({ tag:'grid', action: 'save', data: this.viewparams }); } if(Object.is(res.action,'load')){ const _this: any = this; _this.engine.load(res.data,true); } }); } } /** * 界面关系通讯对象 * * @type {Subject<ViewState>} * @memberof PIMPERSONLTXYGGridViewBase */ @Prop() public formDruipart?: Subject<ViewState>; /** * 搜索值 * * @type {string} * @memberof PIMPERSONLTXYGGridViewBase */ public query: string = ''; /** * 是否展开搜索表单 * * @type {boolean} * @memberof PIMPERSONLTXYGGridViewBase */ public isExpandSearchForm: boolean = false; /** * 表格行数据默认激活模式 * 0 不激活 * 1 单击激活 * 2 双击激活 * * @type {(number | 0 | 1 | 2)} * @memberof PIMPERSONLTXYGGridViewBase */ public gridRowActiveMode: number | 0 | 1 | 2 = 0; /** * 快速搜索 * * @param {*} $event * @memberof PIMPERSONLTXYGGridViewBase */ public onSearch($event: any): void { const grid: any = this.$refs.grid; if (grid) { grid.load(this.context); } } /** * grid 部件 save 事件 * * @param {*} [args={}] * @param {*} $event * @memberof ENTITYTEST1Usr2GridViewBase */ public onSave($event: any) { this.$emit('drdatasaved', $event); } /** * 刷新数据 * * @readonly * @type {(number | null)} * @memberof PIMPERSONLTXYGGridViewBase */ get refreshdata(): number | null { return this.$store.getters['viewaction/getRefreshData'](this.viewtag); } /** * 监控数据变化 * * @param {*} newVal * @param {*} oldVal * @returns * @memberof PIMPERSONLTXYGGridViewBase */ @Watch('refreshdata') onRefreshData(newVal: any, oldVal: any) { if (newVal === null || newVal === undefined) { return; } if (newVal === 0) { return; } const grid: any = this.$refs.grid; if (grid) { grid.load({}); } } } </script> <style lang='less'> @import './pimpersonltxyggrid-view.less'; </style>