feat(device): 跌倒状态卡图标替换为产品状态图
- 新增 src/assets/event/ 三张状态图(fall-alert 摔倒报警 / fall-suspect 疑似摔倒 / fall-cleared 解除摔倒) - FallStatusCard 按 alarmType 映射产品图,未匹配状态(驻留/正常/离线) 仍回退 ⌁ 占位字符
This commit is contained in:
parent
5e00280d2c
commit
6ec6fc7138
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
|
|
@ -71,6 +71,11 @@
|
|||
color: $color-primary;
|
||||
}
|
||||
|
||||
.fallIconImg {
|
||||
width: 110px;
|
||||
height: 110px;
|
||||
}
|
||||
|
||||
.fallStatusText {
|
||||
margin-top: 32px;
|
||||
font-size: 44px;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,8 @@
|
|||
import { View, Text } from '@tarojs/components'
|
||||
import { View, Text, Image } from '@tarojs/components'
|
||||
import { FALL_STATUS_MAP } from '@/constants/enums'
|
||||
import fallAlertIcon from '@/assets/event/fall-alert.png'
|
||||
import fallSuspectIcon from '@/assets/event/fall-suspect.png'
|
||||
import fallClearedIcon from '@/assets/event/fall-cleared.png'
|
||||
import styles from './fall-status-card.module.scss'
|
||||
|
||||
interface Props {
|
||||
|
|
@ -19,11 +22,19 @@ const STATUS_CLS: Record<number, string> = {
|
|||
3104: 'warning'
|
||||
}
|
||||
|
||||
// 状态 → 产品状态图:未匹配时(如 3104 驻留、正常、离线)回退到 ⌁ 占位
|
||||
const FALL_ICON_MAP: Record<number, string> = {
|
||||
3101: fallAlertIcon,
|
||||
3102: fallSuspectIcon,
|
||||
3103: fallClearedIcon
|
||||
}
|
||||
|
||||
// ED719 跌倒检测状态卡:实时状态大卡(参考 web 端 DeviceScgDashboard DeviceItem 布局)
|
||||
export function FallStatusCard({ alarmType, status, lastTime, version, online }: Props) {
|
||||
const code = alarmType ?? status
|
||||
const label = FALL_STATUS_MAP[code ?? -1] ?? (online ? '正常' : '离线')
|
||||
const level = STATUS_CLS[code ?? -1] ?? (online ? 'normal' : 'offline')
|
||||
const iconSrc = code != null ? FALL_ICON_MAP[code] : undefined
|
||||
|
||||
return (
|
||||
<View className={`${styles.fallCard} ${styles[`fallCard${cap(level)}`]}`}>
|
||||
|
|
@ -36,7 +47,11 @@ export function FallStatusCard({ alarmType, status, lastTime, version, online }:
|
|||
</View>
|
||||
|
||||
<View className={`${styles.fallIconWrap} ${styles[`fallIconWrap${cap(level)}`]}`}>
|
||||
{iconSrc ? (
|
||||
<Image className={styles.fallIconImg} src={iconSrc} mode="aspectFit" />
|
||||
) : (
|
||||
<Text className={styles.fallIcon}>⌁</Text>
|
||||
)}
|
||||
</View>
|
||||
<Text className={`${styles.fallStatusText} ${styles[`fallStatusText${cap(level)}`]}`}>{label}</Text>
|
||||
{lastTime && <Text className={styles.fallTime}>更新于 {lastTime}</Text>}
|
||||
|
|
|
|||
Loading…
Reference in New Issue