CN-722 fix: 所有图表的环比设置超过500%时显示>500%

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>

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 {

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>

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>