From 6461c1a6a6fb0fa37badaabdb0d63a80fccaa9a4 Mon Sep 17 00:00:00 2001 From: "Captain.B" Date: Thu, 13 Aug 2020 13:34:43 +0800 Subject: [PATCH] =?UTF-8?q?feat(=E6=8E=A5=E5=8F=A3=E6=B5=8B=E8=AF=95):=20?= =?UTF-8?q?=E5=AE=9A=E4=B9=89=E6=96=B0=E7=9A=84=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../api/test/components/ApiBody.vue | 35 +- .../api/test/components/ApiKeyValue.vue | 202 +---------- .../api/test/components/ApiScenarioForm.vue | 221 ++++++------ .../api/test/components/ApiVariable.vue | 341 ++++++++++++++++++ .../components/request/ApiHttpRequestForm.vue | 194 +++++----- 5 files changed, 571 insertions(+), 422 deletions(-) create mode 100644 frontend/src/business/components/api/test/components/ApiVariable.vue diff --git a/frontend/src/business/components/api/test/components/ApiBody.vue b/frontend/src/business/components/api/test/components/ApiBody.vue index 64dad3d17a..96fb5dcbaa 100644 --- a/frontend/src/business/components/api/test/components/ApiBody.vue +++ b/frontend/src/business/components/api/test/components/ApiBody.vue @@ -11,7 +11,7 @@ - +
@@ -21,24 +21,25 @@ diff --git a/frontend/src/business/components/api/test/components/ApiVariable.vue b/frontend/src/business/components/api/test/components/ApiVariable.vue new file mode 100644 index 0000000000..14bd18fa56 --- /dev/null +++ b/frontend/src/business/components/api/test/components/ApiVariable.vue @@ -0,0 +1,341 @@ + + + + + diff --git a/frontend/src/business/components/api/test/components/request/ApiHttpRequestForm.vue b/frontend/src/business/components/api/test/components/request/ApiHttpRequestForm.vue index c85e6213ce..32dddae2b6 100644 --- a/frontend/src/business/components/api/test/components/request/ApiHttpRequestForm.vue +++ b/frontend/src/business/components/api/test/components/request/ApiHttpRequestForm.vue @@ -26,9 +26,10 @@ - {{request.environment ? request.environment.name + ': ' : ''}} - {{displayUrl}} - {{$t('api_test.request.please_configure_environment_in_scenario')}} + {{ request.environment ? request.environment.name + ': ' : '' }} + {{ displayUrl }} + {{ $t('api_test.request.please_configure_environment_in_scenario') }} @@ -39,12 +40,14 @@ - {{$t('load_test.save_and_run')}} + {{ $t('load_test.save_and_run') }} + - + @@ -70,10 +73,11 @@ import {HttpRequest, KeyValue} from "../../model/ScenarioModel"; import MsApiExtract from "../extract/ApiExtract"; import ApiRequestMethodSelect from "../collapse/ApiRequestMethodSelect"; import {REQUEST_HEADERS} from "@/common/js/constants"; +import MsApiVariable from "@/business/components/api/test/components/ApiVariable"; export default { name: "MsApiHttpRequestForm", - components: {ApiRequestMethodSelect, MsApiExtract, MsApiAssertions, MsApiBody, MsApiKeyValue}, + components: {MsApiVariable, ApiRequestMethodSelect, MsApiExtract, MsApiAssertions, MsApiBody, MsApiKeyValue}, props: { request: HttpRequest, isReadOnly: { @@ -91,109 +95,109 @@ export default { } }; return { - activeName: "parameters", - rules: { - name: [ - {max: 300, message: this.$t('commons.input_limit', [1, 300]), trigger: 'blur'} - ], - url: [ - {max: 500, required: true, message: this.$t('commons.input_limit', [1, 500]), trigger: 'blur'}, - {validator: validateURL, trigger: 'blur'} - ], - path: [ - {max: 500, message: this.$t('commons.input_limit', [0, 500]), trigger: 'blur'}, - ] - }, - headerSuggestions: REQUEST_HEADERS + activeName: "parameters", + rules: { + name: [ + {max: 300, message: this.$t('commons.input_limit', [1, 300]), trigger: 'blur'} + ], + url: [ + {max: 500, required: true, message: this.$t('commons.input_limit', [1, 500]), trigger: 'blur'}, + {validator: validateURL, trigger: 'blur'} + ], + path: [ + {max: 500, message: this.$t('commons.input_limit', [0, 500]), trigger: 'blur'}, + ] + }, + headerSuggestions: REQUEST_HEADERS + } + }, + + methods: { + urlChange() { + if (!this.request.url) return; + let url = this.getURL(this.addProtocol(this.request.url)); + if (url) { + this.request.url = decodeURIComponent(url.origin + url.pathname); } }, - - methods: { - urlChange() { - if (!this.request.url) return; - let url = this.getURL(this.addProtocol(this.request.url)); - if (url) { - this.request.url = decodeURIComponent(url.origin + url.pathname); - } - }, - pathChange() { - if (!this.request.path) return; - let url = this.getURL(this.displayUrl); - let urlStr = url.origin + url.pathname; - let envUrl = this.request.environment.protocol + '://' + this.request.environment.socket; - this.request.path = decodeURIComponent(urlStr.substring(envUrl.length, urlStr.length)); - }, - getURL(urlStr) { - try { - let url = new URL(urlStr); - url.searchParams.forEach((value, key) => { - if (key && value) { - this.request.parameters.splice(0, 0, new KeyValue(key, value)); - } - }); - return url; - } catch (e) { - this.$error(this.$t('api_test.request.url_invalid'), 2000); - } - }, - methodChange(value) { - if (value === 'GET' && this.activeName === 'body') { - this.activeName = 'parameters'; - } - }, - useEnvironmentChange(value) { - if (value && !this.request.environment) { - this.$error(this.$t('api_test.request.please_add_environment_to_scenario'), 2000); - this.request.useEnvironment = false; - } - this.$refs["request"].clearValidate(); - }, - addProtocol(url) { - if (url) { - if (!url.toLowerCase().startsWith("https") && !url.toLowerCase().startsWith("http")) { - return "https://" + url; + pathChange() { + if (!this.request.path) return; + let url = this.getURL(this.displayUrl); + let urlStr = url.origin + url.pathname; + let envUrl = this.request.environment.protocol + '://' + this.request.environment.socket; + this.request.path = decodeURIComponent(urlStr.substring(envUrl.length, urlStr.length)); + }, + getURL(urlStr) { + try { + let url = new URL(urlStr); + url.searchParams.forEach((value, key) => { + if (key && value) { + this.request.parameters.splice(0, 0, new KeyValue(key, value)); } - } + }); return url; - }, - runDebug() { - this.$emit('runDebug'); + } catch (e) { + this.$error(this.$t('api_test.request.url_invalid'), 2000); } }, - - computed: { - isNotGet() { - return this.request.method !== "GET"; - }, - displayUrl() { - return this.request.environment ? this.request.environment.protocol + '://' + this.request.environment.socket + (this.request.path ? this.request.path : '') : ''; + methodChange(value) { + if (value === 'GET' && this.activeName === 'body') { + this.activeName = 'parameters'; } + }, + useEnvironmentChange(value) { + if (value && !this.request.environment) { + this.$error(this.$t('api_test.request.please_add_environment_to_scenario'), 2000); + this.request.useEnvironment = false; + } + this.$refs["request"].clearValidate(); + }, + addProtocol(url) { + if (url) { + if (!url.toLowerCase().startsWith("https") && !url.toLowerCase().startsWith("http")) { + return "https://" + url; + } + } + return url; + }, + runDebug() { + this.$emit('runDebug'); + } + }, + + computed: { + isNotGet() { + return this.request.method !== "GET"; + }, + displayUrl() { + return this.request.environment ? this.request.environment.protocol + '://' + this.request.environment.socket + (this.request.path ? this.request.path : '') : ''; } } +}