158 lines
4.1 KiB
Vue
158 lines
4.1 KiB
Vue
<template>
|
|
<box1 :scenicSpotId="scenicSpotId" />
|
|
<box2 />
|
|
</template>
|
|
|
|
<script setup>
|
|
import box1 from './components/box-1.vue'
|
|
import box2 from './components/box-2.vue'
|
|
|
|
import { useWebSocket } from '@/hooks/socket'
|
|
import { useScenicStore } from '@/stores/scenic'
|
|
import { mode, socketBaseUrl, proSocketBaseUrl } from '@/utils/config'
|
|
|
|
import PubSub from 'pubsub-js'
|
|
|
|
const scenicStore = useScenicStore()
|
|
|
|
const { isConnected, sendMessage, dataRes } = useWebSocket(
|
|
`${mode == 'dev' ? socketBaseUrl : proSocketBaseUrl}/ws/scenic-spot`
|
|
)
|
|
|
|
let scenicSpotId = ref('')
|
|
let scenicChange = null
|
|
let timer = null
|
|
let timer2 = null
|
|
let keyword = ref('')
|
|
watch(
|
|
() => [isConnected.value, scenicSpotId.value],
|
|
(val) => {
|
|
if (val[0] && val[1]) {
|
|
sendMessage(JSON.stringify({ action: 'start', type: '', scenicSpotId: scenicSpotId.value }))
|
|
sendMessage(
|
|
JSON.stringify({
|
|
action: 'start',
|
|
type: 'secureData',
|
|
scenicSpotId: scenicSpotId.value
|
|
})
|
|
)
|
|
sendMessage(
|
|
JSON.stringify({
|
|
action: 'start',
|
|
type: 'gpsData',
|
|
keyword:keyword.value,
|
|
scenicSpotId: scenicSpotId.value
|
|
})
|
|
)
|
|
}
|
|
},
|
|
{ immediate: true }
|
|
)
|
|
|
|
watch(
|
|
() => dataRes.value,
|
|
(val) => {
|
|
if (val) {
|
|
// console.log(val, '=====')
|
|
switch (val.type) {
|
|
case 'gpsData':
|
|
scenicStore.setVehicleData(val.data)
|
|
break
|
|
case 'wordkOrderlist':
|
|
scenicStore.setWordkOrderList(val.data)
|
|
break
|
|
case 'wordkOrderTotal':
|
|
scenicStore.setWordkOrderData(val)
|
|
break
|
|
case 'scenicSpotData':
|
|
scenicStore.setScenicSpotData(val)
|
|
break
|
|
case 'scenicSppotLineUp':
|
|
scenicStore.setScenicQueueData(val)
|
|
break
|
|
case 'scenicSppotLoad':
|
|
scenicStore.setScenicBearData(val)
|
|
break
|
|
case 'stopCarData':
|
|
scenicStore.setStopCarData(val)
|
|
break
|
|
case 'secureData':
|
|
scenicStore.setSecureData(val)
|
|
break
|
|
case 'trafficInformation':
|
|
scenicStore.setTrafficData(val)
|
|
break
|
|
case 'userPortrait':
|
|
scenicStore.setUserPortraitData(val)
|
|
break
|
|
case 'carShipData':
|
|
console.log(val,'carShipData')
|
|
scenicStore.setCarShipData(val.data)
|
|
break
|
|
}
|
|
if (!timer) sendCarShip()
|
|
// if (!timer2) sendTimer2()
|
|
}
|
|
}
|
|
)
|
|
const sendTimer2 = (e) =>{
|
|
timer2 = setInterval(() => {
|
|
if (isConnected.value) {
|
|
//用户画像
|
|
sendMessage(
|
|
JSON.stringify({
|
|
action: 'start',
|
|
type: 'userPortrait',
|
|
scenicSpotId: scenicSpotId.value
|
|
})
|
|
)
|
|
//停车数据
|
|
sendMessage(
|
|
JSON.stringify({
|
|
action: 'start',
|
|
type: 'stopCarData',
|
|
scenicSpotId: scenicSpotId.value
|
|
})
|
|
)
|
|
}
|
|
}, 20000)
|
|
}
|
|
const sendCarShip = (e) => {
|
|
timer = setInterval(() => {
|
|
if (isConnected.value) {
|
|
//车船数据
|
|
sendMessage(
|
|
JSON.stringify({
|
|
action: 'start',
|
|
type: 'carShipData',
|
|
scenicSpotId: scenicSpotId.value
|
|
})
|
|
) //车窗数据2
|
|
sendMessage(
|
|
JSON.stringify({
|
|
action: 'start',
|
|
type: 'gpsData',
|
|
keyword:keyword.value,
|
|
scenicSpotId: scenicSpotId.value
|
|
})
|
|
) //车窗数据
|
|
}
|
|
}, 5000)
|
|
}
|
|
onMounted(() => {
|
|
scenicChange = PubSub.subscribe('scenicChange', (msg, data) => {
|
|
scenicSpotId.value = data.scenicSpotId
|
|
})
|
|
PubSub.subscribe('keywordChange', (msg, data) => {
|
|
keyword.value = data
|
|
sendMessage(JSON.stringify({ action: 'start', type: '',"keyword":keyword.value, scenicSpotId: scenicSpotId.value }))
|
|
})
|
|
})
|
|
onUnmounted(() => {
|
|
if (scenicChange) PubSub.unsubscribe(scenicChange)
|
|
if (timer) clearInterval(timer)
|
|
})
|
|
</script>
|
|
|
|
<style scoped lang="scss"></style>
|