pref:修改首页饼图为圆环图

@@ -358,6 +358,7 @@
   }
   }
 
 
   .chart-top-status {
   .chart-top-status {
+    width: 100%;
     height: 300px;
     height: 300px;
     align-items: center;
     align-items: center;
     margin-top: -40px;
     margin-top: -40px;

 <template>
 <template>
-  <div v-for="(item, index) in seriesStatusData" :key="index">
-    <div :id="`chartPie${item.key}`" style="width: 150px; height: 200px"></div>
-  </div>
+  <a-row :gutter="16" align="middle">
+    <a-col v-for="(item, index) in seriesStatusData" :key="index" :span="8">
+      <div :id="`chartPie${item.key}`" style="width: 150px; height: 200px"></div>
+    </a-col>
+  </a-row>
 </template>
 </template>
 <script lang="ts">
 <script lang="ts">
   import { defineComponent, PropType, onMounted, toRefs } from 'vue';
   import { defineComponent, PropType, onMounted, toRefs } from 'vue';
@@ -21,6 +23,7 @@
       const total = seriesStatusData.value
       const total = seriesStatusData.value
         .map((m) => m.value)
         .map((m) => m.value)
         .reduce((prev, cur) => prev! + cur!, 0);
         .reduce((prev, cur) => prev! + cur!, 0);
+
       onMounted(() => {
       onMounted(() => {
         seriesStatusData.value.forEach((item) => {
         seriesStatusData.value.forEach((item) => {
           initEchart(item.key, item, item.value);
           initEchart(item.key, item, item.value);