feat: 设计器可获取天梯 token

This commit is contained in:
wangxuefeng 2025-03-07 14:46:22 +08:00
parent 8d0c890061
commit db10bb6a6c
13 changed files with 135 additions and 79 deletions

View File

@ -20,12 +20,6 @@ export const useUserStore = defineStore('user', () => {
localStorage.setItem('token', newToken); localStorage.setItem('token', newToken);
}; };
// 异步 action
const fetchProfile = async () => {
const { data } = await axios.get('/api/user/profile');
userProfile.value = data;
};
// 清理方法 // 清理方法
const logout = () => { const logout = () => {
token.value = ''; token.value = '';
@ -38,7 +32,6 @@ export const useUserStore = defineStore('user', () => {
userProfile, userProfile,
isLoggedIn, isLoggedIn,
setToken, setToken,
fetchProfile,
logout logout
}; };
}); });

View File

@ -2,63 +2,60 @@
import { ref } from 'vue'; import { ref } from 'vue';
import Postmate from 'postmate'; import Postmate from 'postmate';
import { Engine, widgetManager } from '@vtj/pro'; import { Engine, widgetManager } from '@vtj/pro';
import { request, jsonp } from '@vtj/utils';
import { useUserStore } from '@/store';
import { LowCodeService } from '@/service'; import { LowCodeService } from '@/service';
const container = ref(); const container = ref();
const service = new LowCodeService(); const service = new LowCodeService();
const userStore = useUserStore();
onMounted(async () => { onMounted(async () => {
// //
const model = { const model = {
name: '', name: '',
url: '',
applicationId: -1, applicationId: -1,
url: '' projectId: -1,
accessToken: ''
}; };
const engine = new Engine({ const handshake = new Postmate.Model({});
container, await handshake.then((parent) => {
service, parent.emit('sync-context', 'y-code-designer is ready');
project: { Object.assign(model, parent.model);
id: 4, // console.log('get parent model', model);
name: 'test' userStore.setToken(model.accessToken);
} request.useRequest((req) => {
}); req.headers.set('Authorization', `Bearer ${model.accessToken}`);
widgetManager.set('Previewer', { return req;
props: { });
path: (block: any) => { const engine = new Engine({
const pathname = location.pathname; container,
return `${pathname}#/preview/${block.id}`; 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', { widgetManager.set('Templates', {
invisible: true 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> </script>

View File

@ -6,7 +6,15 @@ import { ref, getCurrentInstance } from 'vue';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { createProvider, ContextMode } from '@vtj/pro'; import { createProvider, ContextMode } from '@vtj/pro';
import { LowCodeService } from '@/service'; import { LowCodeService } from '@/service';
import { request, jsonp } from '@vtj/utils';
import { useUserStore } from '@/store';
const userStore = useUserStore();
const service = new LowCodeService(); const service = new LowCodeService();
request.useRequest((req) => {
req.headers.set('Authorization', `Bearer ${userStore.token}`);
return req;
});
const { provider, onReady } = createProvider({ const { provider, onReady } = createProvider({
mode: ContextMode.Runtime, mode: ContextMode.Runtime,
service, service,
@ -14,6 +22,10 @@ const { provider, onReady } = createProvider({
// @ts-ignore // @ts-ignore
id: 4 id: 4
}, },
adapter: {
request,
jsonp
},
dependencies: { dependencies: {
Vue: () => import('vue'), Vue: () => import('vue'),
VueRouter: () => import('vue-router'), VueRouter: () => import('vue-router'),

View File

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

View File

@ -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;

View File

@ -4,4 +4,5 @@ import micro from './micro';
import application from './application'; import application from './application';
import project from './project'; import project from './project';
import staticFile from './static-file'; 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];

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

3
pnpm-lock.yaml generated
View File

@ -466,6 +466,9 @@ importers:
'@vtj/ui': '@vtj/ui':
specifier: ^0.10.9 specifier: ^0.10.9
version: 0.10.9(typescript@5.8.2)(vue@3.5.13(typescript@5.8.2)) 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': '@vtj/web':
specifier: ^0.10.9 specifier: ^0.10.9
version: 0.10.9(typescript@5.8.2)(vue@3.5.13(typescript@5.8.2)) version: 0.10.9(typescript@5.8.2)(vue@3.5.13(typescript@5.8.2))