You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
38 lines
1.0 KiB
38 lines
1.0 KiB
3 days ago
|
<template>
|
||
|
|
<OpenLayerMap v-if="inited" :markers="markers" />
|
||
|
|
</template>
|
||
|
|
<script lang="ts" setup>
|
||
|
|
import OpenLayerMap from './components/OpenLayerMap.vue'
|
||
|
|
import { getLastestDetectorData } from '@/api/gas'
|
||
|
|
import { HandDetector } from '@/api/gas/handdetector'
|
||
|
|
import { MarkerData } from './components/types/map.types'
|
||
|
|
const getDataTimer = ref<NodeJS.Timeout | null>(null)
|
||
|
|
const markers = ref<MarkerData[]>([])
|
||
|
|
const inited = ref(false)
|
||
|
|
const getMarkers = async () => {
|
||
|
|
console.log('getMarkers')
|
||
|
|
return await getLastestDetectorData().then((res: HandDetector[]) => {
|
||
|
|
res = res.filter((i) => i.enableStatus === 1)
|
||
|
|
res = res.map((i) => {
|
||
|
|
return {
|
||
|
|
...i,
|
||
|
|
coordinates: [i.longitude, i.latitude],
|
||
|
|
data: []
|
||
|
|
}
|
||
|
|
})
|
||
|
|
markers.value = res as unknown as any[]
|
||
|
|
inited.value = true
|
||
|
|
})
|
||
|
|
}
|
||
|
|
onMounted(() => {
|
||
|
|
getMarkers()
|
||
|
|
getDataTimer.value = setInterval(() => {
|
||
|
|
getMarkers()
|
||
|
|
}, 5000)
|
||
|
|
})
|
||
|
|
onUnmounted(() => {
|
||
|
|
clearInterval(getDataTimer.value as NodeJS.Timeout)
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
<style scoped></style>
|