index.ts 2.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. import { ChartList } from '@/packages/components/Charts/index'
  2. import { DecorateList } from '@/packages/components/Decorates/index'
  3. import { InformationList } from '@/packages/components/Informations/index'
  4. import { TableList } from '@/packages/components/Tables/index'
  5. import { PackagesCategoryEnum, PackagesType, ConfigType, FetchComFlagType } from '@/packages/index.d'
  6. const configModules = import.meta.globEager('./components/**/config.vue')
  7. const indexModules = import.meta.globEager('./components/**/index.vue')
  8. const imagesModules = import.meta.globEager('../assets/images/chart/**')
  9. // * 所有图表
  10. export let packagesList: PackagesType = {
  11. [PackagesCategoryEnum.CHARTS]: ChartList,
  12. [PackagesCategoryEnum.INFORMATIONS]: InformationList,
  13. [PackagesCategoryEnum.TABLES]: TableList,
  14. [PackagesCategoryEnum.DECORATES]: DecorateList
  15. }
  16. /**
  17. * * 获取目标组件配置信息
  18. * @param targetData
  19. */
  20. export const createComponent = async (targetData: ConfigType) => {
  21. const { category, key } = targetData
  22. const chart = await import(`./components/${targetData.package}/${category}/${key}/config.ts`)
  23. return new chart.default()
  24. }
  25. /**
  26. * * 获取组件
  27. * @param {string} chartName 名称
  28. * @param {FetchComFlagType} flag 标识 0为展示组件, 1为配置组件
  29. */
  30. const fetchComponent = (chartName: string, flag: FetchComFlagType) => {
  31. const module = flag === FetchComFlagType.VIEW ? indexModules : configModules
  32. for (const key in module) {
  33. const urlSplit = key.split('/')
  34. if (urlSplit[urlSplit.length - 2] === chartName) {
  35. return module[key]
  36. }
  37. }
  38. }
  39. /**
  40. * * 获取展示组件
  41. * @param {ConfigType} dropData 配置项
  42. */
  43. export const fetchChartComponent = (dropData: ConfigType) => {
  44. const { key } = dropData
  45. return fetchComponent(key, FetchComFlagType.VIEW)?.default
  46. }
  47. /**
  48. * * 获取配置组件
  49. * @param {ConfigType} dropData 配置项
  50. */
  51. export const fetchConfigComponent = (dropData: ConfigType) => {
  52. const { key } = dropData
  53. return fetchComponent(key, FetchComFlagType.CONFIG)?.default
  54. }
  55. /**
  56. * * 获取图片内容
  57. * @param {ConfigType} targetData 配置项
  58. */
  59. export const fetchImages = async (targetData: ConfigType) => {
  60. // 新数据动态处理
  61. const { image, package: targetDataPackage } = targetData
  62. // 兼容旧数据
  63. if (image.includes('@') || image.includes('base64')) return image
  64. const imageName = image.substring(image.lastIndexOf('/') + 1)
  65. for (const key in imagesModules) {
  66. const urlSplit = key.split('/')
  67. if (urlSplit[urlSplit.length - 1] === imageName) {
  68. return imagesModules[key]?.default
  69. }
  70. }
  71. return ''
  72. }