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

Merge branch 'dev' of https://git.mesalab.cn/cyber-narrator/cn-ui into dev

Browse Source
This commit is contained in:
zhangxiaolong
2022-03-10 14:57:49 +08:00
parent 455ecae0c3 b02d6adac6
commit e57642f52c
6 changed files with 110 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/utils/date-util.js
View File

@@ -42,5 +42,5 @@ export function getNowTime (interval) {
}
// 日期格式转换
export function rTime (date) {
return window.$dayJs.tz(new Date(date)).format('YYYY-MM-DD HH:mm:ss')
return window.$dayJs.tz(new Date(date)).format('MM-DD HH:mm')
}

9
src/views/charts/charts/ChartEchart.vue
View File

@@ -100,6 +100,15 @@ export default {
unitType: chartParams.unitType ? chartParams.unitType : 'number'
}
})
}else {
this.chartOption.series[0].data = this.chartData.map(d => {
return {
name: lineToSpace(d.name),
data: d,
value: parseInt(d.num),
unitType: chartParams.unitType ? chartParams.unitType : 'number'
}
})
}
} else {
const seriesTemplate = this.chartOption.series[0]

3
src/views/charts/charts/options/line.js
View File

@@ -24,8 +24,7 @@ export const line = {
formatter: function (value, index, a, b) {
return unitConvert(value, unitTypes.number).join(' ')
}
},
minInterval: 1
}
},
animation: false,
grid: {

140
src/views/detections/Index.vue
View File

@@ -235,137 +235,147 @@ export default {
initEventSeverityTrendData (params) {
this.loading = true
getData(api.detection[this.pageType].eventSeverityTrend, params).then(data => {
/* data = [
/*data = [
{
"stat_time": "2022-01-01T10:07:03.008Z",
"event_severity": "critical",
"statTime": "2022-01-01T10:07:03.008Z",
"eventSeverity": "critical",
"count": 5
},
{
"stat_time": "2022-01-02T10:07:03.008Z",
"event_severity": "critical",
"statTime": "2022-01-02T10:07:03.008Z",
"eventSeverity": "critical",
"count": 15
},{
"stat_time": "2022-01-03T10:07:03.008Z",
"event_severity": "critical",
"statTime": "2022-01-03T10:07:03.008Z",
"eventSeverity": "critical",
"count": 25
},
{
"stat_time": "2022-01-04T10:07:03.008Z",
"event_severity": "critical",
"statTime": "2022-01-04T10:07:03.008Z",
"eventSeverity": "critical",
"count": 7
},{
"stat_time": "2022-01-01T10:07:03.008Z",
"event_severity": "high",
"statTime": "2022-01-01T10:07:03.008Z",
"eventSeverity": "high",
"count": 8
},
{
"stat_time": "2022-01-02T10:07:03.008Z",
"event_severity": "high",
"statTime": "2022-01-02T10:07:03.008Z",
"eventSeverity": "high",
"count": 2
},{
"stat_time": "2022-01-03T10:07:03.008Z",
"event_severity": "high",
"statTime": "2022-01-03T10:07:03.008Z",
"eventSeverity": "high",
"count": 25
},
{
"stat_time": "2022-01-04T10:07:03.008Z",
"event_severity": "high",
"statTime": "2022-01-04T10:07:03.008Z",
"eventSeverity": "high",
"count": 7
},{
"stat_time": "2022-01-01T10:07:03.008Z",
"event_severity": "medium",
"statTime": "2022-01-01T10:07:03.008Z",
"eventSeverity": "medium",
"count": 9
},
{
"stat_time": "2022-01-02T10:07:03.008Z",
"event_severity": "medium",
"statTime": "2022-01-02T10:07:03.008Z",
"eventSeverity": "medium",
"count": 15
},{
"stat_time": "2022-01-03T10:07:03.008Z",
"event_severity": "medium",
"statTime": "2022-01-03T10:07:03.008Z",
"eventSeverity": "medium",
"count": 35
},
{
"stat_time": "2022-01-04T10:07:03.008Z",
"event_severity": "medium",
"statTime": "2022-01-04T10:07:03.008Z",
"eventSeverity": "medium",
"count": 7
},{
"stat_time": "2022-01-01T10:07:03.008Z",
"event_severity": "low",
"statTime": "2022-01-01T10:07:03.008Z",
"eventSeverity": "low",
"count": 5
},
{
"stat_time": "2022-01-02T10:07:03.008Z",
"event_severity": "low",
"statTime": "2022-01-02T10:07:03.008Z",
"eventSeverity": "low",
"count": 1
},{
"stat_time": "2022-01-03T10:07:03.008Z",
"event_severity": "low",
"statTime": "2022-01-03T10:07:03.008Z",
"eventSeverity": "low",
"count": 25
},
{
"stat_time": "2022-01-04T10:07:03.008Z",
"event_severity": "low",
"statTime": "2022-01-04T10:07:03.008Z",
"eventSeverity": "low",
"count": 17
},{
"stat_time": "2022-01-01T10:07:03.008Z",
"event_severity": "info",
"statTime": "2022-01-01T10:07:03.008Z",
"eventSeverity": "info",
"count": 5
},
{
"stat_time": "2022-01-02T10:07:03.008Z",
"event_severity": "info",
"statTime": "2022-01-02T10:07:03.008Z",
"eventSeverity": "info",
"count": 15
},{
"stat_time": "2022-01-03T10:07:03.008Z",
"event_severity": "info",
"statTime": "2022-01-03T10:07:03.008Z",
"eventSeverity": "info",
"count": 25
},
{
"stat_time": "2022-01-04T10:07:03.008Z",
"event_severity": "info",
"statTime": "2022-01-04T10:07:03.008Z",
"eventSeverity": "info",
"count": 27
},
] */
/* data2 = [
{
legend: 'critical',
values: [[1435781430781, '999'], [1435781431781, '222'], [1435781432781, '11'], [1435781433781, '3']]
},
{
legend: 'high',
values: [[1435781430781, '2'], [1435781431781, '3'], [1435781432781, '6'], [1435781433781, '4']]
}, {
legend: 'medium',
values: [[1435781430781, '4'], [1435781431781, '1'], [1435781432781, '5'], [1435781433781, '3']]
}, {
legend: 'low',
values: [[1435781430781, '1'], [1435781431781, '4'], [1435781432781, '1'], [1435781433781, '3']]
}, {
legend: 'info',
values: [[1435781430781, '5'], [1435781431781, '7'], [1435781432781, '5'], [1435781433781, '8']]
}
] */
]*/
this.eventSeverityData = data
if (!this.$_.isEmpty(data)) {
const dataMap = new Map()
data.forEach(item => {
if (item.eventSeverity) {
if (!dataMap.has(item.eventSeverity)) {
const count = [[item.statTime, item.count]]
const count = [[rTime(item.statTime), item.count]]
dataMap.set(item.eventSeverity, count)
} else {
dataMap.get(item.eventSeverity).push([item.statTime, item.count])
dataMap.get(item.eventSeverity).push([rTime(item.statTime), item.count])
}
}
})
const chartDom = document.getElementById(`eventSeverityTrendBar${this.pageType}`)
const eventSeverityTrendOption = this.$_.cloneDeep(multipleBarOption)
let xData = []
dataMap.forEach(function (value, key) {
eventSeverityTrendOption.series[Number(getSeriesIndex(key))].data = value.map(v => Number(v[1]))
//eventSeverityTrendOption.series[Number(getSeriesIndex(key))].data = value.map(v => Number(v[1]))
value.forEach(item => {
if(xData.indexOf(item[0]) < 0){
xData.push(item[0])
}
})
})
eventSeverityTrendOption.xAxis.data = dataMap.get('critical').map(v => rTime(v[0]))
eventSeverityTrendOption.series.forEach(serie => {
let seriesData = []
xData.forEach(item => {
if(dataMap.has(serie.name)){
let hasX = dataMap.get(serie.name).some(function(v) {
if (item == v[0]) {
seriesData.push(Number(v[1]))
return true;
}
})
if(!hasX){
seriesData.push(0)
}
}else {
seriesData.push(0)
}
})
serie.data = seriesData
})
//eventSeverityTrendOption.xAxis.data = dataMap.get('info').map(v => rTime(v[0]))
eventSeverityTrendOption.xAxis.data = xData
const detectionChart = echarts.init(chartDom)
detectionChart.setOption(eventSeverityTrendOption)
// this.isEventSeverityNoData = false

24
src/views/detections/options/detectionOptions.js
View File

@@ -52,7 +52,7 @@ export const multipleBarOption = {
legend: {
icon: 'circle',
top: 10,
right: 10,
right: 30,
itemWidth: 10, // 设置宽度
itemHeight: 10 // 设置高度
},
@@ -72,7 +72,7 @@ export const multipleBarOption = {
},
axisLabel: {
color: '#737373',
interval: 0
interval: 'auto'
},
splitLine: {
show: false
@@ -104,6 +104,10 @@ export const multipleBarOption = {
{
name: 'critical',
type: 'bar',
stack:'eventSeverityTrend',
emphasis: {
focus: 'series'
},
barWidth: 15,
seriesLayoutBy: 'row',
itemStyle: {
@@ -113,6 +117,10 @@ export const multipleBarOption = {
{
name: 'high',
type: 'bar',
stack:'eventSeverityTrend',
emphasis: {
focus: 'series'
},
barWidth: 15,
seriesLayoutBy: 'row',
itemStyle: {
@@ -122,6 +130,10 @@ export const multipleBarOption = {
{
name: 'medium',
type: 'bar',
stack:'eventSeverityTrend',
emphasis: {
focus: 'series'
},
barWidth: 15,
seriesLayoutBy: 'row',
itemStyle: {
@@ -131,6 +143,10 @@ export const multipleBarOption = {
{
name: 'low',
type: 'bar',
stack:'eventSeverityTrend',
emphasis: {
focus: 'series'
},
barWidth: 15,
seriesLayoutBy: 'row',
itemStyle: {
@@ -140,6 +156,10 @@ export const multipleBarOption = {
{
name: 'info',
type: 'bar',
stack:'eventSeverityTrend',
emphasis: {
focus: 'series'
},
barWidth: 15,
seriesLayoutBy: 'row',
itemStyle: {

3
src/views/detections/overview/DetectionSecurityEventOverview.vue
View File

@@ -172,13 +172,14 @@ export default {
},
computed: {
formatT0 () {
const vm = this
return function (event) {
const diffSeconds = event.diffSeconds
if (diffSeconds === 0) {
return 'T0'
}
const eventStartTime = event.startTime
const entityStartTime = this.detection.startTime
const entityStartTime = vm.detection.startTime
if (_.isNumber(diffSeconds) && _.isNumber(eventStartTime) && _.isNumber(entityStartTime)) {
const suffix = unitConvert(diffSeconds, unitTypes.time, 's', null, 0).join('')