Skip to content

Commit

Permalink
fix: 全局广播事件及时更新
Browse files Browse the repository at this point in the history
  • Loading branch information
allenve committed Dec 2, 2024
1 parent ef0dfa0 commit 4476668
Show file tree
Hide file tree
Showing 6 changed files with 47 additions and 30 deletions.
12 changes: 12 additions & 0 deletions packages/amis-editor-core/src/component/Editor.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -206,6 +206,10 @@ export default class Editor extends Component<EditorProps> {

this.manager = new EditorManager(config, this.store, hostManager);

this.store.setGlobalEvents(
config.actionOptions?.globalEventGetter?.(this.manager) || []
);

// 子编辑器不再重新设置 editorStore
if (!(props.isSubEditor && (window as any).editorStore)) {
(window as any).editorStore = this.store;
Expand Down Expand Up @@ -274,6 +278,14 @@ export default class Editor extends Component<EditorProps> {
if (props?.amisEnv?.replaceText !== prevProps?.amisEnv?.replaceText) {
this.store.setAppCorpusData(props?.amisEnv?.replaceText);
}
if (
props.actionOptions?.globalEventGetter?.(this.manager) !==
prevProps.actionOptions?.globalEventGetter?.(this.manager)
) {
this.store.setGlobalEvents(
props.actionOptions?.globalEventGetter?.(this.manager) || []
);
}
}

componentWillUnmount() {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import {EditorManager} from '../../manager';
import {diff, getThemeConfig} from '../../util';
import {
createObjectFromChain,
createObject,
extractObjectChain,
IFormStore,
render,
Expand Down
11 changes: 9 additions & 2 deletions packages/amis-editor-core/src/store/editor.ts
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,8 @@ import {
ScaffoldForm,
PopOverForm,
DeleteEventContext,
BaseEventContext
BaseEventContext,
IGlobalEvent
} from '../plugin';
import {
JSONDuplicate,
Expand Down Expand Up @@ -265,7 +266,9 @@ export const MainStore = types
/** 应用语料 */
appCorpusData: types.optional(types.frozen(), {}),
/** 应用多语言状态,用于其它组件进行订阅 */
appLocaleState: types.optional(types.number, 0)
appLocaleState: types.optional(types.number, 0),
/** 全局广播事件 */
globalEvents: types.optional(types.frozen<Array<IGlobalEvent>>(), [])
})
.views(self => {
return {
Expand Down Expand Up @@ -2348,6 +2351,10 @@ export const MainStore = types
this.updateAppLocaleState();
},

setGlobalEvents(events: IGlobalEvent[]) {
self.globalEvents = events;
},

beforeDestroy() {
lazyUpdateTargetName.cancel();
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ registerActionPanel('broadcast', {
description: '触发全局广播事件',
innerArgs: [],
descDetail: (info: any, context: any, props: any) => {
const globalEvents = props.globalEvents || [];
const globalEvents = props.manager.store.globalEvents;
const event = globalEvents.find(
(item: any) => item.name === info?.eventName
);
Expand All @@ -21,8 +21,7 @@ registerActionPanel('broadcast', {
);
},
schema: (manager: EditorManager, data: any) => {
const globalEvents =
manager.config?.actionOptions?.globalEventGetter?.(manager) || [];
const globalEvents = manager.store.globalEvents;
return {
type: 'wrapper',
body: [
Expand Down
3 changes: 0 additions & 3 deletions packages/amis-editor/src/renderer/event-control/helper.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -953,8 +953,6 @@ export const getEventControlConfig = (
const actionTree = manager?.config.actionOptions?.actionTreeGetter
? manager?.config.actionOptions?.actionTreeGetter(ACTION_TYPE_TREE(manager))
: ACTION_TYPE_TREE(manager);
const globalEvents =
manager?.config.actionOptions?.globalEventGetter?.(manager);
const allComponents = manager?.store?.getComponentTreeSource();
return {
showOldEntry:
Expand All @@ -966,7 +964,6 @@ export const getEventControlConfig = (
events: manager?.pluginEvents,
actionTree,
commonActions,
globalEvents,
owner: '',
addBroadcast: manager?.addBroadcast.bind(manager),
removeBroadcast: manager?.removeBroadcast.bind(manager),
Expand Down
45 changes: 23 additions & 22 deletions packages/amis-editor/src/renderer/event-control/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -62,10 +62,10 @@ import {updateComponentContext} from 'amis-editor-core';
import type {VariableItem} from 'amis-ui';

interface EventControlProps extends FormControlProps {
manager: EditorManager;
actions: PluginActions; // 组件的动作列表
events: PluginEvents; // 组件的事件列表
actionTree: RendererPluginAction[]; // 动作树
globalEvents?: IGlobalEvent[]; // 全局事件
commonActions?: {[propName: string]: RendererPluginAction}; // 公共动作Map
value: ActionEventConfig; // 事件动作配置
onChange: (
Expand Down Expand Up @@ -140,6 +140,7 @@ interface EventControlState {
type: 'update' | 'add';
appLocaleState?: number;
actionRelations: any;
globalEvents: IGlobalEvent[];
}

const dialogObjMap = {
Expand All @@ -158,12 +159,14 @@ export class EventControl extends React.Component<
} = {};
drag?: HTMLElement | null;
unReaction: any;
unEventReaction: any;
submitSubscribers: Array<(value: any) => any> = [];

constructor(props: EventControlProps) {
super(props);
const {events, value, data, rawType, globalEvents} = props;

const {events, value, data, rawType} = props;
const editorStore = props.manager.store;
const globalEvents = editorStore.globalEvents;
const eventPanelActive: {
[prop: string]: boolean;
} = {};
Expand Down Expand Up @@ -193,12 +196,13 @@ export class EventControl extends React.Component<
actionData: undefined,
type: 'add',
appLocaleState: 0,
actionRelations: actionRelations ?? []
actionRelations: actionRelations ?? [],
globalEvents: globalEvents
};
}

componentDidMount(): void {
const editorStore = (window as any).editorStore;
const editorStore = this.props.manager.store;
this.unReaction = reaction(
() => editorStore?.appLocaleState,
() => {
Expand All @@ -207,10 +211,19 @@ export class EventControl extends React.Component<
});
}
);
this.unEventReaction = reaction(
() => editorStore.globalEvents,
() => {
this.setState({
globalEvents: editorStore.globalEvents
});
}
);
}

componentWillUnmount() {
this.unReaction?.();
this.unEventReaction?.();
this.submitSubscribers = [];
}

Expand All @@ -228,21 +241,12 @@ export class EventControl extends React.Component<
data?.type !== prevProps.data?.type ||
data?.onEvent !== prevProps.data?.onEvent
) {
const eventPanelActive: {
[prop: string]: boolean;
} = {};
const tmpEvents =
events[
rawType || (!data.type || data.type === 'text' ? 'plain' : data.type)
] || [];
const pluginEvents =
typeof tmpEvents === 'function' ? tmpEvents(data) : [...tmpEvents];

// 事件配置面板不自动折叠
// pluginEvents.forEach((event: RendererPluginEvent) => {
// eventPanelActive[event.eventName] = true;
// });

const actionRelations = this.getActionRelations();

this.setState({
Expand Down Expand Up @@ -638,10 +642,9 @@ export class EventControl extends React.Component<
actionTree,
actions: pluginActions,
commonActions,
allComponents,
globalEvents
allComponents
} = this.props;
const {events, onEvent} = this.state;
const {events, onEvent, globalEvents} = this.state;
const eventConfig = events.find(
item => item.eventName === data.actionData!.eventKey
);
Expand Down Expand Up @@ -771,7 +774,7 @@ export class EventControl extends React.Component<
variables = (manager.dataSchema as DataSchema).getDataPropsAsOptions();

// 插入应用变量
const appVariables: VariableItem[] =
const appVariables =
manager?.variableManager?.getVariableFormulaOptions() || [];
appVariables.forEach(item => {
if (Array.isArray(item?.children) && item.children.length) {
Expand Down Expand Up @@ -1079,14 +1082,12 @@ export class EventControl extends React.Component<
actions: pluginActions,
commonActions,
getComponents,
allComponents,
render,
globalEvents = [],
subscribeSchemaSubmit
render
} = this.props;
const {
onEvent,
events: itemEvents,
globalEvents,
eventPanelActive,
showAcionDialog,
showEventDialog,
Expand Down

0 comments on commit 4476668

Please sign in to comment.