test-version22
/
MeterSphere
mirror of https://gitee.com/fit2cloud-feizhiyun/MeterSphere.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

refactor: 优化tcp，dubbo sql设置关注人

This commit is contained in:
CaptainB 2021-12-04 20:47:55 +08:00 committed by 刘瑞斌
parent 8d4c78fe16
commit 9ba2d455ea
5 changed files with 273 additions and 157 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
frontend/src/business/components/api/definition/components/complete/BasisApi.vue
View File

@ -45,28 +45,13 @@
<ms-input-tag :currentScenario="basicForm" ref="tag"/> <ms-input-tag :currentScenario="basicForm" ref="tag"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8">
<el-form-item :label="$t('api_test.automation.follow_people')" prop="followPeople">
<el-select v-model="basicForm.follows"
clearable multiple
:placeholder="$t('api_test.automation.follow_people')" filterable size="small"
class="ms-http-textarea">
<el-option
v-for="item in maintainerOptions"
:key="item.id"
:label="item.id + ' (' + item.name + ')'"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item :label="$t('commons.description')" prop="description"> <el-form-item :label="$t('commons.description')" prop="description">
<el-input class="ms-http-textarea" <el-input class="ms-http-textarea"
v-model="basicForm.description" v-model="basicForm.description"
type="textarea" type="textarea"
:autosize="{ minRows: 2, maxRows: 10}" :autosize="{ minRows: 1, maxRows: 10}"
:rows="2" size="small"/> :rows="1" size="small"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>

71
frontend/src/business/components/api/definition/components/complete/EditCompleteDubboApi.vue
View File

@ -6,6 +6,14 @@
<el-col> <el-col>
<!--操作按钮--> <!--操作按钮-->
<div style="float: right;margin-right: 20px;margin-top: 20px" class="ms-opt-btn"> <div style="float: right;margin-right: 20px;margin-top: 20px" class="ms-opt-btn">
<el-tooltip :content="$t('commons.follow')" placement="bottom" effect="dark" v-if="!showFollow">
<i class="el-icon-star-off" style="color: #783987; font-size: 25px; margin-right: 5px; position: relative; top: 5px; cursor: pointer "
@click="saveFollow"/>
</el-tooltip>
<el-tooltip :content="$t('commons.cancel')" placement="bottom" effect="dark" v-if="showFollow">
<i class="el-icon-star-on" style="color: #783987; font-size: 28px; margin-right: 5px; position: relative; top: 5px; cursor: pointer "
@click="saveFollow"/>
</el-tooltip>
<el-link type="primary" style="margin-right: 20px" @click="openHis" v-if="basisData.id"> <el-link type="primary" style="margin-right: 20px" @click="openHis" v-if="basisData.id">
{{ $t('operating_log.change_history') }} {{ $t('operating_log.change_history') }}
</el-link> </el-link>
@ -33,16 +41,17 @@
</template> </template>
<script> <script>
import MsBasisApi from "./BasisApi"; import MsBasisApi from "./BasisApi";
import MsBasisParameters from "../request/dubbo/BasisParameters"; import MsBasisParameters from "../request/dubbo/BasisParameters";
import MsChangeHistory from "../../../../history/ChangeHistory"; import MsChangeHistory from "../../../../history/ChangeHistory";
import ApiOtherInfo from "@/business/components/api/definition/components/complete/ApiOtherInfo"; import ApiOtherInfo from "@/business/components/api/definition/components/complete/ApiOtherInfo";
import {getCurrentUser} from "@/common/js/utils";
export default { export default {
name: "MsApiDubboRequestForm", name: "MsApiDubboRequestForm",
components: { components: {
ApiOtherInfo, ApiOtherInfo,
MsBasisApi, MsBasisParameters,MsChangeHistory MsBasisApi, MsBasisParameters, MsChangeHistory
}, },
props: { props: {
request: {}, request: {},
@ -74,13 +83,26 @@
} }
} }
}, },
created() {
this.$get('/api/definition/follow/' + this.basisData.id, response => {
this.basisData.follows = response.data;
for (let i = 0; i < response.data.length; i++) {
if (response.data[i] === getCurrentUser().id) {
this.showFollow = true;
break;
}
}
});
},
data() { data() {
return {validated: false} return {
validated: false,
showFollow: false
}
}, },
methods: { methods: {
openHis(){ openHis() {
this.$refs.changeHistory.open(this.basisData.id,["接口定义" , "接口定義" , "Api definition"]); this.$refs.changeHistory.open(this.basisData.id, ["接口定义", "接口定義", "Api definition"]);
}, },
callback() { callback() {
this.validated = true; this.validated = true;
@ -113,10 +135,37 @@
createRootModelInTree() { createRootModelInTree() {
this.$emit("createRootModelInTree"); this.$emit("createRootModelInTree");
}, },
saveFollow() {
if (this.showFollow) {
this.showFollow = false;
for (let i = 0; i < this.basisData.follows.length; i++) {
if (this.basisData.follows[i] === getCurrentUser().id) {
this.basisData.follows.splice(i, 1)
break;
}
}
if (this.basisData.id) {
this.$post("/api/definition/update/follows/" + this.basisData.id, this.basisData.follows, () => {
this.$success(this.$t('commons.cancel_follow_success'));
});
}
} else {
this.showFollow = true;
if (!this.basisData.follows) {
this.basisData.follows = [];
}
this.basisData.follows.push(getCurrentUser().id)
if (this.basisData.id) {
this.$post("/api/definition/update/follows/" + this.basisData.id, this.basisData.follows, () => {
this.$success(this.$t('commons.follow_success'));
});
}
}
}
}, },
computed: {} computed: {}
} }
</script> </script>
<style scoped> <style scoped>

60
frontend/src/business/components/api/definition/components/complete/EditCompleteSQLApi.vue
View File

@ -5,6 +5,14 @@
<el-col> <el-col>
<!--操作按钮--> <!--操作按钮-->
<div style="float: right;margin-right: 20px;margin-top: 20px" class="ms-opt-btn"> <div style="float: right;margin-right: 20px;margin-top: 20px" class="ms-opt-btn">
<el-tooltip :content="$t('commons.follow')" placement="bottom" effect="dark" v-if="!showFollow">
<i class="el-icon-star-off" style="color: #783987; font-size: 25px; margin-right: 5px; position: relative; top: 5px; cursor: pointer "
@click="saveFollow"/>
</el-tooltip>
<el-tooltip :content="$t('commons.cancel')" placement="bottom" effect="dark" v-if="showFollow">
<i class="el-icon-star-on" style="color: #783987; font-size: 28px; margin-right: 5px; position: relative; top: 5px; cursor: pointer "
@click="saveFollow"/>
</el-tooltip>
<el-link type="primary" style="margin-right: 20px" @click="openHis" v-if="basisData.id"> <el-link type="primary" style="margin-right: 20px" @click="openHis" v-if="basisData.id">
{{ $t('operating_log.change_history') }} {{ $t('operating_log.change_history') }}
</el-link> </el-link>
@ -38,12 +46,13 @@ import MsBasisApi from "./BasisApi";
import MsBasisParameters from "../request/database/BasisParameters"; import MsBasisParameters from "../request/database/BasisParameters";
import MsChangeHistory from "../../../../history/ChangeHistory"; import MsChangeHistory from "../../../../history/ChangeHistory";
import ApiOtherInfo from "@/business/components/api/definition/components/complete/ApiOtherInfo"; import ApiOtherInfo from "@/business/components/api/definition/components/complete/ApiOtherInfo";
import {getCurrentUser} from "@/common/js/utils";
export default { export default {
name: "MsApiSqlRequestForm", name: "MsApiSqlRequestForm",
components: { components: {
ApiOtherInfo, ApiOtherInfo,
MsBasisApi, MsBasisParameters,MsChangeHistory MsBasisApi, MsBasisParameters, MsChangeHistory
}, },
props: { props: {
request: {}, request: {},
@ -53,7 +62,7 @@ export default {
type: Boolean, type: Boolean,
default: false default: false
}, },
syncTabs:{}, syncTabs: {},
}, },
watch: { watch: {
syncTabs() { syncTabs() {
@ -76,11 +85,25 @@ export default {
} }
}, },
data() { data() {
return {validated: false} return {
validated: false,
showFollow: false
}
},
created() {
this.$get('/api/definition/follow/' + this.basisData.id, response => {
this.basisData.follows = response.data;
for (let i = 0; i < response.data.length; i++) {
if (response.data[i] === getCurrentUser().id) {
this.showFollow = true;
break;
}
}
});
}, },
methods: { methods: {
openHis(){ openHis() {
this.$refs.changeHistory.open(this.basisData.id,["接口定义" , "接口定義" , "Api definition"]); this.$refs.changeHistory.open(this.basisData.id, ["接口定义", "接口定義", "Api definition"]);
}, },
callback() { callback() {
this.validated = true; this.validated = true;
@ -113,6 +136,33 @@ export default {
createRootModelInTree() { createRootModelInTree() {
this.$emit("createRootModelInTree"); this.$emit("createRootModelInTree");
}, },
saveFollow() {
if (this.showFollow) {
this.showFollow = false;
for (let i = 0; i < this.basisData.follows.length; i++) {
if (this.basisData.follows[i] === getCurrentUser().id) {
this.basisData.follows.splice(i, 1)
break;
}
}
if (this.basisData.id) {
this.$post("/api/definition/update/follows/" + this.basisData.id, this.basisData.follows, () => {
this.$success(this.$t('commons.cancel_follow_success'));
});
}
} else {
this.showFollow = true;
if (!this.basisData.follows) {
this.basisData.follows = [];
}
this.basisData.follows.push(getCurrentUser().id)
if (this.basisData.id) {
this.$post("/api/definition/update/follows/" + this.basisData.id, this.basisData.follows, () => {
this.$success(this.$t('commons.follow_success'));
});
}
}
}
}, },
} }
</script> </script>

122
frontend/src/business/components/api/definition/components/complete/EditCompleteTCPApi.vue
View File

@ -5,6 +5,14 @@
<el-col> <el-col>
<!--操作按钮--> <!--操作按钮-->
<div style="float: right;margin-right: 20px;margin-top: 20px" class="ms-opt-btn"> <div style="float: right;margin-right: 20px;margin-top: 20px" class="ms-opt-btn">
<el-tooltip :content="$t('commons.follow')" placement="bottom" effect="dark" v-if="!showFollow">
<i class="el-icon-star-off" style="color: #783987; font-size: 25px; margin-right: 5px; position: relative; top: 5px; cursor: pointer "
@click="saveFollow"/>
</el-tooltip>
<el-tooltip :content="$t('commons.cancel')" placement="bottom" effect="dark" v-if="showFollow">
<i class="el-icon-star-on" style="color: #783987; font-size: 28px; margin-right: 5px; position: relative; top: 5px; cursor: pointer "
@click="saveFollow"/>
</el-tooltip>
<el-link type="primary" style="margin-right: 20px" @click="openHis" v-if="basisData.id"> <el-link type="primary" style="margin-right: 20px" @click="openHis" v-if="basisData.id">
{{ $t('operating_log.change_history') }} {{ $t('operating_log.change_history') }}
</el-link> </el-link>
@ -17,7 +25,8 @@
<br/> <br/>
<el-row> <el-row>
<el-col> <el-col>
<ms-tcp-basic-api :method-types="methodTypes" @createRootModelInTree="createRootModelInTree" :moduleOptions="moduleOptions" :basisData="basisData" ref="basicForm" <ms-tcp-basic-api :method-types="methodTypes" @createRootModelInTree="createRootModelInTree" :moduleOptions="moduleOptions"
:basisData="basisData" ref="basicForm"
@changeApiProtocol="changeApiProtocol" @callback="callback"/> @changeApiProtocol="changeApiProtocol" @callback="callback"/>
</el-col> </el-col>
</el-row> </el-row>
@ -42,15 +51,15 @@
<!-- 请求参数 --> <!-- 请求参数 -->
<div v-if="apiProtocol=='TCP'"> <div v-if="apiProtocol=='TCP'">
<p class="tip">{{ $t('api_test.definition.request.req_param') }} </p> <p class="tip">{{ $t('api_test.definition.request.req_param') }} </p>
<!-- <ms-basis-parameters :show-script="false" :request="request"/>--> <!-- <ms-basis-parameters :show-script="false" :request="request"/>-->
<ms-tcp-format-parameters :show-script="false" :request="request" ref="tcpFormatParameter"/> <ms-tcp-format-parameters :show-script="false" :request="request" ref="tcpFormatParameter"/>
</div> </div>
<div v-else-if="apiProtocol=='ESB'"> <div v-else-if="apiProtocol=='ESB'">
<p class="tip">{{ $t('api_test.definition.request.req_param') }} </p> <p class="tip">{{ $t('api_test.definition.request.req_param') }} </p>
<esb-definition v-xpack v-if="showXpackCompnent" :show-script="false" :request="request" ref="esbDefinition"/> <esb-definition v-xpack v-if="showXpackCompnent" :show-script="false" :request="request" ref="esbDefinition"/>
<p class="tip">{{$t('api_test.definition.request.res_param')}}</p> <p class="tip">{{ $t('api_test.definition.request.res_param') }}</p>
<esb-definition-response v-xpack v-if="showXpackCompnent" :is-api-component="true" :show-options-button="true" :request="request" /> <esb-definition-response v-xpack v-if="showXpackCompnent" :is-api-component="true" :show-options-button="true" :request="request"/>
<!-- <api-response-component :currentProtocol="apiCase.request.protocol" :api-item="apiCase"/>--> <!-- <api-response-component :currentProtocol="apiCase.request.protocol" :api-item="apiCase"/>-->
</div> </div>
<api-other-info :api="basisData"/> <api-other-info :api="basisData"/>
@ -64,18 +73,19 @@
import MsTcpBasicApi from "./TCPBasicApi"; import MsTcpBasicApi from "./TCPBasicApi";
import MsTcpFormatParameters from "../request/tcp/TcpFormatParameters"; import MsTcpFormatParameters from "../request/tcp/TcpFormatParameters";
import MsChangeHistory from "../../../../history/ChangeHistory"; import MsChangeHistory from "../../../../history/ChangeHistory";
import {hasLicense, getCurrentProjectID, getUUID} from "@/common/js/utils"; import {hasLicense, getCurrentProjectID, getUUID, getCurrentUser} from "@/common/js/utils";
import ApiOtherInfo from "@/business/components/api/definition/components/complete/ApiOtherInfo"; import ApiOtherInfo from "@/business/components/api/definition/components/complete/ApiOtherInfo";
const requireComponent = require.context('@/business/components/xpack/', true, /\.vue$/); const requireComponent = require.context('@/business/components/xpack/', true, /\.vue$/);
const esbDefinition = (requireComponent!=null&&requireComponent.keys().length) > 0 ? requireComponent("./apidefinition/EsbDefinition.vue") : {}; const esbDefinition = (requireComponent != null && requireComponent.keys().length) > 0 ? requireComponent("./apidefinition/EsbDefinition.vue") : {};
const esbDefinitionResponse = (requireComponent!=null&&requireComponent.keys().length) > 0 ? requireComponent("./apidefinition/EsbDefinitionResponse.vue") : {}; const esbDefinitionResponse = (requireComponent != null && requireComponent.keys().length) > 0 ? requireComponent("./apidefinition/EsbDefinitionResponse.vue") : {};
export default { export default {
name: "MsAddCompleteTcpApi", name: "MsAddCompleteTcpApi",
components: { components: {
ApiOtherInfo, MsTcpBasicApi, MsTcpFormatParameters,MsChangeHistory, ApiOtherInfo, MsTcpBasicApi, MsTcpFormatParameters, MsChangeHistory,
"esbDefinition": esbDefinition.default, "esbDefinition": esbDefinition.default,
"esbDefinitionResponse": esbDefinitionResponse.default}, "esbDefinitionResponse": esbDefinitionResponse.default
},
props: { props: {
request: {}, request: {},
basisData: {}, basisData: {},
@ -84,41 +94,51 @@ export default {
type: Boolean, type: Boolean,
default: false default: false
}, },
syncTabs:Array, syncTabs: Array,
}, },
data() { data() {
return { return {
validated: false, validated: false,
apiProtocol: "TCP", apiProtocol: "TCP",
mockInfo: "", mockInfo: "",
methodTypes:[ showFollow: false,
methodTypes: [
{ {
'key':"TCP", 'key': "TCP",
'value':this.$t('api_test.request.tcp.general_format'), 'value': this.$t('api_test.request.tcp.general_format'),
} }
], ],
showXpackCompnent:false, showXpackCompnent: false,
} }
}, },
created: function () { created: function () {
if(this.basisData.method != 'TCP'&& this.basisData.method != 'ESB'){ if (this.basisData.method != 'TCP' && this.basisData.method != 'ESB') {
this.basisData.method = this.basisData.protocol; this.basisData.method = this.basisData.protocol;
} }
this.apiProtocol = this.basisData.method; this.apiProtocol = this.basisData.method;
if(this.apiProtocol == null || this.apiProtocol == "" ){ if (this.apiProtocol == null || this.apiProtocol == "") {
this.apiProtocol = "TCP"; this.apiProtocol = "TCP";
} }
if (requireComponent != null && JSON.stringify(esbDefinition) != '{}'&& JSON.stringify(esbDefinitionResponse) != '{}') { if (requireComponent != null && JSON.stringify(esbDefinition) != '{}' && JSON.stringify(esbDefinitionResponse) != '{}') {
this.showXpackCompnent = true; this.showXpackCompnent = true;
if(hasLicense()){ if (hasLicense()) {
if(this.methodTypes.length == 1){ if (this.methodTypes.length == 1) {
let esbMethodType = {}; let esbMethodType = {};
esbMethodType.key = "ESB"; esbMethodType.key = "ESB";
esbMethodType.value="ESB"; esbMethodType.value = "ESB";
this.methodTypes.push(esbMethodType); this.methodTypes.push(esbMethodType);
} }
} }
} }
this.$get('/api/definition/follow/' + this.basisData.id, response => {
this.basisData.follows = response.data;
for (let i = 0; i < response.data.length; i++) {
if (response.data[i] === getCurrentUser().id) {
this.showFollow = true;
break;
}
}
});
this.getMockInfo(); this.getMockInfo();
}, },
watch: { watch: {
@ -142,8 +162,8 @@ export default {
}, },
}, },
methods: { methods: {
openHis(){ openHis() {
this.$refs.changeHistory.open(this.basisData.id,["接口定义" , "接口定義" , "Api definition"]); this.$refs.changeHistory.open(this.basisData.id, ["接口定义", "接口定義", "Api definition"]);
}, },
callback() { callback() {
this.validated = true; this.validated = true;
@ -159,23 +179,23 @@ export default {
if (this.basisData.tags instanceof Array) { if (this.basisData.tags instanceof Array) {
this.basisData.tags = JSON.stringify(this.basisData.tags); this.basisData.tags = JSON.stringify(this.basisData.tags);
} }
if(this.basisData.method == 'ESB'){ if (this.basisData.method == 'ESB') {
let validataResult = this.$refs.esbDefinition.validateEsbDataStruct(this.request.esbDataStruct); let validataResult = this.$refs.esbDefinition.validateEsbDataStruct(this.request.esbDataStruct);
if(!validataResult){ if (!validataResult) {
return; return;
} }
if(this.request.esbDataStruct != null){ if (this.request.esbDataStruct != null) {
this.esbDataStruct = JSON.stringify(this.request.esbDataStruct); this.esbDataStruct = JSON.stringify(this.request.esbDataStruct);
this.basisData.esbDataStruct = this.esbDataStruct; this.basisData.esbDataStruct = this.esbDataStruct;
} }
if(this.request.backEsbDataStruct != null){ if (this.request.backEsbDataStruct != null) {
this.basisData.backEsbDataStruct = JSON.stringify(this.request.backEsbDataStruct); this.basisData.backEsbDataStruct = JSON.stringify(this.request.backEsbDataStruct);
} }
if(this.request.backScript != null){ if (this.request.backScript != null) {
this.basisData.backScript = JSON.stringify(this.request.backScript); this.basisData.backScript = JSON.stringify(this.request.backScript);
} }
}else{ } else {
if(this.$refs.tcpFormatParameter){ if (this.$refs.tcpFormatParameter) {
this.$refs.tcpFormatParameter.validateXmlDataStruct(); this.$refs.tcpFormatParameter.validateXmlDataStruct();
} }
} }
@ -204,8 +224,8 @@ export default {
if (this.request.backScript != null) { if (this.request.backScript != null) {
this.basisData.backScript = JSON.stringify(this.request.backScript); this.basisData.backScript = JSON.stringify(this.request.backScript);
} }
}else{ } else {
if(this.$refs.tcpFormatParameter){ if (this.$refs.tcpFormatParameter) {
this.$refs.tcpFormatParameter.validateXmlDataStruct(); this.$refs.tcpFormatParameter.validateXmlDataStruct();
} }
} }
@ -215,22 +235,49 @@ export default {
createRootModelInTree() { createRootModelInTree() {
this.$emit("createRootModelInTree"); this.$emit("createRootModelInTree");
}, },
changeApiProtocol(protocol){ changeApiProtocol(protocol) {
this.apiProtocol = protocol; this.apiProtocol = protocol;
}, },
getMockInfo(){ getMockInfo() {
let projectId = getCurrentProjectID(); let projectId = getCurrentProjectID();
this.$get("/api/environment/getTcpMockInfo/" + projectId, response => { this.$get("/api/environment/getTcpMockInfo/" + projectId, response => {
this.mockInfo = response.data; this.mockInfo = response.data;
}); });
}, },
mockSetting() { mockSetting() {
if(this.basisData.id){ if (this.basisData.id) {
this.$emit('changeTab','mock'); this.$emit('changeTab', 'mock');
}else { } else {
this.$alert(this.$t('api_test.mock.create_error')); this.$alert(this.$t('api_test.mock.create_error'));
} }
}, },
saveFollow() {
if (this.showFollow) {
this.showFollow = false;
for (let i = 0; i < this.basisData.follows.length; i++) {
if (this.basisData.follows[i] === getCurrentUser().id) {
this.basisData.follows.splice(i, 1)
break;
}
}
if (this.basisData.id) {
this.$post("/api/definition/update/follows/" + this.basisData.id, this.basisData.follows, () => {
this.$success(this.$t('commons.cancel_follow_success'));
});
}
} else {
this.showFollow = true;
if (!this.basisData.follows) {
this.basisData.follows = [];
}
this.basisData.follows.push(getCurrentUser().id)
if (this.basisData.id) {
this.$post("/api/definition/update/follows/" + this.basisData.id, this.basisData.follows, () => {
this.$success(this.$t('commons.follow_success'));
});
}
}
}
}, },
} }
</script> </script>
@ -239,6 +286,7 @@ export default {
.mock-info { .mock-info {
margin: 20px 45px; margin: 20px 45px;
} }
.ms-opt-btn { .ms-opt-btn {
position: fixed; position: fixed;
right: 50px; right: 50px;

20
frontend/src/business/components/api/definition/components/complete/TCPBasicApi.vue
View File

@ -52,29 +52,13 @@
<ms-input-tag :currentScenario="basicForm" ref="tag"/> <ms-input-tag :currentScenario="basicForm" ref="tag"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8">
<el-form-item :label="$t('api_test.automation.follow_people')" prop="followPeople">
<el-select v-model="basicForm.follows"
clearable
multiple
:placeholder="$t('api_test.automation.follow_people')" filterable size="small"
class="ms-http-textarea">
<el-option
v-for="item in maintainerOptions"
:key="item.id"
:label="item.id + ' (' + item.name + ')'"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item :label="$t('commons.description')" prop="description"> <el-form-item :label="$t('commons.description')" prop="description">
<el-input class="ms-http-textarea" <el-input class="ms-http-textarea"
v-model="basicForm.description" v-model="basicForm.description"
type="textarea" type="textarea"
:autosize="{ minRows: 2, maxRows: 10}" :autosize="{ minRows: 1, maxRows: 10}"
:rows="2" size="small"/> :rows="1" size="small"/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>