From b65afe97a7f2ca0109c8a59e23243a569d6b2d64 Mon Sep 17 00:00:00 2001
From: "Captain.B" <bin@fit2cloud.com>
Date: Wed, 30 Jun 2021 16:23:05 +0800
Subject: [PATCH] =?UTF-8?q?refactor(=E6=80=A7=E8=83=BD=E6=B5=8B=E8=AF=95):?=
 =?UTF-8?q?=20=E6=9F=A5=E7=9C=8B=E6=B5=8B=E8=AF=95=E8=AF=A6=E6=83=85?=
 =?UTF-8?q?=E5=92=8C=E7=9B=91=E6=8E=A7=E8=AF=A6=E6=83=85=E6=97=B6=E6=97=B6?=
 =?UTF-8?q?=E9=97=B4=E8=BD=B4=E6=94=AF=E6=8C=81=E9=80=89=E6=8B=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../report/components/MonitorCard.vue         | 36 ++++++++++++-------
 .../report/components/TestDetails.vue         | 24 ++++++++-----
 2 files changed, 39 insertions(+), 21 deletions(-)

diff --git a/frontend/src/business/components/performance/report/components/MonitorCard.vue b/frontend/src/business/components/performance/report/components/MonitorCard.vue
index 019822b62e..68a9584dc0 100644
--- a/frontend/src/business/components/performance/report/components/MonitorCard.vue
+++ b/frontend/src/business/components/performance/report/components/MonitorCard.vue
@@ -8,9 +8,11 @@
               <el-collapse-item :title="$t('Monitor')" name="0">
                 <el-checkbox-group v-model="checkList"
                                    @change="handleChecked(item)">
-                  <el-checkbox :label="op.label" v-for="op in checkOptions"
-                               :key="op.key"
-                               :content="op.label"/>
+                  <div v-for="op in checkOptions"
+                       :key="op.key"
+                       :content="op.label">
+                    <el-checkbox :label="op.label"/>
+                  </div>
                 </el-checkbox-group>
               </el-collapse-item>
             </el-collapse>
@@ -56,21 +58,16 @@ export default {
         grid: {
           // right: '35%' // 动态改这个值
         },
-        title: {
-          text: 'Monitor',
-          left: 'center',
-          top: 20,
-          textStyle: {
-            color: '#99743C'
-          },
-        },
+        title: {},
         tooltip: {
           trigger: 'axis',
           axisPointer: {
             type: 'cross'
           },
         },
-        legend: {},
+        legend: {
+          y: 'top'
+        },
         xAxis: {type: 'category'},
         yAxis: [{
           name: 'Usage(%)',
@@ -82,6 +79,17 @@ export default {
           name: 'kb/s',
           min: 0,
         }],
+        dataZoom: [
+          {
+            type: 'inside',
+            start: 0,
+            end: 100
+          },
+          {
+            start: 0,
+            end: 20
+          }
+        ],
         series: []
       },
       totalOption: {}
@@ -200,4 +208,8 @@ export default {
   height: calc(100vh - 375px);
   overflow: auto;
 }
+
+/deep/ .el-checkbox__label {
+  font-size: 10px !important;
+}
 </style>
diff --git a/frontend/src/business/components/performance/report/components/TestDetails.vue b/frontend/src/business/components/performance/report/components/TestDetails.vue
index c2a0c3f1ab..218ed052a9 100644
--- a/frontend/src/business/components/performance/report/components/TestDetails.vue
+++ b/frontend/src/business/components/performance/report/components/TestDetails.vue
@@ -284,14 +284,7 @@ export default {
         grid: {
           // right: '35%' // 动态改这个值
         },
-        title: {
-          text: 'Test Details',
-          left: 'center',
-          top: 20,
-          textStyle: {
-            color: '#99743C'
-          },
-        },
+        title: {},
         tooltip: {
           show: true,
           trigger: 'axis',
@@ -316,9 +309,22 @@ export default {
             return result;
           }
         },
-        legend: {},
+        legend: {
+          y: 'top',
+        },
         xAxis: {},
         yAxis: [],
+        dataZoom: [
+          {
+            type: 'inside',
+            start: 0,
+            end: 100
+          },
+          {
+            start: 0,
+            end: 20
+          }
+        ],
         series: []
       },
       seriesData: [],