Pre Merge pull request !130 from Pascal_Yu/dev

src/packages/components/Decorates/Three/ThreeEarth01/code/world/Assets.ts

@@ -5,7 +5,7 @@
 
 interface ITextures {
   name: string
-  url: string
+  url: () => Promise<{ default: string }>
 }
 
 export interface IResources {
@@ -15,14 +15,13 @@ export interface IResources {
 const fileSuffix = ['earth', 'gradient', 'redCircle', 'label', 'aperture', 'glow', 'light_column', 'aircraft']
 const textures: ITextures[] = []
 
-const modules = import.meta.globEager("../../images/earth/*");
+const modules = import.meta.glob("../../images/earth/*");
-
+for (let item in modules) {
-for(let item in modules) {
   const n = item.split('/').pop()
-  if(n) {
+  if (n) {
     textures.push({
       name: n.split('.')[0],
-      url: modules[item].default
+      url: (modules[item] as () => Promise<{ default: string }>)
     })
   }
 }

src/packages/components/Decorates/Three/ThreeEarth01/code/world/Resources.ts

@@ -45,8 +45,9 @@ export class Resources {
    */
   private loadResources(): void {
     this.textureLoader = new TextureLoader(this.manager)
-    resources.textures?.forEach(item => {
+    resources.textures?.forEach(async item => {
-      this.textureLoader.load(item.url, t => {
+      const url = (await item.url()).default
+      this.textureLoader.load(url, t => {
         this.textures[item.name] = t
       })
     })

src/packages/index.ts

@@ -4,9 +4,9 @@ import { InformationList } from '@/packages/components/Informations/index'
 import { TableList } from '@/packages/components/Tables/index'
 import { PackagesCategoryEnum, PackagesType, ConfigType, FetchComFlagType } from '@/packages/index.d'
 
-const configModules = import.meta.globEager('./components/**/config.vue')
+const configModules = import.meta.glob('./components/**/config.vue')
-const indexModules = import.meta.globEager('./components/**/index.vue')
+const indexModules = import.meta.glob('./components/**/index.vue')
-const imagesModules = import.meta.globEager('../assets/images/chart/**')
+const imagesModules = import.meta.glob('../assets/images/chart/**')
 
 // * 所有图表
 export let packagesList: PackagesType = {
@@ -31,12 +31,13 @@ export const createComponent = async (targetData: ConfigType) => {
  * @param {string} chartName 名称
  * @param {FetchComFlagType} flag 标识 0为展示组件, 1为配置组件
  */
-const fetchComponent = (chartName: string, flag: FetchComFlagType) => {
+const fetchComponent = async (chartName: string, flag: FetchComFlagType) => {
   const module = flag === FetchComFlagType.VIEW ? indexModules : configModules
   for (const key in module) {
     const urlSplit = key.split('/')
     if (urlSplit[urlSplit.length - 2] === chartName) {
-      return module[key]
+      const loader = module[key] as () => Promise<{ default: any }>
+      return (await loader()).default
     }
   }
 }
@@ -45,18 +46,18 @@ const fetchComponent = (chartName: string, flag: FetchComFlagType) => {
  * * 获取展示组件
  * @param {ConfigType} dropData 配置项
  */
-export const fetchChartComponent = (dropData: ConfigType) => {
+export const fetchChartComponent = async (dropData: ConfigType) => {
   const { key } = dropData
-  return fetchComponent(key, FetchComFlagType.VIEW)?.default
+  return await fetchComponent(key, FetchComFlagType.VIEW)
 }
 
 /**
  * * 获取配置组件
  * @param {ConfigType} dropData 配置项
  */
-export const fetchConfigComponent = (dropData: ConfigType) => {
+export const fetchConfigComponent = async (dropData: ConfigType) => {
   const { key } = dropData
-  return fetchComponent(key, FetchComFlagType.CONFIG)?.default
+  return await fetchComponent(key, FetchComFlagType.CONFIG)
 }
 
 /**
@@ -74,7 +75,8 @@ export const fetchImages = async (targetData?: ConfigType) => {
   for (const key in imagesModules) {
     const urlSplit = key.split('/')
     if (urlSplit[urlSplit.length - 1] === imageName) {
-      return imagesModules[key]?.default
+      const loader = imagesModules[key] as () => Promise<{ default: string }>
+      return (await loader()).default
     }
   }
   return ''

src/views/chart/ContentCharts/components/ChartsItemBox/index.vue

@@ -68,14 +68,15 @@ const chartMode: Ref<ChartModeEnum> = computed(() => {
 })
 
 // 拖拽处理
-const dragStartHandle = (e: DragEvent, item: ConfigType) => {
+const dragStartHandle = async (e: DragEvent, item: ConfigType) => {
-  // 动态注册图表组件
-  componentInstall(item.chartKey, fetchChartComponent(item))
-  componentInstall(item.conKey, fetchConfigComponent(item))
   // 将配置项绑定到拖拽属性上
   e!.dataTransfer!.setData(DragKeyEnum.DRAG_KEY, JSONStringify(omit(item, ['image'])))
   // 修改状态
   chartEditStore.setEditCanvas(EditCanvasTypeEnum.IS_CREATE, true)
+  
+  // 动态注册图表组件
+  componentInstall(item.chartKey, await fetchChartComponent(item))
+  componentInstall(item.conKey, await fetchConfigComponent(item))
 }
 
 // 拖拽结束
@@ -88,8 +89,8 @@ const dblclickHandle = async (item: ConfigType) => {
   try {
     loadingStart()
     // 动态注册图表组件
-    componentInstall(item.chartKey, fetchChartComponent(item))
+    componentInstall(item.chartKey, await fetchChartComponent(item))
-    componentInstall(item.conKey, fetchConfigComponent(item))
+    componentInstall(item.conKey, await fetchConfigComponent(item))
     // 创建新图表组件
     let newComponent: CreateComponentType = await createComponent(item)
     // 添加

src/views/chart/ContentCharts/components/ChartsSearch/index.vue

@@ -149,8 +149,8 @@ const selectChartHandle = async (item: ConfigType) => {
   try {
     loadingStart()
     // 动态注册图表组件
-    componentInstall(item.chartKey, fetchChartComponent(item))
+    componentInstall(item.chartKey, await fetchChartComponent(item))
-    componentInstall(item.conKey, fetchConfigComponent(item))
+    componentInstall(item.conKey, await fetchConfigComponent(item))
     // 创建新图表组件
     let newComponent: CreateComponentType = await createComponent(item)
     // 添加