diff --git a/api-test/backend/src/main/java/io/metersphere/service/definition/ApiExecutionInfoService.java b/api-test/backend/src/main/java/io/metersphere/service/definition/ApiExecutionInfoService.java
index e37f8e4fe5..f081be9942 100644
--- a/api-test/backend/src/main/java/io/metersphere/service/definition/ApiExecutionInfoService.java
+++ b/api-test/backend/src/main/java/io/metersphere/service/definition/ApiExecutionInfoService.java
@@ -56,7 +56,7 @@ public class ApiExecutionInfoService {
                 } else {
                     String apiCaseIdInTestPlan = extTestPlanApiCaseMapper.getApiTestCaseIdById(resourceID);
                     if (StringUtils.isNotEmpty(apiCaseIdInTestPlan)) {
-                        apiBasieInfoByCaseId = extApiTestCaseMapper.selectApiBasicInfoByCaseId(resourceID);
+                        apiBasieInfoByCaseId = extApiTestCaseMapper.selectApiBasicInfoByCaseId(apiCaseIdInTestPlan);
                         if (apiBasieInfoByCaseId != null) {
                             this.insertApiCaseExecutionInfo(resourceID, result.getStatus(), result.getTriggerMode(), result.getProjectId(), ExecutionExecuteTypeEnum.TEST_PLAN.name(), apiBasieInfoByCaseId.getVersionId());
                         }
diff --git a/framework/sdk-parent/frontend/src/i18n/lang/en-US.js b/framework/sdk-parent/frontend/src/i18n/lang/en-US.js
index dcde992724..26aa738a2c 100644
--- a/framework/sdk-parent/frontend/src/i18n/lang/en-US.js
+++ b/framework/sdk-parent/frontend/src/i18n/lang/en-US.js
@@ -2010,10 +2010,10 @@ const message = {
         },
         table_value: {
           case_type: {
-            api: "Api case",
-            scene: "Scenario case",
-            load: "Load case",
-            functional: "Functional case"
+            api: "Api",
+            scene: "Scenario",
+            load: "Load",
+            functional: "Functional"
           }
         }
       },
diff --git a/framework/sdk-parent/frontend/src/i18n/lang/track/en-US.js b/framework/sdk-parent/frontend/src/i18n/lang/track/en-US.js
index 18d5195c5f..3589dae64e 100644
--- a/framework/sdk-parent/frontend/src/i18n/lang/track/en-US.js
+++ b/framework/sdk-parent/frontend/src/i18n/lang/track/en-US.js
@@ -302,8 +302,8 @@ export default {
     un_pass: "UnPass",
     comment: "Comment",
     my_review: "My Review",
-    my_create: "My Create",
-    reviewed_by_me: "Review By Me",
+    my_create: "Create",
+    reviewed_by_me: "Review",
     creator: "Creator",
     done: "Commented use cases",
     result_distribution: "Result Distribution",
diff --git a/test-track/backend/src/main/java/io/metersphere/dto/TrackStatisticsDTO.java b/test-track/backend/src/main/java/io/metersphere/dto/TrackStatisticsDTO.java
index 408982636f..73a8de0385 100644
--- a/test-track/backend/src/main/java/io/metersphere/dto/TrackStatisticsDTO.java
+++ b/test-track/backend/src/main/java/io/metersphere/dto/TrackStatisticsDTO.java
@@ -5,6 +5,7 @@ import io.metersphere.i18n.Translator;
 import io.metersphere.request.testcase.TrackCount;
 import lombok.Getter;
 import lombok.Setter;
+import org.apache.commons.collections.MapUtils;
 import org.apache.commons.lang3.StringUtils;
 
 import java.util.HashMap;
@@ -134,6 +135,13 @@ public class TrackStatisticsDTO {
             }
             this.allCaseCountNumber += countResult.getCountNumber();
         }
+        if (MapUtils.isEmpty(chartData)) {
+            // 空数据展示
+            chartData.put(TrackCount.P0, 0);
+            chartData.put(TrackCount.P1, 0);
+            chartData.put(TrackCount.P2, 0);
+            chartData.put(TrackCount.P3, 0);
+        }
         this.chartData = chartData;
     }
 
@@ -181,6 +189,13 @@ public class TrackStatisticsDTO {
             }
             this.allRelevanceCaseCount += countResult.getCountNumber();
         }
+
+        if (MapUtils.isEmpty(chartData)) {
+            // 空数据展示
+            chartData.put(Translator.get("api_case"), 0);
+            chartData.put(Translator.get("performance_case"), 0);
+            chartData.put(Translator.get("scenario_case"), 0);
+        }
         this.chartData = chartData;
     }
 
diff --git a/test-track/backend/src/main/java/io/metersphere/service/TrackService.java b/test-track/backend/src/main/java/io/metersphere/service/TrackService.java
index b46a85d0e0..0cc265d5b8 100644
--- a/test-track/backend/src/main/java/io/metersphere/service/TrackService.java
+++ b/test-track/backend/src/main/java/io/metersphere/service/TrackService.java
@@ -243,6 +243,11 @@ public class TrackService {
                 }
             });
         }
+        if (MapUtils.isEmpty(bugStatusMap)) {
+            for (IssueStatus statusEnum : IssueStatus.values()) {
+                bugStatusMap.put(Translator.get(statusEnum.getI18nKey()), 0);
+            }
+        }
         return bugStatusMap;
     }
 
diff --git a/test-track/frontend/src/business/home/TrackHome.vue b/test-track/frontend/src/business/home/TrackHome.vue
index 1f0b9e562b..59457e8b11 100644
--- a/test-track/frontend/src/business/home/TrackHome.vue
+++ b/test-track/frontend/src/business/home/TrackHome.vue
@@ -135,15 +135,15 @@ export default {
 }
 
 .track-home-layout :deep(.dashboard-card) {
-  height: 392px;
+  height: 408px;
 }
 
 .track-home-layout :deep(.main-info) {
-  height: 197px;
+  height: 208px;
 }
 
 .track-home-layout :deep(.main-info-card) {
-  height: 197px;
+  height: 208px;
   width: 100%;
   color: #646A73;
   background-color: #FFFFFF;
@@ -179,18 +179,43 @@ export default {
 }
 
 .track-home-layout :deep(.home-table-cell) {
-  height: 38px;
+  height: 40px;
   background-color: #F5F6F7;
   font-size: 14px;
   font-weight: 500;
   border: 1px solid rgba(31, 35, 41, 0.15);
   border-right-width: 0;
   border-left-width: 0;
-  color: #1F2329;
+  color: #646A73;
   line-height: 22px;
 }
 
 .track-home-layout :deep(.el-card) {
   border: 0;
 }
+
+.track-home-layout :deep(.table-title) {
+  color: #1F2329;
+  font-weight: 500;
+  font-size: 18px;
+  line-height: 26px;
+}
+
+.track-home-layout :deep(.el-table__row),
+.adjust-table :deep(.el-table__row .el-link) {
+  height: 40px;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 22px;
+  color: #1F2329;
+}
+
+.track-home-layout :deep(.el-table__body tr:hover ) {
+  cursor: pointer;
+}
+
+.track-home-layout :deep(.el-table .cell) {
+  padding-left: 12px;
+  padding-right: 12px;
+}
 </style>
diff --git a/test-track/frontend/src/business/home/components/CaseCountCard.vue b/test-track/frontend/src/business/home/components/CaseCountCard.vue
index e2aa1f9617..c817df630a 100644
--- a/test-track/frontend/src/business/home/components/CaseCountCard.vue
+++ b/test-track/frontend/src/business/home/components/CaseCountCard.vue
@@ -70,7 +70,7 @@
                           {{ $t("home.case_review_dashboard.not_pass") }}
                         </span>
                           <div class="common-amount">
-                            <el-link class="addition-info-num" @click="redirectPage('UnPass')">
+                            <el-link class="addition-info-num" @click="redirectPage('reviewFail')">
                               {{ formatAmount(trackData.unPassCount) }}
                             </el-link>
                           </div>
@@ -80,7 +80,7 @@
                           {{ $t("home.case_review_dashboard.pass") }}
                         </span>
                           <div class="common-amount">
-                            <el-link class="addition-info-num" @click="redirectPage('Pass')">
+                            <el-link class="addition-info-num" @click="redirectPage('reviewSuccess')">
                               {{ formatAmount(trackData.passCount) }}
                             </el-link>
                           </div>
diff --git a/test-track/frontend/src/business/home/components/CaseMaintenance.vue b/test-track/frontend/src/business/home/components/CaseMaintenance.vue
index 16e66a925d..2bd2ecc86f 100644
--- a/test-track/frontend/src/business/home/components/CaseMaintenance.vue
+++ b/test-track/frontend/src/business/home/components/CaseMaintenance.vue
@@ -14,7 +14,7 @@
         </div>
         <div v-show="!loadError">
           <el-container>
-            <ms-chart ref="chart1" :options="caseOption" :autoresize="true" style="width: 100%;height: 323px;"></ms-chart>
+            <ms-chart ref="chart1" :options="caseOption" :autoresize="true" style="width: 100%;height: 340px;"></ms-chart>
           </el-container>
         </div>
       </div>
@@ -91,11 +91,10 @@ export default {
         grid: {
           left: 0,
           containLabel: true,
-          bottom: 24,
-          top: 60,
+          top: 80,
           right: 24,
           width: 600,
-          height: 250
+          height: 255
         },
         legend: {
           itemWidth: 8,
@@ -103,7 +102,7 @@ export default {
           data: [{icon: 'rect', name: this.$t('test_track.home.function_case_count')}, {icon: 'rect', name: this.$t('test_track.home.relevance_case_count')}],
           orient: 'horizontal',
           left: '0',
-          top: '10'
+          top: '24'
         },
         series: [
           {
diff --git a/test-track/frontend/src/business/home/components/FailureTestCaseList.vue b/test-track/frontend/src/business/home/components/FailureTestCaseList.vue
index 39ee003cc4..3cd29880d0 100644
--- a/test-track/frontend/src/business/home/components/FailureTestCaseList.vue
+++ b/test-track/frontend/src/business/home/components/FailureTestCaseList.vue
@@ -1,11 +1,9 @@
 <template>
-  <el-card class="table-card" shadow="never" v-loading="loading">
-    <template v-slot:header>
-      <span class="table-title">
-        {{ $t('api_test.home_page.failed_case_list.title') }}
-      </span>
-    </template>
-    <div v-loading="loading" element-loading-background="#FFFFFF">
+  <div style="margin: 24px" class="failure-case-table">
+    <span class="table-title">
+      {{ $t('api_test.home_page.failed_case_list.title') }}
+    </span>
+    <div style="margin-top: 16px" v-loading="loading" element-loading-background="#FFFFFF">
       <div v-show="loadError"
            style="width: 100%; height: 300px; display: flex; flex-direction: column; justify-content: center;align-items: center">
         <img style="height: 100px;width: 100px;"
@@ -14,30 +12,30 @@
       </div>
       <div v-show="!loadError">
         <el-table :data="tableData" class="adjust-table table-content"
-                  header-cell-class-name="home-table-cell" max-height="226px">
-          <el-table-column type="index" :label="$t('home.case.index')" width="100" show-overflow-tooltip/>
-          <el-table-column prop="caseName" :label="$t('home.case.case_name')">
+                  header-cell-class-name="home-table-cell" style="min-height: 228px">
+          <el-table-column type="index" :label="$t('home.case.index')" show-overflow-tooltip width="100" />
+          <el-table-column prop="caseName" :label="$t('home.case.case_name')" min-width="200">
             <template v-slot:default="{row}">
-              <el-link type="info" @click="redirect(row.caseType,row.id)"
+              <el-link style="color: #783887; width: 100%;" :underline="false" type="info" @click="redirect(row.caseType,row.id)"
                        :disabled="(row.caseType === 'apiCase' && apiCaseReadOnly) || (row.caseType === 'scenario' && apiScenarioReadOnly) ||
                   (row.caseType === 'load' && loadCaseReadOnly) || (row.caseType === 'testCase' && testCaseReadOnly)">
                 {{ row.caseName }}
               </el-link>
             </template>
           </el-table-column>
-          <el-table-column prop="caseType" :label="$t('home.case.case_type')" show-overflow-tooltip column-key="caseType">
+          <el-table-column prop="caseType" :label="$t('home.case.case_type')" show-overflow-tooltip column-key="caseType" width="100">
             <template v-slot:default="scope">
               <basic-case-type-label :value="scope.row.caseType"></basic-case-type-label>
             </template>
           </el-table-column>
-          <el-table-column prop="testPlan" :label="$t('home.case.test_plan')">
+          <el-table-column prop="testPlan" :label="$t('home.case.test_plan')" min-width="200">
             <template v-slot:default="{row}">
-              <el-link type="info" @click="redirect('testPlanEdit',row.testPlanId)" v-permission-disable="['PROJECT_TRACK_PLAN:READ']">
+              <el-link style="color: #783887; width: 100%;" :underline="false" type="info" @click="redirect('testPlanEdit',row.testPlanId)" v-permission-disable="['PROJECT_TRACK_PLAN:READ']">
                 {{ row.testPlan }}
               </el-link>
             </template>
           </el-table-column>
-          <el-table-column prop="failureTimes" :label="$t('home.case.failure_times')" show-overflow-tooltip/>
+          <el-table-column prop="failureTimes" :label="$t('home.case.failure_times')" show-overflow-tooltip align="right" width="120"/>
           <template #empty>
             <div
               style="width: 100%;height: 144px;display: flex;flex-direction: column;justify-content: center;align-items: center">
@@ -51,7 +49,7 @@
                          :total="total"/>
       </div>
     </div>
-  </el-card>
+  </div>
 </template>
 
 <script>
@@ -131,14 +129,13 @@ export default {
 </script>
 
 <style scoped>
-.table-title {
-  color: #1F2329;
-  font-weight: 500;
-  font-size: 18px!important;
-  line-height: 26px;
+.failure-case-table :deep(.el-link--inner) {
+  width: 100%;
+  float: left;
 }
 
-.el-card :deep( .el-card__header ) {
-  border-bottom: 0px solid #EBEEF5;
+.failure-case-table :deep(.status-label) {
+  width: 75px;
+  text-align: center;
 }
 </style>
diff --git a/test-track/frontend/src/business/home/components/ReviewList.vue b/test-track/frontend/src/business/home/components/ReviewList.vue
index 881fd113bf..96f71df6e4 100644
--- a/test-track/frontend/src/business/home/components/ReviewList.vue
+++ b/test-track/frontend/src/business/home/components/ReviewList.vue
@@ -1,16 +1,15 @@
 <template>
-  <el-card class="table-card" shadow="never">
-    <div slot="header">
-      <span class="table-title">
-        {{ $t('test_track.home.case_review') }}
-      </span>
+  <div style="margin: 24px" class="review-case-table">
+    <span class="table-title">
+      {{ $t('test_track.home.case_review') }}
+    </span>
 
-      <div class="btn-group">
-        <ms-table-button icon="" :class="!showMyCreator ? 'hover reviewedBtn' : 'reviewedBtn'" :content="$t('test_track.review.reviewed_by_me')" @click="searchMyCreator('false')" style="border-color: #FFFFFF"/>
-        <ms-table-button icon="" :class="showMyCreator ? 'hover createBtn' : 'createBtn'" :content="$t('test_track.review.my_create')" @click="searchMyCreator('true')" style="border-color: #FFFFFF; margin-left: 3px"/>
-      </div>
+    <div class="btn-group">
+      <ms-table-button icon="" :class="!showMyCreator ? 'hover reviewedBtn' : 'reviewedBtn'" :content="$t('test_track.review.reviewed_by_me')" @click="searchMyCreator('false')" style="border-color: #FFFFFF"/>
+      <ms-table-button icon="" :class="showMyCreator ? 'hover createBtn' : 'createBtn'" :content="$t('test_track.review.my_create')" @click="searchMyCreator('true')" style="border-color: #FFFFFF; margin-left: 3px"/>
     </div>
-    <div v-loading="loading" element-loading-background="#FFFFFF">
+
+    <div style="margin-top: 16px" v-loading="loading" element-loading-background="#FFFFFF">
       <div v-show="loadError"
            style="width: 100%; height: 300px; display: flex; flex-direction: column; justify-content: center;align-items: center">
         <img style="height: 100px;width: 100px;"
@@ -18,18 +17,18 @@
         <span class="addition-info-title" style="color: #646A73">{{ $t("home.dashboard.public.load_error") }}</span>
       </div>
       <div v-show="!loadError">
-        <el-table class="adjust-table" :data="tableData" @row-click="intoPlan"
-                  header-cell-class-name="home-table-cell" max-height="226px">
-          <el-table-column type="index" width="100" :label="$t('home.table.index')" show-overflow-tooltip />
-          <el-table-column prop="name" :label="$t('commons.name')" show-overflow-tooltip />
-          <el-table-column prop="status" :label="$t('test_track.plan.plan_status')">
+        <el-table class="adjust-table table-content" :data="tableData" @row-click="intoPlan"
+                  header-cell-class-name="home-table-cell" style="min-height: 228px">
+          <el-table-column type="index" :label="$t('home.table.index')" show-overflow-tooltip width="100" />
+          <el-table-column prop="name" :label="$t('commons.name')" show-overflow-tooltip min-width="200" />
+          <el-table-column prop="status" :label="$t('test_track.plan.plan_status')" width="90">
             <template v-slot:default="scope">
               <basic-status-label :value="scope.row.status"></basic-status-label>
             </template>
           </el-table-column>
-          <el-table-column prop="creator" :label="$t('test_track.review.creator')" show-overflow-tooltip />
-          <el-table-column prop="reviewerName" :label="$t('test_track.review.reviewer')" show-overflow-tooltip />
-          <el-table-column :label="$t('test_track.review.result_distribution')" show-overflow-tooltip>
+          <el-table-column prop="creator" :label="$t('test_track.review.creator')" show-overflow-tooltip min-width="150" />
+          <el-table-column prop="reviewerName" :label="$t('test_track.review.reviewer')" show-overflow-tooltip min-width="150" />
+          <el-table-column :label="$t('test_track.review.result_distribution')" show-overflow-tooltip min-width="200">
             <template v-slot:default="scope">
               <el-tooltip :content="getResultTip(scope.row.total, scope.row.reviewed, scope.row.pass)"
                           placement="top" :enterable="false" class="item" effect="dark">
@@ -50,7 +49,7 @@
                          :total="total"/>
       </div>
     </div>
-  </el-card>
+  </div>
 </template>
 
 <script>
@@ -129,15 +128,14 @@ export default {
 </script>
 
 <style scoped>
-.table-title {
-  color: #1F2329;
-  font-weight: 500;
-  font-size: 18px!important;
-  line-height: 26px;
+.review-case-table :deep(.el-link--inner) {
+  width: 100%;
+  float: left;
 }
 
-.el-card :deep( .el-card__header ) {
-  border-bottom: 0px solid #EBEEF5;
+.review-case-table :deep(.status-label) {
+  width: 80px;
+  text-align: center;
 }
 
 .btn-group {
@@ -162,16 +160,16 @@ export default {
   width: 100px;
   height: 24px;
   position: relative;
-  left: 4px;
-  top: 4px;
+  left: 3px;
+  top: 3px;
 }
 
 :deep(button.el-button.el-button--mini.is-plain.reviewedBtn) {
   width: 72px;
   height: 24px;
   position: relative;
-  left: 4px;
-  top: 4px;
+  left: 3px;
+  top: 3px;
 }
 
 :deep(.reviewedBtn.el-button--mini.is-plain:hover) {
diff --git a/test-track/frontend/src/business/home/components/RunningTaskList.vue b/test-track/frontend/src/business/home/components/RunningTaskList.vue
index a2c0aa96a8..b28d6713ad 100644
--- a/test-track/frontend/src/business/home/components/RunningTaskList.vue
+++ b/test-track/frontend/src/business/home/components/RunningTaskList.vue
@@ -1,43 +1,38 @@
 <template>
-  <el-card class="table-card" shadow="never">
-    <template v-slot:header>
-      <span class="table-title">
-        {{ $t('api_test.home_page.running_task_list.title') }}
-      </span>
-    </template>
-    <div v-loading="loading" element-loading-background="#FFFFFF">
+  <div style="margin: 24px" class="running-task-table">
+    <span class="table-title">
+      {{ $t('api_test.home_page.running_task_list.title') }}
+    </span>
+    <div style="margin-top: 16px" v-loading="loading" element-loading-background="#FFFFFF">
       <div v-show="loadError"
-           style="width: 100%; height: 300px; display: flex; flex-direction: column;     justify-content: center;align-items: center">
+           style="width: 100%; height: 300px; display: flex; flex-direction: column; justify-content: center; align-items: center">
         <img style="height: 100px;width: 100px;"
              src="/assets/figma/icon_load_error.svg"/>
         <span class="addition-info-title" style="color: #646A73">{{ $t("home.dashboard.public.load_error") }}</span>
       </div>
       <div v-show="!loadError">
         <el-table
-          :enable-selection="false"
-          :condition="condition"
-          :data="tableData"
-          @refresh="search"
-          header-cell-class-name="home-table-cell" max-height="226px">
-          <el-table-column type="index" width="100" :label="$t('home.table.index')" show-overflow-tooltip/>
-          <el-table-column prop="name" :label="$t('commons.name')">
+          :enable-selection="false" :condition="condition" :data="tableData" class="adjust-table table-content"
+          @refresh="search" header-cell-class-name="home-table-cell" style="min-height: 228px">
+          <el-table-column type="index" :label="$t('home.table.index')" show-overflow-tooltip width="100" />
+          <el-table-column prop="name" :label="$t('commons.name')" min-width="200">
             <template v-slot:default="{row}">
               <!-- 若为只读用户不可点击之后跳转-->
               <span v-if="isReadOnly">
                 {{ row.name }}
               </span>
-              <el-link v-else type="info" @click="redirect(row)">
+              <el-link style="color: #783887;" :underline="false" v-else type="info" @click="redirect(row)">
                 {{ row.name }}
               </el-link>
             </template>
-          </el-table-column>
-          <ms-table-column prop="taskType" :label="$t('home.table.task_type')" :filters="typeFilters">
+          </el-table-column  >
+          <ms-table-column prop="taskType" :label="$t('home.table.task_type')" :filters="typeFilters" width="100">
             <template v-slot:default="scope">
               <basic-task-type-label :value="scope.row.taskGroup"></basic-task-type-label>
             </template>
           </ms-table-column>
-          <el-table-column prop="rule" :label="$t('home.table.run_rule')" show-overflow-tooltip/>
-          <el-table-column :label="$t('home.table.task_status')">
+          <el-table-column prop="rule" :label="$t('home.table.run_rule')" show-overflow-tooltip min-width="200"/>
+          <el-table-column :label="$t('home.table.task_status')" width="100">
             <template v-slot:default="scope">
               <div>
                 <el-switch
@@ -49,13 +44,13 @@
               </div>
             </template>
           </el-table-column>
-          <el-table-column :label="$t('home.table.next_execution_time')">
+          <el-table-column :label="$t('home.table.next_execution_time')" width="170">
             <template v-slot:default="scope">
               <span>{{ scope.row.nextExecutionTime | datetimeFormat }}</span>
             </template>
           </el-table-column>
-          <el-table-column prop="creator" :label="$t('home.table.create_user')" show-overflow-tooltip/>
-          <el-table-column :label="$t('home.table.update_time')">
+          <el-table-column prop="creator" :label="$t('home.table.create_user')" show-overflow-tooltip min-width="150" />
+          <el-table-column :label="$t('home.table.update_time')" width="170">
             <template v-slot:default="scope">
               <span>{{ scope.row.updateTime | datetimeFormat }}</span>
             </template>
@@ -73,7 +68,7 @@
                          :total="total"/>
       </div>
     </div>
-  </el-card>
+  </div>
 </template>
 
 <script>
@@ -193,18 +188,13 @@ export default {
 </script>
 
 <style scoped>
-.table-title {
-  color: #1F2329;
-  font-weight: 500;
-  font-size: 18px!important;
-  line-height: 26px;
+.running-task-table :deep(.el-link--inner) {
+  width: 100%;
+  float: left;
 }
 
-.el-table {
-  cursor: pointer;
-}
-
-.el-card :deep( .el-card__header ) {
-  border-bottom: 0px solid #EBEEF5;
+.running-task-table :deep(.status-label) {
+  width: 75px;
+  text-align: center;
 }
 </style>
diff --git a/test-track/frontend/src/business/home/components/chart/CountChart.vue b/test-track/frontend/src/business/home/components/chart/CountChart.vue
index 83d110846e..7d84f2ded3 100644
--- a/test-track/frontend/src/business/home/components/chart/CountChart.vue
+++ b/test-track/frontend/src/business/home/components/chart/CountChart.vue
@@ -1,9 +1,9 @@
 <template>
   <div v-if="reloadOver">
     <el-row type="flex" justify="left" align="left">
-      <div style="height: 184px; width: 100%; margin-left: 30px; margin-right: 30px;">
+      <div style="height: 208px; width: 100%; margin-left: 26px; margin-right: 30px;">
         <ms-chart :options="options"
-                  :height="184"
+                  :height="208"
                   width="100%"
                   :autoresize="true"/>
       </div>
@@ -120,17 +120,27 @@ export default {
           trigger: 'item'
         },
         legend: {
+          type: 'scroll',
           orient: 'vertical',
           icon: "rect",
           selectedMode: dataIsNotEmpty,
           itemGap: 16,
-          left: '45%',
+          left: '50%',
           y: 'center',
           itemHeight: 8,
           itemWidth: 8, //修改icon图形大小
           itemStyle: {
             borderWidth: 0.1
           },
+          pageIcons: {
+            vertical: [
+              'path://M387.84 164.906667a22.122667 22.122667 0 0 0-0.362667-30.72 20.522667 20.522667 0 0 0-29.674666 0.362666L0 512.853333l357.802667 378.282667c8.042667 8.533333 21.290667 8.746667 29.674666 0.341333 8.32-8.32 8.533333-22.016 0.384-30.72L60.330667 512.853333 387.861333 164.906667z',
+              'path://M709.845333 250.346667a22.4 22.4 0 0 1 0.533334-30.848 20.48 20.48 0 0 1 29.717333 0.64l272.426667 292.693333-272.426667 292.650667a20.458667 20.458667 0 0 1-29.717333 0.64c-8.32-8.32-8.746667-21.973333-0.533334-30.848l242.346667-262.464-242.346667-262.464z',
+            ],
+          },
+          pageIconColor: '#1F2329', // 可以点击的翻页按钮颜色
+          pageIconInactiveColor: '#7f7f7f', // 禁用的按钮颜色
+          pageIconSize: 14, //这当然就是按钮的大小
           textStyle: {
             align: 'right',
             rich: {
@@ -166,7 +176,7 @@ export default {
           text: "{mainTitle|" + this.mainTitle + "}\n\n{number|" + this.getAmount() + "}\n\n",
           subtext: this.$t("home.dashboard.public.this_week") + ": +" + formatNumber(this.weekCount) + " >",
           top: "center",
-          left: "86px",
+          left: "100px",
           textAlign: 'center',
           textStyle: {
             rich: {
@@ -197,8 +207,8 @@ export default {
         series: [
           {
             type: 'pie',
-            radius: ['70%', '96%'],
-            center: ['92px', '50%'],
+            radius: [75, 100],
+            center: ['104px', '50%'],
             avoidLabelOverlap: false,
             hoverAnimation: dataIsNotEmpty,
             legendHoverLink: false,