feat: 根据文档，使用假数据进行接口调试

src/views/charts2/charts/NetworkOverviewDdosDetection.vue

@@ -5,15 +5,15 @@
      <div class="ddos-detection-type">
        <div class="ddos-detection-type-value">
          <div class="ddos-detection-type-value-name">{{$t('network.numberOfAttacks')}}</div>
-         <div class="ddos-detection-type-value-number">365</div>
+         <div class="ddos-detection-type-value-number">{{$_.get(ddosData, 'attackerCount') || 0}}</div>
        </div>
        <div class="ddos-detection-type-value">
          <div class="ddos-detection-type-value-name">{{$t('network.number0fVictims')}}</div>
-         <div class="ddos-detection-type-value-number">65</div>
+         <div class="ddos-detection-type-value-number">{{$_.get(ddosData, 'victimCount') || 0}}</div>
        </div>
        <div class="ddos-detection-type-value">
          <div class="ddos-detection-type-value-name">{{$t('network.number0fDetectedAttackEvents')}}</div>
-         <div class="ddos-detection-type-value-number">25</div>
+         <div class="ddos-detection-type-value-number">{{$_.get(ddosData, 'attackEventCount') || 0}}</div>
        </div>
      </div>
      <el-button size="small">{{$t('network.ddosDetection')}}<i class="cn-icon cn-icon-arrow-right"></i></el-button>
@@ -22,7 +22,33 @@
 </template>
 
 <script>
+import { api } from '@/utils/api'
+import { get } from '@/utils/http'
 export default {
-  name: 'NetworkOverviewDdosDetection'
+  name: 'NetworkOverviewDdosDetection',
+  props: {
+    timeFilter: Object
+  },
+  data () {
+    return {
+      ddosData: {}
+    }
+  },
+  methods: {
+    ddosDetectDataRequests () {
+      const params = {
+        startTime: this.timeFilter.startTime,
+        endTime: this.timeFilter.endTime
+      }
+      get(api.netWorkOverview.ddosEventAnalysis, params).then(res => {
+        if (res.code === 200) {
+          this.ddosData = res.data.result[0]
+        }
+      })
+    }
+  },
+  mounted () {
+    this.ddosDetectDataRequests()
+  }
 }
 </script>