gfwleak/cyber-narrator-cn-ui
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 修复 npm => event by type 图表接口错误问题

Browse Source
This commit is contained in:
@changcode
2022-09-03 10:17:49 +08:00
parent e01686b069
commit 3b1d3792b1
4 changed files with 19 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/assets/css/components/views/charts2/npmEventsByType.scss
View File

@@ -35,10 +35,6 @@
margin-bottom: 15px; margin-bottom: 15px;
} }
.npm-event-pie-legend-type { .npm-event-pie-legend-type {
font-size: 12px;
color: #353636;
line-height: 12px;
font-weight: 500;
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom: 11px; margin-bottom: 11px;
@@ -48,6 +44,10 @@
margin-right: 5px; margin-right: 5px;
} }
.npm-event-pie-legend-type-severity { .npm-event-pie-legend-type-severity {
font-size: 12px;
line-height: 12px;
color: #353636;
font-weight: 400;
text-transform: capitalize; text-transform: capitalize;
} }
.critical { .critical {

2
src/utils/constants.js
View File

@@ -783,7 +783,7 @@ export const chartColor2 = ['#86B565', '#A37FA7', '#EFAFC7', '#EFC48F', '#B4B1A8
export const chartColor3 = ['#00A7AB', '#7FA054', '#35ADDA', '#E48F3E', '#9FBC1D', '#98709B'] export const chartColor3 = ['#00A7AB', '#7FA054', '#35ADDA', '#E48F3E', '#9FBC1D', '#98709B']
export const chartColor4 = ['#E5F6F6', '#F2F6EE', '#EBF7FC', '#FCF4EB', '#9FBC1D', '#F5F1F5'] export const chartColor4 = ['#E5F6F6', '#F2F6EE', '#EBF7FC', '#FCF4EB', '#9FBC1D', '#F5F1F5']
export const chartColor5 = ['#E26154', '#E48E4D', '#E7B34E', '#DAC74B', '#88AF65'] export const chartColor5 = ['#E26154', '#E7B34E', '#88AF65']
export const iso36112 = { export const iso36112 = {
[storageKey.iso36112Capital]: 'data/countriesWithCapital', [storageKey.iso36112Capital]: 'data/countriesWithCapital',

1
src/views/charts2/charts/npm/NpmAppEventTable.vue
View File

@@ -154,7 +154,6 @@ export default {
this.isNoData = true this.isNoData = true
} }
this.tableData = res.data.result this.tableData = res.data.result
console.log(res.data.result)
} else { } else {
this.isNoData = true this.isNoData = true
} }

37
src/views/charts2/charts/npm/NpmEventsByType.vue
View File

@@ -10,15 +10,14 @@
<div class="npm-event-pie-legend-title" v-if="chartData.length > 0">{{ $t('overall.type') }}</div> <div class="npm-event-pie-legend-title" v-if="chartData.length > 0">{{ $t('overall.type') }}</div>
<template v-for="(legend, index) in chartData" :key="index"> <template v-for="(legend, index) in chartData" :key="index">
<div class="npm-event-pie-legend-type"> <div class="npm-event-pie-legend-type">
<div class="npm-event-pie-legend-type-icon" :class="legend.eventSeverity"></div> <div class="npm-event-pie-legend-type-severity">{{legend.name}}</div>
<div class="npm-event-pie-legend-type-severity">{{legend.eventSeverity}}</div>
</div> </div>
</template> </template>
</div> </div>
<div class="npm-event-pie-legend"> <div class="npm-event-pie-legend">
<div class="npm-event-pie-legend-title" v-if="chartData.length > 0">{{ $t('network.total') }}</div> <div class="npm-event-pie-legend-title" v-if="chartData.length > 0">{{ $t('network.total') }}</div>
<template v-for="(legend, index) in chartData" :key="index"> <template v-for="(legend, index) in chartData" :key="index">
<div class="npm-event-pie-legend-total">{{legend.count}}</div> <div class="npm-event-pie-legend-total">{{legend.value}}</div>
</template> </template>
</div> </div>
</div> </div>
@@ -83,7 +82,7 @@ export default {
formatter: function () { formatter: function () {
let num = 0 let num = 0
_this.chartData.forEach(t => { _this.chartData.forEach(t => {
num += t.count num += t.value
}) })
return num return num
} }
@@ -108,7 +107,7 @@ export default {
formatter: function () { formatter: function () {
let num = 0 let num = 0
_this.chartData.forEach(t => { _this.chartData.forEach(t => {
num += t.count num += t.value
}) })
return num return num
} }
@@ -123,32 +122,24 @@ export default {
type: 'severity' type: 'severity'
} }
this.toggleLoading(true) this.toggleLoading(true)
get(api.npm.events.list, params).then(res => { get(api.npm.events.recentEvents, params).then(res => {
if (res.code === 200) { if (res.code === 200) {
if (!res.data.result || res.data.result.length === 0) { if (!res.data.result || res.data.result.length === 0) {
this.isNoData = true this.isNoData = true
return return
} }
const arrData = []
res.data.result.forEach(t => { res.data.result.forEach(t => {
if (t.eventSeverity === 'critical') { const hit = arrData.find(e => e.name === t.eventType)
t.index = 0 if (hit) {
} else if (t.eventSeverity === 'high') { arrData.forEach(d => {
t.index = 1 d.value++
} else if (t.eventSeverity === 'info') { })
t.index = 4 } else {
} else if (t.eventSeverity === 'low') { arrData.push({ name: t.eventType, value: 1 })
t.index = 3
} else if (t.eventSeverity === 'medium') {
t.index = 2
}
})
this.chartData = res.data.result.sort((a, b) => { return a.index - b.index })
this.chartData = this.chartData.map(t => {
return {
...t,
value: t.count
} }
}) })
this.chartData = arrData.sort((a, b) => { return b.value - a.value })
this.init() this.init()
} else { } else {
this.isNoData = true this.isNoData = true