gfwleak/cyber-narrator-cn-ui
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Dahsboard - npm - 网络质量概览图表 单位为ms时取整

Browse Source
This commit is contained in:
@changcode
2022-09-01 16:35:56 +08:00
parent a61e853f82
commit 2015f3a2d0
3 changed files with 11 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/assets/css/components/views/charts2/npmAppCategoryScore.scss
View File

@@ -138,6 +138,9 @@
display: flex; display: flex;
justify-content: right; justify-content: right;
width: 50%; width: 50%;
font-size: 12px;
color: #353636;
font-weight: 400;
} }
.data-trend{ .data-trend{
display: flex; display: flex;
@@ -148,7 +151,6 @@
justify-content: left; justify-content: left;
margin-left: 6px; margin-left: 6px;
font-size: 12px; font-size: 12px;
align-items: center;
justify-content: center; justify-content: center;
margin-top: 2px; margin-top: 2px;
border-radius: 10px; border-radius: 10px;

10
src/views/charts2/charts/SingleValue.vue
View File

@@ -8,7 +8,7 @@
<i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('')}} <i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('')}}
</div> </div>
<div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green"> <div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green">
<i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}} <i class="cn-icon-decline cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}}
</div> </div>
<div v-else-if="npm.value === 0" class="single-value__content-trend single-value__content-trend-black"> <div v-else-if="npm.value === 0" class="single-value__content-trend single-value__content-trend-black">
<i class="cn-icon-constant cn-icon"></i> <i class="cn-icon-constant cn-icon"></i>
@@ -28,7 +28,7 @@
<i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('')}} <i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('')}}
</div> </div>
<div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green"> <div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green">
<i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}} <i class="cn-icon-decline cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}}
</div> </div>
<div v-else-if="npm.value === 0" class="single-value__content-trend single-value__content-trend-black"> <div v-else-if="npm.value === 0" class="single-value__content-trend single-value__content-trend-black">
<i class="cn-icon-constant cn-icon"></i> <i class="cn-icon-constant cn-icon"></i>
@@ -48,7 +48,7 @@
<i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('')}} <i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('')}}
</div> </div>
<div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green"> <div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green">
<i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}} <i class="cn-icon-decline cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}}
</div> </div>
<div v-else-if="npm.value === 0" class="single-value__content-trend single-value__content-trend-black"> <div v-else-if="npm.value === 0" class="single-value__content-trend single-value__content-trend-black">
<i class="cn-icon-constant cn-icon"></i> <i class="cn-icon-constant cn-icon"></i>
@@ -68,7 +68,7 @@
<i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('')}} <i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('')}}
</div> </div>
<div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green"> <div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green">
<i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}} <i class="cn-icon-decline cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}}
</div> </div>
<div v-else-if="npm.value === 0" class="single-value__content-trend single-value__content-trend-black"> <div v-else-if="npm.value === 0" class="single-value__content-trend single-value__content-trend-black">
<i class="cn-icon-constant cn-icon"></i> <i class="cn-icon-constant cn-icon"></i>
@@ -88,7 +88,7 @@
<i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('')}} <i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('')}}
</div> </div>
<div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green"> <div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green">
<i class="cn-icon-rise1 cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}} <i class="cn-icon-decline cn-icon"></i>&nbsp;{{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}}
</div> </div>
<div v-else-if="npm.value === 0" class="single-value__content-trend single-value__content-trend-black"> <div v-else-if="npm.value === 0" class="single-value__content-trend single-value__content-trend-black">
<i class="cn-icon-constant cn-icon"></i> <i class="cn-icon-constant cn-icon"></i>

6
src/views/charts2/charts/npm/NpmNetworkQuantity.vue
View File

@@ -216,19 +216,19 @@ export default {
npmNetworkQuantity (cycle, lastCycle, num) { npmNetworkQuantity (cycle, lastCycle, num) {
if (num === 0) { if (num === 0) {
this.npmNetworkData[0] = { this.npmNetworkData[0] = {
establishLatencyMsAvg: cycle.establishLatencyMsAvg, establishLatencyMsAvg: Math.floor(cycle.establishLatencyMsAvg),
establishLatencyMsP99: cycle.establishLatencyMsP99, establishLatencyMsP99: cycle.establishLatencyMsP99,
establishLatencyMsP95: cycle.establishLatencyMsP95, establishLatencyMsP95: cycle.establishLatencyMsP95,
value: getChainRatio(cycle.establishLatencyMsAvg, lastCycle.establishLatencyMsAvg) value: getChainRatio(cycle.establishLatencyMsAvg, lastCycle.establishLatencyMsAvg)
} }
this.npmNetworkData[1] = { this.npmNetworkData[1] = {
httpResponseLatencyAvg: cycle.httpResponseLatencyAvg, httpResponseLatencyAvg: Math.floor(cycle.httpResponseLatencyAvg),
httpResponseLatencyP99: cycle.httpResponseLatencyP99, httpResponseLatencyP99: cycle.httpResponseLatencyP99,
httpResponseLatencyP95: cycle.httpResponseLatencyP95, httpResponseLatencyP95: cycle.httpResponseLatencyP95,
value: getChainRatio(cycle.httpResponseLatencyAvg, lastCycle.httpResponseLatencyAvg) value: getChainRatio(cycle.httpResponseLatencyAvg, lastCycle.httpResponseLatencyAvg)
} }
this.npmNetworkData[2] = { this.npmNetworkData[2] = {
sslConLatencyAvg: cycle.sslConLatencyAvg, sslConLatencyAvg: Math.floor(cycle.sslConLatencyAvg),
sslConLatencyP99: cycle.sslConLatencyP99, sslConLatencyP99: cycle.sslConLatencyP99,
sslConLatencyP95: cycle.sslConLatencyP95, sslConLatencyP95: cycle.sslConLatencyP95,
value: getChainRatio(cycle.sslConLatencyAvg, lastCycle.sslConLatencyAvg) value: getChainRatio(cycle.sslConLatencyAvg, lastCycle.sslConLatencyAvg)