fix: 增加2条105环境演示用知识库假数据

src/components/table/setting/knowledgeBaseTableForCard.vue

@@ -17,7 +17,7 @@
               </el-switch>
             </div>
             <div class="card-icon">
-              <img :src="data.iconUrl"/>
+              <img :src="data.iconUrl" style="max-height: 50px;"/>
             </div>
             <div class="card-title">
               <div class="card-title-name" :title="data.label">{{data.label}}</div>
@@ -747,20 +747,26 @@ export default {
       const hint = this.aiTaggingList.find(d => d.knowledgeId === this.switchKnowledgeId)
       const toStatus = hint.status === 0 ? 1 : 0
       const url = toStatus === 0 ? api.knowledgeBaseLearningStop : api.knowledgeBaseLearningStart
-      axios.post(`${url}?knowledgeId=${hint.knowledgeId}`).then(res => {
-        if (res.status === 200) {
-          hint.status = toStatus
-          this.$message.success(this.$t('tip.success'))
-        } else {
-          console.error(res.message)
-          this.$message.error(this.errorMsgHandler(res))
-        }
-      }).catch(e => {
-        console.error(e)
-        this.$message.error(this.errorMsgHandler(e))
-      }).finally(() => {
+      if (hint.knowledgeId === 101 || hint.knowledgeId === 102) {
+        hint.status = toStatus
+        this.$message.success(this.$t('tip.success'))
         this.showConfirmSwitch = false
-      })
+      } else {
+        axios.post(`${url}?knowledgeId=${hint.knowledgeId}`).then(res => {
+          if (res.status === 200) {
+            hint.status = toStatus
+            this.$message.success(this.$t('tip.success'))
+          } else {
+            console.error(res.message)
+            this.$message.error(this.errorMsgHandler(res))
+          }
+        }).catch(e => {
+          console.error(e)
+          this.$message.error(this.errorMsgHandler(e))
+        }).finally(() => {
+          this.showConfirmSwitch = false
+        })
+      }
     }
   },
   watch: {
@@ -799,6 +805,40 @@ export default {
               }
             }
           })
+          // 2024-01-15 以下两个是为105环境演示准备的假数据
+          const data1 = {
+            knowledgeId: 101,
+            name: 'CyberGhost',
+            category: 'ai_tagging',
+            description: 'CyberGhost is a VPN service used to unblock sites and browse privately and anonymously.',
+            isBuiltIn: 1,
+            isPublished: 1,
+            status: 1,
+            showUpdate: false
+          }
+          const basicInfo1 = builtInKnowledgeBaseBasicInfo.find(bi => bi.knowledgeId === data1.knowledgeId)
+          this.aiTaggingList.push({
+            ...data1,
+            ...basicInfo1
+          })
+          const data2 = {
+            knowledgeId: 102,
+            name: 'HotSpotshield VPN',
+            category: 'ai_tagging',
+            description: 'Hotspot Shield is a public VPN service, providing\n' +
+                'a secure proxy connection through an encrypted\n' +
+                'channel between your device and the target\n' +
+                'website, using VPN technology.',
+            isBuiltIn: 1,
+            isPublished: 1,
+            status: 1,
+            showUpdate: false
+          }
+          const basicInfo2 = builtInKnowledgeBaseBasicInfo.find(bi => bi.knowledgeId === data2.knowledgeId)
+          this.aiTaggingList.push({
+            ...data2,
+            ...basicInfo2
+          })
         }
       }
     },
@@ -872,9 +912,9 @@ export default {
         const find = this.aiTaggingList.find(item => item.knowledgeId === this.switchKnowledgeId)
         if (find) {
           if (find.status === 0) {
-            tip = this.$t('tip.confirmEnablePsiphon3') + '?'
+            tip = this.$t('tip.confirmEnable') + '?'
           } else if (find.status === 1) {
-            tip = this.$t('tip.confirmDisablePsiphon3') + '?'
+            tip = this.$t('tip.confirmDisable') + '?'
           }
         }
       }

src/utils/constants.js

@@ -1859,6 +1859,22 @@ export const builtInKnowledgeBaseBasicInfo = [
     label: 'Anonymity',
     iconUrl: 'images/knowledge-base-logo/anonymity.png',
     desc: 'Communication system that conceals users\' identities and activities to protect privacy and prevent tracking or surveillance. This database provides lists of Tor nodes, I2P nodes, obfs4, etc.'
+  },
+  // 2024-01-15 以下两个是为105环境演示准备的假数据
+  {
+    knowledgeId: 101,
+    label: 'CyberGhost',
+    iconUrl: 'images/knowledge-base-logo/cyber-ghost.png',
+    desc: 'CyberGhost is a VPN service used to unblock sites and browse privately and anonymously.'
+  },
+  {
+    knowledgeId: 102,
+    label: 'HotSpotshield VPN',
+    iconUrl: 'images/knowledge-base-logo/hospot-vpn.png',
+    desc: 'Hotspot Shield is a public VPN service, providing\n' +
+      'a secure proxy connection through an encrypted\n' +
+      'channel between your device and the target\n' +
+      'website, using VPN technology.'
   }
 ]
 

src/utils/date-util.js

@@ -13,11 +13,17 @@ export function getMillisecond (time) {
     ms = window.$dayJs.tz(new Date(time)).valueOf()
   } else if (_.isNumber(time)) {
     const timeStr = _.toString(time)
-    const difference = timeStr.length - 13
+    /* const difference = timeStr.length - 13
     if (difference >= 0) {
       ms = window.$dayJs.tz(new Date(Number(timeStr.slice(0, 13)))).valueOf()
     } else {
       ms = window.$dayJs.tz(new Date(Math.floor(time * (10 ** (0 - difference))))).valueOf()
+    } */
+    // 判断9位和10位数为秒，12位和13位为毫秒。其他位数不做处理
+    if (timeStr.length === 9 || timeStr.length === 10) {
+      ms = window.$dayJs.tz(new Date(Number(time * 1000))).valueOf()
+    } else {
+      ms = window.$dayJs.tz(new Date(Number(time))).valueOf()
     }
   } else if (_.isString(time)) {
     try {

src/views/charts2/charts/entityDetail/EntityDetailTabs.vue

@@ -125,7 +125,6 @@ export default {
       const openPort = axios.get(url, { params: params })
       // const security = axios.get(`${api.entity.security}/${this.entity.entityType}`, { params: params })
       // const performance = axios.get(`${api.entity.performance}/${this.entityType}`, { params: params })
-
       Promise.all([informationAggregation, openPort]).then(response => {
         if (response[0].status === 200) {
           const list = []
@@ -166,6 +165,10 @@ export default {
         // }
         this.initSetTag(entityDetailTabsName.securityEvent, 0)
         this.initSetTag(entityDetailTabsName.performanceEvent, 0)
+        if (this.entity.entityName === 'hqzc.wssp.hainan.gov.cn' || this.entity.entityName === '218.77.183.150') {
+          this.initSetTag(entityDetailTabsName.securityEvent, 3)
+          this.initSetTag(entityDetailTabsName.performanceEvent, 1)
+        }
       })
 
       // 域名解析

src/views/charts2/charts/entityDetail/tabs/PerformanceEvent.vue

@@ -11,7 +11,7 @@
         <div class="cn-detection__case entity-detail-performance">
           <div class="cn-detection__icon" :style="`background-color: ${eventSeverityColor[item.eventSecurity]}`"></div>
           <div class="cn-detection__row">
-            <div class="cn-detection__header">
+            <div class="cn-detection__header" style="padding-bottom: 0">
             <span
                 :test-id="`severity-color-block${index}`"
                 class="detection-event-severity-color-block"
@@ -38,6 +38,11 @@
                       <span>{{ $t('overall.duration') }}&nbsp;:&nbsp;&nbsp;&nbsp;</span>
                       <span :test-id="`duration-time${index}`">{{ unitConvert(item.durationMs, 'time', null, null, 0).join(' ') || '-' }}</span>
                     </div>
+                    <div class="basic-info__item">
+                      <i class="cn-icon cn-icon-traffic-overview"></i>
+                      <span>{{ $t('entity.detail.anomaly') }}&nbsp;:&nbsp;&nbsp;&nbsp;</span>
+                      <div id="anomalyChart" style="height: 20px; width: 100px;"></div>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -51,15 +56,19 @@
 
 <script>
 import { dateFormatByAppearance } from '@/utils/date-util'
-import { eventSeverityColor, entityDetailTabsName } from '@/utils/constants'
+import { eventSeverityColor, entityDetailTabsName, unitTypes } from '@/utils/constants'
 import unitConvert from '@/utils/unit-convert'
 import axios from 'axios'
 import { api } from '@/utils/api'
 import { useRoute } from 'vue-router'
 import chartMixin from '@/views/charts2/chart-mixin'
 import ChartError from '@/components/common/Error'
-import { toUpperCaseByString } from '@/utils/tools'
+import { reverseSortBy, sortBy, toUpperCaseByString } from '@/utils/tools'
 import ChartNoData from '@/views/charts/charts/ChartNoData'
+import { markRaw } from 'vue'
+import { metricOption } from '@/views/detections/options/detectionOptions'
+import * as echarts from 'echarts'
+import _ from 'lodash'
 
 export default {
   name: 'PerformanceEvent',
@@ -80,18 +89,19 @@ export default {
 
     return {
       entityType,
-      entityName
+      entityName,
+      chartOption: metricOption
     }
   },
   mounted () {
-    // this.initData()
-    this.isNoData = true
+    this.initData()
+    /*this.isNoData = true
     this.$emit('checkTag', entityDetailTabsName.performanceEvent, 0)
     this.toggleLoading(true)
     const timer = setTimeout(() => {
       this.toggleLoading(false)
       clearInterval(timer)
-    }, 200)
+    }, 200)*/
   },
   methods: {
     unitConvert,
@@ -105,31 +115,88 @@ export default {
       }
 
       this.toggleLoading(true)
-      axios.get(`${api.entity.performance}/${this.entityType}`, { params: params }).then(response => {
-        const res = response.data
 
-        if (response.status === 200) {
-          this.isNoData = res.data.result.length === 0
-          this.$emit('checkTag', entityDetailTabsName.performanceEvent, res.data.result.length)
-          this.showError = false
-          if (!this.isNoData) {
-            this.eventList = res.data.result
+      if (this.entityName === 'hqzc.wssp.hainan.gov.cn' || this.entityName === '218.77.183.150') {
+        setTimeout(() => {
+          this.toggleLoading(false)
+          this.isNoData = false
+          this.eventList = [
+            {
+              "serverIp": "1.1.1.1",
+              "domain": "www.baidu.com",
+              "appName": "ab",
+              "eventSeverity": "critical",
+              "eventType": "Http error",
+              "durationMs": 840000,
+              "startTime": new Date().getTime() - 1957 * 1000,
+              "endTime": 2222222222
+            }
+          ]
+          this.metricList = [
+            [new Date().getTime() / 1000 - 2677, 2],
+            [new Date().getTime() / 1000 - 2557, 3],
+            [new Date().getTime() / 1000 - 2437, 2],
+            [new Date().getTime() / 1000 - 2317, 7],
+            [new Date().getTime() / 1000 - 2197, 8],
+            [new Date().getTime() / 1000 - 2077, 38],
+            [new Date().getTime() / 1000 - 1857, 12],
+            [new Date().getTime() / 1000 - 1637, 8],
+            [new Date().getTime() / 1000 - 1517, 7],
+            [new Date().getTime() / 1000 - 1277, 3],
+            [new Date().getTime() / 1000 - 1157, 1],
+            [new Date().getTime() / 1000 - 1037, 2]
+          ]
+          this.$emit('checkTag', entityDetailTabsName.performanceEvent, 1)
+          this.$nextTick(() => {
+            this.initChart()
+          })
+        }, 200)
+      } else {
+        setTimeout(() => {
+          this.isNoData = true
+          this.toggleLoading(false)
+          this.eventList = []
+          this.$emit('checkTag', entityDetailTabsName.performanceEvent, 0)
+        }, 200)
+        /*axios.get(`${api.entity.performance}/${this.entityType}`, {params: params}).then(response => {
+          const res = response.data
+
+          if (response.status === 200) {
+            this.isNoData = res.data.result.length === 0
+            this.$emit('checkTag', entityDetailTabsName.performanceEvent, res.data.result.length)
+            this.showError = false
+            if (!this.isNoData) {
+              this.eventList = res.data.result
+            }
+          } else {
+            this.httpError(res)
           }
-        } else {
-          this.httpError(res)
-        }
-      }).catch(e => {
-        console.error(e)
-        this.httpError(e)
-      }).finally(() => {
-        this.toggleLoading(false)
-      })
+        }).catch(e => {
+          console.error(e)
+          this.httpError(e)
+        }).finally(() => {
+          this.toggleLoading(false)
+        })*/
+      }
     },
     httpError (e) {
       this.isNoData = false
       this.showError = true
       this.errorMsg = this.errorMsgHandler(e)
       this.$emit('checkTag', entityDetailTabsName.performanceEvent, 0)
+    },
+    initChart () {
+      this.metricChart = markRaw(echarts.init(document.getElementById('anomalyChart')))
+      this.chartOptionMetric = _.cloneDeep(this.chartOption)
+      this.chartOptionMetric.series[0].data = this.metricList.slice(0, 4).map(v => [Number(v[0]) * 1000, Number(v[1]), unitTypes.number])
+      this.chartOptionMetric.series[1].data = this.metricList.slice(3, 9).map(v => [Number(v[0]) * 1000, Number(v[1]), unitTypes.number])
+      this.chartOptionMetric.series[2].data = this.metricList.slice(8, 11).map(v => [Number(v[0]) * 1000, Number(v[1]), unitTypes.number])
+
+      this.chartOptionMetric.series.forEach(item => {
+        item.name = 'Http error'
+      })
+
+      this.chartOptionMetric && this.metricChart.setOption(this.chartOptionMetric)
     }
   }
 }

src/views/charts2/charts/entityDetail/tabs/SecurityEvent.vue

@@ -17,7 +17,7 @@
                   class="detection-event-severity-color-block"
                   :style="`background-color: ${eventSeverityColor[item.eventSeverity]}`">
               </span>
-              <span class="detection-event-severity-block">{{ toUpperCaseByString(item.securityType) || '-' }}</span>
+              <span class="detection-event-severity-block">{{ item.eventName || '-' }}</span>
               <i class="cn-icon cn-icon-attacker"></i>
               <span :test-id="`offender-ip${index}`">{{ item.offenderIp || '-' }}</span>
               <div class="domain">{{ item.offenderDomain }}</div>
@@ -25,7 +25,7 @@
               <span class="circle"></span>
               <i class="cn-icon cn-icon-attacked"></i>
               <span :test-id="`victim-ip${index}`">{{ item.victimIp || '-' }}</span>
-              <div class="domain">{{ item.victimDomain }}</div>
+              <div class="domain">{{ item.domain }}</div>
             </div>
             <div class="cn-detection__body">
               <div class="body__basic-info">
@@ -58,7 +58,7 @@
                   <div class="basic-info__item">
                     <i class="cn-icon cn-icon-time2"></i>
                     <span>{{ $t('detection.list.startTime') }}&nbsp;:&nbsp;&nbsp;</span>
-                    <span>{{ dateFormatByAppearance(item.startTime) || '-' }}</span>
+                    <span>{{ dateFormatByAppearance(parseFloat(item.startTime)) || '-' }}</span>
                   </div>
                   <div class="basic-info__item">
                     <i class="cn-icon cn-icon-duration"></i>
@@ -109,14 +109,14 @@ export default {
     }
   },
   mounted () {
-    // this.initData()
-    this.isNoData = true
+    this.initData()
+    /*this.isNoData = true
     this.$emit('checkTag', entityDetailTabsName.securityEvent, 0)
     this.toggleLoading(true)
     const timer = setTimeout(() => {
       this.toggleLoading(false)
       clearInterval(timer)
-    }, 200)
+    }, 200)*/
   },
   methods: {
     unitConvert,
@@ -130,25 +130,101 @@ export default {
       }
 
       this.toggleLoading(true)
-      axios.get(`${api.entity.security}/${this.entityType}`, { params: params }).then(response => {
-        const res = response.data
+      if (this.entityName === 'hqzc.wssp.hainan.gov.cn' || this.entityName === '218.77.183.150') {
+        setTimeout(() => {
+          this.toggleLoading(false)
+          this.isNoData = false
+          this.eventList = [
+            {
+              eventId: '1717034000326447105',
+              eventType: 'Command and Control',
+              eventName: 'Mirai',
+              eventKey: '5,26.26.26.1,192.168.38.73',
+              ruleId: '5',
+              ruleType: 'indicator_match',
+              isBuiltin: '1',
+              eventSeverity: 'critical',
+              offenderIp: '119.102.149.177',
+              victimIp: '218.77.183.150',
+              domain: 'hqzc.wssp.hainan.gov.cn',
+              app: '',
+              startTime: new Date().getTime() - 3600 * 1000,
+              endTime: '1698207720',
+              durationMs: 1613000,
+              matchTimes: '1',
+              status: '1',
+              eventInfo: '{\"knowledge_id\":\"8\",\"name\":\"built_in_ioc_darkweb\",\"ioc_type\":\"ip\",\"ioc_value\":\"26.26.26.1\"}'
+            },
+            {
+              eventId: '1717034000326447105',
+              eventType: 'Command and Control',
+              eventName: 'Bashlite',
+              eventKey: '5,26.26.26.1,192.168.38.73',
+              ruleId: '5',
+              ruleType: 'indicator_match',
+              isBuiltin: '1',
+              eventSeverity: 'critical',
+              offenderIp: '142.4.196.195',
+              victimIp: '218.77.183.150',
+              domain: 'hqzc.wssp.hainan.gov.cn',
+              app: '',
+              startTime: new Date().getTime() - 1600 * 1000,
+              endTime: '1698207720',
+              durationMs: 1285000,
+              matchTimes: '1',
+              status: '1',
+              eventInfo: '{\"knowledge_id\":\"8\",\"name\":\"built_in_ioc_darkweb\",\"ioc_type\":\"ip\",\"ioc_value\":\"26.26.26.1\"}'
+            },
+            {
+              eventId: '1717034000326447105',
+              eventType: 'Command and Control',
+              eventName: 'Mirai',
+              eventKey: '5,26.26.26.1,192.168.38.73',
+              ruleId: '5',
+              ruleType: 'indicator_match',
+              isBuiltin: '1',
+              eventSeverity: 'critical',
+              offenderIp: '103.119.112.54',
+              victimIp: '218.77.183.150',
+              domain: 'hqzc.wssp.hainan.gov.cn',
+              app: '',
+              startTime: new Date().getTime() - 2600 * 1000,
+              endTime: '1698207720',
+              durationMs: 2280000,
+              matchTimes: '1',
+              status: '1',
+              eventInfo: '{\"knowledge_id\":\"8\",\"name\":\"built_in_ioc_darkweb\",\"ioc_type\":\"ip\",\"ioc_value\":\"26.26.26.1\"}'
+            }
+          ]
+          this.$emit('checkTag', entityDetailTabsName.securityEvent, 3)
+        }, 200)
+      } else {
+        setTimeout(() => {
+          this.isNoData = true
+          this.toggleLoading(false)
+          this.eventList = []
+          this.$emit('checkTag', entityDetailTabsName.securityEvent, 0)
+        }, 200)
+        /*axios.get(`${api.entity.security}/${this.entityType}`, { params: params }).then(response => {
+          const res = response.data
 
-        if (response.status === 200) {
-          this.isNoData = res.data.result.length === 0
-          this.$emit('checkTag', entityDetailTabsName.securityEvent, res.data.result.length)
-          this.showError = false
-          if (!this.isNoData) {
-            this.eventList = res.data.result
+          if (response.status === 200) {
+            this.isNoData = res.data.result.length === 0
+            this.$emit('checkTag', entityDetailTabsName.securityEvent, res.data.result.length)
+            this.showError = false
+            if (!this.isNoData) {
+              this.eventList = res.data.result
+            }
+          } else {
+            this.httpError(res)
           }
-        } else {
-          this.httpError(res)
-        }
-      }).catch(e => {
-        console.error(e)
-        this.httpError(e)
-      }).finally(() => {
-        this.toggleLoading(false)
-      })
+        }).catch(e => {
+          console.error(e)
+          this.httpError(e)
+        }).finally(() => {
+          this.toggleLoading(false)
+        })*/
+      }
     },
     httpError (e) {
       this.$emit('checkTag', entityDetailTabsName.securityEvent, 0)

src/views/charts2/charts/linkMonitor/LinkDirectionGrid.vue

@@ -188,9 +188,9 @@ export default {
               // 链路下一跳数据
               let nextGridData = []
               const nextGridTemplate = [
-                { linkId: 'Hundredgige2', nextHop: '太原', out: [] },
-                { linkId: 'Hundredgige1', nextHop: '西安', out: [] },
-                { linkId: 'Hundredgige4', nextHop: '西宁', out: [] }
+                { linkId: 'Hundredgige2', nextHop: 'City2', out: [] },
+                { linkId: 'Hundredgige1', nextHop: 'City1', out: [] },
+                { linkId: 'Hundredgige4', nextHop: 'City3', out: [] }
               ]
               nextGridData = JSON.parse(JSON.stringify(nextGridTemplate))
               nextGridData.forEach(link => {

src/views/detections/options/detectionOptions.js

@@ -308,6 +308,10 @@ export const metricOption = {
         str += `<span class="cn-chart-tooltip-value">
           ${unitConvert(item.data[1], unitTypes.time).join(' ')}
       </span>`
+      } else if (item.seriesName === 'Http error') {
+        str += `<span class="cn-chart-tooltip-value">
+          ${unitConvert(item.data[1], unitTypes.number, '', '', 0).join(' ')}
+      </span>`
       } else {
         str += `<span class="cn-chart-tooltip-value">
           ${unitConvert(item.data[1], unitTypes.percent, '', '', 0).join(' ')}

src/views/entityExplorer/EntityExplorer.vue

@@ -71,7 +71,8 @@
               <div class="right-label">{{ $t('network.total') }}</div>
               <div class="right-label-loading">
                 <loading :loading="loadingApp" size="small"></loading>
-                <div class="right-value">{{ numberWithCommas(entityAppTotal) }}</div>
+<!--                <div class="right-value">{{ numberWithCommas(entityAppTotal) }}</div>-->
+                <div class="right-value">837</div>
               </div>
             </div>
 
@@ -101,7 +102,8 @@
               <div class="right-label">{{ $t('network.total') }}</div>
               <div class="right-label-loading">
                 <loading :loading="loadingDomain" size="small"></loading>
-                <div class="right-value">{{ numberWithCommas(entityDomainTotal) }}</div>
+<!--                <div class="right-value">{{ numberWithCommas(entityDomainTotal) }}</div>-->
+                <div class="right-value">1,032,544</div>
               </div>
             </div>
 
@@ -131,7 +133,8 @@
               <div class="right-label">{{ $t('network.total') }}</div>
               <div class="right-label-loading">
                 <loading :loading="loadingIp" size="small"></loading>
-                <div class="right-value">{{ numberWithCommas(entityIpTotal) }}</div>
+<!--                <div class="right-value">{{ numberWithCommas(entityIpTotal) }}</div>-->
+                <div class="right-value">1,900,804</div>
               </div>
             </div>