69 lines
2.5 KiB
Vue
69 lines
2.5 KiB
Vue
|
<script setup lang="ts">
|
||
|
|
import { ref } from 'vue'
|
||
|
|
import { useMeshStore } from '@/stores/mesh'
|
||
|
|
|
||
|
|
const mesh = useMeshStore()
|
||
|
|
|
||
|
|
const rebooting = ref(false)
|
||
|
|
const rebootError = ref<string | null>(null)
|
||
|
|
|
||
|
|
async function handleReboot() {
|
||
|
|
rebooting.value = true
|
||
|
|
rebootError.value = null
|
||
|
|
try {
|
||
|
|
await mesh.rebootRadio()
|
||
|
|
} catch (e) {
|
||
|
|
rebootError.value = e instanceof Error ? e.message : 'Failed to reboot radio'
|
||
|
|
} finally {
|
||
|
|
rebooting.value = false
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<div class="glass-card mesh-device-panel">
|
||
|
|
<h3 class="mesh-panel-title">Device</h3>
|
||
|
|
<p class="mesh-panel-sub">Firmware, identity, and radio controls for the connected mesh device</p>
|
||
|
|
|
||
|
|
<div v-if="mesh.status" class="mesh-device-panel-grid">
|
||
|
|
<div class="mesh-stat">
|
||
|
|
<span class="mesh-stat-label">Firmware</span>
|
||
|
|
<span class="mesh-stat-value">{{ mesh.status.firmware_version ?? '—' }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="mesh-stat">
|
||
|
|
<span class="mesh-stat-label">Node ID</span>
|
||
|
|
<span class="mesh-stat-value">{{ mesh.status.self_node_id != null ? `!${mesh.status.self_node_id.toString(16).padStart(8, '0')}` : '—' }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="mesh-stat">
|
||
|
|
<span class="mesh-stat-label">Name</span>
|
||
|
|
<span class="mesh-stat-value">{{ mesh.status.self_advert_name ?? '—' }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="mesh-stat">
|
||
|
|
<span class="mesh-stat-label">Region</span>
|
||
|
|
<span class="mesh-stat-value">{{ mesh.status.region ?? 'Not set' }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="mesh-stat">
|
||
|
|
<span class="mesh-stat-label">Channel</span>
|
||
|
|
<span class="mesh-stat-value">{{ mesh.status.channel_name }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="mesh-stat">
|
||
|
|
<span class="mesh-stat-label">Type</span>
|
||
|
|
<span class="mesh-stat-value">{{ mesh.status.device_type === 'unknown' ? '—' : mesh.status.device_type }}</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="mesh-device-panel-actions">
|
||
|
|
<button
|
||
|
|
class="glass-button mesh-device-reboot-btn"
|
||
|
|
:disabled="rebooting || !mesh.status?.device_connected"
|
||
|
|
@click="handleReboot"
|
||
|
|
>
|
||
|
|
<span v-if="rebooting" class="mesh-spinner" aria-hidden="true"></span>
|
||
|
|
<template v-else>Reboot Radio</template>
|
||
|
|
</button>
|
||
|
|
<p class="mesh-device-reboot-hint">Use this if the device stops responding to sent messages or seems stuck.</p>
|
||
|
|
<p v-if="rebootError" class="mesh-device-reboot-error">{{ rebootError }}</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|