From f0fbc362a57f8e6db68b2263141d33978b9fe082 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=88=98=E6=B4=AA=E6=B4=AA?= <2498601771@qq.com>
Date: Mon, 12 Aug 2024 14:48:10 +0800
Subject: [PATCH] =?UTF-8?q?CN-1676=20fix:=20=E6=B7=BB=E5=8A=A0=E4=B8=8B?=
 =?UTF-8?q?=E6=8B=89=E8=AF=A6=E6=83=85ruleType=E4=B8=BAindicator=E6=97=B6?=
 =?UTF-8?q?=E7=9A=84=E6=95=B0=E6=8D=AE=E5=A1=AB=E5=85=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../views/detections/detection-overview.scss  |  5 ++
 .../overview/IndicatorMatchOverview.vue       | 49 +++++++++++--------
 .../detections/overview/SequenceOverview.vue  |  2 +-
 .../detections/overview/ThresholdOverview.vue |  2 +-
 .../overview/detectionDetailMixin.js          | 16 +++---
 5 files changed, 45 insertions(+), 29 deletions(-)

diff --git a/src/assets/css/components/views/detections/detection-overview.scss b/src/assets/css/components/views/detections/detection-overview.scss
index 2b15c9c8..044dba4d 100644
--- a/src/assets/css/components/views/detections/detection-overview.scss
+++ b/src/assets/css/components/views/detections/detection-overview.scss
@@ -35,6 +35,11 @@ $color-regular: var(--el-text-color-regular);
       }
     }
 
+    .overview__title__margin {
+      margin: 10px 0;
+    }
+
+
     .overview__row {
       display: flex;
       flex-direction: row;
diff --git a/src/views/detections/overview/IndicatorMatchOverview.vue b/src/views/detections/overview/IndicatorMatchOverview.vue
index c0be25db..8a8baaa4 100644
--- a/src/views/detections/overview/IndicatorMatchOverview.vue
+++ b/src/views/detections/overview/IndicatorMatchOverview.vue
@@ -7,67 +7,69 @@
           ${key} experienced exceptions exceeding the threshold number of times.
         </div>
       </div>
-<!--      <div class="overview__title">{{ $t('overall.summary') }}</div>-->
       <div class="overview__title">{{ $t('overall.fields') }}</div>
       <div class="overview__row">
         <div class="row__label">{{ $t('detection.list.startTime') }}</div>
         <div class="row__content">
           <i class="cn-icon cn-icon-time2 row__content__icon"></i>
-          {{ detection.startTime ? dateFormatByAppearance(detection.startTime) : '-' }}
+          {{ myDetection.startTime ? dateFormatByAppearance(myDetection.startTime) : '-' }}
         </div>
       </div>
       <div class="overview__row">
         <div class="row__label">{{ $t('detection.detail.matchTime') }}</div>
         <div class="row__content">
           <i class="cn-icon cn-icon-time2 row__content__icon"></i>
-          {{ detection.startTime ? dateFormatByAppearance(detection.startTime) : '-' }}
+          {{ myDetection.matchTime ? dateFormatByAppearance(myDetection.matchTime) : '-' }}
         </div>
       </div>
       <div class="overview__row">
         <div class="row__label">{{ $t('overall.clientIp') }}</div>
-<!--        <div class="row__content">{{ detection.victimIp || '-' }}</div>-->
-        <div class="row__content">192.168.12.34</div>
+        <div class="row__content">{{ myDetection.clientIp || '-' }}</div>
       </div>
       <div class="overview__row">
         <div class="row__label">{{ $t('npm.clientLocation') }}</div>
         <div class="row__content">
           <div>
-<!--          <div v-if="$_.get(basicInfo, 'victimInfo.location.country')">-->
-<!--            <img v-if="basicInfo.victimInfo.location.country===countryNameIdMapping.Unknown || !countryNameIdMapping[basicInfo.victimInfo.location.country]" src="../../../../public/images/flag/Unknown.svg" class="filter-country-flag">-->
-<!--            <img v-else :src="require(`../../../../public/images/flag/${countryNameIdMapping[basicInfo.victimInfo.location.country]}.png`)" class="filter-country-flag" >-->
-            <img :src="require(`../../../../public/images/flag/CN.png`)" class="filter-country-flag" >
+            <img v-if="myDetection.client_country_region===countryNameIdMapping.Unknown || !countryNameIdMapping[myDetection.client_country_region]" src="../../../../public/images/flag/Unknown.svg" class="filter-country-flag">
+            <img v-else :src="require(`../../../../public/images/flag/${countryNameIdMapping[myDetection.client_country_region]}.png`)" class="filter-country-flag" >
           </div>
-          China, beijing
+          {{ myDetection.client_country_region || '-' }}, {{ myDetection.client_super_admin_area || '-' }}
         </div>
       </div>
       <div class="overview__row">
         <div class="row__label">{{ $t('overall.serverIp') }}</div>
-        <!--<div class="row__content">{{ detection.victimIp || '-' }}</div>-->
-        <div class="row__content">192.168.12.34</div>
+        <div class="row__content">{{ myDetection.serverIp || '-' }}</div>
       </div>
       <div class="overview__row">
         <div class="row__label">{{ $t('detection.detail.serverLocation') }}</div>
         <div class="row__content">
           <div>
-            <!--          <div v-if="$_.get(basicInfo, 'victimInfo.location.country')">-->
-            <!--            <img v-if="basicInfo.victimInfo.location.country===countryNameIdMapping.Unknown || !countryNameIdMapping[basicInfo.victimInfo.location.country]" src="../../../../public/images/flag/Unknown.svg" class="filter-country-flag">-->
-            <!--            <img v-else :src="require(`../../../../public/images/flag/${countryNameIdMapping[basicInfo.victimInfo.location.country]}.png`)" class="filter-country-flag" >-->
-            <img :src="require(`../../../../public/images/flag/CN.png`)" class="filter-country-flag" >
+            <img v-if="myDetection.server_country_region===countryNameIdMapping.Unknown || !countryNameIdMapping[myDetection.server_country_region]" src="../../../../public/images/flag/Unknown.svg" class="filter-country-flag">
+            <img v-else :src="require(`../../../../public/images/flag/${countryNameIdMapping[myDetection.server_country_region]}.png`)" class="filter-country-flag" >
           </div>
-          China, beijing
+          {{ myDetection.server_country_region || '-' }}, {{ myDetection.server_super_admin_area || '-' }}
         </div>
       </div>
       <div class="overview__row">
         <div class="row__label">{{ $t('detection.detail.indicatorValues') }}</div>
-        <div class="row__content">Tor</div>
+        <div class="row__content">{{ myDetection.indicatorValues || '-' }}</div>
       </div>
       <div class="overview__row">
         <div class="row__label">{{ $t('overall.domain') }}</div>
-        <div class="row__content">baidu.com</div>
+        <div class="row__content">{{ myDetection.domain || '-' }}</div>
       </div>
       <div class="overview__row">
         <div class="row__label">{{ $t('overall.app') }}</div>
-        <div class="row__content">Wechat</div>
+        <div class="row__content">{{ myDetection.app || '-' }}</div>
+      </div>
+
+      <div v-if="eventFlag===detectionEventType.aggregation">
+        <div class="overview__title overview__title__margin">{{ $t('detection.timeOfOccurrences') }}</div>
+        <div class="overview__row">
+          <div class="row__content1">
+            <events-timeline :timeFilter="timeFilter" :timeData="timeData" @change="changeTimeline"></events-timeline>
+          </div>
+        </div>
       </div>
     </div>
 
@@ -77,6 +79,8 @@
 <script>
 import { dateFormatByAppearance } from '@/utils/date-util'
 import detectionDetailMixin from '@/views/detections/overview/detectionDetailMixin'
+import { countryNameIdMapping } from '@/utils/constants'
+import EventsTimeline from '@/views/detections/overview/EventsTimeline'
 export default {
   name: 'IndicatorMatchOverview',
   mixins: [detectionDetailMixin],
@@ -85,9 +89,12 @@ export default {
     timeFilter: Object,
     q: String
   },
+  components: {
+    EventsTimeline
+  },
   data () {
     return {
-      basicInfo: {}
+      countryNameIdMapping
     }
   },
   methods: {
diff --git a/src/views/detections/overview/SequenceOverview.vue b/src/views/detections/overview/SequenceOverview.vue
index d28ff78b..8f3216f2 100644
--- a/src/views/detections/overview/SequenceOverview.vue
+++ b/src/views/detections/overview/SequenceOverview.vue
@@ -40,7 +40,7 @@
       </div>
 
       <div v-if="eventFlag===detectionEventType.aggregation">
-        <div class="overview__title" style="margin: 10px 0;">{{ $t('detection.timeOfOccurrences') }}</div>
+        <div class="overview__title overview__title__margin">{{ $t('detection.timeOfOccurrences') }}</div>
         <div class="overview__row">
           <div class="row__content1">
             <events-timeline :timeFilter="timeFilter" :timeData="timeData" @change="changeTimeline"></events-timeline>
diff --git a/src/views/detections/overview/ThresholdOverview.vue b/src/views/detections/overview/ThresholdOverview.vue
index 276d8c66..cd17ebcd 100644
--- a/src/views/detections/overview/ThresholdOverview.vue
+++ b/src/views/detections/overview/ThresholdOverview.vue
@@ -18,7 +18,7 @@
       </div>
 
       <div v-if="eventFlag===detectionEventType.aggregation">
-        <div class="overview__title" style="margin: 10px 0;">{{ $t('detection.timeOfOccurrences') }}</div>
+        <div class="overview__title overview__title__margin">{{ $t('detection.timeOfOccurrences') }}</div>
         <div class="overview__row">
           <div class="row__content1">
             <events-timeline :timeFilter="timeFilter" :timeData="timeData" @change="changeTimeline"></events-timeline>
diff --git a/src/views/detections/overview/detectionDetailMixin.js b/src/views/detections/overview/detectionDetailMixin.js
index f9baf266..647f5457 100644
--- a/src/views/detections/overview/detectionDetailMixin.js
+++ b/src/views/detections/overview/detectionDetailMixin.js
@@ -46,7 +46,7 @@ export default {
             this.timeData = res.data.data.result
           }
         }).catch(e => {
-          //
+          this.$message.error(this.errorMsgHandler(e))
         })
       } else {
         this.isGroup = 0
@@ -56,8 +56,8 @@ export default {
         this.myChart.dispose()
       }
       const params = {
-        startTime: this.timeFilter.startTime,
-        endTime: this.timeFilter.endTime,
+        startTime: getSecond(this.timeFilter.startTime),
+        endTime: getSecond(this.timeFilter.endTime),
         eventId: this.detection.eventId,
         ruleType: this.detection.ruleType,
         resource: this.q,
@@ -76,12 +76,14 @@ export default {
             this.myChart.setOption(this.lineOption)
           } else {
             const detailData = res.data.data.result.pop()
-            if (detailData.eventInfo) {
+            if (detailData?.eventInfo) {
               detailData.eventInfoList = JSON.parse(detailData.eventInfo)
             }
-            this.myDetection = detailData
+            this.myDetection = { ...detailData, ...this.detection }
           }
         }
+      }).catch(e => {
+        this.$message.error(this.errorMsgHandler(e))
       })
     },
     changeTimeline (e) {
@@ -99,8 +101,10 @@ export default {
           if (detailData.eventInfo) {
             detailData.eventInfoList = JSON.parse(detailData.eventInfo)
           }
-          this.myDetection = detailData
+          this.myDetection = { ...this.myDetection, ...detailData }
         }
+      }).catch(e => {
+        this.$message.error(this.errorMsgHandler(e))
       })
     }
   }