chore: vtj 依赖更新,微应用集成 postmate
This commit is contained in:
parent
11018965bd
commit
f7468bde86
@ -16,17 +16,17 @@
|
||||
"clean": "rimraf node_modules"
|
||||
},
|
||||
"dependencies": {
|
||||
"@vtj/core": "^0.9.30",
|
||||
"@vtj/icons": "0.9.30",
|
||||
"@vtj/designer": "0.9.30",
|
||||
"@vtj/local": "^0.9.30",
|
||||
"@vtj/materials": "^0.9.30",
|
||||
"@vtj/node": "0.9.6",
|
||||
"@vtj/pro": "^0.9.30",
|
||||
"@vtj/renderer": "^0.9.30",
|
||||
"@vtj/ui": "^0.9.30",
|
||||
"@vtj/utils": "0.9.30",
|
||||
"@vtj/web": "^0.9.30",
|
||||
"@vtj/core": "^0.10.4",
|
||||
"@vtj/designer": "0.10.4",
|
||||
"@vtj/icons": "0.10.4",
|
||||
"@vtj/local": "^0.10.4",
|
||||
"@vtj/materials": "^0.10.4",
|
||||
"@vtj/node": "0.10.1",
|
||||
"@vtj/pro": "^0.10.4",
|
||||
"@vtj/renderer": "^0.10.4",
|
||||
"@vtj/ui": "^0.10.4",
|
||||
"@vtj/utils": "0.10.4",
|
||||
"@vtj/web": "^0.10.4",
|
||||
"element-plus": "^2.9.4",
|
||||
"licia-es": "^1.46.0",
|
||||
"vue": "~3.5.13",
|
||||
@ -34,8 +34,8 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@sy/vite-plugin-http2-proxy": "workspace:*",
|
||||
"@vtj/cli": "^0.9.8",
|
||||
"vite": "^6.1.1",
|
||||
"@vtj/cli": "^0.10.1",
|
||||
"vite": "^6.2.0",
|
||||
"vite-plugin-mkcert": "^1.17.6"
|
||||
},
|
||||
"packageManager": "pnpm@10.4.1"
|
||||
|
@ -29,6 +29,8 @@
|
||||
"dependencies": {
|
||||
"@ant-design/icons-vue": "~7.0.1",
|
||||
"@iconify/vue": "^4.3.0",
|
||||
"@iframe-resizer/parent": "^5.3.3",
|
||||
"@sy/low-code-renderer-adapter": "workspace:*",
|
||||
"@vueuse/core": "~11.1.0",
|
||||
"ant-design-vue": "~4.2.6",
|
||||
"axios": "~1.7.9",
|
||||
@ -42,6 +44,7 @@
|
||||
"nprogress": "1.0.0-1",
|
||||
"pinia": "~2.2.8",
|
||||
"pinia-plugin-persistedstate": "^4.2.0",
|
||||
"postmate": "^1.5.2",
|
||||
"qs": "~6.13.1",
|
||||
"sortablejs": "~1.15.6",
|
||||
"vue": "~3.5.13",
|
||||
@ -49,7 +52,7 @@
|
||||
"vue-router": "~4.4.5",
|
||||
"vue-types": "~5.1.3",
|
||||
"vue-virtual-scroller": "2.0.0-beta.8",
|
||||
"wujie-vue3": "^1.0.24",
|
||||
"wujie": "^1.0.25",
|
||||
"xlsx": "~0.18.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
@ -1,4 +1,5 @@
|
||||
<template>
|
||||
<!-- <div id="container" /> -->
|
||||
<iframe
|
||||
ref="iframeRef"
|
||||
width="100%"
|
||||
@ -10,8 +11,23 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onMounted } from 'vue';
|
||||
import { setupApp, startApp } from 'wujie';
|
||||
import { useRoute } from 'vue-router';
|
||||
import WujieVue from 'wujie-vue3';
|
||||
|
||||
const route = useRoute();
|
||||
console.log(route.meta?.app);
|
||||
// onMounted(() => {
|
||||
// setupApp({
|
||||
// el: '#container',
|
||||
// ...route.meta?.app,
|
||||
// });
|
||||
// startApp({ ...route.meta?.app });
|
||||
// });
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
#container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
118
apps/platform/src/components/renderer-adapter/index.vue
Normal file
118
apps/platform/src/components/renderer-adapter/index.vue
Normal file
@ -0,0 +1,118 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import Postmate from 'postmate';
|
||||
import { Spin, Alert, Button } from 'ant-design-vue';
|
||||
|
||||
const route = useRoute();
|
||||
const MAX_RETRIES = 3;
|
||||
|
||||
const loading = ref(true);
|
||||
const errorMessage = ref('');
|
||||
const retryCount = ref(0);
|
||||
|
||||
const initPostmate = async () => {
|
||||
loading.value = true;
|
||||
errorMessage.value = '';
|
||||
const container = document.getElementById('low-code-adapter');
|
||||
console.log('container', container);
|
||||
if (!container) {
|
||||
errorMessage.value = '容器元素未找到';
|
||||
loading.value = false;
|
||||
return;
|
||||
}
|
||||
|
||||
const handle = new Postmate({
|
||||
container,
|
||||
url: route.meta?.app?.url,
|
||||
name: 'low-code-renderer',
|
||||
classListArray: ['responsive-iframe'],
|
||||
model: {
|
||||
id: route.meta?.app?.url,
|
||||
},
|
||||
});
|
||||
|
||||
handle
|
||||
.then((instance) => {
|
||||
console.log('Postmate连接成功', instance);
|
||||
retryCount.value = 0; // 重置重试计数器
|
||||
})
|
||||
.catch((err) => {
|
||||
retryCount.value++;
|
||||
errorMessage.value = `连接失败: ${err.message}`;
|
||||
if (retryCount.value < MAX_RETRIES) {
|
||||
initPostmate(); // 自动重试
|
||||
} else {
|
||||
errorMessage.value = '已达到最大重试次数,请检查网络连接';
|
||||
}
|
||||
})
|
||||
.finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
initPostmate();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="iframe-container">
|
||||
<div id="low-code-adapter" />
|
||||
|
||||
<!-- <div v-if="loading" class="loading-overlay">
|
||||
<Spin :tip="`正在连接应用(${retryCount + 1}/${MAX_RETRIES})`" />
|
||||
</div> -->
|
||||
|
||||
<!-- <div v-if="errorMessage" class="error-overlay">
|
||||
<Alert type="error" :message="errorMessage" show-icon />
|
||||
<Button v-if="retryCount < MAX_RETRIES" @click="initPostmate">重新连接</Button>
|
||||
</div> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.responsive-iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: none;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.iframe-container {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#low-code-adapter {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.loading-overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.error-overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(255, 255, 255, 0.8);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 1001;
|
||||
}
|
||||
</style>
|
@ -1,5 +1,5 @@
|
||||
import { createApp } from 'vue';
|
||||
import Wujie from 'wujie-vue3';
|
||||
// import Wujie from 'wujie-vue3';
|
||||
import dayjs from 'dayjs';
|
||||
import customParseFormat from 'dayjs/plugin/customParseFormat';
|
||||
import utc from 'dayjs/plugin/utc';
|
||||
@ -29,7 +29,7 @@ function setupPlugins() {
|
||||
}
|
||||
|
||||
async function setupApp() {
|
||||
app.use(Wujie);
|
||||
// app.use(Wujie);
|
||||
|
||||
// 设置时区为上海
|
||||
dayjs.tz.setDefault('Asia/Shanghai');
|
||||
|
36
apps/platform/src/router/routes/modules/application.ts
Normal file
36
apps/platform/src/router/routes/modules/application.ts
Normal file
@ -0,0 +1,36 @@
|
||||
import type { RouteRecordRaw } from 'vue-router';
|
||||
|
||||
// 微前端路由
|
||||
const moduleName = 'application';
|
||||
|
||||
const routes: Array<RouteRecordRaw> = [
|
||||
{
|
||||
path: '/application',
|
||||
name: moduleName,
|
||||
meta: {
|
||||
title: '应用管理',
|
||||
icon: 'ant-design:appstore-outlined',
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: 'list',
|
||||
name: `${moduleName}-list`,
|
||||
meta: {
|
||||
title: '应用列表',
|
||||
keepAlive: true,
|
||||
icon: 'ant-design:list',
|
||||
app: {
|
||||
url: 'https://localhost:10010',
|
||||
name: 'low-code-platform-application-list',
|
||||
sync: true,
|
||||
alive: true,
|
||||
degrade: true,
|
||||
},
|
||||
},
|
||||
component: () => import('@/components/renderer-adapter/index.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
export default routes;
|
@ -1,5 +1,6 @@
|
||||
import dashboard from './dashboard';
|
||||
import user from './user';
|
||||
import micro from './micro';
|
||||
import application from './application';
|
||||
|
||||
export default [...dashboard, ...user, ...micro];
|
||||
export default [...dashboard, ...user, ...micro, ...application];
|
||||
|
@ -21,9 +21,9 @@ const routes: Array<RouteRecordRaw> = [
|
||||
app: {
|
||||
url: 'https://localhost:10011',
|
||||
name: 'low-code-designer',
|
||||
sync: true,
|
||||
alive: true,
|
||||
degrade: true,
|
||||
// sync: true,
|
||||
// alive: true,
|
||||
// degrade: true,
|
||||
},
|
||||
},
|
||||
component: () => import('@/components/micro-container/index.vue'),
|
||||
@ -41,7 +41,7 @@ const routes: Array<RouteRecordRaw> = [
|
||||
name: 'low-code-renderer',
|
||||
// sync: true,
|
||||
// alive: true,
|
||||
// degrade: true,
|
||||
degrade: true,
|
||||
},
|
||||
},
|
||||
component: () => import('@/components/micro-container/index.vue'),
|
||||
@ -59,7 +59,7 @@ const routes: Array<RouteRecordRaw> = [
|
||||
name: 'y-code-v1',
|
||||
// sync: true,
|
||||
// alive: true,
|
||||
// degrade: true,
|
||||
degrade: true,
|
||||
},
|
||||
},
|
||||
component: () => import('@/components/micro-container/index.vue'),
|
||||
|
@ -44,6 +44,7 @@ export default ({ command, mode }: ConfigEnv): UserConfig => {
|
||||
},
|
||||
server: {
|
||||
open: true,
|
||||
host: true,
|
||||
},
|
||||
plugins: [
|
||||
vue(),
|
||||
|
@ -1,8 +1,9 @@
|
||||
{
|
||||
"name": "@sy/low-code-renderer",
|
||||
"version": "1.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "farm start",
|
||||
"dev": "farm dev",
|
||||
"start": "farm start",
|
||||
"build": "farm build",
|
||||
"preview": "farm preview",
|
||||
@ -12,14 +13,17 @@
|
||||
"clean": "rimraf node_modules"
|
||||
},
|
||||
"dependencies": {
|
||||
"@iframe-resizer/child": "^5.3.3",
|
||||
"@sy/low-code-shared": "workspace:*",
|
||||
"@sy/web-vitals": "workspace:*",
|
||||
"@vtj/core": "^0.9.30",
|
||||
"@vtj/materials": "^0.9.30",
|
||||
"@vtj/renderer": "^0.9.30",
|
||||
"@vtj/core": "^0.10.4",
|
||||
"@vtj/icons": "0.10.4",
|
||||
"@vtj/materials": "^0.10.4",
|
||||
"@vtj/renderer": "^0.10.4",
|
||||
"core-js": "^3.40.0",
|
||||
"element-plus": "^2.9.4",
|
||||
"licia-es": "^1.46.0",
|
||||
"postmate": "^1.5.2",
|
||||
"rrweb": "2.0.0-alpha.4",
|
||||
"vue": "^3.5.13"
|
||||
},
|
||||
@ -27,7 +31,7 @@
|
||||
"@farmfe/cli": "^1.0.4",
|
||||
"@farmfe/core": "^1.6.6",
|
||||
"@sy/vite-plugin-http2-proxy": "workspace:*",
|
||||
"@vitejs/plugin-vue": "^5.2.1",
|
||||
"vite-plugin-mkcert": "^1.17.6"
|
||||
"vite-plugin-mkcert": "^1.17.6",
|
||||
"@vitejs/plugin-vue": "^5.2.1"
|
||||
}
|
||||
}
|
@ -1,12 +1,19 @@
|
||||
<script setup lang="ts">
|
||||
import { onMounted } from 'vue';
|
||||
import Postmate from 'postmate';
|
||||
import { createRenderer } from '@vtj/renderer'
|
||||
import { type BlockSchema } from '@vtj/core'
|
||||
|
||||
const dsl: BlockSchema = {
|
||||
"name": "Tes",
|
||||
"name": "ProjectList",
|
||||
"locked": false,
|
||||
"inject": [],
|
||||
"state": {},
|
||||
"state": {
|
||||
"editModalVisible": {
|
||||
"type": "JSExpression",
|
||||
"value": "false"
|
||||
}
|
||||
},
|
||||
"lifeCycles": {},
|
||||
"methods": {},
|
||||
"computed": {},
|
||||
@ -17,18 +24,76 @@ const dsl: BlockSchema = {
|
||||
"slots": [],
|
||||
"dataSources": {},
|
||||
"__VTJ_BLOCK__": true,
|
||||
"__VERSION__": "1739787968332",
|
||||
"id": "45t6ex2qh",
|
||||
"__VERSION__": "1740469448492",
|
||||
"id": "cmc7fwbj7e",
|
||||
"nodes": [
|
||||
{
|
||||
"id": "esmzkcp2p",
|
||||
"id": "lvv6dsl62",
|
||||
"name": "ElTable",
|
||||
"from": "element-plus",
|
||||
"invisible": false,
|
||||
"locked": false,
|
||||
"children": [
|
||||
{
|
||||
"id": "pfh43lnvu",
|
||||
"name": "ElTableColumn",
|
||||
"from": "element-plus",
|
||||
"invisible": false,
|
||||
"locked": false,
|
||||
"children": "",
|
||||
"props": {
|
||||
"prop": "id",
|
||||
"label": "项目 id",
|
||||
"fixed": "left",
|
||||
"index": 1
|
||||
},
|
||||
"directives": [],
|
||||
"events": {}
|
||||
},
|
||||
{
|
||||
"id": "sz31teqlm",
|
||||
"name": "ElTableColumn",
|
||||
"from": "element-plus",
|
||||
"invisible": false,
|
||||
"locked": false,
|
||||
"children": [],
|
||||
"props": {
|
||||
"prop": "name",
|
||||
"label": "项目名称"
|
||||
},
|
||||
"directives": [],
|
||||
"events": {}
|
||||
},
|
||||
{
|
||||
"id": "wiozj7tbe",
|
||||
"name": "ElTableColumn",
|
||||
"from": "element-plus",
|
||||
"invisible": false,
|
||||
"locked": false,
|
||||
"children": [
|
||||
{
|
||||
"id": "2320850l3f",
|
||||
"name": "ElButton",
|
||||
"from": "element-plus",
|
||||
"invisible": false,
|
||||
"locked": false,
|
||||
"children": "按钮",
|
||||
"slot": {
|
||||
"name": "default",
|
||||
"params": [
|
||||
"row",
|
||||
"column",
|
||||
"$index"
|
||||
]
|
||||
},
|
||||
"children": "编辑",
|
||||
"props": {
|
||||
"type": "primary"
|
||||
"type": "primary",
|
||||
"size": "small",
|
||||
"plain": false,
|
||||
"text": true,
|
||||
"bg": false,
|
||||
"loadingIcon": "Loading",
|
||||
"icon": "Edit"
|
||||
},
|
||||
"directives": [],
|
||||
"events": {
|
||||
@ -36,71 +101,143 @@ const dsl: BlockSchema = {
|
||||
"name": "click",
|
||||
"handler": {
|
||||
"type": "JSFunction",
|
||||
"value": "() => {\r\n console.log('1231111')\r\n}"
|
||||
"value": "() => {\r\n console.log('window', window)\r\n console.log('this.context.row', this.context.row)\r\n // this.state.editModalVisible = true\r\n const routers = this.$router.getRoutes()\r\n console.log('routers', routers)\r\n console.log('this.$router', this.$router)\r\n}"
|
||||
},
|
||||
"modifiers": {}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "26lluhulco",
|
||||
"name": "ElImage",
|
||||
"from": "element-plus",
|
||||
"invisible": false,
|
||||
"locked": false,
|
||||
"children": [],
|
||||
}
|
||||
],
|
||||
"props": {
|
||||
"style": {
|
||||
"width": "100px",
|
||||
"height": "100px"
|
||||
},
|
||||
"src": "https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg",
|
||||
"previewSrcList": [
|
||||
"https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg",
|
||||
"https://fuss10.elemecdn.com/1/34/19aa98b1fcb2781c4fba33d850549jpeg.jpeg",
|
||||
"https://fuss10.elemecdn.com/0/6f/e35ff375812e6b0020b6b4e8f9583jpeg.jpeg",
|
||||
"https://fuss10.elemecdn.com/9/bb/e27858e973f5d7d3904835f46abbdjpeg.jpeg",
|
||||
"https://fuss10.elemecdn.com/d/e6/c4d93a3805b3ce3f323f7974e6f78jpeg.jpeg",
|
||||
"https://fuss10.elemecdn.com/3/28/bbf893f792f03a54408b3b7a7ebf0jpeg.jpeg",
|
||||
"https://fuss10.elemecdn.com/2/11/6535bcfb26e4c79b48ddde44f4b6fjpeg.jpeg"
|
||||
]
|
||||
"prop": "address",
|
||||
"label": "操作",
|
||||
"fixed": "right"
|
||||
},
|
||||
"directives": [],
|
||||
"events": {}
|
||||
},
|
||||
{
|
||||
"id": "45t6mmt7r",
|
||||
"name": "ElDialog",
|
||||
"from": "element-plus",
|
||||
"invisible": false,
|
||||
"locked": false,
|
||||
"children": "对话框弹窗内容",
|
||||
}
|
||||
],
|
||||
"props": {
|
||||
"title": "标题",
|
||||
"modelValue": true
|
||||
},
|
||||
"directives": [],
|
||||
"events": {}
|
||||
},
|
||||
"data": [
|
||||
{
|
||||
"id": "7pf44qdhl",
|
||||
"name": "ElContainer",
|
||||
"from": "element-plus",
|
||||
"invisible": false,
|
||||
"locked": false,
|
||||
"children": [],
|
||||
"props": {
|
||||
"style": {
|
||||
"width": "100%",
|
||||
"height": "100%"
|
||||
"id": "1",
|
||||
"name": "miniapp",
|
||||
"actions": {
|
||||
"edit": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "2",
|
||||
"name": "mobile",
|
||||
"actions": {
|
||||
"edit": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "3",
|
||||
"name": "web",
|
||||
"actions": {
|
||||
"edit": true
|
||||
}
|
||||
}
|
||||
],
|
||||
"size": "small",
|
||||
"highlightCurrentRow": true,
|
||||
"show-summary": false,
|
||||
"lazy": true,
|
||||
"scrollbar-always-on": true,
|
||||
"flexible": true,
|
||||
"stripe": true,
|
||||
"showHeader": true
|
||||
},
|
||||
"directives": [],
|
||||
"events": {}
|
||||
},
|
||||
{
|
||||
"id": "8l081hgwdy",
|
||||
"name": "AModal",
|
||||
"from": "ant-design-vue",
|
||||
"invisible": false,
|
||||
"locked": false,
|
||||
"children": [
|
||||
{
|
||||
"id": "8ojtz79z3q",
|
||||
"name": "p",
|
||||
"from": "",
|
||||
"invisible": false,
|
||||
"locked": false,
|
||||
"children": "Some contents...",
|
||||
"props": {},
|
||||
"directives": [],
|
||||
"events": {}
|
||||
},
|
||||
{
|
||||
"id": "8s3fwx31ti",
|
||||
"name": "p",
|
||||
"from": "",
|
||||
"invisible": false,
|
||||
"locked": false,
|
||||
"children": "Some contents...",
|
||||
"props": {},
|
||||
"directives": [],
|
||||
"events": {}
|
||||
},
|
||||
{
|
||||
"id": "8vn1umw4ja",
|
||||
"name": "p",
|
||||
"from": "",
|
||||
"invisible": false,
|
||||
"locked": false,
|
||||
"children": "Some contents...",
|
||||
"props": {},
|
||||
"directives": [],
|
||||
"events": {}
|
||||
}
|
||||
],
|
||||
"props": {
|
||||
"open": true,
|
||||
"title": "Basic Modal"
|
||||
},
|
||||
"directives": [
|
||||
{
|
||||
"id": "9v357t0ryi",
|
||||
"name": "vIf",
|
||||
"value": {
|
||||
"type": "JSExpression",
|
||||
"value": "this.state.editModalVisible"
|
||||
}
|
||||
}
|
||||
],
|
||||
"events": {
|
||||
"cancel": {
|
||||
"name": "cancel",
|
||||
"handler": {
|
||||
"type": "JSFunction",
|
||||
"value": "() => {\r\n this.state.editModalVisible = false\r\n}"
|
||||
},
|
||||
"modifiers": {}
|
||||
},
|
||||
"ok": {
|
||||
"name": "ok",
|
||||
"handler": {
|
||||
"type": "JSFunction",
|
||||
"value": "() => {\r\n this.state.editModalVisible = false\r\n}"
|
||||
},
|
||||
"modifiers": {}
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
const handshake = new Postmate.Model({});
|
||||
|
||||
handshake.then(parent => {
|
||||
parent.emit('sync-context', 'Hello, World!');
|
||||
});
|
||||
});
|
||||
|
||||
const { renderer } = createRenderer({
|
||||
dsl,
|
||||
});
|
||||
|
@ -1,9 +1,10 @@
|
||||
import { createApp } from "vue";
|
||||
import "@sy/web-vitals";
|
||||
import { IconsPlugin } from "@vtj/icons";
|
||||
// import "@sy/low-code-shared/styles/reset.css";
|
||||
|
||||
import App from "./App.vue";
|
||||
import ElementPlus from "element-plus";
|
||||
import "element-plus/dist/index.css";
|
||||
|
||||
createApp(App).use(ElementPlus).mount("#low-code-renderer");
|
||||
createApp(App).use(ElementPlus).use(IconsPlugin).mount("#low-code-renderer");
|
||||
|
@ -1,25 +1,18 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2020",
|
||||
"useDefineForClassFields": true,
|
||||
"module": "ESNext",
|
||||
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||
"skipLibCheck": true,
|
||||
|
||||
/* Bundler mode */
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": true,
|
||||
"jsx": "preserve",
|
||||
|
||||
/* Linting */
|
||||
"strict": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"noFallthroughCasesInSwitch": true
|
||||
},
|
||||
"include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"],
|
||||
"references": [{ "path": "./tsconfig.node.json" }]
|
||||
"noUnusedLocals": false,
|
||||
"noUnusedParameters": false,
|
||||
"baseUrl": "./",
|
||||
"paths": {
|
||||
"@/*": ["src/*"],
|
||||
"$vtj/*": [".vtj/*"]
|
||||
}
|
||||
},
|
||||
"include": ["src"],
|
||||
"exclude": [".vtj"],
|
||||
"references": [
|
||||
{
|
||||
"path": "./tsconfig.node.json"
|
||||
}
|
||||
]
|
||||
}
|
@ -4,8 +4,7 @@
|
||||
"skipLibCheck": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "bundler",
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"strict": true
|
||||
"allowSyntheticDefaultImports": true
|
||||
},
|
||||
"include": ["farm.config.ts"]
|
||||
"include": ["vite.config.ts"]
|
||||
}
|
||||
|
11
apps/renderer/vite.config.ts
Normal file
11
apps/renderer/vite.config.ts
Normal file
@ -0,0 +1,11 @@
|
||||
import { defineConfig } from "vite";
|
||||
import http2Proxy from "@sy/vite-plugin-http2-proxy";
|
||||
import mkcert from "vite-plugin-mkcert";
|
||||
import VuePlugin from "@vitejs/plugin-vue";
|
||||
|
||||
export default defineConfig({
|
||||
server: {
|
||||
port: 10010,
|
||||
},
|
||||
plugins: [http2Proxy(), mkcert(), VuePlugin()],
|
||||
});
|
@ -52,7 +52,7 @@
|
||||
"semantic-release": "^24.2.2",
|
||||
"typescript": "~5.3.3",
|
||||
"unplugin-vue-components": "^0.26.0",
|
||||
"vite": "^6.1.1",
|
||||
"vite": "^6.2.0",
|
||||
"vite-plugin-qiankun": "^1.0.15",
|
||||
"vue-tsc": "^2.2.0",
|
||||
"yargs-parser": "^21.1.1"
|
||||
|
@ -11,7 +11,7 @@ import { useEventListener } from "@vueuse/core";
|
||||
import { qiankunWindow } from 'vite-plugin-qiankun/dist/helper'
|
||||
|
||||
const __POWERED_BY_QIANKUN__ = computed(() => {
|
||||
return qiankunWindow.__POWERED_BY_QIANKUN__ || window.proxy?.__POWERED_BY_QIANKUN__
|
||||
return qiankunWindow.__POWERED_BY_QIANKUN__ || window?.proxy?.__POWERED_BY_QIANKUN__
|
||||
})
|
||||
|
||||
// const userInfoStore = useUserInfoStore();
|
||||
|
@ -1,59 +1,63 @@
|
||||
import { createApp } from "vue";
|
||||
import { createPinia } from "pinia";
|
||||
import App from "./App.vue";
|
||||
import { createProjectRouter } from './router'
|
||||
import { createProjectRouter } from "./router";
|
||||
import "./global.less";
|
||||
import VueGridLayout from "vue-grid-layout"; // 引入layout
|
||||
import { renderWithQiankun, qiankunWindow } from 'vite-plugin-qiankun/dist/helper'
|
||||
import {
|
||||
renderWithQiankun,
|
||||
qiankunWindow,
|
||||
} from "vite-plugin-qiankun/dist/helper";
|
||||
|
||||
let app
|
||||
let app;
|
||||
function render(props: Object = {}) {
|
||||
app = createApp(App);
|
||||
setStyleSheet(props.styles)
|
||||
const router = createProjectRouter(props.base)
|
||||
app.use(router)
|
||||
setStyleSheet(props.styles);
|
||||
const router = createProjectRouter(props.base);
|
||||
app.use(router);
|
||||
app.use(VueGridLayout);
|
||||
app.use(createPinia())
|
||||
app.mount("#y-code-app")
|
||||
app.use(createPinia());
|
||||
app.mount("#y-code-app");
|
||||
}
|
||||
|
||||
function setStyleSheet(styles: Object = {}) {
|
||||
const styleEle = document.createElement('style')
|
||||
styleEle.type = 'text/css'
|
||||
const styleEle = document.createElement("style");
|
||||
styleEle.type = "text/css";
|
||||
styleEle.innerHTML = `
|
||||
:root {
|
||||
--primary-color: ${styles.primaryColor || '#1677ff'};
|
||||
--primary-light-color: ${styles.primaryLightColor || '#4096ff'};
|
||||
--table-head-bg-color: ${styles.tableHeadBgColor || '#fafafa'};
|
||||
--table-head-font-color: ${styles.tableHeadFontColor || '#191919'};
|
||||
--primary-color: ${styles.primaryColor || "#1677ff"};
|
||||
--primary-light-color: ${styles.primaryLightColor || "#4096ff"};
|
||||
--table-head-bg-color: ${styles.tableHeadBgColor || "#fafafa"};
|
||||
--table-head-font-color: ${styles.tableHeadFontColor || "#191919"};
|
||||
}
|
||||
`
|
||||
document.head.appendChild(styleEle)
|
||||
`;
|
||||
document.head.appendChild(styleEle);
|
||||
}
|
||||
|
||||
const __POWERED_BY_QIANKUN__ = qiankunWindow.__POWERED_BY_QIANKUN__ || window.proxy?.__POWERED_BY_QIANKUN__
|
||||
const __POWERED_BY_QIANKUN__ =
|
||||
qiankunWindow?.__POWERED_BY_QIANKUN__ ||
|
||||
window?.proxy?.__POWERED_BY_QIANKUN__;
|
||||
|
||||
if (__POWERED_BY_QIANKUN__) {
|
||||
renderWithQiankun({
|
||||
bootstrap() {
|
||||
console.log('bootstrap')
|
||||
return Promise.resolve()
|
||||
console.log("bootstrap");
|
||||
return Promise.resolve();
|
||||
},
|
||||
mount(props) {
|
||||
console.log('mount')
|
||||
render(props)
|
||||
return Promise.resolve()
|
||||
console.log("mount");
|
||||
render(props);
|
||||
return Promise.resolve();
|
||||
},
|
||||
unmount() {
|
||||
console.log('unmount')
|
||||
console.log("unmount");
|
||||
if (app) {
|
||||
app.unmount()
|
||||
app.unmount();
|
||||
}
|
||||
return Promise.resolve()
|
||||
return Promise.resolve();
|
||||
},
|
||||
update() {},
|
||||
})
|
||||
});
|
||||
} else {
|
||||
render()
|
||||
render();
|
||||
}
|
||||
|
||||
|
@ -1,19 +1,23 @@
|
||||
import { createRouter, createWebHistory, type Router } from 'vue-router';
|
||||
import { titleGuard } from './guards';
|
||||
import routeList from './routes';
|
||||
import { qiankunWindow } from 'vite-plugin-qiankun/dist/helper'
|
||||
import { createRouter, createWebHistory, type Router } from "vue-router";
|
||||
import { titleGuard } from "./guards";
|
||||
import routeList from "./routes";
|
||||
import { qiankunWindow } from "vite-plugin-qiankun/dist/helper";
|
||||
|
||||
let router: Router | null = null
|
||||
export const createProjectRouter = (base = '') => {
|
||||
const __POWERED_BY_QIANKUN__ = qiankunWindow.__POWERED_BY_QIANKUN__ || window.proxy?.__POWERED_BY_QIANKUN__
|
||||
let router: Router | null = null;
|
||||
export const createProjectRouter = (base = "") => {
|
||||
const __POWERED_BY_QIANKUN__ =
|
||||
qiankunWindow?.__POWERED_BY_QIANKUN__ ||
|
||||
window.proxy?.__POWERED_BY_QIANKUN__;
|
||||
router = createRouter({
|
||||
history: createWebHistory(base || (__POWERED_BY_QIANKUN__ ? '/y-code-app/' : '')),
|
||||
history: createWebHistory(
|
||||
base || (__POWERED_BY_QIANKUN__ ? "/y-code-app/" : "")
|
||||
),
|
||||
routes: routeList,
|
||||
})
|
||||
});
|
||||
|
||||
// 全局前置守卫
|
||||
router.beforeEach(titleGuard)
|
||||
return router
|
||||
}
|
||||
router.beforeEach(titleGuard);
|
||||
return router;
|
||||
};
|
||||
|
||||
export default router;
|
||||
|
@ -162,7 +162,7 @@ const projectOptions = shallowRef<Option[]>();
|
||||
const isDraggable = false;
|
||||
|
||||
const isInQiankun = computed(() => {
|
||||
return qiankunWindow.__POWERED_BY_QIANKUN__ || window.proxy?.__POWERED_BY_QIANKUN__
|
||||
return qiankunWindow?.__POWERED_BY_QIANKUN__ || window?.proxy?.__POWERED_BY_QIANKUN__
|
||||
})
|
||||
|
||||
const layoutList = computed(() => {
|
||||
|
@ -1,5 +1,5 @@
|
||||
{
|
||||
"name": "@sy/low-code-render-adapter",
|
||||
"name": "@sy/low-code-renderer-adapter",
|
||||
"version": "1.0.0",
|
||||
"scripts": {
|
||||
"dev": "farm start",
|
||||
|
1954
pnpm-lock.yaml
generated
1954
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
Loading…
x
Reference in New Issue
Block a user