diff --git a/packages/amis-core/src/types.ts b/packages/amis-core/src/types.ts index 37874785cae..b3292a0fde1 100644 --- a/packages/amis-core/src/types.ts +++ b/packages/amis-core/src/types.ts @@ -452,7 +452,8 @@ export interface EventTrack { | 'tabChange' | 'pageLoaded' | 'pageHidden' - | 'pageVisible'; + | 'pageVisible' + | string; /** * 事件数据 diff --git a/packages/amis-core/src/utils/renderer-event.ts b/packages/amis-core/src/utils/renderer-event.ts index 1519a8fb8d9..c8ce9e96a15 100644 --- a/packages/amis-core/src/utils/renderer-event.ts +++ b/packages/amis-core/src/utils/renderer-event.ts @@ -10,10 +10,16 @@ export interface debounceConfig { leading?: boolean; trailing?: boolean; } + +export interface trackConfig { + id: string; + name: string; +} // 事件监听器 export interface EventListeners { [propName: string]: { debounce?: debounceConfig; + track?: trackConfig; weight?: number; // 权重 actions: ListenerAction[]; // 执行的动作集 }; @@ -26,6 +32,7 @@ export interface OnEventProps { weight?: number; // 权重 actions: ListenerAction[]; // 执行的动作集, debounce?: debounceConfig; + track?: trackConfig; }; }; } @@ -36,6 +43,7 @@ export interface RendererEventListener { type: string; weight: number; debounce: debounceConfig | null; + track: trackConfig | null; actions: ListenerAction[]; executing?: boolean; debounceInstance?: any; @@ -118,6 +126,7 @@ export const bindEvent = (renderer: any) => { renderer, type: key, debounce: listener.debounce || null, + track: listeners[key].track || null, weight: listener.weight || 0, actions: listener.actions }); @@ -127,6 +136,7 @@ export const bindEvent = (renderer: any) => { renderer, type: key, debounce: listeners[key].debounce || null, + track: listeners[key].track || null, weight: listeners[key].weight || 0, actions: listeners[key].actions }); @@ -245,6 +255,17 @@ export async function dispatchEvent( checkExecuted(); } + if (listener?.track) { + const {id: trackId, name: trackName} = listener.track; + renderer?.props?.env?.tracker({ + eventType: listener.type, + eventData: { + trackId, + trackName + } + }); + } + // 停止后续监听器执行 if (rendererEvent.stoped) { break; diff --git a/packages/amis-editor/src/renderer/event-control/index.tsx b/packages/amis-editor/src/renderer/event-control/index.tsx index 6cdc4dcdc87..5dfd8c35465 100644 --- a/packages/amis-editor/src/renderer/event-control/index.tsx +++ b/packages/amis-editor/src/renderer/event-control/index.tsx @@ -71,6 +71,11 @@ interface EventDialogData { open: boolean; wait?: number; }; + trackConfig?: { + open: boolean; + id: string; + name: string; + }; [propName: string]: any; } @@ -219,6 +224,18 @@ export class EventControl extends React.Component< ...eventInfo.debounce }; } + if (!eventInfo.track) { + // 防抖配置的默认值 + eventInfo.track = { + open: false, + wait: 100 + }; + } else { + eventInfo.track = { + open: true, + ...eventInfo.track + }; + } this.setState({ eventDialogData: eventInfo, showEventDialog: true @@ -227,11 +244,11 @@ export class EventControl extends React.Component< eventDialogSubmit(formData: any) { const {onChange} = this.props; - const {eventName, debounce = {}} = formData; + const {eventName, debounce = {}, track = {}} = formData; let onEvent = { ...this.state.onEvent }; - let eventConfig = onEvent[`${eventName}`]; + let eventConfig = {...onEvent[`${eventName}`]}; if (!debounce.open) { delete eventConfig.debounce; } else { @@ -242,6 +259,18 @@ export class EventControl extends React.Component< } }; } + if (!track.open) { + delete eventConfig.track; + } else { + eventConfig = { + ...eventConfig, + track: { + id: track.id, + name: track.name + } + }; + } + onEvent[`${eventName}`] = { ...eventConfig }; @@ -1141,6 +1170,27 @@ export class EventControl extends React.Component< max: 10000, min: 0, type: 'input-number' + }, + { + label: '事件埋点', + type: 'switch', + name: 'track.open', + description: + '开启事件埋点后,每次事件触发都会发送埋点数据到后台' + }, + { + label: 'track-id', + required: true, + hiddenOn: '!track.open', + name: 'track.id', + type: 'input-text' + }, + { + label: 'track-name', + required: true, + hiddenOn: '!track.open', + name: 'track.name', + type: 'input-text' } ], onSubmit: this.eventDialogSubmit.bind(this) diff --git a/packages/amis-editor/src/renderer/event-control/types.ts b/packages/amis-editor/src/renderer/event-control/types.ts index 9c605b329a6..61437e0d2e2 100644 --- a/packages/amis-editor/src/renderer/event-control/types.ts +++ b/packages/amis-editor/src/renderer/event-control/types.ts @@ -13,6 +13,10 @@ export interface ActionEventConfig { debounce?: { wait: number; }; + track?: { + id: string; + name: string; + }; }; }