Browse Source

feat: 图表组件注册

MTrun 3 years ago
parent
commit
56d00831d3
3 changed files with 23 additions and 3 deletions
  1. 4 0
      src/main.ts
  2. 18 3
      src/packages/index.ts
  3. 1 0
      src/views/chart/components/ContentLayers/index.vue

+ 4 - 0
src/main.ts

@@ -4,6 +4,7 @@ import router, { setupRouter } from '@/router'
 import i18n from '@/i18n/index'
 import { setupStore } from '@/store'
 import { setupNaive, setupDirectives, setupCustomComponents } from '@/plugins'
+import { packagesInstall } from '@/packages/index'
 import { AppProvider } from '@/components/AppProvider/index'
 import { setHtmlTheme } from '@/utils'
 
@@ -39,6 +40,9 @@ async function appInit() {
   // Store 准备就绪后处理主题色
   setHtmlTheme()
 
+  // 注册 pakage 组件
+  app.use(packagesInstall)
+
   // 语言注册
   app.use(i18n)
 

+ 18 - 3
src/packages/index.ts

@@ -1,4 +1,9 @@
-import { PackagesCategoryEnum, PackagesType } from '@/packages/index.d'
+import type { App } from 'vue'
+import {
+  PackagesCategoryEnum,
+  PackagesType,
+  ConfigType
+} from '@/packages/index.d'
 import { ChartList } from '@/packages/components/Chart/index'
 import { DecorateList } from '@/packages/components/Decorate/index'
 import { InformationList } from '@/packages/components/Information/index'
@@ -9,7 +14,17 @@ let packagesList: PackagesType = {
   [PackagesCategoryEnum.CHARTS]: ChartList,
   [PackagesCategoryEnum.INFORMATION]: InformationList,
   [PackagesCategoryEnum.TABLES]: TableList,
-  [PackagesCategoryEnum.DECORATES]: DecorateList,
+  [PackagesCategoryEnum.DECORATES]: DecorateList
 }
 
-export { packagesList }
+// 注册
+const packagesInstall = (app: App): void => {
+  for (const item in packagesList) {
+    const chartList: ConfigType[] = (packagesList as any)[item]
+    chartList.forEach((chart: ConfigType) => {
+      app.component(chart.key, chart.node)
+    })
+  }
+}
+
+export { packagesList, packagesInstall }

+ 1 - 0
src/views/chart/components/ContentLayers/index.vue

@@ -11,6 +11,7 @@
         <component :is="LayersIcon" />
       </n-icon>
     </template>
+    <!-- 图层内容 -->
   </ContentBox>
 </template>