From d8c7a3c1d883f4cf67921a4c17939dfa4e214f51 Mon Sep 17 00:00:00 2001
From: fit2-zhao <yong.zhao@fit2cloud.com>
Date: Mon, 13 Sep 2021 16:40:13 +0800
Subject: [PATCH] =?UTF-8?q?fix=20(=E6=8E=A5=E5=8F=A3=E8=87=AA=E5=8A=A8?=
 =?UTF-8?q?=E5=8C=96):=20=E4=BF=AE=E5=A4=8D=E5=BE=AA=E7=8E=AF=E6=89=A7?=
 =?UTF-8?q?=E8=A1=8C=E5=90=8E=E7=8A=B6=E6=80=81=E7=A0=81=E9=94=99=E8=AF=AF?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98=20--bug=3D1006465=20--user=3D=E8=B5=B5?=
 =?UTF-8?q?=E5=8B=87=20=E3=80=90github#6020=E3=80=91=E8=B0=83=E8=AF=95?=
 =?UTF-8?q?=E7=9A=84...=20https://www.tapd.cn/55049933/s/1046076?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../scenario/component/ApiComponent.vue       | 28 +++++-
 .../components/response/RequestMetric.vue     | 91 ++++++++++---------
 2 files changed, 75 insertions(+), 44 deletions(-)

diff --git a/frontend/src/business/components/api/automation/scenario/component/ApiComponent.vue b/frontend/src/business/components/api/automation/scenario/component/ApiComponent.vue
index b83ab2f084..0d82ce1002 100644
--- a/frontend/src/business/components/api/automation/scenario/component/ApiComponent.vue
+++ b/frontend/src/business/components/api/automation/scenario/component/ApiComponent.vue
@@ -26,13 +26,13 @@
            <i class="el-icon-loading" style="font-size: 16px"/>
            {{ $t('commons.testing') }}
          </span>
-        <span class="ms-step-debug-code" :class="request.requestResult[0].success?'ms-req-success':'ms-req-error'" v-if="!loading &&!request.testing && request.debug && request.requestResult[0] && request.requestResult[0].responseResult">
-          {{ request.requestResult[0].success ? 'success' : 'error' }}
+        <span class="ms-step-debug-code" :class="request.requestResult[0].success && reqSuccess?'ms-req-success':'ms-req-error'" v-if="!loading &&!request.testing && request.debug && request.requestResult[0] && request.requestResult[0].responseResult">
+          {{ request.requestResult[0].success && reqSuccess ? 'success' : 'error' }}
         </span>
       </template>
       <template v-slot:button>
         <el-tooltip :content="$t('api_test.run')" placement="top" v-if="!loading">
-          <el-button :disabled="!request.enable" @click="run" icon="el-icon-video-play" style="padding: 5px" class="ms-btn" size="mini" circle />
+          <el-button :disabled="!request.enable" @click="run" icon="el-icon-video-play" style="padding: 5px" class="ms-btn" size="mini" circle/>
         </el-tooltip>
         <el-tooltip :content="$t('report.stop_btn')" placement="top" :enterable="false" v-else>
           <el-button :disabled="!request.enable" @click.once="stop" size="mini" style="color:white;padding: 0 0.1px;width: 24px;height: 24px;" class="stop-btn" circle>
@@ -187,6 +187,7 @@ export default {
       environment: {},
       result: {},
       apiActive: false,
+      reqSuccess: true
     }
   },
   created() {
@@ -227,6 +228,7 @@ export default {
       this.getEnvironments();
     },
     message() {
+      this.forStatus();
       this.reload();
     },
   },
@@ -300,6 +302,26 @@ export default {
     },
   },
   methods: {
+    forStatus() {
+      if (this.request.result && this.request.result.length > 0) {
+        this.request.result.forEach(item => {
+          item.requestResult.forEach(req => {
+            if (!req.success) {
+              this.reqSuccess = req.success;
+            }
+          })
+        })
+      } else if (this.request.requestResult && this.request.requestResult.length > 1) {
+        this.request.requestResult.forEach(item => {
+          if (!item.success) {
+            this.reqSuccess = item.success;
+            if (this.node && this.node.parent && this.node.parent.data) {
+              this.node.parent.data.code = 'error';
+            }
+          }
+        })
+      }
+    },
     initDataSource() {
       let databaseConfigsOptions = [];
       if (this.request.protocol === 'SQL' || this.request.type === 'JDBCSampler') {
diff --git a/frontend/src/business/components/api/definition/components/response/RequestMetric.vue b/frontend/src/business/components/api/definition/components/response/RequestMetric.vue
index c91df3f3fa..87c6f97c31 100644
--- a/frontend/src/business/components/api/definition/components/response/RequestMetric.vue
+++ b/frontend/src/business/components/api/definition/components/response/RequestMetric.vue
@@ -2,68 +2,77 @@
   <div class="metric-container">
     <el-row type="flex">
       <el-col>
-        <div style="font-size: 14px;color: #AAAAAA;float: left">{{$t('api_report.response_code')}} :</div>
+        <div style="font-size: 14px;color: #AAAAAA;float: left">{{ $t('api_report.response_code') }} :</div>
         <el-tooltip
           :content="responseResult.responseCode"
           placement="top">
-          <div class="node-title">
-            {{responseResult && responseResult.responseCode ? responseResult.responseCode :'0'}}
+          <div class="node-title" :class="response && response.success ?'ms-req-success':'ms-req-error'">
+            {{ responseResult && responseResult.responseCode ? responseResult.responseCode : '0' }}
           </div>
         </el-tooltip>
       </el-col>
       <el-col>
-        <div style="font-size: 14px;color: #AAAAAA;float: left">{{$t('api_report.response_time')}} :</div>
-        <div style="font-size: 14px;color:#61C550;margin-top:2px;margin-left:10px;float: left">{{responseResult && responseResult.responseTime?responseResult.responseTime:0}} ms</div>
+        <div style="font-size: 14px;color: #AAAAAA;float: left">{{ $t('api_report.response_time') }} :</div>
+        <div style="font-size: 14px;color:#61C550;margin-top:2px;margin-left:10px;float: left">{{ responseResult && responseResult.responseTime ? responseResult.responseTime : 0 }} ms</div>
       </el-col>
       <el-col>
-        <div style="font-size: 14px;color: #AAAAAA;float: left">{{$t('api_report.response_size')}} :</div>
-        <div style="font-size: 14px;color:#61C550; margin-top:2px;margin-left:10px;float: left">{{responseResult && responseResult.responseSize?responseResult.responseSize:0}} bytes</div>
+        <div style="font-size: 14px;color: #AAAAAA;float: left">{{ $t('api_report.response_size') }} :</div>
+        <div style="font-size: 14px;color:#61C550; margin-top:2px;margin-left:10px;float: left">{{ responseResult && responseResult.responseSize ? responseResult.responseSize : 0 }} bytes</div>
       </el-col>
     </el-row>
   </div>
 </template>
 
 <script>
-  export default {
-    name: "MsRequestMetric",
+export default {
+  name: "MsRequestMetric",
 
-    props: {
-      response: {
-        type: Object,
-        default() {
-          return {}
-        }
-      }
-    },
-
-
-    computed: {
-      responseResult() {
-        return this.response && this.response.responseResult ? this.response.responseResult : {};
-      },
-      error() {
-        return this.response && this.response.responseCode && this.response.responseCode >= 400;
+  props: {
+    response: {
+      type: Object,
+      default() {
+        return {}
       }
     }
+  },
+
+
+  computed: {
+    responseResult() {
+      return this.response && this.response.responseResult ? this.response.responseResult : {};
+    },
+    error() {
+      return this.response && this.response.responseCode && this.response.responseCode >= 400;
+    }
   }
+}
 </script>
 
 <style scoped>
-  .metric-container {
-    padding-bottom: 10px;
-  }
+.metric-container {
+  padding-bottom: 10px;
+}
+
+.node-title {
+  width: 150px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  flex: 1 1 auto;
+  padding: 0px 5px;
+  overflow: hidden;
+  font-size: 14px;
+  color: #61C550;
+  margin-top: 2px;
+  margin-left: 10px;
+  float: left
+}
+
+.ms-req-error {
+  color: #F56C6C;
+}
+
+.ms-req-success {
+  color: #67C23A;
+}
 
-  .node-title {
-    width: 150px;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    flex: 1 1 auto;
-    padding: 0px 5px;
-    overflow: hidden;
-    font-size: 14px;
-    color: #61C550;
-    margin-top: 2px;
-    margin-left: 10px;
-    float: left
-  }
 </style>