From ccbcc3271f709f47dc9b3a95ce5ce02f2e7d5a29 Mon Sep 17 00:00:00 2001
From: song-tianyang <tianyang.song@fit2cloud.com>
Date: Tue, 27 Jul 2021 14:30:45 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=9B=B4=E6=94=B9=E4=BA=86=E6=B5=8B?=
 =?UTF-8?q?=E8=AF=95=E6=8A=A5=E5=91=8A=E7=9A=84=E6=88=90=E5=8A=9F=E5=A4=B1?=
 =?UTF-8?q?=E8=B4=A5=E5=9B=BE=E6=A0=87=E7=9A=84=E6=A0=B7=E5=BC=8F=EF=BC=8C?=
 =?UTF-8?q?=E7=94=A8=E4=BA=8E=E4=BF=AE=E5=A4=8D=E6=89=93=E5=8D=B0=E6=8A=A5?=
 =?UTF-8?q?=E5=91=8A=E6=97=B6=E5=85=83=E7=B4=A0=E5=BC=82=E5=B8=B8=E7=9A=84?=
 =?UTF-8?q?=E7=BC=BA=E9=99=B7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

--bug=1005179 --user=宋天阳 【接口测试-接口自动化】导出测试报告元素显示异常
https://www.tapd.cn/55049933/s/1029492
---
 .../report/components/MetricChart.vue         | 39 ++++++++++++++++---
 1 file changed, 33 insertions(+), 6 deletions(-)

diff --git a/frontend/src/business/components/api/automation/report/components/MetricChart.vue b/frontend/src/business/components/api/automation/report/components/MetricChart.vue
index d73c25a9a9..b4878df4d8 100644
--- a/frontend/src/business/components/api/automation/report/components/MetricChart.vue
+++ b/frontend/src/business/components/api/automation/report/components/MetricChart.vue
@@ -19,13 +19,15 @@
           </div>
           <ms-chart id="chart" ref="chart" :options="options" :autoresize="true" v-else/>
           <el-row type="flex" justify="center" align="middle">
-            <i class="circle success"/>
+<!--            <i class="circle success"/>-->
+            <span class="ms-point-success"/>
             <div class="metric-box">
               <div class="value">{{ content.success }}</div>
               <div class="name">{{ $t('api_report.success') }}</div>
             </div>
             <div style="width: 40px"></div>
-            <i class="circle fail"/>
+<!--            <i class="circle fail"/>-->
+            <span class="ms-point-error"/>
             <div class="metric-box">
               <div class="value">{{ content.error }}</div>
               <div class="name">{{ $t('api_report.fail') }}</div>
@@ -42,13 +44,15 @@
               <div class="value">{{ content.scenarioTotal ? content.scenarioTotal : 0}}</div>
               <div class="name">{{ $t('api_test.scenario.scenario') }}</div>
             </div>
-            <i class="circle success" style="margin-left: 20px;margin-right: 20px"/>
+<!--            <i class="circle success" style="margin-left: 20px;margin-right: 20px"/>-->
+            <span class="ms-point-success"/>
             <div class="metric-box">
               <div class="value">{{ content.scenarioSuccess ? content.scenarioSuccess: 0 }}</div>
               <div class="name">{{ $t('api_report.success') }}</div>
             </div>
 <!--            <div style="width: 40px"></div>-->
-            <i class="circle fail" style="margin-left: 20px;margin-right: 20px"/>
+<!--            <i class="circle fail" style="margin-left: 20px;margin-right: 20px"/>-->
+            <span class="ms-point-error"/>
             <div class="metric-box">
               <div class="value">{{ content.scenarioError ? content.scenarioError : 0 }}</div>
               <div class="name">{{ $t('api_report.fail') }}</div>
@@ -61,13 +65,15 @@
                 <div class="value">{{ content.scenarioStepTotal ? content.scenarioStepTotal : 0}}</div>
                 <div class="name">{{ $t('test_track.plan_view.step') }}</div>
               </div>
-              <i class="circle success" style="margin-left: 20px;margin-right: 20px"/>
+              <span class="ms-point-success"/>
+<!--              <i class="circle success" style="margin-left: 20px;margin-right: 20px"/>-->
               <div class="metric-box">
                 <div class="value">{{ content.scenarioStepSuccess ? content.scenarioStepSuccess: 0 }}</div>
                 <div class="name">{{ $t('api_report.success') }}</div>
               </div>
               <!--            <div style="width: 40px"></div>-->
-              <i class="circle fail" style="margin-left: 20px;margin-right: 20px"/>
+<!--              <i class="circle fail" style="margin-left: 20px;margin-right: 20px"/>-->
+              <span class="ms-point-error"/>
               <div class="metric-box">
                 <div class="value">{{ content.scenarioStepError ? content.scenarioStepError : 0 }}</div>
                 <div class="name">{{ $t('api_report.fail') }}</div>
@@ -335,4 +341,25 @@
     line-height: 110px;
     text-align: center;
   }
+  .ms-point-success {
+    border-radius: 50%;
+    height: 12px;
+    width: 12px;
+    display: inline-block;
+    vertical-align: top;
+    margin-left: 20px;
+    margin-right: 20px;
+    background-color : #67C23A;
+  }
+
+  .ms-point-error {
+    border-radius: 50%;
+    height: 12px;
+    width: 12px;
+    display: inline-block;
+    vertical-align: top;
+    margin-left: 20px;
+    margin-right: 20px;
+    background-color : #F56C6C;
+  }
 </style>