X Tutup
Skip to content

Commit 33fd6bf

Browse files
liujupingJackLian
liujuping
authored and
JackLian
committed
feat: added features in workspace mode
1 parent 3d470ca commit 33fd6bf

File tree

19 files changed

+155
-50
lines changed

19 files changed

+155
-50
lines changed

‎packages/designer/src/builtin-simulator/create-simulator.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,9 @@ export function createSimulator(
2020
): Promise<BuiltinSimulatorRenderer> {
2121
const win: any = iframe.contentWindow;
2222
const doc = iframe.contentDocument!;
23+
const innerPlugins = host.designer.editor.get('innerPlugins');
2324

25+
win.AliLowCodeEngine = innerPlugins._getLowCodePluginContext({});
2426
win.LCSimulatorHost = host;
2527
win._ = window._;
2628

‎packages/designer/src/builtin-simulator/host-view.tsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, { Component } from 'react';
2-
import { observer, globalContext } from '@alilc/lowcode-editor-core';
2+
import { observer } from '@alilc/lowcode-editor-core';
33
import { BuiltinSimulatorHost, BuiltinSimulatorProps } from './host';
44
import { BemTools } from './bem-tools';
55
import { Project } from '../project';
@@ -76,8 +76,7 @@ class Content extends Component<{ host: BuiltinSimulatorHost }> {
7676
private dispose?: () => void;
7777

7878
componentDidMount() {
79-
const workspace = globalContext.get('workspace');
80-
const editor = workspace.isActive ? workspace.window.editor : globalContext.get('editor');
79+
const editor = this.props.host.designer.editor;
8180
const onEnableEvents = (type: boolean) => {
8281
this.setState({
8382
disabledEvents: type,

‎packages/designer/src/plugin/plugin-types.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ import {
1616
IPublicApiWorkspace,
1717
IPublicTypePluginMeta,
1818
IPublicTypePluginRegisterOptions,
19+
IPublicModelWindow,
1920
} from '@alilc/lowcode-types';
2021
import PluginContext from './plugin-context';
2122

@@ -56,6 +57,7 @@ export interface ILowCodePluginContextPrivate {
5657
set pluginEvent(event: IPublicApiEvent);
5758
set canvas(canvas: IPublicApiCanvas);
5859
set workspace(workspace: IPublicApiWorkspace);
60+
set editorWindow(window: IPublicModelWindow);
5961
}
6062
export interface ILowCodePluginContextApiAssembler {
6163
assembleApis(

‎packages/designer/tests/builtin-simulator/host.test.ts‎

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { IPublicTypePluginMeta } from './../../../../lib/packages/types/src/shell/type/plugin-meta.d';
12
import '../fixtures/window';
23
import {
34
Editor,
@@ -22,6 +23,7 @@ import { BuiltinSimulatorHost } from '../../src/builtin-simulator/host';
2223
import { fireEvent } from '@testing-library/react';
2324
import { shellModelFactory } from '../../../engine/src/modules/shell-model-factory';
2425
import { Setters, Workspace } from '@alilc/lowcode-shell';
26+
import { ILowCodePluginContextApiAssembler, ILowCodePluginContextPrivate, LowCodePluginManager } from '@alilc/lowcode-designer';
2527

2628
describe('Host 测试', () => {
2729
let editor: Editor;
@@ -32,10 +34,20 @@ describe('Host 测试', () => {
3234

3335
beforeAll(() => {
3436
editor = new Editor();
35-
const innerWorkspace = new InnerWorkspace();
37+
const pluginContextApiAssembler: ILowCodePluginContextApiAssembler = {
38+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
39+
assembleApis: (context: ILowCodePluginContextPrivate, pluginName: string, meta: IPublicTypePluginMeta) => {
40+
context.project = project;
41+
const eventPrefix = meta?.eventPrefix || 'common';
42+
context.workspace = workspace;
43+
},
44+
};
45+
const innerPlugins = new LowCodePluginManager(pluginContextApiAssembler);
46+
const innerWorkspace = new InnerWorkspace(() => {}, {});
3647
const workspace = new Workspace(innerWorkspace);
3748
editor.set('innerHotkey', new InnerHotkey())
3849
editor.set('setters', new Setters(new InnerSetters()));
50+
editor.set('innerPlugins' as any, innerPlugins);
3951
!globalContext.has(Editor) && globalContext.register(editor, Editor);
4052
!globalContext.has('workspace') && globalContext.register(innerWorkspace, 'workspace');
4153
});

‎packages/editor-skeleton/src/components/settings/settings-pane.tsx‎

Lines changed: 14 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { Component, MouseEvent, Fragment } from 'react';
2-
import { shallowIntl, observer, obx, engineConfig, runInAction, globalContext } from '@alilc/lowcode-editor-core';
2+
import { shallowIntl, observer, obx, engineConfig, runInAction } from '@alilc/lowcode-editor-core';
33
import { createContent, isJSSlot, isSetterConfig } from '@alilc/lowcode-utils';
44
import { Skeleton, Stage } from '@alilc/lowcode-editor-skeleton';
55
import { IPublicTypeCustomView } from '@alilc/lowcode-types';
@@ -40,7 +40,7 @@ class SettingFieldView extends Component<SettingFieldViewProps, SettingFieldView
4040

4141
stageName: string | undefined;
4242

43-
setters: Setters;
43+
setters?: Setters;
4444

4545
constructor(props: SettingFieldViewProps) {
4646
super(props);
@@ -49,10 +49,10 @@ class SettingFieldView extends Component<SettingFieldViewProps, SettingFieldView
4949
const { extraProps } = field;
5050
const { display } = extraProps;
5151

52-
const workspace = globalContext.get('workspace');
53-
const editor = workspace.isActive ? workspace.window.editor : globalContext.get('editor');
54-
const { stages } = editor.get('skeleton') as Skeleton;
55-
this.setters = editor.get('setters');
52+
const editor = field.designer?.editor;
53+
const skeleton = editor?.get('skeleton') as Skeleton;
54+
const { stages } = skeleton || {};
55+
this.setters = editor?.get('setters');
5656
let stageName;
5757
if (display === 'entry') {
5858
runInAction(() => {
@@ -291,9 +291,8 @@ class SettingGroupView extends Component<SettingGroupViewProps> {
291291
const { field } = this.props;
292292
const { extraProps } = field;
293293
const { display } = extraProps;
294-
const workspace = globalContext.get('workspace');
295-
const editor = workspace.isActive ? workspace.window.editor : globalContext.get('editor');
296-
const { stages } = editor.get('skeleton') as Skeleton;
294+
const editor = this.props.field.designer?.editor;
295+
const { stages } = editor?.get('skeleton') as Skeleton;
297296
// const items = field.items;
298297

299298
let stageName;
@@ -343,15 +342,15 @@ class SettingGroupView extends Component<SettingGroupViewProps> {
343342
}
344343
}
345344

346-
export function createSettingFieldView(item: ISettingField | IPublicTypeCustomView, field: ISettingEntry, index?: number) {
347-
if (isSettingField(item)) {
348-
if (item.isGroup) {
349-
return <SettingGroupView field={item} key={item.id} />;
345+
export function createSettingFieldView(field: ISettingField | IPublicTypeCustomView, fieldEntry: ISettingEntry, index?: number) {
346+
if (isSettingField(field)) {
347+
if (field.isGroup) {
348+
return <SettingGroupView field={field} key={field.id} />;
350349
} else {
351-
return <SettingFieldView field={item} key={item.id} />;
350+
return <SettingFieldView field={field} key={field.id} />;
352351
}
353352
} else {
354-
return createContent(item, { key: index, field });
353+
return createContent(field, { key: index, field: fieldEntry });
355354
}
356355
}
357356

‎packages/engine/src/engine-core.ts‎

Lines changed: 21 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import {
1414
IPublicTypeEngineOptions,
1515
IPublicModelDocumentModel,
1616
IPublicTypePluginMeta,
17+
IPublicTypeDisposable,
1718
} from '@alilc/lowcode-types';
1819
import {
1920
Designer,
@@ -60,14 +61,26 @@ export * from './modules/skeleton-types';
6061
export * from './modules/designer-types';
6162
export * from './modules/lowcode-types';
6263

63-
async function registryInnerPlugin(designer: Designer, editor: Editor, plugins: Plugins) {
64+
async function registryInnerPlugin(designer: Designer, editor: Editor, plugins: Plugins): Promise<IPublicTypeDisposable> {
6465
// 注册一批内置插件
66+
const componentMetaParserPlugin = componentMetaParser(designer);
67+
const defaultPanelRegistryPlugin = defaultPanelRegistry(editor);
6568
await plugins.register(OutlinePlugin, {}, { autoInit: true });
66-
await plugins.register(componentMetaParser(designer));
69+
await plugins.register(componentMetaParserPlugin);
6770
await plugins.register(setterRegistry, {});
68-
await plugins.register(defaultPanelRegistry(editor));
71+
await plugins.register(defaultPanelRegistryPlugin);
6972
await plugins.register(builtinHotkey);
7073
await plugins.register(registerDefaults, {}, { autoInit: true });
74+
75+
return () => {
76+
plugins.delete(OutlinePlugin.pluginName);
77+
plugins.delete(componentMetaParserPlugin.pluginName);
78+
plugins.delete(setterRegistry.pluginName);
79+
plugins.delete(defaultPanelRegistryPlugin.pluginName);
80+
plugins.delete(defaultPanelRegistryPlugin.pluginName);
81+
plugins.delete(builtinHotkey.pluginName);
82+
plugins.delete(registerDefaults.pluginName);
83+
};
7184
}
7285

7386
const innerWorkspace = new InnerWorkspace(registryInnerPlugin, shellModelFactory);
@@ -158,7 +171,7 @@ let engineContainer: HTMLElement;
158171
export const version = VERSION_PLACEHOLDER;
159172
engineConfig.set('ENGINE_VERSION', version);
160173

161-
registryInnerPlugin(designer, editor, plugins);
174+
const pluginPromise = registryInnerPlugin(designer, editor, plugins);
162175

163176
export async function init(
164177
container?: HTMLElement,
@@ -183,10 +196,10 @@ export async function init(
183196
}
184197
engineConfig.setEngineOptions(engineOptions as any);
185198

186-
await plugins.init(pluginPreference as any);
187-
188199
const { Workbench } = common.skeletonCabin;
189200
if (options && options.enableWorkspaceMode) {
201+
const disposeFun = await pluginPromise;
202+
disposeFun && disposeFun();
190203
render(
191204
createElement(WorkSpaceWorkbench, {
192205
workspace: innerWorkspace,
@@ -202,6 +215,8 @@ export async function init(
202215
return;
203216
}
204217

218+
await plugins.init(pluginPreference as any);
219+
205220
render(
206221
createElement(Workbench, {
207222
skeleton: innerSkeleton,

‎packages/renderer-core/src/hoc/leaf.tsx‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -102,6 +102,9 @@ function initRerenderEvent({
102102
return;
103103
}
104104
cache.event.get(schema.id)?.dispose.forEach((disposeFn: any) => disposeFn && disposeFn());
105+
const debounceRerender = debounce(() => {
106+
container.rerender();
107+
}, 20);
105108
cache.event.set(schema.id, {
106109
clear: false,
107110
leaf,
@@ -111,21 +114,21 @@ function initRerenderEvent({
111114
return;
112115
}
113116
__debug(`${schema.componentName}[${schema.id}] leaf not render in SimulatorRendererView, leaf onPropsChange make rerender`);
114-
container.rerender();
117+
debounceRerender();
115118
}),
116119
leaf?.onChildrenChange?.(() => {
117120
if (!container.autoRepaintNode) {
118121
return;
119122
}
120123
__debug(`${schema.componentName}[${schema.id}] leaf not render in SimulatorRendererView, leaf onChildrenChange make rerender`);
121-
container.rerender();
124+
debounceRerender();
122125
}) as Function,
123126
leaf?.onVisibleChange?.(() => {
124127
if (!container.autoRepaintNode) {
125128
return;
126129
}
127130
__debug(`${schema.componentName}[${schema.id}] leaf not render in SimulatorRendererView, leaf onVisibleChange make rerender`);
128-
container.rerender();
131+
debounceRerender();
129132
}),
130133
],
131134
});

‎packages/shell/src/api/common.tsx‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { editorSymbol, skeletonSymbol, designerCabinSymbol, designerSymbol } from '../symbols';
1+
import { editorSymbol, skeletonSymbol, designerCabinSymbol, designerSymbol, settingFieldSymbol } from '../symbols';
22
import {
33
isFormEvent as innerIsFormEvent,
44
compatibleLegaoSchema as innerCompatibleLegaoSchema,
@@ -25,6 +25,7 @@ import {
2525
IPublicTypeLocationDetailType as InnerLocationDetailType,
2626
IPublicApiCommonEditorCabin,
2727
IPublicModelDragon,
28+
IPublicModelSettingField,
2829
} from '@alilc/lowcode-types';
2930
import {
3031
SettingField as InnerSettingField,
@@ -168,8 +169,8 @@ class SkeletonCabin implements IPublicApiCommonSkeletonCabin {
168169
/**
169170
* @deprecated
170171
*/
171-
createSettingFieldView(item: any, field: any) {
172-
return innerCreateSettingFieldView(item, field);
172+
createSettingFieldView(field: IPublicModelSettingField, fieldEntry: any) {
173+
return innerCreateSettingFieldView((field as any)[settingFieldSymbol] || field, fieldEntry);
173174
}
174175

175176
/**

‎packages/shell/src/api/project.ts‎

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,9 @@ import {
1818
import { DocumentModel as ShellDocumentModel } from '../model';
1919
import { SimulatorHost } from './simulator-host';
2020
import { editorSymbol, projectSymbol, simulatorHostSymbol, documentSymbol } from '../symbols';
21+
import { getLogger } from '@alilc/lowcode-utils';
22+
23+
const logger = getLogger({ level: 'warn', bizName: 'shell-project' });
2124

2225
const innerProjectSymbol = Symbol('innerProject');
2326
export class Project implements IPublicApiProject {
@@ -29,6 +32,10 @@ export class Project implements IPublicApiProject {
2932
}
3033
const workspace = globalContext.get('workspace');
3134
if (workspace.isActive) {
35+
if (!workspace.window.innerProject) {
36+
logger.error('project api 调用时机出现问题，请检查');
37+
return this[innerProjectSymbol];
38+
}
3239
return workspace.window.innerProject;
3340
}
3441

@@ -43,8 +50,8 @@ export class Project implements IPublicApiProject {
4350
this[innerProjectSymbol] = project;
4451
}
4552

46-
static create(project: InnerProject) {
47-
return new Project(project);
53+
static create(project: InnerProject, workspaceMode: boolean = false) {
54+
return new Project(project, workspaceMode);
4855
}
4956

5057
/**
@@ -225,15 +232,15 @@ export class Project implements IPublicApiProject {
225232
*/
226233
setConfig<T extends keyof IPublicTypeAppConfig>(key: T, value: IPublicTypeAppConfig[T]): void;
227234
setConfig(value: IPublicTypeAppConfig): void;
228-
setConfig(...params: any[]): void{
229-
if(params.length === 2) {
235+
setConfig(...params: any[]): void {
236+
if (params.length === 2) {
230237
const oldConfig = this[projectSymbol].get('config');
231238
this[projectSymbol].set('config', {
232239
...oldConfig,
233240
[params[0]]: params[1],
234-
})
241+
});
235242
} else {
236-
this[projectSymbol].set('config', params[0])
243+
this[projectSymbol].set('config', params[0]);
237244
}
238245
}
239246
}

‎packages/shell/src/api/setters.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,13 @@
11
import { IPublicTypeCustomView, IPublicApiSetters, IPublicTypeRegisteredSetter } from '@alilc/lowcode-types';
22
import { Setters as InnerSetters, globalContext } from '@alilc/lowcode-editor-core';
33
import { ReactNode } from 'react';
4+
import { getLogger } from '@alilc/lowcode-utils';
45

56
const innerSettersSymbol = Symbol('setters');
67
const settersSymbol = Symbol('setters');
78

9+
const logger = getLogger({ level: 'warn', bizName: 'shell-setters' });
10+
811
export class Setters implements IPublicApiSetters {
912
readonly [innerSettersSymbol]: InnerSetters;
1013

@@ -15,6 +18,10 @@ export class Setters implements IPublicApiSetters {
1518

1619
const workspace = globalContext.get('workspace');
1720
if (workspace.isActive) {
21+
if (!workspace.window.innerSetters) {
22+
logger.error('setter api 调用时机出现问题，请检查');
23+
return this[innerSettersSymbol];
24+
}
1825
return workspace.window.innerSetters;
1926
}
2027

0 commit comments

Comments
 (0)
X Tutup