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

fix(接口定义): 修复用例加载缺陷

This commit is contained in:
fit2-zhao 2020-12-11 15:41:33 +08:00
parent a3cfeaca6c
commit d4ff468cf9
10 changed files with 133 additions and 116 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

174
frontend/src/business/components/api/definition/ApiDefinition.vue
View File

@ -1,45 +1,52 @@
<template>
<ms-container>
<ms-aside-container>
<ms-node-tree @selectModule="selectModule" @getApiModuleTree="initTree" @changeProtocol="changeProtocol"
@refresh="refresh" @saveAsEdit="editApi" @debug="debug" @exportAPI="exportAPI"/>
<ms-node-tree @selectModule="selectModule"
@getApiModuleTree="initTree"
@changeProtocol="changeProtocol"
@refresh="refresh"
@saveAsEdit="editApi"
@debug="debug"
@exportAPI="exportAPI"/>
</ms-aside-container>
<ms-main-container>
<el-dropdown size="small" split-button type="primary" class="ms-api-buttion" @click="handleCommand('add')"
<el-dropdown size="small" split-button type="primary" class="ms-api-buttion"
@click="handleCommand('ADD')"
@command="handleCommand">
{{$t('commons.add')}}
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="debug">{{$t('api_test.definition.request.fast_debug')}}</el-dropdown-item>
<el-dropdown-item command="add">{{$t('api_test.definition.request.title')}}</el-dropdown-item>
<el-dropdown-item command="closeAll">{{$t('api_test.definition.request.close_all_label')}}</el-dropdown-item>
<el-dropdown-item command="ADD">{{$t('api_test.definition.request.title')}}</el-dropdown-item>
<el-dropdown-item command="CLOSE_ALL">{{$t('api_test.definition.request.close_all_label')}}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<!-- 主框架列表 -->
<el-tabs v-model="apiDefaultTab" @edit="handleTabsEdit">
<el-tab-pane
:key="item.name"
v-for="(item) in apiTabs"
:label="item.title"
:closable="item.closable"
:name="item.name">
<!-- 主框架列表 -->
<el-tabs v-model="apiDefaultTab" @edit="handleTabRemove">
<el-tab-pane v-for="(item) in apiTabs"
:key="item.name"
:label="item.title"
:closable="item.closable"
:name="item.name">
<!-- 列表集合 -->
<ms-api-list
v-if="item.type === 'list'"
:current-protocol="currentProtocol"
:current-module="currentModule"
@editApi="editApi"
@handleCase="handleCase"
:visible="visible"
:currentRow="currentRow"
@editApi="editApi"
@handleCase="handleCase"
@handleEditBatch="handleEditBatch"
ref="apiList"/>
<!-- 添加测试窗口-->
<div v-else-if="item.type=== 'add'" class="ms-api-div">
<ms-api-config @runTest="runTest" @saveApi="saveApi" :current-api="currentApi"
<!-- 添加/编辑测试窗口-->
<div v-else-if="item.type=== 'ADD'" class="ms-api-div">
<ms-api-config @runTest="runTest" @saveApi="saveApi" ref="apiConfig"
:current-api="item.api"
:currentProtocol="currentProtocol"
:moduleOptions="moduleOptions" ref="apiConfig"/>
:moduleOptions="moduleOptions"/>
</div>
<!-- 快捷调试 -->
@ -51,7 +58,7 @@
</div>
<!-- 测试-->
<div v-else-if="item.type=== 'test'" class="ms-api-div">
<div v-else-if="item.type=== 'TEST'" class="ms-api-div">
<ms-run-test-http-page :currentProtocol="currentProtocol" :api-data="runTestData" @saveAsApi="editApi" v-if="currentProtocol==='HTTP'"/>
<ms-run-test-tcp-page :currentProtocol="currentProtocol" :api-data="runTestData" @saveAsApi="editApi" v-if="currentProtocol==='TCP'"/>
<ms-run-test-sql-page :currentProtocol="currentProtocol" :api-data="runTestData" @saveAsApi="editApi" v-if="currentProtocol==='SQL'"/>
@ -59,14 +66,9 @@
</div>
</el-tab-pane>
</el-tabs>
</ms-main-container>
</ms-container>
</template>
<script>
import MsNodeTree from './components/ApiModule';
import MsApiList from './components/ApiList';
@ -114,7 +116,7 @@
},
data() {
return {
isHide: true,
showCasePage: true,
apiDefaultTab: 'default',
currentProtocol: null,
currentModule: null,
@ -131,73 +133,89 @@
},
watch: {
currentProtocol() {
this.handleCommand("closeAll");
this.handleCommand("CLOSE_ALL");
}
},
methods: {
handleCommand(e) {
if (e === "add") {
this.currentApi = {status: "Underway", method: "GET", userId: getCurrentUser().id, url: "", protocol: this.currentProtocol};
this.handleTabsEdit(this.$t('api_test.definition.request.title'), e);
}
else if (e === "test") {
this.handleTabsEdit(this.$t("commons.api"), e);
}
else if (e === "closeAll") {
let tabs = this.apiTabs[0];
this.apiTabs = [];
this.apiDefaultTab = tabs.name;
this.apiTabs.push(tabs);
this.refresh();
}
else {
this.handleTabsEdit(this.$t('api_test.definition.request.fast_debug'), "debug");
switch (e) {
case "ADD":
this.handleTabAdd(e);
break;
case "TEST":
this.handleTabsEdit(this.$t("commons.api"), e);
break;
case "CLOSE_ALL":
this.handleTabClose();
break;
default:
this.handleTabsEdit(this.$t('api_test.definition.request.fast_debug'), "debug");
break;
}
},
handleTabsEdit(targetName, action) {
if (action === 'remove') {
let tabs = this.apiTabs;
let activeName = this.apiDefaultTab;
if (activeName === targetName) {
tabs.forEach((tab, index) => {
if (tab.name === targetName) {
let nextTab = tabs[index + 1] || tabs[index - 1];
if (nextTab) {
activeName = nextTab.name;
}
handleTabAdd(e) {
let api = {status: "Underway", method: "GET", userId: getCurrentUser().id, url: "", protocol: this.currentProtocol};
this.handleTabsEdit(this.$t('api_test.definition.request.title'), e, api);
},
handleTabClose() {
let tabs = this.apiTabs[0];
this.apiTabs = [];
this.apiDefaultTab = tabs.name;
this.apiTabs.push(tabs);
this.refresh();
},
handleTabRemove(targetName) {
let tabs = this.apiTabs;
let activeName = this.apiDefaultTab;
if (activeName === targetName) {
tabs.forEach((tab, index) => {
if (tab.name === targetName) {
let nextTab = tabs[index + 1] || tabs[index - 1];
if (nextTab) {
activeName = nextTab.name;
}
});
}
this.apiDefaultTab = activeName;
this.apiTabs = tabs.filter(tab => tab.name !== targetName);
this.refresh();
} else {
if (targetName === undefined || targetName === null) {
targetName = this.$t('api_test.definition.request.title');
}
let newTabName = getUUID().substring(0, 8);
this.apiTabs.push({
title: targetName,
name: newTabName,
closable: true,
type: action
}
});
this.apiDefaultTab = newTabName;
}
this.apiDefaultTab = activeName;
this.apiTabs = tabs.filter(tab => tab.name !== targetName);
this.refresh();
},
handleTabsEdit(targetName, action, api) {
if (targetName === undefined || targetName === null) {
targetName = this.$t('api_test.definition.request.title');
}
let newTabName = getUUID();
this.apiTabs.push({
title: targetName,
name: newTabName,
closable: true,
type: action,
api: api,
});
this.apiDefaultTab = newTabName;
},
debug() {
this.handleTabsEdit(this.$t('api_test.definition.request.fast_debug'), "debug");
},
editApi(row) {
this.currentApi = row;
this.handleTabsEdit(this.$t('api_test.definition.request.edit_api') + "-" + row.name, "add");
let name = this.$t('api_test.definition.request.edit_api');
if (row.name) {
name = this.$t('api_test.definition.request.edit_api') + "-" + row.name;
}
this.handleTabsEdit(name, "ADD", row);
},
handleCase(testCase) {
this.currentApi = testCase;
this.isHide = false;
handleEditBatch(rows) {
rows.forEach(row => {
this.handleTabsEdit(this.$t('api_test.definition.request.edit_api') + "-" + row.name, "ADD", row);
})
},
handleCase(api) {
this.currentApi = api;
this.showCasePage = false;
},
apiCaseClose() {
this.isHide = true;
this.showCasePage = true;
},
selectModule(data) {
this.currentModule = data;
@ -206,7 +224,7 @@
if (!this.$refs.apiList[0].tableData) {
return;
}
let obj = {projectName: getCurrentProjectID(), protocol: this.currentProtocol, data: this.$refs.apiList[0].tableData}
let obj = {protocol: this.currentProtocol, data: this.$refs.apiList[0].tableData}
downloadFile("导出API.json", JSON.stringify(obj));
},
refresh(data) {
@ -224,7 +242,7 @@
},
runTest(data) {
this.setTabTitle(data);
this.handleCommand("test");
this.handleCommand("TEST");
},
saveApi(data) {
this.setTabTitle(data);

15
frontend/src/business/components/api/definition/components/ApiList.vue
View File

@ -72,10 +72,9 @@
<el-table-column :label="$t('commons.operating')" min-width="130" align="center">
<template v-slot:default="scope">
<el-button type="text" @click="reductionApi(scope.row)" v-if="currentModule!=undefined && currentModule.id === 'gc'">恢复</el-button>
<el-button type="text" @click="editApi(scope.row)" v-else>编辑</el-button>
<el-button v-if="scope.row.caseTotal > 0" type="text" @click="handleTestCase(scope.row)">用例</el-button>
<el-button v-else type="text" @click="handleTestCase(scope.row)">+用例</el-button>
<el-button type="text" @click="handleDelete(scope.row)" style="color: #F56C6C">删除</el-button>
<el-button type="text" @click="editApi(scope.row)" v-else>{{$t('commons.edit')}}</el-button>
<el-button type="text" @click="handleTestCase(scope.row)">{{$t('api_test.definition.request.case')}}</el-button>
<el-button type="text" @click="handleDelete(scope.row)" style="color: #F56C6C">{{$t('commons.delete')}}</el-button>
</template>
</el-table-column>
</el-table>
@ -124,7 +123,10 @@
moduleId: "",
deletePath: "/test/case/delete",
selectRows: new Set(),
buttons: [{name: this.$t('api_test.definition.request.batch_delete'), handleClick: this.handleDeleteBatch}],
buttons: [
{name: this.$t('api_test.definition.request.batch_delete'), handleClick: this.handleDeleteBatch},
{name: this.$t('api_test.definition.request.batch_edit'), handleClick: this.handleEditBatch}
],
methodColorMap: new Map(API_METHOD_COLOUR),
tableData: [],
currentPage: 1,
@ -267,6 +269,9 @@
});
}
},
handleEditBatch() {
this.$emit('handleEditBatch', this.selectRows);
},
handleTestCase(api) {
this.selectApi = api;
let request = JSON.parse(api.request);

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

@ -21,7 +21,7 @@
<el-tab-pane :label="$t('api_test.definition.request.query_param')" name="parameters">
<el-tooltip class="item-tabs" effect="dark" :content="$t('api_test.definition.request.query_info')" placement="top-start" slot="label">
<span>{{$t('api_test.definition.request.query_param')}}
<div class="el-step__icon is-text ms-api-col ms-query" v-if="request.arguments.length>1">
<div class="el-step__icon is-text ms-api-col ms-header" v-if="request.arguments.length>1">
<div class="el-step__icon-inner">{{request.arguments.length-1}}</div>
</div></span>
</el-tooltip>
@ -34,7 +34,7 @@
<el-tooltip class="item-tabs" effect="dark" :content="$t('api_test.definition.request.rest_info')" placement="top-start" slot="label">
<span>
{{$t('api_test.definition.request.rest_param')}}
<div class="el-step__icon is-text ms-api-col ms-query" v-if="request.rest.length>1">
<div class="el-step__icon is-text ms-api-col ms-header" v-if="request.rest.length>1">
<div class="el-step__icon-inner">{{request.rest.length-1}}</div>
</div>
</span>

13
frontend/src/business/components/api/definition/components/runtest/RunTestDubboPage.vue
View File

@ -29,12 +29,9 @@
</el-card>
<!-- 加载用例 -->
<el-drawer :visible.sync="visible" direction="btt" :with-header="false" :modal="false" size="50%">
<ms-api-case-list @apiCaseClose="apiCaseClose" @selectTestCase="selectTestCase" :currentApi="api"
:loaded="loaded" :refreshSign="refreshSign" :createCase="createCase"
ref="caseList"/>
</el-drawer>
>
<ms-api-case-list @apiCaseClose="apiCaseClose" @selectTestCase="selectTestCase" :currentApi="api"
:loaded="loaded" :refreshSign="refreshSign" :createCase="createCase"
ref="caseList"/>
<!-- 环境 -->
<api-environment-config ref="environmentConfig" @close="environmentConfigClose"/>
@ -125,7 +122,7 @@
},
loadCase() {
this.refreshSign = getUUID();
this.loaded = true;
this.$refs.caseList.open();
this.visible = true;
},
apiCaseClose() {
@ -155,7 +152,7 @@
saveAsCase() {
//用于触发创建操作
this.createCase = getUUID();
this.visible = true;
this.$refs.caseList.open();
this.loaded = false;
},
saveAsApi() {

15
frontend/src/business/components/api/definition/components/runtest/RunTestHTTPPage.vue
View File

@ -70,12 +70,12 @@
</el-card>
<!-- 加载用例 -->
<ms-api-case-list @selectTestCase="selectTestCase"
:loaded="loaded"
:refreshSign="refreshSign"
:createCase="createCase"
:currentApi="api"
ref="caseList"/>
<ms-api-case-list @selectTestCase="selectTestCase"
:loaded="loaded"
:refreshSign="refreshSign"
:createCase="createCase"
:currentApi="api"
ref="caseList"/>
<!-- 环境 -->
<api-environment-config ref="environmentConfig" @close="environmentConfigClose"/>
@ -169,7 +169,6 @@
loadCase() {
this.refreshSign = getUUID();
this.loaded = true;
// this.visible = true;
this.$refs.caseList.open();
},
apiCaseClose() {
@ -199,7 +198,7 @@
saveAsCase() {
//用于触发创建操作
this.createCase = getUUID();
this.visible = true;
this.$refs.caseList.open();
this.loaded = false;
},
saveAsApi() {

13
frontend/src/business/components/api/definition/components/runtest/RunTestSQLPage.vue
View File

@ -28,12 +28,9 @@
</el-card>
<!-- 加载用例 -->
<el-drawer :visible.sync="visible" direction="btt" :with-header="false" :modal="false" size="50%">
<ms-api-case-list @apiCaseClose="apiCaseClose" @selectTestCase="selectTestCase" :currentApi="api" :refreshSign="refreshSign"
:loaded="loaded" :createCase="createCase"
ref="caseList"/>
</el-drawer>
>
<ms-api-case-list @apiCaseClose="apiCaseClose" @selectTestCase="selectTestCase" :currentApi="api" :refreshSign="refreshSign"
:loaded="loaded" :createCase="createCase"
ref="caseList"/>
<!-- 环境 -->
<api-environment-config ref="environmentConfig" @close="environmentConfigClose"/>
@ -124,7 +121,7 @@
},
loadCase() {
this.refreshSign = getUUID();
this.loaded = true;
this.$refs.caseList.open();
this.visible = true;
},
apiCaseClose() {
@ -153,7 +150,7 @@
},
saveAsCase() {
this.createCase = getUUID();
this.visible = true;
this.$refs.caseList.open();
this.loaded = false;
},
saveAsApi() {

12
frontend/src/business/components/api/definition/components/runtest/RunTestTCPPage.vue
View File

@ -29,11 +29,9 @@
</el-card>
<!-- 加载用例 -->
<el-drawer :visible.sync="visible" direction="btt" :with-header="false" :modal="false" size="50%">
<ms-api-case-list @apiCaseClose="apiCaseClose" @selectTestCase="selectTestCase" :currentApi="api" :refreshSign="refreshSign"
:loaded="loaded" :createCase="createCase"
ref="caseList"/>
</el-drawer>
<ms-api-case-list @apiCaseClose="apiCaseClose" @selectTestCase="selectTestCase" :currentApi="api" :refreshSign="refreshSign"
:loaded="loaded" :createCase="createCase"
ref="caseList"/>
<!-- 环境 -->
<api-environment-config ref="environmentConfig" @close="environmentConfigClose"/>
<!-- 执行组件 -->
@ -123,7 +121,7 @@
},
loadCase() {
this.refreshSign = getUUID();
this.loaded = true;
this.$refs.caseList.open();
this.visible = true;
},
apiCaseClose() {
@ -152,7 +150,7 @@
},
saveAsCase() {
this.createCase = getUUID();
this.visible = true;
this.$refs.caseList.open();
this.loaded = false;
},
saveAsApi() {

1
frontend/src/i18n/en-US.js
View File

@ -536,6 +536,7 @@ export default {
test_plan_select: "Please select test plan",
create_info: 'Create',
update_info: 'Update',
batch_edit: "Batch edit",
}
},
automation: {

1
frontend/src/i18n/zh-CN.js
View File

@ -535,6 +535,7 @@ export default {
test_plan_select: "请选择测试计划",
create_info: '创建',
update_info: '更新',
batch_edit: "批量编辑",
}
},
automation: {

1
frontend/src/i18n/zh-TW.js
View File

@ -535,6 +535,7 @@ export default {
test_plan_select: "請選擇測試計劃",
create_info: '創建',
update_info: '更新',
batch_edit: "批量編輯",
}
},
automation: {