admin/zhgdyun
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

中建四局(安全管理): 完成设备监控布局

Browse Source
This commit is contained in:
Jack 2022-08-29 14:07:43 +08:00
parent 36ae83f041
commit af0309e793
1 changed files with 54 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
src/views/projectAdmin/zjsj/security/rightTop.vue
View File

@ -1,6 +1,23 @@
<template>
<Card title="设备监控">
设备监控
<div class="devices">
<vue-scroll>
<div class="device" v-for="i in 6" :key="i">
<div class="device-name">压榨机</div>
<div class="info">
<img class="image" src="../assets/images/common/bg-event.jpg" />
<div class="detail">
<div class="detail-item green">状态：进行中</div>
<div class="detail-item grey">电压：10000V</div>
<div class="detail-item orange">电流：100A</div>
<div class="detail-item">线缆温度：120℃</div>
<div class="detail-item">环境温度：53℃</div>
<div class="detail-item">漏电流：99A</div>
</div>
</div>
</div>
</vue-scroll>
</div>
</Card>
</template>
@ -11,4 +28,39 @@ export default {
}
</script>
<style></style>
<style lang="less" scoped>
.devices {
padding-left: 20px;
height: 100%;
color: #fff;
.device {
width: 100%;
height: 176px;
.device-name {
height: 36px;
line-height: 36px;
}
.info {
height: 22px;
line-height: 22px;
font-size: 12px;
color: #68d8e4;
display: flex;
.image {
margin-right: 20px;
width: 170px;
height: 140px;
}
}
}
.green {
color: #46d7b6;
}
.grey {
color: #9da1aa;
}
.orange {
color: #e7622a;
}
}
</style>