Merge remote-tracking branch 'origin/master'

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

@@ -11,11 +11,11 @@
     :title="displayTitle">
 
     <template v-slot:behindHeaderLeft>
-        <el-tag size="mini" style="margin-left: 20px" v-if="request.referenced==='Deleted'" type="danger">{{$t('api_test.automation.reference_deleted')}}</el-tag>
+      <el-tag size="mini" style="margin-left: 20px" v-if="request.referenced==='Deleted'" type="danger">{{$t('api_test.automation.reference_deleted')}}</el-tag>
-        <el-tag size="mini" style="margin-left: 20px" v-if="request.referenced==='Copy'">{{ $t('commons.copy') }}</el-tag>
+      <el-tag size="mini" style="margin-left: 20px" v-if="request.referenced==='Copy'">{{ $t('commons.copy') }}</el-tag>
-        <el-tag size="mini" style="margin-left: 20px" v-if="request.referenced ==='REF'">{{ $t('api_test.scenario.reference') }}</el-tag>
+      <el-tag size="mini" style="margin-left: 20px" v-if="request.referenced ==='REF'">{{ $t('api_test.scenario.reference') }}</el-tag>
-        <ms-run :debug="false" :reportId="reportId" :run-data="runData"
+      <ms-run :debug="false" :reportId="reportId" :run-data="runData"
-                @runRefresh="runRefresh" ref="runTest"/>
+              @runRefresh="runRefresh" ref="runTest"/>
 
     </template>
 
@@ -42,7 +42,7 @@
     <ms-dubbo-basis-parameters :request="request" v-if="request.protocol==='DUBBO' || request.protocol==='dubbo://'|| request.type==='DubboSampler'" :showScript="false"/>
 
     <p class="tip">{{$t('api_test.definition.request.res_param')}} </p>
-    <ms-request-result-tail draggable :currentProtocol="request.protocol" :response="request.requestResult" ref="runResult"/>
+    <api-response-component :result="request.requestResult"/>
 
     <!-- 保存操作 -->
     <el-button type="primary" size="small" style="margin: 20px; float: right" @click="saveTestCase(item)" v-if="!request.referenced">
@@ -62,6 +62,8 @@
   import MsRun from "../../../definition/components/Run";
   import {getUUID} from "@/common/js/utils";
   import ApiBaseComponent from "../common/ApiBaseComponent";
+  import ApiResponseComponent from "./ApiResponseComponent";
+
   export default {
     name: "MsApiComponent",
     props: {
@@ -75,8 +77,9 @@
       currentEnvironmentId: String,
     },
     components: {
-      ApiBaseComponent,
+      ApiBaseComponent, ApiResponseComponent,
-      MsSqlBasisParameters, MsTcpBasisParameters, MsDubboBasisParameters, MsApiRequestForm, MsRequestResultTail, MsRun},
+      MsSqlBasisParameters, MsTcpBasisParameters, MsDubboBasisParameters, MsApiRequestForm, MsRequestResultTail, MsRun
+    },
     data() {
       return {
         loading: false,
@@ -129,31 +132,31 @@
           return this.$t('api_test.automation.api_list_import');
         } else if (this.isExternalImport) {
           return this.$t('api_test.automation.external_import');
-        } else if(this.isCustomizeReq) {
+        } else if (this.isCustomizeReq) {
           return this.$t('api_test.automation.customize_req');
         }
         return "";
       },
       isApiImport() {
-        if (this.request.referenced!=undefined && this.request.referenced==='Deleted' || this.request.referenced=='REF' || this.request.referenced==='Copy') {
+        if (this.request.referenced != undefined && this.request.referenced === 'Deleted' || this.request.referenced == 'REF' || this.request.referenced === 'Copy') {
           return true
         }
         return false;
       },
       isExternalImport() {
-        if (this.request.referenced!=undefined && this.request.referenced==='OT_IMPORT') {
+        if (this.request.referenced != undefined && this.request.referenced === 'OT_IMPORT') {
           return true
         }
         return false;
       },
       isCustomizeReq() {
-        if (this.request.referenced==undefined || this.request.referenced==='Created') {
+        if (this.request.referenced == undefined || this.request.referenced === 'Created') {
           return true
         }
         return false;
       },
       isDeletedOrRef() {
-        if (this.request.referenced!= undefined && this.request.referenced === 'Deleted' || this.request.referenced === 'REF') {
+        if (this.request.referenced != undefined && this.request.referenced === 'Deleted' || this.request.referenced === 'REF') {
           return true
         }
         return false;
@@ -218,6 +221,7 @@
           this.$error(this.$t('api_test.environment.select_environment'));
           return;
         }
+        this.request.active = true;
         this.loading = true;
         this.runData = [];
         this.request.useEnvironment = this.currentEnvironmentId;
@@ -250,9 +254,11 @@
     margin-right: 20px;
     color: #409EFF;
   }
+
   /deep/ .el-card__body {
     padding: 15px;
   }
+
   .tip {
     padding: 3px 5px;
     font-size: 16px;
@@ -260,12 +266,15 @@
     border-left: 4px solid #783887;
     margin: 20px 0;
   }
+
   .name-input {
     width: 30%;
   }
+
   .el-icon-arrow-right {
     margin-right: 5px;
   }
+
   .icon.is-active {
     transform: rotate(90deg);
   }

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

@@ -24,7 +24,7 @@
   export default {
     name: "ApiResponseComponent",
     components: {ElCollapseTransition, MsRequestResultTail, ApiBaseComponent, MsRequestMetric},
-    props: ['apiItem'],
+    props: {apiItem: {}, result: {}},
     data() {
       return {
         isActive: false,
@@ -32,8 +32,13 @@
       }
     },
     created() {
-      this.getExecResult();
+      if (!this.result) {
-      if (this.apiItem.isActive) {
+        this.getExecResult();
+        if (this.apiItem.isActive) {
+          this.isActive = true;
+        }
+      } else {
+        this.response = this.result;
         this.isActive = true;
       }
     },

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

@@ -209,7 +209,7 @@
       },
       addTab(tab) {
         if (tab.name === 'add') {
-          this.handleCommand("ADD");
+          this.handleTabsEdit(this.$t('api_test.definition.request.fast_debug'), "debug");
         }
       },
       handleCommand(e) {

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

@@ -169,10 +169,27 @@
         let bodyFiles = this.getBodyUploadFiles(data);
         this.$fileUpload(this.reqUrl, null, bodyFiles, data, () => {
           this.$success(this.$t('commons.save_success'));
+          if (this.reqUrl.endsWith('/create')) {
+            this.saveTestCase(data);
+          }
           this.reqUrl = "/api/definition/update";
           this.$emit('saveApi', data);
         });
       },
+      saveTestCase(row) {
+        let tmp = {request: JSON.parse(JSON.stringify(row.request))};
+        tmp.projectId = getCurrentProjectID();
+        tmp.active = true;
+        tmp.priority = "P0";
+        tmp.name = row.name;
+        tmp.request.path = row.path;
+        tmp.request.method = row.method;
+        tmp.apiDefinitionId = row.id;
+        let bodyFiles = this.getBodyUploadFiles(tmp);
+        let url = "/api/testcase/create";
+        this.$fileUpload(url, null, bodyFiles, tmp, (response) => {
+        });
+      },
       setParameters(data) {
         data.projectId = this.projectId;
         this.request.name = this.currentApi.name;
@@ -185,6 +202,9 @@
           data.request.protocol = this.currentProtocol;
         }
         data.id = data.request.id;
+        if (!data.method) {
+          data.method = this.currentProtocol;
+        }
         data.response = this.response;
       },
       getBodyUploadFiles(data) {

frontend/src/business/components/api/definition/components/complete/EditCompleteTCPApi.vue

@@ -22,7 +22,7 @@
 
     <!-- 请求参数 -->
     <p class="tip">{{ $t('api_test.definition.request.req_param') }} </p>
-    <ms-basis-parameters :request="request"/>
+    <ms-basis-parameters :show-script="false" :request="request"/>
 
   </div>
 

frontend/src/business/components/api/definition/components/debug/DebugDubboPage.vue

@@ -6,7 +6,7 @@
                    @command="handleCommand" size="small" style="float: right;margin-right: 20px">
         {{$t('commons.test')}}
         <el-dropdown-menu slot="dropdown">
-          <el-dropdown-item command="save_as">{{$t('api_test.definition.request.save_as')}}</el-dropdown-item>
+          <el-dropdown-item command="save_as">{{$t('api_test.definition.request.save_as_case')}}</el-dropdown-item>
         </el-dropdown-menu>
       </el-dropdown>
 
@@ -43,7 +43,7 @@
 
   export default {
     name: "ApiConfig",
-    components: {MsRequestResultTail, MsResponseResult, MsRequestMetric, MsResponseText, MsRun, MsBasisParameters,MsJmxStep},
+    components: {MsRequestResultTail, MsResponseResult, MsRequestMetric, MsResponseText, MsRun, MsBasisParameters, MsJmxStep},
     props: {
       currentProtocol: String,
       scenario: Boolean,
@@ -119,6 +119,7 @@
       },
       saveAs() {
         let obj = {request: this.request};
+        obj.request.id = getUUID();
         this.$emit('saveAs', obj);
       }
     }

frontend/src/business/components/api/definition/components/debug/DebugHttpPage.vue

@@ -19,7 +19,7 @@
                        @command="handleCommand" size="small" v-if="testCase===undefined && !scenario">
             {{$t('commons.test')}}
             <el-dropdown-menu slot="dropdown">
-              <el-dropdown-item command="save_as">{{$t('api_test.definition.request.save_as')}}</el-dropdown-item>
+              <el-dropdown-item command="save_as">{{$t('api_test.definition.request.save_as_case')}}</el-dropdown-item>
             </el-dropdown-menu>
           </el-dropdown>
         </el-form-item>
@@ -58,7 +58,7 @@
 
   export default {
     name: "ApiConfig",
-    components: {MsRequestResultTail, MsResponseResult, MsApiRequestForm, MsRequestMetric, MsResponseText, MsRun,MsJmxStep},
+    components: {MsRequestResultTail, MsResponseResult, MsApiRequestForm, MsRequestMetric, MsResponseText, MsRun, MsJmxStep},
     props: {
       currentProtocol: String,
       testCase: {},
@@ -155,6 +155,8 @@
       saveAs() {
         this.$refs['debugForm'].validate((valid) => {
           if (valid) {
+            this.debugForm.id = null;
+            this.request.id = getUUID();
             this.debugForm.request = this.request;
             this.debugForm.userId = getCurrentUser().id;
             this.debugForm.status = "Underway";

frontend/src/business/components/api/definition/components/debug/DebugJdbcPage.vue

@@ -6,7 +6,7 @@
                    @command="handleCommand" size="small" style="float: right;margin-right: 20px">
         {{$t('commons.test')}}
         <el-dropdown-menu slot="dropdown">
-          <el-dropdown-item command="save_as">{{$t('api_test.definition.request.save_as')}}</el-dropdown-item>
+          <el-dropdown-item command="save_as">{{$t('api_test.definition.request.save_as_case')}}</el-dropdown-item>
         </el-dropdown-menu>
       </el-dropdown>
 
@@ -122,6 +122,7 @@
       },
       saveAs() {
         let obj = {request: this.request};
+        obj.request.id = getUUID();
         this.$emit('saveAs', obj);
       }
     }

frontend/src/business/components/api/definition/components/debug/DebugTcpPage.vue

@@ -15,7 +15,7 @@
                        @command="handleCommand" size="small" style="float: right;margin-right: 20px">
             {{$t('commons.test')}}
             <el-dropdown-menu slot="dropdown">
-              <el-dropdown-item command="save_as">{{$t('api_test.definition.request.save_as')}}</el-dropdown-item>
+              <el-dropdown-item command="save_as">{{$t('api_test.definition.request.save_as_case')}}</el-dropdown-item>
             </el-dropdown-menu>
           </el-dropdown>
         </el-form-item>
@@ -131,6 +131,7 @@
       },
       saveAs() {
         let obj = {request: this.request};
+        obj.request.id = getUUID();
         this.$emit('saveAs', obj);
       }
     }

frontend/src/business/components/api/definition/components/request/components/ApiDefinitionStepButton.vue

@@ -0,0 +1,83 @@
+<template>
+  <el-col :span="3" class="ms-left-cell">
+    <el-button class="ms-left-buttion" size="small" @click="addPre">+{{$t('api_test.definition.request.pre_script')}}</el-button>
+    <br/>
+    <el-button class="ms-left-buttion" size="small" @click="addPost">+{{$t('api_test.definition.request.post_script')}}</el-button>
+    <br/>
+    <el-button class="ms-left-buttion" size="small" @click="addAssertions">+{{$t('api_test.definition.request.assertions_rule')}}</el-button>
+    <br/>
+    <el-button class="ms-left-buttion" size="small" @click="addExtract">+{{$t('api_test.definition.request.extract_param')}}</el-button>
+  </el-col>
+</template>
+
+<script>
+    import {createComponent} from "../../jmeter/components";
+    import {Assertions, Extract} from "../../../model/ApiTestModel";
+
+    export default {
+      name: "ApiDefinitionStepButton",
+      props: {
+        request: {
+          type: Object,
+          default() {
+            return {}
+          }
+        }
+      },
+      methods: {
+        addPre() {
+          let jsr223PreProcessor = createComponent("JSR223PreProcessor");
+          this.request.hashTree.push(jsr223PreProcessor);
+        },
+        addPost() {
+          let jsr223PostProcessor = createComponent("JSR223PostProcessor");
+          this.request.hashTree.push(jsr223PostProcessor);
+        },
+        addAssertions() {
+          let assertions = new Assertions();
+          this.request.hashTree.push(assertions);
+        },
+        addExtract() {
+          let jsonPostProcessor = new Extract();
+          this.request.hashTree.push(jsonPostProcessor);
+        },
+      }
+    }
+</script>
+
+<style scoped>
+
+
+  .ms-left-cell .el-button:nth-of-type(1) {
+    color: #B8741A;
+    background-color: #F9F1EA;
+    border: #F9F1EA;
+  }
+
+  .ms-left-cell .el-button:nth-of-type(2) {
+    color: #783887;
+    background-color: #F2ECF3;
+    border: #F2ECF3;
+  }
+
+  .ms-left-cell .el-button:nth-of-type(3) {
+    color: #A30014;
+    background-color: #F7E6E9;
+    border: #F7E6E9;
+  }
+
+  .ms-left-cell .el-button:nth-of-type(4) {
+    color: #015478;
+    background-color: #E6EEF2;
+    border: #E6EEF2;
+  }
+
+  .ms-left-cell {
+    margin-top: 30px;
+  }
+
+  .ms-left-buttion {
+    margin: 6px 0px 8px 30px;
+  }
+
+</style>

frontend/src/business/components/api/definition/components/request/http/ApiHttpRequestForm.vue

@@ -71,35 +71,9 @@
 
           </el-tabs>
         </div>
-        <!--<div v-if="!referenced">-->
-          <!--<div v-for="row in request.hashTree" :key="row.id">-->
-            <!--&lt;!&ndash;前置脚本&ndash;&gt;-->
-            <!--<ms-jsr233-processor v-if="row.type==='JSR223PreProcessor'" @remove="remove" @copyRow="copyRow" :title="$t('api_test.definition.request.pre_script')"-->
-                                 <!--:jsr223-processor="row"/>-->
-            <!--&lt;!&ndash;后置脚本&ndash;&gt;-->
-            <!--<ms-jsr233-processor v-if="row.label ==='JSR223 PostProcessor'" @copyRow="copyRow" @remove="remove" :is-read-only="false" :title="$t('api_test.definition.request.post_script')"-->
-                                 <!--:jsr223-processor="row"/>-->
-            <!--&lt;!&ndash;断言规则&ndash;&gt;-->
-            <!--<div style="margin-top: 10px">-->
-              <!--<ms-api-assertions :response="response" v-if="row.type==='Assertions'" @copyRow="copyRow" @remove="remove" :is-read-only="isReadOnly" :assertions="row"/>-->
-            <!--</div>-->
-            <!--&lt;!&ndash;提取规则&ndash;&gt;-->
-            <!--<div style="margin-top: 10px">-->
-              <!--<ms-api-extract :response="response" :is-read-only="isReadOnly" @copyRow="copyRow" @remove="remove" v-if="row.type==='Extract'" :extract="row"/>-->
-            <!--</div>-->
-          <!--</div>-->
-        <!--</div>-->
       </el-col>
       <!--操作按钮-->
-      <el-col :span="3" class="ms-left-cell" v-if="!referenced && showScript">
+      <api-definition-step-button :request="request" v-if="!referenced && showScript"/>
-        <el-button class="ms-left-buttion" size="small" @click="addPre">+{{$t('api_test.definition.request.pre_script')}}</el-button>
-        <br/>
-        <el-button class="ms-left-buttion" size="small" @click="addPost">+{{$t('api_test.definition.request.post_script')}}</el-button>
-        <br/>
-        <el-button class="ms-left-buttion" size="small" @click="addAssertions">+{{$t('api_test.definition.request.assertions_rule')}}</el-button>
-        <br/>
-        <el-button class="ms-left-buttion" size="small" @click="addExtract">+{{$t('api_test.definition.request.extract_param')}}</el-button>
-      </el-col>
     </el-row>
     <batch-add-parameter @batchSave="batchSave" ref="batchAddParameter"/>
   </div>
@@ -120,10 +94,12 @@
   import BatchAddParameter from "../../basis/BatchAddParameter";
   import MsApiAdvancedConfig from "./ApiAdvancedConfig";
   import MsJsr233Processor from "../../../../automation/scenario/component/Jsr233Processor";
+  import ApiDefinitionStepButton from "../components/ApiDefinitionStepButton";
 
   export default {
     name: "MsApiHttpRequestForm",
     components: {
+      ApiDefinitionStepButton,
       MsJsr233Processor,
       MsApiAdvancedConfig,
       BatchAddParameter,
@@ -194,26 +170,6 @@
     },
 
     methods: {
-      addPre() {
-        let jsr223PreProcessor = createComponent("JSR223PreProcessor");
-        this.request.hashTree.push(jsr223PreProcessor);
-        this.reload();
-      },
-      addPost() {
-        let jsr223PostProcessor = createComponent("JSR223PostProcessor");
-        this.request.hashTree.push(jsr223PostProcessor);
-        this.reload();
-      },
-      addAssertions() {
-        let assertions = new Assertions();
-        this.request.hashTree.push(assertions);
-        this.reload();
-      },
-      addExtract() {
-        let jsonPostProcessor = new Extract();
-        this.request.hashTree.push(jsonPostProcessor);
-        this.reload();
-      },
       remove(row) {
         let index = this.request.hashTree.indexOf(row);
         this.request.hashTree.splice(index, 1);
@@ -289,13 +245,6 @@
 </script>
 
 <style scoped>
-  .ms-left-cell {
-    margin-top: 30px;
-  }
-
-  .ms-left-buttion {
-    margin: 6px 0px 8px 30px;
-  }
 
   .ms-query {
     background: #783887;
@@ -316,30 +265,6 @@
     min-height: 200px;
   }
 
-  .ms-left-cell .el-button:nth-of-type(1) {
-    color: #B8741A;
-    background-color: #F9F1EA;
-    border: #F9F1EA;
-  }
-
-  .ms-left-cell .el-button:nth-of-type(2) {
-    color: #783887;
-    background-color: #F2ECF3;
-    border: #F2ECF3;
-  }
-
-  .ms-left-cell .el-button:nth-of-type(3) {
-    color: #A30014;
-    background-color: #F7E6E9;
-    border: #F7E6E9;
-  }
-
-  .ms-left-cell .el-button:nth-of-type(4) {
-    color: #015478;
-    background-color: #E6EEF2;
-    border: #E6EEF2;
-  }
-
   .ms-el-link {
     float: right;
     margin-right: 45px;

frontend/src/business/components/api/definition/components/request/tcp/TcpBasisParameters.vue

@@ -101,30 +101,11 @@
 
           </el-form>
         </div>
-        <!--<div v-for="row in request.hashTree" :key="row.id" v-loading="isReloadData" style="margin-left: 20px;width: 100%">-->
-          <!--&lt;!&ndash; 前置脚本 &ndash;&gt;-->
-          <!--<ms-jsr233-processor v-if="row.label ==='JSR223 PreProcessor'" @copyRow="copyRow" @remove="remove" :is-read-only="false" :title="$t('api_test.definition.request.pre_script')" style-type="color: #B8741A;background-color: #F9F1EA"-->
-                               <!--:jsr223-processor="row"/>-->
-          <!--&lt;!&ndash;后置脚本&ndash;&gt;-->
-          <!--<ms-jsr233-processor v-if="row.label ==='JSR223 PostProcessor'" @copyRow="copyRow" @remove="remove" :is-read-only="false" :title="$t('api_test.definition.request.post_script')" style-type="color: #783887;background-color: #F2ECF3"-->
-                               <!--:jsr223-processor="row"/>-->
-          <!--&lt;!&ndash;断言规则&ndash;&gt;-->
-          <!--<ms-api-assertions v-if="row.type==='Assertions'" @copyRow="copyRow" @remove="remove" :is-read-only="isReadOnly" :assertions="row"/>-->
-          <!--&lt;!&ndash;提取规则&ndash;&gt;-->
-          <!--<ms-api-extract :is-read-only="isReadOnly" @copyRow="copyRow" @remove="remove" v-if="row.type==='Extract'" :extract="row"/>-->
 
-        <!--</div>-->
       </el-col>
 
-      <!--<el-col :span="3" class="ms-left-cell">-->
+      <!--操作按钮-->
-        <!--<el-button class="ms-left-buttion" size="small" style="color: #B8741A;background-color: #F9F1EA" @click="addPre">+{{$t('api_test.definition.request.pre_script')}}</el-button>-->
+      <api-definition-step-button :request="request" v-if="!referenced && showScript"/>
-        <!--<br/>-->
-        <!--<el-button class="ms-left-buttion" size="small" style="color: #783887;background-color: #F2ECF3" @click="addPost">+{{$t('api_test.definition.request.post_script')}}</el-button>-->
-        <!--<br/>-->
-        <!--<el-button class="ms-left-buttion" size="small" style="color: #A30014;background-color: #F7E6E9" @click="addAssertions">+{{$t('api_test.definition.request.assertions_rule')}}</el-button>-->
-        <!--<br/>-->
-        <!--<el-button class="ms-left-buttion" size="small" style="color: #015478;background-color: #E6EEF2" @click="addExtract">+{{$t('api_test.definition.request.extract_param')}}</el-button>-->
-      <!--</el-col>-->
     </el-row>
   </div>
 </template>
@@ -147,11 +128,13 @@
   import MsInstructionsIcon from "../../../../../common/components/MsInstructionsIcon";
   import Jsr233ProcessorContent from "../../../../automation/scenario/common/Jsr233ProcessorContent";
   import JSR223PreProcessor from "../../jmeter/components/pre-processors/jsr223-pre-processor";
+  import ApiDefinitionStepButton from "../components/ApiDefinitionStepButton";
 
 
   export default {
     name: "TcpBasisParameters",
     components: {
+      ApiDefinitionStepButton,
       Jsr233ProcessorContent,
       MsInstructionsIcon,
       MsApiVariable,
@@ -167,6 +150,14 @@
         type: Boolean,
         default: false
       },
+      showScript: {
+        type: Boolean,
+        default: true,
+      },
+      referenced: {
+        type: Boolean,
+        default: false,
+      },
     },
     data() {
       return {

frontend/src/business/components/api/definition/components/runtest/RunTestTCPPage.vue

@@ -2,34 +2,43 @@
 
   <div class="card-container">
     <el-card class="card-content" v-loading="loading">
-      <!-- 操作按钮 -->
-      <el-dropdown split-button type="primary" class="ms-api-buttion" @click="handleCommand('add')"
-                   @command="handleCommand" size="small" style="float: right;margin-right: 20px">
-        {{$t('commons.test')}}
-        <el-dropdown-menu slot="dropdown">
-          <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>
-          <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>
 
-      <p class="tip">{{$t('test_track.plan_view.base_info')}} </p>
+      <el-form :model="api" :rules="rules" ref="apiData" :inline="true" label-position="right">
-      <!-- 执行环境 -->
-      {{$t('api_test.definition.request.run_env')}}：
-      <environment-select :type="'TCP'" :current-data="api" :project-id="projectId"/>
 
-      <p class="tip">{{$t('api_test.definition.request.req_param')}} </p>
+        <!-- 操作按钮 -->
-      <!-- TCP 请求参数 -->
+        <el-dropdown split-button type="primary" class="ms-api-buttion" @click="handleCommand('add')"
-      <ms-basis-parameters :request="api.request" @callback="runTest" ref="requestForm"/>
+                     @command="handleCommand" size="small" style="float: right;margin-right: 20px">
+          {{$t('commons.test')}}
+          <el-dropdown-menu slot="dropdown">
+            <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>
+            <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>
+
+        <p class="tip">{{$t('test_track.plan_view.base_info')}} </p>
+        <!-- 执行环境 -->
+        <el-form-item prop="environmentId">
+          {{$t('api_test.definition.request.run_env')}}：
+          <environment-select :type="'TCP'" :current-data="api" :project-id="projectId"/>
+        </el-form-item>
+
+        <p class="tip">{{$t('api_test.definition.request.req_param')}} </p>
+        <!-- TCP 请求参数 -->
+        <ms-basis-parameters :request="api.request" @callback="runTest" ref="requestForm"/>
+
+      </el-form>
 
       <!--返回结果-->
       <!-- HTTP 请求返回数据 -->
       <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"/>
+
     </el-card>
 
     <!-- 加载用例 -->
@@ -55,10 +64,12 @@
   import MsBasisParameters from "../request/tcp/TcpBasisParameters";
   import {REQ_METHOD} from "../../model/JsonData";
   import EnvironmentSelect from "../environment/EnvironmentSelect";
+  import MsJmxStep from "../step/JmxStep";
 
   export default {
     name: "RunTestTCPPage",
     components: {
+      MsJmxStep,
       EnvironmentSelect,
       MsApiRequestForm,
       MsApiCaseList,
@@ -81,8 +92,6 @@
         refreshSign: "",
         createCase: "",
         rules: {
-          method: [{required: true, message: this.$t('test_track.case.input_maintainer'), trigger: 'change'}],
-          url: [{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: [],
@@ -110,13 +119,17 @@
         this.$emit('refresh');
       },
       runTest() {
-        this.loading = true;
+        this.$refs['apiData'].validate((valid) => {
-        this.api.request.name = this.api.id;
+          if (valid) {
-        this.api.protocol = this.currentProtocol;
+            this.loading = true;
-        this.runData = [];
+            this.api.request.name = this.api.id;
-        this.runData.push(this.api.request);
+            this.api.protocol = this.currentProtocol;
-        /*触发执行操作*/
+            this.runData = [];
-        this.reportId = getUUID().substring(0, 8);
+            this.runData.push(this.api.request);
+            /*触发执行操作*/
+            this.reportId = getUUID().substring(0, 8);
+          }
+        })
       },
       runRefresh(data) {
         this.responseData = data;

frontend/src/business/components/api/definition/components/step/JmxStep.vue

@@ -1,10 +1,10 @@
 <template>
-  <div>
+  <div v-if="request.hashTree && request.hashTree.length > 0">
     <p class="tip">
       {{$t('test_track.plan_view.step')}}
     </p>
     <!-- HTTP 请求参数 -->
-    <div style="border:1px #DCDFE6 solid; height: 100%;border-radius: 4px ;width: 100%" v-loading="isReloadData" v-if="request.hashTree && request.hashTree.length>0">
+    <div style="height: 100%;border-radius: 4px ;width: 100%" v-loading="isReloadData" v-if="request.hashTree && request.hashTree.length>0">
 
       <div v-for="row in request.hashTree" :key="row.id">
         <!--前置脚本-->

frontend/src/business/components/performance/report/components/RequestStatistics.vue

@@ -10,7 +10,21 @@
         <el-table-column
           prop="label"
           label="Label"
-          width="450"/>
+          width="450">
+          <template v-slot:header="{column}">
+            <span>Label</span>
+            <i class="el-icon-search" style="margin-left: 8px;cursor: pointer;font-weight: bold;" @click="click(column)"></i>
+            <el-input v-model="searchLabel"
+                      placeholder="请输入 Label 搜索"
+                      size="mini"
+                      class="search_input"
+                      style="width: 250px; margin-left: 5px"
+                      v-if="column.showSearch"
+                      clearable
+                      @clear="filterLabel"
+                      @keyup.enter.native="filterLabel"/>
+          </template>
+        </el-table-column>
       </el-table-column>
 
       <el-table-column label="Executions" align="center">
@@ -94,17 +108,35 @@ export default {
   data() {
     return {
       tableData: [],
-      id: ''
+      originalData: [],
+      id: '',
+      searchLabel: '',
+      showSearch: false,
+      showBtn: true,
     }
   },
   methods: {
     initTableData() {
       this.$get("/performance/report/content/" + this.id).then(res => {
         this.tableData = res.data.data;
+        this.originalData = res.data.data;
       }).catch(() => {
         this.tableData = [];
       })
     },
+    click(column) {
+      this.searchLabel = '';
+      this.tableData = this.originalData;
+      this.$set(column, 'showSearch', !column.showSearch);
+    },
+    filterLabel() {
+      this.tableData = this.searchLabel ? this.originalData.filter(this.createFilter(this.searchLabel)) : this.originalData;
+    },
+    createFilter(queryString) {
+      return item => {
+        return (item.label.toLowerCase().indexOf(queryString.toLowerCase()) !== -1);
+      };
+    },
   },
   watch: {
     report: {
@@ -128,5 +160,7 @@ export default {
 </script>
 
 <style scoped>
-
+.search_input >>> .el-input__inner {
+  border-radius: 50px;
+}
 </style>

frontend/src/business/components/track/plan/view/comonents/load/TestCaseLoadRelevance.vue

@@ -226,10 +226,7 @@ export default {
       if (projectId) {
         this.projectId = projectId;
       }
-      this.$refs.nodeTree.result = this.$post("/case/node/list/all/plan",
+      this.treeNodes = [];
-        {testPlanId: this.planId, projectId: this.projectId}, response => {
-          this.treeNodes = response.data;
-        });
       this.selectNodeIds = [];
     }
   }