fix: 优化安防箱环境数据卡片空标签渲染并重构风扇展示
为温度、湿度、门禁和防雷标签添加数据存在性判断,避免渲染空标签;移除冗余计算属性,改为循环直接展示每个风扇转速
This commit is contained in:
+6
-11
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user