61 lines
1.7 KiB
Vue
61 lines
1.7 KiB
Vue
<template>
|
|
<div class="w-h-full fixed">
|
|
<EarthView ref="earthViewInstance" />
|
|
</div>
|
|
<div class="w-h-full fixed grid grid-cols-2 p-10 front-container">
|
|
<div class="text-left">
|
|
<SNRView ref="snrViewInstance" />
|
|
</div>
|
|
<div class="text-center w-1/2 ml-auto">
|
|
<PlanisphereView ref="planisphereViewInstance" />
|
|
</div>
|
|
<div class="text-left">
|
|
<NMEAView ref="nmeaViewInstance" />
|
|
</div>
|
|
<div class="text-center w-1/2 ml-auto">
|
|
<BaseInfoView ref="baseInfoViewInstance" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ref, onMounted } from 'vue'
|
|
import SNRView from './components/SNRView.vue'
|
|
import NMEAView from './components/NMEAView.vue'
|
|
import EarthView from './components/EarthView.vue'
|
|
import BaseInfoView from './components/BaseInfoView.vue'
|
|
import PlanisphereView from './components/PlanisphereView.vue'
|
|
|
|
|
|
const nmeaViewInstance = ref(null)
|
|
const snrViewInstance = ref(null)
|
|
const earthViewInstance = ref(null)
|
|
const baseInfoViewInstance = ref(null)
|
|
const planisphereViewInstance = ref(null)
|
|
|
|
|
|
onMounted(() => {
|
|
if ('ipcRenderer' in window) {
|
|
ipcRenderer.receive('NMEA_RECEIVED', nmeaViewInstance.value.update)
|
|
|
|
ipcRenderer.receive('NMEA_HANDLED' , (nmeaStr: string) => {
|
|
const nmea = JSON.parse(nmeaStr)
|
|
|
|
snrViewInstance.value.update(nmea)
|
|
earthViewInstance.value.update(nmea)
|
|
baseInfoViewInstance.value.update(nmea)
|
|
planisphereViewInstance.value.update(nmea)
|
|
})
|
|
|
|
ipcRenderer.send('APP_MOUNTED')
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.front-container {
|
|
grid-template-rows: 55vh;
|
|
background: linear-gradient(to right, rgba(17, 24, 39, 0.8) , transparent, rgba(17, 24, 39, 0.8));
|
|
}
|
|
</style>
|