chore: 优化进度条组件内容

src/packages/components/Charts/Mores/Process/config.ts

@@ -4,9 +4,36 @@ import { ProcessConfig } from './index'
 import { chartInitConfig } from '@/settings/designSetting'
 import cloneDeep from 'lodash/cloneDeep'
 
+
+export const types = [
+  {
+    label: '线形',
+    value: 'line'
+  },
+  {
+    label: '圆形',
+    value: 'circle'
+  },
+  {
+    label: '仪表盘',
+    value: 'dashboard'
+  },
+]
+
+export const indicatorPlacements = [
+  {
+    label: '内部',
+    value: 'inside'
+  },
+  {
+    label: '外部',
+    value: 'outside'
+  }
+]
+
 export const option = {
   dataset: 36,
-  type: "circle",
+  type: types[2].value,
   color: '#4992FFFF',
   // 指标位置（线条时可用）
   indicatorPlacement: "outside"

src/packages/components/Charts/Mores/Process/config.vue

@@ -38,7 +38,7 @@ import {
 } from '@/components/Pages/ChartItemSetting'
 
 // 获取 option 的数据，便于使用 typeof 获取类型
-import { option } from './config'
+import { option, types, indicatorPlacements} from './config'
 
 const props = defineProps({
   optionData: {
@@ -46,30 +46,4 @@ const props = defineProps({
     required: true
   }
 })
-
-const types = [
-  {
-    label: '线形',
-    value: 'line'
-  },
-  {
-    label: '圆形',
-    value: 'circle'
-  },
-  {
-    label: '仪表盘',
-    value: 'dashboard'
-  },
-]
-
-const indicatorPlacements = [
-  {
-    label: '里面',
-    value: 'inside'
-  },
-  {
-    label: '外边',
-    value: 'outside'
-  }
-]
 </script>

src/packages/components/Charts/Mores/Process/index.ts

@@ -13,7 +13,7 @@ export const ProcessConfig: ConfigType = {
   // 配置组件渲染 Components 格式: VC + key
   conKey: 'VCProcess',
   // 名称
-  title: '多类进度条',
+  title: 'NaiveUI-进度',
   // 子分类目录
   category: ChatCategoryEnum.MORE,
   // 子分类目录

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

@@ -29,33 +29,27 @@ const option = {
       hoverAnimation: true,
       color: ["#00bcd44a", "transparent"],
       label: {
-        normal: {
-          show: false
-        }
+        show: false
       },
       data: [
         {
           value: [25],
           itemStyle: {
-            normal: {
-              color: "#03a9f4",
-              shadowBlur: 10,
-              shadowColor:"#97e2f5"
-            }
+            color: "#03a9f4",
+            shadowBlur: 10,
+            shadowColor:"#97e2f5"
           }
         },
         {
           value: [75],
           itemStyle: {
-            normal: {
-              color: "#00bcd44a",
-              shadowBlur: 0,
-              shadowColor:"#00bcd44a"
-            }
+            color: "#00bcd44a",
+            shadowBlur: 0,
+            shadowColor:"#00bcd44a"
           }
         }
       ]
-    }
+    },
   ]
 }
 

src/packages/components/Charts/Pies/PieCircle/config.vue

@@ -1,6 +1,6 @@
 <template>
   <!-- 遍历 seriesList -->
-  <CollapseItem v-for="(item, index) in config.series" :key="index" :name="`圆环-${index + 1}`" :expanded="true">
+  <CollapseItem v-for="(item, index) in config.series" :key="index" :name="`圆环`" :expanded="true">
     <SettingItemBox name="数据">
       <SettingItem name="数值">
         <n-input-number v-model:value="config.dataset" :min="0" :max="1" :step="0.01" size="small" placeholder="数值">
@@ -8,28 +8,28 @@
       </SettingItem>
     </SettingItemBox>
     <!-- Echarts 全局设置 -->
-    <SettingItemBox name="进度条样式">
+    <SettingItemBox name="进度条">
       <SettingItem name="颜色">
         <n-color-picker
           size="small"
           :modes="['hex']"
-          v-model:value="item.data[0].itemStyle.normal.color"
+          v-model:value="item.data[0].itemStyle.color"
         ></n-color-picker>
       </SettingItem>
       <SettingItem name="阴影模糊等级">
-        <n-input-number v-model:value="item.data[0].itemStyle.normal.shadowBlur" :min="0" :max="50" :step="1" size="small" placeholder="阴影模糊等级">
+        <n-input-number v-model:value="item.data[0].itemStyle.shadowBlur" :min="0" :max="50" :step="1" size="small" placeholder="阴影模糊等级">
         </n-input-number>
       </SettingItem>
       <SettingItem name="阴影颜色">
         <n-color-picker
           size="small"
           :modes="['hex']"
-          v-model:value="item.data[0].itemStyle.normal.shadowColor"
+          v-model:value="item.data[0].itemStyle.shadowColor"
         ></n-color-picker>
       </SettingItem>
     </SettingItemBox>
     <!-- 中心标题 -->
-    <SettingItemBox name="标题">
+    <SettingItemBox v-if="config.title" name="标题">
       <SettingItem name="颜色">
         <n-color-picker
           size="small"
@@ -48,18 +48,18 @@
         <n-color-picker
           size="small"
           :modes="['hex']"
-          v-model:value="item.data[1].itemStyle.normal.color"
+          v-model:value="item.data[1].itemStyle.color"
         ></n-color-picker>
       </SettingItem>
       <SettingItem name="阴影模糊等级">
-        <n-input-number v-model:value="item.data[1].itemStyle.normal.shadowBlur" :min="0" :step="1" size="small" placeholder="阴影模糊等级">
+        <n-input-number v-model:value="item.data[1].itemStyle.shadowBlur" :min="0" :step="1" size="small" placeholder="阴影模糊等级">
         </n-input-number>
       </SettingItem>
       <SettingItem name="阴影颜色">
         <n-color-picker
           size="small"
           :modes="['hex']"
-          v-model:value="item.data[1].itemStyle.normal.shadowColor"
+          v-model:value="item.data[1].itemStyle.shadowColor"
         ></n-color-picker>
       </SettingItem>
     </SettingItemBox>