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

src/components/common/TimeRange/DateTimeRange.vue

@@ -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
     }

src/components/layout/Header.vue

@@ -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 {

src/mixins/relatedServer.js

@@ -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) {

src/utils/constants.js

@@ -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'
 ]

src/views/charts/Panel.vue

@@ -66,9 +66,9 @@ export default {
     isEntityDetail: Boolean,
     typeName: String
   },
-  /*components: {
+  /* components: {
     DnsScreen
-  },*/
+  }, */
   data () {
     return {
       chartList: [], // 普通panel的chart

src/views/charts2/Panel.vue

@@ -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

src/views/charts2/chart-mixin.js

@@ -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

src/views/charts2/charts/entityDetail/EntityDetailLine.vue

@@ -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 {

src/views/charts2/charts/entityDetail/EntityDetailTabs.vue

@@ -14,13 +14,13 @@
             <span :style="{color: tab.name === activeTab ? '#046ECA' : '#717171'}">{{ tab.tag }}</span>
           </el-tag>
         </template>
-        <information-aggregation v-if="tab.name === entityDetailTabsName.informationAggregation && tab.name === activeTab" @toggleLoading="setLoading" :entity="entity" @checkTag="setTag"></information-aggregation>
+        <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>
+        <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" :timeFilter="oneDayTimeFilter" @checkTag="setTag" />
+        <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" :timeFilter="oneDayTimeFilter" @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" :timeFilter="oneDayTimeFilter" @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" :timeFilter="oneDayTimeFilter" @checkTag="setTag"></open-port>
+        <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" :timeFilter="oneDayTimeFilter" @checkTag="setTag"></behavior-pattern>
+        <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,
+      timer: null
-      // 最近一天的时间
-      oneDayTimeFilter: {
-        startTime: window.$dayJs.tz().valueOf() - 1440 * 60 * 1000,
-        endTime: window.$dayJs.tz().valueOf()
-      }
     }
   },
   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 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: params })
+      const openPort = axios.get(url, { params: this.getParamsByTabType(entityDetailTabsName.openPort) })
-      // const security = axios.get(`${api.entity.security}/${this.entity.entityType}`, { params: params })
+      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: params })
+      const performance = axios.get(`${api.entity.performance}/${this.entityType}`, { params: this.getParamsByTabType(entityDetailTabsName.performanceEvent) })
 
-      Promise.all([informationAggregation, openPort]).then(response => {
+      Promise.allSettled([informationAggregation, openPort, security, performance]).then(response => {
-        if (response[0].status === 200) {
+        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) {
+        const openPortResponse = response[1].value
-          this.initSetTag(entityDetailTabsName.openPort, response[1].data.data.result.length)
+        if (openPortResponse.status === 200) {
+          this.initSetTag(entityDetailTabsName.openPort, openPortResponse.data.data.result.length)
         }
-        // if (response[2].status === 200) {
+        // let securityResponse = response[2].value
-        //   this.initSetTag(entityDetailTabsName.securityEvent, response[2].data.data.result.length)
+        // if (securityResponse.status === 200) {
+        //   this.initSetTag(entityDetailTabsName.securityEvent, securityResponse.data.data.result.length)
         // }
-        // if (response[3].status === 200) {
+        // let performanceResponse = response[3].value
-        //   this.initSetTag(entityDetailTabsName.performanceEvent, response[3].data.data.result.length)
+        // 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 ipsOfApp = axios.get(api.entity.domainNameResolutionAboutIpsOfApp, { params: relatedEntityParams })
-        const domainsOfApp = axios.get(api.entity.domainNameResolutionAboutDomainsOfApp, { params: params })
+        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 appsOfIp = axios.get(api.entity.domainNameResolutionAboutAppsOfIp, { params: relatedEntityParams })
-        const domainsOfIp = axios.get(api.entity.domainNameResolutionAboutDomainsOfIp, { params: params })
+        const domainsOfIp = axios.get(api.entity.domainNameResolutionAboutDomainsOfIp, { params: relatedEntityParams })
-        const behaviorPattern = axios.get(api.entity.behaviorPattern, { params: params })
+        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 appsOfDomain = axios.get(api.entity.domainNameResolutionAboutAppsOfDomain, { params: relatedEntityParams })
-        const ipsOfDomain = axios.get(api.entity.domainNameResolutionAboutIpsOfDomain, { params: params })
+        const ipsOfDomain = axios.get(api.entity.domainNameResolutionAboutIpsOfDomain, { params: relatedEntityParams })
-        const fqdnsOfDomain = axios.get(api.entity.domainNameResolutionAboutFQDNsOfDomain, { params: params })
+        const fqdnsOfDomain = axios.get(api.entity.domainNameResolutionAboutFQDNsOfDomain, { params: relatedEntityParams })
         this.promiseData(appsOfDomain, ipsOfDomain, fqdnsOfDomain)
       }
     },

src/views/charts2/charts/entityDetail/tabs/BehaviorPattern.vue

@@ -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 = {
+      const params = this.getParams()
-        resource: this.entityName
-      }
       this.toggleLoading(true)
       await axios.get(`${api.entity.behaviorPattern}`, { params: params }).then(response => {
         const res = response.data

src/views/charts2/charts/entityDetail/tabs/DomainNameResolution.vue

@@ -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 = {
+      const params = this.getParams()
-        resource: this.entity.entityName
-        // startTime: getSecond(this.timeFilter.startTime),
-        // endTime: getSecond(this.timeFilter.endTime)
-      }
       if (this.entity.entityType === 'app') {
         const ipsOfApp = axios.get(api.entity.domainNameResolutionAboutIpsOfApp, { params: params })
         const domainsOfApp = axios.get(api.entity.domainNameResolutionAboutDomainsOfApp, { params: params })

src/views/charts2/charts/entityDetail/tabs/InformationAggregation.vue

@@ -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

src/views/charts2/charts/entityDetail/tabs/OpenPort.vue

@@ -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 = {
+      const params = this.getParams()
-        resource: this.entity.entityName
-        // startTime: getSecond(this.timeFilter.startTime),
-        // endTime: getSecond(this.timeFilter.endTime)
-      }
-
       this.toggleLoading(true)
       const url = this.getUrlByEntityType(this.entity.entityType)
       axios.get(url, { params: params }).then(response => {

src/views/charts2/charts/entityDetail/tabs/PerformanceEvent.vue

@@ -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 = {
+      const params = this.getParams()
-        resource: this.entityName
-        // startTime: getSecond(this.timeFilter.startTime),
-        // endTime: getSecond(this.timeFilter.endTime)
-      }
-
       this.toggleLoading(true)
       axios.get(`${api.entity.performance}/${this.entityType}`, { params: params }).then(response => {
         const res = response.data

src/views/charts2/charts/entityDetail/tabs/SecurityEvent.vue

@@ -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 = {
+      const params = this.getParams()
-        resource: this.entityName
-        // startTime: getSecond(this.timeFilter.startTime),
-        // endTime: getSecond(this.timeFilter.endTime)
-      }
-
       this.toggleLoading(true)
       axios.get(`${api.entity.security}/${this.entityType}`, { params: params }).then(response => {
         const res = response.data

src/views/charts2/charts/npm/NpmAppEventTable.vue

@@ -150,7 +150,7 @@ export default {
         limit: 10,
         type: this.metric
       }
-      /*axios.get(api.npm.events.dimensionEvents, { params }).then(res => {
+      /* axios.get(api.npm.events.dimensionEvents, { params }).then(res => {
         if (res.status === 200) {
           this.showError = false
           if (!res.data.data.result || res.data.data.result.length === 0) {
@@ -168,7 +168,7 @@ export default {
         this.errorMsg = this.errorMsgHandler(e)
       }).finally(() => {
         this.toggleLoading(false)
-      })*/
+      }) */
       this.isNoData = true
       this.toggleLoading(false)
     },

src/views/charts2/charts/npm/NpmEventsByType.vue

@@ -110,7 +110,7 @@ export default {
         startTime: getSecond(this.timeFilter.startTime),
         endTime: getSecond(this.timeFilter.endTime)
       }
-      /*this.toggleLoading(true)
+      /* this.toggleLoading(true)
       axios.get(api.npm.events.recentEvents, { params: params }).then(response => {
         const res = response.data
         if (response.status === 200) {
@@ -151,7 +151,7 @@ export default {
         this.errorMsg = this.errorMsgHandler(e)
       }).finally(() => {
         this.toggleLoading(false)
-      })*/
+      }) */
       this.isNoData = true
       this.toggleLoading(false)
     },

src/views/detections/Index.vue

@@ -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

src/views/entityExplorer/EntityExplorer.vue

@@ -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携带了，使用携带的值，否则使用默认值。
+    // 优先级：url > config.js > 默认值。
-    const dateRangeValue = rangeParam ? parseInt(query.range) : 60
+    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 {

src/views/entityExplorer/entityList/detailOverview/App.vue

@@ -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,11 +320,21 @@ export default {
   methods: {
     getMillisecond,
     dateFormatByAppearance,
-    getQueryParams () {
+    getQueryParams (dateRangeValue) {
-      return {
+      if (dateRangeValue) {
-        startTime: getSecond(this.timeFilter.startTime),
+        // range取 config.js 中配置的值
-        endTime: getSecond(this.timeFilter.endTime),
+        const { startTime, endTime } = getNowTime(dateRangeValue)
-        resource: this.entity.entityValue
+        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 () {

src/views/entityExplorer/entityList/detailOverview/Domain.vue

@@ -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,11 +324,21 @@ export default {
   methods: {
     getMillisecond,
     dateFormatByAppearance,
-    getQueryParams () {
+    getQueryParams (dateRangeValue) {
-      return {
+      if (dateRangeValue) {
-        startTime: getSecond(this.timeFilter.startTime),
+        // range取 config.js 中配置的值
-        endTime: getSecond(this.timeFilter.endTime),
+        const { startTime, endTime } = getNowTime(dateRangeValue)
-        resource: this.entity.entityValue
+        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 () {

src/views/entityExplorer/entityList/detailOverview/Ip.vue

@@ -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,11 +404,21 @@ export default {
   methods: {
     getMillisecond,
     dateFormatByAppearance,
-    getQueryParams () {
+    getQueryParams (dateRangeValue) {
-      return {
+      if (dateRangeValue) {
-        startTime: getSecond(this.timeFilter.startTime),
+        // range取 config.js 中配置的值
-        endTime: getSecond(this.timeFilter.endTime),
+        const { startTime, endTime } = getNowTime(dateRangeValue)
-        resource: this.entity.entityValue
+        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 () {

src/views/entityExplorer/entityList/detailOverview/entityDetailMixin.js

@@ -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,9 +436,9 @@ export default {
     queryEntityDetail () {
       this.queryEntityDetailTraffic()
       // this.queryEntityDetailPerformance()
-      // this.queryEntityDetailSecurity()
+      this.queryEntityDetailSecurity()
       this.queryEntityDetailNetworkQuantity()
-      /*if (this.entity.entityType === 'ip') {
+      /* if (this.entity.entityType === 'ip') {
         if (!this.entityData.dnsServerRole) {
           this.loadingDns = true
         }
@@ -449,7 +449,7 @@ export default {
             this.queryDnsServerInfoRate()
           }, 200)
         })
-      }*/
+      } */
     },
 
     resize () {

src/views/entityExplorer/entityList/entityListMixin.js

@@ -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) {
-      return {
+      if (dateRangeValue) {
-        startTime: getSecond(this.timeFilter.startTime),
+        // range取 config.js 中配置的值
-        endTime: getSecond(this.timeFilter.endTime),
+        const endTime = window.$dayJs.tz().valueOf()
-        resource: this.entityType
+        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),