feat:首页新增饼状图和调整部分样式

@@ -90,22 +90,18 @@
   const radisStatusData = ref<string[]>(['40%', '70%']);
   const radisStatusData = ref<string[]>(['40%', '70%']);
   const growCardList = ref<CardList>();
   const growCardList = ref<CardList>();
   const legendData = ref(['gateway', 'directly', 'sub-device']);
   const legendData = ref(['gateway', 'directly', 'sub-device']);
-  const seriesData: Ref<seriesDataT[]> = ref([]);
+  const seriesData: Ref<seriesDataT[]> = ref([
+    { value: 1048, name: 'gateway', itemStyle: { color: '#3aa0ff' } },
+    { value: 735, name: 'directly', itemStyle: { color: '#36cbcb' } },
+    { value: 580, name: 'sub-device', itemStyle: { color: '#4ecb73' } },
+  ]);
   const legendStatusData = ref(['inactive', 'online', 'offline']);
   const legendStatusData = ref(['inactive', 'online', 'offline']);
-  const seriesStatusData: Ref<seriesDataT[]> = ref([]);
+  const seriesStatusData: Ref<seriesDataT[]> = ref([
+    { value: 1048, name: 'inactive', itemStyle: { color: '#3aa0ff' } },
+    { value: 735, name: 'online', itemStyle: { color: '#36cbcb' } },
+    { value: 580, name: 'offline', itemStyle: { color: '#4ecb73' } },
+  ]);
   onMounted(async () => {
   onMounted(async () => {
-    const mockData = [
-      { value: 1048, name: 'gateway', itemStyle: { color: '#3aa0ff' } },
-      { value: 735, name: 'directly', itemStyle: { color: '#36cbcb' } },
-      { value: 580, name: 'sub-device', itemStyle: { color: '#4ecb73' } },
-    ];
-    const mockTestData = [
-      { value: 1048, name: 'inactive', itemStyle: { color: '#3aa0ff' } },
-      { value: 735, name: 'online', itemStyle: { color: '#36cbcb' } },
-      { value: 580, name: 'offline', itemStyle: { color: '#4ecb73' } },
-    ];
-    seriesData.value = mockData;
-    seriesStatusData.value = mockTestData;
     const res = await getHomeData();
     const res = await getHomeData();
     growCardList.value = res;
     growCardList.value = res;
   });
   });

@@ -56,13 +56,13 @@
             width: 500,
             width: 500,
             height: 200,
             height: 200,
             left: 'center',
             left: 'center',
-            data: legendDatas,
+            data: legendDatas.value,
           },
           },
           series: [
           series: [
             {
             {
               type: 'pie',
               type: 'pie',
               radius: radisDatas.value,
               radius: radisDatas.value,
-              data: dataSeries,
+              data: dataSeries.value,
               emphasis: {
               emphasis: {
                 itemStyle: {
                 itemStyle: {
                   shadowBlur: 10,
                   shadowBlur: 10,