feat: Play sound

toos-dashboard/src/components/Status.vue

@@ -0,0 +1,31 @@
+<template>
+  <div class="text-white flex justify-center w-full bg-neutral-800 py-3">
+    <span class="font-bold">PORT {{serialConfig.port}} is
+      <span v-if="serialConfig.open" class="text-green-500 hover:cursor-pointer" @click="closePort">OPEN</span>
+      <span v-else class="text-red-600 hover:cursor-pointer" @click="openPort">CLOSED</span>
+    </span>
+  </div>
+</template>
+
+<script setup>
+import { useLocalStorage } from '@vueuse/core'
+import { invoke } from "@tauri-apps/api/tauri"
+
+const serialConfig = useLocalStorage('serialConfig', { port: '', baud: 9600, open: false })
+
+const openPort = () => {
+  try {
+    invoke('open_port', { portName: serialConfig.value.port, baud: serialConfig.value.baud });
+  } catch (err) {
+    console.error(err);
+  }
+}
+
+const closePort = async () => {
+  try {
+    await invoke('close_port', { portName: serialConfig.value.port, baud: serialConfig.value.baud });
+  } catch (err) {
+    console.error(err);
+  }
+}
+</script>