44 lines
1.2 KiB
TypeScript
44 lines
1.2 KiB
TypeScript
import { defineAsyncComponent, AsyncComponentLoader } from 'vue'
|
|
import { AsyncLoading, AsyncSkeletonLoading } from '@/components/LoadingComponent'
|
|
import { ConfigType } from '@/packages/index.d'
|
|
import { fetchChartComponent } from '@/packages/index'
|
|
/**
|
|
* * 预览页面动态注册 package 组件
|
|
* @param {ConfigType} dropData
|
|
*/
|
|
export const componentPackageInstall = async (dropData: Omit<ConfigType, "node">) => {
|
|
const key = dropData.key.substring(1)
|
|
console.log(window['$vue']);
|
|
if (!window['$vue'].component(key)) {
|
|
const chart = await fetchChartComponent(dropData)
|
|
window['$vue'].component(key, chart)
|
|
}
|
|
}
|
|
/**
|
|
* * 动态注册组件
|
|
*/
|
|
export const componentInstall = <T> (key:string, node: T) => {
|
|
if(!window['$vue'].component(key) && node) {
|
|
window['$vue'].component(key, node)
|
|
}
|
|
}
|
|
|
|
/**
|
|
* * 异步加载组件
|
|
* @param loader
|
|
* @returns
|
|
*/
|
|
export const loadAsyncComponent = (loader: AsyncComponentLoader<any>) =>
|
|
defineAsyncComponent({
|
|
loader,
|
|
loadingComponent: AsyncLoading,
|
|
delay: 20,
|
|
})
|
|
|
|
export const loadSkeletonAsyncComponent = (loader: AsyncComponentLoader<any>) =>
|
|
defineAsyncComponent({
|
|
loader,
|
|
loadingComponent: AsyncSkeletonLoading,
|
|
delay: 20,
|
|
})
|