refactor(接口场景): 场景导入场景的组件分离

This commit is contained in:
CaptainB 2022-04-12 11:57:50 +08:00 committed by 刘瑞斌
parent 5998c14bfe
commit 1a850984a3
3 changed files with 300 additions and 22 deletions

View File

@ -0,0 +1,277 @@
<template>
<div>
<el-input :placeholder="$t('api_test.definition.request.select_case')" @blur="search"
@keyup.enter.native="search" class="search-input" size="small" v-model="condition.name"/>
<ms-table-adv-search-bar :condition.sync="condition" class="adv-search-bar"
v-if="condition.components !== undefined && condition.components.length > 0"
@search="search"/>
<version-select v-xpack :project-id="projectId" @changeVersion="changeVersion"
style="float: left"
class="search-input"/>
<ms-table ref="scenarioTable"
v-loading="result.loading"
:data="tableData"
:condition="condition"
:page-size="pageSize"
:total="total"
:remember-order="true"
row-key="id"
:row-order-group-id="projectId"
@refresh="search"
:disable-header-config="true"
@selectCountChange="selectCountChange">
<el-table-column v-if="!customNum" prop="num" label="ID"
show-overflow-tooltip>
</el-table-column>
<el-table-column v-if="customNum" prop="customNum" label="ID"
show-overflow-tooltip>
</el-table-column>
<el-table-column prop="name" :label="$t('api_test.automation.scenario_name')"
show-overflow-tooltip/>
<el-table-column
v-if="versionEnable"
column-key="version_id"
:filters="versionFilters"
:label="$t('commons.version')"
min-width="120px">
<template v-slot:default="scope">
<span>{{ scope.row.versionName }}</span>
</template>
</el-table-column>
<el-table-column prop="level" :label="$t('api_test.automation.case_level')"
show-overflow-tooltip>
<template v-slot:default="scope">
<priority-table-item :value="scope.row.level" ref="level"/>
</template>
</el-table-column>
<el-table-column prop="tagNames" :label="$t('api_test.automation.tag')" min-width="120">
<template v-slot:default="scope">
<ms-tag v-for="itemName in scope.row.tags" :key="itemName" type="success" effect="plain" :content="itemName"
style="margin-left: 0px; margin-right: 2px"/>
</template>
</el-table-column>
<el-table-column prop="userId" :label="$t('api_test.automation.creator')" show-overflow-tooltip/>
<el-table-column prop="updateTime" :label="$t('api_test.automation.update_time')" width="180">
<template v-slot:default="scope">
<span>{{ scope.row.updateTime | timestampFormatDate }}</span>
</template>
</el-table-column>
<el-table-column prop="stepTotal" :label="$t('api_test.automation.step')" show-overflow-tooltip/>
<el-table-column prop="lastResult" :label="$t('api_test.automation.last_result')">
<template v-slot:default="{row}">
<el-link type="success" @click="showReport(row)" v-if="row.lastResult === 'Success'">
{{ $t('api_test.automation.success') }}
</el-link>
<el-link type="danger" @click="showReport(row)" v-if="row.lastResult === 'Fail'">
{{ $t('api_test.automation.fail') }}
</el-link>
</template>
</el-table-column>
<el-table-column prop="passRate" :label="$t('api_test.automation.passing_rate')"
show-overflow-tooltip/>
</ms-table>
<ms-table-pagination :change="search" :current-page.sync="currentPage" :page-size.sync="pageSize"
:total="total"/>
</div>
</template>
<script>
import MsTableHeader from "@/business/components/common/components/MsTableHeader";
import MsTablePagination from "@/business/components/common/pagination/TablePagination";
import ShowMoreBtn from "@/business/components/track/case/components/ShowMoreBtn";
import MsApiReportDetail from "@/business/components/api/automation/report/ApiReportDetail";
import MsTableMoreBtn from "@/business/components/api/automation/scenario/TableMoreBtn";
import PriorityTableItem from "@/business/components/track/common/tableItems/planview/PriorityTableItem";
import MsTableAdvSearchBar from "@/business/components/common/components/search/MsTableAdvSearchBar";
import {
API_SCENARIO_CONFIGS,
TEST_PLAN_RELEVANCE_API_SCENARIO_CONFIGS
} from "@/business/components/common/components/search/search-components";
import {ENV_TYPE} from "@/common/js/constants";
import {getCurrentProjectID, hasLicense} from "@/common/js/utils";
import MsTable from "@/business/components/common/components/table/MsTable";
import MsTag from "@/business/components/common/components/MsTag";
const requireComponent = require.context('@/business/components/xpack/', true, /\.vue$/);
const VersionSelect = requireComponent.keys().length > 0 ? requireComponent("./version/VersionSelect.vue") : {};
export default {
name: "RelevanceScenarioList",
components: {
MsTable,
PriorityTableItem,
MsTablePagination,
MsTableMoreBtn,
ShowMoreBtn,
MsTableHeader,
MsTag,
MsApiReportDetail,
MsTableAdvSearchBar,
'VersionSelect': VersionSelect.default,
},
props: {
referenced: {
type: Boolean,
default: false,
},
selectNodeIds: Array,
projectId: String,
planId: String,
versionEnable: Boolean,
},
data() {
return {
result: {},
showConfigButtonWithOutPermission: false,
condition: {
components: API_SCENARIO_CONFIGS
},
currentScenario: {},
schedule: {},
selectAll: false,
tableData: [],
currentPage: 1,
pageSize: 10,
total: 0,
reportId: "",
infoDb: false,
selectRows: new Set(),
projectEnvMap: new Map(),
projectList: [],
projectIds: new Set(),
map: new Map(),
customNum: false,
environmentType: ENV_TYPE.JSON,
envGroupId: "",
versionFilters: [],
};
},
computed: {
ENV_TYPE() {
return ENV_TYPE;
}
},
watch: {
selectNodeIds() {
this.search();
},
projectId() {
this.search();
},
},
created() {
this.getWsProjects();
this.getVersionOptions();
},
methods: {
search() {
this.selectRows = new Set();
this.condition.moduleIds = this.selectNodeIds;
if (this.trashEnable) {
this.condition.filters = {status: ["Trash"]};
this.condition.moduleIds = [];
}
if (this.projectId != null && typeof projectId === 'string') {
this.condition.projectId = this.projectId;
} else if (this.projectId != null) {
this.condition.projectId = this.projectId;
}
let url = "/api/automation/list/" + this.currentPage + "/" + this.pageSize;
if (this.condition.projectId) {
this.result = this.$post(url, this.condition, response => {
let data = response.data;
this.total = data.itemCount;
this.tableData = data.listObject;
this.tableData.forEach(item => {
if (item.tags && item.tags.length > 0) {
item.tags = JSON.parse(item.tags);
}
});
});
}
},
clear() {
this.selectRows.clear();
},
setProjectEnvMap(projectEnvMap) {
this.projectEnvMap = projectEnvMap;
},
setEnvGroup(id) {
this.envGroupId = id;
},
getWsProjects() {
this.$get("/project/getOwnerProjects", res => {
this.projectList = res.data;
});
},
getProject(projectId) {
if (projectId) {
this.$get('/project_application/get/config/' + projectId + "/SCENARIO_CUSTOM_NUM", result => {
let data = result.data;
if (data) {
this.customNum = data.scenarioCustomNum;
}
});
}
},
getConditions() {
return this.condition;
},
checkEnv() {
return this.$refs.envPopover.checkEnv();
},
changeVersion(currentVersion) {
this.condition.versionId = currentVersion || null;
this.search();
},
getVersionOptions() {
if (hasLicense()) {
this.$get('/project/version/get-project-versions/' + getCurrentProjectID(), response => {
this.versionFilters = response.data.map(u => {
return {text: u.name, value: u.id};
});
});
}
},
filter(field) {
this.condition.filters = field || null;
this.search();
},
selectCountChange(data) {
this.selectRows = this.$refs.scenarioTable.selectRows;
this.$emit("selectCountChange", data);
}
}
};
</script>
<style scoped>
/deep/ .el-drawer__header {
margin-bottom: 0px;
}
.env-popover {
float: right;
margin-top: 10px;
}
.search-input {
float: right;
width: 250px;
margin-top: 10px;
margin-bottom: 20px;
margin-right: 20px;
}
.adv-search-bar {
float: right;
margin-top: 15px;
margin-right: 10px;
}
</style>

View File

@ -15,23 +15,19 @@
ref="nodeTree"/>
</template>
<ms-api-scenario-list
v-if="versionEnable"
<relevance-scenario-list
:version-enable="versionEnable"
:select-node-ids="selectNodeIds"
:select-project-id="projectId"
:project-id="projectId"
:referenced="true"
:trash-enable="false"
:is-reference-table="true"
@selection="setData"
:is-relate="true"
:custom-num="customNum"
@selectCountChange="setSelectCounts"
ref="apiScenarioList">
<template v-slot:version>
<version-select v-xpack :project-id="projectId" @changeVersion="changeVersion"/>
</template>
</ms-api-scenario-list>
</relevance-scenario-list>
<template v-slot:headerBtn>
<table-select-count-bar :count="selectCounts" style="float: left; margin: 5px;"/>
<el-button type="primary" @click="copy" :loading="buttonIsWorking" @keydown.enter.native.prevent size="mini">
{{ $t('commons.copy') }}
</el-button>
@ -47,29 +43,28 @@ import MsContainer from "../../../../common/components/MsContainer";
import MsAsideContainer from "../../../../common/components/MsAsideContainer";
import MsMainContainer from "../../../../common/components/MsMainContainer";
import MsApiScenarioModule from "../ApiScenarioModule";
import MsApiScenarioList from "../ApiScenarioList";
import {getUUID, hasLicense} from "@/common/js/utils";
import RelevanceDialog from "../../../../track/plan/view/comonents/base/RelevanceDialog";
import RelevanceScenarioList from "./RelevanceScenarioList";
import TestCaseRelevanceBase from "@/business/components/track/plan/view/comonents/base/TestCaseRelevanceBase";
import TableSelectCountBar from "@/business/components/api/automation/scenario/api/TableSelectCountBar";
const requireComponent = require.context('@/business/components/xpack/', true, /\.vue$/);
const VersionSelect = requireComponent.keys().length > 0 ? requireComponent("./version/VersionSelect.vue") : {};
export default {
name: "ScenarioRelevance",
props:{
isAcrossSpace:{
type:Boolean,
props: {
isAcrossSpace: {
type: Boolean,
default() {
return false;
}
}
},
components: {
'VersionSelect': VersionSelect.default,
TableSelectCountBar,
TestCaseRelevanceBase,
RelevanceScenarioList,
RelevanceDialog,
MsApiScenarioList,
MsApiScenarioModule,
MsMainContainer, MsAsideContainer, MsContainer
},
@ -88,6 +83,7 @@ export default {
versionOptions: [],
currentVersion: '',
versionEnable: true,
selectCounts: null,
};
},
watch: {
@ -151,7 +147,7 @@ export default {
}
this.result = this.$post("/api/automation/getApiScenarios/", this.currentScenarioIds, response => {
if (response.data) {
this.createScenarioDefinition(scenarios, response.data, referenced)
this.createScenarioDefinition(scenarios, response.data, referenced);
this.$emit('save', scenarios);
this.$refs.baseRelevance.close();
this.buttonIsWorking = false;
@ -170,7 +166,7 @@ export default {
}
this.result = this.$post("/api/automation/getApiScenarios/", this.currentScenarioIds, response => {
if (response.data) {
this.createScenarioDefinition(scenarios, response.data, referenced)
this.createScenarioDefinition(scenarios, response.data, referenced);
this.$emit('save', scenarios);
this.$refs.baseRelevance.close();
this.buttonIsWorking = false;
@ -193,6 +189,7 @@ export default {
},
open() {
this.buttonIsWorking = false;
this.selectCounts = 0;
this.$refs.baseRelevance.open();
if (this.$refs.apiScenarioList) {
this.$refs.apiScenarioList.search(this.projectId);
@ -247,6 +244,10 @@ export default {
});
}
},
setSelectCounts(data) {
this.selectCounts = data;
this.setData(this.$refs.apiScenarioList.selectRows);
}
}
};
</script>

View File

@ -17,7 +17,7 @@
<ms-table-adv-search-bar :condition.sync="condition" class="adv-search-bar"
v-if="condition.components !== undefined && condition.components.length > 0"
@search="search"/>
<version-select v-xpack :project-id="projectId" @changeVersion="changeVersion" margin-right="20"
<version-select v-xpack :project-id="projectId" @changeVersion="changeVersion" style="float: left;"
class="search-input"/>
<ms-table ref="scenarioTable"