CN-1676 fix: 1、类型为indicator时下拉详情的字段名更改;2、类型为threshold时下拉详情,折线图颜色因severity返回字段变动而更改

This commit is contained in:
刘洪洪
2024-08-12 18:31:19 +08:00
parent a911307e29
commit 0f26c965bf
3 changed files with 20 additions and 8 deletions

View File

@@ -41,12 +41,24 @@ const severityColorMappings = [
{ value: 'low', color: '#ffdd4a' },
{ value: 'info', color: '#d7c668' }
]
const severityNumberColorMappings = [
{ value: 5, color: '#d84c4c' },
{ value: 4, color: '#ff9a79' },
{ value: 3, color: '#ffb65a' },
{ value: 2, color: '#ffdd4a' },
{ value: 1, color: '#d7c668' }
]
export function getSeverityColor (type) {
const mapping = severityColorMappings.find(m => m.value === type)
return mapping && mapping.color ? _.cloneDeep(mapping.color) : null
}
export function getSeverityNumberColor (type) {
const mapping = severityNumberColorMappings.find(m => m.value === type)
return mapping && mapping.color ? _.cloneDeep(mapping.color) : null
}
export const multipleBarOption = {
legend: {
icon: 'circle',

View File

@@ -30,10 +30,10 @@
<div class="row__label">{{ $t('npm.clientLocation') }}</div>
<div class="row__content">
<div>
<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" >
<img v-if="myDetection.clientCountryRegion===countryNameIdMapping.Unknown || !countryNameIdMapping[myDetection.clientCountryRegion]" src="../../../../public/images/flag/Unknown.svg" class="filter-country-flag">
<img v-else :src="require(`../../../../public/images/flag/${countryNameIdMapping[myDetection.clientCountryRegion]}.png`)" class="filter-country-flag" >
</div>
{{ myDetection.client_country_region || '-' }}, {{ myDetection.client_super_admin_area || '-' }}
{{ myDetection.clientCountryRegion || '-' }}, {{ myDetection.clientSuperAdminArea || '-' }}
</div>
</div>
<div class="overview__row">
@@ -44,10 +44,10 @@
<div class="row__label">{{ $t('detection.detail.serverLocation') }}</div>
<div class="row__content">
<div>
<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" >
<img v-if="myDetection.serverCountryRegion===countryNameIdMapping.Unknown || !countryNameIdMapping[myDetection.serverCountryRegion]" src="../../../../public/images/flag/Unknown.svg" class="filter-country-flag">
<img v-else :src="require(`../../../../public/images/flag/${countryNameIdMapping[myDetection.serverCountryRegion]}.png`)" class="filter-country-flag" >
</div>
{{ myDetection.server_country_region || '-' }}, {{ myDetection.server_super_admin_area || '-' }}
{{ myDetection.serverCountryRegion || '-' }}, {{ myDetection.serverSuperAdminArea || '-' }}
</div>
</div>
<div class="overview__row">

View File

@@ -2,7 +2,7 @@ import { detectionEventType, detectionRuleType } from '@/utils/constants'
import { getMillisecond, getSecond } from '@/utils/date-util'
import axios from 'axios'
import { api } from '@/utils/api'
import { getSeverityColor, lineOption } from '@/views/detections/options/detectionOptions'
import { getSeverityNumberColor, lineOption } from '@/views/detections/options/detectionOptions'
import { markRaw } from 'vue'
import * as echarts from 'echarts'
@@ -73,7 +73,7 @@ export default {
seriesData.push([getMillisecond(JSON.parse(item.statTime)), item.recordsNums])
})
this.lineOption.series[0].data = seriesData
this.lineOption.series[0].color = getSeverityColor(res.data.data.result[0].severity) || '#ff9a79'
this.lineOption.series[0].color = getSeverityNumberColor(res.data.data.result[0].severity) || '#ff9a79'
this.seriesDataNum = seriesData.length
if (this.seriesDataNum <= 1) {