From b915accb7155ce3155ee3076d2d848ea1dd65f3e Mon Sep 17 00:00:00 2001
From: roymondchen <roymondchen@tencent.com>
Date: Tue, 13 Sep 2022 20:12:22 +0800
Subject: [PATCH] =?UTF-8?q?feat(editor):=20uiService=E6=94=AF=E6=8C=81?=
 =?UTF-8?q?=E6=8F=92=E4=BB=B6=E6=89=A9=E5=B1=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/editor/src/layouts/NavMenu.vue             |  2 +-
 packages/editor/src/layouts/workspace/Workspace.vue |  4 ++--
 packages/editor/src/services/ui.ts                  | 12 ++++++------
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/packages/editor/src/layouts/NavMenu.vue b/packages/editor/src/layouts/NavMenu.vue
index 43a04176..e5b3a659 100644
--- a/packages/editor/src/layouts/NavMenu.vue
+++ b/packages/editor/src/layouts/NavMenu.vue
@@ -123,7 +123,7 @@ const getConfig = (item: MenuItem): (MenuButton | MenuComponent)[] => {
         className: 'scale-to-fit',
         icon: markRaw(FullScreen),
         tooltip: `缩放以适应(${ctrl}+0)`,
-        handler: () => uiService?.set('zoom', uiService.calcZoom()),
+        handler: async () => uiService?.set('zoom', await uiService.calcZoom()),
       });
       break;
     case 'rule':
diff --git a/packages/editor/src/layouts/workspace/Workspace.vue b/packages/editor/src/layouts/workspace/Workspace.vue
index 41723206..41d51111 100644
--- a/packages/editor/src/layouts/workspace/Workspace.vue
+++ b/packages/editor/src/layouts/workspace/Workspace.vue
@@ -139,9 +139,9 @@ onMounted(() => {
       e.inputEvent.preventDefault();
       services?.uiService.zoom(-0.1);
     })
-    .keydown([ctrl, '0'], (e) => {
+    .keydown([ctrl, '0'], async (e) => {
       e.inputEvent.preventDefault();
-      services?.uiService.set('zoom', services.uiService.calcZoom());
+      services?.uiService.set('zoom', await services.uiService.calcZoom());
     })
     .keydown([ctrl, '1'], (e) => {
       e.inputEvent.preventDefault();
diff --git a/packages/editor/src/services/ui.ts b/packages/editor/src/services/ui.ts
index 14fdfdc2..97fd4627 100644
--- a/packages/editor/src/services/ui.ts
+++ b/packages/editor/src/services/ui.ts
@@ -59,7 +59,7 @@ const state = reactive<UiState>({
 
 class Ui extends BaseService {
   constructor() {
-    super([]);
+    super(['initColumnWidth', 'zoom', 'calcZoom']);
     globalThis.addEventListener('resize', () => {
       this.setColumnWidth({
         center: 'auto',
@@ -95,7 +95,7 @@ class Ui extends BaseService {
     return (state as any)[name];
   }
 
-  public initColumnWidth() {
+  public async initColumnWidth() {
     const columnWidthCacheData = globalThis.localStorage.getItem(COLUMN_WIDTH_STORAGE_KEY);
     if (columnWidthCacheData) {
       try {
@@ -107,12 +107,12 @@ class Ui extends BaseService {
     }
   }
 
-  public zoom(zoom: number) {
+  public async zoom(zoom: number) {
     this.set('zoom', (this.get<number>('zoom') * 100 + zoom * 100) / 100);
     if (this.get<number>('zoom') < 0.1) this.set('zoom', 0.1);
   }
 
-  public calcZoom() {
+  public async calcZoom() {
     const { stageRect, stageContainerRect } = state;
     const { height, width } = stageContainerRect;
     if (!width || !height) return 1;
@@ -162,12 +162,12 @@ class Ui extends BaseService {
     state.columnWidth = columnWidth;
   }
 
-  private setStageRect(value: StageRect) {
+  private async setStageRect(value: StageRect) {
     state.stageRect = {
       ...state.stageRect,
       ...value,
     };
-    state.zoom = this.calcZoom();
+    state.zoom = await this.calcZoom();
   }
 }