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-16 14:46:31 +08:00
parent 3930a6a988
commit 026d581ca8
4 changed files with 129 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
src/views/projectAdmin/dataBoard/digitalSite/index.vue
View File

@ -142,7 +142,7 @@
<!-- 人脸闸机弹框 -->
<FaceGate v-if="showFaceDevDialog" :close="() => (showFaceDevDialog = false)" :data="{ ...faceDevDialogData }"></FaceGate>
<!-- 环境设备弹框 -->
<div class="environBox pointDialog_s" v-show="showEnvironDialog" :style="{ left: environBoxPos.x, top: environBoxPos.y }">
<div class="environBox pointDialog_s" v-show="showEnvironDialog">
<!-- 实时数据 -->
<div class="title">
{{ environDevDetail.name }} - {{ $t('message.dataBoard.realData') }}
@ -1136,17 +1136,6 @@
<!-- 报警时间： -->
{{ $t('message.dataBoard.alarmTime') + ':' }}{{ transformTimestamp(item.alarmTime) }}
</p>
<!-- <p v-if="item.windSpeedAlarm" class="p1">风速报警:{{item.windSpeedAlarm == 0?'正常':item.windSpeedAlarm == 1?'报警':'预警'}}</p>-->
<!--&lt;!&ndash; <p class="p1">警报类别：{{ item.alarmType == 1?'报警':item.alarmType == 2?'预警':"&#45;&#45;" }}</p>&ndash;&gt;-->
<!-- <p v-if="item.environmentAlarm" class="p2">环境防撞报警:{{item.environmentAlarm == 0?'正常':item.environmentAlarm == 1?'报警':'预警'}}</p>-->
<!-- <p v-if="item.heightAlarm" class="p1">高度上限位报警:{{item.heightAlarm == 0?'正常':item.heightAlarm == 1?'报警':'预警'}}</p>-->
<!-- <p v-if="item.maxRangeAlarm" class="p2">幅度外限位报警:{{item.maxRangeAlarm == 0?'正常':item.maxRangeAlarm == 1?'报警':'预警'}}</p>-->
<!-- <p v-if="item.minRangeAlarm" class="p1">幅度内限位报警:{{item.minRangeAlarm == 0?'正常':item.minRangeAlarm == 1?'报警':'预警'}}</p>-->
<!-- <p v-if="item.momentAlarm" class="p2">力矩报警:{{item.momentAlarm == 0?'正常':item.momentAlarm == 1?'报警':'预警'}}</p>-->
<!-- <p v-if="item.multiAlarm" class="p1">多机防撞报警:{{item.multiAlarm == 0?'正常':item.multiAlarm == 1?'报警':'预警'}}</p>-->
<!-- <p v-if="item.negAngleAlarm" class="p2">逆时针回转限位报警:{{item.negAngleAlarm == 0?'正常':item.negAngleAlarm == 1?'报警':'预警'}}</p>-->
<!-- <p v-if="item.posAngleAlarm" class="p1">顺时针回转限位报警 :{{item.posAngleAlarm == 0?'正常':item.posAngleAlarm == 1?'报警':'预警'}}</p>-->
</div>
</div>
</vue-scroll>
@ -2178,10 +2167,6 @@ export default {
},
showEnvironDialog: false,
environDevDetail: { name: '' },
environBoxPos: {
x: 0,
y: 0
},
showVideoDialog: false,
showVideoDialog2: false,
showFaceDevDialog: false,
@ -2940,16 +2925,6 @@ export default {
break
case 6:
this.environDevDetail = item
if (parseFloat(item.mapY) > 500) {
this.environBoxPos.y = parseFloat(item.mapY) - 200 + 'px'
} else {
this.environBoxPos.y = parseFloat(item.mapY) + 0 + 'px'
}
if (parseFloat(item.mapX / this.imgWidthScale) > 510) {
this.environBoxPos.x = parseFloat(item.mapX) / this.imgWidthScale - 350 + 'px'
} else {
this.environBoxPos.x = parseFloat(item.mapX) / this.imgWidthScale + 50 + 'px'
}
this.showEnvironDialog = true
this.getRealTimeDustNoiseData(item.devSn)
break
@ -3130,50 +3105,15 @@ export default {
this.environmentTotalAlarm = result.alarmTotal.totalAlarm
}
})
// // 获取报警列表数据
// getAIDangerList(data).then((res) => {
// if (res.code === 200) {
// let { result } = res;
// console.log(result);
// let type = [
// "烟感",
// "明火",
// "人员倒地",
// "未戴安全帽",
// "区域入侵",
// "越界入侵",
// "人员聚集衣",
// "反光衣",
// "裸土覆盖",
// ];
// this.AIDangerAlarmList = result.slice(0, 6).map((x) => {
// return {
// createTime: x.createTime,
// hardwareName: x.hardwareName,
// id: x.id,
// imageUrl: x.imageUrl,
// location: x.location,
// projectName: x.projectName,
// alarmType: type[x.alarmType - 1],
// };
// });
// }
// this.pieAnalyse()
// });
},
//获取环境设备详情数据
getRealTimeDustNoiseData(deviceId) {
let Id = deviceId
let data = {
deviceId: deviceId,
projectSn: this.projectSn
}
getRealTimeDustNoiseDataApi(data).then(res => {
getRealTimeDustNoiseDataApi({ deviceId, projectSn: this.projectSn }).then(res => {
if (res.code == 200) {
if (res.result) {
this.plantCap = res.result
this.plantCapInterval = setTimeout(() => {
this.getRealTimeDustNoiseData(Id)
this.getRealTimeDustNoiseData(deviceId)
}, 5000)
} else {
this.plantCap = {

24
src/views/projectAdmin/jlw/digitalSite/centerTop.vue
View File

@ -9,6 +9,7 @@
@click="handlePoint(point)"
></div>
<FaceGageDialog v-if="faceGateDialog" :close="() => (faceGateDialog = false)" :data="faceGateData" />
<EnvironmentDialog v-if="environmentDialog" :data="environmentInfo" :close="() => (environmentDialog = false)" />
</div>
<div class="tabs">
<div class="tab" :class="{ checked: index === tabIndex }" v-for="(tab, index) in tabs" :key="index" @click="changeTab(index)">
@ -22,9 +23,11 @@
import Card from '../components/Card.vue'
import JNestedRingChart from '../jChart/pie/JNestedRingChart.vue'
import FaceGageDialog from './components/FaceGageDialog.vue'
import EnvironmentDialog from './components/EnvironmentDialog.vue'
import { selectWorkerAttendanceByDevApi } from '@/assets/js/api/dataBoard'
import { getRealTimeDustNoiseDataApi } from '@/assets/js/api/environmentManage'
export default {
components: { Card, JNestedRingChart, FaceGageDialog },
components: { Card, JNestedRingChart, FaceGageDialog, EnvironmentDialog },
props: {
title: {
type: String,
@ -32,7 +35,8 @@ export default {
}
},
mounted() {
this.selectWorkerAttendanceByDev()
this.getFaceGateInfo()
this.getEnvironmentInfo()
},
data() {
return {
@ -51,7 +55,9 @@ export default {
list: [],
totalAttendance: { inTotalNum: 0, outTotalNum: 0 },
ufaceDev: { deviceState: 1 }
}
},
environmentDialog: false,
environmentInfo: {}
}
},
methods: {
@ -64,17 +70,27 @@ export default {
case 'gate':
this.faceGateDialog = true
break
case 'environment':
this.environmentDialog = true
break
default:
break
}
},
selectWorkerAttendanceByDev() {
getFaceGateInfo() {
selectWorkerAttendanceByDevApi({
projectSn: this.projectSn,
devSn: '2525'
}).then(res => {
this.faceGateData = { ...res.result }
})
},
getEnvironmentInfo() {
getRealTimeDustNoiseDataApi({ deviceId: 'BDDA658E1AB347B783E5FAA283466CA9', projectSn: this.projectSn }).then(res => {
if (res.code == 200) {
this.environmentInfo = res.result || {}
}
})
}
},
computed: {

106
src/views/projectAdmin/jlw/digitalSite/components/EnvironmentDialog.vue Normal file
View File

@ -0,0 +1,106 @@
<template>
<div class="environmentDialog">
<div class="title">
<div class="text">实时数据</div>
<div class="close" @click="close">×</div>
</div>
<div class="info">
<div class="info-item">
<div class="value">--<span>ug/m³</span></div>
<div class="label">PM10</div>
</div>
<div class="info-item">
<div class="value">--<span>ug/m³</span></div>
<div class="label">PM2.5</div>
</div>
<div class="info-item">
<div class="value">--<span>m/s</span></div>
<div class="label">风速</div>
</div>
<div class="info-item">
<div class="value">--</div>
<div class="label">风向</div>
</div>
<div class="info-item">
<div class="value">--<span>db</span></div>
<div class="label">噪音</div>
</div>
<div class="info-item">
<div class="value">--<span>℃</span></div>
<div class="label">温度</div>
</div>
<div class="info-item">
<div class="value">--<span>%</span></div>
<div class="label">湿度</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
close: {
type: Function,
default: () => {}
},
data: {
type: Object,
default: () => ({})
}
}
}
</script>
<style lang="less" scoped>
.environmentDialog {
position: absolute;
top: 30px;
left: 30px;
padding: 20px;
width: 400px;
height: 360px;
border: 1px solid #0081c3;
background-color: #07162b;
.title {
margin-bottom: 20px;
display: flex;
align-items: center;
.text {
margin-right: auto;
}
.close {
margin-left: 10px;
font-size: 20px;
color: #61c9d6;
cursor: pointer;
&:hover {
color: #ff6c7f;
}
}
}
.info {
display: flex;
flex-wrap: wrap;
.info-item {
margin-bottom: 30px;
width: 100px;
height: 80px;
border: 1px solid #999;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
&:not(:nth-child(3n)) {
margin-right: 40px;
}
.value {
margin-bottom: 8px;
span {
margin-left: 4px;
}
}
}
}
}
</style>

6
src/views/projectAdmin/jlw/digitalSite/components/FaceGageDialog.vue
View File

@ -29,12 +29,6 @@ export default {
default: () => ({})
}
},
mounted() {
console.log(this.data, '是第三方士大夫')
setTimeout(() => {
console.log(this.data, '收待发送发生的方法')
}, 2000)
},
computed: {
isOnline() {
return this.data.ufaceDev && this.data.ufaceDev.deviceState === '1'