feat: 设计器可获取天梯 token

apps/designer/src/store/index.ts

@@ -20,12 +20,6 @@ export const useUserStore = defineStore('user', () => {
     localStorage.setItem('token', newToken);
   };
 
-  // 异步 action
-  const fetchProfile = async () => {
-    const { data } = await axios.get('/api/user/profile');
-    userProfile.value = data;
-  };
-
   // 清理方法
   const logout = () => {
     token.value = '';
@@ -38,7 +32,6 @@ export const useUserStore = defineStore('user', () => {
     userProfile,
     isLoggedIn,
     setToken,
-    fetchProfile,
     logout
   };
 });

apps/designer/src/views/index.vue

@@ -2,63 +2,60 @@
 import { ref } from 'vue';
 import Postmate from 'postmate';
 import { Engine, widgetManager } from '@vtj/pro';
-
+import { request, jsonp } from '@vtj/utils';
+import { useUserStore } from '@/store';
 import { LowCodeService } from '@/service';
 
 const container = ref();
 const service = new LowCodeService();
+const userStore = useUserStore();
 
 onMounted(async () => {
   // 数据模型
   const model = {
     name: '',
+    url: '',
     applicationId: -1,
-    url: ''
+    projectId: -1,
+    accessToken: ''
   };
 
-  const engine = new Engine({
-    container,
-    service,
-    project: {
-      id: 4,
-      name: 'test'
-    }
-  });
-  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', 'y-code-designer is ready');
+    Object.assign(model, parent.model);
+    // console.log('get parent model', model);
+    userStore.setToken(model.accessToken);
+    request.useRequest((req) => {
+      req.headers.set('Authorization', `Bearer ${model.accessToken}`);
+      return req;
+    });
+    const engine = new Engine({
+      container,
+      service,
+      project: {
+        // @ts-ignore
+        id: model.projectId,
+        name: model.name
+      },
+      adapter: {
+        request,
+        jsonp
       }
-    }
-  });
+    });
+    widgetManager.set('Previewer', {
+      props: {
+        path: (block: any) => {
+          const pathname = location.pathname;
+          return `${pathname}#/preview/${block.id}`;
+        }
+      }
+    });
 
-  widgetManager.set('Templates', {
-    invisible: true
+    widgetManager.set('Templates', {
+      invisible: true
+    });
   });
-
-  // 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>
 

apps/designer/src/views/preview.vue

@@ -6,7 +6,15 @@ import { ref, getCurrentInstance } from 'vue';
 import { useRoute } from 'vue-router';
 import { createProvider, ContextMode } from '@vtj/pro';
 import { LowCodeService } from '@/service';
+import { request, jsonp } from '@vtj/utils';
+import { useUserStore } from '@/store';
+
+const userStore = useUserStore();
 const service = new LowCodeService();
+request.useRequest((req) => {
+  req.headers.set('Authorization', `Bearer ${userStore.token}`);
+  return req;
+});
 const { provider, onReady } = createProvider({
   mode: ContextMode.Runtime,
   service,
@@ -14,6 +22,10 @@ const { provider, onReady } = createProvider({
     // @ts-ignore
     id: 4
   },
+  adapter: {
+    request,
+    jsonp
+  },
   dependencies: {
     Vue: () => import('vue'),
     VueRouter: () => import('vue-router'),