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'),

apps/platform/src/components/renderer-adapter/index.vue

@@ -2,8 +2,13 @@
   import { ref, onMounted } from 'vue';
   import { useRoute } from 'vue-router';
   import Postmate from 'postmate';
+  import { useUserStore } from '@/store/modules/user';
   // import { Spin, Alert, Button } from 'ant-design-vue';
 
+  const userStore = useUserStore();
+
+  console.log('userStore', userStore);
+
   const route = useRoute();
   // const MAX_RETRIES = 3;
 
@@ -27,6 +32,7 @@
       name: 'y-code-renderer',
       classListArray: ['responsive-iframe'],
       model: {
+        accessToken: userStore.token,
         name: route.meta?.app?.name,
         applicationId: route.meta?.app?.applicationId,
         projectId: route.meta?.app?.projectId,

apps/platform/src/router/routes/modules/acl.ts

@@ -0,0 +1,41 @@
+import type { RouteRecordRaw } from 'vue-router';
+import { Y_CODE_RENDERER_URL } from '@/constants';
+import { LOW_CODE_APPLICATION_ID, LOW_CODE_PROJECT_ID } from '@/constants/low-code';
+
+const moduleName = 'acl';
+
+const routes: Array<RouteRecordRaw> = [
+  {
+    path: '/acl',
+    name: moduleName,
+    redirect: '/acl/list',
+    meta: {
+      title: '权限管理',
+      icon: 'ant-design:user-outlined',
+    },
+    children: [
+      {
+        path: 'list',
+        name: `${moduleName}-list`,
+        meta: {
+          title: '权限列表',
+          keepAlive: true,
+          icon: 'ant-design:list',
+          app: {
+            url: Y_CODE_RENDERER_URL,
+            name: 'y-code-platform-project-list',
+            // sync: true,
+            // alive: true,
+            // degrade: true,
+            applicationId: LOW_CODE_APPLICATION_ID,
+            projectId: LOW_CODE_PROJECT_ID,
+            fileId: 'b91ra0ej4',
+          },
+        },
+        component: () => import('@/components/renderer-adapter/index.vue'),
+      },
+    ],
+  },
+];
+
+export default routes;

apps/platform/src/router/routes/modules/index.ts

@@ -4,4 +4,5 @@ import micro from './micro';
 import application from './application';
 import project from './project';
 import staticFile from './static-file';
-export default [...dashboard, ...user, ...micro, ...application, ...project, ...staticFile];
+import acl from './acl';
+export default [...dashboard, ...user, ...micro, ...application, ...project, ...staticFile, ...acl];

apps/platform/src/router/routes/modules/micro.ts

@@ -22,7 +22,7 @@ const routes: Array<RouteRecordRaw> = [
           app: {
             url: Y_CODE_DESIGNER_URL,
             name: 'y-code-designer',
-            applicationId: 4,
+            projectId: 4,
             sync: true,
             alive: true,
             degrade: true,

apps/platform/src/router/routes/modules/user.ts

@@ -18,7 +18,7 @@ const routes: Array<RouteRecordRaw> = [
         path: 'list',
         name: `${moduleName}-list`,
         meta: {
-          title: '项目列表',
+          title: '用户列表',
           keepAlive: true,
           icon: 'ant-design:list',
           app: {

apps/platform/src/router/routes/outsideLayout.ts

@@ -1,16 +1,16 @@
-import type { RouteRecordRaw } from 'vue-router';
-import { LOGIN_NAME } from '@/router/constant';
+// import type { RouteRecordRaw } from 'vue-router';
+// import { LOGIN_NAME } from '@/router/constant';
 
 /**
  * layout布局之外的路由
  */
-export const LoginRoute: RouteRecordRaw = {
-  path: '/login',
-  name: LOGIN_NAME,
-  component: () => import('@/views/login/index.vue'),
-  meta: {
-    title: '登录',
-  },
-};
+// export const LoginRoute: RouteRecordRaw = {
+//   path: '/login',
+//   name: LOGIN_NAME,
+//   component: () => import('@/views/login/index.vue'),
+//   meta: {
+//     title: '登录',
+//   },
+// };
 
-export default [LoginRoute];
+export default [];

apps/platform/src/store/modules/user.ts

@@ -31,16 +31,16 @@ export const useUserStore = defineStore(
     /** 登录 */
     const login = async () => {
       tianti.checkQuery();
-      setTimeout(() => {
-        const token = localStorage.getItem('y-code-access-token');
-        if (token) {
-          setToken(token);
+      const token = localStorage.getItem('y-code-access-token');
+      if (token) {
+        setToken(token);
+        setTimeout(() => {
           getCurrentUser().then((res) => {
             userInfo.value = res.data.data;
             console.log('userInfo', userInfo.value);
           });
-        }
-      }, 0);
+        }, 1000);
+      }
     };
     /** 登出 */
     const logout = async () => {

apps/renderer/package.json

@@ -25,6 +25,7 @@
     "@vtj/renderer": "^0.10.9",
     "@vtj/ui": "^0.10.9",
     "@vtj/web": "^0.10.9",
+    "@vtj/utils": "^0.10.9",
     "axios": "^1.8.1",
     "core-js": "^3.40.0",
     "element-plus": "^2.9.4",

apps/renderer/src/App.vue

@@ -6,6 +6,7 @@ import { createProvider } from '@vtj/web'
 import { useQuery } from '@tanstack/vue-query'
 import { LowCodeService } from './service'
 import { getFile } from './io'
+import { request, jsonp } from '@vtj/utils'
 // import * as VtjUI from '@vtj/ui'
 
 // 响应式状态
@@ -25,7 +26,8 @@ const model = {
   applicationId: -1,
   projectId: -1,
   fileId: '',
-  url: ''
+  url: '',
+  accessToken: ''
 }
 
 // 数据查询
@@ -33,24 +35,24 @@ const { data: file, isFetching } = useQuery({
   queryKey: ['getFile'],
   queryFn: async () => {
     await postmate.then((parent) => {
-      parent.emit('some-event', 'sync-context!')
-            parent.emit('some-event', 'sync-context!')
-      parent.emit('some-event', 'sync-context!')
-      parent.emit('some-event', 'sync-context!')
-
+      parent.emit('some-event', 'y-code-renderer is ready')
       Object.assign(model, parent.model)
-
       // console.log('model', model)
     })
 
     return getFile(model.fileId).then(() => {
+      request.useRequest((req) => {
+        req.headers.set('Authorization', `Bearer ${model.accessToken}`)
+        return req
+      })
       const { provider, onReady } = createProvider({
         nodeEnv: import.meta.env.NODE_ENV,
         service: lowCodeService,
         project: { id: model.projectId },
-        // components: {
-        //   ...VtjUI,
-        // }
+        adapter: {
+          request,
+          jsonp
+        }
       })
       onReady(async () => {
         const instance = getCurrentInstance()

pnpm-lock.yaml

@@ -466,6 +466,9 @@ importers:
       '@vtj/ui':
         specifier: ^0.10.9
         version: 0.10.9(typescript@5.8.2)(vue@3.5.13(typescript@5.8.2))
+      '@vtj/utils':
+        specifier: ^0.10.9
+        version: 0.10.9
       '@vtj/web':
         specifier: ^0.10.9
         version: 0.10.9(typescript@5.8.2)(vue@3.5.13(typescript@5.8.2))