28 lines
1.2 KiB
Vue
28 lines
1.2 KiB
Vue
<script setup lang="ts">
|
||
defineProps<{ store: any; actions: any }>()
|
||
</script>
|
||
|
||
<template>
|
||
<section class="panel">
|
||
<div class="section-header">
|
||
<h2>设备状态</h2>
|
||
<div class="actions">
|
||
<button class="primary" :disabled="store.statusLoading" @click="actions.refreshStatus()">
|
||
{{ store.statusLoading ? '刷新中...' : '刷新状态' }}
|
||
</button>
|
||
</div>
|
||
</div>
|
||
<template v-if="store.status">
|
||
<div class="metrics">
|
||
<div class="metric"><div class="label">自检</div><div class="value">{{ store.status.self_check }}</div></div>
|
||
<div class="metric"><div class="label">网口1</div><div class="value">{{ store.status.net1 }}</div></div>
|
||
<div class="metric"><div class="label">网口2</div><div class="value">{{ store.status.net2 }}</div></div>
|
||
<div class="metric"><div class="label">串口1</div><div class="value">{{ store.status.uart1 }}</div></div>
|
||
<div class="metric"><div class="label">串口2</div><div class="value">{{ store.status.uart2 }}</div></div>
|
||
</div>
|
||
<p class="hint">最后刷新：{{ store.statusUpdatedAt || '--' }}</p>
|
||
</template>
|
||
<p v-else>正在加载状态...</p>
|
||
</section>
|
||
</template>
|