diff --git a/packages/settings/events/src/components/BindEvents.vue b/packages/settings/events/src/components/BindEvents.vue index 515fc08eb..05b1d3f7d 100644 --- a/packages/settings/events/src/components/BindEvents.vue +++ b/packages/settings/events/src/components/BindEvents.vue @@ -17,12 +17,12 @@ @@ -39,7 +39,7 @@
- {{ action.eventName }}{{ state.componentEvents[action.eventName].label.zh_CN }} + {{ action.eventName }}{{ renderEventList[action.eventName]?.label?.[locale] }}
{{ action.linkedEventName }}
{{ action.ref }} @@ -73,7 +73,7 @@ @@ -92,6 +92,7 @@ import { getMetaApi, META_APP } from '@opentiny/tiny-engine-meta-register' +import i18n from '@opentiny/tiny-engine-controller/js/i18n' import { BlockLinkEvent, SvgButton } from '@opentiny/tiny-engine-common' import { iconChevronDown } from '@opentiny/vue-icon' import BindEventsDialog, { open as openDialog } from './BindEventsDialog.vue' @@ -114,33 +115,32 @@ export default { const { getBlockEvents, getCurrentBlock, removeEventLink } = useBlock() const { getMaterial } = useMaterial() const { confirm } = useModal() - + const locale = i18n.global.locale.value const { highlightMethod } = getMetaApi(META_APP.Page) - const { commonEvents = {} } = getMergeMeta('engine.setting.event').options const state = reactive({ eventName: '', // 事件名称 eventBinding: null, // 事件绑定的处理方法对象 componentEvent: {}, - componentEvents: commonEvents, + customEvents: commonEvents, bindActions: {}, showBindEventDialog: false }) const isBlock = computed(() => Boolean(pageState.isBlock)) const isEmpty = computed(() => Object.keys(state.bindActions).length === 0) + const renderEventList = computed(() => ({ ...state.componentEvent, ...state.customEvents })) watchEffect(() => { const componentName = pageState?.currentSchema?.componentName const componentSchema = getMaterial(componentName) state.componentEvent = componentSchema?.content?.schema?.events || componentSchema?.schema?.events || {} - state.componentEvents = { ...commonEvents, ...state.componentEvent } const props = pageState?.currentSchema?.props || {} const keys = Object.keys(props) state.bindActions = {} // 遍历组件事件元数据 - Object.entries(state.componentEvents).forEach(([eventName, componentEvent]) => { + Object.entries(renderEventList.value).forEach(([eventName, componentEvent]) => { // 查找组件已添加的事件 if (keys.indexOf(eventName) > -1) { const event = props[eventName] @@ -228,7 +228,7 @@ export default { const handleAddEvent = (params) => { const { eventName, eventDescription } = params - Object.assign(state.componentEvents, { + Object.assign(state.customEvents, { [eventName]: { label: { zh_CN: eventDescription @@ -256,7 +256,9 @@ export default { openCodePanel, openActionDialog, handleAddEvent, - handleToggleAddEventDialog + handleToggleAddEventDialog, + renderEventList, + locale } } }