|
|
|
|
@ -19,7 +19,7 @@ |
|
|
|
|
:key="device.id || Math.random()" |
|
|
|
|
class="device-item" |
|
|
|
|
@click="showDeviceDetail(device)"> |
|
|
|
|
<div :class="['device-status', `status-${device.status || 'normal'}`]"></div> |
|
|
|
|
<div :class="['device-status', `status-${Number(device.health||0)}`]"></div> |
|
|
|
|
<div class="device-name">{{ device.equManuName || device.name || '未知设备' }}</div> |
|
|
|
|
<div class="device-value"> |
|
|
|
|
<span :class="['health-icon', `health-${Number(device.health||0)}`]"> |
|
|
|
|
@ -1398,7 +1398,28 @@ export default { |
|
|
|
|
margin-bottom: 5px; |
|
|
|
|
line-height: 1.5; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.status-0 { |
|
|
|
|
background: #9E9E9E; |
|
|
|
|
box-shadow: 0 0 5px #9E9E9E; |
|
|
|
|
} |
|
|
|
|
.status-1 { |
|
|
|
|
background: #4CAF50; |
|
|
|
|
box-shadow: 0 0 5px #4CAF50; |
|
|
|
|
} |
|
|
|
|
.status-2 { |
|
|
|
|
background: #FF9800; |
|
|
|
|
box-shadow: 0 0 5px #FF9800; |
|
|
|
|
} |
|
|
|
|
.status-4 { |
|
|
|
|
background: #F44336; |
|
|
|
|
box-shadow: 0 0 5px #F44336; |
|
|
|
|
} |
|
|
|
|
.status-3 { |
|
|
|
|
background: #FFEB3B; |
|
|
|
|
box-shadow: 0 0 5px #FFEB3B; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.status-normal { |
|
|
|
|
background: #4CAF50; |
|
|
|
|
box-shadow: 0 0 5px #4CAF50; |
|
|
|
|
@ -1436,10 +1457,10 @@ export default { |
|
|
|
|
.health-2{ |
|
|
|
|
color: #FF9800; |
|
|
|
|
} |
|
|
|
|
.health-3{ |
|
|
|
|
.health-4{ |
|
|
|
|
color: #F44336; |
|
|
|
|
} |
|
|
|
|
.health-4{ |
|
|
|
|
.health-3{ |
|
|
|
|
color: #FFEB3B; |
|
|
|
|
} |
|
|
|
|
.health-0{ |
|
|
|
|
|