From 698ab5db12f647582495f4043890a0b70ce981e7 Mon Sep 17 00:00:00 2001
From: fit2-zhao <yong.zhao@fit2cloud.com>
Date: Tue, 3 Aug 2021 09:51:54 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E6=8E=A5=E5=8F=A3=E5=AE=9A=E4=B9=89):=20?=
 =?UTF-8?q?=E9=9C=80=E6=B1=824=20=E5=8F=AF=E4=BB=A5=E5=85=A8=E5=B1=80?=
 =?UTF-8?q?=E8=AE=BE=E7=BD=AE=E7=8E=AF=E5=A2=83=E9=80=89=E9=A1=B9=20#10017?=
 =?UTF-8?q?50=20--story=3D1001750=20--user=3D=E8=B5=B5=E5=8B=87=204.?=
 =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E5=AE=9A=E4=B9=89=E5=A2=9E=E5=8A=A0=E5=85=A8?=
 =?UTF-8?q?=E5=B1=80=E8=BF=90...=20https://www.tapd.cn/55049933/s/1031567?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/case/ApiCaseList.vue           |   3 +
 .../components/runtest/RunTestHTTPPage.vue    | 389 +++++++++---------
 2 files changed, 199 insertions(+), 193 deletions(-)

diff --git a/frontend/src/business/components/api/definition/components/case/ApiCaseList.vue b/frontend/src/business/components/api/definition/components/case/ApiCaseList.vue
index adc923cdd..1e50c788d 100644
--- a/frontend/src/business/components/api/definition/components/case/ApiCaseList.vue
+++ b/frontend/src/business/components/api/definition/components/case/ApiCaseList.vue
@@ -141,6 +141,9 @@ export default {
     if (this.createCase) {
       this.sysAddition();
     }
+    if (!this.environment && this.$store.state.useEnvironment) {
+      this.environment = this.$store.state.useEnvironment;
+    }
   },
   computed: {
     isCaseEdit() {
diff --git a/frontend/src/business/components/api/definition/components/runtest/RunTestHTTPPage.vue b/frontend/src/business/components/api/definition/components/runtest/RunTestHTTPPage.vue
index d72c95f8e..270fcde2f 100644
--- a/frontend/src/business/components/api/definition/components/runtest/RunTestHTTPPage.vue
+++ b/frontend/src/business/components/api/definition/components/runtest/RunTestHTTPPage.vue
@@ -5,7 +5,7 @@
 
       <el-form :model="api" :rules="rules" ref="apiData" :inline="true" label-position="right">
 
-        <p class="tip">{{$t('test_track.plan_view.base_info')}} </p>
+        <p class="tip">{{ $t('test_track.plan_view.base_info') }} </p>
         <!-- 璇锋眰鏂规硶 -->
         <el-form-item :label="$t('api_report.request')" prop="method">
           <el-select v-model="api.request.method" style="width: 100px" size="small">
@@ -15,7 +15,7 @@
 
         <!-- 鎵ц鐜 -->
         <el-form-item prop="environmentId">
-          <environment-select  :current-data="api" :project-id="projectId"/>
+          <environment-select :current-data="api" :project-id="projectId"/>
         </el-form-item>
 
         <!-- 璇锋眰鍦板潃 -->
@@ -28,27 +28,27 @@
         <el-form-item>
           <el-dropdown split-button type="primary" class="ms-api-buttion" @click="handleCommand('add')"
                        @command="handleCommand" size="small">
-            {{$t('commons.test')}}
+            {{ $t('commons.test') }}
             <el-dropdown-menu slot="dropdown">
-              <el-dropdown-item command="load_case">{{$t('api_test.definition.request.load_case')}}
+              <el-dropdown-item command="load_case">{{ $t('api_test.definition.request.load_case') }}
               </el-dropdown-item>
-              <el-dropdown-item command="save_as_case">{{$t('api_test.definition.request.save_as_case')}}
+              <el-dropdown-item command="save_as_case">{{ $t('api_test.definition.request.save_as_case') }}
               </el-dropdown-item>
-              <el-dropdown-item command="update_api">{{$t('api_test.definition.request.update_api')}}</el-dropdown-item>
-              <el-dropdown-item command="save_as_api">{{$t('api_test.definition.request.save_as')}}</el-dropdown-item>
+              <el-dropdown-item command="update_api">{{ $t('api_test.definition.request.update_api') }}</el-dropdown-item>
+              <el-dropdown-item command="save_as_api">{{ $t('api_test.definition.request.save_as') }}</el-dropdown-item>
             </el-dropdown-menu>
           </el-dropdown>
 
         </el-form-item>
 
-        <p class="tip">{{$t('api_test.definition.request.req_param')}} </p>
+        <p class="tip">{{ $t('api_test.definition.request.req_param') }} </p>
         <!-- HTTP 璇锋眰鍙傛暟 -->
         <ms-api-request-form :isShowEnable="true" :headers="api.request.headers" :request="api.request"/>
 
       </el-form>
       <!--杩斿洖缁撴灉-->
       <!-- HTTP 璇锋眰杩斿洖鏁版嵁 -->
-      <p class="tip">{{$t('api_test.definition.request.res_param')}} </p>
+      <p class="tip">{{ $t('api_test.definition.request.res_param') }} </p>
       <ms-request-result-tail :response="responseData" ref="runResult"/>
 
       <ms-jmx-step :request="api.request" :response="responseData"/>
@@ -71,205 +71,208 @@
 </template>
 
 <script>
-  import MsApiRequestForm from "../request/http/ApiHttpRequestForm";
-  import {getUUID} from "@/common/js/utils";
-  import MsApiCaseList from "../case/ApiCaseList";
-  import MsContainer from "../../../../common/components/MsContainer";
-  import MsRequestResultTail from "../response/RequestResultTail";
-  import MsRun from "../Run";
-  import {REQ_METHOD} from "../../model/JsonData";
-  import EnvironmentSelect from "../environment/EnvironmentSelect";
-  import MsJmxStep from "../step/JmxStep";
+import MsApiRequestForm from "../request/http/ApiHttpRequestForm";
+import {getUUID} from "@/common/js/utils";
+import MsApiCaseList from "../case/ApiCaseList";
+import MsContainer from "../../../../common/components/MsContainer";
+import MsRequestResultTail from "../response/RequestResultTail";
+import MsRun from "../Run";
+import {REQ_METHOD} from "../../model/JsonData";
+import EnvironmentSelect from "../environment/EnvironmentSelect";
+import MsJmxStep from "../step/JmxStep";
 
-  export default {
-    name: "RunTestHTTPPage",
-    components: {
-      EnvironmentSelect,
-      MsApiRequestForm,
-      MsApiCaseList,
-      MsContainer,
-      MsRequestResultTail,
-      MsRun,
-      MsJmxStep
-    },
-    data() {
-      return {
-        visible: false,
-        api: {},
-        loaded: false,
-        loading: false,
-        createCase: "",
-        currentRequest: {},
-        refreshSign: "",
-        responseData: {type: 'HTTP', responseResult: {}, subRequestResults: []},
-        reqOptions: REQ_METHOD,
-        rules: {
-          method: [{required: true, message: this.$t('test_track.case.input_maintainer'), trigger: 'change'}],
-          path: [{required: true, message: this.$t('api_test.definition.request.path_info'), trigger: 'blur'}],
-          environmentId: [{required: true, message: this.$t('api_test.definition.request.run_env'), trigger: 'change'}],
-        },
-        runData: [],
-        reportId: "",
-        envMap: new Map
+export default {
+  name: "RunTestHTTPPage",
+  components: {
+    EnvironmentSelect,
+    MsApiRequestForm,
+    MsApiCaseList,
+    MsContainer,
+    MsRequestResultTail,
+    MsRun,
+    MsJmxStep
+  },
+  data() {
+    return {
+      visible: false,
+      api: {},
+      loaded: false,
+      loading: false,
+      createCase: "",
+      currentRequest: {},
+      refreshSign: "",
+      responseData: {type: 'HTTP', responseResult: {}, subRequestResults: []},
+      reqOptions: REQ_METHOD,
+      rules: {
+        method: [{required: true, message: this.$t('test_track.case.input_maintainer'), trigger: 'change'}],
+        path: [{required: true, message: this.$t('api_test.definition.request.path_info'), trigger: 'blur'}],
+        environmentId: [{required: true, message: this.$t('api_test.definition.request.run_env'), trigger: 'change'}],
+      },
+      runData: [],
+      reportId: "",
+      envMap: new Map
+    }
+  },
+  props: {apiData: {}, currentProtocol: String, syncTabs: Array, projectId: String},
+  computed: {
+    'api.environmentId'() {
+      return this.$store.state.useEnvironment;
+    }
+  },
+  watch: {
+    '$store.state.useEnvironment': function () {
+      this.api.environmentId = this.$store.state.useEnvironment;
+    }
+  },
+  methods: {
+    handleCommand(e) {
+      switch (e) {
+        case "load_case":
+          return this.loadCase();
+        case "save_as_case":
+          return this.saveAsCase();
+        case "update_api":
+          return this.updateApi();
+        case "save_as_api":
+          return this.saveAsApi();
+        default:
+          return this.runTest();
       }
     },
-    props: {apiData: {}, currentProtocol: String, syncTabs: Array, projectId: String},
-    computed:{
-      'api.environmentId'(){
-        return this.$store.state.useEnvironment;
-      }
+    runTest() {
+      this.$refs['apiData'].validate((valid) => {
+        if (valid) {
+          this.loading = true;
+          this.api.request.name = this.api.id;
+          this.api.request.url = undefined;
+          this.api.request.useEnvironment = this.api.environmentId;
+          this.api.protocol = this.currentProtocol;
+          this.runData = [];
+          this.runData.push(this.api.request);
+          /*瑙﹀彂鎵ц鎿嶄綔*/
+          this.reportId = getUUID().substring(0, 8);
+        }
+      })
+    },
+    errorRefresh() {
+      this.loading = false;
     },
-    watch:{
-      '$store.state.useEnvironment':function (){
-        this.api.environmentId = this.$store.state.useEnvironment;
+    runRefresh(data) {
+      this.responseData = {type: 'HTTP', responseResult: {responseCode: ""}, subRequestResults: []};
+      if (data) {
+        this.responseData = data;
       }
+      this.loading = false;
     },
-    methods: {
-      handleCommand(e) {
-        switch (e) {
-          case "load_case":
-            return this.loadCase();
-          case "save_as_case":
-            return this.saveAsCase();
-          case "update_api":
-            return this.updateApi();
-          case "save_as_api":
-            return this.saveAsApi();
-          default:
-            return this.runTest();
-        }
-      },
-      runTest() {
-        this.$refs['apiData'].validate((valid) => {
-          if (valid) {
-            this.loading = true;
-            this.api.request.name = this.api.id;
-            this.api.request.url = undefined;
-            this.api.request.useEnvironment = this.api.environmentId;
-            this.api.protocol = this.currentProtocol;
-            this.runData = [];
-            this.runData.push(this.api.request);
-            /*瑙﹀彂鎵ц鎿嶄綔*/
-            this.reportId = getUUID().substring(0, 8);
-          }
-        })
-      },
-      errorRefresh(){
-        this.loading = false;
-      },
-      runRefresh(data) {
-        this.responseData = {type: 'HTTP', responseResult: {responseCode: ""}, subRequestResults: []};
-        if (data) {
-          this.responseData = data;
-        }
-        this.loading = false;
-      },
-      saveAs() {
-        this.$emit('saveAs', this.api);
-      },
-      loadCase() {
-        this.refreshSign = getUUID();
-        this.loaded = true;
-        this.$refs.caseList.open();
-      },
-      apiCaseClose() {
-        this.visible = false;
-      },
-      getBodyUploadFiles() {
-        let bodyUploadFiles = [];
-        this.api.bodyUploadIds = [];
-        let request = this.api.request;
-        if (request.body) {
-          request.body.kvs.forEach(param => {
-            if (param.files) {
-              param.files.forEach(item => {
-                if (item.file) {
-                  item.name = item.file.name;
-                  bodyUploadFiles.push(item.file);
-                }
-              });
-            }
-          });
-        }
-        return bodyUploadFiles;
-      },
-      saveAsCase() {
-        //鐢ㄤ簬瑙﹀彂鍒涘缓鎿嶄綔
-        this.createCase = getUUID();
-        this.$refs.caseList.open();
-        this.loaded = false;
-      },
-      saveAsApi() {
-        let data = {};
-        let req = this.api.request;
-        req.id = getUUID();
-        data.request = JSON.stringify(req);
-        data.method = req.method;
-        data.path = req.path;
-        data.url = this.api.url;
-        data.status = this.api.status;
-        data.userId = this.api.userId;
-        data.description = this.api.description;
-        this.$emit('saveAsApi', data);
-      },
-      updateApi() {
-        let url = "/api/definition/update";
-        let bodyFiles = this.getBodyUploadFiles();
-        this.api.method = this.api.request.method;
-        this.api.path = this.api.request.path;
-        if (Object.prototype.toString.call(this.api.response).match(/\[object (\w+)\]/)[1].toLowerCase() !== 'object') {
-          this.api.response = JSON.parse(this.api.response);
-        }
-        if (this.api.tags instanceof  Array) {
-          this.api.tags = JSON.stringify(this.api.tags);
-        }
-        this.$fileUpload(url, null, bodyFiles, this.api, () => {
-          this.$success(this.$t('commons.save_success'));
-          this.$emit('saveApi', this.api);
-          if (this.syncTabs.indexOf(this.api.id) === -1) {
-            this.syncTabs.push(this.api.id);
+    saveAs() {
+      this.$emit('saveAs', this.api);
+    },
+    loadCase() {
+      this.refreshSign = getUUID();
+      this.loaded = true;
+      this.$refs.caseList.open();
+    },
+    apiCaseClose() {
+      this.visible = false;
+    },
+    getBodyUploadFiles() {
+      let bodyUploadFiles = [];
+      this.api.bodyUploadIds = [];
+      let request = this.api.request;
+      if (request.body) {
+        request.body.kvs.forEach(param => {
+          if (param.files) {
+            param.files.forEach(item => {
+              if (item.file) {
+                item.name = item.file.name;
+                bodyUploadFiles.push(item.file);
+              }
+            });
           }
         });
-      },
-      selectTestCase(item) {
-        if (item != null) {
-          this.api.request = item.request;
-        } else {
-          this.api.request = this.currentRequest;
-        }
-      },
-
-      refresh() {
-        this.$emit('refresh');
-      },
-      getResult() {
-        if (this.api.id) {
-          let url = "/api/definition/report/getReport/" + this.api.id;
-          this.$get(url, response => {
-            if (response.data) {
-              let data = JSON.parse(response.data.content);
-              this.responseData = data;
-            }
-          });
+      }
+      return bodyUploadFiles;
+    },
+    saveAsCase() {
+      //鐢ㄤ簬瑙﹀彂鍒涘缓鎿嶄綔
+      this.createCase = getUUID();
+      this.$refs.caseList.open();
+      this.loaded = false;
+    },
+    saveAsApi() {
+      let data = {};
+      let req = this.api.request;
+      req.id = getUUID();
+      data.request = JSON.stringify(req);
+      data.method = req.method;
+      data.path = req.path;
+      data.url = this.api.url;
+      data.status = this.api.status;
+      data.userId = this.api.userId;
+      data.description = this.api.description;
+      this.$emit('saveAsApi', data);
+    },
+    updateApi() {
+      let url = "/api/definition/update";
+      let bodyFiles = this.getBodyUploadFiles();
+      this.api.method = this.api.request.method;
+      this.api.path = this.api.request.path;
+      if (Object.prototype.toString.call(this.api.response).match(/\[object (\w+)\]/)[1].toLowerCase() !== 'object') {
+        this.api.response = JSON.parse(this.api.response);
+      }
+      if (this.api.tags instanceof Array) {
+        this.api.tags = JSON.stringify(this.api.tags);
+      }
+      this.$fileUpload(url, null, bodyFiles, this.api, () => {
+        this.$success(this.$t('commons.save_success'));
+        this.$emit('saveApi', this.api);
+        if (this.syncTabs.indexOf(this.api.id) === -1) {
+          this.syncTabs.push(this.api.id);
         }
+      });
+    },
+    selectTestCase(item) {
+      if (item != null) {
+        this.api.request = item.request;
+      } else {
+        this.api.request = this.currentRequest;
       }
     },
-    created() {
-      // 娣卞害澶嶅埗
-      this.api = JSON.parse(JSON.stringify(this.apiData));
-      this.api.protocol = this.currentProtocol;
-      this.currentRequest = this.api.request;
-      //this.getResult();
+
+    refresh() {
+      this.$emit('refresh');
+    },
+    getResult() {
+      if (this.api.id) {
+        let url = "/api/definition/report/getReport/" + this.api.id;
+        this.$get(url, response => {
+          if (response.data) {
+            let data = JSON.parse(response.data.content);
+            this.responseData = data;
+          }
+        });
+      }
+    }
+  },
+  created() {
+    // 娣卞害澶嶅埗
+    this.api = JSON.parse(JSON.stringify(this.apiData));
+    this.api.protocol = this.currentProtocol;
+    this.currentRequest = this.api.request;
+    if (!this.api.environmentId && this.$store.state.useEnvironment) {
+      this.api.environmentId = this.$store.state.useEnvironment;
     }
+    //this.getResult();
   }
+}
 </script>
 
 <style scoped>
-  .ms-htt-width {
-    width: 350px;
-  }
+.ms-htt-width {
+  width: 350px;
+}
 
-  /deep/ .el-drawer {
-    overflow: auto;
-  }
+/deep/ .el-drawer {
+  overflow: auto;
+}
 </style>
-- 
GitLab