CN-1063: 人工测试--实体详情流量折线图和底下3个tab

src/mock/entity.js

@@ -76,7 +76,7 @@ if (openMock) {
         victimIp: '116.178.217.92',
         offenderDomain: 'baidu.com',
         victimDomain: 'mi.com',
-        eventSeverity: 'Critical',
+        eventSeverity: 'critical',
         malwareName: 'NetWire RC',
         cryptominingPool: null,
         startTime: 1683186600,
@@ -91,7 +91,7 @@ if (openMock) {
         victimIp: '116.178.217.93',
         offenderDomain: 'baidu.com',
         victimDomain: 'mi.com',
-        eventSeverity: 'Low',
+        eventSeverity: 'low',
         malwareName: 'NetWire RC',
         cryptominingPool: null,
         startTime: 1683186600,
@@ -106,7 +106,7 @@ if (openMock) {
         victimIp: '116.178.217.93',
         offenderDomain: 'baidu.com',
         victimDomain: 'mi.com',
-        eventSeverity: 'Low',
+        eventSeverity: 'low',
         malwareName: 'NetWire RC',
         cryptominingPool: null,
         startTime: 1683186600,
@@ -121,7 +121,7 @@ if (openMock) {
         victimIp: '116.178.217.93',
         offenderDomain: 'baidu.com',
         victimDomain: 'mi.com',
-        eventSeverity: 'Low',
+        eventSeverity: 'low',
         malwareName: 'NetWire RC',
         cryptominingPool: null,
         startTime: 1683186600,
@@ -136,7 +136,7 @@ if (openMock) {
         victimIp: '116.178.217.93',
         offenderDomain: 'baidu.com',
         victimDomain: 'mi.com',
-        eventSeverity: 'Low',
+        eventSeverity: 'low',
         malwareName: 'NetWire RC',
         cryptominingPool: null,
         startTime: 1683186600,
@@ -151,7 +151,7 @@ if (openMock) {
         victimIp: '116.178.217.93',
         offenderDomain: 'baidu.com',
         victimDomain: 'mi.com',
-        eventSeverity: 'Low',
+        eventSeverity: 'low',
         malwareName: 'NetWire RC',
         cryptominingPool: null,
         startTime: 1683186600,
@@ -166,7 +166,7 @@ if (openMock) {
         victimIp: '116.178.217.93',
         offenderDomain: 'baidu.com',
         victimDomain: 'mi.com',
-        eventSeverity: 'Low',
+        eventSeverity: 'low',
         malwareName: 'NetWire RC',
         cryptominingPool: null,
         startTime: 1683186600,
@@ -191,7 +191,7 @@ if (openMock) {
         serverIp: '116.178.78.180',
         domain: null,
         appName: null,
-        eventSeverity: 'Critical',
+        eventSeverity: 'critical',
         eventType: 'Http error',
         startTime: 1683250500,
         durationMs: 900000,
@@ -203,7 +203,7 @@ if (openMock) {
         serverIp: '116.178.78.180',
         domain: null,
         appName: null,
-        eventSeverity: 'Info',
+        eventSeverity: 'info',
         eventType: 'Http error',
         startTime: 1683250500,
         durationMs: 900000,
@@ -289,7 +289,7 @@ if (openMock) {
       data: result
     }
   })
-  Mock.mock(new RegExp(`${BASE_CONFIG.baseUrl}${BASE_CONFIG.apiVersion}/entity/kb/intelligence/list.*`), 'get', function (requestObj) {
+  Mock.mock(new RegExp(`${BASE_CONFIG.baseUrl}${BASE_CONFIG.apiVersion}/entity/detail/kb/intelligence/list.*`), 'get', function (requestObj) {
     const result = [
       {
         location: {

src/utils/api.js

@@ -241,7 +241,7 @@ export const api = {
     openPort: '',
     basicInfo: BASE_CONFIG.apiVersion + '/entity/detail/basic',
     tags: BASE_CONFIG.apiVersion + '/entity/detail/kb/intelligence/tag',
-    informationAggregation: BASE_CONFIG.apiVersion + '/entity/kb/intelligence/list'
+    informationAggregation: BASE_CONFIG.apiVersion + '/entity/detail/kb/intelligence/list'
   }
 }
 

src/utils/tools.js

@@ -1271,3 +1271,15 @@ export function copySelectionText () {
   }
   return copySuccess
 }
+
+/**
+ * 字符串首字母转大写
+ * @param str
+ * @returns {*}
+ */
+export function toUpperCaseByString (str) {
+  if (str) {
+    str = str.slice(0, 1).toUpperCase() + str.slice(1).toLowerCase()
+  }
+  return str
+}

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

@@ -76,10 +76,10 @@
         >
           <template #default="scope">
             <div v-if="scope.row.status === 1" class="information-aggregation__valid">
-              valid
+              {{ $t("entity.detail.valid") }}
             </div>
             <div v-else-if="scope.row.status === 0" class="information-aggregation__invalid">
-              invalid
+              {{ $t("entity.detail.invalid") }}
             </div>
           </template>
         </el-table-column>
@@ -94,6 +94,7 @@ import axios from 'axios'
 import { api } from '@/utils/api'
 import { entityDetailTags } from '@/utils/constants'
 import { dateFormatByAppearance } from '@/utils/date-util'
+import chartNoData from '@/views/charts/charts/ChartNoData'
 
 export default {
   name: 'InformationAggregation',
@@ -103,6 +104,7 @@ export default {
     }
   },
   mixins: [chartMixin],
+  components: { chartNoData },
   methods: {
     dateFormatByAppearance,
     intelligenceContentClass ({ row, column, rowIndex, columnIndex }) {
@@ -116,6 +118,8 @@ export default {
       axios.get(`${api.entity.informationAggregation}/${this.entity.entityType}?resource=${this.entity.entityName}&pageSize=100&pageNo=1`).then(response => {
         const res = response.data
         if (res.code === 200) {
+          this.isNoData = res.data.result.length === 0
+          this.showError = false
           res.data.result.forEach(r => {
             Object.keys(r).forEach(k => {
               const aggregation = {
@@ -141,11 +145,13 @@ export default {
           })
         } else {
           this.showError = true
+          this.isNoData = false
           this.errorMsg = this.errorMsgHandler(res)
         }
       }).catch(e => {
         console.error(e)
         this.showError = true
+        this.isNoData = false
         this.errorMsg = this.errorMsgHandler(e)
       }).finally(() => {
         this.toggleLoading(false)

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

@@ -9,15 +9,15 @@
         :key="item.eventId">
       <div class="cn-detection--list">
         <div class="cn-detection__case entity-detail-performance">
-          <div class="cn-detection__icon" :style="`background-color: ${eventSeverityColor1[item.eventSecurity]}`"></div>
+          <div class="cn-detection__icon" :style="`background-color: ${eventSeverityColor[item.eventSecurity]}`"></div>
           <div class="cn-detection__row">
             <div class="cn-detection__header">
             <span
                 class="detection-event-severity-color-block"
-                :style="`background-color: ${eventSeverityColor1[item.eventSeverity]}`">
+                :style="`background-color: ${eventSeverityColor[item.eventSeverity]}`">
             </span>
               <span class="detection-event-severity-block" style="margin-right: 30px">
-              {{ item.eventType || '-' }}
+              {{ toUpperCaseByString(item.eventType) || '-' }}
             </span>
               <div class="cn-detection__body">
                 <div class="body__basic-info">
@@ -25,7 +25,7 @@
                     <div class="basic-info__item" v-if="item.eventSeverity">
                       <i class="cn-icon cn-icon-severity-level"></i>
                       <span>{{ $t('network.severity') }}&nbsp;:&nbsp;&nbsp;</span>
-                      <span>{{ item.eventSeverity || '-' }}</span>
+                      <span>{{ toUpperCaseByString(item.eventSeverity) || '-' }}</span>
                     </div>
                     <div class="basic-info__item">
                       <i class="cn-icon cn-icon-time2"></i>
@@ -49,24 +49,26 @@
 </template>
 
 <script>
-import { getSecond } from '@/utils/date-util'
+import { getSecond, dateFormatByAppearance } from '@/utils/date-util'
-import { eventSeverityColor1 } from '@/utils/constants'
+import { eventSeverityColor } 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 ChartNoData from '@/views/charts/charts/ChartNoData'
 
 export default {
   name: 'PerformanceEvent',
-  components: { ChartError },
+  components: { ChartError, ChartNoData },
   mixins: [chartMixin],
   data () {
     return {
       eventList: [],
       showError: false,
-      eventSeverityColor1,
+      eventSeverityColor,
       errorMsg: ''
     }
   },
@@ -85,6 +87,8 @@ export default {
   },
   methods: {
     unitConvert,
+    toUpperCaseByString,
+    dateFormatByAppearance,
     initData () {
       const params = {
         resource: this.entityName,

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

@@ -9,14 +9,14 @@
         :key="item.eventId">
       <div class="cn-detection--list">
         <div class="cn-detection__case entity-detail-security">
-          <div class="cn-detection__icon" :style="`background-color: ${eventSeverityColor1[item.eventSecurity]}`"></div>
+          <div class="cn-detection__icon" :style="`background-color: ${eventSeverityColor[item.eventSecurity]}`"></div>
           <div class="cn-detection__row">
             <div class="cn-detection__header">
           <span
               class="detection-event-severity-color-block"
-              :style="`background-color: ${eventSeverityColor1[item.eventSeverity]}`">
+              :style="`background-color: ${eventSeverityColor[item.eventSeverity]}`">
           </span>
-              <span class="detection-event-severity-block">{{ item.securityType || '-' }}</span>
+              <span class="detection-event-severity-block">{{ toUpperCaseByString(item.securityType) || '-' }}</span>
               <i class="cn-icon cn-icon-attacker"></i>{{ item.offenderIp || '-' }}
               <div class="domain">{{ item.offenderDomain }}</div>
               <span class="line">-------</span>
@@ -35,7 +35,7 @@
                   <div class="basic-info__item" v-if="item.eventSeverity">
                     <i class="cn-icon cn-icon-severity-level"></i>
                     <span>{{ $t('network.severity') }}&nbsp;:&nbsp;&nbsp;</span>
-                    <span>{{ item.eventSeverity || '-' }}</span>
+                    <span>{{ toUpperCaseByString(item.eventSeverity) || '-' }}</span>
                   </div>
                   <div class="basic-info__item" v-if="item.eventType">
                     <i class="cn-icon cn-icon-event-type"></i>
@@ -74,12 +74,14 @@
 
 <script>
 import { getSecond } from '@/utils/date-util'
-import { eventSeverityColor1 } from '@/utils/constants'
+import { eventSeverityColor } 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 { toUpperCaseByString } from '@/utils/tools'
+import chartNoData from '@/views/charts/charts/ChartNoData'
 
 export default {
   name: 'SecurityEvent',
@@ -88,10 +90,11 @@ export default {
     return {
       eventList: [],
       showError: false,
-      eventSeverityColor1,
+      eventSeverityColor,
       errorMsg: ''
     }
   },
+  components: { chartNoData },
   setup () {
     const { query } = useRoute()
     const entityType = query.entityType
@@ -107,6 +110,7 @@ export default {
   },
   methods: {
     unitConvert,
+    toUpperCaseByString,
     initData () {
       const params = {
         resource: this.entityName,