1

src/components/devices/ScaleCard.vue

@@ -0,0 +1,24 @@
+<script setup lang="ts">
+import { toRefs } from 'vue'
+import type { HomeAssistantDiscoveredDevice } from '../../services/health'
+import { useDeviceControlContext } from '../../devices/controlContext'
+const props = defineProps<{ device: HomeAssistantDiscoveredDevice }>()
+const { device: scaleDevice } = toRefs(props)
+</script>
+
+<template>
+<section class="device-card" v-if="scaleDevice">
+        <div class="device-head">
+          <div class="dev-info">
+            <span class="category-tag">健康身体成分</span>
+            <h3>{{ scaleDevice.name }}</h3>
+            <span class="status-dot" :class="{ online: scaleDevice.online }">
+              {{ scaleDevice.online ? '已绑定就绪' : '设备离线' }}
+            </span>
+          </div>
+        </div>
+        <p class="scale-note">
+          体脂秤数据是否自动同步取决于设备接入能力；当前 Demo 按健康档案中保存的身高、体重计算 BMI。
+        </p>
+      </section>
+</template>