CN-464 带分位值的单值图bug和改动

This commit is contained in:
hyx
2022-04-06 13:37:20 +08:00
parent cc368519b7
commit a539e27f3f
4 changed files with 36 additions and 15 deletions

View File

@@ -86,7 +86,9 @@ export default function unitConvert (value, unitType, sourceUnit, targetUnit, do
case unitTypes.time: {
return timeUnitFormatter(value, sourceUnit, targetUnit, dot)
}
case unitTypes.percent:
case unitTypes.percent: {
return [value, '%']
}
case unitTypes.number: {
return numberUnitConvert(value, sourceUnit, targetUnit, dot)
}

View File

@@ -245,6 +245,12 @@ export default {
if (chartParams && chartParams.dataKey) {
if (response.data.result && (response.data.result[chartParams.dataKey] || response.data.result[chartParams.dataKey] === 0)) {
this.chartData = response.data.result[chartParams.dataKey]
} else if (response.data.result && (response.data.result[chartParams.dataKey + 'Avg'] || response.data.result[chartParams.dataKey + 'Avg'] === 0)) {
this.chartData = [{
value: response.data.result[chartParams.dataKey + 'Avg'],
p50: response.data.result[chartParams.dataKey + 'P50'],
p90: response.data.result[chartParams.dataKey + 'P90']
}]
} else {
this.chartData = null
}

View File

@@ -51,7 +51,7 @@
<div class="content__percentile">
<div class="circle__content">
<div class="circle circle-p50"></div>
<div><span class="percentile__title-color">P50:</span><span>
<div><span class="percentile__title-color">P50: </span><span>
{{(handleSingleValue[2] || handleSingleValue[2] === 0)
?handleSingleValue[2]
:'-'}}
@@ -59,7 +59,7 @@
</div>
<div class="circle__content">
<div class="circle circle-p90"></div>
<div><span class="percentile__title-color">P90:</span><span>
<div><span class="percentile__title-color">P90: </span><span>
{{(handleSingleValue[3]|| handleSingleValue[3] === 0)
?handleSingleValue[3]
:'-'}}
@@ -84,7 +84,7 @@
<div class="content__percentile">
<div class="circle__content">
<div class="circle circle-p50"></div>
<div><span class="percentile__title-color">P50:</span><span>
<div><span class="percentile__title-color">P50: </span><span>
{{(handleSingleValue[2]|| handleSingleValue[2] === 0)
?handleSingleValue[2]
:'-'}}
@@ -92,7 +92,7 @@
</div>
<div class="circle__content">
<div class="circle circle-p90"></div>
<div><span class="percentile__title-color">P90:</span><span>
<div><span class="percentile__title-color">P90: </span><span>
{{(handleSingleValue[3]|| handleSingleValue[3] === 0)
?handleSingleValue[3]
:'-'}}
@@ -260,13 +260,26 @@ export default {
this.color = n.params.color
this.type = n.type
}
},
chartData: {
deep: true,
handler (n) {
if (this.chartData && this.chartData.length > 0) {
// this.handleSingleValue()
}
}
}
},
computed: {
handleSingleValue () {
const value = this.$_.isEmpty(this.chartData) || this.$_.get(this, 'chartData')
let value = null
if (this.type === 506 || this.type === 507) {
value = this.chartData && (this.chartData[0].value || this.chartData[0].value === 0) ? this.chartData[0].value : ''
} else {
value = this.$_.isEmpty(this.chartData) || this.$_.get(this, 'chartData')
? this.chartData
: ''
}
const unitType = this.chartInfo.params.unitType
const result = unitConvert(value, unitType)
@@ -281,8 +294,8 @@ export default {
switch (unitType) {
case unitTypes.percent: {
result[0] = result[0] < 0.01 ? '< 0.01' : result[0]
result[2] = (p50 && (p50[0] || Number(p50[0]) === 0)) ? p50[0] + '%' : ''
result[3] = (p90 && (p90[0] || Number(p90[0]) === 0)) ? p90[0] + '%' : ''
result[2] = (p50 && (p50[0] || Number(p50[0]) === 0)) ? p50[0] + p50[1] : ''
result[3] = (p90 && (p90[0] || Number(p90[0]) === 0)) ? p90[0] + p90[1] : ''
break
}
case unitTypes.time: {

View File

@@ -248,7 +248,7 @@ export default {
icon: 'cn-icon cn-icon-time',
unitType: unitTypes.time
},
type: 501,
type: 507,
i18n: 'entities.avgRoundTripTime'
},
{
@@ -256,7 +256,7 @@ export default {
icon: 'cn-icon cn-icon-http',
unitType: unitTypes.time
},
type: 501,
type: 507,
i18n: 'entities.httpResponseLatency'
},
{
@@ -264,7 +264,7 @@ export default {
icon: 'cn-icon cn-icon-ssl',
unitType: unitTypes.time
},
type: 501,
type: 507,
i18n: 'entities.sslConLatency'
},
{
@@ -272,7 +272,7 @@ export default {
icon: 'cn-icon cn-icon-package-loss',
unitType: unitTypes.percent
},
type: 501,
type: 507,
i18n: 'entities.sequenceGapLossPercent'
},
{
@@ -280,7 +280,7 @@ export default {
icon: 'cn-icon cn-icon-upload',
unitType: unitTypes.percent
},
type: 501,
type: 507,
i18n: 'entities.pktRetransPercent'
}
],