CN-1391 fix: 调整detection列表和下拉中的展示字段

src/utils/constants.js

@@ -178,6 +178,13 @@ export const eventSeverityColor = {
   low: '#FFD82D',
   info: '#D1BD50'
 }
+export const riskLevelColor = {
+  5: '#D84C4C',
+  4: '#FE845D',
+  3: '#FFB65A',
+  2: '#FFD82D',
+  1: '#D1BD50'
+}
 export const eventSeverityColor1 = {
   Critical: '#D84C4C',
   High: '#FE845D',

src/views/detections/DetectionList.vue

@@ -67,18 +67,17 @@ export default {
       this.myListData = []
       this.listData.forEach((item, i) => {
         this.myListData.push(this.$_.cloneDeep(item))
-        if (item.eventInfoObj) {
+        if (item.eventInfoObj && item.isBuiltin === 1) {
-          axios.get(`${api.detection.securityEvent.detail}/${item.eventInfoObj.ioc_type}?resource=${item.eventInfoObj.ioc_value}`).then(res => {
+          axios.get(`${api.detection.securityEvent.detail}/${item.eventInfoObj.ioc_type.toLowerCase()}?resource=${item.eventInfoObj.ioc_value}`).then(res => {
-            if (res.status === 200 && this.myListData[i]) {
+            if (res.status === 200) {
-              this.myListData[i].malwareName = (this.$_.get(res, 'data.data.malware.malwareName', '-')) || '-'
+              if (item.eventType === 'Anonymity') {
-            } else if (this.myListData[i]) {
+                item.darkweb = this.$_.get(res, 'data.data.darkweb', {}) || {}
-              this.myListData[i].malwareName = '-'
+              } else if (item.eventType === 'Command and Control') {
+                item.malware = this.$_.get(res, 'data.data.malware', {}) || {}
+              }
             }
           }).catch(e => {
             console.error(e)
-            if (this.myListData[i]) {
-              this.myListData[i].malwareName = '-'
-            }
           })
         }
       })
@@ -118,10 +117,7 @@ export default {
         } else {
           clearTimeout(this.timeout)
           this.noData = false
-          const timer = setTimeout(() => {
           this.initData()
-            clearTimeout(timer)
-          }, 200)
         }
       }
     }

src/views/detections/DetectionRow.vue

@@ -41,21 +41,16 @@
                 <span>{{$t('detections.severity')}}&nbsp;:&nbsp;&nbsp;</span>
                 <span>{{detection.eventSeverity || '-'}}</span>
               </div>
-<!--              <div class="basic-info__item" v-if="detection.eventType">-->
+              <div class="basic-info__item" v-if="detection.malware">
-<!--                <i class="cn-icon cn-icon-event-type"></i>-->
-<!--                <span>{{$t('detections.eventType')}}&nbsp;:&nbsp;&nbsp;</span>-->
-<!--                <span>{{detection.eventType || '-'}}</span>-->
-<!--              </div>-->
-              <div class="basic-info__item" v-if="detection.eventName">
                 <i class="cn-icon cn-icon-trojan"></i>
                 <span>{{$t('detection.list.malwareName')}}&nbsp;:&nbsp;&nbsp;</span>
-                <span>{{ $_.get(detection, 'malwareName', '-') || '-' }}</span>
+                <span>{{ $_.get(detection, 'malware.malwareName', '-') || '-' }}</span>
+              </div>
+              <div class="basic-info__item" v-if="detection.darkweb">
+                <i class="cn-icon cn-icon-trojan"></i>
+                <span>{{$t('detection.nodeType')}}&nbsp;:&nbsp;&nbsp;</span>
+                <span>{{ $_.get(detection, 'darkweb.nodeType', '-') || '-' }}</span>
               </div>
-<!--              <div class="basic-info__item" v-if="detection.cryptominingPool">-->
-<!--                <i class="cn-icon cn-icon-mining-pool"></i>-->
-<!--                <span>{{$t('detection.list.cryptominingPool')}}&nbsp;:&nbsp;&nbsp;</span>-->
-<!--                <span>{{detection.cryptominingPool || '-'}}</span>-->
-<!--              </div>-->
               <div class="basic-info__item">
                 <i class="cn-icon cn-icon-time2"></i>
                 <span>{{$t('detection.list.startTime')}}&nbsp;:&nbsp;&nbsp;</span>

src/views/detections/overview/DetectionSecurityEventOverview.vue

@@ -3,32 +3,17 @@
     <div class="overview__left">
       <div class="overview__title">{{ $t('overall.remark') }}</div>
       <div class="overview__row">
-        <div class="row__content1" v-if="basicInfo.malwareInfo">
+        <div class="row__content1" v-if="detection.malware">
-          <template v-if="basicInfo.malwareInfo.threatType === 'command and control'">
+          <span class="row__content--link">
-            <span
+            {{ $_.get(detection, 'malware.mitreAttackDescription', '-') || '-' }}
-              class="row__content--link"
-              @click="goDetail('ip', detection.victimIp)">
-              {{ detection.victimIp }}
           </span>&nbsp;
-            <span>{{$t('detection.commandAndControl')}}</span>
-            <span class="row__content--link" @click="goDetail('ip', detection.eventInfoObj.ioc_value)">
-              {{ detection.eventInfoObj.ioc_value || '-' }}
-            </span>
-          </template>
-          <template v-else>
-            <span
-                class="row__content--link"
-                @click="goDetail('ip', detection.victimIp)">
-              {{ detection.victimIp }}
-            </span>&nbsp;
-            <span>{{$t('detection.payloadAndDelivery')}}</span>
-            <span
-                class="row__content--link"
-                @click="goDetail('ip', detection.eventInfoObj.ioc_value)">
-              {{ detection.eventInfoObj.ioc_value }}
-            </span>
-          </template>
         </div>
+        <div class="row__content1" v-if="detection.darkweb">
+          <span class="row__content--link">
+            {{ $_.get(detection, 'malware.mitreAttackDescription', '-') || '-' }}
+          </span>&nbsp;
+        </div>
+        <span v-else>-</span>
       </div>
       <div class="overview__title">Fields</div>
       <div class="overview__row">
@@ -66,6 +51,7 @@
         <div class="row__label">{{ $t('overall.domain') }}</div>
         <div class="row__content">{{ detection.domain || '-' }}</div>
       </div>
+      <template v-if="detection.domain">
         <div class="overview__row">
           <div class="row__label">{{ $t('entities.domainCategory') }}</div>
           <div class="row__content">{{ $_.get(basicInfo, 'domainInfo.category.categoryName', '-') || '-' }}</div>
@@ -85,6 +71,8 @@
           </div>
           <div class="row__content" v-else>-</div>
         </div>
+      </template>
+      <template v-if="detection.app">
         <div class="overview__row">
           <div class="row__label">APP</div>
           <div class="row__content">{{ $_.get(basicInfo, 'appInfo.category.appName', '-') || '-' }}</div>
@@ -102,12 +90,14 @@
           <div class="row__content" v-if="$_.get(basicInfo, 'appInfo.category.appRisk')">
             <div
                 class="row__tag row__tag__level"
-            :style="`background-color:${eventSeverityColor[basicInfo.appInfo.category.appRisk]}`">
+                :style="`background-color:${riskLevelColor[basicInfo.appInfo.category.appRisk]}`">
-            {{ basicInfo.appInfo.category.appRisk }}
+              {{ appRisk(basicInfo.appInfo.category.appRisk) || '-' }}
             </div>
           </div>
           <div class="row__content" v-else>-</div>
         </div>
+      </template>
+      <template v-if="detection.malware">
         <div class="overview__row">
           <div class="row__label">{{ $t('detections.malware') }}</div>
           <div class="row__content">{{ $_.get(basicInfo, 'malwareInfo.malwareName', '-') || '-' }}</div>
@@ -145,6 +135,101 @@
           </div>
           <div class="row__content">-</div>
         </div>
+      </template>
+      <template v-else-if="detection.darkweb">
+        <div class="overview__row">
+          <div class="row__label">{{ $t('detection.nodeTypeLower') }}</div>
+          <div class="row__content">{{ $_.get(basicInfo, 'darkweb.nodeType', '-') || '-' }}</div>
+        </div>
+        <template v-if="$_.get(detection.darkweb, 'nodeType', '') === 'tor'">
+          <div class="overview__row">
+            <div class="row__label">{{ $t('detection.tor.torFingerprint') }}</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.torFingerprint', '-') || '-' }}</div>
+          </div>
+          <div class="overview__row">
+            <div class="row__label">{{ $t('detection.tor.torFlags') }}</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.torFlags', '-') || '-' }}</div>
+          </div>
+          <div class="overview__row">
+            <div class="row__label">{{ $t('detection.tor.torVersion') }}</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.torVersion', '-') || '-' }}</div>
+          </div>
+          <div class="overview__row">
+            <div class="row__label">Tor ORPort</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.torOrPort', '-') || '-' }}</div>
+          </div>
+          <div class="overview__row">
+            <div class="row__label">Tor DirPort</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.torDirPort', '-') || '-' }}</div>
+          </div>
+        </template>
+        <template v-else-if="$_.get(detection.darkweb, 'nodeType', '') === 'i2p'">
+          <div class="overview__row">
+            <div class="row__label">I2P Hash</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.i2pHash', '-') || '-' }}</div>
+          </div>
+          <div class="overview__row">
+            <div class="row__label">{{ $t('detection.tor.i2pVersion') }}</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.i2pVersion', '-') || '-' }}</div>
+          </div>
+          <div class="overview__row">
+            <div class="row__label">{{ $t('detection.tor.i2pBandwidth') }}</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.i2pBandwidth', '-') || '-' }}</div>
+          </div>
+        </template>
+        <template v-else-if="$_.get(detection.darkweb, 'nodeType', '') === 'mtproxy'">
+          <div class="overview__row">
+            <div class="row__label">MTProxy Secret</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.mtproxySecret', '-') || '-' }}</div>
+          </div>
+          <div class="overview__row">
+            <div class="row__label">{{ $t('detection.tor.mtproxyPort') }}</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.mtproxyPort', '-') || '-' }}</div>
+          </div>
+        </template>
+        <template v-else-if="$_.get(detection.darkweb, 'nodeType', '') === 'obfs4'">
+          <div class="overview__row">
+            <div class="row__label">{{ $t('detection.tor.obfs4Fingerprint') }}</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.obfs4Fingerprint', '-') || '-' }}</div>
+          </div>
+          <div class="overview__row">
+            <div class="row__label">{{ $t('detection.tor.obfs4Cert') }}</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.obfs4Cert', '-') || '-' }}</div>
+          </div>
+          <div class="overview__row">
+            <div class="row__label">{{ $t('detection.tor.obfs4IatMode') }}</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.obfs4IatMode', '-') || '-' }}</div>
+          </div>
+          <div class="overview__row">
+            <div class="row__label">{{ $t('detection.tor.obfs4Port') }}</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.obfs4Port', '-') || '-' }}</div>
+          </div>
+        </template>
+        <template v-else-if="$_.get(detection.darkweb, 'nodeType', '') === 'snowflake'">
+          <div class="overview__row">
+            <div class="row__label">{{ $t('detection.tor.snowflakePort') }}</div>
+            <div class="row__content">{{ $_.get(basicInfo, 'darkweb.snowflakePort', '-') || '-' }}</div>
+          </div>
+        </template>
+      </template>
+      <template v-else>
+        <div class="overview__row">
+          <div class="row__label">{{ $t('detection.libraryId') }}</div>
+          <div class="row__content">{{ $_.get(detection, 'eventInfoObj.knowledge_id', '-') || '-' }}</div>
+        </div>
+        <div class="overview__row">
+          <div class="row__label">{{ $t('detection.libraryName') }}</div>
+          <div class="row__content">{{ $_.get(detection, 'eventInfoObj.name', '-') || '-' }}</div>
+        </div>
+        <div class="overview__row">
+          <div class="row__label">{{ $t('detection.iocType') }}</div>
+          <div class="row__content">{{ $_.get(detection, 'eventInfoObj.ioc_type', '-') || '-' }}</div>
+        </div>
+        <div class="overview__row">
+          <div class="row__label">{{ $t('detection.iocValue') }}</div>
+          <div class="row__content">{{ $_.get(detection, 'eventInfoObj.ioc_value', '-') || '-' }}</div>
+        </div>
+      </template>
     </div>
     <div class="overview__right">
       <div class="overview__title">{{ $t('detections.goToVictim') }}</div>
@@ -251,7 +336,7 @@
 import axios from 'axios'
 import { api } from '@/utils/api'
 import { getMillisecond, dateFormatByAppearance } from '@/utils/date-util'
-import { eventSeverityColor, unitTypes } from '@/utils/constants'
+import { eventSeverityColor, unitTypes, riskLevelMapping, riskLevelColor } from '@/utils/constants'
 import unitConvert from '@/utils/unit-convert'
 import _ from 'lodash'
 export default {
@@ -262,6 +347,7 @@ export default {
   data () {
     return {
       eventSeverityColor,
+      riskLevelColor,
       basicInfo: {},
       events: [],
       reference: 'https://attack.mitre.org'
@@ -288,6 +374,14 @@ export default {
         }
         return ''
       }
+    },
+    appRisk () {
+      return function (level) {
+        const m = riskLevelMapping.find(mapping => {
+          return mapping.value == level
+        })
+        return (m && m.name) || level
+      }
     }
   },
   methods: {
@@ -303,9 +397,6 @@ export default {
         axios.get(`${api.detection.securityEvent.ipDetail}?resource=${this.detection.offenderIp}`).then(res => {
           if (res.status === 200) {
             this.basicInfo.offenderInfo = res.data.data
-            if (this.$_.get(this.detection, 'eventInfoObj.ioc_type', '').toLowerCase() === 'ip') {
-              this.basicInfo.malwareInfo = res.data.data.malware
-            }
           }
         })
       }
@@ -320,9 +411,6 @@ export default {
         axios.get(`${api.detection.securityEvent.domainDetail}?resource=${this.detection.domain}`).then(res => {
           if (res.status === 200) {
             this.basicInfo.domainInfo = res.data.data
-            if (this.$_.get(this.detection, 'eventInfoObj.ioc_type', '').toLowerCase() === 'domain') {
-              this.basicInfo.malwareInfo = res.data.data.malware
-            }
           }
         })
       }