feat: 可通过配置入参来初始化编辑器

apps/designer/src/views/index.vue

@@ -1,40 +1,50 @@
-<template>
-  <div class="designer-container" ref="container"></div>
-</template>
-
 <script lang="ts" setup>
 import { ref } from 'vue';
-import {
-  Engine,
-  widgetManager
-  // type ProjectModel
-} from '@vtj/pro';
+import Postmate from 'postmate';
+import { Engine, widgetManager } from '@vtj/pro';
 
 import { LowCodeService } from '@/service';
 
 const container = ref();
 const service = new LowCodeService();
 
-const engine = new Engine({
-  container,
-  service,
-  project: {
-    // @ts-ignore
-    id: 4,
-    name: '低代码平台'
-  }
-});
+onMounted(async () => {
+  // 数据模型
+  const model = {
+    name: '',
+    applicationId: -1,
+    url: ''
+  };
 
-widgetManager.set('Previewer', {
-  props: {
-    path: (block: any) => {
-      const pathname = location.pathname;
-      return `${pathname}#/preview/${block.id}`;
-    }
-  }
+  const handshake = new Postmate.Model({});
+  await handshake.then((parent) => {
+    parent.emit('sync-context', 'Hello, World!');
+    Object.assign(model, parent.model);
+    console.log('model', model);
+    const engine = new Engine({
+      container,
+      service,
+      project: {
+        id: model.applicationId,
+        name: model.name
+      }
+    });
+    widgetManager.set('Previewer', {
+      props: {
+        path: (block: any) => {
+          const pathname = location.pathname;
+          return `${pathname}#/preview/${block.id}`;
+        }
+      }
+    });
+  });
 });
 </script>
 
+<template>
+  <div class="designer-container" ref="container"></div>
+</template>
+
 <style scoped>
 .designer-container {
   height: 100%;