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-13 11:53:47 +08:00
parent c39af50010
commit 343ecebd3d
2 changed files with 44 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/views/projectAdmin/jlw/components/CountList.vue
View File

@ -17,15 +17,17 @@
</div>
</div>
<div class="list">
<div class="list-item" :class="i === 2 ? 'offline' : 'online'" v-for="i in 3" :key="i">
<div class="status">在线</div>
<div class="label">1号塔吊</div>
<div class="num" v-if="type === 'waring'">今日报警：2</div>
<div class="persons" v-if="type === 'persons'">
<div class="person">进场人数：67</div>
<div class="person">出场人数：67</div>
<vue-scroll>
<div class="list-item" :class="item.devonline == '0' ? 'online' : 'offline'" v-for="(item, i) in list" :key="i">
<div class="status">{{ item.devonline == '0' ? '在线' : '离线' }}</div>
<div class="label">{{ item.devName }}</div>
<div class="num" v-if="type === 'waring'">今日报警：{{ item.alarmNum }}</div>
<div class="persons" v-if="type === 'persons'">
<div class="person">进场人数：67</div>
<div class="person">出场人数：67</div>
</div>
</div>
</div>
</vue-scroll>
</div>
</div>
</template>
@ -69,6 +71,7 @@ export default {
<style lang="less" scoped>
.h-count-list {
height: 100%;
.counts {
padding: 10px 26px 20px;
display: flex;
@ -85,9 +88,15 @@ export default {
&.towercrane {
background-image: url('~@/views/projectAdmin/dataBoard/projectHuScreen/assets/images/icons/i-tower-crane.png');
}
&.towercrane2 {
background-image: url('~@/views/projectAdmin/dataBoard/projectHuScreen/assets/images/icons/i-tower-crane2.png');
}
&.warring {
background-image: url('~@/views/projectAdmin/dataBoard/projectHuScreen/assets/images/icons/i-warring.png');
}
&.warring2 {
background-image: url('~@/views/projectAdmin/dataBoard/projectHuScreen/assets/images/icons/i-warring2.png');
}
&.facegate {
background-image: url('~@/views/projectAdmin/dataBoard/projectHuScreen/assets/images/icons/i-face-gate.png');
}
@ -109,6 +118,7 @@ export default {
}
.list {
height: calc(100% - 90px);
padding: 0 10px;
.list-item {
margin-bottom: 6px;

71
src/views/projectAdmin/jlw/digitalSite/leftTop.vue
View File

@ -1,6 +1,7 @@
<template>
<Card :title="title">
<DeviceCard
<!-- 无用功 -->
<!-- <DeviceCard
:leftCount="{ value: totalTowerDev, label: '塔吊设备数', img: 'towercrane2' }"
:rightCount="{ value: totalDangerTowerDev, label: '今日报警数', img: 'warring2' }"
>
@ -9,20 +10,28 @@
<div class="item">离线</div>
</div>
<JBarChart :tooltip="{}" :xData="xData" :yData="yData" />
</DeviceCard>
</DeviceCard> -->
<CountList
:allCount="{ value: totalTowerDev, label: '塔吊总数', img: 'towercrane2' }"
:todayCount="{ value: totalDangerTowerDev, label: '今日报警总数', img: 'warring2' }"
:list="towerList"
/>
</Card>
</template>
<script>
import Card from "../components/Card.vue";
import DeviceCard from "./components/DeviceCard.vue";
import JBarChart from "../jChart/bar/JBarChart.vue";
import Card from '../components/Card.vue'
// import DeviceCard from './components/DeviceCard.vue'
// import JBarChart from '../jChart/bar/JBarChart.vue'
import CountList from '../components/CountList.vue'
export default {
components: { Card, DeviceCard, JBarChart },
// components: { Card, DeviceCard, JBarChart },
components: { Card, CountList },
props: {
title: {
type: String,
default: ""
default: ''
},
towerList: {
type: Array,
@ -30,48 +39,20 @@ export default {
},
totalTowerDev: {
type: Number,
default: ""
default: ''
},
totalDangerTowerDev: {
type: Number,
default: ""
default: ''
}
},
data() {
const yData = [23, 44, 63, 12, 45, 78, 34, 67].map((value, i) => {
if (i > 4 && i < 7) {
return {
name: "离线",
value,
itemStyle: { color: "#FF6C7F" }
};
} else {
return {
name: "报警数",
value,
itemStyle: { color: "#3CABFD" }
};
}
});
return {
xData: ["1号", "2号", "3号", "4号", "5号", "6号", "7号", "8号"],
yData
};
},
mounted() {
// console.log("------", this.towerList, this.totalTowerDev);
// 备注：此处xy轴数据没有处理 报警数很多为0 无法渲染
//var datax = [],datay =[]
//this.towerList.forEach((item)=>{
// datax.push(item.devName)
// datay.push(item.alarmNum)
// if(item.deviceState == 1){
// }
//})
// this.xData = datax
// console.log('塔吊设备--------', this.xData)
}
};
// data() {
// return {
// xData: [],
// yData: []
// }
// }
}
</script>
<style lang="less" scoped>
@ -87,7 +68,7 @@ export default {
align-items: center;
&::before {
margin-right: 8px;
content: "";
content: '';
width: 16px;
height: 6px;
border-radius: 2px;