Skip to content

功
功能演示系统
提交 94c1446b 编写于 作者: ibizdev's avatar ibizdev
浏览文件
操作

Mosher 发布系统代码 [后台服务，演示应用]

上级 bb1d22cd
隐藏空白字符变更
内嵌 并排
正在显示 包含 3518 行增加 和 4257 行删除
app_Web/src/engine/view/calendar-exp-view-engine.ts
浏览文件 @ 94c1446b
import ViewEngine from './view-engine'; import { ExpViewEngine } from './exp-view-engine';
/** /**
* 日历导航视图界面引擎 * 日历导航视图界面引擎
...@@ -7,24 +7,7 @@ import ViewEngine from './view-engine'; ...@@ -7,24 +7,7 @@ import ViewEngine from './view-engine';
* @class CalendarExpViewEngine * @class CalendarExpViewEngine
* @extends {ViewEngine} * @extends {ViewEngine}
*/ */
export default class CalendarExpViewEngine extends ViewEngine { export default class CalendarExpViewEngine extends ExpViewEngine {
/**
* 日历导航栏部件
*
* @type {*}
* @memberof CalendarExpViewEngine
*/
public calendarExpBar: any = null;
/**
* Creates an instance of CalendarExpViewEngine.
*
* @memberof CalendarExpViewEngine
*/
constructor() {
super();
}
/** /**
* 初始化引擎 * 初始化引擎
...@@ -33,78 +16,17 @@ export default class CalendarExpViewEngine extends ViewEngine { ...@@ -33,78 +16,17 @@ export default class CalendarExpViewEngine extends ViewEngine {
* @memberof CalendarExpViewEngine * @memberof CalendarExpViewEngine
*/ */
public init(options: any): void { public init(options: any): void {
this.calendarExpBar = options.calendarexpbar; this.expBar = options.calendarexpbar;
super.init(options); super.init(options);
} }
/**
* 引擎加载
*
* @memberof CalendarExpViewEngine
*/
public load(): void {
super.load();
if (this.getCalendarExpBar() && this.isLoadDefault) {
const tag = this.getCalendarExpBar().name;
this.setViewState2({ tag: tag, action: 'load', viewdata: this.view.viewparams });
} else {
this.isLoadDefault = true;
}
}
/**
* 部件事件机制
*
* @param {string} ctrlName
* @param {string} eventName
* @param {*} args
* @memberof CalendarExpViewEngine
*/
public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
super.onCtrlEvent(ctrlName, eventName, args);
if (Object.is(ctrlName, 'calendarexpbar')) {
this.calendarExpBarEvent(eventName, args);
}
}
/**
* 日历导航事件
*
* @param {string} eventName
* @param {*} args
* @memberof CalendarExpViewEngine
*/
public calendarExpBarEvent(eventName: string, args: any): void {
if (Object.is(eventName, 'load')) {
this.view.$emit('viewload', args);
}
if (Object.is(eventName, 'selectionchange')) {
this.view.$emit('viewdataschange', args);
}
if (Object.is(eventName, 'activated')) {
this.view.$emit('viewdatasactivated', args);
}
}
/**
* 获取部件对象
*
* @returns {*}
* @memberof CalendarExpViewEngine
*/
public getCalendarExpBar(): any {
return this.calendarExpBar;
}
/** /**
* @description 销毁 * @description 视图销毁
* @memberof CalendarExpViewEngine * @memberof CalendarExpViewEngine
*/ */
public destroy() { public destroyed() {
super.destroy(); super.destroyed();
this.calendarExpBar = null; this.expBar = null;
} }
} }
\ No newline at end of file
app_Web/src/engine/view/data-view-exp-view-engine.ts
浏览文件 @ 94c1446b
import ViewEngine from './view-engine'; import { ExpViewEngine } from './exp-view-engine';
/** /**
* 卡片视图导航视图界面引擎 * 卡片视图导航视图界面引擎
...@@ -7,24 +7,7 @@ import ViewEngine from './view-engine'; ...@@ -7,24 +7,7 @@ import ViewEngine from './view-engine';
* @class DataViewExpViewEngine * @class DataViewExpViewEngine
* @extends {ViewEngine} * @extends {ViewEngine}
*/ */
export default class DataViewExpViewEngine extends ViewEngine { export default class DataViewExpViewEngine extends ExpViewEngine {
/**
* 卡片导航栏部件
*
* @type {*}
* @memberof DataViewExpViewEngine
*/
public dataviewExpBar: any = null;
/**
* Creates an instance of DataViewExpViewEngine.
*
* @memberof DataViewExpViewEngine
*/
constructor() {
super();
}
/** /**
* 初始化引擎 * 初始化引擎
...@@ -33,79 +16,17 @@ export default class DataViewExpViewEngine extends ViewEngine { ...@@ -33,79 +16,17 @@ export default class DataViewExpViewEngine extends ViewEngine {
* @memberof DataViewExpViewEngine * @memberof DataViewExpViewEngine
*/ */
public init(options: any): void { public init(options: any): void {
this.dataviewExpBar = options.dataviewexpbar; this.expBar = options.dataviewexpbar;
super.init(options); super.init(options);
} }
/** /**
* 引擎加载 * @description 视图销毁
*
* @memberof DataViewExpViewEngine * @memberof DataViewExpViewEngine
*/ */
public load(): void { public destroyed() {
super.load(); super.destroyed();
if (this.getDataviewExpBar() && this.isLoadDefault) { this.expBar = null;
const tag = this.getDataviewExpBar().name;
this.setViewState2({ tag: tag, action: 'load', viewdata: this.view.viewparams });
} else {
this.isLoadDefault = true;
}
}
/**
* 部件事件机制
*
* @param {string} ctrlName
* @param {string} eventName
* @param {*} args
* @memberof DataViewExpViewEngine
*/
public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
super.onCtrlEvent(ctrlName, eventName, args);
if (Object.is(ctrlName, 'dataviewexpbar')) {
this.dataviewExpBarEvent(eventName, args);
}
} }
/**
* 卡片导航事件
*
* @param {string} eventName
* @param {*} args
* @memberof DataViewExpViewEngine
*/
public dataviewExpBarEvent(eventName: string, args: any): void {
if (Object.is(eventName, 'load')) {
this.view.$emit('viewload', args);
}
if (Object.is(eventName, 'selectionchange')) {
this.view.$emit('viewdataschange', args);
}
if (Object.is(eventName, 'activated')) {
this.view.$emit('viewdatasactivated', args);
}
}
/**
* 获取部件对象
*
* @returns {*}
* @memberof DataViewExpViewEngine
*/
public getDataviewExpBar(): any {
return this.dataviewExpBar;
}
/**
* @description 销毁
* @memberof DataViewExpViewEngine
*/
public destroy() {
super.destroy();
this.dataviewExpBar = null;
}
} }
\ No newline at end of file
app_Web/src/engine/view/tree-exp-view-engine.ts
浏览文件 @ 94c1446b
import ViewEngine from './view-engine'; import { ExpViewEngine } from './exp-view-engine';
/** /**
* 实体树导航视图界面引擎 * 实体树导航视图界面引擎
* *
* @export * @export
* @class TreeExpView * @class TreeExpViewEngine
* @extends {ViewEngine} * @extends {ViewEngine}
*/ */
export default class TreeExpView extends ViewEngine { export default class TreeExpViewEngine extends ExpViewEngine {
/**
* 选择视图面板
*
* @type {*}
* @memberof TreeExpView
*/
public treeExpBar: any = null;
/**
* Creates an instance of TreeExpView.
*
* @memberof TreeExpView
*/
constructor() {
super();
}
/** /**
* 初始化引擎 * 初始化引擎
* *
* @param {*} options * @param {*} options
* @memberof TreeExpView * @memberof TreeExpViewEngine
*/ */
public init(options: any): void { public init(options: any): void {
this.treeExpBar = options.treeexpbar; this.expBar = options.treeexpbar;
super.init(options); super.init(options);
} }
/**
* 引擎加载
*
* @memberof TreeExpView
*/
public load(): void {
super.load();
if (this.getTreeExpBar() && this.isLoadDefault) {
const tag = this.getTreeExpBar().name;
this.setViewState2({ tag: tag, action: 'load', viewdata: this.view.context });
} else {
this.isLoadDefault = true;
}
}
/**
* 部件事件机制
*
* @param {string} ctrlName
* @param {string} eventName
* @param {*} args
* @memberof TreeExpView
*/
public onCtrlEvent(ctrlName: string, eventName: string, args: any): void {
super.onCtrlEvent(ctrlName, eventName, args);
if (Object.is(ctrlName, 'treeexpbar')) {
this.treeExpBarEvent(eventName, args);
}
}
/**
* 树导航事件
*
* @param {string} eventName
* @param {*} args
* @memberof TreeExpView
*/
public treeExpBarEvent(eventName: string, args: any): void {
if (Object.is(eventName, 'load')) {
this.view.$emit('viewload', args);
}
if (Object.is(eventName, 'selectionchange')) {
this.view.$emit('viewdataschange', args);
}
if (Object.is(eventName, 'activated')) {
this.view.$emit('viewdatasactivated', args);
}
}
/**
* 获取部件对象那
*
* @returns {*}
* @memberof TreeExpView
*/
public getTreeExpBar(): any {
return this.treeExpBar;
}
/** /**
* @description 销毁 * @description 视图销毁
* @memberof TreeExpView * @memberof TreeExpViewEngine
*/ */
public destroy() { public destroyed() {
super.destroy(); super.destroyed();
this.treeExpBar = null; this.expBar = null;
} }
} }
\ No newline at end of file
app_Web/src/pages/sample/ibizbookdata-view-exp-view/ibizbookdata-view-exp-view-base.vue
浏览文件 @ 94c1446b
<template> <template>
<div class="view-container dedataviewexpview ibizbookdata-view-exp-view"> <div class="view-container dedataviewexpview ibizbookdata-view-exp-view">
<app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizbookdataviewexpview"></app-studioaction> <app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizbookdataviewexpview"></app-studioaction>
<card class='view-card view-no-toolbar' :dis-hover="true" :bordered="false"> <card class='view-card view-no-toolbar' :dis-hover="true" :bordered="false">
<div slot='title' class="header-container"> <div slot='title' class="header-container">
<span class='caption-info'>{{$t(model.srfCaption)}}</span> <span class='caption-info'>{{$t(model.srfCaption)}}</span>
</div> </div>
<div class="content-container">
<div class="content-container"> <split v-model="split" mode="horizontal" @on-move-end="onSplitChange">
<view_dataviewexpbar <template slot="left">
<view_dataviewexpbar
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
:context="context" :context="context"
...@@ -24,13 +24,25 @@ ...@@ -24,13 +24,25 @@
@load="dataviewexpbar_load($event)" @load="dataviewexpbar_load($event)"
@activated="dataviewexpbar_activated($event)" @activated="dataviewexpbar_activated($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_dataviewexpbar> </view_dataviewexpbar>
</div> </template>
</card> <template slot="right">
<component
v-if="navItem && navItem.navView"
:is="navItem.navView"
:key="navItem.data && navItem.data.length ? navItem.data[0].srfkey : ''"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(navItem.srfnavdata.context)"
:viewparam="JSON.stringify(navItem.srfnavdata.viewparams)">
</component>
</template>
</split>
</div>
</card>
</div> </div>
</template> </template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator';
import { UIActionTool,Util } from '@/utils'; import { UIActionTool,Util } from '@/utils';
...@@ -43,8 +55,6 @@ import DataViewExpViewEngine from '@engine/view/data-view-exp-view-engine'; ...@@ -43,8 +55,6 @@ import DataViewExpViewEngine from '@engine/view/data-view-exp-view-engine';
import IBIZBOOKUIService from '@/uiservice/ibizbook/ibizbook-ui-service'; import IBIZBOOKUIService from '@/uiservice/ibizbook/ibizbook-ui-service';
import CodeListService from "@/codelist/codelist-service";
@Component({ @Component({
components: { components: {
...@@ -227,8 +237,8 @@ export default class IBIZBOOKDataViewExpViewBase extends Vue { ...@@ -227,8 +237,8 @@ export default class IBIZBOOKDataViewExpViewBase extends Vue {
* @memberof IBIZBOOKDataViewExpViewBase * @memberof IBIZBOOKDataViewExpViewBase
*/ */
public viewState: Subject<ViewState> = new Subject(); public viewState: Subject<ViewState> = new Subject();
/** /**
* 视图引擎 * 视图引擎
...@@ -567,7 +577,6 @@ export default class IBIZBOOKDataViewExpViewBase extends Vue { ...@@ -567,7 +577,6 @@ export default class IBIZBOOKDataViewExpViewBase extends Vue {
_this.loadModel(); _this.loadModel();
} }
} }
...@@ -713,50 +722,59 @@ export default class IBIZBOOKDataViewExpViewBase extends Vue { ...@@ -713,50 +722,59 @@ export default class IBIZBOOKDataViewExpViewBase extends Vue {
} }
this.viewState.complete(); this.viewState.complete();
} }
/**
/** * 视图唯一标识
* 视图唯一标识 *
* * @type {string}
* @type {string} * @memberof IBIZBOOKDataViewExpViewBase
* @memberof IBIZBOOKDataViewExpViewBase */
*/ public viewUID: string = 'sample-ibizbookdata-view-exp-view';
public viewUID: string = 'sample-ibizbookdata-view-exp-view';
/**
/** * 分隔值
* 搜索值 *
* * @type {number}
* @type {string} * @memberof IBIZBOOKDataViewExpViewBase
* @memberof IBIZBOOKDataViewExpViewBase */
*/ public split: number = 0.5;
public query: string = '';
/**
/** * 导航项
* 是否展开搜索表单 *
* * @type {*}
* @type {boolean} * @memberof IBIZBOOKDataViewExpViewBase
* @memberof IBIZBOOKDataViewExpViewBase */
*/ public navItem: any = {};
public isExpandSearchForm: boolean = false;
/**
/** * split值变化事件
* 快速搜索 *
* * @memberof IBIZBOOKDataViewExpViewBase
* @param {*} $event */
* @memberof IBIZBOOKDataViewExpViewBase public onSplitChange() {
*/ if (this.split) {
public onSearch($event: any): void { this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
const refs: any = this.$refs; }
if (refs.kanban) { }
refs.kanban.refresh({});
} /**
} * 初始化分隔值
*
* @memberof IBIZBOOKDataViewExpViewBase
*/
public initSplit() {
if (this.$store.getters.getViewSplit(this.viewUID)) {
this.split = this.$store.getters.getViewSplit(this.viewUID);
} else {
const containerWidth = (this.$el as any).offsetWidth;
this.split = 0 / containerWidth;
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './ibizbookdata-view-exp-view.less'; @import './ibizbookdata-view-exp-view.less';
</style> </style>
\ No newline at end of file
app_Web/src/pages/sample/ibizorder-calendar-exp-view/ibizorder-calendar-exp-view-base.vue
浏览文件 @ 94c1446b
<template> <template>
<div class="view-container decalendarexpview ibizorder-calendar-exp-view"> <div class="view-container decalendarexpview ibizorder-calendar-exp-view">
<app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizordercalendarexpview"></app-studioaction> <app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizordercalendarexpview"></app-studioaction>
<card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false"> <card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false">
<div class='view-top-messages'> <div class='view-top-messages'>
<app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup46' viewname='ibizordercalendarexpview'></app-alert-group> </div> <app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup46' viewname='ibizordercalendarexpview'></app-alert-group> </div>
<div class="content-container"> <div class="content-container">
<view_calendarexpbar <split v-model="split" mode="horizontal" @on-move-end="onSplitChange">
<template slot="left">
<view_calendarexpbar
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
:context="context" :context="context"
...@@ -23,12 +23,25 @@ ...@@ -23,12 +23,25 @@
@load="calendarexpbar_load($event)" @load="calendarexpbar_load($event)"
@activated="calendarexpbar_activated($event)" @activated="calendarexpbar_activated($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_calendarexpbar> </view_calendarexpbar>
</div> </template>
</card> <template slot="right">
<component
v-if="navItem && navItem.navView"
:is="navItem.navView"
:key="navItem.data && navItem.data.length ? navItem.data[0].srfkey : ''"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(navItem.srfnavdata.context)"
:viewparam="JSON.stringify(navItem.srfnavdata.viewparams)">
</component>
</template>
</split>
</div>
</card>
</div> </div>
</template> </template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator';
import { UIActionTool,Util } from '@/utils'; import { UIActionTool,Util } from '@/utils';
...@@ -224,8 +237,8 @@ export default class IBIZOrderCalendarExpViewBase extends Vue { ...@@ -224,8 +237,8 @@ export default class IBIZOrderCalendarExpViewBase extends Vue {
* @memberof IBIZOrderCalendarExpViewBase * @memberof IBIZOrderCalendarExpViewBase
*/ */
public viewState: Subject<ViewState> = new Subject(); public viewState: Subject<ViewState> = new Subject();
/** /**
* 视图引擎 * 视图引擎
...@@ -760,18 +773,60 @@ export default class IBIZOrderCalendarExpViewBase extends Vue { ...@@ -760,18 +773,60 @@ export default class IBIZOrderCalendarExpViewBase extends Vue {
} }
this.viewState.complete(); this.viewState.complete();
} }
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {string} * @type {string}
* @memberof IBIZOrderCalendarExpViewBase * @memberof IBIZOrderCalendarExpViewBase
*/ */
public viewUID: string = 'sample-ibizorder-calendar-exp-view'; public viewUID: string = 'sample-ibizorder-calendar-exp-view';
/**
* 分隔值
*
* @type {number}
* @memberof IBIZOrderCalendarExpViewBase
*/
public split: number = 0.5;
/**
* 导航项
*
* @type {*}
* @memberof IBIZOrderCalendarExpViewBase
*/
public navItem: any = {};
/**
* split值变化事件
*
* @memberof IBIZOrderCalendarExpViewBase
*/
public onSplitChange() {
if (this.split) {
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
/**
* 初始化分隔值
*
* @memberof IBIZOrderCalendarExpViewBase
*/
public initSplit() {
if (this.$store.getters.getViewSplit(this.viewUID)) {
this.split = this.$store.getters.getViewSplit(this.viewUID);
} else {
const containerWidth = (this.$el as any).offsetWidth;
this.split = 0 / containerWidth;
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './ibizorder-calendar-exp-view.less'; @import './ibizorder-calendar-exp-view.less';
</style> </style>
\ No newline at end of file
app_Web/src/pages/sample/ibizorder-data-view-exp-view/ibizorder-data-view-exp-view-base.vue
浏览文件 @ 94c1446b
<template> <template>
<div class="view-container dedataviewexpview ibizorder-data-view-exp-view"> <div class="view-container dedataviewexpview ibizorder-data-view-exp-view">
<app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizorderdataviewexpview"></app-studioaction> <app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizorderdataviewexpview"></app-studioaction>
<card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false"> <card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false">
<div class='view-top-messages'> <div class='view-top-messages'>
<app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup49' viewname='ibizorderdataviewexpview'></app-alert-group> </div> <app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup49' viewname='ibizorderdataviewexpview'></app-alert-group> </div>
<div class="content-container"> <div class="content-container">
<view_dataviewexpbar <split v-model="split" mode="horizontal" @on-move-end="onSplitChange">
<template slot="left">
<view_dataviewexpbar
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
:context="context" :context="context"
...@@ -23,13 +23,25 @@ ...@@ -23,13 +23,25 @@
@load="dataviewexpbar_load($event)" @load="dataviewexpbar_load($event)"
@activated="dataviewexpbar_activated($event)" @activated="dataviewexpbar_activated($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_dataviewexpbar> </view_dataviewexpbar>
</div> </template>
</card> <template slot="right">
<component
v-if="navItem && navItem.navView"
:is="navItem.navView"
:key="navItem.data && navItem.data.length ? navItem.data[0].srfkey : ''"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(navItem.srfnavdata.context)"
:viewparam="JSON.stringify(navItem.srfnavdata.viewparams)">
</component>
</template>
</split>
</div>
</card>
</div> </div>
</template> </template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator';
import { UIActionTool,Util } from '@/utils'; import { UIActionTool,Util } from '@/utils';
...@@ -42,8 +54,6 @@ import DataViewExpViewEngine from '@engine/view/data-view-exp-view-engine'; ...@@ -42,8 +54,6 @@ import DataViewExpViewEngine from '@engine/view/data-view-exp-view-engine';
import IBIZOrderUIService from '@/uiservice/ibizorder/ibizorder-ui-service'; import IBIZOrderUIService from '@/uiservice/ibizorder/ibizorder-ui-service';
import CodeListService from "@/codelist/codelist-service";
@Component({ @Component({
components: { components: {
...@@ -227,8 +237,8 @@ export default class IBIZOrderDataViewExpViewBase extends Vue { ...@@ -227,8 +237,8 @@ export default class IBIZOrderDataViewExpViewBase extends Vue {
* @memberof IBIZOrderDataViewExpViewBase * @memberof IBIZOrderDataViewExpViewBase
*/ */
public viewState: Subject<ViewState> = new Subject(); public viewState: Subject<ViewState> = new Subject();
/** /**
* 视图引擎 * 视图引擎
...@@ -567,7 +577,6 @@ export default class IBIZOrderDataViewExpViewBase extends Vue { ...@@ -567,7 +577,6 @@ export default class IBIZOrderDataViewExpViewBase extends Vue {
_this.loadModel(); _this.loadModel();
} }
} }
...@@ -764,50 +773,59 @@ export default class IBIZOrderDataViewExpViewBase extends Vue { ...@@ -764,50 +773,59 @@ export default class IBIZOrderDataViewExpViewBase extends Vue {
} }
this.viewState.complete(); this.viewState.complete();
} }
/**
/** * 视图唯一标识
* 视图唯一标识 *
* * @type {string}
* @type {string} * @memberof IBIZOrderDataViewExpViewBase
* @memberof IBIZOrderDataViewExpViewBase */
*/ public viewUID: string = 'sample-ibizorder-data-view-exp-view';
public viewUID: string = 'sample-ibizorder-data-view-exp-view';
/**
/** * 分隔值
* 搜索值 *
* * @type {number}
* @type {string} * @memberof IBIZOrderDataViewExpViewBase
* @memberof IBIZOrderDataViewExpViewBase */
*/ public split: number = 0.5;
public query: string = '';
/**
/** * 导航项
* 是否展开搜索表单 *
* * @type {*}
* @type {boolean} * @memberof IBIZOrderDataViewExpViewBase
* @memberof IBIZOrderDataViewExpViewBase */
*/ public navItem: any = {};
public isExpandSearchForm: boolean = false;
/**
/** * split值变化事件
* 快速搜索 *
* * @memberof IBIZOrderDataViewExpViewBase
* @param {*} $event */
* @memberof IBIZOrderDataViewExpViewBase public onSplitChange() {
*/ if (this.split) {
public onSearch($event: any): void { this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
const refs: any = this.$refs; }
if (refs.kanban) { }
refs.kanban.refresh({});
} /**
} * 初始化分隔值
*
* @memberof IBIZOrderDataViewExpViewBase
*/
public initSplit() {
if (this.$store.getters.getViewSplit(this.viewUID)) {
this.split = this.$store.getters.getViewSplit(this.viewUID);
} else {
const containerWidth = (this.$el as any).offsetWidth;
this.split = 0 / containerWidth;
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './ibizorder-data-view-exp-view.less'; @import './ibizorder-data-view-exp-view.less';
</style> </style>
\ No newline at end of file
app_Web/src/pages/sample/ibizorder-tree-exp-view/ibizorder-tree-exp-view-base.vue
浏览文件 @ 94c1446b
<template> <template>
<div class='view-container detreeexpview ibizorder-tree-exp-view'> <div class='view-container detreeexpview ibizorder-tree-exp-view'>
<app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizordertreeexpview"></app-studioaction> <app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizordertreeexpview"></app-studioaction>
<card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false"> <card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false">
<div class='view-top-messages'> <div class='view-top-messages'>
<app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup48' viewname='ibizordertreeexpview'></app-alert-group> </div> <app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup48' viewname='ibizordertreeexpview'></app-alert-group> </div>
<div class='content-container'> <div class='content-container'>
<split v-model="split" mode="horizontal" @on-move-end="onSplitChange">
<template slot="left">
<view_treeexpbar <view_treeexpbar
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
...@@ -22,11 +23,24 @@ ...@@ -22,11 +23,24 @@
@activated="treeexpbar_activated($event)" @activated="treeexpbar_activated($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_treeexpbar> </view_treeexpbar>
</div> </template>
</card> <template slot="right">
<component
v-if="navItem && navItem.navView"
:is="navItem.navView"
:key="navItem.data && navItem.data.length ? navItem.data[0].srfkey : ''"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(navItem.srfnavdata.context)"
:viewparam="JSON.stringify(navItem.srfnavdata.viewparams)">
</component>
</template>
</split>
</div>
</card>
</div> </div>
</template> </template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator';
import { UIActionTool,Util } from '@/utils'; import { UIActionTool,Util } from '@/utils';
...@@ -222,7 +236,7 @@ export default class IBIZOrderTreeExpViewBase extends Vue { ...@@ -222,7 +236,7 @@ export default class IBIZOrderTreeExpViewBase extends Vue {
* @memberof IBIZOrderTreeExpViewBase * @memberof IBIZOrderTreeExpViewBase
*/ */
public viewState: Subject<ViewState> = new Subject(); public viewState: Subject<ViewState> = new Subject();
/** /**
* 视图引擎 * 视图引擎
...@@ -757,18 +771,60 @@ export default class IBIZOrderTreeExpViewBase extends Vue { ...@@ -757,18 +771,60 @@ export default class IBIZOrderTreeExpViewBase extends Vue {
} }
this.viewState.complete(); this.viewState.complete();
} }
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {string} * @type {string}
* @memberof IBIZOrderTreeExpViewBase * @memberof IBIZOrderTreeExpViewBase
*/ */
public viewUID: string = 'sample-ibizorder-tree-exp-view'; public viewUID: string = 'sample-ibizorder-tree-exp-view';
/**
* 分隔值
*
* @type {number}
* @memberof IBIZOrderTreeExpViewBase
*/
public split: number = 0.5;
/**
* 导航项
*
* @type {*}
* @memberof IBIZOrderTreeExpViewBase
*/
public navItem: any = {};
/**
* split值变化事件
*
* @memberof IBIZOrderTreeExpViewBase
*/
public onSplitChange() {
if (this.split) {
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
/**
* 初始化分隔值
*
* @memberof IBIZOrderTreeExpViewBase
*/
public initSplit() {
if (this.$store.getters.getViewSplit(this.viewUID)) {
this.split = this.$store.getters.getViewSplit(this.viewUID);
} else {
const containerWidth = (this.$el as any).offsetWidth;
this.split = 500 / containerWidth;
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './ibizorder-tree-exp-view.less'; @import './ibizorder-tree-exp-view.less';
</style> </style>
\ No newline at end of file
app_Web/src/pages/sample/ibizorder-usr2-calendar-exp-view/ibizorder-usr2-calendar-exp-view-base.vue
浏览文件 @ 94c1446b
<template> <template>
<div class="view-container decalendarexpview ibizorder-usr2-calendar-exp-view"> <div class="view-container decalendarexpview ibizorder-usr2-calendar-exp-view">
<app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizorderusr2calendarexpview"></app-studioaction> <app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizorderusr2calendarexpview"></app-studioaction>
<card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false"> <card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false">
<div class='view-top-messages'> <div class='view-top-messages'>
<app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup47' viewname='ibizorderusr2calendarexpview'></app-alert-group> </div> <app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup47' viewname='ibizorderusr2calendarexpview'></app-alert-group> </div>
<div class="content-container"> <div class="content-container">
<view_calendarexpbar <split v-model="split" mode="horizontal" @on-move-end="onSplitChange">
<template slot="left">
<view_calendarexpbar
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
:context="context" :context="context"
...@@ -23,12 +23,25 @@ ...@@ -23,12 +23,25 @@
@load="calendarexpbar_load($event)" @load="calendarexpbar_load($event)"
@activated="calendarexpbar_activated($event)" @activated="calendarexpbar_activated($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_calendarexpbar> </view_calendarexpbar>
</div> </template>
</card> <template slot="right">
<component
v-if="navItem && navItem.navView"
:is="navItem.navView"
:key="navItem.data && navItem.data.length ? navItem.data[0].srfkey : ''"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(navItem.srfnavdata.context)"
:viewparam="JSON.stringify(navItem.srfnavdata.viewparams)">
</component>
</template>
</split>
</div>
</card>
</div> </div>
</template> </template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator';
import { UIActionTool,Util } from '@/utils'; import { UIActionTool,Util } from '@/utils';
...@@ -224,8 +237,8 @@ export default class IBIZOrderUsr2CalendarExpViewBase extends Vue { ...@@ -224,8 +237,8 @@ export default class IBIZOrderUsr2CalendarExpViewBase extends Vue {
* @memberof IBIZOrderUsr2CalendarExpViewBase * @memberof IBIZOrderUsr2CalendarExpViewBase
*/ */
public viewState: Subject<ViewState> = new Subject(); public viewState: Subject<ViewState> = new Subject();
/** /**
* 视图引擎 * 视图引擎
...@@ -760,18 +773,60 @@ export default class IBIZOrderUsr2CalendarExpViewBase extends Vue { ...@@ -760,18 +773,60 @@ export default class IBIZOrderUsr2CalendarExpViewBase extends Vue {
} }
this.viewState.complete(); this.viewState.complete();
} }
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {string} * @type {string}
* @memberof IBIZOrderUsr2CalendarExpViewBase * @memberof IBIZOrderUsr2CalendarExpViewBase
*/ */
public viewUID: string = 'sample-ibizorder-usr2-calendar-exp-view'; public viewUID: string = 'sample-ibizorder-usr2-calendar-exp-view';
/**
* 分隔值
*
* @type {number}
* @memberof IBIZOrderUsr2CalendarExpViewBase
*/
public split: number = 0.5;
/**
* 导航项
*
* @type {*}
* @memberof IBIZOrderUsr2CalendarExpViewBase
*/
public navItem: any = {};
/**
* split值变化事件
*
* @memberof IBIZOrderUsr2CalendarExpViewBase
*/
public onSplitChange() {
if (this.split) {
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
/**
* 初始化分隔值
*
* @memberof IBIZOrderUsr2CalendarExpViewBase
*/
public initSplit() {
if (this.$store.getters.getViewSplit(this.viewUID)) {
this.split = this.$store.getters.getViewSplit(this.viewUID);
} else {
const containerWidth = (this.$el as any).offsetWidth;
this.split = 0 / containerWidth;
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './ibizorder-usr2-calendar-exp-view.less'; @import './ibizorder-usr2-calendar-exp-view.less';
</style> </style>
\ No newline at end of file
app_Web/src/pages/sample/ibizsample0003-f1-tree-exp-view/ibizsample0003-f1-tree-exp-view-base.vue
浏览文件 @ 94c1446b
<template> <template>
<div class='view-container detreeexpview ibizsample0003-f1-tree-exp-view'> <div class='view-container detreeexpview ibizsample0003-f1-tree-exp-view'>
<app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizsample0003f1treeexpview"></app-studioaction> <app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizsample0003f1treeexpview"></app-studioaction>
<card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false"> <card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false">
<div class='view-top-messages'> <div class='view-top-messages'>
<app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup54' viewname='ibizsample0003f1treeexpview'></app-alert-group> </div> <app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup54' viewname='ibizsample0003f1treeexpview'></app-alert-group> </div>
<div class='content-container'> <div class='content-container'>
<split v-model="split" mode="horizontal" @on-move-end="onSplitChange">
<template slot="left">
<view_treeexpbar <view_treeexpbar
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
...@@ -22,11 +23,24 @@ ...@@ -22,11 +23,24 @@
@activated="treeexpbar_activated($event)" @activated="treeexpbar_activated($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_treeexpbar> </view_treeexpbar>
</div> </template>
</card> <template slot="right">
<component
v-if="navItem && navItem.navView"
:is="navItem.navView"
:key="navItem.data && navItem.data.length ? navItem.data[0].srfkey : ''"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(navItem.srfnavdata.context)"
:viewparam="JSON.stringify(navItem.srfnavdata.viewparams)">
</component>
</template>
</split>
</div>
</card>
</div> </div>
</template> </template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator';
import { UIActionTool,Util } from '@/utils'; import { UIActionTool,Util } from '@/utils';
...@@ -221,7 +235,7 @@ export default class IBIZSample0003F1TreeExpViewBase extends Vue { ...@@ -221,7 +235,7 @@ export default class IBIZSample0003F1TreeExpViewBase extends Vue {
* @memberof IBIZSample0003F1TreeExpViewBase * @memberof IBIZSample0003F1TreeExpViewBase
*/ */
public viewState: Subject<ViewState> = new Subject(); public viewState: Subject<ViewState> = new Subject();
/** /**
* 视图引擎 * 视图引擎
...@@ -705,18 +719,60 @@ export default class IBIZSample0003F1TreeExpViewBase extends Vue { ...@@ -705,18 +719,60 @@ export default class IBIZSample0003F1TreeExpViewBase extends Vue {
} }
this.viewState.complete(); this.viewState.complete();
} }
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {string} * @type {string}
* @memberof IBIZSample0003F1TreeExpViewBase * @memberof IBIZSample0003F1TreeExpViewBase
*/ */
public viewUID: string = 'sample-ibizsample0003-f1-tree-exp-view'; public viewUID: string = 'sample-ibizsample0003-f1-tree-exp-view';
/**
* 分隔值
*
* @type {number}
* @memberof IBIZSample0003F1TreeExpViewBase
*/
public split: number = 0.5;
/**
* 导航项
*
* @type {*}
* @memberof IBIZSample0003F1TreeExpViewBase
*/
public navItem: any = {};
/**
* split值变化事件
*
* @memberof IBIZSample0003F1TreeExpViewBase
*/
public onSplitChange() {
if (this.split) {
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
/**
* 初始化分隔值
*
* @memberof IBIZSample0003F1TreeExpViewBase
*/
public initSplit() {
if (this.$store.getters.getViewSplit(this.viewUID)) {
this.split = this.$store.getters.getViewSplit(this.viewUID);
} else {
const containerWidth = (this.$el as any).offsetWidth;
this.split = 0 / containerWidth;
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './ibizsample0003-f1-tree-exp-view.less'; @import './ibizsample0003-f1-tree-exp-view.less';
</style> </style>
\ No newline at end of file
app_Web/src/pages/sample/ibizsample0003-f2-tree-exp-view/ibizsample0003-f2-tree-exp-view-base.vue
浏览文件 @ 94c1446b
<template> <template>
<div class='view-container detreeexpview ibizsample0003-f2-tree-exp-view'> <div class='view-container detreeexpview ibizsample0003-f2-tree-exp-view'>
<app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizsample0003f2treeexpview"></app-studioaction> <app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizsample0003f2treeexpview"></app-studioaction>
<card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false"> <card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false">
<div class='view-top-messages'> <div class='view-top-messages'>
<app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup55' viewname='ibizsample0003f2treeexpview'></app-alert-group> </div> <app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup55' viewname='ibizsample0003f2treeexpview'></app-alert-group> </div>
<div class='content-container'> <div class='content-container'>
<split v-model="split" mode="horizontal" @on-move-end="onSplitChange">
<template slot="left">
<view_treeexpbar <view_treeexpbar
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
...@@ -22,11 +23,24 @@ ...@@ -22,11 +23,24 @@
@activated="treeexpbar_activated($event)" @activated="treeexpbar_activated($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_treeexpbar> </view_treeexpbar>
</div> </template>
</card> <template slot="right">
<component
v-if="navItem && navItem.navView"
:is="navItem.navView"
:key="navItem.data && navItem.data.length ? navItem.data[0].srfkey : ''"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(navItem.srfnavdata.context)"
:viewparam="JSON.stringify(navItem.srfnavdata.viewparams)">
</component>
</template>
</split>
</div>
</card>
</div> </div>
</template> </template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator';
import { UIActionTool,Util } from '@/utils'; import { UIActionTool,Util } from '@/utils';
...@@ -221,7 +235,7 @@ export default class IBIZSample0003F2TreeExpViewBase extends Vue { ...@@ -221,7 +235,7 @@ export default class IBIZSample0003F2TreeExpViewBase extends Vue {
* @memberof IBIZSample0003F2TreeExpViewBase * @memberof IBIZSample0003F2TreeExpViewBase
*/ */
public viewState: Subject<ViewState> = new Subject(); public viewState: Subject<ViewState> = new Subject();
/** /**
* 视图引擎 * 视图引擎
...@@ -705,18 +719,60 @@ export default class IBIZSample0003F2TreeExpViewBase extends Vue { ...@@ -705,18 +719,60 @@ export default class IBIZSample0003F2TreeExpViewBase extends Vue {
} }
this.viewState.complete(); this.viewState.complete();
} }
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {string} * @type {string}
* @memberof IBIZSample0003F2TreeExpViewBase * @memberof IBIZSample0003F2TreeExpViewBase
*/ */
public viewUID: string = 'sample-ibizsample0003-f2-tree-exp-view'; public viewUID: string = 'sample-ibizsample0003-f2-tree-exp-view';
/**
* 分隔值
*
* @type {number}
* @memberof IBIZSample0003F2TreeExpViewBase
*/
public split: number = 0.5;
/**
* 导航项
*
* @type {*}
* @memberof IBIZSample0003F2TreeExpViewBase
*/
public navItem: any = {};
/**
* split值变化事件
*
* @memberof IBIZSample0003F2TreeExpViewBase
*/
public onSplitChange() {
if (this.split) {
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
/**
* 初始化分隔值
*
* @memberof IBIZSample0003F2TreeExpViewBase
*/
public initSplit() {
if (this.$store.getters.getViewSplit(this.viewUID)) {
this.split = this.$store.getters.getViewSplit(this.viewUID);
} else {
const containerWidth = (this.$el as any).offsetWidth;
this.split = 0 / containerWidth;
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './ibizsample0003-f2-tree-exp-view.less'; @import './ibizsample0003-f2-tree-exp-view.less';
</style> </style>
\ No newline at end of file
app_Web/src/pages/sample/ibizsample0003-f3-tree-exp-view/ibizsample0003-f3-tree-exp-view-base.vue
浏览文件 @ 94c1446b
<template> <template>
<div class='view-container detreeexpview ibizsample0003-f3-tree-exp-view'> <div class='view-container detreeexpview ibizsample0003-f3-tree-exp-view'>
<app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizsample0003f3treeexpview"></app-studioaction> <app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizsample0003f3treeexpview"></app-studioaction>
<card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false"> <card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false">
<div class='view-top-messages'> <div class='view-top-messages'>
<app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup56' viewname='ibizsample0003f3treeexpview'></app-alert-group> </div> <app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup56' viewname='ibizsample0003f3treeexpview'></app-alert-group> </div>
<div class='content-container'> <div class='content-container'>
<split v-model="split" mode="horizontal" @on-move-end="onSplitChange">
<template slot="left">
<view_treeexpbar <view_treeexpbar
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
...@@ -22,11 +23,24 @@ ...@@ -22,11 +23,24 @@
@activated="treeexpbar_activated($event)" @activated="treeexpbar_activated($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_treeexpbar> </view_treeexpbar>
</div> </template>
</card> <template slot="right">
<component
v-if="navItem && navItem.navView"
:is="navItem.navView"
:key="navItem.data && navItem.data.length ? navItem.data[0].srfkey : ''"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(navItem.srfnavdata.context)"
:viewparam="JSON.stringify(navItem.srfnavdata.viewparams)">
</component>
</template>
</split>
</div>
</card>
</div> </div>
</template> </template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator';
import { UIActionTool,Util } from '@/utils'; import { UIActionTool,Util } from '@/utils';
...@@ -221,7 +235,7 @@ export default class IBIZSample0003F3TreeExpViewBase extends Vue { ...@@ -221,7 +235,7 @@ export default class IBIZSample0003F3TreeExpViewBase extends Vue {
* @memberof IBIZSample0003F3TreeExpViewBase * @memberof IBIZSample0003F3TreeExpViewBase
*/ */
public viewState: Subject<ViewState> = new Subject(); public viewState: Subject<ViewState> = new Subject();
/** /**
* 视图引擎 * 视图引擎
...@@ -705,18 +719,60 @@ export default class IBIZSample0003F3TreeExpViewBase extends Vue { ...@@ -705,18 +719,60 @@ export default class IBIZSample0003F3TreeExpViewBase extends Vue {
} }
this.viewState.complete(); this.viewState.complete();
} }
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {string} * @type {string}
* @memberof IBIZSample0003F3TreeExpViewBase * @memberof IBIZSample0003F3TreeExpViewBase
*/ */
public viewUID: string = 'sample-ibizsample0003-f3-tree-exp-view'; public viewUID: string = 'sample-ibizsample0003-f3-tree-exp-view';
/**
* 分隔值
*
* @type {number}
* @memberof IBIZSample0003F3TreeExpViewBase
*/
public split: number = 0.5;
/**
* 导航项
*
* @type {*}
* @memberof IBIZSample0003F3TreeExpViewBase
*/
public navItem: any = {};
/**
* split值变化事件
*
* @memberof IBIZSample0003F3TreeExpViewBase
*/
public onSplitChange() {
if (this.split) {
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
/**
* 初始化分隔值
*
* @memberof IBIZSample0003F3TreeExpViewBase
*/
public initSplit() {
if (this.$store.getters.getViewSplit(this.viewUID)) {
this.split = this.$store.getters.getViewSplit(this.viewUID);
} else {
const containerWidth = (this.$el as any).offsetWidth;
this.split = 0 / containerWidth;
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './ibizsample0003-f3-tree-exp-view.less'; @import './ibizsample0003-f3-tree-exp-view.less';
</style> </style>
\ No newline at end of file
app_Web/src/pages/sample/ibizsample0003-f4-tree-exp-view/ibizsample0003-f4-tree-exp-view-base.vue
浏览文件 @ 94c1446b
<template> <template>
<div class='view-container detreeexpview ibizsample0003-f4-tree-exp-view'> <div class='view-container detreeexpview ibizsample0003-f4-tree-exp-view'>
<app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizsample0003f4treeexpview"></app-studioaction> <app-studioaction :viewTitle="$t(model.srfCaption)" viewName="ibizsample0003f4treeexpview"></app-studioaction>
<card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false"> <card class='view-card view-no-caption view-no-toolbar' :dis-hover="true" :bordered="false">
<div class='view-top-messages'> <div class='view-top-messages'>
<app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup57' viewname='ibizsample0003f4treeexpview'></app-alert-group> </div> <app-alert-group position='TOP' :context="context" :viewparam="viewparams" infoGroup='VMGroup57' viewname='ibizsample0003f4treeexpview'></app-alert-group> </div>
<div class='content-container'> <div class='content-container'>
<split v-model="split" mode="horizontal" @on-move-end="onSplitChange">
<template slot="left">
<view_treeexpbar <view_treeexpbar
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
...@@ -22,11 +23,24 @@ ...@@ -22,11 +23,24 @@
@activated="treeexpbar_activated($event)" @activated="treeexpbar_activated($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_treeexpbar> </view_treeexpbar>
</div> </template>
</card> <template slot="right">
<component
v-if="navItem && navItem.navView"
:is="navItem.navView"
:key="navItem.data && navItem.data.length ? navItem.data[0].srfkey : ''"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(navItem.srfnavdata.context)"
:viewparam="JSON.stringify(navItem.srfnavdata.viewparams)">
</component>
</template>
</split>
</div>
</card>
</div> </div>
</template> </template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch,Inject } from 'vue-property-decorator';
import { UIActionTool,Util } from '@/utils'; import { UIActionTool,Util } from '@/utils';
...@@ -221,7 +235,7 @@ export default class IBIZSample0003F4TreeExpViewBase extends Vue { ...@@ -221,7 +235,7 @@ export default class IBIZSample0003F4TreeExpViewBase extends Vue {
* @memberof IBIZSample0003F4TreeExpViewBase * @memberof IBIZSample0003F4TreeExpViewBase
*/ */
public viewState: Subject<ViewState> = new Subject(); public viewState: Subject<ViewState> = new Subject();
/** /**
* 视图引擎 * 视图引擎
...@@ -705,18 +719,60 @@ export default class IBIZSample0003F4TreeExpViewBase extends Vue { ...@@ -705,18 +719,60 @@ export default class IBIZSample0003F4TreeExpViewBase extends Vue {
} }
this.viewState.complete(); this.viewState.complete();
} }
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {string} * @type {string}
* @memberof IBIZSample0003F4TreeExpViewBase * @memberof IBIZSample0003F4TreeExpViewBase
*/ */
public viewUID: string = 'sample-ibizsample0003-f4-tree-exp-view'; public viewUID: string = 'sample-ibizsample0003-f4-tree-exp-view';
/**
* 分隔值
*
* @type {number}
* @memberof IBIZSample0003F4TreeExpViewBase
*/
public split: number = 0.5;
/**
* 导航项
*
* @type {*}
* @memberof IBIZSample0003F4TreeExpViewBase
*/
public navItem: any = {};
/**
* split值变化事件
*
* @memberof IBIZSample0003F4TreeExpViewBase
*/
public onSplitChange() {
if (this.split) {
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
/**
* 初始化分隔值
*
* @memberof IBIZSample0003F4TreeExpViewBase
*/
public initSplit() {
if (this.$store.getters.getViewSplit(this.viewUID)) {
this.split = this.$store.getters.getViewSplit(this.viewUID);
} else {
const containerWidth = (this.$el as any).offsetWidth;
this.split = 0 / containerWidth;
this.$store.commit("setViewSplit", { viewUID: this.viewUID, viewSplit: this.split });
}
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './ibizsample0003-f4-tree-exp-view.less'; @import './ibizsample0003-f4-tree-exp-view.less';
</style> </style>
\ No newline at end of file
app_Web/src/widgets/ibizbook/data-view-exp-viewdataviewexpbar-dataviewexpbar/data-view-exp-viewdataviewexpbar-dataviewexpbar-base.vue
浏览文件 @ 94c1446b
<template> <template>
<split id="dataviewexpviewdataviewexpbar" class="app-dataview-exp-bar" v-model="split" mode="horizontal" @on-move-end="onSplitChange"> <div id="dataviewexpviewdataviewexpbar" class="app-dataview-exp-bar">
<div slot='left'> <div slot='left'>
<div class='dataview-exp-bar-header'> <div class='dataview-exp-bar-header'>
<div class="dataview-exp-bar-title"> <div class="dataview-exp-bar-title">
<icon type='ios-home-outline'/>{{ $t('app.dataViewExpBar.title') }} <icon type='ios-home-outline'/>{{ $t('app.dataViewExpBar.title') }}
</div> </div>
</div> </div>
<div class="container-header"> <div class="exp-bar-action-container">
</div> </div>
<div class='dataview-exp-bar-content'> </div>
<view_dataviewexpbar_dataview <div class='dataview-exp-bar-content'>
<view_dataviewexpbar_dataview
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
:context="context" :context="context"
...@@ -28,19 +29,8 @@ ...@@ -28,19 +29,8 @@
@load="dataviewexpbar_dataview_load($event)" @load="dataviewexpbar_dataview_load($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_dataviewexpbar_dataview> </view_dataviewexpbar_dataview>
</div>
</div>
<div slot='right'>
<component
v-if="selection.view && !Object.is(this.selection.view.viewname, '')"
:is="selection.view.viewname"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(selection.context)"
:viewparam="JSON.stringify(selection.viewparam)">
</component>
</div> </div>
</split> </div>
</template> </template>
...@@ -243,31 +233,6 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co ...@@ -243,31 +233,6 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co
public isSingleSelect:boolean = true; public isSingleSelect:boolean = true;
/**
* 呈现模式，可选值：horizontal或者vertical
*
* @public
* @type {(string)}
* @memberof DataViewExpViewdataviewexpbarBase
*/
public showMode:string ="horizontal";
/**
* 控件宽度
*
* @type {number}
* @memberof DataViewExpViewdataviewexpbarBase
*/
public ctrlWidth:number = 0;
/**
* 控件高度
*
* @type {number}
* @memberof DataViewExpViewdataviewexpbarBase
*/
public ctrlHeight: number = 0;
/** /**
* 可搜索字段名称 * 可搜索字段名称
* *
...@@ -275,7 +240,7 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co ...@@ -275,7 +240,7 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co
* @type {(string)} * @type {(string)}
* @memberof DataViewExpViewdataviewexpbarBase * @memberof DataViewExpViewdataviewexpbarBase
*/ */
public placeholder="图书名称"; public placeholder = "图书名称";
/** /**
* 搜素值 * 搜素值
...@@ -284,15 +249,7 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co ...@@ -284,15 +249,7 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co
* @type {(string)} * @type {(string)}
* @memberof DataViewExpViewdataviewexpbarBase * @memberof DataViewExpViewdataviewexpbarBase
*/ */
public searchText:string = ""; public searchText: string = "";
/**
* 分割宽度
*
* @type {number}
* @memberof DataViewExpViewdataviewexpbarBase
*/
public split: number = 0.5;
/** /**
...@@ -372,32 +329,13 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co ...@@ -372,32 +329,13 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co
return null; return null;
} }
/**
* 选中数据
*
* @type {*}
* @memberof DataViewExpViewdataviewexpbarBase
*/
public selection: any = {};
/**
* split值变化事件
*
* @memberof DataViewExpViewdataviewexpbarBase
*/
public onSplitChange() {
if(this.split){
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split});
}
}
/** /**
* Vue声明周期(组件初始化完毕) * Vue声明周期(组件初始化完毕)
* *
* @memberof DataViewExpViewdataviewexpbarBase * @memberof DataViewExpViewdataviewexpbarBase
*/ */
public created() { public created() {
this.afterCreated(); this.afterCreated();
} }
/** /**
...@@ -430,24 +368,7 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co ...@@ -430,24 +368,7 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co
* *
* @memberof DataViewExpViewdataviewexpbarBase * @memberof DataViewExpViewdataviewexpbarBase
*/ */
public afterMounted(){ public afterMounted() { }
if(this.$store.getters.getViewSplit(this.viewUID)){
this.split = this.$store.getters.getViewSplit(this.viewUID);
}else{
let containerWidth:number = (document.getElementById("dataviewexpviewdataviewexpbar") as any).offsetWidth;
let containerHeight:number = (document.getElementById("dataviewexpviewdataviewexpbar") as any).offsetHeight;
if(Object.is(this.showMode,'horizontal')){
if(this.ctrlWidth && containerWidth != 0){
this.split = this.ctrlWidth/containerWidth;
}
}else{
if(this.ctrlHeight && containerHeight != 0){
this.split = this.ctrlHeight/containerHeight;
}
}
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split});
}
}
/** /**
* vue 生命周期 * vue 生命周期
...@@ -517,10 +438,16 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co ...@@ -517,10 +438,16 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co
let _params:any = this.$util.computedNavData(arg,tempContext,tempViewParam,this.navigateParams); let _params:any = this.$util.computedNavData(arg,tempContext,tempViewParam,this.navigateParams);
Object.assign(tempViewParam,_params); Object.assign(tempViewParam,_params);
} }
this.selection = {}; const navItem: any = {
Object.assign(this.selection, { view: { viewname: this.navViewName },context:tempContext,viewparam:tempViewParam}); navView: this.navViewName,
data: args,
srfnavdata: {
context: tempContext,
viewparams: tempViewParam
}
}
this.calcToolbarItemState(false); this.calcToolbarItemState(false);
this.$forceUpdate(); this.$emit('selectionchange', navItem);
} }
/** /**
......
app_Web/src/widgets/ibizbook/data-view-exp-viewdataviewexpbar-dataviewexpbar/data-view-exp-viewdataviewexpbar-dataviewexpbar.less
浏览文件 @ 94c1446b
.app-dataview-exp-bar { .app-dataview-exp-bar {
> .ivu-split-horizontal { height: 100%;
> .ivu-split-trigger-con { display: flex;
height: 100%; flex-direction: column;
width: 1px; .dataview-exp-bar-header {
} line-height: 50px;
> .ivu-split-pane { border-bottom: 1px solid #ddd;
> div { .dataview-exp-bar-title {
height: 100%; font-size: 18px;
overflow: auto; padding-left: 8px;
display: flex; i {
flex-direction: column; font-size: 20px;
.dataview-exp-bar-header { margin-top: -2px;
line-height: 50px; }
border-bottom: 1px solid #ddd; }
.dataview-exp-bar-title { }
font-size: 18px; .exp-bar-action-container {
padding-left: 8px; display: flex;
i { align-items: center;
font-size: 20px; }
margin-top: -2px; .container-header{
} display: flex;
} justify-content: flex-start;
} align-items: center;
.container-header{ flex-wrap: wrap;
display: flex; .search-container {
justify-content: flex-start; width: 30%;
align-items: center; height: 48px;
flex-wrap: wrap; padding: 10px 10px 10px 0;
.quick-group-container { min-width: 200px;
padding-top: 8px; max-width: 400px;
padding-right: 20px; }
} .toolbar-container{
.search-container { padding: 4px;
width: 30%; }
height: 48px; .quick-group-container {
padding: 10px 10px 10px 0; padding-top: 8px;
min-width: 200px; padding-right: 20px;
max-width: 400px; }
} }
.toolbar-container{ .dataview-exp-bar-content {
padding: 4px; flex-grow: 1;
display: flex; overflow: auto;
flex-wrap: wrap; }
align-items: center; }
}
}
.dataview-exp-bar-content {
height: calc(100% - 40px);
overflow: auto;
padding: 16px 0;
margin-bottom: 10px;
}
.dataview-exp-bar-content2 {
height: 100%;
overflow: auto;
flex-grow: 1;
}
}
}
> .right-pane.ivu-split-pane {
> div {
padding-left: 10px;
}
}
> .left-pane.ivu-split-pane {
padding-right: 10px;
}
}
> .ivu-split-vertical{
> .ivu-split-pane {
> div {
height: 100%;
.dataview-exp-bar-header {
line-height: 50px;
border-bottom: 1px solid #ddd;
.dataview-exp-bar-title {
font-size: 18px;
padding-left: 8px;
i {
font-size: 20px;
margin-top: -2px;
}
}
}
.container-header{
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
.search-container {
width: 30%;
height: 48px;
padding: 10px 10px 10px 0;
min-width: 200px;
max-width: 400px;
}
.toolbar-container{
padding: 4px;
}
.quick-group-container{
padding-top: 8px;
padding-right: 20px;
}
}
.dataview-exp-bar-content {
height: calc(100% - 40px);
overflow: auto;
margin-bottom: 10px;
}
.dataview-exp-bar-content2 {
height: 100%;
overflow: auto;
flex-grow: 1;
}
}
}
> .top-pane.ivu-split-pane {
> div {
padding-bottom: 10px;
}
}
> .bottom-pane.ivu-split-pane {
padding-top: 10px;
}
}
}
// this is less // this is less
app_Web/src/widgets/ibizbook/default-searchform/default-searchform-base.vue
浏览文件 @ 94c1446b
...@@ -663,7 +663,7 @@ export default class DefaultBase extends Vue implements ControlInterface { ...@@ -663,7 +663,7 @@ export default class DefaultBase extends Vue implements ControlInterface {
*/ */
public load(opt: any = {}): void { public load(opt: any = {}): void {
if(!this.loadAction){ if(!this.loadAction){
this.$Notice.error({ title: (this.$t('app.commonWords.wrong') as string), desc: 'IBIZBOOKUsr5GridView' + (this.$t('app.searchForm.notConfig.loadAction') as string) }); this.$Notice.error({ title: (this.$t('app.commonWords.wrong') as string), desc: 'IBIZBOOKUsr9GridView' + (this.$t('app.searchForm.notConfig.loadAction') as string) });
return; return;
} }
const arg: any = { ...opt }; const arg: any = { ...opt };
...@@ -699,7 +699,7 @@ export default class DefaultBase extends Vue implements ControlInterface { ...@@ -699,7 +699,7 @@ export default class DefaultBase extends Vue implements ControlInterface {
*/ */
public loadDraft(opt: any = {},mode?:string): void { public loadDraft(opt: any = {},mode?:string): void {
if(!this.loaddraftAction){ if(!this.loaddraftAction){
this.$Notice.error({ title: (this.$t('app.commonWords.wrong') as string), desc: 'IBIZBOOKUsr5GridView' + (this.$t('app.searchForm.notConfig.loaddraftAction') as string) }); this.$Notice.error({ title: (this.$t('app.commonWords.wrong') as string), desc: 'IBIZBOOKUsr9GridView' + (this.$t('app.searchForm.notConfig.loaddraftAction') as string) });
return; return;
} }
const arg: any = { ...opt } ; const arg: any = { ...opt } ;
......
app_Web/src/widgets/ibizbook/quicksearchform-searchform/quicksearchform-searchform-base.vue
浏览文件 @ 94c1446b
...@@ -621,7 +621,7 @@ export default class QUICKSEARCHFORMBase extends Vue implements ControlInterface ...@@ -621,7 +621,7 @@ export default class QUICKSEARCHFORMBase extends Vue implements ControlInterface
*/ */
public load(opt: any = {}): void { public load(opt: any = {}): void {
if(!this.loadAction){ if(!this.loadAction){
this.$Notice.error({ title: (this.$t('app.commonWords.wrong') as string), desc: 'IBIZBOOKListView' + (this.$t('app.searchForm.notConfig.loadAction') as string) }); this.$Notice.error({ title: (this.$t('app.commonWords.wrong') as string), desc: 'IBIZBOOKCalendarView' + (this.$t('app.searchForm.notConfig.loadAction') as string) });
return; return;
} }
const arg: any = { ...opt }; const arg: any = { ...opt };
...@@ -657,7 +657,7 @@ export default class QUICKSEARCHFORMBase extends Vue implements ControlInterface ...@@ -657,7 +657,7 @@ export default class QUICKSEARCHFORMBase extends Vue implements ControlInterface
*/ */
public loadDraft(opt: any = {},mode?:string): void { public loadDraft(opt: any = {},mode?:string): void {
if(!this.loaddraftAction){ if(!this.loaddraftAction){
this.$Notice.error({ title: (this.$t('app.commonWords.wrong') as string), desc: 'IBIZBOOKListView' + (this.$t('app.searchForm.notConfig.loaddraftAction') as string) }); this.$Notice.error({ title: (this.$t('app.commonWords.wrong') as string), desc: 'IBIZBOOKCalendarView' + (this.$t('app.searchForm.notConfig.loaddraftAction') as string) });
return; return;
} }
const arg: any = { ...opt } ; const arg: any = { ...opt } ;
......
app_Web/src/widgets/ibizorder/calendar-exp-viewcalendarexpbar-calendarexpbar/calendar-exp-viewcalendarexpbar-calendarexpbar-base.vue
浏览文件 @ 94c1446b
<template> <template>
<split id="calendarexpviewcalendarexpbar" class="app-calendar-exp-bar" v-model="split" mode="horizontal" @on-move-end="onSplitChange"> <div id="calendarexpviewcalendarexpbar" class="app-calendar-exp-bar">
<div slot='left'> <div class='calendar-exp-bar-header'>
<div class='calendar-exp-bar-header'> <div class="calendar-exp-bar-title">
<div class="calendar-exp-bar-title"> <icon type='ios-home-outline'/>{{ $t('app.calendarExpBar.title') }}
<icon type='ios-home-outline'/>{{ $t('app.calendarExpBar.title') }} </div>
</div> </div>
</div> <div class="exp-bar-action-container">
<div class="container-header"> <div class='search-container'>
<div class='search-container'> <i-input
<i-input :search="true" v-model="searchText"
@on-change="($event) => { this.searchText = $event.target.value; }" :search="true"
:placeholder="placeholder" :placeholder="placeholder"
@on-search="onSearch"> @on-search="onSearch">
</i-input> </i-input>
</div> </div>
<div class='toolbar-container'> <div class='toolbar-container'>
<tooltip :transfer="true" :max-width="600"> <tooltip :transfer="true" :max-width="600">
<i-button v-show="calendarexpviewcalendarexpbar_toolbarModels.deuiaction3.visabled" :disabled="calendarexpviewcalendarexpbar_toolbarModels.deuiaction3.disabled" class='' v-loading:i-button @click="calendarexpbar_toolbar_click({ tag: 'deuiaction3' }, $event)"> <i-button v-show="calendarexpviewcalendarexpbar_toolbarModels.deuiaction3.visabled" :disabled="calendarexpviewcalendarexpbar_toolbarModels.deuiaction3.disabled" class='' v-loading:i-button @click="calendarexpbar_toolbar_click({ tag: 'deuiaction3' }, $event)">
<i class='fa fa-edit'></i> <i class='fa fa-edit'></i>
...@@ -22,10 +22,10 @@ ...@@ -22,10 +22,10 @@
</i-button> </i-button>
<div slot='content'>{{$t('entities.ibizorder.calendarexpviewcalendarexpbar_toolbar_toolbar.deuiaction3.tip')}}</div> <div slot='content'>{{$t('entities.ibizorder.calendarexpviewcalendarexpbar_toolbar_toolbar.deuiaction3.tip')}}</div>
</tooltip> </tooltip>
</div> </div>
</div> </div>
<div class='calendar-exp-bar-content'> <div class='calendar-exp-bar-content'>
<view_calendarexpbar_calendar <view_calendarexpbar_calendar
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
:context="context" :context="context"
...@@ -38,23 +38,12 @@ ...@@ -38,23 +38,12 @@
@selectionchange="calendarexpbar_calendar_selectionchange($event)" @selectionchange="calendarexpbar_calendar_selectionchange($event)"
@load="calendarexpbar_calendar_load($event)" @load="calendarexpbar_calendar_load($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_calendarexpbar_calendar> </view_calendarexpbar_calendar>
</div> </div>
</div> </div>
<div slot='right'> </template>
<component
v-if="selection.view && !Object.is(this.selection.view.viewname, '')"
:is="selection.view.viewname"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(selection.context)"
:viewparam="JSON.stringify(selection.viewparam)">
</component>
</div>
</split>
</template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator';
import { CreateElement } from 'vue'; import { CreateElement } from 'vue';
...@@ -283,145 +272,112 @@ export default class CalendarExpViewcalendarexpbarBase extends Vue implements Co ...@@ -283,145 +272,112 @@ export default class CalendarExpViewcalendarexpbarBase extends Vue implements Co
} }
} }
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {boolean} * @type {boolean}
* @memberof CalendarExpViewcalendarexpbarBase * @memberof CalendarExpViewcalendarexpbarBase
*/ */
@Prop() public viewUID!:string; @Prop() public viewUID!:string;
/** /**
* 打开新建数据视图 * 打开新建数据视图
* *
* @type {any} * @type {any}
* @memberof CalendarExpViewcalendarexpbarBase * @memberof CalendarExpViewcalendarexpbarBase
*/ */
@Prop() public newdata: any; @Prop() public newdata: any;
/** /**
* 打开编辑数据视图 * 打开编辑数据视图
* *
* @type {any} * @type {any}
* @memberof CalendarExpViewcalendarexpbarBase * @memberof CalendarExpViewcalendarexpbarBase
*/ */
@Prop() public opendata: any; @Prop() public opendata: any;
/** /**
* 是否单选 * 是否单选
* *
* @public * @public
* @type {(boolean)} * @type {(boolean)}
* @memberof CalendarExpViewcalendarexpbarBase * @memberof CalendarExpViewcalendarexpbarBase
*/ */
public isSingleSelect:boolean = true; public isSingleSelect:boolean = true;
/** /**
* 呈现模式，可选值：horizontal或者vertical * 可搜索字段名称
* *
* @public *
* @type {(string)} * @type {(string)}
* @memberof CalendarExpViewcalendarexpbarBase * @memberof CalendarExpViewcalendarexpbarBase
*/ */
public showMode:string ="horizontal"; public placeholder = "订单名称";
/** /**
* 控件宽度 * 搜素值
* *
* @type {number} * @public
* @memberof CalendarExpViewcalendarexpbarBase * @type {(string)}
*/ * @memberof CalendarExpViewcalendarexpbarBase
public ctrlWidth:number = 0; */
public searchText: string = "";
/**
* 控件高度
* /**
* @type {number} * 导航视图名称
* @memberof CalendarExpViewcalendarexpbarBase *
*/ * @type {string}
public ctrlHeight: number = 0; * @memberof CalendarExpViewcalendarexpbarBase
*/
/** public navViewName: any = {
* 可搜索字段名称 item1: "ibizorder-detail-sgrid-view9"
* };
*
* @type {(string)} /**
* @memberof CalendarExpViewcalendarexpbarBase * 导航参数
*/ *
public placeholder="订单名称"; * @type {*}
* @memberof CalendarExpViewcalendarexpbarBase
/** */
* 搜素值 public navParam: any = {
* item1: {
* @public navigateContext:null,
* @type {(string)} navigateParams:null
* @memberof CalendarExpViewcalendarexpbarBase }
*/ };
public searchText:string = "";
/**
/** * 导航过滤项
* 分割宽度 *
* * @type {*}
* @type {number} * @memberof CalendarExpViewcalendarexpbarBase
* @memberof CalendarExpViewcalendarexpbarBase */
*/ public navFilter: any = {
public split: number = 0.5; item1: ""
};
/** /**
* 导航视图名称 * 导航关系
* *
* @type {string} * @type {*}
* @memberof CalendarExpViewcalendarexpbarBase * @memberof CalendarExpViewcalendarexpbarBase
*/ */
public navViewName: any = { public navPSDer: any = {
item1: "ibizorder-detail-sgrid-view9" item1: "n_ibizorderid_eq"
}; };
/** /**
* 导航参数 * 显示处理提示
* *
* @type {*} * @type {boolean}
* @memberof CalendarExpViewcalendarexpbarBase * @memberof CalendarExpViewcalendarexpbarBase
*/ */
public navParam: any = { @Prop({ default: true }) public showBusyIndicator!: boolean;
item1: {
navigateContext:null,
navigateParams:null
}
};
/**
* 导航过滤项
*
* @type {*}
* @memberof CalendarExpViewcalendarexpbarBase
*/
public navFilter: any = {
item1: ""
};
/**
* 导航关系
*
* @type {*}
* @memberof CalendarExpViewcalendarexpbarBase
*/
public navPSDer: any = {
item1: "n_ibizorderid_eq"
};
/**
* 显示处理提示
*
* @type {boolean}
* @memberof CalendarExpViewcalendarexpbarBase
*/
@Prop({ default: true }) public showBusyIndicator!: boolean;
/** /**
* 工具栏模型 * 工具栏模型
* *
...@@ -432,253 +388,214 @@ export default class CalendarExpViewcalendarexpbarBase extends Vue implements Co ...@@ -432,253 +388,214 @@ export default class CalendarExpViewcalendarexpbarBase extends Vue implements Co
deuiaction3: { name: 'deuiaction3', actiontarget: 'NONE', caption: '编辑', disabled: false, type: 'DEUIACTION', visabled: true,noprivdisplaymode:2,dataaccaction: '', uiaction: { tag: 'Edit', target: 'SINGLEKEY' } }, deuiaction3: { name: 'deuiaction3', actiontarget: 'NONE', caption: '编辑', disabled: false, type: 'DEUIACTION', visabled: true,noprivdisplaymode:2,dataaccaction: '', uiaction: { tag: 'Edit', target: 'SINGLEKEY' } },
}; };
/** /**
* 获取多项数据 * 获取多项数据
* *
* @returns {any[]} * @returns {any[]}
* @memberof CalendarExpViewcalendarexpbarBase * @memberof CalendarExpViewcalendarexpbarBase
*/ */
public getDatas(): any[] { public getDatas(): any[] {
return []; return [];
} }
/** /**
* 获取单项树 * 获取单项树
* *
* @returns {*} * @returns {*}
* @memberof CalendarExpViewcalendarexpbarBase * @memberof CalendarExpViewcalendarexpbarBase
*/ */
public getData(): any { public getData(): any {
return null; return null;
} }
/** /**
* 选中数据 * Vue声明周期(组件初始化完毕)
* *
* @type {*} * @memberof CalendarExpViewcalendarexpbarBase
* @memberof CalendarExpViewcalendarexpbarBase */
*/ public created() {
public selection: any = {}; this.afterCreated();
}
/**
* split值变化事件 /**
* * 执行created后的逻辑
* @memberof CalendarExpViewcalendarexpbarBase *
*/ * @memberof CalendarExpViewcalendarexpbarBase
public onSplitChange() { */
if(this.$refs.calendarexpbar_calendar){ public afterCreated(){
const calendarContainer:any = this.$refs.calendarexpbar_calendar; if (this.viewState) {
if(calendarContainer.$refs.calendar){ this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => {
const appCalendar: any = calendarContainer.$refs.calendar; if (!Object.is(tag, this.name)) {
const api = appCalendar.getApi(); return;
api.updateSize(); }
} this.viewState.next({ tag: 'calendarexpbar_calendar', action: action, data: data });
} });
if(this.split){ }
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); }
}
} /**
* Vue声明周期(组件渲染完毕)
/** *
* Vue声明周期(组件初始化完毕) * @memberof CalendarExpViewcalendarexpbarBase
* */
* @memberof CalendarExpViewcalendarexpbarBase public mounted() {
*/ this.afterMounted();
public created() { }
this.afterCreated();
} /**
* 执行mounted后的逻辑
/** *
* 执行created后的逻辑 * @memberof CalendarExpViewcalendarexpbarBase
* */
* @memberof CalendarExpViewcalendarexpbarBase public afterMounted() { }
*/
public afterCreated(){ /**
if (this.viewState) { * vue 生命周期
this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => { *
if (!Object.is(tag, this.name)) { * @memberof CalendarExpViewcalendarexpbarBase
return; */
} public destroyed() {
this.viewState.next({ tag: 'calendarexpbar_calendar', action: action, data: data }); this.afterDestroy();
}); }
}
} /**
* 执行destroyed后的逻辑
/** *
* Vue声明周期(组件渲染完毕) * @memberof CalendarExpViewcalendarexpbarBase
* */
* @memberof CalendarExpViewcalendarexpbarBase public afterDestroy() {
*/ if (this.viewStateEvent) {
public mounted() { this.viewStateEvent.unsubscribe();
this.afterMounted(); }
} }
/** /**
* 执行mounted后的逻辑 * 刷新
* *
* @memberof CalendarExpViewcalendarexpbarBase * @memberof CalendarExpViewcalendarexpbarBase
*/ */
public afterMounted(){ public refresh(args?: any): void {
if(this.$store.getters.getViewSplit(this.viewUID)){ const refs: any = this.$refs;
this.split = this.$store.getters.getViewSplit(this.viewUID); if (refs && refs.calendarexpbar_calendar) {
}else{ refs.calendarexpbar_calendar.refresh();
let containerWidth:number = (document.getElementById("calendarexpviewcalendarexpbar") as any).offsetWidth; }
let containerHeight:number = (document.getElementById("calendarexpviewcalendarexpbar") as any).offsetHeight; }
if(Object.is(this.showMode,'horizontal')){
if(this.ctrlWidth && containerWidth != 0){ /**
this.split = this.ctrlWidth/containerWidth; * calendarexpbar的选中数据事件
} *
}else{ * @memberof CalendarExpViewcalendarexpbarBase
if(this.ctrlHeight && containerHeight != 0){ */
this.split = this.ctrlHeight/containerHeight; public calendarexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void {
} let tempContext:any = {};
} let tempViewParam:any = {};
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); if (args.length === 0) {
} this.calcToolbarItemState(true);
} return ;
}
/** const arg:any = args[0];
* vue 生命周期 if(this.context){
* Object.assign(tempContext,JSON.parse(JSON.stringify(this.context)));
* @memberof CalendarExpViewcalendarexpbarBase }
*/ switch(arg.itemType) {
public destroyed() { case "item1":
this.afterDestroy(); Object.assign(tempContext,{ ibizorder : arg.ibizorder});
} Object.assign(tempContext,{srfparentdename:'IBIZOrder',srfparentkey:arg['ibizorder']});
if(this.navFilter && this.navFilter['item1'] && !Object.is(this.navFilter['item1'],"")){
/** Object.assign(tempViewParam,{[this.navFilter['item1']]:arg['ibizorder']});
* 执行destroyed后的逻辑 }
* if(this.navPSDer && this.navFilter['item1'] && !Object.is(this.navPSDer['item1'],"")){
* @memberof CalendarExpViewcalendarexpbarBase Object.assign(tempViewParam,{[this.navPSDer['item1']]:arg['ibizorder']});
*/ }
public afterDestroy() { if(this.navParam && this.navParam['item1'] && this.navParam['item1'].navigateContext && Object.keys(this.navParam['item1'].navigateContext).length >0){
if (this.viewStateEvent) { let _context:any = this.$util.computedNavData(arg,tempContext,tempViewParam,this.navParam['item1'].navigateContext);
this.viewStateEvent.unsubscribe(); Object.assign(tempContext,_context);
} }
} if(this.navParam && this.navParam['item1'] && this.navParam['item1'].navigateParams && Object.keys(this.navParam['item1'].navigateParams).length >0){
let _params:any = this.$util.computedNavData(arg,tempContext,tempViewParam,this.navParam['item1'].navigateParams);
/** Object.assign(tempViewParam,_params);
* 刷新 }
* break;
* @memberof CalendarExpViewcalendarexpbarBase }
*/ const navItem: any = {
public refresh(args?: any): void { navView: this.navViewName,
const refs: any = this.$refs; data: args,
if (refs && refs.calendarexpbar_calendar) { srfnavdata: {
refs.calendarexpbar_calendar.refresh(); context: tempContext,
} viewparams: tempViewParam
} }
}
/** this.calcToolbarItemState(false);
* calendarexpbar的选中数据事件 this.$emit('selectionchange', navItem);
* }
* @memberof CalendarExpViewcalendarexpbarBase
*/ /**
public calendarexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void { * calendarexpbar的load完成事件
let tempContext:any = {}; *
let tempViewParam:any = {}; * @memberof CalendarExpViewcalendarexpbarBase
if (args.length === 0) { */
this.calcToolbarItemState(true); public calendarexpbar_load(args:any, tag?: string, $event2?: any){
return ; this.calcToolbarItemState(true);
} this.$emit('load',args);
const arg:any = args[0]; }
if(this.context){
Object.assign(tempContext,JSON.parse(JSON.stringify(this.context))); /**
} * 设置导航区工具栏禁用状态
switch(arg.itemType) { *
case "item1": * @param {boolean} state
Object.assign(tempContext,{ ibizorder : arg.ibizorder}); * @return {*}
Object.assign(tempContext,{srfparentdename:'IBIZOrder',srfparentkey:arg['ibizorder']}); * @memberof CalendarExpViewcalendarexpbarBase
if(this.navFilter && this.navFilter['item1'] && !Object.is(this.navFilter['item1'],"")){ */
Object.assign(tempViewParam,{[this.navFilter['item1']]:arg['ibizorder']}); public calcToolbarItemState(state: boolean) {
} let _this: any = this;
if(this.navPSDer && this.navFilter['item1'] && !Object.is(this.navPSDer['item1'],"")){ const models:any = _this.calendarexpviewcalendarexpbar_toolbarModels;
Object.assign(tempViewParam,{[this.navPSDer['item1']]:arg['ibizorder']}); if (models) {
} for (const key in models) {
if(this.navParam && this.navParam['item1'] && this.navParam['item1'].navigateContext && Object.keys(this.navParam['item1'].navigateContext).length >0){ if (!models.hasOwnProperty(key)) {
let _context:any = this.$util.computedNavData(arg,tempContext,tempViewParam,this.navParam['item1'].navigateContext); return;
Object.assign(tempContext,_context); }
} const _item = models[key];
if(this.navParam && this.navParam['item1'] && this.navParam['item1'].navigateParams && Object.keys(this.navParam['item1'].navigateParams).length >0){ if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
let _params:any = this.$util.computedNavData(arg,tempContext,tempViewParam,this.navParam['item1'].navigateParams); _item.disabled = state;
Object.assign(tempViewParam,_params); }
} _item.visabled = true;
break; if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
} _item.visabled = false;
this.selection = {}; }
Object.assign(this.selection, { view: { viewname: this.navViewName[arg.itemType] }, context:tempContext,viewparam:tempViewParam }); }
this.calcToolbarItemState(false); this.calcNavigationToolbarState();
this.$emit('selectionchange',args); }
this.$forceUpdate(); }
}
/**
/** * 计算导航工具栏权限状态
* calendarexpbar的load完成事件 *
* * @memberof CalendarExpViewcalendarexpbarBase
* @memberof CalendarExpViewcalendarexpbarBase */
*/ public calcNavigationToolbarState(){
public calendarexpbar_load(args:any, tag?: string, $event2?: any){ let _this: any = this;
this.calcToolbarItemState(true); // 界面行为
this.$emit('load',args); if(_this.calendarexpviewcalendarexpbar_toolbarModels){
} const curUIService:IBIZOrderUIService = new IBIZOrderUIService();
ViewTool.calcActionItemAuthState({},_this.calendarexpviewcalendarexpbar_toolbarModels,curUIService);
/** }
* 设置导航区工具栏禁用状态 }
*
* @param {boolean} state /**
* @return {*} * 执行搜索
* @memberof CalendarExpViewcalendarexpbarBase *
*/ * @memberof CalendarExpViewcalendarexpbarBase
public calcToolbarItemState(state: boolean) { */
let _this: any = this; public onSearch($event:any) {
const models:any = _this.calendarexpviewcalendarexpbar_toolbarModels; let calendar:any = this.$refs.calendarexpbar_calendar;
if (models) { calendar.searchEvents({ query: this.searchText });
for (const key in models) { }
if (!models.hasOwnProperty(key)) {
return;
}
const _item = models[key];
if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
_item.disabled = state;
}
_item.visabled = true;
if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
_item.visabled = false;
}
}
this.calcNavigationToolbarState();
}
}
/**
* 计算导航工具栏权限状态
*
* @memberof CalendarExpViewcalendarexpbarBase
*/
public calcNavigationToolbarState(){
let _this: any = this;
// 界面行为
if(_this.calendarexpviewcalendarexpbar_toolbarModels){
const curUIService:IBIZOrderUIService = new IBIZOrderUIService();
ViewTool.calcActionItemAuthState({},_this.calendarexpviewcalendarexpbar_toolbarModels,curUIService);
}
}
/**
* 执行搜索
*
* @memberof CalendarExpViewcalendarexpbarBase
*/
public onSearch($event:any) {
let calendar:any = this.$refs.calendarexpbar_calendar;
calendar.searchEvents({ query: this.searchText });
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './calendar-exp-viewcalendarexpbar-calendarexpbar.less'; @import './calendar-exp-viewcalendarexpbar-calendarexpbar.less';
</style> </style>
\ No newline at end of file
app_Web/src/widgets/ibizorder/calendar-exp-viewcalendarexpbar-calendarexpbar/calendar-exp-viewcalendarexpbar-calendarexpbar.less
浏览文件 @ 94c1446b
.app-calendar-exp-bar { .app-calendar-exp-bar {
> .ivu-split-horizontal { height: 100%;
> .ivu-split-trigger-con { display: flex;
height: 100%; flex-direction: column;
width: 1px; .calendar-exp-bar-header {
} line-height: 50px;
> .ivu-split-pane { border-bottom: 1px solid #ddd;
> div { .calendar-exp-bar-title {
height: 100%; font-size: 18px;
overflow: auto; padding-left: 8px;
display: flex; i {
flex-direction: column; font-size: 20px;
.calendar-exp-bar-header { margin-top: -2px;
line-height: 50px; }
border-bottom: 1px solid #ddd; }
.calendar-exp-bar-title { }
font-size: 18px; .exp-bar-action-container {
padding-left: 8px; display: flex;
i { align-items: center;
font-size: 20px; }
margin-top: -2px; .container-header{
} display: flex;
} justify-content: flex-start;
} align-items: center;
.container-header{ flex-wrap: wrap;
display: flex; .search-container {
justify-content: flex-start; width: 30%;
align-items: center; height: 48px;
flex-wrap: wrap; padding: 10px 10px 10px 0;
.quick-group-container { min-width: 200px;
padding-top: 8px; max-width: 400px;
padding-right: 20px; }
} .toolbar-container{
.search-container { padding: 4px;
width: 30%; }
height: 48px; .quick-group-container {
padding: 10px; padding-top: 8px;
min-width: 200px; padding-right: 20px;
max-width: 400px; }
} }
.toolbar-container{ .calendar-exp-bar-content {
padding: 4px; flex-grow: 1;
display: flex; overflow: auto;
flex-wrap: wrap; }
align-items: center; }
}
}
.calendar-exp-bar-content {
height: calc(100% - 88px);
overflow: auto;
padding: 16px 0;
margin-bottom: 10px;
}
.calendar-exp-bar-content2 {
height: 100%;
overflow: auto;
flex-grow: 1;
}
}
}
> .right-pane.ivu-split-pane {
> div {
padding-left: 10px;
}
}
> .left-pane.ivu-split-pane {
padding-right: 10px;
}
}
> .ivu-split-vertical{
> .ivu-split-pane {
> div {
height: 100%;
overflow: auto;
display: flex;
flex-direction: column;
.calendar-exp-bar-header {
line-height: 50px;
border-bottom: 1px solid #ddd;
.calendar-exp-bar-title {
font-size: 18px;
padding-left: 8px;
i {
font-size: 20px;
margin-top: -2px;
}
}
}
.container-header{
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
.quick-group-container {
padding-top: 8px;
padding-right: 20px;
}
.search-container {
width: 30%;
height: 48px;
padding: 10px 10px 10px 0;
min-width: 200px;
max-width: 400px;
}
.toolbar-container{
padding: 4px;
}
}
.calendar-exp-bar-content {
height: calc(100% - 88px);
overflow: auto;
margin-bottom: 10px;
}
.calendar-exp-bar-content2 {
height: 100%;
overflow: auto;
flex-grow: 1;
}
}
}
> .top-pane.ivu-split-pane {
> div {
padding-bottom: 10px;
}
}
> .bottom-pane.ivu-split-pane {
padding-top: 10px;
}
}
}
// this is less // this is less
app_Web/src/widgets/ibizorder/data-view-exp-viewdataviewexpbar-dataviewexpbar/data-view-exp-viewdataviewexpbar-dataviewexpbar-base.vue
浏览文件 @ 94c1446b
<template> <template>
<split id="dataviewexpviewdataviewexpbar" class="app-dataview-exp-bar" v-model="split" mode="horizontal" @on-move-end="onSplitChange"> <div id="dataviewexpviewdataviewexpbar" class="app-dataview-exp-bar">
<div slot='left'> <div slot='left'>
<div class='dataview-exp-bar-header'> <div class='dataview-exp-bar-header'>
<div class="dataview-exp-bar-title"> <div class="dataview-exp-bar-title">
<icon type='ios-home-outline'/>{{ $t('app.dataViewExpBar.title') }} <icon type='ios-home-outline'/>{{ $t('app.dataViewExpBar.title') }}
</div> </div>
</div> </div>
<div class="container-header"> <div class="exp-bar-action-container">
<div class='search-container'> <div class='search-container'>
<i-input :search="true" <i-input
@on-change="($event) => { this.searchText = $event.target.value; }" v-model="searchText"
:placeholder="placeholder" :search="true"
@on-search="onSearch"> :placeholder="placeholder"
</i-input> @on-search="onSearch">
</div> </i-input>
</div>
<div class='toolbar-container'> <div class='toolbar-container'>
<tooltip :transfer="true" :max-width="600"> <tooltip :transfer="true" :max-width="600">
<i-button v-show="dataviewexpviewdataviewexpbar_toolbarModels.deuiaction3.visabled" :disabled="dataviewexpviewdataviewexpbar_toolbarModels.deuiaction3.disabled" class='' v-loading:i-button @click="dataviewexpbar_toolbar_click({ tag: 'deuiaction3' }, $event)"> <i-button v-show="dataviewexpviewdataviewexpbar_toolbarModels.deuiaction3.visabled" :disabled="dataviewexpviewdataviewexpbar_toolbarModels.deuiaction3.disabled" class='' v-loading:i-button @click="dataviewexpbar_toolbar_click({ tag: 'deuiaction3' }, $event)">
...@@ -24,8 +25,9 @@ ...@@ -24,8 +25,9 @@
</tooltip> </tooltip>
</div> </div>
</div> </div>
<div class='dataview-exp-bar-content'> </div>
<view_dataviewexpbar_dataview <div class='dataview-exp-bar-content'>
<view_dataviewexpbar_dataview
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
:context="context" :context="context"
...@@ -44,19 +46,8 @@ ...@@ -44,19 +46,8 @@
@load="dataviewexpbar_dataview_load($event)" @load="dataviewexpbar_dataview_load($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_dataviewexpbar_dataview> </view_dataviewexpbar_dataview>
</div>
</div>
<div slot='right'>
<component
v-if="selection.view && !Object.is(this.selection.view.viewname, '')"
:is="selection.view.viewname"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(selection.context)"
:viewparam="JSON.stringify(selection.viewparam)">
</component>
</div> </div>
</split> </div>
</template> </template>
...@@ -326,31 +317,6 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co ...@@ -326,31 +317,6 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co
public isSingleSelect:boolean = true; public isSingleSelect:boolean = true;
/**
* 呈现模式，可选值：horizontal或者vertical
*
* @public
* @type {(string)}
* @memberof DataViewExpViewdataviewexpbarBase
*/
public showMode:string ="horizontal";
/**
* 控件宽度
*
* @type {number}
* @memberof DataViewExpViewdataviewexpbarBase
*/
public ctrlWidth:number = 0;
/**
* 控件高度
*
* @type {number}
* @memberof DataViewExpViewdataviewexpbarBase
*/
public ctrlHeight: number = 0;
/** /**
* 可搜索字段名称 * 可搜索字段名称
* *
...@@ -358,7 +324,7 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co ...@@ -358,7 +324,7 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co
* @type {(string)} * @type {(string)}
* @memberof DataViewExpViewdataviewexpbarBase * @memberof DataViewExpViewdataviewexpbarBase
*/ */
public placeholder="订单名称"; public placeholder = "订单名称";
/** /**
* 搜素值 * 搜素值
...@@ -367,15 +333,7 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co ...@@ -367,15 +333,7 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co
* @type {(string)} * @type {(string)}
* @memberof DataViewExpViewdataviewexpbarBase * @memberof DataViewExpViewdataviewexpbarBase
*/ */
public searchText:string = ""; public searchText: string = "";
/**
* 分割宽度
*
* @type {number}
* @memberof DataViewExpViewdataviewexpbarBase
*/
public split: number = 0.5;
/** /**
...@@ -467,32 +425,13 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co ...@@ -467,32 +425,13 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co
return null; return null;
} }
/**
* 选中数据
*
* @type {*}
* @memberof DataViewExpViewdataviewexpbarBase
*/
public selection: any = {};
/**
* split值变化事件
*
* @memberof DataViewExpViewdataviewexpbarBase
*/
public onSplitChange() {
if(this.split){
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split});
}
}
/** /**
* Vue声明周期(组件初始化完毕) * Vue声明周期(组件初始化完毕)
* *
* @memberof DataViewExpViewdataviewexpbarBase * @memberof DataViewExpViewdataviewexpbarBase
*/ */
public created() { public created() {
this.afterCreated(); this.afterCreated();
} }
/** /**
...@@ -525,24 +464,7 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co ...@@ -525,24 +464,7 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co
* *
* @memberof DataViewExpViewdataviewexpbarBase * @memberof DataViewExpViewdataviewexpbarBase
*/ */
public afterMounted(){ public afterMounted() { }
if(this.$store.getters.getViewSplit(this.viewUID)){
this.split = this.$store.getters.getViewSplit(this.viewUID);
}else{
let containerWidth:number = (document.getElementById("dataviewexpviewdataviewexpbar") as any).offsetWidth;
let containerHeight:number = (document.getElementById("dataviewexpviewdataviewexpbar") as any).offsetHeight;
if(Object.is(this.showMode,'horizontal')){
if(this.ctrlWidth && containerWidth != 0){
this.split = this.ctrlWidth/containerWidth;
}
}else{
if(this.ctrlHeight && containerHeight != 0){
this.split = this.ctrlHeight/containerHeight;
}
}
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split});
}
}
/** /**
* vue 生命周期 * vue 生命周期
...@@ -612,10 +534,16 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co ...@@ -612,10 +534,16 @@ export default class DataViewExpViewdataviewexpbarBase extends Vue implements Co
let _params:any = this.$util.computedNavData(arg,tempContext,tempViewParam,this.navigateParams); let _params:any = this.$util.computedNavData(arg,tempContext,tempViewParam,this.navigateParams);
Object.assign(tempViewParam,_params); Object.assign(tempViewParam,_params);
} }
this.selection = {}; const navItem: any = {
Object.assign(this.selection, { view: { viewname: this.navViewName },context:tempContext,viewparam:tempViewParam}); navView: this.navViewName,
data: args,
srfnavdata: {
context: tempContext,
viewparams: tempViewParam
}
}
this.calcToolbarItemState(false); this.calcToolbarItemState(false);
this.$forceUpdate(); this.$emit('selectionchange', navItem);
} }
/** /**
......
app_Web/src/widgets/ibizorder/data-view-exp-viewdataviewexpbar-dataviewexpbar/data-view-exp-viewdataviewexpbar-dataviewexpbar.less
浏览文件 @ 94c1446b
.app-dataview-exp-bar { .app-dataview-exp-bar {
> .ivu-split-horizontal { height: 100%;
> .ivu-split-trigger-con { display: flex;
height: 100%; flex-direction: column;
width: 1px; .dataview-exp-bar-header {
} line-height: 50px;
> .ivu-split-pane { border-bottom: 1px solid #ddd;
> div { .dataview-exp-bar-title {
height: 100%; font-size: 18px;
overflow: auto; padding-left: 8px;
display: flex; i {
flex-direction: column; font-size: 20px;
.dataview-exp-bar-header { margin-top: -2px;
line-height: 50px; }
border-bottom: 1px solid #ddd; }
.dataview-exp-bar-title { }
font-size: 18px; .exp-bar-action-container {
padding-left: 8px; display: flex;
i { align-items: center;
font-size: 20px; }
margin-top: -2px; .container-header{
} display: flex;
} justify-content: flex-start;
} align-items: center;
.container-header{ flex-wrap: wrap;
display: flex; .search-container {
justify-content: flex-start; width: 30%;
align-items: center; height: 48px;
flex-wrap: wrap; padding: 10px 10px 10px 0;
.quick-group-container { min-width: 200px;
padding-top: 8px; max-width: 400px;
padding-right: 20px; }
} .toolbar-container{
.search-container { padding: 4px;
width: 30%; }
height: 48px; .quick-group-container {
padding: 10px 10px 10px 0; padding-top: 8px;
min-width: 200px; padding-right: 20px;
max-width: 400px; }
} }
.toolbar-container{ .dataview-exp-bar-content {
padding: 4px; flex-grow: 1;
display: flex; overflow: auto;
flex-wrap: wrap; }
align-items: center; }
}
}
.dataview-exp-bar-content {
height: calc(100% - 88px);
overflow: auto;
padding: 16px 0;
margin-bottom: 10px;
}
.dataview-exp-bar-content2 {
height: 100%;
overflow: auto;
flex-grow: 1;
}
}
}
> .right-pane.ivu-split-pane {
> div {
padding-left: 10px;
}
}
> .left-pane.ivu-split-pane {
padding-right: 10px;
}
}
> .ivu-split-vertical{
> .ivu-split-pane {
> div {
height: 100%;
.dataview-exp-bar-header {
line-height: 50px;
border-bottom: 1px solid #ddd;
.dataview-exp-bar-title {
font-size: 18px;
padding-left: 8px;
i {
font-size: 20px;
margin-top: -2px;
}
}
}
.container-header{
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
.search-container {
width: 30%;
height: 48px;
padding: 10px 10px 10px 0;
min-width: 200px;
max-width: 400px;
}
.toolbar-container{
padding: 4px;
}
.quick-group-container{
padding-top: 8px;
padding-right: 20px;
}
}
.dataview-exp-bar-content {
height: calc(100% - 88px);
overflow: auto;
margin-bottom: 10px;
}
.dataview-exp-bar-content2 {
height: 100%;
overflow: auto;
flex-grow: 1;
}
}
}
> .top-pane.ivu-split-pane {
> div {
padding-bottom: 10px;
}
}
> .bottom-pane.ivu-split-pane {
padding-top: 10px;
}
}
}
// this is less // this is less
app_Web/src/widgets/ibizorder/list-exp-viewlistexpbar-listexpbar/list-exp-viewlistexpbar-listexpbar-base.vue
浏览文件 @ 94c1446b
...@@ -7,8 +7,9 @@ ...@@ -7,8 +7,9 @@
</div> </div>
<div class="exp-bar-action-container"> <div class="exp-bar-action-container">
<div class='search-container'> <div class='search-container'>
<i-input :search="true" <i-input
@on-change="($event) => { this.searchText = $event.target.value; }" v-model="searchText"
:search="true"
:placeholder="placeholder" :placeholder="placeholder"
@on-search="onSearch"> @on-search="onSearch">
</i-input> </i-input>
...@@ -529,7 +530,7 @@ export default class ListExpViewlistexpbarBase extends Vue implements ControlInt ...@@ -529,7 +530,7 @@ export default class ListExpViewlistexpbarBase extends Vue implements ControlInt
} }
if (this.navigateContext && Object.keys(this.navigateContext).length > 0) { if (this.navigateContext && Object.keys(this.navigateContext).length > 0) {
let _context:any = this.$util.computedNavData(arg, tempContext, tempViewParam, this.navigateContext); let _context:any = this.$util.computedNavData(arg, tempContext, tempViewParam, this.navigateContext);
Object.assign(tempContext, _context); Object.assign(tempContext,_context);
} }
if (this.navigateParams && Object.keys(this.navigateParams).length > 0) { if (this.navigateParams && Object.keys(this.navigateParams).length > 0) {
let _params:any = this.$util.computedNavData(arg, tempContext, tempViewParam, this.navigateParams); let _params:any = this.$util.computedNavData(arg, tempContext, tempViewParam, this.navigateParams);
......
app_Web/src/widgets/ibizorder/tree-exp-viewtreeexpbar-treeexpbar/tree-exp-viewtreeexpbar-treeexpbar-base.vue
浏览文件 @ 94c1446b
<template> <template>
<split id="treeexpviewtreeexpbar" class='app-tree-exp-bar' v-model="split" mode="horizontal" @on-move-end="onSplitChange"> <div id="treeexpviewtreeexpbar" class='app-tree-exp-bar'>
<div slot='left'> <div class='tree-exp-bar-header'>
<div class='tree-exp-bar-header'> <div class="tree-exp-bar-title">
<div class="tree-exp-bar-title"> <icon type='ios-home-outline'/>{{ $t('app.treeExpBar.title') }}
<icon type='ios-home-outline'/>{{ $t('app.treeExpBar.title') }} </div>
</div>
<div class='toolbar-container'> <div class='toolbar-container'>
<tooltip :transfer="true" :max-width="600"> <tooltip :transfer="true" :max-width="600">
<i-button v-show="treeexpviewtreeexpbar_toolbarModels.deuiaction3.visabled" :disabled="treeexpviewtreeexpbar_toolbarModels.deuiaction3.disabled" class='' v-loading:i-button @click="treeexpbar_toolbar_click({ tag: 'deuiaction3' }, $event)"> <i-button v-show="treeexpviewtreeexpbar_toolbarModels.deuiaction3.visabled" :disabled="treeexpviewtreeexpbar_toolbarModels.deuiaction3.disabled" class='' v-loading:i-button @click="treeexpbar_toolbar_click({ tag: 'deuiaction3' }, $event)">
...@@ -13,16 +12,17 @@ ...@@ -13,16 +12,17 @@
</i-button> </i-button>
<div slot='content'>{{$t('entities.ibizorder.treeexpviewtreeexpbar_toolbar_toolbar.deuiaction3.tip')}}</div> <div slot='content'>{{$t('entities.ibizorder.treeexpviewtreeexpbar_toolbar_toolbar.deuiaction3.tip')}}</div>
</tooltip> </tooltip>
</div> </div>
</div> </div>
<div class='search-content'> <div class='search-content'>
<i-input :search="true" <i-input
@on-change="($event) => { this.srfnodefilter = $event.target.value; }" v-model="srfnodefilter"
:placeholder="placeholder" :search="true"
@on-search="onSearch"> :placeholder="placeholder"
</i-input> @on-search="onSearch">
</div> </i-input>
<div class='tree-exp-content'> </div>
<div class='tree-exp-content'>
<view_treeexpbar_tree <view_treeexpbar_tree
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
...@@ -40,25 +40,9 @@ ...@@ -40,25 +40,9 @@
@load="treeexpbar_tree_load($event)" @load="treeexpbar_tree_load($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_treeexpbar_tree> </view_treeexpbar_tree>
</div> </div>
</div> </div>
<div slot='right'> </template>
<component
v-if="selection.view && !Object.is(this.selection.view.viewname, '')"
:is="selection.view.viewname"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(selection.context)"
:viewparam="JSON.stringify(selection.viewparam)"
@viewdataschange="onViewDatasChange"
@drdatasaved="onDrViewDatasChange"
@drdatasremove="onDrViewDatasChange"
@viewdatasactivated="viewDatasActivated"
@viewload="onViewLoad">
</component>
</div>
</split>
</template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator';
import { CreateElement } from 'vue'; import { CreateElement } from 'vue';
...@@ -287,411 +271,371 @@ export default class TreeExpViewtreeexpbarBase extends Vue implements ControlInt ...@@ -287,411 +271,371 @@ export default class TreeExpViewtreeexpbarBase extends Vue implements ControlInt
} }
} }
/** /**
* 打开新建数据视图 * 打开新建数据视图
* *
* @type {any} * @type {any}
* @memberof TreeExpViewtreeexpbarBase * @memberof TreeExpViewtreeexpbarBase
*/ */
@Prop() public newdata: any; @Prop() public newdata: any;
/** /**
* 打开编辑数据视图 * 打开编辑数据视图
* *
* @type {any} * @type {any}
* @memberof TreeExpViewtreeexpbarBase * @memberof TreeExpViewtreeexpbarBase
*/ */
@Prop() public opendata: any; @Prop() public opendata: any;
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {boolean} * @type {boolean}
* @memberof TreeExpViewtreeexpbarBase * @memberof TreeExpViewtreeexpbarBase
*/ */
@Prop() public viewUID!:string; @Prop() public viewUID!:string;
/** /**
* 获取多项数据 * 获取多项数据
* *
* @returns {any[]} * @returns {any[]}
* @memberof TreeExpViewtreeexpbarBase * @memberof TreeExpViewtreeexpbarBase
*/ */
public getDatas(): any[] { public getDatas(): any[] {
return []; return [];
} }
/** /**
* 获取单项树 * 获取单项树
* *
* @returns {*} * @returns {*}
* @memberof TreeExpViewtreeexpbarBase * @memberof TreeExpViewtreeexpbarBase
*/ */
public getData(): any { public getData(): any {
return {}; return {};
} }
/** /**
* 选中数据 * 可搜索字段名称
* *
* @type {*} *
* @memberof TreeExpViewtreeexpbarBase * @type {(string)}
*/ * @memberof TreeExpViewtreeexpbarBase
public selection: any = {}; */
public placeholder = "订单名称";
/**
* 控件宽度 /**
* * 过滤值
* @type {number} *
* @memberof TreeExpViewtreeexpbarBase * @type {string}
*/ * @memberof TreeExpViewtreeexpbarBase
public ctrlWidth:number = 500; */
public srfnodefilter: string = '';
/**
* 可搜索字段名称 /**
* * 刷新标识
* *
* @type {(string)} * @public
* @memberof TreeExpViewtreeexpbarBase * @type {number}
*/ * @memberof TreeExpViewtreeexpbarBase
public placeholder="订单名称"; */
public counter:number = 0;
/**
* 过滤值 /**
* * 是否加载默认关联视图
* @type {string} *
* @memberof TreeExpViewtreeexpbarBase * @public
*/ * @type {boolean}
public srfnodefilter: string = ''; * @memberof TreeExpViewtreeexpbarBase
*/
/** public istLoadDefaultRefView: boolean = false;
* 刷新标识
* /**
* @public * 获取关系项视图
* @type {number} *
* @memberof TreeExpViewtreeexpbarBase * @param {*} [arg={}]
*/ * @returns {*}
public counter:number = 0; * @memberof TreeExpViewtreeexpbarBase
*/
/** public getExpItemView(arg: any = {}): any {
* 是否加载默认关联视图 let expmode = arg.nodetype.toUpperCase();
* if (!expmode) {
* @public expmode = '';
* @type {boolean} }
* @memberof TreeExpViewtreeexpbarBase if (Object.is(expmode, 'ORDERDATADYC')) {
*/ return {
public istLoadDefaultRefView: boolean = false; viewname: 'ibizorder-detail-grid-view9',
parentdata: {"srfparentdefname":"IBIZORDERID","srfparentdename":"IBIZORDER","srfparentmode":"DER1N_IBIZORDERDETAIL_IBIZORDER_IBIZORDERID"},
/** deKeyField:'ibizorderdetail'
* 分割宽度 };
* }
* @type {number} if (Object.is(expmode, 'ORDERSTATUSDATA')) {
* @memberof TreeExpViewtreeexpbarBase return {
*/ viewname: 'ibizorder-grid-view9',
public split: number = 0.2; parentdata: {},
deKeyField:'ibizorder'
/** };
* split值变化事件 }
* if (Object.is(expmode, 'ORDERTYPEDATA')) {
* @memberof TreeExpViewtreeexpbarBase return {
*/ viewname: 'ibizorder-grid-view9',
public onSplitChange() { parentdata: {},
if(this.split){ deKeyField:'ibizorder'
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); };
} }
} return null;
}
/**
* 获取关系项视图 /**
* * 树导航选中
* @param {*} [arg={}] *
* @returns {*} * @param {any []} args
* @memberof TreeExpViewtreeexpbarBase * @param {string} [tag]
*/ * @param {*} [$event2]
public getExpItemView(arg: any = {}): any { * @returns {void}
let expmode = arg.nodetype.toUpperCase(); * @memberof TreeExpViewtreeexpbarBase
if (!expmode) { */
expmode = ''; public treeexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void {
} if (args.length === 0) {
if (Object.is(expmode, 'ORDERDATADYC')) { this.calcToolbarItemState(true);
return { return ;
viewname: 'ibizorder-detail-grid-view9', }
parentdata: {"srfparentdefname":"IBIZORDERID","srfparentdename":"IBIZORDER","srfparentmode":"DER1N_IBIZORDERDETAIL_IBIZORDER_IBIZORDERID"}, const arg:any = args[0];
deKeyField:'ibizorderdetail' if (!arg.id) {
}; this.calcToolbarItemState(true);
} return;
if (Object.is(expmode, 'ORDERSTATUSDATA')) { }
return { const nodetype = arg.id.split(';')[0];
viewname: 'ibizorder-grid-view9', const refview = this.getExpItemView({ nodetype: nodetype });
parentdata: {}, if (!refview) {
deKeyField:'ibizorder' this.calcToolbarItemState(true);
}; return;
} }
if (Object.is(expmode, 'ORDERTYPEDATA')) { let tempViewparam:any = {};
return { let tempContext:any ={};
viewname: 'ibizorder-grid-view9', if(arg && arg.navfilter){
parentdata: {}, this.counter += 1;
deKeyField:'ibizorder' Object.defineProperty(tempViewparam, arg.navfilter, {
}; value : arg.srfkey,
} writable : true,
return null; enumerable : true,
} configurable : true
})
/** Object.assign(tempContext,{srfcounter:this.counter});
* 树导航选中 }
* Object.assign(tempContext,JSON.parse(JSON.stringify(this.context)));
* @param {any []} args if(arg.srfappctx){
* @param {string} [tag] Object.assign(tempContext,JSON.parse(JSON.stringify(arg.srfappctx)));
* @param {*} [$event2] }
* @returns {void} // 计算导航上下文
* @memberof TreeExpViewtreeexpbarBase if(arg && arg.navigateContext && Object.keys(arg.navigateContext).length >0){
*/ let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{};
public treeexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void { Object.assign(tempData,arg);
if (args.length === 0) { let _context = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateContext);
this.calcToolbarItemState(true); Object.assign(tempContext,_context);
return ; }
} if(arg.srfparentdename){
const arg:any = args[0]; Object.assign(tempContext,{srfparentdename:arg.srfparentdename});
if (!arg.id) { }
this.calcToolbarItemState(true); if(arg.srfparentkey){
return; Object.assign(tempContext,{srfparentkey:arg.srfparentkey});
} }
const nodetype = arg.id.split(';')[0]; // 计算导航参数
const refview = this.getExpItemView({ nodetype: nodetype }); if(arg && arg.navigateParams && Object.keys(arg.navigateParams).length >0){
if (!refview) { let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{};
this.calcToolbarItemState(true); Object.assign(tempData,arg);
return; let _params = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateParams);
} Object.assign(tempViewparam,_params);
let tempViewparam:any = {}; this.counter += 1;
let tempContext:any ={}; Object.assign(tempContext,{srfcounter:this.counter});
if(arg && arg.navfilter){ }
this.counter += 1; const navItem: any = {
Object.defineProperty(tempViewparam, arg.navfilter, { navView: this.navViewName,
value : arg.srfkey, data: args,
writable : true, srfnavdata: {
enumerable : true, context: tempContext,
configurable : true viewparams: tempViewParam
}) }
Object.assign(tempContext,{srfcounter:this.counter}); }
} this.calcToolbarItemState(false);
Object.assign(tempContext,JSON.parse(JSON.stringify(this.context))); this.$emit('selectionchange', navItem);
if(arg.srfappctx){ }
Object.assign(tempContext,JSON.parse(JSON.stringify(arg.srfappctx)));
} /**
// 计算导航上下文 * 树加载完成
if(arg && arg.navigateContext && Object.keys(arg.navigateContext).length >0){ *
let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{}; * @param {any[]} args
Object.assign(tempData,arg); * @param {string} [tag]
let _context = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateContext); * @param {*} [$event2]
Object.assign(tempContext,_context); * @returns {void}
} * @memberof TreeExpViewtreeexpbarBase
if(arg.srfparentdename){ */
Object.assign(tempContext,{srfparentdename:arg.srfparentdename}); public treeexpbar_load(args: any[], tag?: string, $event2?: any): void {
} this.calcToolbarItemState(true);
if(arg.srfparentkey){ this.$emit('load',args);
Object.assign(tempContext,{srfparentkey:arg.srfparentkey}); }
}
// 计算导航参数 /**
if(arg && arg.navigateParams && Object.keys(arg.navigateParams).length >0){ * 执行搜索
let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{}; *
Object.assign(tempData,arg); * @memberof TreeExpViewtreeexpbarBase
let _params = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateParams); */
Object.assign(tempViewparam,_params); public onSearch(): void {
this.counter += 1; if (!this.viewState) {
Object.assign(tempContext,{srfcounter:this.counter}); return;
} }
this.selection = {}; this.istLoadDefaultRefView = false;
Object.assign(this.selection, { view: { viewname: refview.viewname } }); this.viewState.next({ tag: 'treeexpbar_tree', action: 'filter', data: { srfnodefilter: this.srfnodefilter } });
Object.assign(this.selection,{'viewparam':tempViewparam,'context':tempContext}); }
this.calcToolbarItemState(false);
this.$forceUpdate(); /**
} * vue 声明周期
*
/** * @memberof @memberof TreeExpViewtreeexpbarBase
* 树加载完成 */
* public created() {
* @param {any[]} args this.afterCreated();
* @param {string} [tag] }
* @param {*} [$event2]
* @returns {void} /**
* @memberof TreeExpViewtreeexpbarBase * 执行created后的逻辑
*/ *
public treeexpbar_load(args: any[], tag?: string, $event2?: any): void { * @memberof TreeExpViewtreeexpbarBase
this.calcToolbarItemState(true); */
this.$emit('load',args); public afterCreated() {
} if (this.viewState) {
this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => {
/** if (!Object.is(tag, this.name)) {
* 执行搜索 return;
* }
* @memberof TreeExpViewtreeexpbarBase this.istLoadDefaultRefView = false;
*/ this.viewState.next({ tag: 'treeexpbar_tree', action: action, data: data });
public onSearch(): void { });
if (!this.viewState) { }
return; }
}
this.istLoadDefaultRefView = false; /**
this.viewState.next({ tag: 'treeexpbar_tree', action: 'filter', data: { srfnodefilter: this.srfnodefilter } }); * Vue声明周期(组件渲染完毕)
} *
* @memberof TreeExpViewtreeexpbarBase
/** */
* vue 声明周期 public mounted() {
* this.afterMounted();
* @memberof @memberof TreeExpViewtreeexpbarBase }
*/
public created() { /**
this.afterCreated(); * 执行mounted后的逻辑
} *
* @memberof TreeExpViewtreeexpbarBase
/** */
* 执行created后的逻辑 public afterMounted() { }
*
* @memberof TreeExpViewtreeexpbarBase
*/ /**
public afterCreated(){ * vue 生命周期
if (this.viewState) { *
this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => { * @memberof TreeExpViewtreeexpbarBase
if (!Object.is(tag, this.name)) { */
return; public destroyed() {
} this.afterDestroy();
this.istLoadDefaultRefView = false; }
this.viewState.next({ tag: 'treeexpbar_tree', action: action, data: data });
}); /**
} * 执行destroyed后的逻辑
} *
* @memberof TreeExpViewtreeexpbarBase
/** */
* Vue声明周期(组件渲染完毕) public afterDestroy() {
* if (this.viewStateEvent) {
* @memberof TreeExpViewtreeexpbarBase this.viewStateEvent.unsubscribe();
*/ }
public mounted() { }
this.afterMounted();
} /**
* 视图数据变化
/** *
* 执行mounted后的逻辑 * @param {*} $event
* * @memberof TreeExpViewtreeexpbarBase
* @memberof TreeExpViewtreeexpbarBase */
*/ public onViewDatasChange($event: any): void {
public afterMounted(){ this.$emit('selectionchange', $event);
if(this.$store.getters.getViewSplit(this.viewUID)){ }
this.split = this.$store.getters.getViewSplit(this.viewUID);
}else{ /**
let containerWidth:number = (document.getElementById("treeexpviewtreeexpbar") as any).offsetWidth; * 视图数据变化
if(this.ctrlWidth && containerWidth != 0){ *
this.split = this.ctrlWidth/containerWidth; * @param {*} $event
} * @memberof TreeExpViewtreeexpbarBase
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); */
} public onDrViewDatasChange($event: any): void {
} this.viewState.next({ tag: 'treeexpbar_tree', action: 'refresh_parent' });
}
/** /**
* vue 生命周期 * 视图数据被激活
* *
* @memberof TreeExpViewtreeexpbarBase * @param {*} $event
*/ * @memberof TreeExpViewtreeexpbarBase
public destroyed() { */
this.afterDestroy(); public viewDatasActivated($event: any): void {
} this.$emit('activated', $event);
}
/**
* 执行destroyed后的逻辑 /**
* * 视图数据加载完成
* @memberof TreeExpViewtreeexpbarBase *
*/ * @param {*} $event
public afterDestroy() { * @memberof TreeExpViewtreeexpbarBase
if (this.viewStateEvent) { */
this.viewStateEvent.unsubscribe(); public onViewLoad($event: any): void {
} this.$emit('load', $event);
} }
/** /**
* 视图数据变化 * 设置导航区工具栏禁用状态
* *
* @param {*} $event * @param {boolean} state
* @memberof TreeExpViewtreeexpbarBase * @return {*}
*/ * @memberof TreeExpViewtreeexpbarBase
public onViewDatasChange($event: any): void { */
this.$emit('selectionchange', $event); public calcToolbarItemState(state: boolean) {
} let _this: any = this;
const models:any = _this.treeexpviewtreeexpbar_toolbarModels;
/** if (models) {
* 视图数据变化 for (const key in models) {
* if (!models.hasOwnProperty(key)) {
* @param {*} $event return;
* @memberof TreeExpViewtreeexpbarBase }
*/ const _item = models[key];
public onDrViewDatasChange($event: any): void { if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
this.viewState.next({ tag: 'treeexpbar_tree', action: 'refresh_parent' }); _item.disabled = state;
} }
_item.visabled = true;
/** if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
* 视图数据被激活 _item.visabled = false;
* }
* @param {*} $event }
* @memberof TreeExpViewtreeexpbarBase this.calcNavigationToolbarState();
*/ }
public viewDatasActivated($event: any): void { }
this.$emit('activated', $event);
} /**
* 计算导航工具栏权限状态
/** *
* 视图数据加载完成 * @memberof TreeExpViewtreeexpbarBase
* */
* @param {*} $event public calcNavigationToolbarState(){
* @memberof TreeExpViewtreeexpbarBase let _this: any = this;
*/ // 界面行为
public onViewLoad($event: any): void { if(_this.treeexpviewtreeexpbar_toolbarModels){
this.$emit('load', $event); const curUIService:IBIZOrderUIService = new IBIZOrderUIService();
} ViewTool.calcActionItemAuthState({},_this.treeexpviewtreeexpbar_toolbarModels,curUIService);
}
/** }
* 设置导航区工具栏禁用状态
*
* @param {boolean} state
* @return {*}
* @memberof TreeExpViewtreeexpbarBase
*/
public calcToolbarItemState(state: boolean) {
let _this: any = this;
const models:any = _this.treeexpviewtreeexpbar_toolbarModels;
if (models) {
for (const key in models) {
if (!models.hasOwnProperty(key)) {
return;
}
const _item = models[key];
if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
_item.disabled = state;
}
_item.visabled = true;
if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
_item.visabled = false;
}
}
this.calcNavigationToolbarState();
}
}
/**
* 计算导航工具栏权限状态
*
* @memberof TreeExpViewtreeexpbarBase
*/
public calcNavigationToolbarState(){
let _this: any = this;
// 界面行为
if(_this.treeexpviewtreeexpbar_toolbarModels){
const curUIService:IBIZOrderUIService = new IBIZOrderUIService();
ViewTool.calcActionItemAuthState({},_this.treeexpviewtreeexpbar_toolbarModels,curUIService);
}
}
/** /**
* 工具栏模型 * 工具栏模型
* *
...@@ -702,10 +646,10 @@ export default class TreeExpViewtreeexpbarBase extends Vue implements ControlInt ...@@ -702,10 +646,10 @@ export default class TreeExpViewtreeexpbarBase extends Vue implements ControlInt
deuiaction3: { name: 'deuiaction3', actiontarget: 'NONE', caption: '编辑', disabled: false, type: 'DEUIACTION', visabled: true,noprivdisplaymode:2,dataaccaction: '', uiaction: { tag: 'Edit', target: 'SINGLEKEY' } }, deuiaction3: { name: 'deuiaction3', actiontarget: 'NONE', caption: '编辑', disabled: false, type: 'DEUIACTION', visabled: true,noprivdisplaymode:2,dataaccaction: '', uiaction: { tag: 'Edit', target: 'SINGLEKEY' } },
}; };
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './tree-exp-viewtreeexpbar-treeexpbar.less'; @import './tree-exp-viewtreeexpbar-treeexpbar.less';
</style> </style>
app_Web/src/widgets/ibizorder/usr2-calendar-exp-viewcalendarexpbar-calendarexpbar/usr2-calendar-exp-viewcalendarexpbar-calendarexpbar-base.vue
浏览文件 @ 94c1446b
<template> <template>
<split id="usr2calendarexpviewcalendarexpbar" class="app-calendar-exp-bar" v-model="split" mode="horizontal" @on-move-end="onSplitChange"> <div id="usr2calendarexpviewcalendarexpbar" class="app-calendar-exp-bar">
<div slot='left'> <div class='calendar-exp-bar-header'>
<div class='calendar-exp-bar-header'> <div class="calendar-exp-bar-title">
<div class="calendar-exp-bar-title"> <icon type='ios-home-outline'/>{{ $t('app.calendarExpBar.title') }}
<icon type='ios-home-outline'/>{{ $t('app.calendarExpBar.title') }} </div>
</div> </div>
</div> <div class="exp-bar-action-container">
<div class="container-header"> <div class='search-container'>
<div class='search-container'> <i-input
<i-input :search="true" v-model="searchText"
@on-change="($event) => { this.searchText = $event.target.value; }" :search="true"
:placeholder="placeholder" :placeholder="placeholder"
@on-search="onSearch"> @on-search="onSearch">
</i-input> </i-input>
</div> </div>
<div class='toolbar-container'> <div class='toolbar-container'>
<tooltip :transfer="true" :max-width="600"> <tooltip :transfer="true" :max-width="600">
<i-button v-show="usr2calendarexpviewcalendarexpbar_toolbarModels.deuiaction3.visabled" :disabled="usr2calendarexpviewcalendarexpbar_toolbarModels.deuiaction3.disabled" class='' v-loading:i-button @click="calendarexpbar_toolbar_click({ tag: 'deuiaction3' }, $event)"> <i-button v-show="usr2calendarexpviewcalendarexpbar_toolbarModels.deuiaction3.visabled" :disabled="usr2calendarexpviewcalendarexpbar_toolbarModels.deuiaction3.disabled" class='' v-loading:i-button @click="calendarexpbar_toolbar_click({ tag: 'deuiaction3' }, $event)">
<i class='fa fa-edit'></i> <i class='fa fa-edit'></i>
...@@ -22,10 +22,10 @@ ...@@ -22,10 +22,10 @@
</i-button> </i-button>
<div slot='content'>{{$t('entities.ibizorder.usr2calendarexpviewcalendarexpbar_toolbar_toolbar.deuiaction3.tip')}}</div> <div slot='content'>{{$t('entities.ibizorder.usr2calendarexpviewcalendarexpbar_toolbar_toolbar.deuiaction3.tip')}}</div>
</tooltip> </tooltip>
</div> </div>
</div> </div>
<div class='calendar-exp-bar-content'> <div class='calendar-exp-bar-content'>
<view_calendarexpbar_calendar <view_calendarexpbar_calendar
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
:context="context" :context="context"
...@@ -38,23 +38,12 @@ ...@@ -38,23 +38,12 @@
@selectionchange="calendarexpbar_calendar_selectionchange($event)" @selectionchange="calendarexpbar_calendar_selectionchange($event)"
@load="calendarexpbar_calendar_load($event)" @load="calendarexpbar_calendar_load($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_calendarexpbar_calendar> </view_calendarexpbar_calendar>
</div> </div>
</div> </div>
<div slot='right'> </template>
<component
v-if="selection.view && !Object.is(this.selection.view.viewname, '')"
:is="selection.view.viewname"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(selection.context)"
:viewparam="JSON.stringify(selection.viewparam)">
</component>
</div>
</split>
</template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator';
import { CreateElement } from 'vue'; import { CreateElement } from 'vue';
...@@ -283,145 +272,112 @@ export default class Usr2CalendarExpViewcalendarexpbarBase extends Vue implement ...@@ -283,145 +272,112 @@ export default class Usr2CalendarExpViewcalendarexpbarBase extends Vue implement
} }
} }
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {boolean} * @type {boolean}
* @memberof Usr2CalendarExpViewcalendarexpbarBase * @memberof Usr2CalendarExpViewcalendarexpbarBase
*/ */
@Prop() public viewUID!:string; @Prop() public viewUID!:string;
/** /**
* 打开新建数据视图 * 打开新建数据视图
* *
* @type {any} * @type {any}
* @memberof Usr2CalendarExpViewcalendarexpbarBase * @memberof Usr2CalendarExpViewcalendarexpbarBase
*/ */
@Prop() public newdata: any; @Prop() public newdata: any;
/** /**
* 打开编辑数据视图 * 打开编辑数据视图
* *
* @type {any} * @type {any}
* @memberof Usr2CalendarExpViewcalendarexpbarBase * @memberof Usr2CalendarExpViewcalendarexpbarBase
*/ */
@Prop() public opendata: any; @Prop() public opendata: any;
/** /**
* 是否单选 * 是否单选
* *
* @public * @public
* @type {(boolean)} * @type {(boolean)}
* @memberof Usr2CalendarExpViewcalendarexpbarBase * @memberof Usr2CalendarExpViewcalendarexpbarBase
*/ */
public isSingleSelect:boolean = true; public isSingleSelect:boolean = true;
/** /**
* 呈现模式，可选值：horizontal或者vertical * 可搜索字段名称
* *
* @public *
* @type {(string)} * @type {(string)}
* @memberof Usr2CalendarExpViewcalendarexpbarBase * @memberof Usr2CalendarExpViewcalendarexpbarBase
*/ */
public showMode:string ="horizontal"; public placeholder = "订单名称";
/** /**
* 控件宽度 * 搜素值
* *
* @type {number} * @public
* @memberof Usr2CalendarExpViewcalendarexpbarBase * @type {(string)}
*/ * @memberof Usr2CalendarExpViewcalendarexpbarBase
public ctrlWidth:number = 0; */
public searchText: string = "";
/**
* 控件高度
* /**
* @type {number} * 导航视图名称
* @memberof Usr2CalendarExpViewcalendarexpbarBase *
*/ * @type {string}
public ctrlHeight: number = 0; * @memberof Usr2CalendarExpViewcalendarexpbarBase
*/
/** public navViewName: any = {
* 可搜索字段名称 item1: "ibizorder-detail-sgrid-view9"
* };
*
* @type {(string)} /**
* @memberof Usr2CalendarExpViewcalendarexpbarBase * 导航参数
*/ *
public placeholder="订单名称"; * @type {*}
* @memberof Usr2CalendarExpViewcalendarexpbarBase
/** */
* 搜素值 public navParam: any = {
* item1: {
* @public navigateContext:null,
* @type {(string)} navigateParams:null
* @memberof Usr2CalendarExpViewcalendarexpbarBase }
*/ };
public searchText:string = "";
/**
/** * 导航过滤项
* 分割宽度 *
* * @type {*}
* @type {number} * @memberof Usr2CalendarExpViewcalendarexpbarBase
* @memberof Usr2CalendarExpViewcalendarexpbarBase */
*/ public navFilter: any = {
public split: number = 0.5; item1: ""
};
/** /**
* 导航视图名称 * 导航关系
* *
* @type {string} * @type {*}
* @memberof Usr2CalendarExpViewcalendarexpbarBase * @memberof Usr2CalendarExpViewcalendarexpbarBase
*/ */
public navViewName: any = { public navPSDer: any = {
item1: "ibizorder-detail-sgrid-view9" item1: "n_ibizorderid_eq"
}; };
/** /**
* 导航参数 * 显示处理提示
* *
* @type {*} * @type {boolean}
* @memberof Usr2CalendarExpViewcalendarexpbarBase * @memberof Usr2CalendarExpViewcalendarexpbarBase
*/ */
public navParam: any = { @Prop({ default: true }) public showBusyIndicator!: boolean;
item1: {
navigateContext:null,
navigateParams:null
}
};
/**
* 导航过滤项
*
* @type {*}
* @memberof Usr2CalendarExpViewcalendarexpbarBase
*/
public navFilter: any = {
item1: ""
};
/**
* 导航关系
*
* @type {*}
* @memberof Usr2CalendarExpViewcalendarexpbarBase
*/
public navPSDer: any = {
item1: "n_ibizorderid_eq"
};
/**
* 显示处理提示
*
* @type {boolean}
* @memberof Usr2CalendarExpViewcalendarexpbarBase
*/
@Prop({ default: true }) public showBusyIndicator!: boolean;
/** /**
* 工具栏模型 * 工具栏模型
* *
...@@ -432,253 +388,214 @@ export default class Usr2CalendarExpViewcalendarexpbarBase extends Vue implement ...@@ -432,253 +388,214 @@ export default class Usr2CalendarExpViewcalendarexpbarBase extends Vue implement
deuiaction3: { name: 'deuiaction3', actiontarget: 'NONE', caption: '编辑', disabled: false, type: 'DEUIACTION', visabled: true,noprivdisplaymode:2,dataaccaction: '', uiaction: { tag: 'Edit', target: 'SINGLEKEY' } }, deuiaction3: { name: 'deuiaction3', actiontarget: 'NONE', caption: '编辑', disabled: false, type: 'DEUIACTION', visabled: true,noprivdisplaymode:2,dataaccaction: '', uiaction: { tag: 'Edit', target: 'SINGLEKEY' } },
}; };
/** /**
* 获取多项数据 * 获取多项数据
* *
* @returns {any[]} * @returns {any[]}
* @memberof Usr2CalendarExpViewcalendarexpbarBase * @memberof Usr2CalendarExpViewcalendarexpbarBase
*/ */
public getDatas(): any[] { public getDatas(): any[] {
return []; return [];
} }
/** /**
* 获取单项树 * 获取单项树
* *
* @returns {*} * @returns {*}
* @memberof Usr2CalendarExpViewcalendarexpbarBase * @memberof Usr2CalendarExpViewcalendarexpbarBase
*/ */
public getData(): any { public getData(): any {
return null; return null;
} }
/** /**
* 选中数据 * Vue声明周期(组件初始化完毕)
* *
* @type {*} * @memberof Usr2CalendarExpViewcalendarexpbarBase
* @memberof Usr2CalendarExpViewcalendarexpbarBase */
*/ public created() {
public selection: any = {}; this.afterCreated();
}
/**
* split值变化事件 /**
* * 执行created后的逻辑
* @memberof Usr2CalendarExpViewcalendarexpbarBase *
*/ * @memberof Usr2CalendarExpViewcalendarexpbarBase
public onSplitChange() { */
if(this.$refs.calendarexpbar_calendar){ public afterCreated(){
const calendarContainer:any = this.$refs.calendarexpbar_calendar; if (this.viewState) {
if(calendarContainer.$refs.calendar){ this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => {
const appCalendar: any = calendarContainer.$refs.calendar; if (!Object.is(tag, this.name)) {
const api = appCalendar.getApi(); return;
api.updateSize(); }
} this.viewState.next({ tag: 'calendarexpbar_calendar', action: action, data: data });
} });
if(this.split){ }
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); }
}
} /**
* Vue声明周期(组件渲染完毕)
/** *
* Vue声明周期(组件初始化完毕) * @memberof Usr2CalendarExpViewcalendarexpbarBase
* */
* @memberof Usr2CalendarExpViewcalendarexpbarBase public mounted() {
*/ this.afterMounted();
public created() { }
this.afterCreated();
} /**
* 执行mounted后的逻辑
/** *
* 执行created后的逻辑 * @memberof Usr2CalendarExpViewcalendarexpbarBase
* */
* @memberof Usr2CalendarExpViewcalendarexpbarBase public afterMounted() { }
*/
public afterCreated(){ /**
if (this.viewState) { * vue 生命周期
this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => { *
if (!Object.is(tag, this.name)) { * @memberof Usr2CalendarExpViewcalendarexpbarBase
return; */
} public destroyed() {
this.viewState.next({ tag: 'calendarexpbar_calendar', action: action, data: data }); this.afterDestroy();
}); }
}
} /**
* 执行destroyed后的逻辑
/** *
* Vue声明周期(组件渲染完毕) * @memberof Usr2CalendarExpViewcalendarexpbarBase
* */
* @memberof Usr2CalendarExpViewcalendarexpbarBase public afterDestroy() {
*/ if (this.viewStateEvent) {
public mounted() { this.viewStateEvent.unsubscribe();
this.afterMounted(); }
} }
/** /**
* 执行mounted后的逻辑 * 刷新
* *
* @memberof Usr2CalendarExpViewcalendarexpbarBase * @memberof Usr2CalendarExpViewcalendarexpbarBase
*/ */
public afterMounted(){ public refresh(args?: any): void {
if(this.$store.getters.getViewSplit(this.viewUID)){ const refs: any = this.$refs;
this.split = this.$store.getters.getViewSplit(this.viewUID); if (refs && refs.calendarexpbar_calendar) {
}else{ refs.calendarexpbar_calendar.refresh();
let containerWidth:number = (document.getElementById("usr2calendarexpviewcalendarexpbar") as any).offsetWidth; }
let containerHeight:number = (document.getElementById("usr2calendarexpviewcalendarexpbar") as any).offsetHeight; }
if(Object.is(this.showMode,'horizontal')){
if(this.ctrlWidth && containerWidth != 0){ /**
this.split = this.ctrlWidth/containerWidth; * calendarexpbar的选中数据事件
} *
}else{ * @memberof Usr2CalendarExpViewcalendarexpbarBase
if(this.ctrlHeight && containerHeight != 0){ */
this.split = this.ctrlHeight/containerHeight; public calendarexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void {
} let tempContext:any = {};
} let tempViewParam:any = {};
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); if (args.length === 0) {
} this.calcToolbarItemState(true);
} return ;
}
/** const arg:any = args[0];
* vue 生命周期 if(this.context){
* Object.assign(tempContext,JSON.parse(JSON.stringify(this.context)));
* @memberof Usr2CalendarExpViewcalendarexpbarBase }
*/ switch(arg.itemType) {
public destroyed() { case "item1":
this.afterDestroy(); Object.assign(tempContext,{ ibizorder : arg.ibizorder});
} Object.assign(tempContext,{srfparentdename:'IBIZOrder',srfparentkey:arg['ibizorder']});
if(this.navFilter && this.navFilter['item1'] && !Object.is(this.navFilter['item1'],"")){
/** Object.assign(tempViewParam,{[this.navFilter['item1']]:arg['ibizorder']});
* 执行destroyed后的逻辑 }
* if(this.navPSDer && this.navFilter['item1'] && !Object.is(this.navPSDer['item1'],"")){
* @memberof Usr2CalendarExpViewcalendarexpbarBase Object.assign(tempViewParam,{[this.navPSDer['item1']]:arg['ibizorder']});
*/ }
public afterDestroy() { if(this.navParam && this.navParam['item1'] && this.navParam['item1'].navigateContext && Object.keys(this.navParam['item1'].navigateContext).length >0){
if (this.viewStateEvent) { let _context:any = this.$util.computedNavData(arg,tempContext,tempViewParam,this.navParam['item1'].navigateContext);
this.viewStateEvent.unsubscribe(); Object.assign(tempContext,_context);
} }
} if(this.navParam && this.navParam['item1'] && this.navParam['item1'].navigateParams && Object.keys(this.navParam['item1'].navigateParams).length >0){
let _params:any = this.$util.computedNavData(arg,tempContext,tempViewParam,this.navParam['item1'].navigateParams);
/** Object.assign(tempViewParam,_params);
* 刷新 }
* break;
* @memberof Usr2CalendarExpViewcalendarexpbarBase }
*/ const navItem: any = {
public refresh(args?: any): void { navView: this.navViewName,
const refs: any = this.$refs; data: args,
if (refs && refs.calendarexpbar_calendar) { srfnavdata: {
refs.calendarexpbar_calendar.refresh(); context: tempContext,
} viewparams: tempViewParam
} }
}
/** this.calcToolbarItemState(false);
* calendarexpbar的选中数据事件 this.$emit('selectionchange', navItem);
* }
* @memberof Usr2CalendarExpViewcalendarexpbarBase
*/ /**
public calendarexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void { * calendarexpbar的load完成事件
let tempContext:any = {}; *
let tempViewParam:any = {}; * @memberof Usr2CalendarExpViewcalendarexpbarBase
if (args.length === 0) { */
this.calcToolbarItemState(true); public calendarexpbar_load(args:any, tag?: string, $event2?: any){
return ; this.calcToolbarItemState(true);
} this.$emit('load',args);
const arg:any = args[0]; }
if(this.context){
Object.assign(tempContext,JSON.parse(JSON.stringify(this.context))); /**
} * 设置导航区工具栏禁用状态
switch(arg.itemType) { *
case "item1": * @param {boolean} state
Object.assign(tempContext,{ ibizorder : arg.ibizorder}); * @return {*}
Object.assign(tempContext,{srfparentdename:'IBIZOrder',srfparentkey:arg['ibizorder']}); * @memberof Usr2CalendarExpViewcalendarexpbarBase
if(this.navFilter && this.navFilter['item1'] && !Object.is(this.navFilter['item1'],"")){ */
Object.assign(tempViewParam,{[this.navFilter['item1']]:arg['ibizorder']}); public calcToolbarItemState(state: boolean) {
} let _this: any = this;
if(this.navPSDer && this.navFilter['item1'] && !Object.is(this.navPSDer['item1'],"")){ const models:any = _this.usr2calendarexpviewcalendarexpbar_toolbarModels;
Object.assign(tempViewParam,{[this.navPSDer['item1']]:arg['ibizorder']}); if (models) {
} for (const key in models) {
if(this.navParam && this.navParam['item1'] && this.navParam['item1'].navigateContext && Object.keys(this.navParam['item1'].navigateContext).length >0){ if (!models.hasOwnProperty(key)) {
let _context:any = this.$util.computedNavData(arg,tempContext,tempViewParam,this.navParam['item1'].navigateContext); return;
Object.assign(tempContext,_context); }
} const _item = models[key];
if(this.navParam && this.navParam['item1'] && this.navParam['item1'].navigateParams && Object.keys(this.navParam['item1'].navigateParams).length >0){ if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
let _params:any = this.$util.computedNavData(arg,tempContext,tempViewParam,this.navParam['item1'].navigateParams); _item.disabled = state;
Object.assign(tempViewParam,_params); }
} _item.visabled = true;
break; if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
} _item.visabled = false;
this.selection = {}; }
Object.assign(this.selection, { view: { viewname: this.navViewName[arg.itemType] }, context:tempContext,viewparam:tempViewParam }); }
this.calcToolbarItemState(false); this.calcNavigationToolbarState();
this.$emit('selectionchange',args); }
this.$forceUpdate(); }
}
/**
/** * 计算导航工具栏权限状态
* calendarexpbar的load完成事件 *
* * @memberof Usr2CalendarExpViewcalendarexpbarBase
* @memberof Usr2CalendarExpViewcalendarexpbarBase */
*/ public calcNavigationToolbarState(){
public calendarexpbar_load(args:any, tag?: string, $event2?: any){ let _this: any = this;
this.calcToolbarItemState(true); // 界面行为
this.$emit('load',args); if(_this.usr2calendarexpviewcalendarexpbar_toolbarModels){
} const curUIService:IBIZOrderUIService = new IBIZOrderUIService();
ViewTool.calcActionItemAuthState({},_this.usr2calendarexpviewcalendarexpbar_toolbarModels,curUIService);
/** }
* 设置导航区工具栏禁用状态 }
*
* @param {boolean} state /**
* @return {*} * 执行搜索
* @memberof Usr2CalendarExpViewcalendarexpbarBase *
*/ * @memberof Usr2CalendarExpViewcalendarexpbarBase
public calcToolbarItemState(state: boolean) { */
let _this: any = this; public onSearch($event:any) {
const models:any = _this.usr2calendarexpviewcalendarexpbar_toolbarModels; let calendar:any = this.$refs.calendarexpbar_calendar;
if (models) { calendar.searchEvents({ query: this.searchText });
for (const key in models) { }
if (!models.hasOwnProperty(key)) {
return;
}
const _item = models[key];
if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
_item.disabled = state;
}
_item.visabled = true;
if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
_item.visabled = false;
}
}
this.calcNavigationToolbarState();
}
}
/**
* 计算导航工具栏权限状态
*
* @memberof Usr2CalendarExpViewcalendarexpbarBase
*/
public calcNavigationToolbarState(){
let _this: any = this;
// 界面行为
if(_this.usr2calendarexpviewcalendarexpbar_toolbarModels){
const curUIService:IBIZOrderUIService = new IBIZOrderUIService();
ViewTool.calcActionItemAuthState({},_this.usr2calendarexpviewcalendarexpbar_toolbarModels,curUIService);
}
}
/**
* 执行搜索
*
* @memberof Usr2CalendarExpViewcalendarexpbarBase
*/
public onSearch($event:any) {
let calendar:any = this.$refs.calendarexpbar_calendar;
calendar.searchEvents({ query: this.searchText });
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './usr2-calendar-exp-viewcalendarexpbar-calendarexpbar.less'; @import './usr2-calendar-exp-viewcalendarexpbar-calendarexpbar.less';
</style> </style>
\ No newline at end of file
app_Web/src/widgets/ibizorder/usr2-calendar-exp-viewcalendarexpbar-calendarexpbar/usr2-calendar-exp-viewcalendarexpbar-calendarexpbar.less
浏览文件 @ 94c1446b
.app-calendar-exp-bar { .app-calendar-exp-bar {
> .ivu-split-horizontal { height: 100%;
> .ivu-split-trigger-con { display: flex;
height: 100%; flex-direction: column;
width: 1px; .calendar-exp-bar-header {
} line-height: 50px;
> .ivu-split-pane { border-bottom: 1px solid #ddd;
> div { .calendar-exp-bar-title {
height: 100%; font-size: 18px;
overflow: auto; padding-left: 8px;
display: flex; i {
flex-direction: column; font-size: 20px;
.calendar-exp-bar-header { margin-top: -2px;
line-height: 50px; }
border-bottom: 1px solid #ddd; }
.calendar-exp-bar-title { }
font-size: 18px; .exp-bar-action-container {
padding-left: 8px; display: flex;
i { align-items: center;
font-size: 20px; }
margin-top: -2px; .container-header{
} display: flex;
} justify-content: flex-start;
} align-items: center;
.container-header{ flex-wrap: wrap;
display: flex; .search-container {
justify-content: flex-start; width: 30%;
align-items: center; height: 48px;
flex-wrap: wrap; padding: 10px 10px 10px 0;
.quick-group-container { min-width: 200px;
padding-top: 8px; max-width: 400px;
padding-right: 20px; }
} .toolbar-container{
.search-container { padding: 4px;
width: 30%; }
height: 48px; .quick-group-container {
padding: 10px; padding-top: 8px;
min-width: 200px; padding-right: 20px;
max-width: 400px; }
} }
.toolbar-container{ .calendar-exp-bar-content {
padding: 4px; flex-grow: 1;
display: flex; overflow: auto;
flex-wrap: wrap; }
align-items: center; }
}
}
.calendar-exp-bar-content {
height: calc(100% - 88px);
overflow: auto;
padding: 16px 0;
margin-bottom: 10px;
}
.calendar-exp-bar-content2 {
height: 100%;
overflow: auto;
flex-grow: 1;
}
}
}
> .right-pane.ivu-split-pane {
> div {
padding-left: 10px;
}
}
> .left-pane.ivu-split-pane {
padding-right: 10px;
}
}
> .ivu-split-vertical{
> .ivu-split-pane {
> div {
height: 100%;
overflow: auto;
display: flex;
flex-direction: column;
.calendar-exp-bar-header {
line-height: 50px;
border-bottom: 1px solid #ddd;
.calendar-exp-bar-title {
font-size: 18px;
padding-left: 8px;
i {
font-size: 20px;
margin-top: -2px;
}
}
}
.container-header{
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
.quick-group-container {
padding-top: 8px;
padding-right: 20px;
}
.search-container {
width: 30%;
height: 48px;
padding: 10px 10px 10px 0;
min-width: 200px;
max-width: 400px;
}
.toolbar-container{
padding: 4px;
}
}
.calendar-exp-bar-content {
height: calc(100% - 88px);
overflow: auto;
margin-bottom: 10px;
}
.calendar-exp-bar-content2 {
height: 100%;
overflow: auto;
flex-grow: 1;
}
}
}
> .top-pane.ivu-split-pane {
> div {
padding-bottom: 10px;
}
}
> .bottom-pane.ivu-split-pane {
padding-top: 10px;
}
}
}
// this is less // this is less
app_Web/src/widgets/ibizsample0003/f1-tree-exp-viewtreeexpbar-treeexpbar/f1-tree-exp-viewtreeexpbar-treeexpbar-base.vue
浏览文件 @ 94c1446b
<template> <template>
<split id="f1treeexpviewtreeexpbar" class='app-tree-exp-bar' v-model="split" mode="horizontal" @on-move-end="onSplitChange"> <div id="f1treeexpviewtreeexpbar" class='app-tree-exp-bar'>
<div slot='left'> <div class='tree-exp-bar-header'>
<div class='tree-exp-bar-header'> <div class="tree-exp-bar-title">
<div class="tree-exp-bar-title"> <icon type='ios-home-outline'/>{{ $t('app.treeExpBar.title') }}
<icon type='ios-home-outline'/>{{ $t('app.treeExpBar.title') }} </div>
</div> </div>
</div> <div class='tree-exp-content'>
<div class='tree-exp-content'>
<view_treeexpbar_tree <view_treeexpbar_tree
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
...@@ -24,25 +23,9 @@ ...@@ -24,25 +23,9 @@
@load="treeexpbar_tree_load($event)" @load="treeexpbar_tree_load($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_treeexpbar_tree> </view_treeexpbar_tree>
</div> </div>
</div> </div>
<div slot='right'> </template>
<component
v-if="selection.view && !Object.is(this.selection.view.viewname, '')"
:is="selection.view.viewname"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(selection.context)"
:viewparam="JSON.stringify(selection.viewparam)"
@viewdataschange="onViewDatasChange"
@drdatasaved="onDrViewDatasChange"
@drdatasremove="onDrViewDatasChange"
@viewdatasactivated="viewDatasActivated"
@viewload="onViewLoad">
</component>
</div>
</split>
</template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator';
import { CreateElement } from 'vue'; import { CreateElement } from 'vue';
...@@ -204,413 +187,373 @@ export default class F1TreeExpViewtreeexpbarBase extends Vue implements ControlI ...@@ -204,413 +187,373 @@ export default class F1TreeExpViewtreeexpbarBase extends Vue implements ControlI
} }
} }
/** /**
* 打开新建数据视图 * 打开新建数据视图
* *
* @type {any} * @type {any}
* @memberof F1TreeExpViewtreeexpbarBase * @memberof F1TreeExpViewtreeexpbarBase
*/ */
@Prop() public newdata: any; @Prop() public newdata: any;
/** /**
* 打开编辑数据视图 * 打开编辑数据视图
* *
* @type {any} * @type {any}
* @memberof F1TreeExpViewtreeexpbarBase * @memberof F1TreeExpViewtreeexpbarBase
*/ */
@Prop() public opendata: any; @Prop() public opendata: any;
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {boolean} * @type {boolean}
* @memberof F1TreeExpViewtreeexpbarBase * @memberof F1TreeExpViewtreeexpbarBase
*/ */
@Prop() public viewUID!:string; @Prop() public viewUID!:string;
/** /**
* 获取多项数据 * 获取多项数据
* *
* @returns {any[]} * @returns {any[]}
* @memberof F1TreeExpViewtreeexpbarBase * @memberof F1TreeExpViewtreeexpbarBase
*/ */
public getDatas(): any[] { public getDatas(): any[] {
return []; return [];
} }
/** /**
* 获取单项树 * 获取单项树
* *
* @returns {*} * @returns {*}
* @memberof F1TreeExpViewtreeexpbarBase * @memberof F1TreeExpViewtreeexpbarBase
*/ */
public getData(): any { public getData(): any {
return {}; return {};
} }
/** /**
* 选中数据 * 可搜索字段名称
* *
* @type {*} *
* @memberof F1TreeExpViewtreeexpbarBase * @type {(string)}
*/ * @memberof F1TreeExpViewtreeexpbarBase
public selection: any = {}; */
public placeholder = "名称";
/**
* 控件宽度 /**
* * 过滤值
* @type {number} *
* @memberof F1TreeExpViewtreeexpbarBase * @type {string}
*/ * @memberof F1TreeExpViewtreeexpbarBase
public ctrlWidth:number = 0; */
public srfnodefilter: string = '';
/**
* 可搜索字段名称 /**
* * 刷新标识
* *
* @type {(string)} * @public
* @memberof F1TreeExpViewtreeexpbarBase * @type {number}
*/ * @memberof F1TreeExpViewtreeexpbarBase
public placeholder="名称"; */
public counter:number = 0;
/**
* 过滤值 /**
* * 是否加载默认关联视图
* @type {string} *
* @memberof F1TreeExpViewtreeexpbarBase * @public
*/ * @type {boolean}
public srfnodefilter: string = ''; * @memberof F1TreeExpViewtreeexpbarBase
*/
/** public istLoadDefaultRefView: boolean = false;
* 刷新标识
* /**
* @public * 获取关系项视图
* @type {number} *
* @memberof F1TreeExpViewtreeexpbarBase * @param {*} [arg={}]
*/ * @returns {*}
public counter:number = 0; * @memberof F1TreeExpViewtreeexpbarBase
*/
/** public getExpItemView(arg: any = {}): any {
* 是否加载默认关联视图 let expmode = arg.nodetype.toUpperCase();
* if (!expmode) {
* @public expmode = '';
* @type {boolean} }
* @memberof F1TreeExpViewtreeexpbarBase if (Object.is(expmode, 'PRODUCT')) {
*/ return {
public istLoadDefaultRefView: boolean = false; viewname: 'ibizuniproduct-sgrid-view',
parentdata: {},
/** deKeyField:'ibizuniproduct'
* 分割宽度 };
* }
* @type {number} if (Object.is(expmode, 'HARDWARE')) {
* @memberof F1TreeExpViewtreeexpbarBase return {
*/ viewname: 'ibizhardware-sgrid-view',
public split: number = 0.2; parentdata: {},
deKeyField:'ibizhardware'
/** };
* split值变化事件 }
* if (Object.is(expmode, 'SOFTWARE')) {
* @memberof F1TreeExpViewtreeexpbarBase return {
*/ viewname: 'ibizsoftware-suit-sgrid-view',
public onSplitChange() { parentdata: {},
if(this.split){ deKeyField:'ibizsoftwaresuit'
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); };
} }
} return null;
}
/**
* 获取关系项视图 /**
* * 树导航选中
* @param {*} [arg={}] *
* @returns {*} * @param {any []} args
* @memberof F1TreeExpViewtreeexpbarBase * @param {string} [tag]
*/ * @param {*} [$event2]
public getExpItemView(arg: any = {}): any { * @returns {void}
let expmode = arg.nodetype.toUpperCase(); * @memberof F1TreeExpViewtreeexpbarBase
if (!expmode) { */
expmode = ''; public treeexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void {
} if (args.length === 0) {
if (Object.is(expmode, 'PRODUCT')) { this.calcToolbarItemState(true);
return { return ;
viewname: 'ibizuniproduct-sgrid-view', }
parentdata: {}, const arg:any = args[0];
deKeyField:'ibizuniproduct' if (!arg.id) {
}; this.calcToolbarItemState(true);
} return;
if (Object.is(expmode, 'HARDWARE')) { }
return { const nodetype = arg.id.split(';')[0];
viewname: 'ibizhardware-sgrid-view', const refview = this.getExpItemView({ nodetype: nodetype });
parentdata: {}, if (!refview) {
deKeyField:'ibizhardware' this.calcToolbarItemState(true);
}; return;
} }
if (Object.is(expmode, 'SOFTWARE')) { let tempViewparam:any = {};
return { let tempContext:any ={};
viewname: 'ibizsoftware-suit-sgrid-view', if(arg && arg.navfilter){
parentdata: {}, this.counter += 1;
deKeyField:'ibizsoftwaresuit' Object.defineProperty(tempViewparam, arg.navfilter, {
}; value : arg.srfkey,
} writable : true,
return null; enumerable : true,
} configurable : true
})
/** Object.assign(tempContext,{srfcounter:this.counter});
* 树导航选中 }
* Object.assign(tempContext,JSON.parse(JSON.stringify(this.context)));
* @param {any []} args if(arg.srfappctx){
* @param {string} [tag] Object.assign(tempContext,JSON.parse(JSON.stringify(arg.srfappctx)));
* @param {*} [$event2] }
* @returns {void} // 计算导航上下文
* @memberof F1TreeExpViewtreeexpbarBase if(arg && arg.navigateContext && Object.keys(arg.navigateContext).length >0){
*/ let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{};
public treeexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void { Object.assign(tempData,arg);
if (args.length === 0) { let _context = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateContext);
this.calcToolbarItemState(true); Object.assign(tempContext,_context);
return ; }
} if(arg.srfparentdename){
const arg:any = args[0]; Object.assign(tempContext,{srfparentdename:arg.srfparentdename});
if (!arg.id) { }
this.calcToolbarItemState(true); if(arg.srfparentkey){
return; Object.assign(tempContext,{srfparentkey:arg.srfparentkey});
} }
const nodetype = arg.id.split(';')[0]; // 计算导航参数
const refview = this.getExpItemView({ nodetype: nodetype }); if(arg && arg.navigateParams && Object.keys(arg.navigateParams).length >0){
if (!refview) { let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{};
this.calcToolbarItemState(true); Object.assign(tempData,arg);
return; let _params = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateParams);
} Object.assign(tempViewparam,_params);
let tempViewparam:any = {}; this.counter += 1;
let tempContext:any ={}; Object.assign(tempContext,{srfcounter:this.counter});
if(arg && arg.navfilter){ }
this.counter += 1; const navItem: any = {
Object.defineProperty(tempViewparam, arg.navfilter, { navView: this.navViewName,
value : arg.srfkey, data: args,
writable : true, srfnavdata: {
enumerable : true, context: tempContext,
configurable : true viewparams: tempViewParam
}) }
Object.assign(tempContext,{srfcounter:this.counter}); }
} this.calcToolbarItemState(false);
Object.assign(tempContext,JSON.parse(JSON.stringify(this.context))); this.$emit('selectionchange', navItem);
if(arg.srfappctx){ }
Object.assign(tempContext,JSON.parse(JSON.stringify(arg.srfappctx)));
} /**
// 计算导航上下文 * 树加载完成
if(arg && arg.navigateContext && Object.keys(arg.navigateContext).length >0){ *
let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{}; * @param {any[]} args
Object.assign(tempData,arg); * @param {string} [tag]
let _context = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateContext); * @param {*} [$event2]
Object.assign(tempContext,_context); * @returns {void}
} * @memberof F1TreeExpViewtreeexpbarBase
if(arg.srfparentdename){ */
Object.assign(tempContext,{srfparentdename:arg.srfparentdename}); public treeexpbar_load(args: any[], tag?: string, $event2?: any): void {
} this.calcToolbarItemState(true);
if(arg.srfparentkey){ this.$emit('load',args);
Object.assign(tempContext,{srfparentkey:arg.srfparentkey}); }
}
// 计算导航参数 /**
if(arg && arg.navigateParams && Object.keys(arg.navigateParams).length >0){ * 执行搜索
let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{}; *
Object.assign(tempData,arg); * @memberof F1TreeExpViewtreeexpbarBase
let _params = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateParams); */
Object.assign(tempViewparam,_params); public onSearch(): void {
this.counter += 1; if (!this.viewState) {
Object.assign(tempContext,{srfcounter:this.counter}); return;
} }
this.selection = {}; this.istLoadDefaultRefView = false;
Object.assign(this.selection, { view: { viewname: refview.viewname } }); this.viewState.next({ tag: 'treeexpbar_tree', action: 'filter', data: { srfnodefilter: this.srfnodefilter } });
Object.assign(this.selection,{'viewparam':tempViewparam,'context':tempContext}); }
this.calcToolbarItemState(false);
this.$forceUpdate(); /**
} * vue 声明周期
*
/** * @memberof @memberof F1TreeExpViewtreeexpbarBase
* 树加载完成 */
* public created() {
* @param {any[]} args this.afterCreated();
* @param {string} [tag] }
* @param {*} [$event2]
* @returns {void} /**
* @memberof F1TreeExpViewtreeexpbarBase * 执行created后的逻辑
*/ *
public treeexpbar_load(args: any[], tag?: string, $event2?: any): void { * @memberof F1TreeExpViewtreeexpbarBase
this.calcToolbarItemState(true); */
this.$emit('load',args); public afterCreated() {
} if (this.viewState) {
this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => {
/** if (!Object.is(tag, this.name)) {
* 执行搜索 return;
* }
* @memberof F1TreeExpViewtreeexpbarBase this.istLoadDefaultRefView = false;
*/ this.viewState.next({ tag: 'treeexpbar_tree', action: action, data: data });
public onSearch(): void { });
if (!this.viewState) { }
return; }
}
this.istLoadDefaultRefView = false; /**
this.viewState.next({ tag: 'treeexpbar_tree', action: 'filter', data: { srfnodefilter: this.srfnodefilter } }); * Vue声明周期(组件渲染完毕)
} *
* @memberof F1TreeExpViewtreeexpbarBase
/** */
* vue 声明周期 public mounted() {
* this.afterMounted();
* @memberof @memberof F1TreeExpViewtreeexpbarBase }
*/
public created() { /**
this.afterCreated(); * 执行mounted后的逻辑
} *
* @memberof F1TreeExpViewtreeexpbarBase
/** */
* 执行created后的逻辑 public afterMounted() { }
*
* @memberof F1TreeExpViewtreeexpbarBase
*/ /**
public afterCreated(){ * vue 生命周期
if (this.viewState) { *
this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => { * @memberof F1TreeExpViewtreeexpbarBase
if (!Object.is(tag, this.name)) { */
return; public destroyed() {
} this.afterDestroy();
this.istLoadDefaultRefView = false; }
this.viewState.next({ tag: 'treeexpbar_tree', action: action, data: data });
}); /**
} * 执行destroyed后的逻辑
} *
* @memberof F1TreeExpViewtreeexpbarBase
/** */
* Vue声明周期(组件渲染完毕) public afterDestroy() {
* if (this.viewStateEvent) {
* @memberof F1TreeExpViewtreeexpbarBase this.viewStateEvent.unsubscribe();
*/ }
public mounted() { }
this.afterMounted();
} /**
* 视图数据变化
/** *
* 执行mounted后的逻辑 * @param {*} $event
* * @memberof F1TreeExpViewtreeexpbarBase
* @memberof F1TreeExpViewtreeexpbarBase */
*/ public onViewDatasChange($event: any): void {
public afterMounted(){ this.$emit('selectionchange', $event);
if(this.$store.getters.getViewSplit(this.viewUID)){ }
this.split = this.$store.getters.getViewSplit(this.viewUID);
}else{ /**
let containerWidth:number = (document.getElementById("f1treeexpviewtreeexpbar") as any).offsetWidth; * 视图数据变化
if(this.ctrlWidth && containerWidth != 0){ *
this.split = this.ctrlWidth/containerWidth; * @param {*} $event
} * @memberof F1TreeExpViewtreeexpbarBase
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); */
} public onDrViewDatasChange($event: any): void {
} this.viewState.next({ tag: 'treeexpbar_tree', action: 'refresh_parent' });
}
/** /**
* vue 生命周期 * 视图数据被激活
* *
* @memberof F1TreeExpViewtreeexpbarBase * @param {*} $event
*/ * @memberof F1TreeExpViewtreeexpbarBase
public destroyed() { */
this.afterDestroy(); public viewDatasActivated($event: any): void {
} this.$emit('activated', $event);
}
/**
* 执行destroyed后的逻辑 /**
* * 视图数据加载完成
* @memberof F1TreeExpViewtreeexpbarBase *
*/ * @param {*} $event
public afterDestroy() { * @memberof F1TreeExpViewtreeexpbarBase
if (this.viewStateEvent) { */
this.viewStateEvent.unsubscribe(); public onViewLoad($event: any): void {
} this.$emit('load', $event);
} }
/** /**
* 视图数据变化 * 设置导航区工具栏禁用状态
* *
* @param {*} $event * @param {boolean} state
* @memberof F1TreeExpViewtreeexpbarBase * @return {*}
*/ * @memberof F1TreeExpViewtreeexpbarBase
public onViewDatasChange($event: any): void { */
this.$emit('selectionchange', $event); public calcToolbarItemState(state: boolean) {
} let _this: any = this;
const models:any = _this.f1treeexpviewtreeexpbar_toolbarModels;
/** if (models) {
* 视图数据变化 for (const key in models) {
* if (!models.hasOwnProperty(key)) {
* @param {*} $event return;
* @memberof F1TreeExpViewtreeexpbarBase }
*/ const _item = models[key];
public onDrViewDatasChange($event: any): void { if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
this.viewState.next({ tag: 'treeexpbar_tree', action: 'refresh_parent' }); _item.disabled = state;
} }
_item.visabled = true;
/** if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
* 视图数据被激活 _item.visabled = false;
* }
* @param {*} $event }
* @memberof F1TreeExpViewtreeexpbarBase this.calcNavigationToolbarState();
*/ }
public viewDatasActivated($event: any): void { }
this.$emit('activated', $event);
} /**
* 计算导航工具栏权限状态
/** *
* 视图数据加载完成 * @memberof F1TreeExpViewtreeexpbarBase
* */
* @param {*} $event public calcNavigationToolbarState(){
* @memberof F1TreeExpViewtreeexpbarBase let _this: any = this;
*/ // 界面行为
public onViewLoad($event: any): void { if(_this.f1treeexpviewtreeexpbar_toolbarModels){
this.$emit('load', $event); const curUIService:IBIZSample0003UIService = new IBIZSample0003UIService();
} ViewTool.calcActionItemAuthState({},_this.f1treeexpviewtreeexpbar_toolbarModels,curUIService);
}
/** }
* 设置导航区工具栏禁用状态
*
* @param {boolean} state
* @return {*}
* @memberof F1TreeExpViewtreeexpbarBase
*/
public calcToolbarItemState(state: boolean) {
let _this: any = this;
const models:any = _this.f1treeexpviewtreeexpbar_toolbarModels;
if (models) {
for (const key in models) {
if (!models.hasOwnProperty(key)) {
return;
}
const _item = models[key];
if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
_item.disabled = state;
}
_item.visabled = true;
if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
_item.visabled = false;
}
}
this.calcNavigationToolbarState();
}
}
/**
* 计算导航工具栏权限状态
*
* @memberof F1TreeExpViewtreeexpbarBase
*/
public calcNavigationToolbarState(){
let _this: any = this;
// 界面行为
if(_this.f1treeexpviewtreeexpbar_toolbarModels){
const curUIService:IBIZSample0003UIService = new IBIZSample0003UIService();
ViewTool.calcActionItemAuthState({},_this.f1treeexpviewtreeexpbar_toolbarModels,curUIService);
}
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './f1-tree-exp-viewtreeexpbar-treeexpbar.less'; @import './f1-tree-exp-viewtreeexpbar-treeexpbar.less';
</style> </style>
app_Web/src/widgets/ibizsample0003/f2-tree-exp-viewtreeexpbar-treeexpbar/f2-tree-exp-viewtreeexpbar-treeexpbar-base.vue
浏览文件 @ 94c1446b
<template> <template>
<split id="f2treeexpviewtreeexpbar" class='app-tree-exp-bar' v-model="split" mode="horizontal" @on-move-end="onSplitChange"> <div id="f2treeexpviewtreeexpbar" class='app-tree-exp-bar'>
<div slot='left'> <div class='tree-exp-bar-header'>
<div class='tree-exp-bar-header'> <div class="tree-exp-bar-title">
<div class="tree-exp-bar-title"> <icon type='ios-home-outline'/>{{ $t('app.treeExpBar.title') }}
<icon type='ios-home-outline'/>{{ $t('app.treeExpBar.title') }} </div>
</div> </div>
</div> <div class='tree-exp-content'>
<div class='tree-exp-content'>
<view_treeexpbar_tree <view_treeexpbar_tree
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
...@@ -24,25 +23,9 @@ ...@@ -24,25 +23,9 @@
@load="treeexpbar_tree_load($event)" @load="treeexpbar_tree_load($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_treeexpbar_tree> </view_treeexpbar_tree>
</div> </div>
</div> </div>
<div slot='right'> </template>
<component
v-if="selection.view && !Object.is(this.selection.view.viewname, '')"
:is="selection.view.viewname"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(selection.context)"
:viewparam="JSON.stringify(selection.viewparam)"
@viewdataschange="onViewDatasChange"
@drdatasaved="onDrViewDatasChange"
@drdatasremove="onDrViewDatasChange"
@viewdatasactivated="viewDatasActivated"
@viewload="onViewLoad">
</component>
</div>
</split>
</template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator';
import { CreateElement } from 'vue'; import { CreateElement } from 'vue';
...@@ -213,399 +196,359 @@ export default class F2TreeExpViewtreeexpbarBase extends Vue implements ControlI ...@@ -213,399 +196,359 @@ export default class F2TreeExpViewtreeexpbarBase extends Vue implements ControlI
} }
} }
/** /**
* 打开新建数据视图 * 打开新建数据视图
* *
* @type {any} * @type {any}
* @memberof F2TreeExpViewtreeexpbarBase * @memberof F2TreeExpViewtreeexpbarBase
*/ */
@Prop() public newdata: any; @Prop() public newdata: any;
/** /**
* 打开编辑数据视图 * 打开编辑数据视图
* *
* @type {any} * @type {any}
* @memberof F2TreeExpViewtreeexpbarBase * @memberof F2TreeExpViewtreeexpbarBase
*/ */
@Prop() public opendata: any; @Prop() public opendata: any;
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {boolean} * @type {boolean}
* @memberof F2TreeExpViewtreeexpbarBase * @memberof F2TreeExpViewtreeexpbarBase
*/ */
@Prop() public viewUID!:string; @Prop() public viewUID!:string;
/** /**
* 获取多项数据 * 获取多项数据
* *
* @returns {any[]} * @returns {any[]}
* @memberof F2TreeExpViewtreeexpbarBase * @memberof F2TreeExpViewtreeexpbarBase
*/ */
public getDatas(): any[] { public getDatas(): any[] {
return []; return [];
} }
/** /**
* 获取单项树 * 获取单项树
* *
* @returns {*} * @returns {*}
* @memberof F2TreeExpViewtreeexpbarBase * @memberof F2TreeExpViewtreeexpbarBase
*/ */
public getData(): any { public getData(): any {
return {}; return {};
} }
/** /**
* 选中数据 * 可搜索字段名称
* *
* @type {*} *
* @memberof F2TreeExpViewtreeexpbarBase * @type {(string)}
*/ * @memberof F2TreeExpViewtreeexpbarBase
public selection: any = {}; */
public placeholder = "名称";
/**
* 控件宽度 /**
* * 过滤值
* @type {number} *
* @memberof F2TreeExpViewtreeexpbarBase * @type {string}
*/ * @memberof F2TreeExpViewtreeexpbarBase
public ctrlWidth:number = 0; */
public srfnodefilter: string = '';
/**
* 可搜索字段名称 /**
* * 刷新标识
* *
* @type {(string)} * @public
* @memberof F2TreeExpViewtreeexpbarBase * @type {number}
*/ * @memberof F2TreeExpViewtreeexpbarBase
public placeholder="名称"; */
public counter:number = 0;
/**
* 过滤值 /**
* * 是否加载默认关联视图
* @type {string} *
* @memberof F2TreeExpViewtreeexpbarBase * @public
*/ * @type {boolean}
public srfnodefilter: string = ''; * @memberof F2TreeExpViewtreeexpbarBase
*/
/** public istLoadDefaultRefView: boolean = false;
* 刷新标识
* /**
* @public * 获取关系项视图
* @type {number} *
* @memberof F2TreeExpViewtreeexpbarBase * @param {*} [arg={}]
*/ * @returns {*}
public counter:number = 0; * @memberof F2TreeExpViewtreeexpbarBase
*/
/** public getExpItemView(arg: any = {}): any {
* 是否加载默认关联视图 let expmode = arg.nodetype.toUpperCase();
* if (!expmode) {
* @public expmode = '';
* @type {boolean} }
* @memberof F2TreeExpViewtreeexpbarBase if (Object.is(expmode, 'STATE')) {
*/ return {
public istLoadDefaultRefView: boolean = false; viewname: 'ibizorder-grid-view',
parentdata: {},
/** deKeyField:'ibizorder'
* 分割宽度 };
* }
* @type {number} return null;
* @memberof F2TreeExpViewtreeexpbarBase }
*/
public split: number = 0.2; /**
* 树导航选中
/** *
* split值变化事件 * @param {any []} args
* * @param {string} [tag]
* @memberof F2TreeExpViewtreeexpbarBase * @param {*} [$event2]
*/ * @returns {void}
public onSplitChange() { * @memberof F2TreeExpViewtreeexpbarBase
if(this.split){ */
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); public treeexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void {
} if (args.length === 0) {
} this.calcToolbarItemState(true);
return ;
/** }
* 获取关系项视图 const arg:any = args[0];
* if (!arg.id) {
* @param {*} [arg={}] this.calcToolbarItemState(true);
* @returns {*} return;
* @memberof F2TreeExpViewtreeexpbarBase }
*/ const nodetype = arg.id.split(';')[0];
public getExpItemView(arg: any = {}): any { const refview = this.getExpItemView({ nodetype: nodetype });
let expmode = arg.nodetype.toUpperCase(); if (!refview) {
if (!expmode) { this.calcToolbarItemState(true);
expmode = ''; return;
} }
if (Object.is(expmode, 'STATE')) { let tempViewparam:any = {};
return { let tempContext:any ={};
viewname: 'ibizorder-grid-view', if(arg && arg.navfilter){
parentdata: {}, this.counter += 1;
deKeyField:'ibizorder' Object.defineProperty(tempViewparam, arg.navfilter, {
}; value : arg.srfkey,
} writable : true,
return null; enumerable : true,
} configurable : true
})
/** Object.assign(tempContext,{srfcounter:this.counter});
* 树导航选中 }
* Object.assign(tempContext,JSON.parse(JSON.stringify(this.context)));
* @param {any []} args if(arg.srfappctx){
* @param {string} [tag] Object.assign(tempContext,JSON.parse(JSON.stringify(arg.srfappctx)));
* @param {*} [$event2] }
* @returns {void} // 计算导航上下文
* @memberof F2TreeExpViewtreeexpbarBase if(arg && arg.navigateContext && Object.keys(arg.navigateContext).length >0){
*/ let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{};
public treeexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void { Object.assign(tempData,arg);
if (args.length === 0) { let _context = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateContext);
this.calcToolbarItemState(true); Object.assign(tempContext,_context);
return ; }
} if(arg.srfparentdename){
const arg:any = args[0]; Object.assign(tempContext,{srfparentdename:arg.srfparentdename});
if (!arg.id) { }
this.calcToolbarItemState(true); if(arg.srfparentkey){
return; Object.assign(tempContext,{srfparentkey:arg.srfparentkey});
} }
const nodetype = arg.id.split(';')[0]; // 计算导航参数
const refview = this.getExpItemView({ nodetype: nodetype }); if(arg && arg.navigateParams && Object.keys(arg.navigateParams).length >0){
if (!refview) { let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{};
this.calcToolbarItemState(true); Object.assign(tempData,arg);
return; let _params = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateParams);
} Object.assign(tempViewparam,_params);
let tempViewparam:any = {}; this.counter += 1;
let tempContext:any ={}; Object.assign(tempContext,{srfcounter:this.counter});
if(arg && arg.navfilter){ }
this.counter += 1; const navItem: any = {
Object.defineProperty(tempViewparam, arg.navfilter, { navView: this.navViewName,
value : arg.srfkey, data: args,
writable : true, srfnavdata: {
enumerable : true, context: tempContext,
configurable : true viewparams: tempViewParam
}) }
Object.assign(tempContext,{srfcounter:this.counter}); }
} this.calcToolbarItemState(false);
Object.assign(tempContext,JSON.parse(JSON.stringify(this.context))); this.$emit('selectionchange', navItem);
if(arg.srfappctx){ }
Object.assign(tempContext,JSON.parse(JSON.stringify(arg.srfappctx)));
} /**
// 计算导航上下文 * 树加载完成
if(arg && arg.navigateContext && Object.keys(arg.navigateContext).length >0){ *
let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{}; * @param {any[]} args
Object.assign(tempData,arg); * @param {string} [tag]
let _context = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateContext); * @param {*} [$event2]
Object.assign(tempContext,_context); * @returns {void}
} * @memberof F2TreeExpViewtreeexpbarBase
if(arg.srfparentdename){ */
Object.assign(tempContext,{srfparentdename:arg.srfparentdename}); public treeexpbar_load(args: any[], tag?: string, $event2?: any): void {
} this.calcToolbarItemState(true);
if(arg.srfparentkey){ this.$emit('load',args);
Object.assign(tempContext,{srfparentkey:arg.srfparentkey}); }
}
// 计算导航参数 /**
if(arg && arg.navigateParams && Object.keys(arg.navigateParams).length >0){ * 执行搜索
let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{}; *
Object.assign(tempData,arg); * @memberof F2TreeExpViewtreeexpbarBase
let _params = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateParams); */
Object.assign(tempViewparam,_params); public onSearch(): void {
this.counter += 1; if (!this.viewState) {
Object.assign(tempContext,{srfcounter:this.counter}); return;
} }
this.selection = {}; this.istLoadDefaultRefView = false;
Object.assign(this.selection, { view: { viewname: refview.viewname } }); this.viewState.next({ tag: 'treeexpbar_tree', action: 'filter', data: { srfnodefilter: this.srfnodefilter } });
Object.assign(this.selection,{'viewparam':tempViewparam,'context':tempContext}); }
this.calcToolbarItemState(false);
this.$forceUpdate(); /**
} * vue 声明周期
*
/** * @memberof @memberof F2TreeExpViewtreeexpbarBase
* 树加载完成 */
* public created() {
* @param {any[]} args this.afterCreated();
* @param {string} [tag] }
* @param {*} [$event2]
* @returns {void} /**
* @memberof F2TreeExpViewtreeexpbarBase * 执行created后的逻辑
*/ *
public treeexpbar_load(args: any[], tag?: string, $event2?: any): void { * @memberof F2TreeExpViewtreeexpbarBase
this.calcToolbarItemState(true); */
this.$emit('load',args); public afterCreated() {
} if (this.viewState) {
this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => {
/** if (!Object.is(tag, this.name)) {
* 执行搜索 return;
* }
* @memberof F2TreeExpViewtreeexpbarBase this.istLoadDefaultRefView = false;
*/ this.viewState.next({ tag: 'treeexpbar_tree', action: action, data: data });
public onSearch(): void { });
if (!this.viewState) { }
return; }
}
this.istLoadDefaultRefView = false; /**
this.viewState.next({ tag: 'treeexpbar_tree', action: 'filter', data: { srfnodefilter: this.srfnodefilter } }); * Vue声明周期(组件渲染完毕)
} *
* @memberof F2TreeExpViewtreeexpbarBase
/** */
* vue 声明周期 public mounted() {
* this.afterMounted();
* @memberof @memberof F2TreeExpViewtreeexpbarBase }
*/
public created() { /**
this.afterCreated(); * 执行mounted后的逻辑
} *
* @memberof F2TreeExpViewtreeexpbarBase
/** */
* 执行created后的逻辑 public afterMounted() { }
*
* @memberof F2TreeExpViewtreeexpbarBase
*/ /**
public afterCreated(){ * vue 生命周期
if (this.viewState) { *
this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => { * @memberof F2TreeExpViewtreeexpbarBase
if (!Object.is(tag, this.name)) { */
return; public destroyed() {
} this.afterDestroy();
this.istLoadDefaultRefView = false; }
this.viewState.next({ tag: 'treeexpbar_tree', action: action, data: data });
}); /**
} * 执行destroyed后的逻辑
} *
* @memberof F2TreeExpViewtreeexpbarBase
/** */
* Vue声明周期(组件渲染完毕) public afterDestroy() {
* if (this.viewStateEvent) {
* @memberof F2TreeExpViewtreeexpbarBase this.viewStateEvent.unsubscribe();
*/ }
public mounted() { }
this.afterMounted();
} /**
* 视图数据变化
/** *
* 执行mounted后的逻辑 * @param {*} $event
* * @memberof F2TreeExpViewtreeexpbarBase
* @memberof F2TreeExpViewtreeexpbarBase */
*/ public onViewDatasChange($event: any): void {
public afterMounted(){ this.$emit('selectionchange', $event);
if(this.$store.getters.getViewSplit(this.viewUID)){ }
this.split = this.$store.getters.getViewSplit(this.viewUID);
}else{ /**
let containerWidth:number = (document.getElementById("f2treeexpviewtreeexpbar") as any).offsetWidth; * 视图数据变化
if(this.ctrlWidth && containerWidth != 0){ *
this.split = this.ctrlWidth/containerWidth; * @param {*} $event
} * @memberof F2TreeExpViewtreeexpbarBase
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); */
} public onDrViewDatasChange($event: any): void {
} this.viewState.next({ tag: 'treeexpbar_tree', action: 'refresh_parent' });
}
/** /**
* vue 生命周期 * 视图数据被激活
* *
* @memberof F2TreeExpViewtreeexpbarBase * @param {*} $event
*/ * @memberof F2TreeExpViewtreeexpbarBase
public destroyed() { */
this.afterDestroy(); public viewDatasActivated($event: any): void {
} this.$emit('activated', $event);
}
/**
* 执行destroyed后的逻辑 /**
* * 视图数据加载完成
* @memberof F2TreeExpViewtreeexpbarBase *
*/ * @param {*} $event
public afterDestroy() { * @memberof F2TreeExpViewtreeexpbarBase
if (this.viewStateEvent) { */
this.viewStateEvent.unsubscribe(); public onViewLoad($event: any): void {
} this.$emit('load', $event);
} }
/** /**
* 视图数据变化 * 设置导航区工具栏禁用状态
* *
* @param {*} $event * @param {boolean} state
* @memberof F2TreeExpViewtreeexpbarBase * @return {*}
*/ * @memberof F2TreeExpViewtreeexpbarBase
public onViewDatasChange($event: any): void { */
this.$emit('selectionchange', $event); public calcToolbarItemState(state: boolean) {
} let _this: any = this;
const models:any = _this.f2treeexpviewtreeexpbar_toolbarModels;
/** if (models) {
* 视图数据变化 for (const key in models) {
* if (!models.hasOwnProperty(key)) {
* @param {*} $event return;
* @memberof F2TreeExpViewtreeexpbarBase }
*/ const _item = models[key];
public onDrViewDatasChange($event: any): void { if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
this.viewState.next({ tag: 'treeexpbar_tree', action: 'refresh_parent' }); _item.disabled = state;
} }
_item.visabled = true;
/** if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
* 视图数据被激活 _item.visabled = false;
* }
* @param {*} $event }
* @memberof F2TreeExpViewtreeexpbarBase this.calcNavigationToolbarState();
*/ }
public viewDatasActivated($event: any): void { }
this.$emit('activated', $event);
} /**
* 计算导航工具栏权限状态
/** *
* 视图数据加载完成 * @memberof F2TreeExpViewtreeexpbarBase
* */
* @param {*} $event public calcNavigationToolbarState(){
* @memberof F2TreeExpViewtreeexpbarBase let _this: any = this;
*/ // 界面行为
public onViewLoad($event: any): void { if(_this.f2treeexpviewtreeexpbar_toolbarModels){
this.$emit('load', $event); const curUIService:IBIZSample0003UIService = new IBIZSample0003UIService();
} ViewTool.calcActionItemAuthState({},_this.f2treeexpviewtreeexpbar_toolbarModels,curUIService);
}
/** }
* 设置导航区工具栏禁用状态
*
* @param {boolean} state
* @return {*}
* @memberof F2TreeExpViewtreeexpbarBase
*/
public calcToolbarItemState(state: boolean) {
let _this: any = this;
const models:any = _this.f2treeexpviewtreeexpbar_toolbarModels;
if (models) {
for (const key in models) {
if (!models.hasOwnProperty(key)) {
return;
}
const _item = models[key];
if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
_item.disabled = state;
}
_item.visabled = true;
if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
_item.visabled = false;
}
}
this.calcNavigationToolbarState();
}
}
/**
* 计算导航工具栏权限状态
*
* @memberof F2TreeExpViewtreeexpbarBase
*/
public calcNavigationToolbarState(){
let _this: any = this;
// 界面行为
if(_this.f2treeexpviewtreeexpbar_toolbarModels){
const curUIService:IBIZSample0003UIService = new IBIZSample0003UIService();
ViewTool.calcActionItemAuthState({},_this.f2treeexpviewtreeexpbar_toolbarModels,curUIService);
}
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './f2-tree-exp-viewtreeexpbar-treeexpbar.less'; @import './f2-tree-exp-viewtreeexpbar-treeexpbar.less';
</style> </style>
app_Web/src/widgets/ibizsample0003/f3-tree-exp-viewtreeexpbar-treeexpbar/f3-tree-exp-viewtreeexpbar-treeexpbar-base.vue
浏览文件 @ 94c1446b
<template> <template>
<split id="f3treeexpviewtreeexpbar" class='app-tree-exp-bar' v-model="split" mode="horizontal" @on-move-end="onSplitChange"> <div id="f3treeexpviewtreeexpbar" class='app-tree-exp-bar'>
<div slot='left'> <div class='tree-exp-bar-header'>
<div class='tree-exp-bar-header'> <div class="tree-exp-bar-title">
<div class="tree-exp-bar-title"> <icon type='ios-home-outline'/>{{ $t('app.treeExpBar.title') }}
<icon type='ios-home-outline'/>{{ $t('app.treeExpBar.title') }} </div>
</div> </div>
</div> <div class='tree-exp-content'>
<div class='tree-exp-content'>
<view_treeexpbar_tree <view_treeexpbar_tree
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
...@@ -24,25 +23,9 @@ ...@@ -24,25 +23,9 @@
@load="treeexpbar_tree_load($event)" @load="treeexpbar_tree_load($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_treeexpbar_tree> </view_treeexpbar_tree>
</div> </div>
</div> </div>
<div slot='right'> </template>
<component
v-if="selection.view && !Object.is(this.selection.view.viewname, '')"
:is="selection.view.viewname"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(selection.context)"
:viewparam="JSON.stringify(selection.viewparam)"
@viewdataschange="onViewDatasChange"
@drdatasaved="onDrViewDatasChange"
@drdatasremove="onDrViewDatasChange"
@viewdatasactivated="viewDatasActivated"
@viewload="onViewLoad">
</component>
</div>
</split>
</template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator';
import { CreateElement } from 'vue'; import { CreateElement } from 'vue';
...@@ -204,406 +187,366 @@ export default class F3TreeExpViewtreeexpbarBase extends Vue implements ControlI ...@@ -204,406 +187,366 @@ export default class F3TreeExpViewtreeexpbarBase extends Vue implements ControlI
} }
} }
/** /**
* 打开新建数据视图 * 打开新建数据视图
* *
* @type {any} * @type {any}
* @memberof F3TreeExpViewtreeexpbarBase * @memberof F3TreeExpViewtreeexpbarBase
*/ */
@Prop() public newdata: any; @Prop() public newdata: any;
/** /**
* 打开编辑数据视图 * 打开编辑数据视图
* *
* @type {any} * @type {any}
* @memberof F3TreeExpViewtreeexpbarBase * @memberof F3TreeExpViewtreeexpbarBase
*/ */
@Prop() public opendata: any; @Prop() public opendata: any;
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {boolean} * @type {boolean}
* @memberof F3TreeExpViewtreeexpbarBase * @memberof F3TreeExpViewtreeexpbarBase
*/ */
@Prop() public viewUID!:string; @Prop() public viewUID!:string;
/** /**
* 获取多项数据 * 获取多项数据
* *
* @returns {any[]} * @returns {any[]}
* @memberof F3TreeExpViewtreeexpbarBase * @memberof F3TreeExpViewtreeexpbarBase
*/ */
public getDatas(): any[] { public getDatas(): any[] {
return []; return [];
} }
/** /**
* 获取单项树 * 获取单项树
* *
* @returns {*} * @returns {*}
* @memberof F3TreeExpViewtreeexpbarBase * @memberof F3TreeExpViewtreeexpbarBase
*/ */
public getData(): any { public getData(): any {
return {}; return {};
} }
/** /**
* 选中数据 * 可搜索字段名称
* *
* @type {*} *
* @memberof F3TreeExpViewtreeexpbarBase * @type {(string)}
*/ * @memberof F3TreeExpViewtreeexpbarBase
public selection: any = {}; */
public placeholder = "名称";
/**
* 控件宽度 /**
* * 过滤值
* @type {number} *
* @memberof F3TreeExpViewtreeexpbarBase * @type {string}
*/ * @memberof F3TreeExpViewtreeexpbarBase
public ctrlWidth:number = 0; */
public srfnodefilter: string = '';
/**
* 可搜索字段名称 /**
* * 刷新标识
* *
* @type {(string)} * @public
* @memberof F3TreeExpViewtreeexpbarBase * @type {number}
*/ * @memberof F3TreeExpViewtreeexpbarBase
public placeholder="名称"; */
public counter:number = 0;
/**
* 过滤值 /**
* * 是否加载默认关联视图
* @type {string} *
* @memberof F3TreeExpViewtreeexpbarBase * @public
*/ * @type {boolean}
public srfnodefilter: string = ''; * @memberof F3TreeExpViewtreeexpbarBase
*/
/** public istLoadDefaultRefView: boolean = false;
* 刷新标识
* /**
* @public * 获取关系项视图
* @type {number} *
* @memberof F3TreeExpViewtreeexpbarBase * @param {*} [arg={}]
*/ * @returns {*}
public counter:number = 0; * @memberof F3TreeExpViewtreeexpbarBase
*/
/** public getExpItemView(arg: any = {}): any {
* 是否加载默认关联视图 let expmode = arg.nodetype.toUpperCase();
* if (!expmode) {
* @public expmode = '';
* @type {boolean} }
* @memberof F3TreeExpViewtreeexpbarBase if (Object.is(expmode, 'CURDATA')) {
*/ return {
public istLoadDefaultRefView: boolean = false; viewname: 'ibizsample0003-grid-view',
parentdata: {"srfparentkey":"%NODEID%","srfparenttype":"DER1N","srfder1nid":"DER1N_IBIZSAMPLE0003_IBIZSAMPLE0003_PIBIZSAMPLE0003ID","n_pibizsample0003id_eq":"%NODEID%"},
/** deKeyField:'ibizsample0003'
* 分割宽度 };
* }
* @type {number} if (Object.is(expmode, 'TOPDATA')) {
* @memberof F3TreeExpViewtreeexpbarBase return {
*/ viewname: 'ibizsample0003-grid-view',
public split: number = 0.2; parentdata: {"srfparentkey":"%NODEID%","srfparenttype":"DER1N","srfder1nid":"DER1N_IBIZSAMPLE0003_IBIZSAMPLE0003_PIBIZSAMPLE0003ID","n_pibizsample0003id_eq":"%NODEID%"},
deKeyField:'ibizsample0003'
/** };
* split值变化事件 }
* return null;
* @memberof F3TreeExpViewtreeexpbarBase }
*/
public onSplitChange() { /**
if(this.split){ * 树导航选中
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); *
} * @param {any []} args
} * @param {string} [tag]
* @param {*} [$event2]
/** * @returns {void}
* 获取关系项视图 * @memberof F3TreeExpViewtreeexpbarBase
* */
* @param {*} [arg={}] public treeexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void {
* @returns {*} if (args.length === 0) {
* @memberof F3TreeExpViewtreeexpbarBase this.calcToolbarItemState(true);
*/ return ;
public getExpItemView(arg: any = {}): any { }
let expmode = arg.nodetype.toUpperCase(); const arg:any = args[0];
if (!expmode) { if (!arg.id) {
expmode = ''; this.calcToolbarItemState(true);
} return;
if (Object.is(expmode, 'CURDATA')) { }
return { const nodetype = arg.id.split(';')[0];
viewname: 'ibizsample0003-grid-view', const refview = this.getExpItemView({ nodetype: nodetype });
parentdata: {"srfparentkey":"%NODEID%","srfparenttype":"DER1N","srfder1nid":"DER1N_IBIZSAMPLE0003_IBIZSAMPLE0003_PIBIZSAMPLE0003ID","n_pibizsample0003id_eq":"%NODEID%"}, if (!refview) {
deKeyField:'ibizsample0003' this.calcToolbarItemState(true);
}; return;
} }
if (Object.is(expmode, 'TOPDATA')) { let tempViewparam:any = {};
return { let tempContext:any ={};
viewname: 'ibizsample0003-grid-view', if(arg && arg.navfilter){
parentdata: {"srfparentkey":"%NODEID%","srfparenttype":"DER1N","srfder1nid":"DER1N_IBIZSAMPLE0003_IBIZSAMPLE0003_PIBIZSAMPLE0003ID","n_pibizsample0003id_eq":"%NODEID%"}, this.counter += 1;
deKeyField:'ibizsample0003' Object.defineProperty(tempViewparam, arg.navfilter, {
}; value : arg.srfkey,
} writable : true,
return null; enumerable : true,
} configurable : true
})
/** Object.assign(tempContext,{srfcounter:this.counter});
* 树导航选中 }
* Object.assign(tempContext,JSON.parse(JSON.stringify(this.context)));
* @param {any []} args if(arg.srfappctx){
* @param {string} [tag] Object.assign(tempContext,JSON.parse(JSON.stringify(arg.srfappctx)));
* @param {*} [$event2] }
* @returns {void} // 计算导航上下文
* @memberof F3TreeExpViewtreeexpbarBase if(arg && arg.navigateContext && Object.keys(arg.navigateContext).length >0){
*/ let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{};
public treeexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void { Object.assign(tempData,arg);
if (args.length === 0) { let _context = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateContext);
this.calcToolbarItemState(true); Object.assign(tempContext,_context);
return ; }
} if(arg.srfparentdename){
const arg:any = args[0]; Object.assign(tempContext,{srfparentdename:arg.srfparentdename});
if (!arg.id) { }
this.calcToolbarItemState(true); if(arg.srfparentkey){
return; Object.assign(tempContext,{srfparentkey:arg.srfparentkey});
} }
const nodetype = arg.id.split(';')[0]; // 计算导航参数
const refview = this.getExpItemView({ nodetype: nodetype }); if(arg && arg.navigateParams && Object.keys(arg.navigateParams).length >0){
if (!refview) { let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{};
this.calcToolbarItemState(true); Object.assign(tempData,arg);
return; let _params = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateParams);
} Object.assign(tempViewparam,_params);
let tempViewparam:any = {}; this.counter += 1;
let tempContext:any ={}; Object.assign(tempContext,{srfcounter:this.counter});
if(arg && arg.navfilter){ }
this.counter += 1; const navItem: any = {
Object.defineProperty(tempViewparam, arg.navfilter, { navView: this.navViewName,
value : arg.srfkey, data: args,
writable : true, srfnavdata: {
enumerable : true, context: tempContext,
configurable : true viewparams: tempViewParam
}) }
Object.assign(tempContext,{srfcounter:this.counter}); }
} this.calcToolbarItemState(false);
Object.assign(tempContext,JSON.parse(JSON.stringify(this.context))); this.$emit('selectionchange', navItem);
if(arg.srfappctx){ }
Object.assign(tempContext,JSON.parse(JSON.stringify(arg.srfappctx)));
} /**
// 计算导航上下文 * 树加载完成
if(arg && arg.navigateContext && Object.keys(arg.navigateContext).length >0){ *
let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{}; * @param {any[]} args
Object.assign(tempData,arg); * @param {string} [tag]
let _context = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateContext); * @param {*} [$event2]
Object.assign(tempContext,_context); * @returns {void}
} * @memberof F3TreeExpViewtreeexpbarBase
if(arg.srfparentdename){ */
Object.assign(tempContext,{srfparentdename:arg.srfparentdename}); public treeexpbar_load(args: any[], tag?: string, $event2?: any): void {
} this.calcToolbarItemState(true);
if(arg.srfparentkey){ this.$emit('load',args);
Object.assign(tempContext,{srfparentkey:arg.srfparentkey}); }
}
// 计算导航参数 /**
if(arg && arg.navigateParams && Object.keys(arg.navigateParams).length >0){ * 执行搜索
let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{}; *
Object.assign(tempData,arg); * @memberof F3TreeExpViewtreeexpbarBase
let _params = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateParams); */
Object.assign(tempViewparam,_params); public onSearch(): void {
this.counter += 1; if (!this.viewState) {
Object.assign(tempContext,{srfcounter:this.counter}); return;
} }
this.selection = {}; this.istLoadDefaultRefView = false;
Object.assign(this.selection, { view: { viewname: refview.viewname } }); this.viewState.next({ tag: 'treeexpbar_tree', action: 'filter', data: { srfnodefilter: this.srfnodefilter } });
Object.assign(this.selection,{'viewparam':tempViewparam,'context':tempContext}); }
this.calcToolbarItemState(false);
this.$forceUpdate(); /**
} * vue 声明周期
*
/** * @memberof @memberof F3TreeExpViewtreeexpbarBase
* 树加载完成 */
* public created() {
* @param {any[]} args this.afterCreated();
* @param {string} [tag] }
* @param {*} [$event2]
* @returns {void} /**
* @memberof F3TreeExpViewtreeexpbarBase * 执行created后的逻辑
*/ *
public treeexpbar_load(args: any[], tag?: string, $event2?: any): void { * @memberof F3TreeExpViewtreeexpbarBase
this.calcToolbarItemState(true); */
this.$emit('load',args); public afterCreated() {
} if (this.viewState) {
this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => {
/** if (!Object.is(tag, this.name)) {
* 执行搜索 return;
* }
* @memberof F3TreeExpViewtreeexpbarBase this.istLoadDefaultRefView = false;
*/ this.viewState.next({ tag: 'treeexpbar_tree', action: action, data: data });
public onSearch(): void { });
if (!this.viewState) { }
return; }
}
this.istLoadDefaultRefView = false; /**
this.viewState.next({ tag: 'treeexpbar_tree', action: 'filter', data: { srfnodefilter: this.srfnodefilter } }); * Vue声明周期(组件渲染完毕)
} *
* @memberof F3TreeExpViewtreeexpbarBase
/** */
* vue 声明周期 public mounted() {
* this.afterMounted();
* @memberof @memberof F3TreeExpViewtreeexpbarBase }
*/
public created() { /**
this.afterCreated(); * 执行mounted后的逻辑
} *
* @memberof F3TreeExpViewtreeexpbarBase
/** */
* 执行created后的逻辑 public afterMounted() { }
*
* @memberof F3TreeExpViewtreeexpbarBase
*/ /**
public afterCreated(){ * vue 生命周期
if (this.viewState) { *
this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => { * @memberof F3TreeExpViewtreeexpbarBase
if (!Object.is(tag, this.name)) { */
return; public destroyed() {
} this.afterDestroy();
this.istLoadDefaultRefView = false; }
this.viewState.next({ tag: 'treeexpbar_tree', action: action, data: data });
}); /**
} * 执行destroyed后的逻辑
} *
* @memberof F3TreeExpViewtreeexpbarBase
/** */
* Vue声明周期(组件渲染完毕) public afterDestroy() {
* if (this.viewStateEvent) {
* @memberof F3TreeExpViewtreeexpbarBase this.viewStateEvent.unsubscribe();
*/ }
public mounted() { }
this.afterMounted();
} /**
* 视图数据变化
/** *
* 执行mounted后的逻辑 * @param {*} $event
* * @memberof F3TreeExpViewtreeexpbarBase
* @memberof F3TreeExpViewtreeexpbarBase */
*/ public onViewDatasChange($event: any): void {
public afterMounted(){ this.$emit('selectionchange', $event);
if(this.$store.getters.getViewSplit(this.viewUID)){ }
this.split = this.$store.getters.getViewSplit(this.viewUID);
}else{ /**
let containerWidth:number = (document.getElementById("f3treeexpviewtreeexpbar") as any).offsetWidth; * 视图数据变化
if(this.ctrlWidth && containerWidth != 0){ *
this.split = this.ctrlWidth/containerWidth; * @param {*} $event
} * @memberof F3TreeExpViewtreeexpbarBase
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); */
} public onDrViewDatasChange($event: any): void {
} this.viewState.next({ tag: 'treeexpbar_tree', action: 'refresh_parent' });
}
/** /**
* vue 生命周期 * 视图数据被激活
* *
* @memberof F3TreeExpViewtreeexpbarBase * @param {*} $event
*/ * @memberof F3TreeExpViewtreeexpbarBase
public destroyed() { */
this.afterDestroy(); public viewDatasActivated($event: any): void {
} this.$emit('activated', $event);
}
/**
* 执行destroyed后的逻辑 /**
* * 视图数据加载完成
* @memberof F3TreeExpViewtreeexpbarBase *
*/ * @param {*} $event
public afterDestroy() { * @memberof F3TreeExpViewtreeexpbarBase
if (this.viewStateEvent) { */
this.viewStateEvent.unsubscribe(); public onViewLoad($event: any): void {
} this.$emit('load', $event);
} }
/** /**
* 视图数据变化 * 设置导航区工具栏禁用状态
* *
* @param {*} $event * @param {boolean} state
* @memberof F3TreeExpViewtreeexpbarBase * @return {*}
*/ * @memberof F3TreeExpViewtreeexpbarBase
public onViewDatasChange($event: any): void { */
this.$emit('selectionchange', $event); public calcToolbarItemState(state: boolean) {
} let _this: any = this;
const models:any = _this.f3treeexpviewtreeexpbar_toolbarModels;
/** if (models) {
* 视图数据变化 for (const key in models) {
* if (!models.hasOwnProperty(key)) {
* @param {*} $event return;
* @memberof F3TreeExpViewtreeexpbarBase }
*/ const _item = models[key];
public onDrViewDatasChange($event: any): void { if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
this.viewState.next({ tag: 'treeexpbar_tree', action: 'refresh_parent' }); _item.disabled = state;
} }
_item.visabled = true;
/** if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
* 视图数据被激活 _item.visabled = false;
* }
* @param {*} $event }
* @memberof F3TreeExpViewtreeexpbarBase this.calcNavigationToolbarState();
*/ }
public viewDatasActivated($event: any): void { }
this.$emit('activated', $event);
} /**
* 计算导航工具栏权限状态
/** *
* 视图数据加载完成 * @memberof F3TreeExpViewtreeexpbarBase
* */
* @param {*} $event public calcNavigationToolbarState(){
* @memberof F3TreeExpViewtreeexpbarBase let _this: any = this;
*/ // 界面行为
public onViewLoad($event: any): void { if(_this.f3treeexpviewtreeexpbar_toolbarModels){
this.$emit('load', $event); const curUIService:IBIZSample0003UIService = new IBIZSample0003UIService();
} ViewTool.calcActionItemAuthState({},_this.f3treeexpviewtreeexpbar_toolbarModels,curUIService);
}
/** }
* 设置导航区工具栏禁用状态
*
* @param {boolean} state
* @return {*}
* @memberof F3TreeExpViewtreeexpbarBase
*/
public calcToolbarItemState(state: boolean) {
let _this: any = this;
const models:any = _this.f3treeexpviewtreeexpbar_toolbarModels;
if (models) {
for (const key in models) {
if (!models.hasOwnProperty(key)) {
return;
}
const _item = models[key];
if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
_item.disabled = state;
}
_item.visabled = true;
if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
_item.visabled = false;
}
}
this.calcNavigationToolbarState();
}
}
/**
* 计算导航工具栏权限状态
*
* @memberof F3TreeExpViewtreeexpbarBase
*/
public calcNavigationToolbarState(){
let _this: any = this;
// 界面行为
if(_this.f3treeexpviewtreeexpbar_toolbarModels){
const curUIService:IBIZSample0003UIService = new IBIZSample0003UIService();
ViewTool.calcActionItemAuthState({},_this.f3treeexpviewtreeexpbar_toolbarModels,curUIService);
}
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './f3-tree-exp-viewtreeexpbar-treeexpbar.less'; @import './f3-tree-exp-viewtreeexpbar-treeexpbar.less';
</style> </style>
app_Web/src/widgets/ibizsample0003/f4-tree-exp-viewtreeexpbar-treeexpbar/f4-tree-exp-viewtreeexpbar-treeexpbar-base.vue
浏览文件 @ 94c1446b
<template> <template>
<split id="f4treeexpviewtreeexpbar" class='app-tree-exp-bar' v-model="split" mode="horizontal" @on-move-end="onSplitChange"> <div id="f4treeexpviewtreeexpbar" class='app-tree-exp-bar'>
<div slot='left'> <div class='tree-exp-bar-header'>
<div class='tree-exp-bar-header'> <div class="tree-exp-bar-title">
<div class="tree-exp-bar-title"> <icon type='ios-home-outline'/>{{ $t('app.treeExpBar.title') }}
<icon type='ios-home-outline'/>{{ $t('app.treeExpBar.title') }} </div>
</div> </div>
</div> <div class='tree-exp-content'>
<div class='tree-exp-content'>
<view_treeexpbar_tree <view_treeexpbar_tree
:viewState="viewState" :viewState="viewState"
:viewparams="viewparams" :viewparams="viewparams"
...@@ -24,25 +23,9 @@ ...@@ -24,25 +23,9 @@
@load="treeexpbar_tree_load($event)" @load="treeexpbar_tree_load($event)"
@closeview="closeView($event)"> @closeview="closeView($event)">
</view_treeexpbar_tree> </view_treeexpbar_tree>
</div> </div>
</div> </div>
<div slot='right'> </template>
<component
v-if="selection.view && !Object.is(this.selection.view.viewname, '')"
:is="selection.view.viewname"
class="viewcontainer2"
:viewDefaultUsage="false"
:viewdata="JSON.stringify(selection.context)"
:viewparam="JSON.stringify(selection.viewparam)"
@viewdataschange="onViewDatasChange"
@drdatasaved="onDrViewDatasChange"
@drdatasremove="onDrViewDatasChange"
@viewdatasactivated="viewDatasActivated"
@viewload="onViewLoad">
</component>
</div>
</split>
</template>
<script lang='tsx'> <script lang='tsx'>
import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator'; import { Vue, Component, Prop, Provide, Emit, Watch, Model,Inject } from 'vue-property-decorator';
import { CreateElement } from 'vue'; import { CreateElement } from 'vue';
...@@ -204,406 +187,366 @@ export default class F4TreeExpViewtreeexpbarBase extends Vue implements ControlI ...@@ -204,406 +187,366 @@ export default class F4TreeExpViewtreeexpbarBase extends Vue implements ControlI
} }
} }
/** /**
* 打开新建数据视图 * 打开新建数据视图
* *
* @type {any} * @type {any}
* @memberof F4TreeExpViewtreeexpbarBase * @memberof F4TreeExpViewtreeexpbarBase
*/ */
@Prop() public newdata: any; @Prop() public newdata: any;
/** /**
* 打开编辑数据视图 * 打开编辑数据视图
* *
* @type {any} * @type {any}
* @memberof F4TreeExpViewtreeexpbarBase * @memberof F4TreeExpViewtreeexpbarBase
*/ */
@Prop() public opendata: any; @Prop() public opendata: any;
/** /**
* 视图唯一标识 * 视图唯一标识
* *
* @type {boolean} * @type {boolean}
* @memberof F4TreeExpViewtreeexpbarBase * @memberof F4TreeExpViewtreeexpbarBase
*/ */
@Prop() public viewUID!:string; @Prop() public viewUID!:string;
/** /**
* 获取多项数据 * 获取多项数据
* *
* @returns {any[]} * @returns {any[]}
* @memberof F4TreeExpViewtreeexpbarBase * @memberof F4TreeExpViewtreeexpbarBase
*/ */
public getDatas(): any[] { public getDatas(): any[] {
return []; return [];
} }
/** /**
* 获取单项树 * 获取单项树
* *
* @returns {*} * @returns {*}
* @memberof F4TreeExpViewtreeexpbarBase * @memberof F4TreeExpViewtreeexpbarBase
*/ */
public getData(): any { public getData(): any {
return {}; return {};
} }
/** /**
* 选中数据 * 可搜索字段名称
* *
* @type {*} *
* @memberof F4TreeExpViewtreeexpbarBase * @type {(string)}
*/ * @memberof F4TreeExpViewtreeexpbarBase
public selection: any = {}; */
public placeholder = "名称";
/**
* 控件宽度 /**
* * 过滤值
* @type {number} *
* @memberof F4TreeExpViewtreeexpbarBase * @type {string}
*/ * @memberof F4TreeExpViewtreeexpbarBase
public ctrlWidth:number = 0; */
public srfnodefilter: string = '';
/**
* 可搜索字段名称 /**
* * 刷新标识
* *
* @type {(string)} * @public
* @memberof F4TreeExpViewtreeexpbarBase * @type {number}
*/ * @memberof F4TreeExpViewtreeexpbarBase
public placeholder="名称"; */
public counter:number = 0;
/**
* 过滤值 /**
* * 是否加载默认关联视图
* @type {string} *
* @memberof F4TreeExpViewtreeexpbarBase * @public
*/ * @type {boolean}
public srfnodefilter: string = ''; * @memberof F4TreeExpViewtreeexpbarBase
*/
/** public istLoadDefaultRefView: boolean = false;
* 刷新标识
* /**
* @public * 获取关系项视图
* @type {number} *
* @memberof F4TreeExpViewtreeexpbarBase * @param {*} [arg={}]
*/ * @returns {*}
public counter:number = 0; * @memberof F4TreeExpViewtreeexpbarBase
*/
/** public getExpItemView(arg: any = {}): any {
* 是否加载默认关联视图 let expmode = arg.nodetype.toUpperCase();
* if (!expmode) {
* @public expmode = '';
* @type {boolean} }
* @memberof F4TreeExpViewtreeexpbarBase if (Object.is(expmode, 'TOPDATA')) {
*/ return {
public istLoadDefaultRefView: boolean = false; viewname: 'ibizsample0003-grid-view',
parentdata: {},
/** deKeyField:'ibizsample0003'
* 分割宽度 };
* }
* @type {number} if (Object.is(expmode, 'CURDATA')) {
* @memberof F4TreeExpViewtreeexpbarBase return {
*/ viewname: 'ibizsample0003-grid-view',
public split: number = 0.2; parentdata: {},
deKeyField:'ibizsample0003'
/** };
* split值变化事件 }
* return null;
* @memberof F4TreeExpViewtreeexpbarBase }
*/
public onSplitChange() { /**
if(this.split){ * 树导航选中
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); *
} * @param {any []} args
} * @param {string} [tag]
* @param {*} [$event2]
/** * @returns {void}
* 获取关系项视图 * @memberof F4TreeExpViewtreeexpbarBase
* */
* @param {*} [arg={}] public treeexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void {
* @returns {*} if (args.length === 0) {
* @memberof F4TreeExpViewtreeexpbarBase this.calcToolbarItemState(true);
*/ return ;
public getExpItemView(arg: any = {}): any { }
let expmode = arg.nodetype.toUpperCase(); const arg:any = args[0];
if (!expmode) { if (!arg.id) {
expmode = ''; this.calcToolbarItemState(true);
} return;
if (Object.is(expmode, 'TOPDATA')) { }
return { const nodetype = arg.id.split(';')[0];
viewname: 'ibizsample0003-grid-view', const refview = this.getExpItemView({ nodetype: nodetype });
parentdata: {}, if (!refview) {
deKeyField:'ibizsample0003' this.calcToolbarItemState(true);
}; return;
} }
if (Object.is(expmode, 'CURDATA')) { let tempViewparam:any = {};
return { let tempContext:any ={};
viewname: 'ibizsample0003-grid-view', if(arg && arg.navfilter){
parentdata: {}, this.counter += 1;
deKeyField:'ibizsample0003' Object.defineProperty(tempViewparam, arg.navfilter, {
}; value : arg.srfkey,
} writable : true,
return null; enumerable : true,
} configurable : true
})
/** Object.assign(tempContext,{srfcounter:this.counter});
* 树导航选中 }
* Object.assign(tempContext,JSON.parse(JSON.stringify(this.context)));
* @param {any []} args if(arg.srfappctx){
* @param {string} [tag] Object.assign(tempContext,JSON.parse(JSON.stringify(arg.srfappctx)));
* @param {*} [$event2] }
* @returns {void} // 计算导航上下文
* @memberof F4TreeExpViewtreeexpbarBase if(arg && arg.navigateContext && Object.keys(arg.navigateContext).length >0){
*/ let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{};
public treeexpbar_selectionchange(args: any [], tag?: string, $event2?: any): void { Object.assign(tempData,arg);
if (args.length === 0) { let _context = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateContext);
this.calcToolbarItemState(true); Object.assign(tempContext,_context);
return ; }
} if(arg.srfparentdename){
const arg:any = args[0]; Object.assign(tempContext,{srfparentdename:arg.srfparentdename});
if (!arg.id) { }
this.calcToolbarItemState(true); if(arg.srfparentkey){
return; Object.assign(tempContext,{srfparentkey:arg.srfparentkey});
} }
const nodetype = arg.id.split(';')[0]; // 计算导航参数
const refview = this.getExpItemView({ nodetype: nodetype }); if(arg && arg.navigateParams && Object.keys(arg.navigateParams).length >0){
if (!refview) { let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{};
this.calcToolbarItemState(true); Object.assign(tempData,arg);
return; let _params = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateParams);
} Object.assign(tempViewparam,_params);
let tempViewparam:any = {}; this.counter += 1;
let tempContext:any ={}; Object.assign(tempContext,{srfcounter:this.counter});
if(arg && arg.navfilter){ }
this.counter += 1; const navItem: any = {
Object.defineProperty(tempViewparam, arg.navfilter, { navView: this.navViewName,
value : arg.srfkey, data: args,
writable : true, srfnavdata: {
enumerable : true, context: tempContext,
configurable : true viewparams: tempViewParam
}) }
Object.assign(tempContext,{srfcounter:this.counter}); }
} this.calcToolbarItemState(false);
Object.assign(tempContext,JSON.parse(JSON.stringify(this.context))); this.$emit('selectionchange', navItem);
if(arg.srfappctx){ }
Object.assign(tempContext,JSON.parse(JSON.stringify(arg.srfappctx)));
} /**
// 计算导航上下文 * 树加载完成
if(arg && arg.navigateContext && Object.keys(arg.navigateContext).length >0){ *
let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{}; * @param {any[]} args
Object.assign(tempData,arg); * @param {string} [tag]
let _context = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateContext); * @param {*} [$event2]
Object.assign(tempContext,_context); * @returns {void}
} * @memberof F4TreeExpViewtreeexpbarBase
if(arg.srfparentdename){ */
Object.assign(tempContext,{srfparentdename:arg.srfparentdename}); public treeexpbar_load(args: any[], tag?: string, $event2?: any): void {
} this.calcToolbarItemState(true);
if(arg.srfparentkey){ this.$emit('load',args);
Object.assign(tempContext,{srfparentkey:arg.srfparentkey}); }
}
// 计算导航参数 /**
if(arg && arg.navigateParams && Object.keys(arg.navigateParams).length >0){ * 执行搜索
let tempData:any = arg.curData?JSON.parse(JSON.stringify(arg.curData)):{}; *
Object.assign(tempData,arg); * @memberof F4TreeExpViewtreeexpbarBase
let _params = this.$util.computedNavData(tempData,tempContext,tempViewparam,arg.navigateParams); */
Object.assign(tempViewparam,_params); public onSearch(): void {
this.counter += 1; if (!this.viewState) {
Object.assign(tempContext,{srfcounter:this.counter}); return;
} }
this.selection = {}; this.istLoadDefaultRefView = false;
Object.assign(this.selection, { view: { viewname: refview.viewname } }); this.viewState.next({ tag: 'treeexpbar_tree', action: 'filter', data: { srfnodefilter: this.srfnodefilter } });
Object.assign(this.selection,{'viewparam':tempViewparam,'context':tempContext}); }
this.calcToolbarItemState(false);
this.$forceUpdate(); /**
} * vue 声明周期
*
/** * @memberof @memberof F4TreeExpViewtreeexpbarBase
* 树加载完成 */
* public created() {
* @param {any[]} args this.afterCreated();
* @param {string} [tag] }
* @param {*} [$event2]
* @returns {void} /**
* @memberof F4TreeExpViewtreeexpbarBase * 执行created后的逻辑
*/ *
public treeexpbar_load(args: any[], tag?: string, $event2?: any): void { * @memberof F4TreeExpViewtreeexpbarBase
this.calcToolbarItemState(true); */
this.$emit('load',args); public afterCreated() {
} if (this.viewState) {
this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => {
/** if (!Object.is(tag, this.name)) {
* 执行搜索 return;
* }
* @memberof F4TreeExpViewtreeexpbarBase this.istLoadDefaultRefView = false;
*/ this.viewState.next({ tag: 'treeexpbar_tree', action: action, data: data });
public onSearch(): void { });
if (!this.viewState) { }
return; }
}
this.istLoadDefaultRefView = false; /**
this.viewState.next({ tag: 'treeexpbar_tree', action: 'filter', data: { srfnodefilter: this.srfnodefilter } }); * Vue声明周期(组件渲染完毕)
} *
* @memberof F4TreeExpViewtreeexpbarBase
/** */
* vue 声明周期 public mounted() {
* this.afterMounted();
* @memberof @memberof F4TreeExpViewtreeexpbarBase }
*/
public created() { /**
this.afterCreated(); * 执行mounted后的逻辑
} *
* @memberof F4TreeExpViewtreeexpbarBase
/** */
* 执行created后的逻辑 public afterMounted() { }
*
* @memberof F4TreeExpViewtreeexpbarBase
*/ /**
public afterCreated(){ * vue 生命周期
if (this.viewState) { *
this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => { * @memberof F4TreeExpViewtreeexpbarBase
if (!Object.is(tag, this.name)) { */
return; public destroyed() {
} this.afterDestroy();
this.istLoadDefaultRefView = false; }
this.viewState.next({ tag: 'treeexpbar_tree', action: action, data: data });
}); /**
} * 执行destroyed后的逻辑
} *
* @memberof F4TreeExpViewtreeexpbarBase
/** */
* Vue声明周期(组件渲染完毕) public afterDestroy() {
* if (this.viewStateEvent) {
* @memberof F4TreeExpViewtreeexpbarBase this.viewStateEvent.unsubscribe();
*/ }
public mounted() { }
this.afterMounted();
} /**
* 视图数据变化
/** *
* 执行mounted后的逻辑 * @param {*} $event
* * @memberof F4TreeExpViewtreeexpbarBase
* @memberof F4TreeExpViewtreeexpbarBase */
*/ public onViewDatasChange($event: any): void {
public afterMounted(){ this.$emit('selectionchange', $event);
if(this.$store.getters.getViewSplit(this.viewUID)){ }
this.split = this.$store.getters.getViewSplit(this.viewUID);
}else{ /**
let containerWidth:number = (document.getElementById("f4treeexpviewtreeexpbar") as any).offsetWidth; * 视图数据变化
if(this.ctrlWidth && containerWidth != 0){ *
this.split = this.ctrlWidth/containerWidth; * @param {*} $event
} * @memberof F4TreeExpViewtreeexpbarBase
this.$store.commit("setViewSplit",{viewUID:this.viewUID,viewSplit:this.split}); */
} public onDrViewDatasChange($event: any): void {
} this.viewState.next({ tag: 'treeexpbar_tree', action: 'refresh_parent' });
}
/** /**
* vue 生命周期 * 视图数据被激活
* *
* @memberof F4TreeExpViewtreeexpbarBase * @param {*} $event
*/ * @memberof F4TreeExpViewtreeexpbarBase
public destroyed() { */
this.afterDestroy(); public viewDatasActivated($event: any): void {
} this.$emit('activated', $event);
}
/**
* 执行destroyed后的逻辑 /**
* * 视图数据加载完成
* @memberof F4TreeExpViewtreeexpbarBase *
*/ * @param {*} $event
public afterDestroy() { * @memberof F4TreeExpViewtreeexpbarBase
if (this.viewStateEvent) { */
this.viewStateEvent.unsubscribe(); public onViewLoad($event: any): void {
} this.$emit('load', $event);
} }
/** /**
* 视图数据变化 * 设置导航区工具栏禁用状态
* *
* @param {*} $event * @param {boolean} state
* @memberof F4TreeExpViewtreeexpbarBase * @return {*}
*/ * @memberof F4TreeExpViewtreeexpbarBase
public onViewDatasChange($event: any): void { */
this.$emit('selectionchange', $event); public calcToolbarItemState(state: boolean) {
} let _this: any = this;
const models:any = _this.f4treeexpviewtreeexpbar_toolbarModels;
/** if (models) {
* 视图数据变化 for (const key in models) {
* if (!models.hasOwnProperty(key)) {
* @param {*} $event return;
* @memberof F4TreeExpViewtreeexpbarBase }
*/ const _item = models[key];
public onDrViewDatasChange($event: any): void { if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
this.viewState.next({ tag: 'treeexpbar_tree', action: 'refresh_parent' }); _item.disabled = state;
} }
_item.visabled = true;
/** if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
* 视图数据被激活 _item.visabled = false;
* }
* @param {*} $event }
* @memberof F4TreeExpViewtreeexpbarBase this.calcNavigationToolbarState();
*/ }
public viewDatasActivated($event: any): void { }
this.$emit('activated', $event);
} /**
* 计算导航工具栏权限状态
/** *
* 视图数据加载完成 * @memberof F4TreeExpViewtreeexpbarBase
* */
* @param {*} $event public calcNavigationToolbarState(){
* @memberof F4TreeExpViewtreeexpbarBase let _this: any = this;
*/ // 界面行为
public onViewLoad($event: any): void { if(_this.f4treeexpviewtreeexpbar_toolbarModels){
this.$emit('load', $event); const curUIService:IBIZSample0003UIService = new IBIZSample0003UIService();
} ViewTool.calcActionItemAuthState({},_this.f4treeexpviewtreeexpbar_toolbarModels,curUIService);
}
/** }
* 设置导航区工具栏禁用状态
*
* @param {boolean} state
* @return {*}
* @memberof F4TreeExpViewtreeexpbarBase
*/
public calcToolbarItemState(state: boolean) {
let _this: any = this;
const models:any = _this.f4treeexpviewtreeexpbar_toolbarModels;
if (models) {
for (const key in models) {
if (!models.hasOwnProperty(key)) {
return;
}
const _item = models[key];
if (_item.uiaction && (Object.is(_item.uiaction.target, 'SINGLEKEY') || Object.is(_item.uiaction.target, 'MULTIKEY'))) {
_item.disabled = state;
}
_item.visabled = true;
if (_item.noprivdisplaymode && _item.noprivdisplaymode === 6) {
_item.visabled = false;
}
}
this.calcNavigationToolbarState();
}
}
/**
* 计算导航工具栏权限状态
*
* @memberof F4TreeExpViewtreeexpbarBase
*/
public calcNavigationToolbarState(){
let _this: any = this;
// 界面行为
if(_this.f4treeexpviewtreeexpbar_toolbarModels){
const curUIService:IBIZSample0003UIService = new IBIZSample0003UIService();
ViewTool.calcActionItemAuthState({},_this.f4treeexpviewtreeexpbar_toolbarModels,curUIService);
}
}
} }
</script> </script>
<style lang='less'> <style lang='less'>
@import './f4-tree-exp-viewtreeexpbar-treeexpbar.less'; @import './f4-tree-exp-viewtreeexpbar-treeexpbar.less';
</style> </style>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或