fix(接口测试): 修复执行测试用例显示测试中，无法停止问题

--bug=1009232 --user=赵勇 【接口测试】执行测试用例还是一直执行中【+github#8807】 https://www.tapd.cn/55049933/s/1087011

frontend/src/business/components/api/automation/scenario/component/ApiResponseComponent.vue

@@ -60,7 +60,7 @@ export default {
       if (this.apiItem && this.apiItem.id) {
         let url = "/api/definition/report/getReport/" + this.apiItem.id;
         this.$get(url, response => {
-          if (response.data) {
+          if (response.data && response.data.content) {
             try {
               let data = JSON.parse(response.data.content);
               this.response = data;

frontend/src/business/components/api/definition/components/Run.vue

@@ -23,7 +23,7 @@ export default {
     return {
       result: {},
       loading: false,
-      requestResult: {},
+      requestResult: {responseResult: {}},
       reqNumber: 0,
       websocket: {}
     }
@@ -123,6 +123,7 @@ export default {
         threadGroup.hashTree.push(item);
       })
       this.sort(testPlan.hashTree);
+      this.requestResult.reportId = this.reportId;
       let reqObj = {id: this.reportId, testElement: testPlan, type: this.type, clazzName: this.clazzName ? this.clazzName : TYPE_TO_C.get(this.type), projectId: projectId, environmentMap: strMapToObj(this.envMap)};
       let bodyFiles = getBodyUploadFiles(reqObj, this.runData);
       if (this.runData[0].url) {

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

@@ -1,6 +1,5 @@
 <template>
-  <div class="text-container">
+  <div class="text-container" v-if="responseResult">
-
     <el-tabs v-model="activeName" v-show="isActive">
       <el-tab-pane :label="$t('api_test.definition.request.response_body')" name="body" class="pane">
         <ms-sql-result-table v-if="isSqlType" :body="responseResult.body"/>
@@ -38,149 +37,147 @@
 </template>
 
 <script>
-  import MsAssertionResults from "./AssertionResults";
+import MsAssertionResults from "./AssertionResults";
-  import MsCodeEdit from "../MsCodeEdit";
+import MsCodeEdit from "../MsCodeEdit";
-  import MsDropdown from "../../../../common/components/MsDropdown";
+import MsDropdown from "../../../../common/components/MsDropdown";
-  import {BODY_FORMAT} from "../../model/ApiTestModel";
+import {BODY_FORMAT} from "../../model/ApiTestModel";
-  import MsSqlResultTable from "./SqlResultTable";
+import MsSqlResultTable from "./SqlResultTable";
 
-  export default {
+export default {
-    name: "MsResponseResult",
+  name: "MsResponseResult",
 
-    components: {
+  components: {
-      MsDropdown,
+    MsDropdown,
-      MsCodeEdit,
+    MsCodeEdit,
-      MsAssertionResults,
+    MsAssertionResults,
-      MsSqlResultTable
+    MsSqlResultTable
-    },
+  },
 
-    props: {
+  props: {
-      response: Object,
+    response: Object,
-      currentProtocol: String,
+    currentProtocol: String,
-    },
+  },
 
-    data() {
+  data() {
-      return {
+    return {
-        isActive: true,
+      isActive: true,
-        activeName: "body",
+      activeName: "body",
-        modes: ['text', 'json', 'xml', 'html'],
+      modes: ['text', 'json', 'xml', 'html'],
-        sqlModes: ['text', 'table'],
+      sqlModes: ['text', 'table'],
-        mode: BODY_FORMAT.TEXT,
+      mode: BODY_FORMAT.TEXT,
-        isMsCodeEditShow: true,
+      isMsCodeEditShow: true,
-        reqMessages: "",
+      reqMessages: "",
-      }
+    }
-    },
+  },
-    watch: {
+  watch: {
-      response() {
+    response() {
-        this.setBodyType();
-        this.setReqMessage();
-      }
-    },
-    methods: {
-      modeChange(mode) {
-        this.mode = mode;
-      },
-      sqlModeChange(mode) {
-        this.mode = mode;
-      },
-      setBodyType() {
-        if (!this.response.responseResult || !this.response.responseResult.headers) {
-          return;
-        }
-        if (this.response.responseResult.headers.indexOf("Content-Type: application/json") > 0) {
-          this.mode = BODY_FORMAT.JSON;
-          this.$nextTick(() => {
-            if (this.$refs.modeDropdown) {
-              this.$refs.modeDropdown.handleCommand(BODY_FORMAT.JSON);
-              this.msCodeReload();
-            }
-          })
-        }
-      },
-      msCodeReload() {
-        this.isMsCodeEditShow = false;
-        this.$nextTick(() => {
-          this.isMsCodeEditShow = true;
-        });
-      },
-      setReqMessage() {
-        if (this.response) {
-          if (!this.response.url) {
-            this.response.url = "";
-          }
-          if (!this.response.headers) {
-            this.response.headers = "";
-          }
-          if (!this.response.cookies) {
-            this.response.cookies = "";
-          }
-          if (!this.response.body) {
-            this.response.body = "";
-          }
-          if (!this.response.responseResult) {
-            this.response.responseResult = {};
-          }
-          if (!this.response.responseResult.vars) {
-            this.response.responseResult.vars = "";
-          }
-          this.reqMessages = this.$t('api_test.request.address') + ":\n" + this.response.url + "\n" +
-            this.$t('api_test.scenario.headers') + ":\n" + this.response.headers + "\n" + "Cookies :\n" +
-            this.response.cookies + "\n" + "Body:" + "\n" + this.response.body;
-        }
-      },
-    },
-    mounted() {
       this.setBodyType();
       this.setReqMessage();
+    }
+  },
+  methods: {
+    modeChange(mode) {
+      this.mode = mode;
     },
-    computed: {
+    sqlModeChange(mode) {
-      isSqlType() {
+      this.mode = mode;
-        return (this.currentProtocol === "SQL" && this.response.responseResult.responseCode === '200' && this.mode === 'table');
+    },
-      },
+    setBodyType() {
-      responseResult() {
+      if (this.response && this.response.responseResult && this.response.responseResult.headers
-        return this.response && this.response.responseResult ? this.response.responseResult : {};
+        && this.response.responseResult.headers.indexOf("Content-Type: application/json") > 0) {
+        this.mode = BODY_FORMAT.JSON;
+        this.$nextTick(() => {
+          if (this.$refs.modeDropdown) {
+            this.$refs.modeDropdown.handleCommand(BODY_FORMAT.JSON);
+            this.msCodeReload();
+          }
+        })
       }
+    },
+    msCodeReload() {
+      this.isMsCodeEditShow = false;
+      this.$nextTick(() => {
+        this.isMsCodeEditShow = true;
+      });
+    },
+    setReqMessage() {
+      if (this.response) {
+        if (!this.response.url) {
+          this.response.url = "";
+        }
+        if (!this.response.headers) {
+          this.response.headers = "";
+        }
+        if (!this.response.cookies) {
+          this.response.cookies = "";
+        }
+        if (!this.response.body) {
+          this.response.body = "";
+        }
+        if (!this.response.responseResult) {
+          this.response.responseResult = {};
+        }
+        if (!this.response.responseResult.vars) {
+          this.response.responseResult.vars = "";
+        }
+        this.reqMessages = this.$t('api_test.request.address') + ":\n" + this.response.url + "\n" +
+          this.$t('api_test.scenario.headers') + ":\n" + this.response.headers + "\n" + "Cookies :\n" +
+          this.response.cookies + "\n" + "Body:" + "\n" + this.response.body;
+      }
+    },
+  },
+  mounted() {
+    this.setBodyType();
+    this.setReqMessage();
+  },
+  computed: {
+    isSqlType() {
+      return (this.currentProtocol === "SQL" && this.response.responseResult.responseCode === '200' && this.mode === 'table');
+    },
+    responseResult() {
+      return this.response && this.response.responseResult ? this.response.responseResult : {};
     }
   }
+}
 </script>
 
 <style scoped>
-  .text-container .icon {
+.text-container .icon {
-    padding: 5px;
+  padding: 5px;
-  }
+}
 
-  .text-container .collapse {
+.text-container .collapse {
-    cursor: pointer;
+  cursor: pointer;
-  }
+}
 
-  .text-container .collapse:hover {
+.text-container .collapse:hover {
-    opacity: 0.8;
+  opacity: 0.8;
-  }
+}
 
-  .text-container .icon.is-active {
+.text-container .icon.is-active {
-    transform: rotate(90deg);
+  transform: rotate(90deg);
-  }
+}
 
-  .text-container .pane {
+.text-container .pane {
-    background-color: #F5F5F5;
+  background-color: #F5F5F5;
   padding: 1px 0;
-    height: 250px;
+  height: 250px;
-    overflow-y: auto;
+  overflow-y: auto;
-  }
+}
 
-  .text-container .pane.cookie {
+.text-container .pane.cookie {
-    padding: 0;
+  padding: 0;
-  }
+}
 
-  /deep/ .el-tabs__nav-wrap::after {
+/deep/ .el-tabs__nav-wrap::after {
-    height: 0px;
+  height: 0px;
-  }
+}
 
-  .ms-div {
+.ms-div {
-    margin-top: 20px;
+  margin-top: 20px;
-  }
+}
 
-  pre {
+pre {
-    margin: 0;
+  margin: 0;
-  }
+}
 </style>