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

大屏(数字工地)：使用 DataCard 组件优化环境监测代码

Browse Source
This commit is contained in:
Jack 2022-08-01 15:56:33 +08:00
parent 19d199cbd5
commit 8ca784536a
2 changed files with 32 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/views/projectAdmin/dataBoard/digitalSite/DataCard.vue
View File

@ -28,14 +28,30 @@
<vue-scroll>
<div
class="list-item"
:class="item.devonline == 0 ? 'offline' : 'online'"
:class="
item.devonline !== undefined
? item.devonline == 0
? 'offline'
: 'online'
: item.devOnline == 2
? 'offline'
: 'online'
"
v-for="(item, index) in list"
:key="index"
>
<span class="type">
{{ item.devonline == 0 ? '在线' : '离线' }}
{{
item.devonline !== undefined
? item.devonline == 0
? '在线'
: '离线'
: item.devOnline == 2
? '离线'
: '在线'
}}
</span>
<p>{{ item.devName }}</p>
<p>{{ item.devName || item.deviceName }}</p>
<span class="alarm">今日报警:{{ item.alarmNum || 0 }}</span>
</div>
</vue-scroll>

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

@ -151,15 +151,6 @@
ref="bgPackImg"
@load="countBoxSize"
/>
<!-- <el-image
style="width: 100%; height: auto;position: relative;"
:src="bgUrl"
class="bgPackImg"
ref="bgPackImg"
></el-image> -->
<!-- <img class="bgPackImg" src="@/assets/images/longguang2/bg.jpg" style="width: auto; height: auto;position:absolute"
ref="bgPackImg">
<!-- 点位 -->
<div
v-for="(item, index) in pointList"
class="point"
@ -520,11 +511,6 @@
<div class="pointDialog_l" v-if="showVideoDialog">
<i class="closeBtn el-icon-error" @click="closeVideoDialog"></i>
<div class="pointDialogContent">
<!-- <div class="videoListBox">
<ul>
<li></li>
</ul>
</div> -->
<areaTree
@playParams="getPlayParams"
:activeLive="activeLiveData"
@ -2968,54 +2954,19 @@
/>
</div>
</div>
<div class="blockBox">
<!-- 环境监测 -->
<div class="blockTitle">
{{ $t('message.companyDiagram.environmentMonitor') }}
</div>
<div class="blockContent">
<div class="devInfoBox">
<div class="item">
<img src="@/assets/images/dataBoard/online.jpg" />
<div>
<p class="num" style="color: #5181f6">{{ onlineDevNum }}</p>
<p>
<!-- 在线设备 -->
{{ $t('message.dataBoard.onlineDev') }}
</p>
</div>
</div>
<div class="item">
<img src="@/assets/images/dataBoard/offline.jpg" />
<div>
<p class="num" style="color: #f67f51">{{ offlineDevNum }}</p>
<p>
<!-- 离线设备 -->
{{ $t('message.dataBoard.notOnlineDev') }}
</p>
</div>
</div>
<div class="list-box">
<vue-scroll>
<div
class="list-item"
:class="item.devOnline == 2 ? 'offline' : 'online'"
v-for="(item, index) in environmentDevList"
:key="index"
>
<span class="type" v-if="item.devOnline != 2">在线</span>
<span class="type" v-else>离线</span>
<p>{{ item.deviceName }}</p>
<span class="alarm" v-if="item.alarmNum"
>今日报警:{{ item.alarmNum }}</span
>
<span class="alarm" v-else>今日报警:0</span>
</div>
</vue-scroll>
</div>
</div>
</div>
</div>
<!-- 环境监测 -->
<DataCard
:data="{
title: 'companyDiagram.environmentMonitor',
countNum: onlineDevNum,
countLabel: 'onlineDev',
countImg: require('@/assets/images/dataBoard/online.jpg'),
todayNum: offlineDevNum,
todayLabel: 'notOnlineDev',
todayImg: require('@/assets/images/dataBoard/offline.jpg')
}"
:list="environmentDevList"
></DataCard>
</div>
<!-- 设备类型切换 -->
<div class="pointTabBox">
@ -3126,18 +3077,6 @@ export default {
videoList: [],
playList: [],
svgTimer: null,
// [
// { name: "全部", id: "" },
// { name: "视频监控", id: 4 },
// { name: "塔吊监测", id: 2 },
// { name: "升降机监测", id: 3 },
// { name: "车辆监测", id: 1 },
// { name: "用电监测", id: 5 },
// { name: "环境监测", id: 6 },
// { name: "人脸闸机", id: 7 },
// { name: "龙门吊监测", id: 9 },
// { name: "应急管理", id: 99 },
// ],
devTypeList: this.$t('message.dataBoard.devTypeList'),
realTimeData: {},
devTypeIndex: 0,
@ -4283,18 +4222,6 @@ export default {
this.pointList = res.result
console.log(res.result)
// [
// { name: "全部", id: "" },
// { name: "视频监控", id: 4 },
// { name: "塔吊监测", id: 2 },
// { name: "升降机监测", id: 3 },
// { name: "车辆监测", id: 1 },
// { name: "用电监测", id: 5 },
// { name: "环境监测", id: 6 },
// { name: "人脸闸机", id: 7 },
// { name: "龙门吊监测", id: 9 },
// { name: "应急管理", id: 99 },
// ],
})
},
//获取环境设备列表--环境监测实时数据--下拉