- {{ action.eventName }}{{ state.componentEvents[action.eventName].label.zh_CN }}
+ {{ action.eventName }}{{ renderEventList[action.eventName]?.label?.[locale] }}
{{ action.linkedEventName }}
{{ action.ref }}
@@ -78,7 +78,7 @@
@@ -88,6 +88,7 @@
import { computed, reactive, watchEffect } from 'vue'
import { Popover, Button } from '@opentiny/vue'
import { useCanvas, useModal, useLayout, useBlock, useResource } from '@opentiny/tiny-engine-controller'
+import i18n from '@opentiny/tiny-engine-controller/js/i18n'
import { BlockLinkEvent, SvgButton } from '@opentiny/tiny-engine-common'
import { iconHelpQuery, iconChevronDown } from '@opentiny/vue-icon'
import BindEventsDialog, { open as openDialog } from './BindEventsDialog.vue'
@@ -112,6 +113,7 @@ export default {
const { getBlockEvents, getCurrentBlock, removeEventLink } = useBlock()
const { getMaterial } = useResource()
const { confirm } = useModal()
+ const locale = i18n.global.locale.value
const { highlightMethod } = getPluginApi(PLUGIN_NAME.PageController)
@@ -119,25 +121,25 @@ export default {
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 || {}
- Object.assign(state.componentEvents, 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]
@@ -225,7 +227,7 @@ export default {
const handleAddEvent = (params) => {
const { eventName, eventDescription } = params
- Object.assign(state.componentEvents, {
+ Object.assign(state.customEvents, {
[eventName]: {
label: {
zh_CN: eventDescription
@@ -253,7 +255,9 @@ export default {
openCodePanel,
openActionDialog,
handleAddEvent,
- handleToggleAddEventDialog
+ handleToggleAddEventDialog,
+ renderEventList,
+ locale
}
}
}