diff --git a/apps/web-antd/src/views/aiot/device/camera/index.vue b/apps/web-antd/src/views/aiot/device/camera/index.vue index 21411bed0..e827097e2 100644 --- a/apps/web-antd/src/views/aiot/device/camera/index.vue +++ b/apps/web-antd/src/views/aiot/device/camera/index.vue @@ -36,10 +36,14 @@ import { pushAllConfig, saveCamera, } from '#/api/aiot/device'; -import { wvpRequestClient } from '#/api/aiot/request'; +import { wvpRequestClient, getWvpToken } from '#/api/aiot/request'; defineOptions({ name: 'AiotDeviceCamera' }); +import { useAppConfig } from '@vben/hooks'; + +const { apiURL } = useAppConfig(import.meta.env, import.meta.env.PROD); + const router = useRouter(); // ==================== 列表状态 ==================== @@ -54,9 +58,9 @@ const total = ref(0); const searchQuery = ref(''); const columns = [ + { title: '应用名', dataIndex: 'app', width: 100 }, + { title: '流ID', dataIndex: 'stream', width: 100 }, { title: '状态', key: 'status', width: 60, align: 'center' as const }, - { title: '应用名', dataIndex: 'app', width: 120 }, - { title: '流ID', dataIndex: 'stream', width: 150 }, { title: '拉流地址', dataIndex: 'srcUrl', ellipsis: true }, { title: 'ROI', key: 'roiCount', width: 80, align: 'center' as const }, { title: '操作', key: 'actions', width: 240, fixed: 'right' as const }, @@ -138,21 +142,19 @@ function loadRoiCounts() { } } -function loadCameraStatus() { +async function loadCameraStatus() { for (const cam of cameraList.value) { const cameraCode = cam.cameraCode; if (!cameraCode) continue; - wvpRequestClient - .get('/aiot/device/roi/snap/image', { - params: { cameraCode }, - responseType: 'blob', - }) - .then(() => { - cameraStatus.value = { ...cameraStatus.value, [cameraCode]: true }; - }) - .catch(() => { - cameraStatus.value = { ...cameraStatus.value, [cameraCode]: false }; - }); + // 使用 fetch HEAD 请求检测截图是否可用,避免下载完整图片 + try { + const token = await getWvpToken(); + const url = `${apiURL}/aiot/device/roi/snap/image?cameraCode=${encodeURIComponent(cameraCode)}&access-token=${encodeURIComponent(token)}`; + const res = await fetch(url, { method: 'HEAD' }); + cameraStatus.value = { ...cameraStatus.value, [cameraCode]: res.ok }; + } catch { + cameraStatus.value = { ...cameraStatus.value, [cameraCode]: false }; + } } }