feat: 无界渲染适配器

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

@@ -1,6 +1,6 @@
 import type { RouteRecordRaw } from 'vue-router';
 
-import RendererAdapter from '@sy/vue3-renderer-adapter';
+import WujieVueRendererAdapter from '@sy/wujie-vue3-renderer-adapter';
 
 import { VITE_RENDERER_URL } from '#/constants';
 
@@ -24,7 +24,7 @@ const routes: Array<RouteRecordRaw> = [
           keepAlive: true,
           icon: 'ant-design:list',
         },
-        component: RendererAdapter,
+        component: WujieVueRendererAdapter,
         props: {
           url: `${VITE_RENDERER_URL}`,
           accessToken: localStorage.getItem('y-code-access-token'),
@@ -40,7 +40,7 @@ const routes: Array<RouteRecordRaw> = [
           keepAlive: false,
           icon: 'ant-design:list',
         },
-        component: RendererAdapter,
+        component: WujieVueRendererAdapter,
         props: {
           url: `${VITE_RENDERER_URL}`,
           accessToken: localStorage.getItem('y-code-access-token'),

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

@@ -1,6 +1,6 @@
 import type { RouteRecordRaw } from 'vue-router';
 
-import RendererAdapter from '@sy/vue3-renderer-adapter';
+import WujieVueRendererAdapter from '@sy/wujie-vue3-renderer-adapter';
 
 import { VITE_RENDERER_URL } from '#/constants';
 
@@ -24,7 +24,7 @@ const routes: Array<RouteRecordRaw> = [
           keepAlive: false,
           icon: 'ant-design:list',
         },
-        component: RendererAdapter,
+        component: WujieVueRendererAdapter,
         props: {
           url: `${VITE_RENDERER_URL}`,
           accessToken: localStorage.getItem('y-code-access-token'),

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

@@ -1,15 +1,8 @@
 import type { RouteRecordRaw } from 'vue-router';
 
-import { h } from 'vue';
-
-import RendererAdapter from '@sy/vue3-renderer-adapter';
+import WujieVueRendererAdapter from '@sy/wujie-vue3-renderer-adapter';
 
 import { VITE_RENDERER_URL } from '#/constants';
-import {
-  LOW_CODE_APPLICATION_ID,
-  LOW_CODE_PROJECT_ID,
-} from '#/constants/low-code';
-import { useUserStore } from '#/store/user';
 
 // 微前端路由
 const moduleName = 'project';
@@ -31,17 +24,7 @@ const routes: Array<RouteRecordRaw> = [
           keepAlive: true,
           icon: 'ant-design:list',
         },
-        component: () => {
-          const userStore = useUserStore();
-          return h(RendererAdapter, {
-            url: VITE_RENDERER_URL,
-            name: 'y-code-platform-project-list',
-            applicationId: LOW_CODE_APPLICATION_ID,
-            projectId: LOW_CODE_PROJECT_ID,
-            fileId: '4g4mz6qi8u',
-            accessToken: userStore.token,
-          });
-        },
+        component: WujieVueRendererAdapter,
         props: {
           url: `${VITE_RENDERER_URL}`,
           accessToken: localStorage.getItem('y-code-access-token'),
@@ -57,7 +40,7 @@ const routes: Array<RouteRecordRaw> = [
           keepAlive: false,
           icon: 'ant-design:file',
         },
-        component: RendererAdapter,
+        component: WujieVueRendererAdapter,
         props: {
           url: `${VITE_RENDERER_URL}`,
           accessToken: localStorage.getItem('y-code-access-token'),

apps/renderer/src/App.vue

@@ -6,8 +6,15 @@ import { jsonp, request } from '@vtj/utils';
 import { createProvider } from '@vtj/web';
 import { ElLoading, ElMessage } from 'element-plus';
 
+import { getFile } from './io';
 import { LowCodeService } from './service';
 
+console.log('window', window);
+
+const rawWindow = window;
+
+console.log('window.$wujie', window.$wujie);
+
 // 定义 wujie props 的类型
 interface WujieProps {
   accessToken?: string;
@@ -19,15 +26,9 @@ interface WujieProps {
 }
 
 // 从 wujie props 获取数据，提供默认值
-const wujieProps: WujieProps = window.$wujie?.props || {
-  fileId,
-  projectId,
-};
+const wujieProps: WujieProps = window.$wujie?.props || {};
 console.log('wujie props:', wujieProps);
 
-// 文件加载时，清空一次 sessionStorage
-sessionStorage.clear();
-
 // 响应式状态
 const renderer = ref();
 const lowCodeService = new LowCodeService();
@@ -103,11 +104,15 @@ const getRenderComponent = async () => {
         const instance = getCurrentInstance();
         instance?.appContext.app.use(lowCodeProvider);
         try {
-          const renderComponent = await lowCodeProvider.getRenderComponent(
-            wujieProps.fileId,
+          const file = await getFile(wujieProps.fileId);
+          const { renderer } = await lowCodeProvider.createDslRenderer(
+            file.published_dsl,
+            {
+              // window: rawWindow,
+            },
           );
           console.log('渲染组件获取成功');
-          resolve(renderComponent);
+          resolve(renderer);
         } catch (error) {
           console.error('获取渲染组件失败:', error);
           ElMessage.error('获取渲染组件失败');