fix (接口自动化): 修复循环执行后状态码错误问题

--bug=1006465 --user=赵勇 【github#6020】调试的... https://www.tapd.cn/55049933/s/1046076

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') {

frontend/src/business/components/api/definition/components/response/RequestMetric.vue

@@ -2,29 +2,29 @@
   <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 {
+export default {
   name: "MsRequestMetric",
 
   props: {
@@ -45,15 +45,15 @@
       return this.response && this.response.responseCode && this.response.responseCode >= 400;
     }
   }
-  }
+}
 </script>
 
 <style scoped>
-  .metric-container {
+.metric-container {
   padding-bottom: 10px;
-  }
+}
 
-  .node-title {
+.node-title {
   width: 150px;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -65,5 +65,14 @@
   margin-top: 2px;
   margin-left: 10px;
   float: left
-  }
+}
+
+.ms-req-error {
+  color: #F56C6C;
+}
+
+.ms-req-success {
+  color: #67C23A;
+}
+
 </style>