103 lines
3.0 KiB
Vue
103 lines
3.0 KiB
Vue
<template>
|
|
<n-card title="姿态参数" class="h-full">
|
|
<n-space vertical justify="space-around" class="h-full">
|
|
<n-descriptions label-placement="left">
|
|
<n-descriptions-item label="X角加速度">
|
|
{{ x_angular_acceleration }}
|
|
</n-descriptions-item>
|
|
</n-descriptions>
|
|
<n-descriptions label-placement="left">
|
|
<n-descriptions-item label="Y角加速度">
|
|
{{ y_angular_acceleration }}
|
|
</n-descriptions-item>
|
|
</n-descriptions>
|
|
<n-descriptions label-placement="left">
|
|
<n-descriptions-item label="Z角加速度">
|
|
{{ z_angular_acceleration }}
|
|
</n-descriptions-item>
|
|
</n-descriptions>
|
|
<n-descriptions label-placement="left">
|
|
<n-descriptions-item label="X轴加速度">
|
|
{{ x_axis_acceleration }}
|
|
</n-descriptions-item>
|
|
</n-descriptions>
|
|
<n-descriptions label-placement="left">
|
|
<n-descriptions-item label="Y轴加速度">
|
|
{{ y_axis_acceleration }}
|
|
</n-descriptions-item>
|
|
</n-descriptions>
|
|
<n-descriptions label-placement="left">
|
|
<n-descriptions-item label="Z轴加速度">
|
|
{{ z_axis_acceleration }}
|
|
</n-descriptions-item>
|
|
</n-descriptions>
|
|
</n-space>
|
|
</n-card>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { ref } from 'vue'
|
|
import { NCard, NSpace, NDescriptions, NDescriptionsItem, useMessage } from 'naive-ui'
|
|
|
|
import { LineBreakParser } from '@/utils/parser'
|
|
|
|
const message = useMessage()
|
|
|
|
const x_angular_acceleration = ref()
|
|
const y_angular_acceleration = ref()
|
|
const z_angular_acceleration = ref()
|
|
|
|
const x_axis_acceleration = ref()
|
|
const y_axis_acceleration = ref()
|
|
const z_axis_acceleration = ref()
|
|
|
|
|
|
const handle = (data: string) => {
|
|
const startMarkIndex = data.indexOf('@')
|
|
const checksumMarkIndex = data.indexOf('*')
|
|
|
|
if (startMarkIndex < 0 || checksumMarkIndex < startMarkIndex) return
|
|
|
|
// 校验和验证
|
|
const info = data.substring(startMarkIndex + 1, checksumMarkIndex)
|
|
const cs = parseInt(data.substring(checksumMarkIndex + 1))
|
|
if (cs != info.length + 2) return
|
|
|
|
const infoArr = info.split(',')
|
|
if (infoArr.length != 7 || infoArr[0] != 'POSE') return
|
|
|
|
x_angular_acceleration.value = infoArr[1]
|
|
y_angular_acceleration.value = infoArr[2]
|
|
z_angular_acceleration.value = infoArr[3]
|
|
x_axis_acceleration.value = infoArr[4]
|
|
y_axis_acceleration.value = infoArr[5]
|
|
z_axis_acceleration.value = infoArr[6]
|
|
}
|
|
|
|
const decoder = new TextDecoder()
|
|
const parser = new LineBreakParser()
|
|
const onSerialPortData = (value: Uint8Array) => {
|
|
const lineArr = parser.parse(decoder.decode(value))
|
|
lineArr.forEach(line => handle(line))
|
|
}
|
|
|
|
const connectErrMsg = (value: Boolean) => {
|
|
message.error('无法连接到串口设备')
|
|
}
|
|
|
|
window.ipcRenderer.receive('CANNOT_CONNECT',connectErrMsg)
|
|
window.ipcRenderer.send('COM_ON')
|
|
window.ipcRenderer.receive('COM_LISTENER',onSerialPortData)
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
:deep(.n-card-header) {
|
|
font-size: 4vh;
|
|
}
|
|
|
|
:deep(.n-descriptions) {
|
|
font-size: 3vh;
|
|
}
|
|
</style>
|
|
|