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

fix: 实体代码整理

Browse Source
This commit is contained in:
chenjinsong
2022-03-27 20:52:07 +08:00
parent f6f82d26c4
commit b9cdb81bc6
3 changed files with 34 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
src/views/detections/overview/DetectionPerformanceEventAppOverview.vue
View File

@@ -88,15 +88,14 @@
</template>
<script>
import { eventSeverityColor } from '@/utils/constants'
import { eventSeverityColor, unitTypes } from '@/utils/constants'
import { api, getData } from '@/utils/api'
import { unitTypes } from '@/utils/constants'
import { getSecond } from '@/utils/date-util'
import { get } from '@/utils/http'
import * as echarts from 'echarts'
import { markRaw } from 'vue'
import { metricOption } from '@/views/detections/options/detectionOptions'
import { sortBy,reverseSortBy } from '@/utils/tools'
import { sortBy, reverseSortBy } from '@/utils/tools'
export default {
name: 'DetectionPerformanceEventAppOverview',
props: {
@@ -106,7 +105,7 @@ export default {
return {
eventSeverityColor,
basicInfo: {},
metricList:[],
metricList: []
}
},
computed: {
@@ -139,15 +138,15 @@ export default {
})
this.queryMetric().then(responses => {
responses && (this.metricList = responses.values)
if(this.metricList.length>0){
if (this.metricList.length > 0) {
this.initChart()
}else {
let chartDom = document.getElementById(`detectionMetricChartApp${this.detection.appName}`)
} else {
const chartDom = document.getElementById(`detectionMetricChartApp${this.detection.appName}`)
chartDom.innerHTML = '<span style="padding-left:5px;">-</span>'
}
}).catch(error => {
console.log(error)
let chartDom = document.getElementById(`detectionMetricChartApp${this.detection.appName}`)
const chartDom = document.getElementById(`detectionMetricChartApp${this.detection.appName}`)
chartDom.innerHTML = '<span style="padding-left:5px;">-</span>'
}).finally(() => {
setTimeout(() => {
@@ -160,35 +159,35 @@ export default {
})
},
initChart(){
initChart () {
this.metricChart = markRaw(echarts.init(document.getElementById(`detectionMetricChartApp${this.detection.appName}`)))
this.chartOptionMetric = _.cloneDeep(this.chartOption)
this.metricList.sort(reverseSortBy(0))//将返回的数据按时间降序排序，方便找到实线和虚线的交点
//let endIndex = (this.metricList). findIndex ((item) => item[0] <= 1435781434781 );
let endIndex = (this.metricList). findIndex ((item) => item[0] <= this.detection.endTime );
endIndex = this.metricList.length-endIndex
this.metricList.sort(reverseSortBy(0))// 将返回的数据按时间降序排序，方便找到实线和虚线的交点
// let endIndex = (this.metricList). findIndex ((item) => item[0] <= 1435781434781 );
let endIndex = (this.metricList).findIndex((item) => item[0] <= this.detection.endTime)
endIndex = this.metricList.length - endIndex
this.metricList.sort(sortBy(0))//将返回的数据按时间升序排序，方便找到实线和虚线的交点
//let startIndex = (this.metricList). findIndex ((item) => item[0] >= 1435781432781 );
let startIndex = (this.metricList). findIndex ((item) => item[0] >= this.detection.startTime );
this.metricList.sort(sortBy(0))// 将返回的数据按时间升序排序，方便找到实线和虚线的交点
// let startIndex = (this.metricList). findIndex ((item) => item[0] >= 1435781432781 );
const startIndex = (this.metricList).findIndex((item) => item[0] >= this.detection.startTime)
if(startIndex >-1 && endIndex >-1){
this.chartOptionMetric.series[0].data = this.metricList.slice(0,startIndex).map(v => [Number(v[0])*1000, Number(v[1]), unitTypes.number])
this.chartOptionMetric.series[1].data = this.metricList.slice(startIndex-1,endIndex).map(v => [Number(v[0])*1000, Number(v[1]), unitTypes.number])
this.chartOptionMetric.series[2].data = this.metricList.slice(endIndex-1,this.metricList.length).map(v => [Number(v[0])*1000, Number(v[1]), unitTypes.number])
if (startIndex > -1 && endIndex > -1) {
this.chartOptionMetric.series[0].data = this.metricList.slice(0, startIndex).map(v => [Number(v[0]) * 1000, Number(v[1]), unitTypes.number])
this.chartOptionMetric.series[1].data = this.metricList.slice(startIndex - 1, endIndex).map(v => [Number(v[0]) * 1000, Number(v[1]), unitTypes.number])
this.chartOptionMetric.series[2].data = this.metricList.slice(endIndex - 1, this.metricList.length).map(v => [Number(v[0]) * 1000, Number(v[1]), unitTypes.number])
}
this.chartOptionMetric && this.metricChart.setOption(this.chartOptionMetric)
},
queryMetric() {
queryMetric () {
return new Promise((resolve, reject) => {
try {
let allTime = this.detection.endTime-this.detection.startTime
let nowTime = getSecond(new Date())
this.searchStartTime = this.detection.startTime-allTime/2
this.searchEndTime = _.min([nowTime,(this.detection.endTime+allTime/2)])
const allTime = this.detection.endTime - this.detection.startTime
const nowTime = getSecond(new Date())
this.searchStartTime = this.detection.startTime - allTime / 2
this.searchEndTime = _.min([nowTime, (this.detection.endTime + allTime / 2)])
get(api.detection.performanceEvent.metric, {
domain: this.detection.domain,
@@ -237,8 +236,8 @@ export default {
},
setup () {
return {
chartOption: metricOption,
chartOption: metricOption
}
},
}
}
</script>