refactor: 从接口列表导入支持翻页多选
This commit is contained in:
parent
8589eeb47b
commit
5938bc747f
|
@ -86,6 +86,12 @@
|
|||
this.$refs.relevanceDialog.close();
|
||||
},
|
||||
open() {
|
||||
if (this.$refs.apiList) {
|
||||
this.$refs.apiList.clearSelection();
|
||||
}
|
||||
if (this.$refs.apiCaseList) {
|
||||
this.$refs.apiCaseList.clearSelection();
|
||||
}
|
||||
this.$refs.relevanceDialog.open();
|
||||
},
|
||||
isApiListEnableChange(data) {
|
||||
|
|
|
@ -1,75 +1,78 @@
|
|||
<template>
|
||||
<api-list-container
|
||||
:is-api-list-enable="isApiListEnable"
|
||||
@isApiListEnableChange="isApiListEnableChange">
|
||||
<div>
|
||||
<api-list-container
|
||||
:is-api-list-enable="isApiListEnable"
|
||||
@isApiListEnableChange="isApiListEnableChange">
|
||||
|
||||
<ms-environment-select :project-id="projectId" v-if="isTestPlan" :is-read-only="isReadOnly" @setEnvironment="setEnvironment"/>
|
||||
<ms-environment-select :project-id="projectId" v-if="isTestPlan" :is-read-only="isReadOnly" @setEnvironment="setEnvironment"/>
|
||||
|
||||
<el-input placeholder="搜索" @blur="initTable" class="search-input" size="small" @keyup.enter.native="initTable" v-model="condition.name"/>
|
||||
<el-input placeholder="搜索" @blur="initTable" class="search-input" size="small" @keyup.enter.native="initTable" v-model="condition.name"/>
|
||||
|
||||
<el-table v-loading="result.loading"
|
||||
border
|
||||
:data="tableData" row-key="id" class="test-content adjust-table"
|
||||
@select-all="handleSelectAll"
|
||||
@select="handleSelect" ref="table">
|
||||
<el-table-column reserve-selection type="selection"/>
|
||||
|
||||
<el-table v-loading="result.loading"
|
||||
border
|
||||
:data="tableData" row-key="id" class="test-content adjust-table"
|
||||
@select-all="handleSelectAll"
|
||||
@select="handleSelect">
|
||||
<el-table-column type="selection"/>
|
||||
<el-table-column prop="name" :label="$t('api_test.definition.api_name')" show-overflow-tooltip/>
|
||||
|
||||
<el-table-column prop="name" :label="$t('api_test.definition.api_name')" show-overflow-tooltip/>
|
||||
<el-table-column
|
||||
prop="status"
|
||||
column-key="api_status"
|
||||
:label="$t('api_test.definition.api_status')"
|
||||
show-overflow-tooltip>
|
||||
<template v-slot:default="scope">
|
||||
<ms-tag v-if="scope.row.status == 'Prepare'" type="info" effect="plain" :content="$t('test_track.plan.plan_status_prepare')"/>
|
||||
<ms-tag v-if="scope.row.status == 'Underway'" type="warning" effect="plain" :content="$t('test_track.plan.plan_status_running')"/>
|
||||
<ms-tag v-if="scope.row.status == 'Completed'" type="success" effect="plain" :content="$t('test_track.plan.plan_status_completed')"/>
|
||||
<ms-tag v-if="scope.row.status == 'Trash'" type="danger" effect="plain" content="废弃"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
prop="status"
|
||||
column-key="api_status"
|
||||
:label="$t('api_test.definition.api_status')"
|
||||
show-overflow-tooltip>
|
||||
<template v-slot:default="scope">
|
||||
<ms-tag v-if="scope.row.status == 'Prepare'" type="info" effect="plain" :content="$t('test_track.plan.plan_status_prepare')"/>
|
||||
<ms-tag v-if="scope.row.status == 'Underway'" type="warning" effect="plain" :content="$t('test_track.plan.plan_status_running')"/>
|
||||
<ms-tag v-if="scope.row.status == 'Completed'" type="success" effect="plain" :content="$t('test_track.plan.plan_status_completed')"/>
|
||||
<ms-tag v-if="scope.row.status == 'Trash'" type="danger" effect="plain" content="废弃"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="method"
|
||||
:label="$t('api_test.definition.api_type')"
|
||||
show-overflow-tooltip>
|
||||
<template v-slot:default="scope" class="request-method">
|
||||
<el-tag size="mini" :style="{'background-color': getColor(scope.row.method), border: getColor(true, scope.row.method)}" class="api-el-tag">
|
||||
{{ scope.row.method }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
prop="method"
|
||||
:label="$t('api_test.definition.api_type')"
|
||||
show-overflow-tooltip>
|
||||
<template v-slot:default="scope" class="request-method">
|
||||
<el-tag size="mini" :style="{'background-color': getColor(scope.row.method), border: getColor(true, scope.row.method)}" class="api-el-tag">
|
||||
{{ scope.row.method }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="path"
|
||||
:label="$t('api_test.definition.api_path')"
|
||||
show-overflow-tooltip/>
|
||||
|
||||
<el-table-column
|
||||
prop="path"
|
||||
:label="$t('api_test.definition.api_path')"
|
||||
show-overflow-tooltip/>
|
||||
<el-table-column width="160" :label="$t('api_test.definition.api_last_time')" prop="updateTime">
|
||||
<template v-slot:default="scope">
|
||||
<span>{{ scope.row.updateTime | timestampFormatDate }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column width="160" :label="$t('api_test.definition.api_last_time')" prop="updateTime">
|
||||
<template v-slot:default="scope">
|
||||
<span>{{ scope.row.updateTime | timestampFormatDate }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="caseTotal"
|
||||
:label="$t('api_test.definition.api_case_number')"
|
||||
show-overflow-tooltip/>
|
||||
|
||||
<el-table-column
|
||||
prop="caseTotal"
|
||||
:label="$t('api_test.definition.api_case_number')"
|
||||
show-overflow-tooltip/>
|
||||
<el-table-column
|
||||
prop="caseStatus"
|
||||
:label="$t('api_test.definition.api_case_status')"
|
||||
show-overflow-tooltip/>
|
||||
|
||||
<el-table-column
|
||||
prop="caseStatus"
|
||||
:label="$t('api_test.definition.api_case_status')"
|
||||
show-overflow-tooltip/>
|
||||
<el-table-column
|
||||
prop="casePassingRate"
|
||||
:label="$t('api_test.definition.api_case_passing_rate')"
|
||||
show-overflow-tooltip/>
|
||||
</el-table>
|
||||
<ms-table-pagination :change="initTable" :current-page.sync="currentPage" :page-size.sync="pageSize"
|
||||
:total="total"/>
|
||||
</api-list-container>
|
||||
<table-select-count-bar :count="selectRows.size"/>
|
||||
</div>
|
||||
|
||||
<el-table-column
|
||||
prop="casePassingRate"
|
||||
:label="$t('api_test.definition.api_case_passing_rate')"
|
||||
show-overflow-tooltip/>
|
||||
</el-table>
|
||||
<ms-table-pagination :change="initTable" :current-page.sync="currentPage" :page-size.sync="pageSize"
|
||||
:total="total"/>
|
||||
</api-list-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
@ -88,10 +91,12 @@ import PriorityTableItem from "../../../../track/common/tableItems/planview/Prio
|
|||
import {_filter, _sort} from "../../../../../../common/js/utils";
|
||||
import {_handleSelect, _handleSelectAll} from "../../../../../../common/js/tableUtils";
|
||||
import MsEnvironmentSelect from "../../../definition/components/case/MsEnvironmentSelect";
|
||||
import TableSelectCountBar from "./TableSelectCountBar";
|
||||
|
||||
export default {
|
||||
name: "RelevanceApiList",
|
||||
components: {
|
||||
TableSelectCountBar,
|
||||
MsEnvironmentSelect,
|
||||
PriorityTableItem,
|
||||
ApiListContainer,
|
||||
|
@ -155,6 +160,7 @@ export default {
|
|||
isTestPlan: Boolean
|
||||
},
|
||||
created: function () {
|
||||
this.selectRows = new Set();
|
||||
this.initTable();
|
||||
},
|
||||
watch: {
|
||||
|
@ -174,7 +180,6 @@ export default {
|
|||
this.$emit('isApiListEnableChange', data);
|
||||
},
|
||||
initTable() {
|
||||
this.selectRows = new Set();
|
||||
this.condition.filters = {status: ["Prepare", "Underway", "Completed"]};
|
||||
this.condition.moduleIds = this.selectNodeIds;
|
||||
if (this.trashEnable) {
|
||||
|
@ -230,6 +235,12 @@ export default {
|
|||
},
|
||||
setEnvironment(data) {
|
||||
this.environmentId = data.id;
|
||||
},
|
||||
clearSelection() {
|
||||
this.selectRows = new Set();
|
||||
if (this.$refs.table) {
|
||||
this.$refs.table.clearSelection();
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
|
|
|
@ -10,12 +10,14 @@
|
|||
|
||||
<el-table v-loading="result.loading"
|
||||
border
|
||||
:data="tableData" row-key="id" class="test-content adjust-table"
|
||||
:data="tableData"
|
||||
row-key="id"
|
||||
class="test-content adjust-table"
|
||||
@select-all="handleSelectAll"
|
||||
@filter-change="filter"
|
||||
@sort-change="sort"
|
||||
@select="handleSelect">
|
||||
<el-table-column type="selection"/>
|
||||
@select="handleSelect" ref="table">
|
||||
<el-table-column reserve-selection type="selection"/>
|
||||
|
||||
<el-table-column prop="name" :label="$t('api_test.definition.api_name')" show-overflow-tooltip/>
|
||||
|
||||
|
@ -55,6 +57,8 @@
|
|||
:total="total"/>
|
||||
</api-list-container>
|
||||
|
||||
<table-select-count-bar :count="selectRows.size"/>
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
@ -76,10 +80,12 @@
|
|||
import {_filter, _sort} from "../../../../../../common/js/utils";
|
||||
import {_handleSelect, _handleSelectAll} from "../../../../../../common/js/tableUtils";
|
||||
import MsEnvironmentSelect from "../../../definition/components/case/MsEnvironmentSelect";
|
||||
import TableSelectCountBar from "./TableSelectCountBar";
|
||||
|
||||
export default {
|
||||
name: "RelevanceCaseList",
|
||||
components: {
|
||||
TableSelectCountBar,
|
||||
MsEnvironmentSelect,
|
||||
PriorityTableItem,
|
||||
ApiListContainer,
|
||||
|
@ -154,16 +160,12 @@
|
|||
projectId() {
|
||||
this.initTable();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
isApiListEnableChange(data) {
|
||||
this.$emit('isApiListEnableChange', data);
|
||||
},
|
||||
initTable() {
|
||||
this.selectRows = new Set();
|
||||
this.condition.status = "";
|
||||
this.condition.moduleIds = this.selectNodeIds;
|
||||
if (this.projectId != null) {
|
||||
|
@ -231,6 +233,12 @@
|
|||
},
|
||||
setEnvironment(data) {
|
||||
this.environmentId = data.id;
|
||||
},
|
||||
clearSelection() {
|
||||
this.selectRows = new Set();
|
||||
if (this.$refs.table) {
|
||||
this.$refs.table.clearSelection();
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
|
|
|
@ -0,0 +1,23 @@
|
|||
<template>
|
||||
<div v-if="count && count > 0" class="content">
|
||||
{{$t('commons.table.select_tip', [this.count])}}
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "TableSelectCountBar",
|
||||
props: ['count']
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
.content {
|
||||
text-align: center;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
</style>
|
|
@ -127,6 +127,9 @@ export default {
|
|||
validate: "Validate",
|
||||
batch_add: "Batch add",
|
||||
check_project_tip: "Create or select the project first",
|
||||
table: {
|
||||
select_tip: "Item {0} data is selected"
|
||||
},
|
||||
date: {
|
||||
select_date: 'Select date',
|
||||
start_date: 'Start date',
|
||||
|
|
|
@ -127,6 +127,9 @@ export default {
|
|||
validate: "校验",
|
||||
batch_add: "批量添加",
|
||||
check_project_tip: "请先创建或选择项目",
|
||||
table: {
|
||||
select_tip: "已选中 {0} 条数据"
|
||||
},
|
||||
date: {
|
||||
select_date: '选择日期',
|
||||
start_date: '开始日期',
|
||||
|
|
|
@ -127,6 +127,9 @@ export default {
|
|||
validate: "校驗",
|
||||
batch_add: "批量添加",
|
||||
check_project_tip: "請先創建或選擇項目",
|
||||
table: {
|
||||
select_tip: "已选中 {0} 条数据"
|
||||
},
|
||||
date: {
|
||||
select_date: '選擇日期',
|
||||
start_date: '開始日期',
|
||||
|
|
Loading…
Reference in New Issue