From d07c8e0b866dfadd65f12cbe3c9c74c800b0619a Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Fri, 09 Jan 2026 16:04:59 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
applications/drone-command/src/views/dataCockpit/components/RightContainer.vue | 105 ++++++++++++++++++++++++++++++++++++----------------
1 files changed, 72 insertions(+), 33 deletions(-)
diff --git a/applications/drone-command/src/views/dataCockpit/components/RightContainer.vue b/applications/drone-command/src/views/dataCockpit/components/RightContainer.vue
index 43cf0d0..33235ae 100644
--- a/applications/drone-command/src/views/dataCockpit/components/RightContainer.vue
+++ b/applications/drone-command/src/views/dataCockpit/components/RightContainer.vue
@@ -26,9 +26,21 @@
</div>
</div>
- <div class="content">
- <RealEquipmentTemplate v-for="item in counterDeviceStatusList" :key="item.id" :data="item"
- @history="onHistory" @click="onCardClick" />
+ <div
+ class="content"
+ v-loading="loading"
+ element-loading-background="rgba(5, 5, 15, 0.6)"
+ element-loading-text="加载中..."
+ >
+ <EmptyState v-if="!counterDeviceStatusList.length" />
+ <RealEquipmentTemplate
+ v-else
+ v-for="item in counterDeviceStatusList"
+ :key="item.id"
+ :data="item"
+ @history="onHistory"
+ @click="onCardClick"
+ />
</div>
</div>
@@ -44,8 +56,10 @@
import TitleTemplate from './templateComponents/TitleTemplate.vue'
import RealEquipmentTemplate from './templateComponents/RealEquipmentTemplate.vue'
import DeviceHistoryDialog from './DeviceHistoryDialog.vue'
+import EmptyState from './EmptyState.vue'
import zcsbLogo from '@/assets/images/dataCockpit/zcsb.png'
import fzsbLogo from '@/assets/images/dataCockpit/fzsb.png'
+import { deviceSearchApi } from '@/api/dataCockpit'
const props = defineProps({
collapsed: {
@@ -76,39 +90,12 @@
}
])
-const counterDeviceStatusList = ref([
- {
- id: 'cd_001',
- name: '反制设备名称',
- actionText: '侦测中',
- actionType: 'detecting', // detecting | jamming | idle
- type: '察打一体',
- battery: 100, // 电量 %
- azimuth: 14, // 方位角
- pitch: 14, // 俯仰角
- statusText: '在线', // 状态
- vendor: '厂商名称', // 厂商
- targetCount: 10, // 侦测目标
- range: '1.2KM' // 有效范围
- },
- {
- id: 'cd_002',
- name: '反制设备名称',
- actionText: '信号干扰中',
- actionType: 'jamming',
- type: '察打一体',
- battery: 100,
- azimuth: 14,
- pitch: 14,
- statusText: '在线',
- vendor: '厂商名称',
- targetCount: 10,
- range: '1.2KM'
- }
-])
+const counterDeviceStatusList = ref([])
const historyVisible = ref(false)
const historyDevice = ref(null)
+const loading = ref(false)
+const minLoadingMs = 400
const onHistory = (item) => {
historyDevice.value = item
@@ -122,6 +109,57 @@
const toggleCollapse = () => {
collapsedModel.value = !collapsedModel.value
}
+
+const statusMap = {
+ 0: { text: '在线', actionType: 'detecting' },
+ 1: { text: '离线', actionType: '' },
+ 2: { text: '故障', actionType: 'jamming' },
+ 3: { text: '报废', actionType: '' }
+}
+const deviceTypeMap = {
+ 1: '便捷侦测箱',
+ 2: '反制枪',
+ 3: '察打一体'
+}
+
+const formatDeviceItem = (item) => {
+ const statusInfo = statusMap[item?.status] || { text: '-', actionType: '' }
+ return {
+ id: item.id,
+ name: item.deviceName || item.deviceModel || '-',
+ actionText: statusInfo.text,
+ actionType: statusInfo.actionType,
+ type: deviceTypeMap[item.deviceType] || item.deviceType || '-',
+ batteryPct: item.batteryPct ?? 0,
+ azimuth: item.azimuth ?? 0,
+ elevation: item.elevation ?? 0,
+ status: item.status ?? '-',
+ manufacturer: item.manufacturer || '-',
+ detectTargetCnt: item.detectTargetCnt ?? 0,
+ effectiveRangeKm: item.effectiveRangeKm ?? 0
+ }
+}
+
+const fetchDeviceList = async () => {
+ const startAt = Date.now()
+ loading.value = true
+ try {
+ const params = { current: 1, size: 20, deviceStatusList: '0' }
+ const res = await deviceSearchApi(params)
+ const records = res?.data?.data?.records ?? []
+ counterDeviceStatusList.value = records.map(formatDeviceItem)
+ } finally {
+ const elapsed = Date.now() - startAt
+ if (elapsed < minLoadingMs) {
+ await new Promise((resolve) => setTimeout(resolve, minLoadingMs - elapsed))
+ }
+ loading.value = false
+ }
+}
+
+onMounted(() => {
+ fetchDeviceList()
+})
</script>
<style lang="scss" scoped>
@@ -195,6 +233,7 @@
overflow-y: auto;
}
+
.right-container {
transition: transform 0.3s ease-in-out;
position: relative;
--
Gitblit v1.9.3