From 57013d207bb281e14e053e9c0bced75871cdd689 Mon Sep 17 00:00:00 2001 From: xh <11675084@qq.com> Date: Fri, 24 Oct 2025 17:32:21 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BD=8D=E7=BD=AE=E8=BD=A8=E8=BF=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/src/api/gas/handdetector/index.ts | 9 +- web/src/api/gas/tdengine/index.ts | 9 ++ .../HandDevice/Home/components/OpenLayerMap.vue | 54 +++++++--- .../Home/components/composables/useMapWatchers.ts | 2 +- .../composables/useTrajectoryControls.ts | 28 +++--- .../Home/components/constants/map.constants.ts | 3 +- .../Home/components/services/map.service.ts | 9 ++ web/src/views/HandDevice/Home/index.vue | 109 ++++++++++++++------- 8 files changed, 157 insertions(+), 66 deletions(-) diff --git a/web/src/api/gas/handdetector/index.ts b/web/src/api/gas/handdetector/index.ts index 46af978..60deb22 100644 --- a/web/src/api/gas/handdetector/index.ts +++ b/web/src/api/gas/handdetector/index.ts @@ -28,10 +28,11 @@ export interface HandDetector { export interface HandDetectorData extends HandDetector { time?: number // 时间 value?: number // 数值 - gasStatus?: number //气体报警状态 - batteryStatus?: number //电池报警状态 - fenceStatus?: number //电子围栏报警状态 - onlineStatus?: number //在线状态 + battery?: number // 电池电量 + gasStatus?: number //气体报警状态 （0：正常；1：报警） + batteryStatus?: number //电池报警状态 （0：正常；1：报警） + fenceStatus?: number //电子围栏报警状态 （0：正常；1：报警） + onlineStatus?: number //在线状态 （0：离线；1：在线） } // GAS手持探测器 API diff --git a/web/src/api/gas/tdengine/index.ts b/web/src/api/gas/tdengine/index.ts index 26c8619..c067fd1 100644 --- a/web/src/api/gas/tdengine/index.ts +++ b/web/src/api/gas/tdengine/index.ts @@ -26,6 +26,11 @@ export interface tdengineOriginalStruct { ts: string | number // 更新时间 } +interface tdHistoricalSnStructParams { + sn: string // 设备编号 + startTime?: string | number // 开始时间 + endTime?: string | number // 结束时间 +} // 历史记录 export const tdengineApi = { // 获取历史数据 @@ -35,5 +40,9 @@ export const tdengineApi = { // 获取原始数据 getOriginalLogPage: async (params: any) => { return await request.get({ url: `/gas/tdengine/originalLogPage`, params }) + }, + // 获取轨迹数据 + getHistoricalSn: async (params: tdHistoricalSnStructParams) => { + return await request.get({ url: `/gas/tdengine/HistoricalSn`, params }) } } diff --git a/web/src/views/HandDevice/Home/components/OpenLayerMap.vue b/web/src/views/HandDevice/Home/components/OpenLayerMap.vue index af7ecc3..ae8621c 100644 --- a/web/src/views/HandDevice/Home/components/OpenLayerMap.vue +++ b/web/src/views/HandDevice/Home/components/OpenLayerMap.vue @@ -22,7 +22,7 @@ @stop="stopTrajectory" @speed-change="setTrajectorySpeed" @time-change="setTrajectoryTime" - @time-range-change="setTrajectoryTimeRange" + @time-range-change="setTrajectoryTimeRangeCustom" />
@@ -81,6 +81,7 @@ const props = withDefaults(defineProps(), { const emit = defineEmits<{ (e: 'fence-draw-complete', coordinates: [number, number][]): void (e: 'refresh-fences'): void + (e: 'time-range-change', range: { startTime: number; endTime: number }): void }>() // 响应式状态 const showMarkers = ref(props.showMarkers) @@ -127,22 +128,23 @@ const { setupTrajectoryWatcher, cleanup: cleanupTrajectory } = useTrajectoryControls() - +// 自定义设置轨迹时间范围 +const setTrajectoryTimeRangeCustom = (range: { startTime: number; endTime: number }) => { + setTrajectoryTimeRange(range) + emit('time-range-change', range) +} const { setupMapEventListeners } = useMapEvents() // 控制函数 const toggleTrajectories = () => { - if (showTrajectoriesStatus.value && trajectoryPlayState.value.isPlaying) { cleanupTrajectory() } - showTrajectoriesStatus.value = !showTrajectoriesStatus.value + showTrajectoriesStatus.value = !showTrajectoriesStatus.value // console.log(showTrajectoriesStatus.value, props.markers); if (showTrajectoriesStatus.value) { setTrajectoriesVisible(showTrajectoriesStatus.value, props.markers) } - - } const toggleMarkers = () => { @@ -181,7 +183,7 @@ const init = () => { // 设置初始显示状态 setMarkersVisible(showMarkers.value) - setTrajectoriesVisible(showTrajectoriesStatus.value, props.markers) + setTrajectoriesVisible(showTrajectoriesStatus.value, []) setFencesVisible(showFences.value) // 设置事件监听器,打开弹窗,点击设备 marker 时触发 @@ -199,9 +201,8 @@ const init = () => { panelVisible.value = true }, onZoomEnd: (zoom: number) => { - // console.log('onZoomEnd', zoom) + console.log('onZoomEnd', zoom) services.markerService?.createMarkerLayer(props) - // updateMarkers(props.markers || [],props) } // refreshMarkerStyles } @@ -212,7 +213,7 @@ const init = () => { // 设置状态监听器 const { setupAllWatchers } = useMapWatchers({ showMarkers, - showTrajectoriesStatus:showTrajectoriesStatus, + showTrajectoriesStatus: showTrajectoriesStatus, showFences, showDrawFences, setMarkersVisible, @@ -259,6 +260,37 @@ const fitToMarkers = () => { services.mapService?.fitToMarkers(markerCoords) } } +const setCenter = (coords: [number, number]) => { + console.log('setCenter', coords) + + if (isMapInitialized) { + services.mapService?.setCenter(coords) + } +} +/** + * 显示轨迹 + */ +const showTrajectory = (startTime: number, endTime: number, markers: MarkerData[]) => { + if (isMapInitialized) { + // if (!markers || markers.length === 0) { + // return + // } + setTrajectoryTimeRange({ startTime, endTime }) + var latLng: [number, number][] = [] + markers.map((marker) => [ + marker.data.map((item) => { + if (item.longitude && item.latitude) { + latLng.push([item.longitude, item.latitude]) + } + }) + ]) + services.mapService?.fitToMarkers(latLng) + showTrajectoriesStatus.value = true + console.log('showTrajectory', latLng) + + setTrajectoriesVisible(true, markers) + } +} const refreshFences = () => { if (isMapInitialized) { @@ -290,7 +322,7 @@ onMounted(() => { }, 100) }) -defineExpose({ refreshFences, fitToMarkers }) +defineExpose({ refreshFences, fitToMarkers, setCenter, showTrajectory })