chore:平台容器框架升级,修复命令行环境丢失的问题
This commit is contained in:
@@ -1,24 +1,24 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, watch, ref, getCurrentInstance } from 'vue'
|
||||
import { ElLoading } from 'element-plus'
|
||||
import Postmate from 'postmate'
|
||||
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 { computed, watch, ref, getCurrentInstance } from 'vue';
|
||||
import { ElLoading } from 'element-plus';
|
||||
import Postmate from 'postmate';
|
||||
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'
|
||||
|
||||
// 响应式状态
|
||||
const renderer = ref()
|
||||
const lowCodeService = new LowCodeService()
|
||||
const renderer = ref();
|
||||
const lowCodeService = new LowCodeService();
|
||||
|
||||
// Postmate 握手协议
|
||||
const postmate = new Postmate.Model({
|
||||
sayHi: (data: any) => {
|
||||
console.log('sayHi',data)
|
||||
}
|
||||
})
|
||||
console.log('sayHi', data);
|
||||
},
|
||||
});
|
||||
|
||||
// 数据模型
|
||||
const model = {
|
||||
@@ -27,54 +27,54 @@ const model = {
|
||||
projectId: -1,
|
||||
fileId: '',
|
||||
url: '',
|
||||
accessToken: ''
|
||||
}
|
||||
accessToken: '',
|
||||
};
|
||||
|
||||
// 数据查询
|
||||
const { data: file, isFetching } = useQuery({
|
||||
queryKey: ['getFile'],
|
||||
queryFn: async () => {
|
||||
await postmate.then((parent) => {
|
||||
parent.emit('some-event', 'y-code-renderer is ready')
|
||||
Object.assign(model, parent.model)
|
||||
localStorage.setItem('y-code-access-token', model.accessToken || '')
|
||||
})
|
||||
parent.emit('some-event', 'y-code-renderer is ready');
|
||||
Object.assign(model, parent.model);
|
||||
localStorage.setItem('y-code-access-token', model.accessToken || '');
|
||||
});
|
||||
|
||||
return getFile(model.fileId).then(() => {
|
||||
request.useRequest((req) => {
|
||||
req.headers.set('Authorization', `Bearer ${model.accessToken}`)
|
||||
return 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 },
|
||||
adapter: {
|
||||
request,
|
||||
jsonp
|
||||
}
|
||||
})
|
||||
jsonp,
|
||||
},
|
||||
});
|
||||
onReady(async () => {
|
||||
const instance = getCurrentInstance()
|
||||
instance?.appContext.app.use(provider)
|
||||
renderer.value = await provider.getRenderComponent(model.fileId)
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
const instance = getCurrentInstance();
|
||||
instance?.appContext.app.use(provider);
|
||||
renderer.value = await provider.getRenderComponent(model.fileId);
|
||||
});
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
// 加载状态监控
|
||||
watch(isFetching, (newVal) => {
|
||||
if (newVal) {
|
||||
ElLoading.service({ text: '低代码文件加载中...' })
|
||||
ElLoading.service({ text: '低代码文件加载中...' });
|
||||
} else {
|
||||
ElLoading.service().close()
|
||||
ElLoading.service().close();
|
||||
}
|
||||
})
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div style="padding: 20px;">
|
||||
<div style="padding: 20px">
|
||||
<component :is="renderer" v-if="renderer" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1 +1 @@
|
||||
export * from "./env";
|
||||
export * from './env';
|
||||
|
||||
@@ -1,13 +1,14 @@
|
||||
import { BlockSchema } from "@vtj/core";
|
||||
import instance from "./instance";
|
||||
import { BlockSchema } from '@vtj/core';
|
||||
|
||||
import instance from './instance';
|
||||
|
||||
export type LowCodeFileSchema = {
|
||||
project_id: number;
|
||||
publish: boolean;
|
||||
active: boolean;
|
||||
dsl: BlockSchema;
|
||||
file_path?: string;
|
||||
file_id?: string;
|
||||
file_path?: string;
|
||||
project_id: number;
|
||||
publish: boolean;
|
||||
};
|
||||
|
||||
export const getFile = async (id: string): Promise<LowCodeFileSchema> => {
|
||||
|
||||
@@ -1,2 +1,2 @@
|
||||
export * from "./file";
|
||||
export * from "./project";
|
||||
export * from './file';
|
||||
export * from './project';
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import axios from "axios";
|
||||
import axios from 'axios';
|
||||
|
||||
// 创建独立实例
|
||||
const instance = axios.create({
|
||||
@@ -13,7 +13,7 @@ instance.interceptors.request.use(
|
||||
},
|
||||
(error) => {
|
||||
return Promise.reject(error);
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
instance.interceptors.response.use(
|
||||
@@ -22,7 +22,7 @@ instance.interceptors.response.use(
|
||||
},
|
||||
(error) => {
|
||||
return Promise.reject(error);
|
||||
}
|
||||
},
|
||||
);
|
||||
// 导出实例
|
||||
export default instance;
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import instance from "./instance";
|
||||
import instance from './instance';
|
||||
|
||||
export const getProject = async (id: string) => {
|
||||
const response = await instance.get(`/api/v1/projects/${id}`);
|
||||
|
||||
@@ -1,18 +1,29 @@
|
||||
import { type ProjectSchema, type BlockSchema, ProjectModel } from "@vtj/core";
|
||||
import { BaseService } from "@vtj/renderer";
|
||||
import { getProject, getFile as getLowCodeFile } from "@/io";
|
||||
import type { BlockSchema, ProjectSchema } from '@vtj/core';
|
||||
|
||||
import { getFile as getLowCodeFile, getProject } from '@/io';
|
||||
import { ProjectModel } from '@vtj/core';
|
||||
import { BaseService } from '@vtj/renderer';
|
||||
|
||||
let initProject: ProjectModel = {};
|
||||
|
||||
export class LowCodeService extends BaseService {
|
||||
public async getFile(id: string): Promise<BlockSchema> {
|
||||
console.log('service getFile', id);
|
||||
return getLowCodeFile(id).then((lowCodeFile) => {
|
||||
return lowCodeFile.dsl
|
||||
? Promise.resolve(lowCodeFile.dsl as BlockSchema)
|
||||
: Promise.reject(null);
|
||||
});
|
||||
}
|
||||
|
||||
public async init(project: ProjectSchema) {
|
||||
console.log("init", project);
|
||||
console.log('init', project);
|
||||
initProject = project;
|
||||
const remoteProject = await getProject(project.id);
|
||||
console.log("remoteProject", remoteProject);
|
||||
console.log('remoteProject', remoteProject);
|
||||
const model = new ProjectModel(remoteProject);
|
||||
const dsl = model.toDsl();
|
||||
return Promise.resolve(dsl);
|
||||
return dsl;
|
||||
}
|
||||
|
||||
public saveProject(project: ProjectSchema): Promise<boolean> {
|
||||
@@ -21,7 +32,7 @@ export class LowCodeService extends BaseService {
|
||||
...Object.fromEntries(
|
||||
Object.entries(project)
|
||||
.filter(([key]) => stringifyFields.includes(key))
|
||||
.map(([key, value]) => [key, JSON.stringify(value)])
|
||||
.map(([key, value]) => [key, JSON.stringify(value)]),
|
||||
),
|
||||
};
|
||||
updateProject(initProject.id, newProject);
|
||||
@@ -29,15 +40,4 @@ export class LowCodeService extends BaseService {
|
||||
// storage.save(`project_${model.id}`, model.toDsl());
|
||||
return Promise.resolve(true);
|
||||
}
|
||||
|
||||
public async getFile(id: string): Promise<BlockSchema> {
|
||||
console.log("service getFile", id);
|
||||
return getLowCodeFile(id).then((lowCodeFile) => {
|
||||
if (lowCodeFile.dsl) {
|
||||
return Promise.resolve(lowCodeFile.dsl as BlockSchema);
|
||||
} else {
|
||||
return Promise.reject(null);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user