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

This commit is contained in:
刘洪洪
2023-06-07 10:34:01 +08:00
parent 73f72b3116
commit d2a3ee8cf9
9 changed files with 581 additions and 43 deletions

View File

@@ -2,7 +2,7 @@
<div>
<!--初步方案error提示替换table后续若改为table内error提示记得在此修改-->
<chart-error v-if="showError" :content="errorMsg" class="entity-detail-event-error"></chart-error>
<chart-no-data v-if="isNoData && !showError"></chart-no-data>
<chart-no-data v-if="isNoData && !showError" test-id="no-data"></chart-no-data>
<div v-if="!isNoData && !showError" class="information-aggregation__table">
<el-table
@@ -44,13 +44,13 @@
<!-- <div class="information-aggregation-tags">
<template v-for="ic in scope.row.intelligenceContent" >
<template v-if="ic.type === 0" >
<div v-if="ic.threatLevel === -1" class="entity-tag entity-tag&#45;&#45;small entity-tag&#45;&#45;level-one-negative margin-r-6">
<div v-if="ic.threatLevel === -1" class="entity-tag entity-tag--small entity-tag--level-one-negative margin-r-6">
{{ic.value}}
</div>
<div v-else-if="ic.threatLevel === 0" class="entity-tag entity-tag&#45;&#45;small entity-tag&#45;&#45;level-one-normal margin-r-6">
<div v-else-if="ic.threatLevel === 0" class="entity-tag entity-tag--small entity-tag--level-one-normal margin-r-6">
{{ic.value}}
</div>
<div v-else-if="ic.threatLevel === 1" class="entity-tag entity-tag&#45;&#45;small entity-tag&#45;&#45;level-one-positive margin-r-6">
<div v-else-if="ic.threatLevel === 1" class="entity-tag entity-tag--small entity-tag--level-one-positive margin-r-6">
{{ic.value}}
</div>
</template>
@@ -59,7 +59,7 @@
<div class="information-aggregation-tags">
<div v-for="ic in scope.row.intelligenceContent" :key="ic.key">
<div>
<div class="entity-tag entity-tag--small margin-r-6" :class="`entity-tag--level-two-${ic.type}`">
<div class="entity-tag entity-tag--small margin-r-6" :test-id="`entity-tag${scope.$index}`" :class="`entity-tag--level-two-${ic.type}`">
{{ic.value}}
</div>
</div>
@@ -75,10 +75,10 @@
prop="status"
>
<template #default="scope">
<div v-if="scope.row.status === 1" class="information-aggregation__valid">
<div v-if="scope.row.status === 1" :test-id="`entity-status${scope.$index}`" class="information-aggregation__valid">
{{ $t("entity.detail.valid") }}
</div>
<div v-else-if="scope.row.status === 0" class="information-aggregation__invalid">
<div v-else-if="scope.row.status === 0" :test-id="`entity-status${scope.$index}`" class="information-aggregation__invalid">
{{ $t("entity.detail.invalid") }}
</div>
</template>
@@ -107,7 +107,7 @@ export default {
components: { chartNoData },
methods: {
dateFormatByAppearance,
intelligenceContentClass ({ row, column, rowIndex, columnIndex }) {
intelligenceContentClass ({ columnIndex }) {
if (columnIndex === 2) {
return 'padding-0'
}
@@ -120,29 +120,31 @@ export default {
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 = {
createTime: r[k].createTime,
updateTime: r[k].updateTime,
status: r[k].isValid,
intelligenceContent: []
}
if (k === 'userDefinedTag') {
aggregation.intelligenceContent.push({ key: k, value: r[k].tagValue, type: 'normal' })
} else {
Object.keys(r[k]).forEach(k2 => {
const find = entityDetailTags[this.entity.entityType].find(t => t.name === k2)
if (find) {
aggregation.intelligenceContent.push({ key: k2, value: r[k][k2], type: find.type })
}
})
}
if (aggregation.intelligenceContent.length > 0) {
this.informationAggregationList.push(aggregation)
}
if (!this.isNoData) {
res.data.result.forEach(r => {
Object.keys(r).forEach(k => {
const aggregation = {
createTime: r[k].createTime,
updateTime: r[k].updateTime,
status: r[k].isValid,
intelligenceContent: []
}
if (k === 'userDefinedTag') {
aggregation.intelligenceContent.push({ key: k, value: r[k].tagValue, type: 'normal' })
} else {
Object.keys(r[k]).forEach(k2 => {
const find = entityDetailTags[this.entity.entityType].find(t => t.name === k2)
if (find) {
aggregation.intelligenceContent.push({ key: k2, value: r[k][k2], type: find.type })
}
})
}
if (aggregation.intelligenceContent.length > 0) {
this.informationAggregationList.push(aggregation)
}
})
})
})
}
} else {
this.showError = true
this.isNoData = false

View File

@@ -5,7 +5,7 @@
<div v-if="!isNoData && !showError" class="entity-detail-event-block">
<div
class="entity-detail-event-border"
v-for="item in eventList"
v-for="(item, index) in eventList"
:key="item.eventId">
<div class="cn-detection--list">
<div class="cn-detection__case entity-detail-performance">
@@ -13,6 +13,7 @@
<div class="cn-detection__row">
<div class="cn-detection__header">
<span
:test-id="`severity-color-block${index}`"
class="detection-event-severity-color-block"
:style="`background-color: ${eventSeverityColor[item.eventSeverity]}`">
</span>
@@ -25,17 +26,17 @@
<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>{{ toUpperCaseByString(item.eventSeverity) || '-' }}</span>
<span :test-id="`severity${index}`">{{ toUpperCaseByString(item.eventSeverity) || '-' }}</span>
</div>
<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 :test-id="`start-time${index}`">{{ dateFormatByAppearance(item.startTime) || '-' }}</span>
</div>
<div class="basic-info__item">
<i class="cn-icon cn-icon-duration"></i>
<span>{{ $t('overall.duration') }}&nbsp;:&nbsp;&nbsp;&nbsp;</span>
<span>{{ unitConvert(item.durationMs, 'time', null, null, 0).join(' ') || '-' }}</span>
<span :test-id="`duration-time${index}`">{{ unitConvert(item.durationMs, 'time', null, null, 0).join(' ') || '-' }}</span>
</div>
</div>
</div>

View File

@@ -1,27 +1,30 @@
<template>
<chart-error v-if="showError" :content="errorMsg" class="entity-detail-event-error"></chart-error>
<chart-no-data v-if="isNoData && !showError"></chart-no-data>
<chart-no-data v-if="isNoData && !showError" test-id="no-data"></chart-no-data>
<div v-if="!isNoData && !showError" class="entity-detail-event-block">
<div
class="entity-detail-event-border"
v-for="item in eventList"
v-for="(item, index) in eventList"
:key="item.eventId">
<div class="cn-detection--list">
<div class="cn-detection__case entity-detail-security">
<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: ${eventSeverityColor[item.eventSeverity]}`">
</span>
<span
:test-id="`severity-color-block${index}`"
class="detection-event-severity-color-block"
:style="`background-color: ${eventSeverityColor[item.eventSeverity]}`">
</span>
<span class="detection-event-severity-block">{{ toUpperCaseByString(item.securityType) || '-' }}</span>
<i class="cn-icon cn-icon-attacker"></i>{{ item.offenderIp || '-' }}
<i class="cn-icon cn-icon-attacker"></i>
<span :test-id="`offender-ip${index}`">{{ item.offenderIp || '-' }}</span>
<div class="domain">{{ item.offenderDomain }}</div>
<span class="line">-------</span>
<span class="circle"></span>
<i class="cn-icon cn-icon-attacked"></i>{{ item.victimIp || '-' }}
<i class="cn-icon cn-icon-attacked"></i>
<span :test-id="`victim-ip${index}`">{{ item.victimIp || '-' }}</span>
<div class="domain">{{ item.victimDomain }}</div>
</div>
<div class="cn-detection__body">
@@ -73,7 +76,7 @@
</template>
<script>
import { getSecond } from '@/utils/date-util'
import { getSecond, dateFormatByAppearance } from '@/utils/date-util'
import { eventSeverityColor } from '@/utils/constants'
import unitConvert from '@/utils/unit-convert'
import axios from 'axios'
@@ -111,6 +114,7 @@ export default {
methods: {
unitConvert,
toUpperCaseByString,
dateFormatByAppearance,
initData () {
const params = {
resource: this.entityName,