优化测试详情编辑页面

This commit is contained in:
chenjianxing 2020-04-08 18:51:31 +08:00
parent b64fa89e0c
commit bcc2b7ea90
5 changed files with 145 additions and 118 deletions

View File

@ -21,8 +21,8 @@
</select> </select>
<select id="getTestPlanTestCases" resultType="io.metersphere.dto.TestPlanCaseDTO"> <select id="getTestPlanTestCases" resultType="io.metersphere.dto.TestPlanCaseDTO">
select t1.id as id, t1.plan_id as planId, t1.executor as executor, t1.status as status, t1.results as results, t1.remark remard, t1.create_time as createTime, t1.update_time updateTime, select t1.id as id, t1.plan_id as planId, t1.executor as executor, t1.status as status, t1.results as results, t1.create_time as createTime, t1.update_time updateTime,
t2.id as caseId, t2.node_id as nodeId, t2.node_path as nodePath, t2.project_id as projectId, t2.name as name, t2.id as caseId, t2.node_id as nodeId, t2.node_path as nodePath, t2.project_id as projectId, t2.name as name, t2.remark remark, t2.steps steps,
t2.type as type, t2.maintainer as maintainer, t2.priority as priority, t2.method as method, t2.prerequisite as prerequisite t2.type as type, t2.maintainer as maintainer, t2.priority as priority, t2.method as method, t2.prerequisite as prerequisite
from test_plan_test_case as t1 from test_plan_test_case as t1
inner join test_case as t2 on inner join test_case as t2 on

View File

@ -1,13 +1,13 @@
package io.metersphere.dto; package io.metersphere.dto;
import io.metersphere.base.domain.TestCase; import io.metersphere.base.domain.TestCase;
import io.metersphere.base.domain.TestCaseWithBLOBs;
public class TestPlanCaseDTO extends TestCase { public class TestPlanCaseDTO extends TestCaseWithBLOBs {
private String executor; private String executor;
private String status; private String status;
private String results; private String results;
private String remark;
public String getExecutor() { public String getExecutor() {
return executor; return executor;
@ -32,12 +32,4 @@ public class TestPlanCaseDTO extends TestCase {
public void setResults(String results) { public void setResults(String results) {
this.results = results; this.results = results;
} }
public String getRemark() {
return remark;
}
public void setRemark(String remark) {
this.remark = remark;
}
} }

View File

@ -86,6 +86,16 @@
let item = {}; let item = {};
Object.assign(item, testCase); Object.assign(item, testCase);
item.results = JSON.parse(item.results); item.results = JSON.parse(item.results);
item.steps = JSON.parse(item.steps);
item.steptResults = [];
for (let i = 0; i < item.steps.length; i++){
if(item.results[i]){
item.steps[i].actualResult = item.results[i].actualResult;
item.steps[i].executeResult = item.results[i].executeResult;
}
item.steptResults.push(item.steps[i]);
}
this.$refs.testPlanTestCaseEdit.testCase = item; this.$refs.testPlanTestCaseEdit.testCase = item;
this.$refs.testPlanTestCaseEdit.dialog = true; this.$refs.testPlanTestCaseEdit.dialog = true;
} }

View File

@ -237,4 +237,8 @@
margin-right: -9px; margin-right: -9px;
float: right; float: right;
} }
.el-table {
cursor:pointer;
}
</style> </style>

View File

@ -8,115 +8,127 @@
size="100%" size="100%"
ref="drawer"> ref="drawer">
<div> <div class="case_container">
<el-row >
<el-col :span="4" :offset="1">
<span class="cast_label">{{$t('test_track.priority')}}</span>
<span class="cast_item">{{testCase.priority}}</span>
</el-col>
<el-col :span="5">
<span class="cast_label">{{$t('test_track.case_type')}}</span>
<span class="cast_item" v-if="testCase.type == 'functional'">{{$t('test_track.functional_test')}}</span>
<span class="cast_item" v-if="testCase.type == 'performance'">{{$t('commons.performance')}}</span>
<span class="cast_item" v-if="testCase.type == 'api'">{{$t('commons.api')}}</span>
</el-col>
</el-row>
<el-row > <el-row>
<el-col :span="4" :offset="1"> <el-col :span="4" :offset="1">
<span class="cast_label">{{$t('test_track.priority')}}</span> <span class="cast_label">{{$t('test_track.method')}}</span>
<span class="cast_item">{{testCase.priority}}</span> <span v-if="testCase.method == 'manual'">{{$t('test_track.manual')}}</span>
</el-col> <span v-if="testCase.method == 'auto'">{{$t('test_track.auto')}}</span>
<el-col :span="5"> </el-col>
<span class="cast_label">{{$t('test_track.case_type')}}</span> <el-col :span="5">
<span class="cast_item" v-if="testCase.type == 'functional'">{{$t('test_track.functional_test')}}</span> <span class="cast_label">{{$t('test_track.module')}}</span>
<span class="cast_item" v-if="testCase.type == 'performance'">{{$t('commons.performance')}}</span> <span class="cast_item">{{testCase.nodePath}}</span>
<span class="cast_item" v-if="testCase.type == 'api'">{{$t('commons.api')}}</span> </el-col>
</el-col> </el-row>
</el-row>
<el-row> <el-row>
<el-col :span="4" :offset="1"> <el-col :span="20" :offset="1">
<span class="cast_label">{{$t('test_track.method')}}</span> <el-table
<span v-if="testCase.method == 'manual'">{{$t('test_track.manual')}}</span> :data="testCase.steptResults"
<span v-if="testCase.method == 'auto'">{{$t('test_track.auto')}}</span> class="tb-edit"
</el-col> size="mini"
<el-col :span="5"> height="200px"
<span class="cast_label">{{$t('test_track.module')}}</span> :default-sort = "{prop: 'num', order: 'ascending'}"
<span class="cast_item">{{testCase.nodePath}}</span> highlight-current-row>
</el-col> <el-table-column :label="$t('test_track.number')" prop="num" min-width="5%"></el-table-column>
</el-row> <el-table-column :label="$t('test_track.step_desc')" prop="desc" min-width="29%">
<template v-slot:default="scope">
<el-row> <span>{{scope.row.desc}}</span>
<el-col :offset="1" :span="2"> </template>
<el-button type="success" round </el-table-column>
:icon="testCase.status == 'Pass' ? 'el-icon-check' : ''" <el-table-column :label="$t('test_track.expected_results')" prop="result" min-width="28%">
@click="setTestCaseStatus('Pass')"> {{$t('test_track.pass')}}</el-button> <template v-slot:default="scope">
</el-col> <span>{{scope.row.result}}</span>
<el-col :span="2"> </template>
<el-button type="danger" round </el-table-column>
:icon="testCase.status == 'Failure' ? 'el-icon-check' : ''" <el-table-column :label="$t('test_track.actual_result')" min-width="29%">
@click="setTestCaseStatus('Failure')"> {{$t('test_track.failure')}}</el-button> <template v-slot:default="scope">
</el-col> <el-input
<el-col :span="2"> size="mini"
<el-button type="warning" round type="textarea"
:icon="testCase.status == 'Blocking' ? 'el-icon-check' : ''" :rows="2"
@click="setTestCaseStatus('Blocking')"> {{$t('test_track.blocking')}}</el-button> v-model="scope.row.actualResult"
</el-col> :placeholder="$t('commons.input_content')"
<el-col :span="2"> clearable></el-input>
<el-button type="info" round <span>{{scope.row.actualResult}}</span>
:icon="testCase.status == 'Skip' ? 'el-icon-check' : ''" </template>
@click="setTestCaseStatus('Skip')"> {{$t('test_track.skip')}}</el-button> </el-table-column>
</el-col> <el-table-column :label="$t('test_track.step_result')" min-width="9%">
</el-row> <template v-slot:default="scope">
<el-select
v-model="scope.row.executeResult"
<el-row> size="mini">
<el-col :span="20" :offset="1">
<el-table
:data="testCase.results"
class="tb-edit"
:default-sort = "{prop: 'num', order: 'ascending'}"
highlight-current-row>
<el-table-column :label="$t('test_track.number')" prop="num" min-width="8%"></el-table-column>
<el-table-column :label="$t('test_track.step_desc')" prop="desc" min-width="30%">
<template v-slot:default="scope">
<span>{{scope.row.desc}}</span>
</template>
</el-table-column>
<el-table-column :label="$t('test_track.expected_results')" prop="result" min-width="30%">
<template v-slot:default="scope">
<span>{{scope.row.result}}</span>
</template>
</el-table-column>
<el-table-column :label="$t('test_track.actual_result')" min-width="30%">
<template v-slot:default="scope">
<el-input
size="small"
v-model="scope.row.actualResult"
:placeholder="$t('commons.input_content')"
clearable></el-input>
<span>{{scope.row.actualResult}}</span>
</template>
</el-table-column>
<el-table-column :label="$t('test_track.step_result')" min-width="15%">
<template v-slot:default="scope">
<el-select v-model="scope.row.stepResult" :placeholder="$t('test_track.select_execute_result')">
<el-option :label="$t('test_track.pass')" value="Pass"></el-option> <el-option :label="$t('test_track.pass')" value="Pass"></el-option>
<el-option :label="$t('test_track.failure')" value="Failure"></el-option> <el-option :label="$t('test_track.failure')" value="Failure"></el-option>
<el-option :label="$t('test_track.blocking')" value="Blocking"></el-option> <el-option :label="$t('test_track.blocking')" value="Blocking"></el-option>
<el-option :label="$t('test_track.skip')" value="Skip"></el-option> <el-option :label="$t('test_track.skip')" value="Skip"></el-option>
</el-select> </el-select>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</el-col> </el-col>
</el-row> </el-row>
<el-row > <el-row >
<el-col :span="40" :offset="1"> <el-col :span="15" :offset="1">
<span>{{$t('commons.remark')}}</span> <div style="margin-bottom: 5px;">
<span>{{testCase.remark}}</span> <span class="cast_label">{{$t('commons.remark')}}</span>
<span v-if="testCase.remark == null" style="color: gainsboro">{{$t('commons.not_filled')}}</span> <span v-if="testCase.remark == null || testCase.remark == ''" style="color: darkgrey">{{$t('commons.not_filled')}}</span>
</el-col> </div>
</el-row> <div>
<el-input :rows="3"
type="textarea"
v-if="testCase.remark"
disabled
v-model="testCase.remark"></el-input>
</div>
</el-col>
</el-row>
<el-row type="flex" justify="end"> <el-row>
<el-col :span="5"> <el-col :offset="1" :span="2">
<div> <el-button type="success" round
<el-button @click="cancel">{{$t('test_track.cancel')}}</el-button> :icon="testCase.status == 'Pass' ? 'el-icon-check' : ''"
<el-button type="primary" @click="saveCase">{{$t('test_track.save')}}</el-button> @click="setTestCaseStatus('Pass')"> {{$t('test_track.pass')}}</el-button>
</div> </el-col>
</el-col> <el-col :span="2">
</el-row> <el-button type="danger" round
:icon="testCase.status == 'Failure' ? 'el-icon-check' : ''"
@click="setTestCaseStatus('Failure')"> {{$t('test_track.failure')}}</el-button>
</el-col>
<el-col :span="2">
<el-button type="warning" round
:icon="testCase.status == 'Blocking' ? 'el-icon-check' : ''"
@click="setTestCaseStatus('Blocking')"> {{$t('test_track.blocking')}}</el-button>
</el-col>
<el-col :span="2">
<el-button type="info" round
:icon="testCase.status == 'Skip' ? 'el-icon-check' : ''"
@click="setTestCaseStatus('Skip')"> {{$t('test_track.skip')}}</el-button>
</el-col>
</el-row>
<el-row type="flex" justify="end">
<el-col :span="5">
<div>
<el-button @click="cancel">{{$t('test_track.cancel')}}</el-button>
<el-button type="primary" @click="saveCase">{{$t('test_track.save')}}</el-button>
</div>
</el-col>
</el-row>
</div> </div>
</el-drawer> </el-drawer>
@ -146,7 +158,14 @@
let param = {}; let param = {};
param.id = this.testCase.id; param.id = this.testCase.id;
param.status = this.testCase.status; param.status = this.testCase.status;
param.results = JSON.stringify(this.testCase.results); param.results = [];
this.testCase.steptResults.forEach(item => {
let result = {};
result.actualResult = item.actualResult;
result.executeResult = item.executeResult;
param.results.push(result);
});
param.results = JSON.stringify(param.results);
this.$post('/test/plan/case/edit', param, () => { this.$post('/test/plan/case/edit', param, () => {
this.$refs.drawer.closeDrawer(); this.$refs.drawer.closeDrawer();
this.$message.success("保存成功!"); this.$message.success("保存成功!");
@ -160,20 +179,22 @@
<style scoped> <style scoped>
.tb-edit .el-input { .tb-edit .el-textarea {
display: none; display: none;
color: black;
} }
.tb-edit .current-row .el-input { .tb-edit .current-row .el-textarea {
display: block; display: block;
} }
.tb-edit .current-row .el-input+span { .tb-edit .current-row .el-textarea+span {
display: none; display: none;
} }
.el-row { .el-row {
margin-bottom: 3%; margin-bottom: 2%;
} }
.cast_label {
color: dimgray;
}
</style> </style>