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

CN-1461 提取界面各功能的默认时间条件至config.js

Browse Source
This commit is contained in:
hyx
2023-11-13 17:23:32 +08:00
parent 051aeadbca
commit 38368a6cb8
24 changed files with 291 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/common/TimeRange/DateTimeRange.vue
View File

@@ -129,7 +129,8 @@ export default {
showDetail () {
let str = ''
if (this.dateRangeValue !== -1) {
str = this.dateRangeArr.find(item => item.value === this.dateRangeValue).name
const rangeItem = this.dateRangeArr.find(item => item.value === this.dateRangeValue)
str = rangeItem ? rangeItem.name : this.dateRangeArr[0].name
}
return str
}

4
src/components/layout/Header.vue
View File

@@ -409,10 +409,10 @@ export default {
const endTimeParam = query.endTime
// 若url携带了，使用携带的值，否则使用默认值。
const dateRangeValue = rangeParam ? parseInt(query.range) : 60
const dateRangeValue = rangeParam ? parseInt(rangeParam) : 60
const chartTimeFilter = ref({ dateRangeValue })
if (!startTimeParam || !endTimeParam) {
const { startTime, endTime } = getNowTime(60)
const { startTime, endTime } = getNowTime(dateRangeValue)
chartTimeFilter.value.startTime = startTime
chartTimeFilter.value.endTime = endTime
} else {

4
src/mixins/relatedServer.js
View File

@@ -17,7 +17,7 @@ export default {
// 请求数据 relationshipUrlOne => 路由 refOne => ref
getRelatedServerDataOne (relationshipUrlOne, refOne) {
this.loadingRelationshipOne = true
axios.get(relationshipUrlOne, { params: this.getQueryParams() }).then(response => {
axios.get(relationshipUrlOne, { params: this.getQueryParams(DEFAULT_TIME_FILTER_RANGE.entity.relatedEntity) }).then(response => {
if (response.status === 200) {
const relationshipDataOne = []
if (response.data.data.result.length > 0) {
@@ -33,7 +33,7 @@ export default {
},
getRelatedServerDataTwo (relationshipUrlTow, refTow) {
this.loadingRelationshipTwo = true
axios.get(relationshipUrlTow, { params: this.getQueryParams() }).then(response => {
axios.get(relationshipUrlTow, { params: this.getQueryParams(DEFAULT_TIME_FILTER_RANGE.entity.relatedEntity) }).then(response => {
if (response.status === 200) {
const relationshipDataTwo = []
if (response.data.data.result.length > 0) {

7
src/utils/constants.js
View File

@@ -98,6 +98,11 @@ export const entityType = {
ip: 'IP'
}
export const knowledgeCardUpdateRecordType = {
updateRecord: 'updateRecord',
intelligenceLearning: 'intelligenceLearning'
}
export const entityDetailTabsName = {
informationAggregation: 'informationAggregation',
relatedEntity: 'relatedEntity',
@@ -213,7 +218,7 @@ export const detectionPageType = {
}
export const listScrollPath = [
'/entity',
'/entityExplorer',
'/detection/performanceEvent',
'/detection/securityEvent'
]

4
src/views/charts2/Panel.vue
View File

@@ -300,10 +300,10 @@ export default {
const endTimeParam = query.endTime
// 优先级：url > config.js > 默认值。
const dateRangeValue = rangeParam ? parseInt(query.range) : (DEFAULT_TIME_FILTER_RANGE.dashboard || 60)
const dateRangeValue = rangeParam ? parseInt(rangeParam) : (DEFAULT_TIME_FILTER_RANGE.dashboard || 60)
const timeFilter = ref({ dateRangeValue })
if (!startTimeParam || !endTimeParam) {
const { startTime, endTime } = getNowTime(60)
const { startTime, endTime } = getNowTime(dateRangeValue)
timeFilter.value.startTime = getSecond(startTime)
timeFilter.value.endTime = getSecond(endTime)
// 如果没有时间参数，就将参数写入url

56
src/views/charts2/chart-mixin.js
View File

@@ -1,4 +1,5 @@
import { entityDetailRelatedEntitiesShowSize } from '@/utils/constants'
import { entityDetailRelatedEntitiesShowSize, entityDetailTabsName } from '@/utils/constants'
import { getSecond } from '@/utils/date-util'
export default {
props: {
@@ -28,6 +29,59 @@ export default {
}
}
},
getParamsByTabType (tabType) {
let params = {
resource: this.entity.entityName
}
let dataRangeValue = 60 * 24 * 7
switch (tabType) {
case entityDetailTabsName.relatedEntity:
dataRangeValue = DEFAULT_TIME_FILTER_RANGE.entity.relatedEntity
break
case entityDetailTabsName.performanceEvent:
dataRangeValue = DEFAULT_TIME_FILTER_RANGE.entity.performanceEvent
break
case entityDetailTabsName.securityEvent:
dataRangeValue = DEFAULT_TIME_FILTER_RANGE.entity.securityEvent
break
case entityDetailTabsName.openPort:
dataRangeValue = DEFAULT_TIME_FILTER_RANGE.entity.openPort
break
case entityDetailTabsName.informationAggregation:
dataRangeValue = DEFAULT_TIME_FILTER_RANGE.entity.informationAggregation
break
case entityDetailTabsName.behaviorPattern:
dataRangeValue = DEFAULT_TIME_FILTER_RANGE.entity.behaviorPattern
break
default:
dataRangeValue = 60 * 24 * 7
}
if (dataRangeValue !== 0) {
const endTime = window.$dayJs.tz().valueOf()
const startTime = endTime - dataRangeValue * 60 * 1000
params = {
...params,
startTime: getSecond(startTime),
endTime: getSecond(endTime)
}
}
return params
},
getParams () {
const range = this.timeFilter.dateRangeValue
let params = {
resource: this.entity.entityName
}
if (range !== 0) {
params = {
...params,
startTime: getSecond(this.timeFilter.startTime),
endTime: getSecond(this.timeFilter.endTime)
}
}
return params
},
handleShowDataNum (showListInfo, allList) {
if (allList.length <= entityDetailRelatedEntitiesShowSize) {
showListInfo.num = allList.length

6
src/views/charts2/charts/entityDetail/EntityDetailLine.vue
View File

@@ -124,12 +124,12 @@ export default {
const rangeParam = query.range
const startTimeParam = query.startTime
const endTimeParam = query.endTime
// 若url携带了，使用携带的值，否则使用默认值。
const dateRangeValue = rangeParam ? parseInt(query.range) : 60
// 优先级：url > config.js > 默认值。
const dateRangeValue = rangeParam ? parseInt(rangeParam) : (DEFAULT_TIME_FILTER_RANGE.entity.trafficLine || 60)
const timeFilter = ref({ dateRangeValue })
if (!startTimeParam || !endTimeParam) {
const { startTime, endTime } = getNowTime(60)
const { startTime, endTime } = getNowTime(dateRangeValue)
timeFilter.value.startTime = startTime
timeFilter.value.endTime = endTime
} else {

73
src/views/charts2/charts/entityDetail/EntityDetailTabs.vue
View File

@@ -15,12 +15,12 @@
</el-tag>
</template>
<information-aggregation v-if="tab.name === entityDetailTabsName.informationAggregation && tab.name === activeTab" @toggleLoading="setLoading" :entity="entity" @checkTag="setTag"></information-aggregation>
<domain-name-resolution v-else-if="tab.name === entityDetailTabsName.relatedEntity && tab.name === activeTab" @toggleLoading="setLoading" :entity="entity" :timeFilter="oneDayTimeFilter" @checkTag="setTag"></domain-name-resolution>
<digital-certificate v-else-if="tab.name === entityDetailTabsName.digitalCertificate && tab.name === activeTab" @toggleLoading="setLoading" :timeFilter="oneDayTimeFilter" @checkTag="setTag" />
<security-event v-else-if="tab.name === entityDetailTabsName.securityEvent && tab.name === activeTab" @toggleLoading="setLoading" :timeFilter="oneDayTimeFilter" @checkTag="setTag" />
<performance-event v-else-if="tab.name === entityDetailTabsName.performanceEvent && tab.name === activeTab" @toggleLoading="setLoading" :timeFilter="oneDayTimeFilter" @checkTag="setTag" />
<open-port v-else-if="tab.name === entityDetailTabsName.openPort && tab.name === activeTab" @toggleLoading="setLoading" :entity="entity" :timeFilter="oneDayTimeFilter" @checkTag="setTag"></open-port>
<behavior-pattern v-else-if="tab.name === entityDetailTabsName.behaviorPattern && tab.name === activeTab" @toggleLoading="setLoading" :entity="entity" :timeFilter="oneDayTimeFilter" @checkTag="setTag"></behavior-pattern>
<domain-name-resolution v-else-if="tab.name === entityDetailTabsName.relatedEntity && tab.name === activeTab" @toggleLoading="setLoading" :entity="entity" @checkTag="setTag"></domain-name-resolution>
<digital-certificate v-else-if="tab.name === entityDetailTabsName.digitalCertificate && tab.name === activeTab" @toggleLoading="setLoading" @checkTag="setTag" />
<security-event v-else-if="tab.name === entityDetailTabsName.securityEvent && tab.name === activeTab" @toggleLoading="setLoading" :entity="entity" @checkTag="setTag" />
<performance-event v-else-if="tab.name === entityDetailTabsName.performanceEvent && tab.name === activeTab" @toggleLoading="setLoading" :entity="entity" @checkTag="setTag" />
<open-port v-else-if="tab.name === entityDetailTabsName.openPort && tab.name === activeTab" @toggleLoading="setLoading" :entity="entity" @checkTag="setTag"></open-port>
<behavior-pattern v-else-if="tab.name === entityDetailTabsName.behaviorPattern && tab.name === activeTab" @toggleLoading="setLoading" :entity="entity" @checkTag="setTag"></behavior-pattern>
</el-tab-pane>
</el-tabs>
</div>
@@ -58,12 +58,7 @@ export default {
},
data () {
return {
timer: null,
// 最近一天的时间
oneDayTimeFilter: {
startTime: window.$dayJs.tz().valueOf() - 1440 * 60 * 1000,
endTime: window.$dayJs.tz().valueOf()
}
timer: null
}
},
watch: {
@@ -114,22 +109,17 @@ export default {
},
methods: {
initData () {
const params = {
resource: this.entity.entityName
// startTime: getSecond(this.oneDayTimeFilter.startTime),
// endTime: getSecond(this.oneDayTimeFilter.endTime)
}
const url = this.getUrlByEntityType(this.entity.entityType)
const informationAggregation = axios.get(`${api.entity.informationAggregation}/${this.entity.entityType}?resource=${this.entity.entityName}&pageSize=100&pageNo=1`, { params: params })
const openPort = axios.get(url, { params: params })
// const security = axios.get(`${api.entity.security}/${this.entity.entityType}`, { params: params })
// const performance = axios.get(`${api.entity.performance}/${this.entityType}`, { params: params })
const informationAggregation = axios.get(`${api.entity.informationAggregation}/${this.entity.entityType}?resource=${this.entity.entityName}&pageSize=100&pageNo=1`, { params: this.getParamsByTabType(entityDetailTabsName.informationAggregation) })
const openPort = axios.get(url, { params: this.getParamsByTabType(entityDetailTabsName.openPort) })
const security = axios.get(`${api.entity.security}/${this.entity.entityType}`, { params: this.getParamsByTabType(entityDetailTabsName.securityEvent) })
const performance = axios.get(`${api.entity.performance}/${this.entityType}`, { params: this.getParamsByTabType(entityDetailTabsName.performanceEvent) })
Promise.all([informationAggregation, openPort]).then(response => {
if (response[0].status === 200) {
Promise.allSettled([informationAggregation, openPort, security, performance]).then(response => {
const informationAggregationResponse = response[0].value
if (informationAggregationResponse.status === 200) {
const list = []
response[0].data.data.result.forEach(r => {
informationAggregationResponse.data.data.result.forEach(r => {
Object.keys(r).forEach(k => {
const aggregation = {
createTime: r[k].createTime,
@@ -152,40 +142,43 @@ export default {
}
})
})
this.initSetTag(entityDetailTabsName.informationAggregation, list.length)
}
if (response[1].status === 200) {
this.initSetTag(entityDetailTabsName.openPort, response[1].data.data.result.length)
const openPortResponse = response[1].value
if (openPortResponse.status === 200) {
this.initSetTag(entityDetailTabsName.openPort, openPortResponse.data.data.result.length)
}
// if (response[2].status === 200) {
// this.initSetTag(entityDetailTabsName.securityEvent, response[2].data.data.result.length)
// let securityResponse = response[2].value
// if (securityResponse.status === 200) {
// this.initSetTag(entityDetailTabsName.securityEvent, securityResponse.data.data.result.length)
// }
// if (response[3].status === 200) {
// this.initSetTag(entityDetailTabsName.performanceEvent, response[3].data.data.result.length)
// let performanceResponse = response[3].value
// if (performanceResponse.status === 200) {
// this.initSetTag(entityDetailTabsName.performanceEvent, performanceResponse.data.data.result.length)
// }
this.initSetTag(entityDetailTabsName.securityEvent, 0)
this.initSetTag(entityDetailTabsName.performanceEvent, 0)
})
const relatedEntityParams = this.getParamsByTabType(entityDetailTabsName.relatedEntity)
// 域名解析
if (this.entity.entityType === 'app') {
const ipsOfApp = axios.get(api.entity.domainNameResolutionAboutIpsOfApp, { params: params })
const domainsOfApp = axios.get(api.entity.domainNameResolutionAboutDomainsOfApp, { params: params })
const ipsOfApp = axios.get(api.entity.domainNameResolutionAboutIpsOfApp, { params: relatedEntityParams })
const domainsOfApp = axios.get(api.entity.domainNameResolutionAboutDomainsOfApp, { params: relatedEntityParams })
this.promiseData(ipsOfApp, domainsOfApp)
}
if (this.entity.entityType === 'ip') {
const appsOfIp = axios.get(api.entity.domainNameResolutionAboutAppsOfIp, { params: params })
const domainsOfIp = axios.get(api.entity.domainNameResolutionAboutDomainsOfIp, { params: params })
const behaviorPattern = axios.get(api.entity.behaviorPattern, { params: params })
const appsOfIp = axios.get(api.entity.domainNameResolutionAboutAppsOfIp, { params: relatedEntityParams })
const domainsOfIp = axios.get(api.entity.domainNameResolutionAboutDomainsOfIp, { params: relatedEntityParams })
const behaviorPattern = axios.get(api.entity.behaviorPattern, { params: relatedEntityParams })
this.promiseData(appsOfIp, domainsOfIp, behaviorPattern)
}
if (this.entity.entityType === 'domain') {
const appsOfDomain = axios.get(api.entity.domainNameResolutionAboutAppsOfDomain, { params: params })
const ipsOfDomain = axios.get(api.entity.domainNameResolutionAboutIpsOfDomain, { params: params })
const fqdnsOfDomain = axios.get(api.entity.domainNameResolutionAboutFQDNsOfDomain, { params: params })
const appsOfDomain = axios.get(api.entity.domainNameResolutionAboutAppsOfDomain, { params: relatedEntityParams })
const ipsOfDomain = axios.get(api.entity.domainNameResolutionAboutIpsOfDomain, { params: relatedEntityParams })
const fqdnsOfDomain = axios.get(api.entity.domainNameResolutionAboutFQDNsOfDomain, { params: relatedEntityParams })
this.promiseData(appsOfDomain, ipsOfDomain, fqdnsOfDomain)
}
},

17
src/views/charts2/charts/entityDetail/tabs/BehaviorPattern.vue
View File

@@ -20,10 +20,10 @@
</template>
<script>
import { dateFormatByAppearance } from '@/utils/date-util'
import { dateFormatByAppearance, getNowTime } from '@/utils/date-util'
import * as echarts from 'echarts'
import { pieChartOption4 } from '@/views/charts2/charts/options/echartOption'
import { shallowRef } from 'vue'
import { shallowRef, ref } from 'vue'
import { entityDetailTabsName, chartColorForBehaviorPattern, unitTypes } from '@/utils/constants'
import unitConvert from '@/utils/unit-convert'
import axios from 'axios'
@@ -49,13 +49,20 @@ export default {
const { query } = useRoute()
const entityType = query.entityType
const entityName = query.entityName
// range取 config.js 中配置的值
const dateRangeValue = DEFAULT_TIME_FILTER_RANGE.entity.behaviorPattern
const timeFilter = ref({ dateRangeValue })
const { startTime, endTime } = getNowTime(dateRangeValue)
timeFilter.value.startTime = startTime
timeFilter.value.endTime = endTime
return {
entityType,
entityName,
myChart: shallowRef(null),
chartColorForBehaviorPattern,
unitTypes
unitTypes,
timeFilter
}
},
async mounted () {
@@ -130,9 +137,7 @@ export default {
})
},
async initData () {
const params = {
resource: this.entityName
}
const params = this.getParams()
this.toggleLoading(true)
await axios.get(`${api.entity.behaviorPattern}`, { params: params }).then(response => {
const res = response.data

22
src/views/charts2/charts/entityDetail/tabs/DomainNameResolution.vue
View File

@@ -70,15 +70,15 @@
<script>
import axios from 'axios'
import { api } from '@/utils/api'
import { getNowTime } from '@/utils/date-util'
import chartMixin from '@/views/charts2/chart-mixin'
import chartNoData from '@/views/charts/charts/ChartNoData'
import { entityDetailTabsName } from '@/utils/constants'
import { ref } from 'vue'
export default {
name: 'DomainNameResolution',
mixins: [chartMixin],
props: {
},
components: {
chartNoData
},
@@ -105,16 +105,24 @@ export default {
errorMsg2: ''
}
},
setup (props) {
// range取 config.js 中配置的值
const dateRangeValue = DEFAULT_TIME_FILTER_RANGE.entity.relatedEntity
const timeFilter = ref({ dateRangeValue })
const { startTime, endTime } = getNowTime(dateRangeValue)
timeFilter.value.startTime = startTime
timeFilter.value.endTime = endTime
return {
timeFilter
}
},
mounted () {
this.initData()
},
methods: {
initData () {
const params = {
resource: this.entity.entityName
// startTime: getSecond(this.timeFilter.startTime),
// endTime: getSecond(this.timeFilter.endTime)
}
const params = this.getParams()
if (this.entity.entityType === 'app') {
const ipsOfApp = axios.get(api.entity.domainNameResolutionAboutIpsOfApp, { params: params })
const domainsOfApp = axios.get(api.entity.domainNameResolutionAboutDomainsOfApp, { params: params })

22
src/views/charts2/charts/entityDetail/tabs/InformationAggregation.vue
View File

@@ -72,8 +72,9 @@ import chartMixin from '@/views/charts2/chart-mixin'
import axios from 'axios'
import { api } from '@/utils/api'
import { entityDetailTabsName, entityDetailTags, tagValueLabelMapping } from '@/utils/constants'
import { dateFormatByAppearance } from '@/utils/date-util'
import { dateFormatByAppearance, getNowTime } from '@/utils/date-util'
import chartNoData from '@/views/charts/charts/ChartNoData'
import { ref } from 'vue'
export default {
name: 'InformationAggregation',
@@ -83,6 +84,18 @@ export default {
loading: true
}
},
setup (props) {
// range取 config.js 中配置的值
const dateRangeValue = DEFAULT_TIME_FILTER_RANGE.entity.informationAggregation
const timeFilter = ref({ dateRangeValue })
const { startTime, endTime } = getNowTime(dateRangeValue)
timeFilter.value.startTime = startTime
timeFilter.value.endTime = endTime
return {
timeFilter
}
},
mixins: [chartMixin],
components: { chartNoData },
methods: {
@@ -108,7 +121,12 @@ export default {
this.showError = false
this.toggleLoading(true)
this.informationAggregationList = []
axios.get(`${api.entity.informationAggregation}/${this.entity.entityType}?resource=${this.entity.entityName}&pageSize=100&pageNo=1`).then(response => {
const params = this.getParams()
let timeStr = ''
if (params.startTime && params.endTime) {
timeStr = '&startTime=' + params.startTime + '&endTime=' + params.endTime
}
axios.get(`${api.entity.informationAggregation}/${this.entity.entityType}?resource=${this.entity.entityName}&pageSize=100&pageNo=1${timeStr}`).then(response => {
const res = response.data
if (response.status === 200) {
// this.isNoData = res.data.result.length === 0

21
src/views/charts2/charts/entityDetail/tabs/OpenPort.vue
View File

@@ -27,6 +27,8 @@ import chartMixin from '@/views/charts2/chart-mixin'
import { api } from '@/utils/api'
import chartNoData from '@/views/charts/charts/ChartNoData'
import { entityDetailTabsName } from '@/utils/constants'
import { ref } from 'vue'
import { getNowTime } from '@/utils/date-util'
export default {
name: 'OpenPort',
@@ -50,16 +52,21 @@ export default {
mounted () {
this.initData()
},
setup () {
setup (props) {
// range取 config.js 中配置的值
const dateRangeValue = DEFAULT_TIME_FILTER_RANGE.entity.openPort
const timeFilter = ref({ dateRangeValue })
const { startTime, endTime } = getNowTime(dateRangeValue)
timeFilter.value.startTime = startTime
timeFilter.value.endTime = endTime
return {
timeFilter
}
},
methods: {
initData () {
const params = {
resource: this.entity.entityName
// startTime: getSecond(this.timeFilter.startTime),
// endTime: getSecond(this.timeFilter.endTime)
}
const params = this.getParams()
this.toggleLoading(true)
const url = this.getUrlByEntityType(this.entity.entityType)
axios.get(url, { params: params }).then(response => {

24
src/views/charts2/charts/entityDetail/tabs/PerformanceEvent.vue
View File

@@ -50,7 +50,7 @@
</template>
<script>
import { dateFormatByAppearance } from '@/utils/date-util'
import { dateFormatByAppearance, getNowTime } from '@/utils/date-util'
import { eventSeverityColor, entityDetailTabsName, securityLevel } from '@/utils/constants'
import unitConvert from '@/utils/unit-convert'
import axios from 'axios'
@@ -60,6 +60,7 @@ import chartMixin from '@/views/charts2/chart-mixin'
import ChartError from '@/components/common/Error'
import { toUpperCaseByString } from '@/utils/tools'
import ChartNoData from '@/views/charts/charts/ChartNoData'
import { ref } from 'vue'
export default {
name: 'PerformanceEvent',
@@ -77,33 +78,36 @@ export default {
const { query } = useRoute()
const entityType = query.entityType
const entityName = query.entityName
// range取 config.js 中配置的值
const dateRangeValue = DEFAULT_TIME_FILTER_RANGE.entity.performanceEvent
const timeFilter = ref({ dateRangeValue })
const { startTime, endTime } = getNowTime(dateRangeValue)
timeFilter.value.startTime = startTime
timeFilter.value.endTime = endTime
return {
entityType,
entityName
entityName,
timeFilter
}
},
mounted () {
// this.initData()
this.initData()
/*
this.isNoData = true
this.$emit('checkTag', entityDetailTabsName.performanceEvent, 0)
this.toggleLoading(true)
const timer = setTimeout(() => {
this.toggleLoading(false)
clearInterval(timer)
}, 200)
}, 200) */
},
methods: {
unitConvert,
toUpperCaseByString,
dateFormatByAppearance,
initData () {
const params = {
resource: this.entityName
// startTime: getSecond(this.timeFilter.startTime),
// endTime: getSecond(this.timeFilter.endTime)
}
const params = this.getParams()
this.toggleLoading(true)
axios.get(`${api.entity.performance}/${this.entityType}`, { params: params }).then(response => {
const res = response.data

24
src/views/charts2/charts/entityDetail/tabs/SecurityEvent.vue
View File

@@ -76,7 +76,7 @@
</template>
<script>
import { dateFormatByAppearance } from '@/utils/date-util'
import { dateFormatByAppearance, getNowTime } from '@/utils/date-util'
import { eventSeverityColor, entityDetailTabsName, securityLevel } from '@/utils/constants'
import unitConvert from '@/utils/unit-convert'
import axios from 'axios'
@@ -85,6 +85,7 @@ import { useRoute } from 'vue-router'
import chartMixin from '@/views/charts2/chart-mixin'
import { toUpperCaseByString } from '@/utils/tools'
import chartNoData from '@/views/charts/charts/ChartNoData'
import { ref } from 'vue'
export default {
name: 'SecurityEvent',
@@ -102,33 +103,36 @@ export default {
const { query } = useRoute()
const entityType = query.entityType
const entityName = query.entityName
// range取 config.js 中配置的值
const dateRangeValue = DEFAULT_TIME_FILTER_RANGE.entity.securityEvent
const timeFilter = ref({ dateRangeValue })
const { startTime, endTime } = getNowTime(dateRangeValue)
timeFilter.value.startTime = startTime
timeFilter.value.endTime = endTime
return {
entityType,
entityName
entityName,
timeFilter
}
},
mounted () {
// this.initData()
this.initData()
/*
this.isNoData = true
this.$emit('checkTag', entityDetailTabsName.securityEvent, 0)
this.toggleLoading(true)
const timer = setTimeout(() => {
this.toggleLoading(false)
clearInterval(timer)
}, 200)
}, 200) */
},
methods: {
unitConvert,
toUpperCaseByString,
dateFormatByAppearance,
initData () {
const params = {
resource: this.entityName
// startTime: getSecond(this.timeFilter.startTime),
// endTime: getSecond(this.timeFilter.endTime)
}
const params = this.getParams()
this.toggleLoading(true)
axios.get(`${api.entity.security}/${this.entityType}`, { params: params }).then(response => {
const res = response.data

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

@@ -442,6 +442,9 @@ export default {
securityTypeOption.series[0].data = data.map(d => {
return { value: d.count, name: d.eventType }
})
if (data.length > 6) {
securityTypeOption.legend.formatter = tooLongFormatterFor2Columns
}
detectionChart.setOption(securityTypeOption)
const vm = this
@@ -987,10 +990,11 @@ export default {
const rangeParam = query.range
const startTimeParam = query.startTime
const endTimeParam = query.endTime
const dateRangeValue = rangeParam ? parseInt(query.range) : 60
// 优先级：url > config.js > 默认值。
const dateRangeValue = rangeParam ? parseInt(rangeParam) : (DEFAULT_TIME_FILTER_RANGE.detection || 60)
const timeFilter = ref({ dateRangeValue })
if (!startTimeParam || !endTimeParam) {
const { startTime, endTime } = getNowTime(60)
const { startTime, endTime } = getNowTime(dateRangeValue)
timeFilter.value.startTime = getSecond(startTime)
timeFilter.value.endTime = getSecond(endTime)
// 如果没有时间参数，就将参数写入url

13
src/views/entityExplorer/EntityExplorer.vue
View File

@@ -317,6 +317,13 @@ export default {
},
reload (s, e, v) {
this.dateTimeRangeChange(s, e, v)
const { startTime, endTime } = getNowTime(this.timeFilter.dateRangeValue)
const newParam = {
range: this.timeFilter.dateRangeValue,
startTime: getSecond(startTime),
endTime: getSecond(endTime)
}
this.reloadUrl(newParam)
},
// methods
dateTimeRangeChange (s, e, v) {
@@ -840,11 +847,11 @@ export default {
const rangeParam = query.range
const startTimeParam = query.startTime
const endTimeParam = query.endTime
// 若url携带了，使用携带的值，否则使用默认值。
const dateRangeValue = rangeParam ? parseInt(query.range) : 60
// 优先级：url > config.js > 默认值。
const dateRangeValue = rangeParam ? parseInt(rangeParam) : (DEFAULT_TIME_FILTER_RANGE.entity.list || 60)
const timeFilter = ref({ dateRangeValue })
if (!startTimeParam || !endTimeParam) {
const { startTime, endTime } = getNowTime(60)
const { startTime, endTime } = getNowTime(dateRangeValue)
timeFilter.value.startTime = startTime
timeFilter.value.endTime = endTime
} else {

14
src/views/entityExplorer/entityList/detailOverview/App.vue
View File

@@ -216,7 +216,7 @@ import Chart from '@/views/charts/Chart'
import _ from 'lodash'
import axios from 'axios'
import relatedServer from '@/mixins/relatedServer'
import { dateFormatByAppearance, getMillisecond, getSecond } from '@/utils/date-util'
import { dateFormatByAppearance, getMillisecond, getSecond, getNowTime } from '@/utils/date-util'
import Loading from '@/components/common/Loading'
import { ref } from 'vue'
@@ -320,12 +320,22 @@ export default {
methods: {
getMillisecond,
dateFormatByAppearance,
getQueryParams () {
getQueryParams (dateRangeValue) {
if (dateRangeValue) {
// range取 config.js 中配置的值
const { startTime, endTime } = getNowTime(dateRangeValue)
return {
startTime: getSecond(startTime),
endTime: getSecond(endTime),
resource: this.entity.entityValue
}
} else {
return {
startTime: getSecond(this.timeFilter.startTime),
endTime: getSecond(this.timeFilter.endTime),
resource: this.entity.entityValue
}
}
},
getPerformanceQueryParams () {
return {

14
src/views/entityExplorer/entityList/detailOverview/Domain.vue
View File

@@ -219,7 +219,7 @@ import Chart from '@/views/charts/Chart'
import _ from 'lodash'
import axios from 'axios'
import relatedServer from '@/mixins/relatedServer'
import { dateFormatByAppearance, getMillisecond, getSecond } from '@/utils/date-util'
import { dateFormatByAppearance, getMillisecond, getSecond, getNowTime } from '@/utils/date-util'
import Loading from '@/components/common/Loading'
import { ref } from 'vue'
@@ -324,12 +324,22 @@ export default {
methods: {
getMillisecond,
dateFormatByAppearance,
getQueryParams () {
getQueryParams (dateRangeValue) {
if (dateRangeValue) {
// range取 config.js 中配置的值
const { startTime, endTime } = getNowTime(dateRangeValue)
return {
startTime: getSecond(startTime),
endTime: getSecond(endTime),
resource: this.entity.entityValue
}
} else {
return {
startTime: getSecond(this.timeFilter.startTime),
endTime: getSecond(this.timeFilter.endTime),
resource: this.entity.entityValue
}
}
},
getPerformanceQueryParams () {
return {

14
src/views/entityExplorer/entityList/detailOverview/Ip.vue
View File

@@ -251,7 +251,7 @@ import { valueToRangeValue } from '@/utils/unit-convert'
import Chart from '@/views/charts/Chart'
import _ from 'lodash'
import relatedServer from '@/mixins/relatedServer'
import { dateFormatByAppearance, getMillisecond, getSecond } from '@/utils/date-util'
import { dateFormatByAppearance, getMillisecond, getSecond, getNowTime } from '@/utils/date-util'
import Loading from '@/components/common/Loading'
import axios from 'axios'
@@ -404,12 +404,22 @@ export default {
methods: {
getMillisecond,
dateFormatByAppearance,
getQueryParams () {
getQueryParams (dateRangeValue) {
if (dateRangeValue) {
// range取 config.js 中配置的值
const { startTime, endTime } = getNowTime(dateRangeValue)
return {
startTime: getSecond(startTime),
endTime: getSecond(endTime),
resource: this.entity.entityValue
}
} else {
return {
startTime: getSecond(this.timeFilter.startTime),
endTime: getSecond(this.timeFilter.endTime),
resource: this.entity.entityValue
}
}
},
getPerformanceQueryParams () {
return {

10
src/views/entityExplorer/entityList/detailOverview/entityDetailMixin.js
View File

@@ -121,7 +121,7 @@ export default {
this.sentChart = echarts.init(document.getElementById(`entityDetailSend${this.entityName}`))
this.receivedChart = echarts.init(document.getElementById(`entityDetailReceived${this.entityName}`))
this.loadingTraffic = true
axios.get(this.trafficUrl, { params: this.getQueryParams() }).then(response => {
axios.get(this.trafficUrl, { params: this.getQueryParams(DEFAULT_TIME_FILTER_RANGE.entity.trafficLine) }).then(response => {
if (response.status === 200 && response.data.data.result && response.data.data.result.length > 0) {
response.data.data.result.forEach(t => {
if (t.legend === 'rate') {
@@ -278,7 +278,7 @@ export default {
this.performanceScoreData = {}
this.scoreDataState = false
if (this.networkQuantityUrl) {
axios.get(this.networkQuantityUrl, { params: this.getQueryParams() }).then(response => {
axios.get(this.networkQuantityUrl, { params: this.getQueryParams(DEFAULT_TIME_FILTER_RANGE.entity.trafficLine) }).then(response => {
if (response.status === 200) {
this.performanceScoreData = {
establishLatencyMs: response.data.data.result.establishLatencyMsAvg || null,
@@ -347,7 +347,7 @@ export default {
queryEntityDetailPerformance () {
this.loadingAlert = true
axios.get(this.performanceUrl, { params: this.getQueryParams() }).then(response => {
axios.get(this.performanceUrl, { params: this.getQueryParams(DEFAULT_TIME_FILTER_RANGE.entity.performanceEvent) }).then(response => {
if (response.status === 200) {
this.entityData.performanceNum = response.data.data.result.length
this.performanceData = response.data.data.result
@@ -359,7 +359,7 @@ export default {
queryEntityDetailSecurity () {
this.loadingSecurityEvents = true
axios.get(this.securityUrl, { params: this.getQueryParams() }).then(response => {
axios.get(this.securityUrl, { params: this.getQueryParams(DEFAULT_TIME_FILTER_RANGE.entity.securityEvent) }).then(response => {
if (response.status === 200) {
this.entityData.securityNum = response.data.data.result.length
this.securityData = response.data.data.result
@@ -436,7 +436,7 @@ export default {
queryEntityDetail () {
this.queryEntityDetailTraffic()
// this.queryEntityDetailPerformance()
// this.queryEntityDetailSecurity()
this.queryEntityDetailSecurity()
this.queryEntityDetailNetworkQuantity()
/* if (this.entity.entityType === 'ip') {
if (!this.entityData.dnsServerRole) {

20
src/views/entityExplorer/entityList/entityListMixin.js
View File

@@ -124,7 +124,8 @@ export default {
path: '/entity/detail',
query: {
entityType: this.entityData.entityType,
entityName: this.entityData.entityValue
entityName: this.entityData.entityValue,
range: this.timeFilter.dateRangeValue
}
})
window.open(href, '_blank')
@@ -139,16 +140,27 @@ export default {
})
window.open(href, '_blank')
},
getQueryParams () {
getQueryParams (dateRangeValue) {
if (dateRangeValue) {
// range取 config.js 中配置的值
const endTime = window.$dayJs.tz().valueOf()
const startTime = endTime - dateRangeValue * 60 * 1000
return {
startTime: getSecond(startTime),
endTime: getSecond(endTime),
resource: this.entityType
}
} else {
return {
startTime: getSecond(this.timeFilter.startTime),
endTime: getSecond(this.timeFilter.endTime),
resource: this.entityType
}
}
},
queryEntityDetailTraffic () {
this.loading = true
axios.get(this.trafficUrl, { params: this.getQueryParams() }).then(response => {
axios.get(this.trafficUrl, { params: this.getQueryParams(DEFAULT_TIME_FILTER_RANGE.entity.trafficLine) }).then(response => {
if (response.status === 200 && response.data.data.result && response.data.data.result.length > 0) {
let sentSeries
let receivedSeries
@@ -262,7 +274,7 @@ export default {
this.loadingNetworkQuality = true
this.performanceScoreData = {}
this.scoreDataState = false
axios.get(this.scoreUrl, { params: this.getQueryParams() }).then(response => {
axios.get(this.scoreUrl, { params: this.getQueryParams(DEFAULT_TIME_FILTER_RANGE.entity.trafficLine) }).then(response => {
if (response.status === 200) {
this.performanceScoreData = {
establishLatencyMs: _.get(response, 'data.data.result.establishLatencyMsAvg', null),