实现卫星表格数据的更新

src/main/app.ts

@@ -23,9 +23,9 @@ function createWindow(page: String) {
 
 function launch() {
   // createWindow('satellite-data-monitor-platform')
-  // createWindow('satellite-info-monitor-platform')
+  createWindow('satellite-info-monitor-platform')
   // createWindow('satellite-signal-monitor-platform')
-  createWindow('satellite-state-monitor-platform')
+  // createWindow('satellite-state-monitor-platform')
 }
 
 app.whenReady().then(launch)

src/render/api/util.js

@@ -40,3 +40,28 @@ export function getNMEAObj(nmeaStr) {
 
   return JSON.parse(nmeaStr)
 }
+
+export function getGSAGSV (nmeaStr) {
+  const nmeaObj = getNMEAObj(nmeaStr)
+  if (!nmeaObj || !nmeaObj.GSV || !nmeaObj.GSA) return null
+
+  const { GSV, GSA } = nmeaObj
+  const bd = {
+    GSVArr: GSV.filter((gsv) => gsv.talker_id === 'BD'),
+    GSAArr: GSA.filter((gsa) => gsa.talker_id === 'BD')
+  }
+  const gp = {
+    GSVArr: GSV.filter((gsv) => gsv.talker_id === 'GP'),
+    GSAArr: GSA.filter((gsa) => gsa.talker_id === 'GP')
+  }
+  const gl = {
+    GSVArr: GSV.filter((gsv) => gsv.talker_id === 'GL'),
+    GSAArr: GSA.filter((gsa) => gsa.talker_id === 'GL')
+  }
+  const ga = {
+    GSVArr: GSV.filter((gsv) => gsv.talker_id === 'GA'),
+    GSAArr: GSA.filter((gsa) => gsa.talker_id === 'GA')
+  }
+
+  return { bd, gp, gl, ga }
+}

src/render/components/ScrollBoardTable.vue

@@ -12,7 +12,7 @@
     <div class="table-body flex flex-col overflow-hidden">
       <div
         class="row-item flex"
-        v-for="(row, ri) in satellites"
+        v-for="(row, ri) in data.satellites"
         :key="`${row.toString()}`"
         :style="`
           line-height: 40px;
@@ -36,24 +36,23 @@ import { reactive } from 'vue'
 const oddRowBGC  = '#003B51'
 const evenRowBGC = '#0A2732'
 
-const header = ['#', '卫星编号', '仰角', '方位角', '载噪比']
+const header = ['卫星编号', '仰角', '方位角', '载噪比']
-const satellites = reactive([
+const data = reactive({
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+  satellites: [{id: "20", elevationDeg: 68, azimuthTrue: 322, SNRdB: 25}]
-  { id: 2, SVID: '1', ele: '1', az: '1', cn0: '1' },
+})
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+const update = (GSVArr: Array<any>) => {
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+  if (GSVArr.length <= 0 ) return
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+  let satellites: any[] = []
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+  GSVArr.forEach((GSV) => {
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+    satellites = satellites.concat(GSV.satellites)
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+  })
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+  console.log(satellites, '====================');
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+  data.satellites = satellites
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+}
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+
-  { id: 1, SVID: '1', ele: '1', az: '1', cn0: '1' },
+defineExpose({ update })
-])
 </script>
 
 <style scoped>

src/render/components/WaterLevel.vue

@@ -32,7 +32,7 @@ const option = reactive({
         return parseInt(value)
       }
     },
-    data: [60, 0.5, 0.4, 0.3]
+    data: [0, 0.5, 0.4, 0.3]
   }]
 })
 

src/render/page/InfoMonitorPage.vue

@@ -4,7 +4,7 @@
 
     <div class="main-content flex-1 grid grid-cols-3 grid-rows-2 grid-flow-col gap-4">
       <border-box-3>
-        <scroll-board-table />
+        <ScrollBoardTable ref="BDScrollBoardTable" />
       </border-box-3>
       <border-box-3></border-box-3>
       <border-box-3 class="row-span-2"></border-box-3>
@@ -20,11 +20,20 @@ import TheHeader from '../components/Layout/TheHeader.vue'
 import BorderBox3 from '../components/Layout/BorderBox3.vue'
 import ScrollBoardTable from '../components/ScrollBoardTable.vue'
 
-import { onMounted } from 'vue'
+import { ref, onMounted } from 'vue'
+import { getGSAGSV } from '../api/util'
 
+const BDScrollBoardTable = ref(null)
+const update               = (nmeaStr: string) => {
+  const data: any = getGSAGSV(nmeaStr)
+  if (!data) return
+
+  const { bd, gp, gl, ga } = data
+  BDScrollBoardTable.value.update(bd.GSVArr)
+}
 onMounted(() => {
   if ('ipcRenderer' in window) {
-    ipcRenderer.receive('nmea', console.log)
+    ipcRenderer.receive('nmea', update)
 
     ipcRenderer.send('APP_MOUNTED')
   }