吉安感知网项目-前端
张含笑
2026-01-09 edaf70cb7f0c4e7c997ddab584b3b05798d58528
applications/drone-command/src/views/recordManage/alarmRecords/alarmRecords.vue
@@ -8,13 +8,13 @@
               </el-form-item>
            </el-col>
            <el-col :span="4">
               <el-form-item label="区域" prop="areaCode">
                  <el-input v-model="searchParams.areaCode" placeholder="请输入" clearable @clear="getList" />
               <el-form-item label="区域" prop="areaName">
                  <el-input v-model="searchParams.areaName" placeholder="请输入" clearable @clear="getList" />
               </el-form-item>
            </el-col>
            <el-col :span="4">
               <el-form-item label="设备类型" prop="droneType">
                  <el-select v-model="searchParams.droneType" placeholder="请选择" clearable @clear="getList">
                  <el-select v-model="searchParams.droneType" placeholder="请选择" clearable @change="getList">
                     <el-option
                        v-for="item in dictObj.deviceType"
                        :key="item.dictKey"
@@ -25,6 +25,21 @@
               </el-form-item>
            </el-col>
            <el-col :span="4">
               <el-form-item label="时间">
                  <el-date-picker
                     popper-class="ztzf-date-picker-popper"
                     class="ztzf-date-picker"
                     v-model="dateRange"
                     type="daterange"
                     range-separator="至"
                     start-placeholder="开始日期"
                     end-placeholder="结束日期"
                     value-format="YYYY-MM-DD HH:mm:ss"
                     @change="handleSearch"
                  />
               </el-form-item>
            </el-col>
            <el-col :span="4">
               <el-form-item>
                  <el-button @click="resetForm">重置</el-button>
                  <el-button type="primary" @click="handleSearch">查询</el-button>
@@ -32,13 +47,16 @@
            </el-col>
         </el-row>
      </el-form>
      <div>
         <el-button type="primary" @click="exportFile" :loading="exportLoading">导出</el-button>
      </div>
      <el-table v-loading="loading" :data="list">
         <el-table-column type="index" width="60" label="序号" />
         <el-table-column prop="droneName" label="无人机名称" />
         <el-table-column prop="droneSerialNo" label="无人机序列号" />
         <el-table-column prop="alarmTime" label="告警时间" />
         <el-table-column prop="areaCode" label="区域" />
         <el-table-column prop="areaName" label="区域" />
         <el-table-column prop="triggerReason" label="触发原因" />
         <el-table-column prop="deviceName" label="侦测反制设备" />
         <el-table-column prop="droneType" label="设备类型">
@@ -46,17 +64,12 @@
               {{ getDeviceTypeName(row.droneType) }}
            </template>
         </el-table-column>
         <el-table-column prop="deviceCode" label="设备编码"/>
         <el-table-column prop="deviceCode" label="设备编码" />
         <el-table-column label="设备状态">
            <template v-slot="{ row }">
               {{ getDeviceStatus(row) }}
            </template>
         </el-table-column>
         <!--         <el-table-column label="操作">-->
         <!--            <template v-slot="{ row }">-->
         <!--               <el-link @click="handleView(row)" type="primary">查看</el-link>-->
         <!--            </template>-->
         <!--         </el-table-column>-->
      </el-table>
      <div>
@@ -75,12 +88,13 @@
<script setup>
import { computed, onMounted, ref } from 'vue'
import { getDictionaryByCode } from '@/api/system/dictbiz'
import { fwDroneAlarmRecordPageApi } from './fwDroneAlarmRecord'
import { exportFwDroneAlarmRecordApi, fwDroneAlarmRecordPageApi } from './fwDroneAlarmRecord'
import FormDiaLog from './FormDiaLog.vue'
import { blobDownload, dateRangeFormat } from '@ztzf/utils'
const initSearchParams = () => ({
   droneName: '', // 无人机名称
   areaCode: '', // 区域
   areaName: '', // 区域
   droneType: '', // 设备类型
   current: 1, // 当前页
   size: 10, // 每页大小
@@ -92,8 +106,10 @@
const queryParamsRef = ref(null) // 查询表单实例
const dialogRef = ref(null) // 弹框实例
const dictObj = ref({
   deviceType: [],
   deviceType: [], //设备属性
})
const dateRange = ref([])
const exportLoading = ref(false)
const deviceTypeMap = computed(() => {
   const map = new Map()
   dictObj.value.deviceType.forEach(item => {
@@ -104,9 +120,11 @@
// 获取列表
async function getList() {
   const range = dateRangeFormat(dateRange.value)
   loading.value = true
   try {
      const res = await fwDroneAlarmRecordPageApi(searchParams.value)
      const params = { ...searchParams.value, startTime: range[0], endTime: range[1] }
      const res = await fwDroneAlarmRecordPageApi(params)
      list.value = res?.data?.data?.records ?? []
      total.value = res?.data?.data?.total ?? 0
   } finally {
@@ -132,6 +150,17 @@
   dialogRef.value?.open({ mode: 'view', row: { ...row } })
}
function exportFile() {
   exportLoading.value = true
   exportFwDroneAlarmRecordApi()
      .then(res => {
         blobDownload(res)
      })
      .finally(() => {
         exportLoading.value = false
      })
}
function getDeviceStatus(row) {
   return row.deviceStatus ?? row.status ?? '-'
}