feat: added onChangeViewType event to window model

liujuping · JackLian · commit 0184dcd9384a · 2023-02-07T14:45:56.000+08:00
diff --git a/docs/docs/api/model/window.md b/docs/docs/api/model/window.md
@@ -62,3 +62,15 @@ function changeViewType(viewName: string): void
 ```typescript
 function save(): Promise(void)
 ```
+
+## 事件
+
+### onChangeViewType
+
+窗口视图变更事件
+
+```
+onChangeViewType(fn: (viewName: string) => void): IPublicTypeDisposable;
+```
+
+相关类型：[IPublicTypeDisposable](https://github.com/alibaba/lowcode-engine/blob/main/packages/types/src/shell/type/disposable.ts)
diff --git a/packages/shell/src/model/window.ts b/packages/shell/src/model/window.ts
@@ -1,5 +1,5 @@
 import { windowSymbol } from '../symbols';
-import { IPublicModelResource, IPublicModelWindow } from '@alilc/lowcode-types';
+import { IPublicModelResource, IPublicModelWindow, IPublicTypeDisposable } from '@alilc/lowcode-types';
 import { EditorWindow } from '@alilc/lowcode-workspace';
 import { Resource as ShellResource } from './resource';
 
@@ -31,7 +31,11 @@ export class Window implements IPublicModelWindow {
   }
 
   changeViewType(viewName: string) {
-    this[windowSymbol].changeViewType(viewName);
+    this[windowSymbol].changeViewType(viewName, false);
+  }
+
+  onChangeViewType(fun: (viewName: string) => void): IPublicTypeDisposable {
+    return this[windowSymbol].onChangeViewType(fun);
   }
 
   async save() {
diff --git a/packages/types/src/shell/model/window.ts b/packages/types/src/shell/model/window.ts
@@ -1,5 +1,5 @@
 import { ReactElement } from 'react';
-import { IPublicTypeNodeSchema } from '../type';
+import { IPublicTypeDisposable, IPublicTypeNodeSchema } from '../type';
 import { IPublicModelResource } from './resource';
 
 export interface IPublicModelWindow {
@@ -24,4 +24,7 @@ export interface IPublicModelWindow {
 
   /** 调用当前窗口视图保存钩子 */
   save(): Promise<any>;
+
+  /** 窗口视图变更事件 */
+  onChangeViewType(fn: (viewName: string) => void): IPublicTypeDisposable;
 }
diff --git a/packages/workspace/src/window.ts b/packages/workspace/src/window.ts
@@ -1,13 +1,16 @@
 import { uniqueId } from '@alilc/lowcode-utils';
-import { makeObservable, obx } from '@alilc/lowcode-editor-core';
+import { createModuleEventBus, IEventBus, makeObservable, obx } from '@alilc/lowcode-editor-core';
 import { Context } from './context/view-context';
 import { Workspace } from './workspace';
 import { Resource } from './resource';
+import { IPublicTypeDisposable } from '../../types/es/shell/type/disposable';
 
 export class EditorWindow {
   id: string = uniqueId('window');
   icon: React.ReactElement | undefined;
 
+  private emitter: IEventBus = createModuleEventBus('Project');
+
   @obx.ref editorView: Context;
 
   @obx editorViews: Map<string, Context> = new Map<string, Context>();
@@ -59,6 +62,14 @@ export class EditorWindow {
     }
   };
 
+  onChangeViewType(fn: (viewName: string) => void): IPublicTypeDisposable {
+    this.emitter.on('window.change.view.type', fn);
+
+    return () => {
+      this.emitter.off('window.change.view.type', fn);
+    };
+  }
+
   execViewTypesInit = async () => {
     const editorViews = this.resource.editorViews;
     for (let i = 0; i < editorViews.length; i++) {
@@ -81,10 +92,13 @@ export class EditorWindow {
     this.editorViews.set(name, editorView);
   };
 
-  changeViewType = (name: string) => {
+  changeViewType = (name: string, ignoreEmit: boolean = true) => {
     this.editorView?.setActivate(false);
     this.editorView = this.editorViews.get(name)!;
 
+    if (!ignoreEmit) {
+      this.emitter.emit('window.change.view.type', name);
+    }
     this.editorView.setActivate(true);
   };
 
