From 5ab1dd2f5186ef5a0cba9e21c77d2f364e6839bc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=88=98=E6=B4=AA=E6=B4=AA?= <2498601771@qq.com>
Date: Wed, 4 Jan 2023 15:41:06 +0800
Subject: [PATCH] =?UTF-8?q?CN-848:=20=E6=A3=80=E6=B5=8B=E4=B8=8B=E6=8B=89?=
 =?UTF-8?q?=E5=86=85=E5=AE=B9=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../detections/options/detectionOptions.js    | 18 ++++++++----
 .../DetectionPerformanceEventIpOverview.vue   | 28 +++++++++++++++----
 2 files changed, 36 insertions(+), 10 deletions(-)

diff --git a/src/views/detections/options/detectionOptions.js b/src/views/detections/options/detectionOptions.js
index 1cec708c..3572cacd 100644
--- a/src/views/detections/options/detectionOptions.js
+++ b/src/views/detections/options/detectionOptions.js
@@ -4,6 +4,7 @@ import {
 import unitConvert from '@/utils/unit-convert'
 import _ from 'lodash'
 import { dateFormatByAppearance } from '@/utils/date-util'
+import { unitTypes } from '@/utils/constants'
 
 const severitySeriesIndexMappings = [
   { value: 'critical', index: '0' },
@@ -301,9 +302,16 @@ export const metricOption = {
       str += `<span class="cn-chart-tooltip-content"> 
       ${item.seriesName}
       </span>`
-      str += `<span class="cn-chart-tooltip-value">
-          ${unitConvert(item.data[1], item.data[2]).join(' ')}
+      if (item.seriesName === 'dns response time') {
+        str += `<span class="cn-chart-tooltip-value">
+          ${unitConvert(item.data[1], unitTypes.time).join(' ')}
       </span>`
+      } else {
+        str += `<span class="cn-chart-tooltip-value">
+          ${unitConvert(item.data[1], unitTypes.percent, '', '', 0).join(' ')}
+      </span>`
+      }
+
       str += '</div>'
       return str
     },
@@ -335,7 +343,7 @@ export const metricOption = {
   },
   series: [
     {
-      name: 'metric',
+      name: 'http error ratio',
       type: 'line',
       legendHoverLink: false,
       lineStyle: {
@@ -347,7 +355,7 @@ export const metricOption = {
       showSymbol: false
     },
     {
-      name: 'metric',
+      name: 'http error ratio',
       type: 'line',
       legendHoverLink: false,
       lineStyle: {
@@ -362,7 +370,7 @@ export const metricOption = {
       showSymbol: false
     },
     {
-      name: 'metric',
+      name: 'http error ratio',
       type: 'line',
       legendHoverLink: false,
       lineStyle: {
diff --git a/src/views/detections/overview/DetectionPerformanceEventIpOverview.vue b/src/views/detections/overview/DetectionPerformanceEventIpOverview.vue
index 60b82e64..fb759428 100644
--- a/src/views/detections/overview/DetectionPerformanceEventIpOverview.vue
+++ b/src/views/detections/overview/DetectionPerformanceEventIpOverview.vue
@@ -54,7 +54,7 @@
         <div class="metric__column">
           <div class="overview__title">{{$t('detections.metric')}}</div>
           <div class="overview__row">
-            <div class="row__content--metric ">{{detection.eventType  || '-'}}</div>
+            <div class="row__content--metric ">{{getNameByType(detection.eventType)  || '-'}}</div>
           </div>
         </div>
         <div class="metric__column">
@@ -155,7 +155,6 @@ export default {
         }, 250)
       })
     },
-
     initChart () {
       this.metricChart = markRaw(echarts.init(document.getElementById(`detectionMetricChartIp${this.detection.serverIp}`)))
       this.chartOptionMetric = _.cloneDeep(this.chartOption)
@@ -174,10 +173,11 @@ export default {
         this.chartOptionMetric.series[1].data = this.metricList.slice(startIndex - 1, endIndex).map(v => [Number(v[0]) * 1000, Number(v[1]), unitTypes.number])
         this.chartOptionMetric.series[2].data = this.metricList.slice(endIndex - 1, this.metricList.length).map(v => [Number(v[0]) * 1000, Number(v[1]), unitTypes.number])
       }
-
+      this.chartOptionMetric.series.forEach(item => {
+        item.name = this.getNameByType(this.detection.eventType)
+      })
       this.chartOptionMetric && this.metricChart.setOption(this.chartOptionMetric)
     },
-
     queryMetric () {
       return new Promise((resolve, reject) => {
         try {
@@ -214,7 +214,6 @@ export default {
         }
       })
     },
-
     queryBasic () {
       return new Promise((resolve, reject) => {
         try {
@@ -237,6 +236,25 @@ export default {
         }
       })
       window.open(href, '_blank')
+    },
+    /**
+     * 通过事件类型转换对应名称
+     * @param type
+     * @returns {string}
+     */
+    getNameByType (type) {
+      switch (type) {
+        case 'http error': {
+          return 'http error ratio'
+        }
+        case 'dns error': {
+          return 'dns error ratio'
+        }
+        case 'high dns response time':
+        default: {
+          return 'dns response time'
+        }
+      }
     }
   },
   mounted () {