Skip to content

Commit 358dde4

Browse files
liujupingJackLian
authored andcommitted
feat(shell): add editor-view model
1 parent c50a082 commit 358dde4

File tree

33 files changed

+395
-186
lines changed

33 files changed

+395
-186
lines changed

docs/docs/api/model/editor-view.md

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
---
2+
title: EditorView
3+
sidebar_position: 12
4+
---
5+
6+
> **[@experimental](./#experimental)**<br/>
7+
> **@types** [IPublicModelEditorView](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/editor-view.ts)<br/>
8+
> **@since** v1.1.7
9+
10+
窗口编辑视图
11+
12+
## 类型定义
13+
14+
```
15+
import { IPublicModelPluginContext } from "./plugin-context";
16+
17+
export interface IPublicModelEditorView extends IPublicModelPluginContext {};
18+
19+
```
20+
21+
相关类型定义: [IPublicModelPluginContext](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/model/plugin-context.ts)

docs/docs/api/model/window.md

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,22 @@ sidebar_position: 12
3838

3939
关联模型 [IPublicModelResource](./resource)
4040

41+
### currentEditorView
42+
窗口当前视图
43+
44+
`@type {IPublicModelEditorView}`
45+
46+
关联模型 [IPublicModelEditorView](./editor-view)
47+
48+
### editorViews
49+
50+
窗口所有视图
51+
52+
`@type {IPublicModelEditorView[]}`
53+
54+
关联模型 [IPublicModelEditorView](./editor-view)
55+
56+
4157
## 方法
4258

4359
### importSchema

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

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

@@ -58,6 +59,7 @@ export interface ILowCodePluginContextPrivate {
5859
set canvas(canvas: IPublicApiCanvas);
5960
set workspace(workspace: IPublicApiWorkspace);
6061
set editorWindow(window: IPublicModelWindow);
62+
set registerLevel(level: IPublicEnumPluginRegisterLevel);
6163
}
6264
export interface ILowCodePluginContextApiAssembler {
6365
assembleApis(

packages/engine/src/engine-core.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import {
1818
IPublicTypeDisposable,
1919
IPublicApiPlugins,
2020
IPublicApiWorkspace,
21+
IPublicEnumPluginRegisterLevel,
2122
} from '@alilc/lowcode-types';
2223
import {
2324
Designer,
@@ -138,6 +139,7 @@ const pluginContextApiAssembler: ILowCodePluginContextApiAssembler = {
138139
context.plugins = plugins;
139140
context.logger = new Logger({ level: 'warn', bizName: `plugin:${pluginName}` });
140141
context.workspace = workspace;
142+
context.registerLevel = IPublicEnumPluginRegisterLevel.Default;
141143
},
142144
};
143145

packages/plugin-outline-pane/package.json

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,6 @@
1313
},
1414
"dependencies": {
1515
"@alifd/next": "^1.19.16",
16-
"@alilc/lowcode-designer": "1.1.6",
17-
"@alilc/lowcode-editor-core": "1.1.6",
1816
"@alilc/lowcode-types": "1.1.6",
1917
"@alilc/lowcode-utils": "1.1.6",
2018
"classnames": "^2.2.6",

packages/plugin-outline-pane/src/controllers/pane-controller.ts

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -16,16 +16,15 @@ import {
1616
IPublicModelDropLocation,
1717
IPublicModelScroller,
1818
IPublicModelScrollTarget,
19-
IPublicModelPluginContext,
2019
IPublicModelLocateEvent,
2120
} from '@alilc/lowcode-types';
2221
import TreeNode from './tree-node';
2322
import { IndentTrack } from '../helper/indent-track';
2423
import DwellTimer from '../helper/dwell-timer';
25-
import { ITreeBoard, TreeMaster } from './tree-master';
24+
import { IOutlinePanelPluginContext, ITreeBoard, TreeMaster } from './tree-master';
2625

2726
export class PaneController implements IPublicModelSensor, ITreeBoard, IPublicTypeScrollable {
28-
private pluginContext: IPublicModelPluginContext;
27+
private pluginContext: IOutlinePanelPluginContext;
2928

3029
private treeMaster?: TreeMaster;
3130

@@ -100,8 +99,8 @@ export class PaneController implements IPublicModelSensor, ITreeBoard, IPublicTy
10099

101100
private _shell: HTMLDivElement | null = null;
102101

103-
constructor(at: string | symbol, pluginContext: IPublicModelPluginContext, treeMaster: TreeMaster) {
104-
this.pluginContext = pluginContext;
102+
constructor(at: string | symbol, treeMaster: TreeMaster) {
103+
this.pluginContext = treeMaster.pluginContext;
105104
this.treeMaster = treeMaster;
106105
this.at = at;
107106
let inited = false;
@@ -237,7 +236,7 @@ export class PaneController implements IPublicModelSensor, ITreeBoard, IPublicTy
237236
let { node } = treeNode;
238237
if (isDragNodeObject(dragObject)) {
239238
const newNodes = operationalNodes;
240-
let i = newNodes.length;
239+
let i = newNodes?.length;
241240
let p: any = node;
242241
while (i-- > 0) {
243242
if (newNodes[i].contains(p)) {
@@ -482,7 +481,7 @@ export class PaneController implements IPublicModelSensor, ITreeBoard, IPublicTy
482481
const isSlotContainer = treeNode.hasSlots();
483482
const isContainer = treeNode.isContainer();
484483

485-
if (container.isSlot && !treeNode.expanded) {
484+
if (container.isSlotNode && !treeNode.expanded) {
486485
// 未展开,直接定位到内部第一个节点
487486
if (isSlotContainer) {
488487
detail.index = null;

packages/plugin-outline-pane/src/controllers/tree-master.ts

Lines changed: 126 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -1,69 +1,141 @@
11
import { isLocationChildrenDetail } from '@alilc/lowcode-utils';
2-
import { IPublicModelPluginContext, IPublicTypeActiveTarget, IPublicModelNode } from '@alilc/lowcode-types';
2+
import { IPublicModelPluginContext, IPublicTypeActiveTarget, IPublicModelNode, IPublicTypeDisposable, IPublicEnumPluginRegisterLevel } from '@alilc/lowcode-types';
33
import TreeNode from './tree-node';
44
import { Tree } from './tree';
5+
import EventEmitter from 'events';
6+
import { enUS, zhCN } from '../locale';
7+
import { ReactNode } from 'react';
58

69
export interface ITreeBoard {
710
readonly at: string | symbol;
811
scrollToNode(treeNode: TreeNode, detail?: any): void;
912
}
1013

14+
enum EVENT_NAMES {
15+
pluginContextChanged = 'pluginContextChanged',
16+
}
17+
18+
export interface IOutlinePanelPluginContext extends IPublicModelPluginContext {
19+
extraTitle?: string;
20+
intlNode(id: string, params?: object): ReactNode;
21+
intl(id: string, params?: object): string;
22+
getLocale(): string;
23+
}
24+
1125
export class TreeMaster {
12-
readonly pluginContext: IPublicModelPluginContext;
26+
pluginContext: IOutlinePanelPluginContext;
1327

1428
private boards = new Set<ITreeBoard>();
1529

1630
private treeMap = new Map<string, Tree>();
1731

18-
constructor(pluginContext: IPublicModelPluginContext) {
19-
this.pluginContext = pluginContext;
20-
let startTime: any;
21-
const { event, project, canvas } = this.pluginContext;
22-
canvas.dragon?.onDragstart(() => {
23-
startTime = Date.now() / 1000;
24-
// needs?
25-
this.toVision();
26-
});
27-
canvas.activeTracker?.onChange((target: IPublicTypeActiveTarget) => {
28-
const { node, detail } = target;
29-
const tree = this.currentTree;
30-
if (!tree/* || node.document !== tree.document */) {
31-
return;
32-
}
33-
const treeNode = tree.getTreeNode(node);
34-
if (detail && isLocationChildrenDetail(detail)) {
35-
treeNode.expand(true);
36-
} else {
37-
treeNode.expandParents();
38-
}
39-
this.boards.forEach((board) => {
40-
board.scrollToNode(treeNode, detail);
32+
private disposeEvents: (IPublicTypeDisposable | undefined)[] = [];
33+
34+
event = new EventEmitter();
35+
36+
constructor(pluginContext: IPublicModelPluginContext, readonly options: {
37+
extraTitle?: string;
38+
}) {
39+
this.setPluginContext(pluginContext);
40+
const { workspace } = this.pluginContext;
41+
this.initEvent();
42+
if (pluginContext.registerLevel === IPublicEnumPluginRegisterLevel.Workspace) {
43+
workspace.onWindowRendererReady(() => {
44+
this.setPluginContext(workspace.window?.currentEditorView);
45+
let dispose: IPublicTypeDisposable | undefined;
46+
const windowViewTypeChangeEvent = () => {
47+
dispose = workspace.window?.onChangeViewType(() => {
48+
this.setPluginContext(workspace.window?.currentEditorView);
49+
});
50+
};
51+
52+
windowViewTypeChangeEvent();
53+
54+
workspace.onChangeActiveWindow(() => {
55+
windowViewTypeChangeEvent();
56+
this.setPluginContext(workspace.window?.currentEditorView);
57+
dispose && dispose();
58+
});
4159
});
60+
}
61+
}
62+
63+
private setPluginContext(pluginContext: IPublicModelPluginContext | undefined) {
64+
if (!pluginContext) {
65+
return;
66+
}
67+
const { intl, intlNode, getLocale } = pluginContext.common.utils.createIntl({
68+
'en-US': enUS,
69+
'zh-CN': zhCN,
4270
});
43-
canvas.dragon?.onDragend(() => {
44-
const endTime: any = Date.now() / 1000;
45-
const nodes = project.currentDocument?.selection?.getNodes();
46-
event.emit('outlinePane.dragend', {
47-
selected: nodes
48-
?.map((n) => {
49-
if (!n) {
50-
return;
51-
}
52-
const npm = n?.componentMeta?.npm;
53-
return (
54-
[npm?.package, npm?.componentName].filter((item) => !!item).join('-') || n?.componentMeta?.componentName
55-
);
56-
})
57-
.join('&'),
58-
time: (endTime - startTime).toFixed(2),
59-
});
71+
let _pluginContext: IOutlinePanelPluginContext = Object.assign(pluginContext, {
72+
intl,
73+
intlNode,
74+
getLocale,
6075
});
61-
project.onRemoveDocument((data: {id: string}) => {
62-
const { id } = data;
63-
this.treeMap.delete(id);
76+
_pluginContext.extraTitle = this.options && this.options['extraTitle'];
77+
this.pluginContext = _pluginContext;
78+
this.disposeEvent();
79+
this.initEvent();
80+
this.emitPluginContextChange();
81+
}
82+
83+
private disposeEvent() {
84+
this.disposeEvents.forEach(d => {
85+
d && d();
6486
});
6587
}
6688

89+
private initEvent() {
90+
let startTime: any;
91+
const { event, project, canvas } = this.pluginContext;
92+
this.disposeEvents = [
93+
canvas.dragon?.onDragstart(() => {
94+
startTime = Date.now() / 1000;
95+
// needs?
96+
this.toVision();
97+
}),
98+
canvas.activeTracker?.onChange((target: IPublicTypeActiveTarget) => {
99+
const { node, detail } = target;
100+
const tree = this.currentTree;
101+
if (!tree/* || node.document !== tree.document */) {
102+
return;
103+
}
104+
const treeNode = tree.getTreeNode(node);
105+
if (detail && isLocationChildrenDetail(detail)) {
106+
treeNode.expand(true);
107+
} else {
108+
treeNode.expandParents();
109+
}
110+
this.boards.forEach((board) => {
111+
board.scrollToNode(treeNode, detail);
112+
});
113+
}),
114+
canvas.dragon?.onDragend(() => {
115+
const endTime: any = Date.now() / 1000;
116+
const nodes = project.currentDocument?.selection?.getNodes();
117+
event.emit('outlinePane.dragend', {
118+
selected: nodes
119+
?.map((n) => {
120+
if (!n) {
121+
return;
122+
}
123+
const npm = n?.componentMeta?.npm;
124+
return (
125+
[npm?.package, npm?.componentName].filter((item) => !!item).join('-') || n?.componentMeta?.componentName
126+
);
127+
})
128+
.join('&'),
129+
time: (endTime - startTime).toFixed(2),
130+
});
131+
}),
132+
project.onRemoveDocument((data: {id: string}) => {
133+
const { id } = data;
134+
this.treeMap.delete(id);
135+
}),
136+
];
137+
}
138+
67139
private toVision() {
68140
const tree = this.currentTree;
69141
if (tree) {
@@ -86,14 +158,22 @@ export class TreeMaster {
86158
// todo others purge
87159
}
88160

161+
onPluginContextChange(fn: () => void) {
162+
this.event.on(EVENT_NAMES.pluginContextChanged, fn);
163+
}
164+
165+
emitPluginContextChange() {
166+
this.event.emit(EVENT_NAMES.pluginContextChanged);
167+
}
168+
89169
get currentTree(): Tree | null {
90170
const doc = this.pluginContext.project.getCurrentDocument();
91171
if (doc) {
92172
const { id } = doc;
93173
if (this.treeMap.has(id)) {
94174
return this.treeMap.get(id)!;
95175
}
96-
const tree = new Tree(this.pluginContext);
176+
const tree = new Tree(this);
97177
this.treeMap.set(id, tree);
98178
return tree;
99179
}

packages/plugin-outline-pane/src/controllers/tree-node.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,12 @@ import {
22
IPublicTypeTitleContent,
33
IPublicTypeLocationChildrenDetail,
44
IPublicModelNode,
5-
IPublicModelPluginContext,
65
IPublicTypeDisposable,
76
} from '@alilc/lowcode-types';
87
import { isI18nData, isLocationChildrenDetail } from '@alilc/lowcode-utils';
98
import EventEmitter from 'events';
109
import { Tree } from './tree';
10+
import { IOutlinePanelPluginContext } from './tree-master';
1111

1212
/**
1313
* 大纲树过滤结果
@@ -38,7 +38,7 @@ enum EVENT_NAMES {
3838
}
3939

4040
export default class TreeNode {
41-
readonly pluginContext: IPublicModelPluginContext;
41+
readonly pluginContext: IOutlinePanelPluginContext;
4242
event = new EventEmitter();
4343

4444
private _node: IPublicModelNode;
@@ -160,9 +160,9 @@ export default class TreeNode {
160160
return this._node;
161161
}
162162

163-
constructor(tree: Tree, node: IPublicModelNode, pluginContext: IPublicModelPluginContext) {
163+
constructor(tree: Tree, node: IPublicModelNode) {
164164
this.tree = tree;
165-
this.pluginContext = pluginContext;
165+
this.pluginContext = tree.pluginContext;
166166
this._node = node;
167167
}
168168

0 commit comments

Comments
 (0)