From 8468d45b8e42c180c9103616b3e3ca3b8fd3a57d Mon Sep 17 00:00:00 2001 From: hisoka0728 <1399952343@qq.com> Date: Fri, 12 Apr 2024 21:31:03 +0800 Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=E8=AE=A1=E6=95=B0=E5=99=A8counter.?= =?UTF-8?q?onChange=E5=8F=96=E6=B6=88=E8=AE=A2=E9=98=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/control/app-menu/app-menu.tsx | 9 ++++++--- src/control/drbar/drbar.tsx | 20 +++++++++++++++---- src/control/drtab/drtab.tsx | 13 ++++++++---- .../form-tab-panel/form-tab-panel.tsx | 10 ++++++---- src/control/tree/tree.tsx | 11 +++++++--- 5 files changed, 45 insertions(+), 18 deletions(-) diff --git a/src/control/app-menu/app-menu.tsx b/src/control/app-menu/app-menu.tsx index d29f7e4d7..8ad2faeb1 100644 --- a/src/control/app-menu/app-menu.tsx +++ b/src/control/app-menu/app-menu.tsx @@ -276,6 +276,10 @@ export const AppMenuControl = defineComponent({ }, ); + const fn = (data: IData) => { + counterData.value = data; + }; + c.evt.on('onMounted', async () => { const allItems = c.getAllItems(); // 默认激活的菜单项 @@ -307,14 +311,13 @@ export const AppMenuControl = defineComponent({ if (counterRefId) { counter = c.getCounter(counterRefId); if (counter) { - counter.onChange((data: IData) => { - counterData.value = data; - }); + counter.onChange(fn); } } }); onUnmounted(() => { + counter?.offChange(fn); counter?.destroy(); }); diff --git a/src/control/drbar/drbar.tsx b/src/control/drbar/drbar.tsx index 5f6180b2b..a8178da9a 100644 --- a/src/control/drbar/drbar.tsx +++ b/src/control/drbar/drbar.tsx @@ -4,7 +4,14 @@ import { useControlController, useNamespace, } from '@ibiz-template/vue3-util'; -import { defineComponent, PropType, reactive, VNode, watch } from 'vue'; +import { + defineComponent, + onUnmounted, + PropType, + reactive, + VNode, + watch, +} from 'vue'; import { IDEDRBar } from '@ibiz/model-core'; import { useRoute, useRouter } from 'vue-router'; import { IControlProvider, IDRBarItemsState } from '@ibiz-template/runtime'; @@ -28,14 +35,19 @@ export const DRBarControl = defineComponent({ const router = useRouter(); const counterData = reactive({}); + const fn = (counter: IData) => { + Object.assign(counterData, counter); + }; c.evt.on('onCreated', () => { if (c.counter) { - c.counter.onChange((counter: IData) => { - Object.assign(counterData, counter); - }, true); + c.counter.onChange(fn, true); } }); + onUnmounted(() => { + c.counter?.offChange(fn); + }); + c.setRouter(router); const handleSelect = (key: string): void => { diff --git a/src/control/drtab/drtab.tsx b/src/control/drtab/drtab.tsx index 0389189bb..036718ec7 100644 --- a/src/control/drtab/drtab.tsx +++ b/src/control/drtab/drtab.tsx @@ -4,7 +4,7 @@ import { useControlController, useNamespace, } from '@ibiz-template/vue3-util'; -import { defineComponent, PropType, reactive, watch } from 'vue'; +import { defineComponent, onUnmounted, PropType, reactive, watch } from 'vue'; import { IDEDRTab } from '@ibiz/model-core'; import { useRoute, useRouter } from 'vue-router'; import { IControlProvider, hasSubRoute } from '@ibiz-template/runtime'; @@ -26,14 +26,19 @@ export const DRTabControl = defineComponent({ const router = useRouter(); const counterData = reactive({}); + const fn = (counter: IData) => { + Object.assign(counterData, counter); + }; c.evt.on('onCreated', () => { if (c.counter) { - c.counter.onChange((counter: IData) => { - Object.assign(counterData, counter); - }, true); + c.counter.onChange(fn, true); } }); + onUnmounted(() => { + c.counter?.offChange(fn); + }); + c.setRouter(router); const handleTabChange = (): void => { diff --git a/src/control/form/form-detail/form-tab-panel/form-tab-panel.tsx b/src/control/form/form-detail/form-tab-panel/form-tab-panel.tsx index 8b42e8d54..0bbabf4ce 100644 --- a/src/control/form/form-detail/form-tab-panel/form-tab-panel.tsx +++ b/src/control/form/form-detail/form-tab-panel/form-tab-panel.tsx @@ -53,6 +53,10 @@ export const FormTabPanel = defineComponent({ } }; + const fn = (data: IData) => { + counterData.value = data; + }; + onMounted(() => { // 计数器相关 const defaultSlots: VNode[] = slots.default?.() || []; @@ -73,15 +77,13 @@ export const FormTabPanel = defineComponent({ if (counterRefId.value) { counter = props.controller.getCounter(counterRefId.value); if (counter) { - counter.onChange((data: IData) => { - counterData.value = data; - }); + counter.onChange(fn); } } }); onUnmounted(() => { - counter?.destroy(); + counter?.offChange(fn); }); return { diff --git a/src/control/tree/tree.tsx b/src/control/tree/tree.tsx index fdebcdec8..279dd3e06 100644 --- a/src/control/tree/tree.tsx +++ b/src/control/tree/tree.tsx @@ -81,17 +81,22 @@ export const TreeControl = defineComponent({ const cascadeSelect = ref(false); const counterData = reactive({}); + const fn = (counter: IData) => { + Object.assign(counterData, counter); + }; c.evt.on('onCreated', () => { if (c.counter) { - c.counter.onChange((counter: IData) => { - Object.assign(counterData, counter); - }, true); + c.counter.onChange(fn, true); } if (c.controlParams.cascadeselect) { cascadeSelect.value = true; } }); + onUnmounted(() => { + c.counter?.offChange(fn); + }); + const ns = useNamespace(`control-${c.model.controlType!.toLowerCase()}`); const treeRef = ref | null>(null); const treeviewRef = ref(null); -- Gitee From 5cf6399236b04e2ed9a44c5deaa541019dd71494 Mon Sep 17 00:00:00 2001 From: hisoka0728 <1399952343@qq.com> Date: Fri, 12 Apr 2024 21:32:11 +0800 Subject: [PATCH 2/2] =?UTF-8?q?feat:=20=E5=AE=9E=E4=BD=93=E6=95=B0?= =?UTF-8?q?=E6=8D=AE=E5=8F=98=E6=9B=B4=EF=BC=8C=E5=8A=A8=E6=80=81=E4=BB=A3?= =?UTF-8?q?=E7=A0=81=E8=A1=A8=E4=B9=9F=E7=9B=91=E5=90=AC=E7=9B=B8=E5=85=B3?= =?UTF-8?q?=E5=8F=98=E6=9B=B4=E5=88=B7=E6=96=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../grid-field-column/grid-field-column.tsx | 39 ++++++++++++++++++- .../ibiz-checkbox-list/ibiz-checkbox-list.tsx | 36 ++++++++++++++++- .../ibiz-dropdown/ibiz-dropdown.tsx | 23 ++++++++++- .../list-box/ibiz-list-box/ibiz-list-box.tsx | 37 +++++++++++++++++- .../ibiz-radio/ibiz-radio.tsx | 36 ++++++++++++++++- src/editor/span/span/span.tsx | 38 +++++++++++++++++- 6 files changed, 201 insertions(+), 8 deletions(-) diff --git a/src/control/grid/grid-column/grid-field-column/grid-field-column.tsx b/src/control/grid/grid-column/grid-field-column/grid-field-column.tsx index 7da526145..5b9d5b4c3 100644 --- a/src/control/grid/grid-column/grid-field-column/grid-field-column.tsx +++ b/src/control/grid/grid-column/grid-field-column/grid-field-column.tsx @@ -1,8 +1,10 @@ import { IUIActionGroupDetail } from '@ibiz/model-core'; -import { computed, defineComponent, ref } from 'vue'; +import { computed, defineComponent, onMounted, onUnmounted, ref } from 'vue'; import { useNamespace } from '@ibiz-template/vue3-util'; import './grid-field-column.scss'; import { + CodeListItem, + DynamicCodeListCache, GridFieldColumnController, GridRowState, } from '@ibiz-template/runtime'; @@ -100,6 +102,38 @@ export const GridFieldColumn = defineComponent({ ): Promise => { await props.controller.onActionClick(detail, props.row, event); }; + + const items = ref([]); + if (props.controller.codeList) { + items.value = props.controller.codeListItems!; + } + + const fn = (data: CodeListItem[] | undefined) => { + if (data) { + items.value = data; + } + }; + + let codeListInstance: DynamicCodeListCache | undefined; + + onMounted(async () => { + if (props.controller.model.appCodeListId) { + const app = await ibiz.hub.getApp(props.controller.context.srfappid); + codeListInstance = await app.codeList.getCodeListInstance( + props.controller.model.appCodeListId, + ); + if (codeListInstance) { + codeListInstance.onChange(fn); + } + } + }); + + onUnmounted(() => { + if (codeListInstance) { + codeListInstance.offChange(fn); + } + }); + return { ns, onCellClick, @@ -111,6 +145,7 @@ export const GridFieldColumn = defineComponent({ formatValue, tooltip, zIndex, + items, }; }, render() { @@ -138,7 +173,7 @@ export const GridFieldColumn = defineComponent({ content = ( { + if (data) { + items.value = data; + } + }; + + let codeListInstance: DynamicCodeListCache | undefined; + + onMounted(async () => { + if (c.model.appCodeListId) { + const app = await ibiz.hub.getApp(c.context.srfappid); + codeListInstance = await app.codeList.getCodeListInstance( + c.model.appCodeListId, + ); + if (codeListInstance) { + codeListInstance.onChange(fn); + } + } + }); + + onUnmounted(() => { + if (codeListInstance) { + codeListInstance.offChange(fn); + } + }); + // 值分隔符 let valueSeparator = ','; if (codeList && codeList.valueSeparator) { diff --git a/src/editor/dropdown-list/ibiz-dropdown/ibiz-dropdown.tsx b/src/editor/dropdown-list/ibiz-dropdown/ibiz-dropdown.tsx index dbad31fe9..d97df72cb 100644 --- a/src/editor/dropdown-list/ibiz-dropdown/ibiz-dropdown.tsx +++ b/src/editor/dropdown-list/ibiz-dropdown/ibiz-dropdown.tsx @@ -16,6 +16,7 @@ import { } from '@ibiz-template/vue3-util'; import './ibiz-dropdown.scss'; import { OnClickOutsideResult } from '@ibiz-template/core'; +import { CodeListItem, DynamicCodeListCache } from '@ibiz-template/runtime'; import { DropDownListEditorController } from '../dropdown-list-editor.controller'; export const IBizDropdown = defineComponent({ @@ -283,7 +284,24 @@ export const IBizDropdown = defineComponent({ } }; - onMounted(() => { + const fn = (data: CodeListItem[] | undefined) => { + if (data) { + items.value = data; + } + }; + + let codeListInstance: DynamicCodeListCache | undefined; + + onMounted(async () => { + if (c.model.appCodeListId) { + const app = await ibiz.hub.getApp(c.context.srfappid); + codeListInstance = await app.codeList.getCodeListInstance( + c.model.appCodeListId, + ); + if (codeListInstance) { + codeListInstance.onChange(fn); + } + } if (editorRef.value) { funcs = useClickOutside(editorRef, async _evt => { editorState = 'outside'; @@ -295,6 +313,9 @@ export const IBizDropdown = defineComponent({ if (funcs && funcs.stop) { funcs.stop(); } + if (codeListInstance) { + codeListInstance.offChange(fn); + } }); return { diff --git a/src/editor/list-box/ibiz-list-box/ibiz-list-box.tsx b/src/editor/list-box/ibiz-list-box/ibiz-list-box.tsx index b1713144b..79ff4e003 100644 --- a/src/editor/list-box/ibiz-list-box/ibiz-list-box.tsx +++ b/src/editor/list-box/ibiz-list-box/ibiz-list-box.tsx @@ -1,4 +1,12 @@ -import { computed, defineComponent, Ref, ref, watch } from 'vue'; +import { + computed, + defineComponent, + onMounted, + onUnmounted, + Ref, + ref, + watch, +} from 'vue'; import { getListBoxProps, getEditorEmits, @@ -7,6 +15,7 @@ import { } from '@ibiz-template/vue3-util'; import { isNil } from 'ramda'; import './ibiz-list-box.scss'; +import { CodeListItem, DynamicCodeListCache } from '@ibiz-template/runtime'; import { ListBoxEditorController } from '../list-box-editor.controller'; import { ListBoxPickerEditorController } from '../list-box-picker-editor.controller'; @@ -72,6 +81,32 @@ export const IBizListBox = defineComponent({ loadListBoxItems(); + const fn = (data: CodeListItem[] | undefined) => { + if (data) { + items.value = data; + } + }; + + let codeListInstance: DynamicCodeListCache | undefined; + + onMounted(async () => { + if ((c as ListBoxEditorController).model.appCodeListId) { + const app = await ibiz.hub.getApp(c.context.srfappid); + codeListInstance = await app.codeList.getCodeListInstance( + (c as ListBoxEditorController).model.appCodeListId!, + ); + if (codeListInstance) { + codeListInstance.onChange(fn); + } + } + }); + + onUnmounted(() => { + if (codeListInstance) { + codeListInstance.offChange(fn); + } + }); + // 当前模式 const currentMode = computed(() => { if (codeList && codeList.orMode) { diff --git a/src/editor/radio-button-list/ibiz-radio/ibiz-radio.tsx b/src/editor/radio-button-list/ibiz-radio/ibiz-radio.tsx index d940c1a27..ca4239485 100644 --- a/src/editor/radio-button-list/ibiz-radio/ibiz-radio.tsx +++ b/src/editor/radio-button-list/ibiz-radio/ibiz-radio.tsx @@ -1,4 +1,11 @@ -import { computed, defineComponent, ref, watch } from 'vue'; +import { + computed, + defineComponent, + onMounted, + onUnmounted, + ref, + watch, +} from 'vue'; import { getEditorEmits, getRadioProps, @@ -7,6 +14,7 @@ import { } from '@ibiz-template/vue3-util'; import './ibiz-radio.scss'; import { notNilEmpty } from 'qx-util'; +import { CodeListItem, DynamicCodeListCache } from '@ibiz-template/runtime'; import { RadioButtonListEditorController } from '../radio-button-list.controller'; export const IBizRadio = defineComponent({ @@ -54,6 +62,32 @@ export const IBizRadio = defineComponent({ }, ); + const fn = (data: CodeListItem[] | undefined) => { + if (data) { + items.value = data; + } + }; + + let codeListInstance: DynamicCodeListCache | undefined; + + onMounted(async () => { + if (c.model.appCodeListId) { + const app = await ibiz.hub.getApp(c.context.srfappid); + codeListInstance = await app.codeList.getCodeListInstance( + c.model.appCodeListId, + ); + if (codeListInstance) { + codeListInstance.onChange(fn); + } + } + }); + + onUnmounted(() => { + if (codeListInstance) { + codeListInstance.offChange(fn); + } + }); + const valueText = computed(() => { // eslint-disable-next-line eqeqeq return items.value.find(item => item.value == props.value)?.text || ''; diff --git a/src/editor/span/span/span.tsx b/src/editor/span/span/span.tsx index bedc8af58..872247475 100644 --- a/src/editor/span/span/span.tsx +++ b/src/editor/span/span/span.tsx @@ -1,11 +1,19 @@ -import { ref, defineComponent, Ref, watch, computed } from 'vue'; +import { + ref, + defineComponent, + Ref, + watch, + computed, + onUnmounted, + onMounted, +} from 'vue'; import { getSpanProps, useFocusAndBlur, useNamespace, } from '@ibiz-template/vue3-util'; import './span.scss'; -import { CodeListItem } from '@ibiz-template/runtime'; +import { CodeListItem, DynamicCodeListCache } from '@ibiz-template/runtime'; import { isNil } from 'ramda'; import { DataTypes } from '@ibiz-template/core'; import dayjs from 'dayjs'; @@ -129,6 +137,32 @@ export const IBizSpan = defineComponent({ ); } + const fn = (data: CodeListItem[] | undefined) => { + if (data) { + items.value = data; + } + }; + + let codeListInstance: DynamicCodeListCache | undefined; + + onMounted(async () => { + if (c.model.appCodeListId) { + const app = await ibiz.hub.getApp(c.context.srfappid); + codeListInstance = await app.codeList.getCodeListInstance( + c.model.appCodeListId, + ); + if (codeListInstance) { + codeListInstance.onChange(fn); + } + } + }); + + onUnmounted(() => { + if (codeListInstance) { + codeListInstance.offChange(fn); + } + }); + // 聚焦失焦事件 const { componentRef: editorRef } = useFocusAndBlur( () => emit('focus'), -- Gitee