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'; if (['失效', '开门'].includes(status ?? '')) return 'error';
return 'default'; 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> </script>
<template> <template>
@@ -49,7 +44,7 @@ const formattedFanSpeeds = computed(() => {
</template> </template>
<template #default> <template #default>
<NFlex vertical> <NFlex vertical>
<NTag> <NTag v-if="!!temperature">
<template #icon> <template #icon>
<NIcon :component="ThermometerIcon" /> <NIcon :component="ThermometerIcon" />
</template> </template>
@@ -57,7 +52,7 @@ const formattedFanSpeeds = computed(() => {
<span>温度: {{ temperature }}</span> <span>温度: {{ temperature }}</span>
</template> </template>
</NTag> </NTag>
<NTag> <NTag v-if="!!humidity">
<template #icon> <template #icon>
<NIcon :component="DropletIcon" /> <NIcon :component="DropletIcon" />
</template> </template>
@@ -65,15 +60,15 @@ const formattedFanSpeeds = computed(() => {
<span>湿度: {{ humidity }}%</span> <span>湿度: {{ humidity }}%</span>
</template> </template>
</NTag> </NTag>
<NTag> <NTag v-for="(speed, index) in fanSpeeds ?? []" :key="index">
<template #icon> <template #icon>
<NIcon :component="FanIcon" /> <NIcon :component="FanIcon" />
</template> </template>
<template #default> <template #default>
<span>风扇: {{ formattedFanSpeeds }}</span> <span>风扇{{ index + 1 }}: {{ speed }} RPM</span>
</template> </template>
</NTag> </NTag>
<NTag :type="getStatusTagType(accessControlStatus)"> <NTag v-if="!!accessControlStatus" :type="getStatusTagType(accessControlStatus)">
<template #icon> <template #icon>
<NIcon :component="ShieldIcon" /> <NIcon :component="ShieldIcon" />
</template> </template>
@@ -81,7 +76,7 @@ const formattedFanSpeeds = computed(() => {
<span>门禁: {{ accessControlStatus }}</span> <span>门禁: {{ accessControlStatus }}</span>
</template> </template>
</NTag> </NTag>
<NTag :type="getStatusTagType(lightningProtectionStatus)"> <NTag v-if="!!lightningProtectionStatus" :type="getStatusTagType(lightningProtectionStatus)">
<template #icon> <template #icon>
<NIcon :component="ZapIcon" /> <NIcon :component="ZapIcon" />
</template> </template>