feat: 各应用的设计器隔离
This commit is contained in:
parent
a4c5f633cf
commit
9a2f29e3e4
@ -5,8 +5,8 @@ VITE_NODE_ENV = 'development'
|
||||
VITE_BASE_URL = /
|
||||
|
||||
VITE_PORT = 10011
|
||||
# VITE_BASE_API_URL = 'https://custom-chart-pre-api.shiyue.com/'
|
||||
VITE_BASE_API_URL = 'https://custom-chart-api.shiyuegame.com/'
|
||||
VITE_BASE_API_URL = 'https://custom-chart-pre-api.shiyue.com/'
|
||||
# VITE_BASE_API_URL = 'https://custom-chart-api.shiyuegame.com/'
|
||||
|
||||
VITE_DEBUG_MODE = true
|
||||
|
||||
|
@ -25,7 +25,7 @@ onMounted(async () => {
|
||||
await handshake.then((parent) => {
|
||||
parent.emit('sync-context', 'y-code-designer is ready');
|
||||
Object.assign(model, parent.model);
|
||||
// console.log('get parent model', model);
|
||||
console.log('get parent model', model);
|
||||
userStore.setToken(model.accessToken);
|
||||
localStorage.setItem('y-code-access-token', model.accessToken);
|
||||
request.useRequest((req) => {
|
||||
@ -49,9 +49,7 @@ onMounted(async () => {
|
||||
widgetManager.set('Previewer', {
|
||||
props: {
|
||||
path: (block: any) => {
|
||||
console.log('block', block);
|
||||
const pathname = location.pathname;
|
||||
console.log('pathname', pathname);
|
||||
return `${pathname}#/preview/${block.id}`;
|
||||
}
|
||||
}
|
||||
@ -79,6 +77,5 @@ onMounted(async () => {
|
||||
.designer-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: calc(100vh - 126px);
|
||||
}
|
||||
</style>
|
||||
|
@ -2,7 +2,7 @@ import type { RouteRecordRaw } from 'vue-router';
|
||||
|
||||
import WujieVueRendererAdapter from '@sy/wujie-vue3-renderer-adapter';
|
||||
|
||||
import { VITE_RENDERER_URL } from '#/constants';
|
||||
import { LOW_CODE_PROJECT_ID, VITE_RENDERER_URL } from '#/constants';
|
||||
|
||||
const moduleName = 'acl';
|
||||
|
||||
@ -18,7 +18,7 @@ const routes: Array<RouteRecordRaw> = [
|
||||
children: [
|
||||
{
|
||||
path: 'list',
|
||||
name: `${moduleName}-list`,
|
||||
name: 'AclList',
|
||||
meta: {
|
||||
hideInMenu: true,
|
||||
title: '权限列表',
|
||||
@ -30,13 +30,13 @@ const routes: Array<RouteRecordRaw> = [
|
||||
url: `${VITE_RENDERER_URL}`,
|
||||
accessToken: localStorage.getItem('y-code-access-token'),
|
||||
fileId: '1hsd0407hf',
|
||||
projectId: '4',
|
||||
projectId: LOW_CODE_PROJECT_ID,
|
||||
degrade: false,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'user',
|
||||
name: `${moduleName}-user`,
|
||||
name: 'AclUser',
|
||||
meta: {
|
||||
title: '用户列表',
|
||||
keepAlive: true,
|
||||
@ -47,7 +47,7 @@ const routes: Array<RouteRecordRaw> = [
|
||||
url: `${VITE_RENDERER_URL}`,
|
||||
accessToken: localStorage.getItem('y-code-access-token'),
|
||||
fileId: '7pfu5radx',
|
||||
projectId: '4',
|
||||
projectId: LOW_CODE_PROJECT_ID,
|
||||
degrade: false,
|
||||
},
|
||||
},
|
||||
|
@ -2,7 +2,7 @@ import type { RouteRecordRaw } from 'vue-router';
|
||||
|
||||
import WujieVueRendererAdapter from '@sy/wujie-vue3-renderer-adapter';
|
||||
|
||||
import { VITE_RENDERER_URL } from '#/constants';
|
||||
import { LOW_CODE_PROJECT_ID, VITE_RENDERER_URL } from '#/constants';
|
||||
import { router } from '#/router';
|
||||
|
||||
// 微前端路由
|
||||
@ -11,7 +11,7 @@ const moduleName = 'application';
|
||||
const routes: Array<RouteRecordRaw> = [
|
||||
{
|
||||
path: '/application',
|
||||
name: moduleName,
|
||||
name: 'Application',
|
||||
meta: {
|
||||
title: '应用管理',
|
||||
icon: 'ant-design:appstore-outlined',
|
||||
@ -19,7 +19,7 @@ const routes: Array<RouteRecordRaw> = [
|
||||
children: [
|
||||
{
|
||||
path: 'list',
|
||||
name: `${moduleName}-list`,
|
||||
name: 'ApplicationList',
|
||||
meta: {
|
||||
title: '应用列表',
|
||||
keepAlive: false,
|
||||
@ -31,8 +31,8 @@ const routes: Array<RouteRecordRaw> = [
|
||||
url: `${VITE_RENDERER_URL}`,
|
||||
accessToken: localStorage.getItem('y-code-access-token'),
|
||||
fileId: 'b91n1y9yr',
|
||||
projectId: '4',
|
||||
getRouter: () => router,
|
||||
projectId: LOW_CODE_PROJECT_ID,
|
||||
router,
|
||||
route,
|
||||
degrade: false,
|
||||
height: '100%',
|
||||
|
@ -3,7 +3,13 @@ import type { RouteRecordRaw } from 'vue-router';
|
||||
import RendererAdapter from '@sy/vue3-renderer-adapter';
|
||||
import WujieVueRendererAdapter from '@sy/wujie-vue3-renderer-adapter';
|
||||
|
||||
import { VITE_DESIGNER_URL, VITE_RENDERER_URL, VITE_V1_URL } from '#/constants';
|
||||
import {
|
||||
isDevMode,
|
||||
LOW_CODE_PROJECT_ID,
|
||||
VITE_DESIGNER_URL,
|
||||
VITE_RENDERER_URL,
|
||||
VITE_V1_URL,
|
||||
} from '#/constants';
|
||||
|
||||
const moduleName = 'micro';
|
||||
|
||||
@ -17,34 +23,43 @@ const routes: RouteRecordRaw[] = [
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'designer',
|
||||
name: `${moduleName}-designer`,
|
||||
path: 'admin-designer',
|
||||
name: 'AdminDesigner',
|
||||
meta: {
|
||||
// keepAlive: false,
|
||||
title: '低代码编辑器',
|
||||
hideInMenu: !isDevMode,
|
||||
title: '平台设计器',
|
||||
icon: 'ant-design:edit-outlined',
|
||||
},
|
||||
// component: WujieVueRendererAdapter,
|
||||
// props: {
|
||||
// url: `${VITE_DESIGNER_URL}`,
|
||||
// fileId: '4g4mz6qi8u',
|
||||
// projectId: 4,
|
||||
// name: '4g4mz6qi8u',
|
||||
// sync: false,
|
||||
// degrade: false,
|
||||
// },
|
||||
component: RendererAdapter,
|
||||
props: {
|
||||
props: (route) => {
|
||||
return {
|
||||
url: `${VITE_DESIGNER_URL}`,
|
||||
accessToken: localStorage.getItem('y-code-access-token'),
|
||||
fileId: '4g4mz6qi8u',
|
||||
projectId: '4',
|
||||
name: 'y-code-designer',
|
||||
projectId: LOW_CODE_PROJECT_ID,
|
||||
name: 'admin-designer',
|
||||
route,
|
||||
};
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'y-code-designer',
|
||||
name: 'YCodeDesigner',
|
||||
meta: {
|
||||
title: '低代码设计器',
|
||||
icon: 'ant-design:edit-outlined',
|
||||
},
|
||||
component: RendererAdapter,
|
||||
props: (route) => {
|
||||
return {
|
||||
url: `${VITE_DESIGNER_URL}`,
|
||||
projectId: route.query.projectId,
|
||||
name: `y-code-designer-${route.params.projectId}`,
|
||||
route,
|
||||
};
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'y-code-v1',
|
||||
name: `${moduleName}-y-code-v1`,
|
||||
name: 'YCodeV1',
|
||||
meta: {
|
||||
keepAlive: false,
|
||||
title: '悦码 1.0',
|
||||
@ -68,7 +83,7 @@ const routes: RouteRecordRaw[] = [
|
||||
props: {
|
||||
url: `${VITE_RENDERER_URL}`,
|
||||
fileId: '45ud9h6n3',
|
||||
projectId: 4,
|
||||
projectId: LOW_CODE_PROJECT_ID,
|
||||
degrade: false,
|
||||
name: '45ud9h6n3',
|
||||
},
|
||||
|
@ -2,7 +2,7 @@ import type { RouteRecordRaw } from 'vue-router';
|
||||
|
||||
import WujieVueRendererAdapter from '@sy/wujie-vue3-renderer-adapter';
|
||||
|
||||
import { VITE_RENDERER_URL } from '#/constants';
|
||||
import { LOW_CODE_PROJECT_ID, VITE_RENDERER_URL } from '#/constants';
|
||||
import { router } from '#/router';
|
||||
|
||||
// 微前端路由
|
||||
@ -19,10 +19,9 @@ const routes: Array<RouteRecordRaw> = [
|
||||
children: [
|
||||
{
|
||||
path: 'list',
|
||||
name: `${moduleName}-list`,
|
||||
name: 'ProjectList',
|
||||
meta: {
|
||||
title: '项目列表',
|
||||
keepAlive: true,
|
||||
icon: 'ant-design:list',
|
||||
hideInMenu: true,
|
||||
},
|
||||
@ -32,20 +31,18 @@ const routes: Array<RouteRecordRaw> = [
|
||||
url: `${VITE_RENDERER_URL}`,
|
||||
accessToken: localStorage.getItem('y-code-access-token'),
|
||||
fileId: '4g4mz6qi8u',
|
||||
projectId: '4',
|
||||
// degrade: true,
|
||||
getRouter: () => router,
|
||||
projectId: LOW_CODE_PROJECT_ID,
|
||||
router,
|
||||
route,
|
||||
};
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'DSLFileList',
|
||||
name: `${moduleName}-DSL-file-list`,
|
||||
name: 'DSLFileList',
|
||||
meta: {
|
||||
hideInMenu: true,
|
||||
title: 'dsl 文件列表',
|
||||
keepAlive: false,
|
||||
icon: 'ant-design:file',
|
||||
},
|
||||
component: WujieVueRendererAdapter,
|
||||
@ -54,7 +51,7 @@ const routes: Array<RouteRecordRaw> = [
|
||||
url: `${VITE_RENDERER_URL}`,
|
||||
accessToken: localStorage.getItem('y-code-access-token'),
|
||||
fileId: '45ucatjys',
|
||||
projectId: '4',
|
||||
projectId: LOW_CODE_PROJECT_ID,
|
||||
getRouter: () => router,
|
||||
route,
|
||||
};
|
||||
|
@ -10,6 +10,11 @@ import { LowCodeService } from './service';
|
||||
|
||||
// 定义 wujie props 的类型
|
||||
interface WujieProps {
|
||||
// 增加一个 axios 请求拦截器
|
||||
interceptors?: {
|
||||
request?: (config: any) => any;
|
||||
response?: (response: any) => any;
|
||||
};
|
||||
accessToken?: string;
|
||||
applicationId?: number | string;
|
||||
fileId?: string;
|
||||
@ -33,6 +38,14 @@ const loadingInstance = ref(null);
|
||||
const initRequestConfig = (token: string) => {
|
||||
if (!token) return;
|
||||
|
||||
if (wujieProps.interceptors?.request) {
|
||||
request.useRequest(wujieProps.interceptors.request);
|
||||
}
|
||||
|
||||
if (wujieProps.interceptors?.response) {
|
||||
request.useResponse(wujieProps.interceptors.response);
|
||||
}
|
||||
|
||||
request.useRequest((req) => {
|
||||
req.headers.set('Authorization', `Bearer ${token}`);
|
||||
return req;
|
||||
@ -166,7 +179,12 @@ onMounted(async () => {
|
||||
|
||||
<template>
|
||||
<div class="renderer-container">
|
||||
<component :is="renderer" v-if="renderer" v-bind="wujieProps" />
|
||||
<component
|
||||
:is="renderer"
|
||||
v-if="renderer"
|
||||
:ctx-props="wujieProps"
|
||||
v-bind="wujieProps"
|
||||
/>
|
||||
|
||||
<div v-else-if="!isLoading && isError" class="error-message">
|
||||
组件加载失败,请检查参数和网络连接
|
||||
|
@ -16,8 +16,9 @@ export class LowCodeService extends BaseService {
|
||||
public async init(project: ProjectSchema) {
|
||||
// @ts-ignore 忽略错误
|
||||
const remoteProject = await getProject(project.id);
|
||||
const model = new ProjectModel(remoteProject);
|
||||
const dsl = model.toDsl();
|
||||
return dsl;
|
||||
const projectModel = new ProjectModel(remoteProject);
|
||||
const projectDSL = projectModel.toDsl();
|
||||
console.log('project dsl', projectDSL);
|
||||
return projectDSL;
|
||||
}
|
||||
}
|
||||
|
@ -85,7 +85,7 @@ function transformComponent(
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="relative h-full">
|
||||
<div class="relative h-full" style="height: calc(100vh - 126px)">
|
||||
<IFrameRouterView />
|
||||
<RouterView v-slot="{ Component, route }">
|
||||
<Transition :name="getTransitionName(route)" appear mode="out-in">
|
||||
|
@ -63,7 +63,7 @@ const initPostmate = async () => {
|
||||
console.log('ctx.parent', ctx.parent);
|
||||
console.log('ctx.parent.innerHeight', ctx.parent.innerHeight);
|
||||
ctx.frame.style.height = `${ctx.parent.innerHeight - 38 - 88}px`;
|
||||
ctx.frame.style.minHeight = `800px`;
|
||||
// ctx.frame.style.minHeight = `800px`;
|
||||
ctx.frame.style.width = '100%';
|
||||
// @ts-ignore 忽略 console
|
||||
console.log(`${props.name} 连接成功`, ctx);
|
||||
|
@ -20,6 +20,7 @@ const props = withDefaults(
|
||||
payload?: Record<string, any>;
|
||||
projectId: number;
|
||||
route: RouteRecordRaw;
|
||||
router: Router;
|
||||
sync: boolean;
|
||||
url: string;
|
||||
}>(),
|
||||
|
Loading…
x
Reference in New Issue
Block a user