fix(测试跟踪)：首页用例评审分布结果统计展示错误
--bug=1023471 --user=王旭 【测试跟踪】首页 - 用例评审 结果分布 统计错误 https://www.tapd.cn/55049933/s/1352438
This commit is contained in:
WangXu10
jianxing
parent
0bbfbf2e76
commit
a2f4e3abf1
|
|
@ -0,0 +1,144 @@
|
|||
<template>
|
||||
<div class="y-progress" :style="{'width':againPercent + '%','background-color':tip[3].fillStyle || '#ccc'}">
|
||||
<a class="y-progress_text" :style="{'width':((again/total)*100)+'%'}">
|
||||
<span class="y-tooltip" v-text="tip[3].text.replace('X',again>total?total:again)"></span>
|
||||
</a>
|
||||
<div
|
||||
class="y-progress_bar"
|
||||
:style="{'width':underwayPercent+ '%','background-color':tip[0].fillStyle || '#000'}"
|
||||
>
|
||||
<a class="y-progress_text" :style="{'width':((underway/total)*100)+'%'}">
|
||||
<span class="y-tooltip" v-text="tip[0].text.replace('X',underway>total?total:underway)"></span>
|
||||
</a>
|
||||
</div>
|
||||
<div
|
||||
class="y-progress_bar"
|
||||
:style="{'width':unPassPercent+'%','background-color':tip[2].fillStyle || '#080'}"
|
||||
>
|
||||
<a class="y-progress_text" :style="{'width':((unPass/total)*100)+'%'}">
|
||||
<span class="y-tooltip" v-text="tip[2].text.replace('X',unPass>total?total:unPass)"></span>
|
||||
</a>
|
||||
</div>
|
||||
<div
|
||||
class="y-progress_bar"
|
||||
:style="{'width':passPercent+'%','background-color':tip[1].fillStyle || '#9c3'}"
|
||||
>
|
||||
<a class="y-progress_text" :style="{'width':((pass/total)*100)+'%'}">
|
||||
<span class="y-tooltip" v-text="tip[1].text.replace('X',pass>total?total:pass)"></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name:'ms-yan-progress',
|
||||
data() {
|
||||
return {
|
||||
};
|
||||
},
|
||||
props: {
|
||||
total: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
pass: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
tip: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
unPass: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
again: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
underway: {
|
||||
type: Number,
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
passPercent() {
|
||||
if (this.pass >= this.total) {
|
||||
return 1e2;
|
||||
}
|
||||
return parseInt((this.pass / this.total) * 100);
|
||||
},
|
||||
unPassPercent() {
|
||||
if (this.unPass >= this.total) {
|
||||
return 1e2;
|
||||
}
|
||||
return parseInt(((this.unPass + this.pass)/this.total) * 100);
|
||||
},
|
||||
againPercent() {
|
||||
if (this.again >= this.total) {
|
||||
return 1e2;
|
||||
}
|
||||
return parseInt(((this.again + this.pass + this.unPass + this.underway)/ this.total) * 100);
|
||||
},
|
||||
underwayPercent() {
|
||||
if (this.underway >= this.total) {
|
||||
return 1e2;
|
||||
}
|
||||
return parseInt(((this.underway + this.pass + this.unPass)/ this.total) * 100);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
.y-progress {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 8px;
|
||||
background-color: #ccc;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.y-progress_bar {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
border-radius: 4px;
|
||||
transition: all 1.5s ease;
|
||||
}
|
||||
.y-progress_text {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
text-align: center;
|
||||
}
|
||||
.y-progress_text .y-tooltip {
|
||||
position: absolute;
|
||||
top: 15px;
|
||||
right: 0;
|
||||
background-color: #333;
|
||||
color: #f1f1f1;
|
||||
border-radius: 5px;
|
||||
padding: 5px 10px;
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
transform: scale(0);
|
||||
transition: all ease-in 0.2s;
|
||||
}
|
||||
.y-progress_text:hover .y-tooltip {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
.y-tooltip:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 100%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, 0);
|
||||
border: 5px solid;
|
||||
border-color: transparent transparent #333 transparent;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,61 @@
|
|||
import Comp from './MsYanProgress';
|
||||
|
||||
const CONF = {
|
||||
tip: [
|
||||
{
|
||||
text: "通过",
|
||||
fillStyle: "#ccc",
|
||||
}, {
|
||||
text: "不通过",
|
||||
fillStyle: "#9c3",
|
||||
}, {
|
||||
text: "评审中",
|
||||
fillStyle: "#080"
|
||||
}, {
|
||||
text: "重新评审",
|
||||
fillStyle: "#000"
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
let YanProgress1 = {
|
||||
install(Vue) {
|
||||
Vue.component('ms-yan-progress', Object.assign({}, Comp, {
|
||||
props: {
|
||||
"total": {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
"pass": {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
"unPass": {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
"again": {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
"underway": {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
"tip": {
|
||||
type: Array,
|
||||
default() {
|
||||
return CONF.tip;
|
||||
}
|
||||
}
|
||||
},
|
||||
}));
|
||||
}
|
||||
};
|
||||
|
||||
if (window && window.Vue) {
|
||||
window.Vue.use(YanProgress1);
|
||||
}
|
||||
|
||||
export default YanProgress1;
|
||||
|
||||
|
|
@ -143,8 +143,8 @@ export default {
|
|||
if (!value) {
|
||||
return '';
|
||||
}
|
||||
if (value.length > 20) {
|
||||
return value.slice(0, 20) + '...';
|
||||
if (value.length > 25) {
|
||||
return value.slice(0, 25) + '...';
|
||||
}
|
||||
return value;
|
||||
}
|
||||
|
|
@ -226,6 +226,6 @@ export default {
|
|||
height:34px;
|
||||
display: inline-block;
|
||||
title:content;
|
||||
font-size: x-large;
|
||||
font-size: large;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -54,7 +54,12 @@
|
|||
<template v-slot:default="scope">
|
||||
<el-tooltip :content="getResultTip(scope.row)"
|
||||
placement="top" :enterable="false" class="item" effect="dark">
|
||||
<yan-progress :total="scope.row.caseCount" :done="getResultCount(scope.row, 'Pass')" :modify="getResultCount(scope.row, 'UnPass')" :tip="tip"/>
|
||||
<ms-yan-progress :total="scope.row.caseCount"
|
||||
:pass="getResultCount(scope.row, 'Pass')"
|
||||
:unPass="getResultCount(scope.row, 'UnPass')"
|
||||
:underway="getResultCount(scope.row, 'Underway')"
|
||||
:again="getResultCount(scope.row, 'Again')"
|
||||
:tip="tip"/>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
|
@ -83,10 +88,11 @@ import {getRelateTestCaseReview} from "@/api/test-review";
|
|||
import HomePagination from "@/business/home/components/pagination/HomePagination";
|
||||
import BasicStatusLabel from "metersphere-frontend/src/components/BasicStatusLabel";
|
||||
import {hasPermission} from "@/business/utils/sdk-utils";
|
||||
import MsYanProgress from 'metersphere-frontend/src/components/yrogress/MsYanProgress';
|
||||
|
||||
export default {
|
||||
name: "ReviewList",
|
||||
components: {MsTableOperator, HomeBaseComponent, MsTableButton, HomePagination, BasicStatusLabel},
|
||||
components: {MsTableOperator, HomeBaseComponent, MsTableButton, HomePagination, BasicStatusLabel,MsYanProgress},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
|
|
@ -97,9 +103,10 @@ export default {
|
|||
pageSize: 5,
|
||||
total: 0,
|
||||
tip: [
|
||||
{text: "X", fillStyle: '#1F232926'},
|
||||
{text: "X", fillStyle: '#F76964'},
|
||||
{text: "X", fillStyle: '#AA4FBF'}
|
||||
{text: "X", fillStyle: '#AA4FBF'},//评审中
|
||||
{text: "X", fillStyle: '#55B040'},//通过
|
||||
{text: "X", fillStyle: '#F76964'},//不通过
|
||||
{text: "X", fillStyle: '#FFD131'}
|
||||
]
|
||||
}
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue