fix: 优化安防箱环境数据卡片空标签渲染并重构风扇展示

为温度、湿度、门禁和防雷标签添加数据存在性判断,避免渲染空标签;移除冗余计算属性,改为循环直接展示每个风扇转速
This commit is contained in:
yangsy
2026-05-20 12:04:04 +08:00
parent eaa855a09e
commit 848f2a0018
@@ -35,11 +35,6 @@ const getStatusTagType = (status: string | null) => {
if (['失效', '开门'].includes(status ?? '')) return 'error';
return 'default';
};
const formattedFanSpeeds = computed(() => {
if (!fanSpeeds?.value || fanSpeeds.value.length === 0) return null;
return fanSpeeds.value.map((speed, index) => `风扇${index + 1}: ${speed} RPM`).join(', ');
});
</script>
<template>
@@ -49,7 +44,7 @@ const formattedFanSpeeds = computed(() => {
</template>
<template #default>
<NFlex vertical>
<NTag>
<NTag v-if="!!temperature">
<template #icon>
<NIcon :component="ThermometerIcon" />
</template>
@@ -57,7 +52,7 @@ const formattedFanSpeeds = computed(() => {
<span>温度: {{ temperature }}</span>
</template>
</NTag>
<NTag>
<NTag v-if="!!humidity">
<template #icon>
<NIcon :component="DropletIcon" />
</template>
@@ -65,15 +60,15 @@ const formattedFanSpeeds = computed(() => {
<span>湿度: {{ humidity }}%</span>
</template>
</NTag>
<NTag>
<NTag v-for="(speed, index) in fanSpeeds ?? []" :key="index">
<template #icon>
<NIcon :component="FanIcon" />
</template>
<template #default>
<span>风扇: {{ formattedFanSpeeds }}</span>
<span>风扇{{ index + 1 }}: {{ speed }} RPM</span>
</template>
</NTag>
<NTag :type="getStatusTagType(accessControlStatus)">
<NTag v-if="!!accessControlStatus" :type="getStatusTagType(accessControlStatus)">
<template #icon>
<NIcon :component="ShieldIcon" />
</template>
@@ -81,7 +76,7 @@ const formattedFanSpeeds = computed(() => {
<span>门禁: {{ accessControlStatus }}</span>
</template>
</NTag>
<NTag :type="getStatusTagType(lightningProtectionStatus)">
<NTag v-if="!!lightningProtectionStatus" :type="getStatusTagType(lightningProtectionStatus)">
<template #icon>
<NIcon :component="ZapIcon" />
</template>