吉安感知网项目-前端
shuishen
2026-01-09 6b82e8c63399005e65322f6d5d463f6e33fedbdc
applications/drone-command/src/views/dataCockpit/components/RealWarning.vue
@@ -9,63 +9,95 @@
 * 2026-01-08 09:29:07
-->
<template>
   <div class="real-warning">
      <RealTemplate v-for="(item, ind) in realWarningData" :key="ind" :data="item"
         @signal="() => console.log('信号干扰', item.id)" @counter="() => console.log('诱导驱离', item.id)"
         @favorite="() => console.log('收藏', item.id)" />
   <div
      class="real-warning"
      v-loading="loading"
      element-loading-background="rgba(5, 5, 15, 0.6)"
      element-loading-text="加载中..."
   >
      <EmptyState v-if="!realWarningData.length" />
      <RealTemplate
         v-else
         v-for="(item, ind) in realWarningData"
         :key="ind"
         :data="item"
         @signal="() => handleAction('signal', item)"
         @counter="() => handleAction('counter', item)"
         @favorite="() => console.log('收藏', item.id)"
      />
   </div>
</template>
<script setup>
import RealTemplate from './templateComponents/RealTemplate.vue'
import { alarmLogApi, interferenceAndExpulsionApi } from '@/api/dataCockpit'
import { onMounted, ref } from 'vue'
import EmptyState from './EmptyState.vue'
import { ElMessage } from 'element-plus'
const realWarningData = ref([
   {
      "id": "drone_001",
      "name": "无人机A-01",
      "status": "侦测中",
      "statusType": "detecting",
      "serialNumber": "XLH789456456",
      "dataSource": "侦测反制设备名称",
      "longitude": 113.99238,
      "latitude": 22.541819,
      "frequency": "5800MHz",
      "discoverTime": "14:56:04",
      "altitude": "150m",
      "speed": "5.01m/s",
      "isFavorite": false
   },
   {
      "id": "drone_002",
      "name": "无人机B-07",
      "status": "反制中",
      "statusType": "countering",
      "serialNumber": "XLH789456789",
      "dataSource": "反制设备A区",
      "longitude": 113.99312,
      "latitude": 22.542031,
      "frequency": "2400MHz",
      "discoverTime": "15:02:41",
      "altitude": "120m",
      "speed": "3.86m/s",
      "isFavorite": true
   },
   {
      "id": "drone_002",
      "name": "无人机B-07",
      "status": "反制中",
      "statusType": "countering",
      "serialNumber": "XLH789456789",
      "dataSource": "反制设备A区",
      "longitude": 113.99312,
      "latitude": 22.542031,
      "frequency": "2400MHz",
      "discoverTime": "15:02:41",
      "altitude": "120m",
      "speed": "3.86m/s",
      "isFavorite": true
const realWarningData = ref([])
const loading = ref(false)
const minLoadingMs = 400
const actionTextMap = {
   signal: '信号干扰',
   counter: '诱导驱离'
}
const buildPayload = (item) => ({
   alarmRecordId: item.id,
   areaCode: item.areaCode,
   counterEffect: '',
   coverRadiusM: item.coverRadiusM,
   deployLatitude: item.latitude,
   deployLongitude: item.longitude,
   deviceCode: item.deviceCode,
   deviceId: item.deviceId,
   deviceModel: item.deviceModel,
   deviceName: item.deviceName,
   deviceType: item.deviceType,
   droneDeviceCode: item.droneSerialNo,
   droneName: item.droneName,
   droneType: item.droneType,
   findTime: item.alarmTime,
   id: item.id,
   workMode: ''
})
const handleAction = async (type, item) => {
   const actionText = actionTextMap[type] || '操作'
   try {
      const res = await interferenceAndExpulsionApi(buildPayload(item))
      if (res?.data?.success) {
         ElMessage({ type: 'success', message: `${actionText}成功` })
      } else {
         ElMessage({ type: 'error', message: res?.data?.msg || `${actionText}失败` })
      }
   } catch (error) {
      ElMessage({ type: 'error', message: `${actionText}失败` })
   }
])
}
const fetchRealWarning = async () => {
   const startAt = Date.now()
   loading.value = true
   try {
      const params = { current: 1, size: 20, alarmType: '1' }
      const res = await alarmLogApi(params)
      const records = res?.data?.data?.records ?? []
      realWarningData.value = records
   } finally {
      const elapsed = Date.now() - startAt
      if (elapsed < minLoadingMs) {
         await new Promise((resolve) => setTimeout(resolve, minLoadingMs - elapsed))
      }
      loading.value = false
   }
}
onMounted(() => {
   fetchRealWarning()
})
</script>
<style lang="scss" scoped>
@@ -73,4 +105,5 @@
   width: 100%;
   height: 100%;
}
</style>
</style>