feat: 新增主题色选项

src/packages/components/Charts/Bars/BarCommon/config.ts

@@ -26,6 +26,10 @@ export default class Config extends publicConfig implements CreateComponentType
       {
         data: [120, 200, 150, 80, 70, 110, 130],
         type: 'bar'
+      },
+      {
+        data: [130, 130, 312, 268, 155, 117, 160],
+        type: 'bar'
       }
     ]
   })

src/packages/components/Charts/Bars/BarCommon/index.vue

@@ -1,11 +1,11 @@
 <template>
-  <VChart theme="dark" :option="option" autoresize />
+  <VChart :theme="themeData" :option="option" autoresize />
 </template>
 
 <script setup lang="ts">
 import { computed, PropType } from 'vue'
 import VChart from 'vue-echarts'
-import { use, graphic } from 'echarts/core'
+import { use } from 'echarts/core'
 import { CanvasRenderer } from 'echarts/renderers'
 import { BarChart } from 'echarts/charts'
 import {
@@ -16,6 +16,11 @@ import {
 import config from './config'
 
 const props = defineProps({
+  themeData: {
+    type: Object || String,
+    default: 'dark',
+    required: true
+  },
   chartData: {
     type: Object as PropType<config>,
     required: true

src/packages/components/Charts/Bars/BarCrossrange/config.ts

@@ -1,17 +1,13 @@
-import { getUUID } from '@/utils'
-import { echartOptionProfixHandle } from '@/packages/utils/chart'
+import { echartOptionProfixHandle, publicConfig } from '@/packages/utils'
 import { BarCrossrangefig } from './index'
 import { ConfigType, CreateComponentType } from '@/packages/index.d'
 import omit from 'lodash/omit'
 
-export default class Config implements CreateComponentType {
-  public id: string = getUUID()
+export default class Config extends publicConfig implements CreateComponentType {
   public key: string = BarCrossrangefig.key
 
   public chartData: Exclude<ConfigType, ['node']> = omit(BarCrossrangefig, ['node'])
 
-  public attr = { x: 0, y: 0, w: 500, h: 300 }
-
   // 图表配置项
   public option = echartOptionProfixHandle({
     backgroundColor: 'rgba(0,0,0,0)',

src/packages/components/Charts/Bars/BarCrossrange/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <VChart theme="dark" :option="option" autoresize />
+  <VChart :theme="themeData" :option="option" autoresize />
 </template>
 
 <script setup lang="ts">
@@ -16,6 +16,11 @@ import {
 import config from './config'
 
 const props = defineProps({
+  themeData: {
+    type: Object || String,
+    default: 'dark',
+    required: true
+  },
   chartData: {
     type: Object as PropType<config>,
     required: true

src/packages/components/Charts/Lines/LineCommon/config.ts

@@ -1,17 +1,13 @@
-import { getUUID } from '@/utils'
-import { echartOptionProfixHandle } from '@/packages/utils/chart'
+import { echartOptionProfixHandle, publicConfig } from '@/packages/utils'
 import { LineCommonConfig } from './index'
 import { ConfigType, CreateComponentType } from '@/packages/index.d'
 import omit from 'lodash/omit'
 
-export default class Config implements CreateComponentType {
-  public id: string = getUUID()
+export default class Config extends publicConfig implements CreateComponentType {
   public key: string = LineCommonConfig.key
 
   public chartData: Exclude<ConfigType, ['node']> = omit(LineCommonConfig, ['node'])
 
-  public attr = { x: 0, y: 0, w: 500, h: 300 }
-
   // 图表配置项
   public option = echartOptionProfixHandle({
     xAxis: {
@@ -25,6 +21,10 @@ export default class Config implements CreateComponentType {
       {
         data: [150, 230, 224, 218, 135, 147, 260],
         type: 'line'
+      },
+      {
+        data: [130, 130, 312, 268, 155, 117, 160],
+        type: 'line'
       }
     ]
   })

src/packages/components/Charts/Lines/LineCommon/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <VChart theme="dark" :option="option" autoresize />
+  <VChart :theme="themeData" :option="option" autoresize />
 </template>
 
 <script setup lang="ts">
@@ -16,6 +16,11 @@ import {
 import config from './config'
 
 const props = defineProps({
+   themeData: {
+    type: Object || String,
+    default: 'dark',
+    required: true
+  },
   chartData: {
     type: Object as PropType<config>,
     required: true

src/packages/components/Charts/Pies/PieCommon/config.ts

@@ -1,17 +1,13 @@
-import { getUUID } from '@/utils'
-import { echartOptionProfixHandle } from '@/packages/utils/chart'
+import { echartOptionProfixHandle, publicConfig } from '@/packages/utils'
 import { PieCommonConfig } from './index'
 import { ConfigType, CreateComponentType } from '@/packages/index.d'
 import omit from 'lodash/omit'
 
-export default class Config implements CreateComponentType {
-  public id: string = getUUID()
+export default class Config extends publicConfig implements CreateComponentType {
   public key: string = PieCommonConfig.key
 
   public chartData: Exclude<ConfigType, ['node']> = omit(PieCommonConfig, ['node'])
 
-  public attr = { x: 0, y: 0, w: 500, h: 300 }
-
   // 图表配置项
   public option = echartOptionProfixHandle({
     tooltip: {

src/packages/components/Charts/Pies/PieCommon/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <VChart theme="dark" :option="option" autoresize />
+  <VChart :theme="themeData" :option="option" autoresize />
 </template>
 
 <script setup lang="ts">
@@ -16,6 +16,11 @@ import {
 import config from './config'
 
 const props = defineProps({
+  themeData: {
+    type: Object || String,
+    default: 'dark',
+    required: true
+  },
   chartData: {
     type: Object as PropType<config>,
     required: true