From cfc6ab52f407c0cef5e28870509b7c820ebc4c55 Mon Sep 17 00:00:00 2001
From: "@changcode" <changyongqiang@geedgenetworks.com>
Date: Mon, 19 Sep 2022 10:26:24 +0800
Subject: [PATCH] =?UTF-8?q?CN-722=20fix:=20=E6=89=80=E6=9C=89=E5=9B=BE?=
 =?UTF-8?q?=E8=A1=A8=E7=9A=84=E7=8E=AF=E6=AF=94=E8=AE=BE=E7=BD=AE=E8=B6=85?=
 =?UTF-8?q?=E8=BF=87500%=E6=97=B6=E6=98=BE=E7=A4=BA>500%?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../networkOverview/NetworkOverviewApps.vue   | 10 ++++++--
 .../networkOverview/NetworkOverviewTabs.vue   | 24 +++++++++++++++----
 .../charts/npm/NpmAppCategoryScore.vue        |  6 ++---
 .../npm/localComponents/SingleValue.vue       | 10 ++++----
 4 files changed, 36 insertions(+), 14 deletions(-)

diff --git a/src/views/charts2/charts/networkOverview/NetworkOverviewApps.vue b/src/views/charts2/charts/networkOverview/NetworkOverviewApps.vue
index 7c143a5b..5d2c1753 100644
--- a/src/views/charts2/charts/networkOverview/NetworkOverviewApps.vue
+++ b/src/views/charts2/charts/networkOverview/NetworkOverviewApps.vue
@@ -33,10 +33,16 @@
               <div class="app-card__body-content-value">
                 <div class="app-card__body-content-number">{{unitConvert(app.rate, unitTypes.number).join(' ')}}</div>
                 <div class="app-card__body-content-percent red" v-if="app.value > 0">
-                  +{{unitConvert(app.value, unitTypes.percent).join('')}}
+                  <span v-if="app.value <= 5">
+                    +{{unitConvert(app.value, unitTypes.percent).join('')}}
+                  </span>
+                  <span v-else>>500.00%</span>
                 </div>
                 <div class="app-card__body-content-percent green" v-else-if="app.value < 0">
-                  -{{unitConvert(app.value, unitTypes.percent).join('').replaceAll('-', '')}}
+                  <span v-if="app.value >= -5">
+                    -{{unitConvert(app.value, unitTypes.percent).join('').replaceAll('-', '')}}
+                  </span>
+                  <span v-else>>500.00%</span>
                 </div>
                 <div v-else-if="app.value === '-' || app.value === 0" class="app-card__body-content-percent">0</div>
               </div>
diff --git a/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue b/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
index 8aeae6ed..68f10f5b 100644
--- a/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
+++ b/src/views/charts2/charts/networkOverview/NetworkOverviewTabs.vue
@@ -513,10 +513,18 @@ export default {
                       trendPercent = Math.round(Math.abs(chainRatio) * 100)
                       if (totalDiff > 0) {
                         trend = 'up'
-                        trendPercent = trendPercent + '%'
+                        if (trendPercent <= 500) {
+                          trendPercent = trendPercent + '%'
+                        } else {
+                          trendPercent = '>500%'
+                        }
                       } else if (totalDiff < 0) {
                         trend = 'down'
-                        trendPercent = trendPercent + '%'
+                        if (trendPercent <= 500) {
+                          trendPercent = trendPercent + '%'
+                        } else {
+                          trendPercent = '>500%'
+                        }
                       } else if (totalDiff === 0) {
                         trend = 'noChange'// 横向图标
                       } else {
@@ -604,10 +612,18 @@ export default {
                                 trendPercent = Math.round(Math.abs(chainRatio) * 100)
                                 if (totalDiff > 0) {
                                   trend = 'up'
-                                  trendPercent = trendPercent + '%'
+                                  if (trendPercent <= 500) {
+                                    trendPercent = trendPercent + '%'
+                                  } else {
+                                    trendPercent = '>500%'
+                                  }
                                 } else if (totalDiff < 0) {
                                   trend = 'down'
-                                  trendPercent = trendPercent + '%'
+                                  if (trendPercent <= 500) {
+                                    trendPercent = trendPercent + '%'
+                                  } else {
+                                    trendPercent = '>500%'
+                                  }
                                 } else if (totalDiff === 0) {
                                   trend = 'noChange'// 横向图标
                                 } else {
diff --git a/src/views/charts2/charts/npm/NpmAppCategoryScore.vue b/src/views/charts2/charts/npm/NpmAppCategoryScore.vue
index f181ca04..d265b092 100644
--- a/src/views/charts2/charts/npm/NpmAppCategoryScore.vue
+++ b/src/views/charts2/charts/npm/NpmAppCategoryScore.vue
@@ -46,7 +46,7 @@
                     </div>
                     <div v-else-if="scope.row.bytesRateChainRatio < 0" class="data-total-trend data-total-trend-green">
                       <i class="cn-icon-decline cn-icon"></i>&nbsp;
-                      <span v-if="scope.row.bytesRateChainRatio <= 5">
+                      <span v-if="scope.row.bytesRateChainRatio >= -5">
                         {{unitConvert(scope.row.bytesRateChainRatio, unitTypes.percent).join('').replaceAll('-', '')}}
                       </span>
                       <span v-else>>500.00%</span>
@@ -69,7 +69,7 @@
                     </div>
                     <div v-else-if="scope.row.outboundBytesRateChainRatio < 0" class="data-total-trend data-total-trend-green">
                       <i class="cn-icon-decline cn-icon"></i>&nbsp;
-                      <span v-if="scope.row.outboundBytesRateChainRatio <= 5">
+                      <span v-if="scope.row.outboundBytesRateChainRatio >= -5">
                         {{unitConvert(scope.row.outboundBytesRateChainRatio, unitTypes.percent).join('').replaceAll('-', '')}}
                       </span>
                       <span v-else>>500.00%</span>
@@ -92,7 +92,7 @@
                     </div>
                     <div v-else-if="scope.row.inboundBytesRateChainRatio < 0" class="data-total-trend data-total-trend-green">
                       <i class="cn-icon-decline cn-icon"></i>&nbsp;
-                      <span v-if="scope.row.inboundBytesRateChainRatio <= 5">
+                      <span v-if="scope.row.inboundBytesRateChainRatio >= -5">
                         {{unitConvert(scope.row.inboundBytesRateChainRatio, unitTypes.percent).join('').replaceAll('-', '')}}
                       </span>
                       <span v-else>>500.00%</span>
diff --git a/src/views/charts2/charts/npm/localComponents/SingleValue.vue b/src/views/charts2/charts/npm/localComponents/SingleValue.vue
index 38551294..c6159c54 100644
--- a/src/views/charts2/charts/npm/localComponents/SingleValue.vue
+++ b/src/views/charts2/charts/npm/localComponents/SingleValue.vue
@@ -13,7 +13,7 @@
         </div>
         <div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green">
           <i class="cn-icon-decline cn-icon"></i>&nbsp;
-          <span v-if="npm.value <= 5">
+          <span v-if="npm.value >= -5">
             {{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}}
           </span>
           <span v-else>>500.00%</span>
@@ -41,7 +41,7 @@
         </div>
         <div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green">
           <i class="cn-icon-decline cn-icon"></i>&nbsp;
-          <span v-if="npm.value <= 5">
+          <span v-if="npm.value >= -5">
             {{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}}
           </span>
           <span v-else>>500.00%</span>
@@ -69,7 +69,7 @@
         </div>
         <div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green">
           <i class="cn-icon-decline cn-icon"></i>&nbsp;
-          <span v-if="npm.value <= 5">
+          <span v-if="npm.value >= -5">
             {{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}}
           </span>
           <span v-else>>500.00%</span>
@@ -97,7 +97,7 @@
         </div>
         <div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green">
           <i class="cn-icon-decline cn-icon"></i>&nbsp;
-          <span v-if="npm.value <= 5">
+          <span v-if="npm.value >= -5">
             {{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}}
           </span>
           <span v-else>>500.00%</span>
@@ -125,7 +125,7 @@
         </div>
         <div v-else-if="npm.value < 0" class="single-value__content-trend single-value__content-trend-green">
           <i class="cn-icon-decline cn-icon"></i>&nbsp;
-          <span v-if="npm.value <= 5">
+          <span v-if="npm.value >= -5">
             {{unitConvert(npm.value, unitTypes.percent).join('').replaceAll('-', '')}}
           </span>
           <span v-else>>500.00%</span>