CN-1060: 实体详情--安全事件和性能事件tab接口对接

src/mock/entity.js

@@ -1,8 +1,8 @@
 import Mock from 'mockjs'
-
+const urlAndVersion = BASE_CONFIG.baseUrl + BASE_CONFIG.apiVersion
 const openMock = true
 if (openMock) {
-  Mock.mock(new RegExp(BASE_CONFIG.baseUrl + BASE_CONFIG.apiVersion + '/entity/detail/traffic/throughput.*'), 'get', function (requestObj) {
+  Mock.mock(new RegExp(urlAndVersion + '/entity/detail/traffic/throughput.*'), 'get', function (requestObj) {
     const titleList = ['totalBitsRate', 'inboundBitsRate', 'outboundBitsRate', 'internalBitsRate', 'throughBitsRate', 'other']
     const arr = [{ type: 'Bits/s' }, { type: 'Packets/s' }, { type: 'Sessions/s' }]
 
@@ -66,7 +66,7 @@ if (openMock) {
       }
     }
   })
-  Mock.mock(new RegExp(BASE_CONFIG.baseUrl + 'interface/entityDetail/securityEvent.*'), 'get', function (requestObj) {
+  Mock.mock(new RegExp(urlAndVersion + '/entity/detail/event/security.*'), 'get', function (requestObj) {
     const result = [
       {
         eventId: '1298414830886991872',
@@ -183,7 +183,7 @@ if (openMock) {
       }
     }
   })
-  Mock.mock(new RegExp(BASE_CONFIG.baseUrl + 'interface/entityDetail/performanceEvent.*'), 'get', function (requestObj) {
+  Mock.mock(new RegExp(urlAndVersion + '/entity/detail/event/performance.*'), 'get', function (requestObj) {
     const result = [
       {
         eventId: '1308078720390412288',

src/utils/api.js

@@ -232,8 +232,8 @@ export const api = {
   },
   entity: {
     throughput: BASE_CONFIG.apiVersion + '/entity/detail/traffic/throughput',
-    securityEvent: 'interface/entityDetail/securityEvent',
+    security: BASE_CONFIG.apiVersion + '/entity/detail/event/security',
-    performanceEvent: 'interface/entityDetail/performanceEvent',
+    performance: BASE_CONFIG.apiVersion + '/entity/detail/event/performance',
     domainNameResolutionRelatedApp: 'interface/entity/detail/overview/ip/relatedApp',
     domainNameResolutionRelatedIP: 'interface/entity/detail/overview/ip/relatedIp',
     domainNameResolutionRelatedDomain: 'interface/entity/detail/overview/ip/relatedDomain',

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

@@ -13,9 +13,9 @@
         </template>
         <information-aggregation v-if="tab.name === entityDetailTabsName.informationAggregation && tab.name === activeTab" @toggleLoading="setLoading"></information-aggregation>
         <domain-name-resolution v-else-if="tab.name === entityDetailTabsName.domainNameResolution && tab.name === activeTab" @toggleLoading="setLoading"></domain-name-resolution>
-        <digital-certificate v-else-if="tab.name === entityDetailTabsName.digitalCertificate && tab.name === activeTab" @toggleLoading="setLoading" />
+        <digital-certificate v-else-if="tab.name === entityDetailTabsName.digitalCertificate && tab.name === activeTab" @toggleLoading="setLoading" :timeFilter="oneDayTimeFilter" />
-        <security-event v-else-if="tab.name === entityDetailTabsName.securityEvent && tab.name === activeTab" @toggleLoading="setLoading" :timeFilter="timeFilter" />
+        <security-event v-else-if="tab.name === entityDetailTabsName.securityEvent && tab.name === activeTab" @toggleLoading="setLoading" :timeFilter="oneDayTimeFilter" />
-        <performance-event v-else-if="tab.name === entityDetailTabsName.performanceEvent && tab.name === activeTab" @toggleLoading="setLoading" />
+        <performance-event v-else-if="tab.name === entityDetailTabsName.performanceEvent && tab.name === activeTab" @toggleLoading="setLoading" :timeFilter="oneDayTimeFilter" />
         <open-port v-else-if="tab.name === entityDetailTabsName.openPort && tab.name === activeTab" @toggleLoading="setLoading"></open-port>
       </el-tab-pane>
     </el-tabs>
@@ -49,7 +49,12 @@ export default {
   },
   data () {
     return {
-      timer: null
+      timer: null,
+      // 最近一天的时间
+      oneDayTimeFilter: {
+        startTime: window.$dayJs.tz().valueOf() - 1440 * 60 * 1000,
+        endTime: window.$dayJs.tz().valueOf()
+      }
     }
   },
   watch: {

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

@@ -49,12 +49,11 @@
 </template>
 
 <script>
-import { getNowTime, getSecond } from '@/utils/date-util'
+import { getSecond } from '@/utils/date-util'
 import { eventSeverityColor1 } from '@/utils/constants'
 import unitConvert from '@/utils/unit-convert'
 import axios from 'axios'
 import { api } from '@/utils/api'
-import { ref } from 'vue'
 import { useRoute } from 'vue-router'
 import chartMixin from '@/views/charts2/chart-mixin'
 import ChartError from '@/components/common/Error'
@@ -75,27 +74,10 @@ export default {
     const { query } = useRoute()
     const entityType = query.entityType
     const entityName = query.entityName
-    // 获取url携带的range、startTime、endTime
-    const rangeParam = query.range
-    const startTimeParam = query.startTime
-    const endTimeParam = query.endTime
-    // 若url携带了，使用携带的值，否则使用默认值。
-
-    const dateRangeValue = rangeParam ? parseInt(query.range) : 60
-    const timeFilter = ref({ dateRangeValue })
-    if (!startTimeParam || !endTimeParam) {
-      const { startTime, endTime } = getNowTime(60)
-      timeFilter.value.startTime = startTime
-      timeFilter.value.endTime = endTime
-    } else {
-      timeFilter.value.startTime = parseInt(startTimeParam)
-      timeFilter.value.endTime = parseInt(endTimeParam)
-    }
 
     return {
       entityType,
-      entityName,
+      entityName
-      timeFilter
     }
   },
   mounted () {
@@ -105,14 +87,13 @@ export default {
     unitConvert,
     initData () {
       const params = {
-        type: this.entityType,
+        resource: this.entityName,
-        name: this.entityName,
         startTime: getSecond(this.timeFilter.startTime),
         endTime: getSecond(this.timeFilter.endTime)
       }
 
       this.toggleLoading(true)
-      axios.get(api.entity.performanceEvent, { params: params }).then(response => {
+      axios.get(`${api.entity.performance}/${this.entityType}`, { params: params }).then(response => {
         const res = response.data
 
         if (res.code === 200) {

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

@@ -73,12 +73,11 @@
 </template>
 
 <script>
-import { getNowTime, getSecond } from '@/utils/date-util'
+import { getSecond } from '@/utils/date-util'
 import { eventSeverityColor1 } from '@/utils/constants'
 import unitConvert from '@/utils/unit-convert'
 import axios from 'axios'
 import { api } from '@/utils/api'
-import { ref } from 'vue'
 import { useRoute } from 'vue-router'
 import chartMixin from '@/views/charts2/chart-mixin'
 
@@ -96,28 +95,11 @@ export default {
   setup () {
     const { query } = useRoute()
     const entityType = query.entityType
-    const entityName = query.entityName
+    const entityName = query.name
-    // 获取url携带的range、startTime、endTime
-    const rangeParam = query.range
-    const startTimeParam = query.startTime
-    const endTimeParam = query.endTime
-    // 若url携带了，使用携带的值，否则使用默认值。
-
-    const dateRangeValue = rangeParam ? parseInt(query.range) : 60
-    const timeFilter = ref({ dateRangeValue })
-    if (!startTimeParam || !endTimeParam) {
-      const { startTime, endTime } = getNowTime(60)
-      timeFilter.value.startTime = startTime
-      timeFilter.value.endTime = endTime
-    } else {
-      timeFilter.value.startTime = parseInt(startTimeParam)
-      timeFilter.value.endTime = parseInt(endTimeParam)
-    }
 
     return {
       entityType,
-      entityName,
+      entityName
-      timeFilter
     }
   },
   mounted () {
@@ -127,14 +109,13 @@ export default {
     unitConvert,
     initData () {
       const params = {
-        type: this.entityType,
+        resource: this.entityName,
-        name: this.entityName,
         startTime: getSecond(this.timeFilter.startTime),
         endTime: getSecond(this.timeFilter.endTime)
       }
 
       this.toggleLoading(true)
-      axios.get(api.entity.securityEvent, { params: params }).then(response => {
+      axios.get(`${api.entity.security}/${this.entityType}`, { params: params }).then(response => {
         const res = response.data
 
         if (res.code === 200) {