refactor: 图标样式优化

Former-commit-id: 1b9f02f3e0c46b3370850b6072b7bd4a94b87f73

src/views/dashboard/components/Chart/BarChart.vue

@@ -9,7 +9,7 @@ import {
   onActivated,
   onBeforeUnmount,
   onDeactivated,
-  onMounted
+  onMounted,
 } from 'vue';
 import { init, EChartsOption } from 'echarts';
 import * as echarts from 'echarts';
@@ -18,22 +18,22 @@ import resize from '@/utils/resize';
 const props = defineProps({
   id: {
     type: String,
-    default: 'barChart'
+    default: 'barChart',
   },
   className: {
     type: String,
-    default: ''
+    default: '',
   },
   width: {
     type: String,
     default: '200px',
-    required: true
+    required: true,
   },
   height: {
     type: String,
     default: '200px',
-    required: true
-  }
+    required: true,
+  },
 });
 
 const { mounted, chart, beforeDestroy, activated, deactivated } = resize();
@@ -51,100 +51,104 @@ function initChart() {
         fontSize: 18,
         fontStyle: 'normal',
         fontWeight: 'bold',
-        color: '#337ecc'
-      }
+        color: '#337ecc',
+      },
     },
     grid: {
       left: '2%',
       right: '2%',
       bottom: '10%',
-      containLabel: true
+      containLabel: true,
     },
     tooltip: {
       trigger: 'axis',
       axisPointer: {
         type: 'cross',
         crossStyle: {
-          color: '#999'
-        }
-      }
+          color: '#999',
+        },
+      },
     },
     legend: {
       x: 'center',
       y: 'bottom',
-      data: ['收入', '毛利润', '收入增长率', '利润增长率']
+      data: ['收入', '毛利润', '收入增长率', '利润增长率'],
     },
     xAxis: [
       {
         type: 'category',
-        data: ['上海', '北京', '浙江', '广东', '深圳', '四川', '湖北', '安徽'],
+        data: [ '浙江', '北京', '上海', '广东','深圳'],
         axisPointer: {
-          type: 'shadow'
-        }
-      }
+          type: 'shadow',
+        },
+      },
     ],
     yAxis: [
       {
         type: 'value',
+        min: 0,
+        max: 10000,
         interval: 2000,
         axisLabel: {
-          formatter: '{value} '
-        }
+          formatter: '{value} ',
+        },
       },
       {
         type: 'value',
+        min: 0,
+        max: 100,
         interval: 20,
         axisLabel: {
-          formatter: '{value}%'
-        }
-      }
+          formatter: '{value}%',
+        },
+      },
     ],
     series: [
       {
         name: '收入',
         type: 'bar',
-        data: [8000, 8200, 7000, 6200, 6500, 5500, 4500, 4200, 3800],
+        data: [7000, 7100, 7200, 7300,7400],
         barWidth: 20,
         itemStyle: {
           color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
             { offset: 0, color: '#83bff6' },
             { offset: 0.5, color: '#188df0' },
-            { offset: 1, color: '#188df0' }
-          ])
-        }
+            { offset: 1, color: '#188df0' },
+          ]),
+        },
       },
       {
         name: '毛利润',
         type: 'bar',
-        data: [6700, 6800, 6300, 5213, 4500, 4200, 4200, 3800],
+        data: [ 8000,8200, 8400, 8600, 8800],
         barWidth: 20,
         itemStyle: {
           color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
             { offset: 0, color: '#25d73c' },
             { offset: 0.5, color: '#1bc23d' },
-            { offset: 1, color: '#179e61' }
-          ])
-        }
+            { offset: 1, color: '#179e61' },
+          ]),
+        },
       },
       {
         name: '收入增长率',
         type: 'line',
         yAxisIndex: 1,
-        data: [65, 67, 65, 53, 47, 45, 43, 42, 41],
+        data: [  60,65, 70, 75, 80],
         itemStyle: {
-          color: '#67C23A'
-        }
+          color: '#67C23A',
+        },
       },
       {
         name: '利润增长率',
         type: 'line',
         yAxisIndex: 1,
-        data: [80, 81, 78, 67, 65, 60, 56, 51, 45],
+        data: [  70,75, 80, 85, 90],
         itemStyle: {
-          color: '#409EFF'
-        }
-      }
-    ]
+          color: '#409EFF',
+        },
+      },
+    ],
   } as EChartsOption);
   chart.value = barChart;
 }

src/views/dashboard/components/Chart/PieChart.vue

@@ -70,7 +70,7 @@ function initChart() {
         center: ['50%', '50%'],
         roseType: 'area',
         itemStyle: {
-          borderRadius: 6,
+          borderRadius: 1,
           color: function (params: any) {
             //自定义颜色
             const colorList = ['#409EFF', '#67C23A', '#E6A23C', '#F56C6C'];