97 lines
2.9 KiB
Vue
97 lines
2.9 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 } from 'naive-ui'
|
||
|
|
|
||
|
|
import { useSerialPortStore, SerialPortEventType } from '@/stores/serialPort'
|
||
|
|
import { LineBreakParser } from '@/utils/parser'
|
||
|
|
|
||
|
|
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 = (data: Uint8Array) => {
|
||
|
|
const lineArr = parser.parse(decoder.decode(data))
|
||
|
|
lineArr.forEach(line => handle(line))
|
||
|
|
}
|
||
|
|
|
||
|
|
const serialPort = useSerialPortStore()
|
||
|
|
serialPort.addEventListener(SerialPortEventType.data, onSerialPortData)
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="less">
|
||
|
|
:deep(.n-card-header) {
|
||
|
|
font-size: 4vh;
|
||
|
|
}
|
||
|
|
|
||
|
|
:deep(.n-descriptions) {
|
||
|
|
font-size: 3vh;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
|