From 19b778dd364c5a3c2d97d2ce0726b61f9211dca0 Mon Sep 17 00:00:00 2001
From: chenjianxing <jianxing.chen@fit2cloud.com>
Date: Mon, 1 Feb 2021 15:49:13 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20TCP=E8=87=AA=E5=AE=9A=E4=B9=89=E8=AF=B7?=
 =?UTF-8?q?=E6=B1=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../scenario/common/CustomizeReqInfo.vue      | 53 +++++++++++++++++++
 .../scenario/component/ApiComponent.vue       | 21 +++-----
 .../scenario/component/ComponentConfig.vue    |  1 -
 3 files changed, 61 insertions(+), 14 deletions(-)
 create mode 100644 frontend/src/business/components/api/automation/scenario/common/CustomizeReqInfo.vue

diff --git a/frontend/src/business/components/api/automation/scenario/common/CustomizeReqInfo.vue b/frontend/src/business/components/api/automation/scenario/common/CustomizeReqInfo.vue
new file mode 100644
index 0000000000..d81101e5db
--- /dev/null
+++ b/frontend/src/business/components/api/automation/scenario/common/CustomizeReqInfo.vue
@@ -0,0 +1,53 @@
+<template>
+  <div>
+    <div v-if="request.protocol === 'HTTP'">
+      <el-input :placeholder="$t('api_test.definition.request.path_all_info')" v-if="request.url" v-model="request.url" style="width: 85%;margin-top: 10px" size="small">
+        <el-select v-model="request.method" slot="prepend" style="width: 100px" size="small">
+          <el-option v-for="item in reqOptions" :key="item.id" :label="item.label" :value="item.id"/>
+        </el-select>
+      </el-input>
+      <el-input :placeholder="$t('api_test.definition.request.path_all_info')" v-else v-model="request.path" style="width: 85%;margin-top: 10px" size="small">
+        <el-select v-model="request.method" slot="prepend" style="width: 100px" size="small">
+          <el-option v-for="item in reqOptions" :key="item.id" :label="item.label" :value="item.id"/>
+        </el-select>
+      </el-input>
+    </div>
+
+    <div v-if="request.protocol === 'TCP' && isCustomizeReq">
+      <el-form>
+        <el-row>
+          <el-col :span="8">
+            <el-form-item :label="$t('api_test.request.tcp.server')" prop="server">
+              <el-input class="server-input"  v-model="request.server" maxlength="300" show-word-limit size="small"/>
+            </el-form-item>
+          </el-col>
+         <el-col :span="12">
+           <el-form-item :label="$t('api_test.request.tcp.port')" prop="port" label-width="60px">
+             <el-input-number v-model="request.port" controls-position="right" :min="0" :max="65535" size="small"/>
+           </el-form-item>
+         </el-col>
+        </el-row>
+      </el-form>
+    </div>
+  </div>
+</template>
+
+<script>
+import {REQ_METHOD} from "@/business/components/api/definition/model/JsonData";
+
+export default {
+  name: "CustomizeReqInfo",
+  props: ['request', 'isCustomizeReq'],
+  data() {
+    return {
+      reqOptions: REQ_METHOD,
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .server-input {
+    width: 50%;
+  }
+</style>
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 e1b7c69dab..a783ed82f0 100644
--- a/frontend/src/business/components/api/automation/scenario/component/ApiComponent.vue
+++ b/frontend/src/business/components/api/automation/scenario/component/ApiComponent.vue
@@ -25,18 +25,8 @@
       </el-tooltip>
     </template>
 
-    <div v-if="request.protocol === 'HTTP'">
-      <el-input :placeholder="$t('api_test.definition.request.path_all_info')" v-if="request.url" v-model="request.url" style="width: 85%;margin-top: 10px" size="small">
-        <el-select v-model="request.method" slot="prepend" style="width: 100px" size="small">
-          <el-option v-for="item in reqOptions" :key="item.id" :label="item.label" :value="item.id"/>
-        </el-select>
-      </el-input>
-      <el-input :placeholder="$t('api_test.definition.request.path_all_info')" v-else v-model="request.path" style="width: 85%;margin-top: 10px" size="small">
-        <el-select v-model="request.method" slot="prepend" style="width: 100px" size="small">
-          <el-option v-for="item in reqOptions" :key="item.id" :label="item.label" :value="item.id"/>
-        </el-select>
-      </el-input>
-    </div>
+    <customize-req-info :is-customize-req="isCustomizeReq" :request="request"/>
+
     <p class="tip">{{$t('api_test.definition.request.req_param')}} </p>
     <ms-api-request-form :isShowEnable="true" :referenced="true" :headers="request.headers " :request="request" v-if="request.protocol==='HTTP' || request.type==='HTTPSamplerProxy'"/>
     <ms-tcp-basis-parameters :request="request" v-if="request.protocol==='TCP'|| request.type==='TCPSampler'"/>
@@ -65,6 +55,7 @@
   import {getUUID} from "@/common/js/utils";
   import ApiBaseComponent from "../common/ApiBaseComponent";
   import ApiResponseComponent from "./ApiResponseComponent";
+  import CustomizeReqInfo from "@/business/components/api/automation/scenario/common/CustomizeReqInfo";
 
   export default {
     name: "MsApiComponent",
@@ -79,13 +70,13 @@
       currentEnvironmentId: String,
     },
     components: {
+      CustomizeReqInfo,
       ApiBaseComponent, ApiResponseComponent,
       MsSqlBasisParameters, MsTcpBasisParameters, MsDubboBasisParameters, MsApiRequestForm, MsRequestResultTail, MsRun
     },
     data() {
       return {
         loading: false,
-        reqOptions: REQ_METHOD,
         reportId: "",
         runData: [],
         isShowInput: false,
@@ -249,6 +240,10 @@
           variables: this.currentScenario.variables, referenced: 'Created', enableCookieShare: this.enableCookieShare,
           environmentId: this.currentEnvironmentId, hashTree: [this.request]
         };
+        if (this.isCustomizeReq) {
+          debugData.environmentId = null;
+          this.request.useEnvironment = null;
+        }
         this.runData.push(debugData);
         /*触发执行操作*/
         this.reportId = getUUID().substring(0, 8);
diff --git a/frontend/src/business/components/api/automation/scenario/component/ComponentConfig.vue b/frontend/src/business/components/api/automation/scenario/component/ComponentConfig.vue
index 59e4c6c13c..5a2cbd94d7 100644
--- a/frontend/src/business/components/api/automation/scenario/component/ComponentConfig.vue
+++ b/frontend/src/business/components/api/automation/scenario/component/ComponentConfig.vue
@@ -16,7 +16,6 @@
   import MsApiComponent from "./ApiComponent";
   import MsLoopController from "./LoopController";
   import MsApiScenarioComponent from "./ApiScenarioComponent";
-  import {getUUID} from "@/common/js/utils";
 
   export default {
     name: "ComponentConfig",