xiaomeng/wszhyWx
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

~

Browse Source
This commit is contained in:
pangdundun 2023-11-16 18:39:14 +08:00
parent 3140c05744
commit 47e0ba9c90
2 changed files with 549 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/api/index.js
View File

@ -196,5 +196,9 @@ export default {
// 控制器状态值获取 Copy
readControl_getState(deviceId, data) {
return sendGetRequest(`/readControl/getState?deviceId=${deviceId}`, data);
},
getcontrol_rtDatastation(equipmentId,data){
return sendGetRequest(`/getcontrol/rtDatastation?equipmentId=${equipmentId}`, data)
}
};
};

577
src/views/page/largeScreen.vue
View File

@ -9,13 +9,13 @@
<div class="yuan">
<img src="../../assets/img/big.png" alt="">
</div>
<div class="calendar">
<div class="calendar" v-if="time">
<img src="../../assets/img/calendar.png" alt="">
<span>2023.11.16</span>
<span>{{ getNowTime() }}</span>
<span class="line"></span>
<span>星期四</span>
<span>{{ time.week }}</span>
<span class="line"></span>
<span>15:39</span>
<span>{{ time.time }}</span>
</div>
<div class="nav">
<div class="item">
@ -42,8 +42,12 @@
<div class="weather">
<div>
<marquee behavior="" direction="">
今日天气晴转多云，温度16~28℃，东北风三级，湿度
<marquee behavior="" direction="" scrollamount="3">
<div class="item" v-for="(item, index) in weatherDataList" :key="index">
<img :src="require(`../../assets/image/real-time-${item.formula}.png`)" alt="">
<span>{{ item.environmentDataId }} : </span>
<span>{{ item.environmentData + getTypeList(item.formula) }}</span>
</div>
</marquee>
</div>
</div>
@ -134,8 +138,8 @@
<div :class="current == index
? 'swiper-slide swiper-slide2'
: 'swiper-slide swiper-slide1'
" v-for="(item, index) in dataList" :key="index" :style="styleItem" @click="getCurrent(index)">
{{ item }}
" v-for="(item, index) in dataList" :key="index" :style="styleItem" @click="getCurrent(index,item)">
{{ item.greenhouseName + '温室' }}
</div>
</div>
</div>
@ -151,46 +155,64 @@
<div class="device_content scroll">
<div class="content_item">
<div class="i_title">
<div class="i_title" v-if="fanStatus.open != 0">
<img src="../../assets/img/i_title_img.png" alt="">
<span>风机</span>
<span class="line"></span>
<span>{{ fanStatus.open == 1 ? '自动控制' : '手动控制' }}</span>
<span>{{ fanStatus.open == 1 ? '自动控制' : '手机控制' }}</span>
<span class="line"></span>
<span>菜单</span>
</div>
<div class="i_title" v-else>
<img src="../../assets/img/i_title_img.png" alt="">
<span>风机</span>
<span class="line"></span>
<span>无效</span>
<span class="line"></span>
<span>位置50%</span>
<span>菜单</span>
</div>
<div class="i_content">
<div class="i_content_item">
<span>1#风机</span>
<span>{{ fanStatus.status[0] == 1 ? '打开' : '关闭' }}</span>
<span :style="fanStatus.status[0] == 1 ? '':'color:#86C2FF;'">{{ fanStatus.status[0] == 1 ? '打开' : '关闭' }}</span>
<span class="line"></span>
<span>2#风机</span>
<span>{{ fanStatus.status[1] == 1 ? '打开' : '关闭' }}</span>
<span :style="fanStatus.status[1] == 1 ? '':'color:#86C2FF;'">{{ fanStatus.status[1] == 1 ? '打开' : '关闭' }}</span>
</div>
<div class="line1"></div>
<div class="i_content_item">
<span>3#风机</span>
<span>{{ fanStatus.status[2] == 1 ? '打开' : '关闭' }}</span>
<span :style="fanStatus.status[2] == 1 ? '':'color:#86C2FF;'">{{ fanStatus.status[2] == 1 ? '打开' : '关闭' }}</span>
<span class="line"></span>
<span>4#风机</span>
<span>{{ fanStatus.status[3] == 1 ? '打开' : '关闭' }}</span>
<span :style="fanStatus.status[3] == 1 ? '':'color:#86C2FF;'">{{ fanStatus.status[3] == 1 ? '打开' : '关闭' }}</span>
</div>
<div class="line1"></div>
<div class="i_content_item">
<div class="i_content_item" style="width:50%">
<span>5#风机</span>
<span>{{ fanStatus.status[4] == 1 ? '打开' : '关闭' }}</span>
<span :style="fanStatus.status[4] == 1 ? '':'color:#86C2FF;'">{{ fanStatus.status[4] == 1 ? '打开' : '关闭' }}</span>
<span class="line"></span>
</div>
</div>
<div class="i_title" style="margin-top: 0.2rem;" v-for="(item, index) in statusList" :key="index">
<img src="../../assets/img/i_title_img.png" alt="">
<span>{{ item.name }}</span>
<span class="line"></span>
<span>{{ item.open == 1 ? '自动控制' : '手动控制' }}</span>
<span class="line"></span>
<span>位置{{ item.progress }}%</span>
<span>菜单</span>
<div class="i_title_" style="margin-top: 0.2rem;" v-for="(item, index) in statusList" :key="index">
<template v-if="item.open != 0">
<img src="../../assets/img/i_title_img.png" alt="">
<span>{{ item.name }}</span>
<span class="line"></span>
<span>{{ item.open == 1 ? '自动控制' : '手机控制' }}</span>
<span class="line"></span>
<span>位置{{ item.progress }}%</span>
<span>菜单</span>
</template>
<template v-else>
<img src="../../assets/img/i_title_img.png" alt="">
<span>{{ item.name }}</span>
<span class="line"></span>
<span>无效</span>
<span class="line"></span>
<span>位置{{ item.progress }}%</span>
<span>菜单</span>
</template>
</div>
</div>
</div>
@ -236,7 +258,9 @@ export default {
current: 0,
dataList: ["一号温室", "二号温室", "三号温室", "四号温室", "五号温室", "六号温室",],
dataList: [
// "一号温室", "二号温室", "三号温室", "四号温室", "五号温室", "六号温室"
],
styleContainer: {
width: "3.5rem",
height: "0.5rem",
@ -277,7 +301,364 @@ export default {
},
statusList: [],
time: null,//当前时间
time: '',//当前时间
weatherDataList: [],
typeList: [{
label: '无意义的传感器',
value: 0,
countType: 0
},
{
label: '空气温度',
value: 1,
countType: 3,
unit: '℃'
},
{
label: '空气湿度',
value: 2,
countType: 2,
unit: '%'
},
{
label: '光亮度',
value: 3,
countType: 2,
unit: 'Klux'
},
{
label: '二氧化碳',
value: 4,
countType: 0,
unit: 'ppm'
},
{
label: '土壤温度',
value: 5,
countType: 3,
unit: '℃'
},
{
label: '土壤湿度',
value: 6,
countType: 2,
unit: '%'
},
{
label: '水温',
value: 7,
countType: 3,
unit: '℃'
},
{
label: '水肥PH',
value: 8,
countType: 2,
unit: ''
},
{
label: '水肥EC',
value: 9,
countType: 2,
unit: 'mS/cm'
},
{
label: '压差',
value: 10,
countType: 0,
unit: 'Pa'
},
{
label: '风速',
value: 11,
countType: 2,
unit: 'm/s'
},
{
label: '风向',
value: 12,
countType: 0,
unit: '°'
},
{
label: '雨雪信号',
value: 13,
countType: 0,
unit: ''
},
{
label: '降雨量',
value: 14,
countType: 2,
unit: 'mm'
},
{
label: '光合有效辐射',
value: 15,
countType: 2,
unit: 'umol/m2.s'
},
{
label: '太阳总辐射',
value: 16,
countType: 0,
unit: 'W/m2'
},
{
label: '流量',
value: 17,
countType: 0,
unit: 'L/H'
},
{
label: '大气压强',
value: 18,
countType: 2,
unit: 'KPa'
},
{
label: '土壤PH',
value: 19,
countType: 2,
unit: ''
},
{
label: '土壤EC',
value: 20,
countType: 0,
unit: 'uS/cm'
},
{
label: '叶面温度',
value: 21,
countType: 3,
unit: '℃'
},
{
label: '叶面湿度',
value: 22,
countType: 2,
unit: '%'
},
{
label: '果实直径',
value: 23,
countType: 0,
unit: 'mm'
},
{
label: '茎秆直径',
value: 24,
countType: 0,
unit: 'mm'
},
{
label: '流速',
value: 25,
countType: 2,
unit: 'm/s'
},
{
label: '瞬时流量',
value: 26,
countType: 2,
unit: 'm3'
},
{
label: '当日流量',
value: 27,
countType: 2,
unit: 'T'
},
{
label: '累计流量',
value: 28,
countType: 0,
unit: 'T'
},
{
label: '无线气象站电池电压',
value: 29,
countType: 2,
unit: 'V'
},
{
label: '无线气象站无线信号强度',
value: 30,
countType: 1,
unit: 'dBm'
},
{
label: '无线气象站信噪比（SNR）',
value: 31,
countType: 1,
unit: 'dB'
},
{
label: 'PM1.0',
value: 32,
countType: 0,
unit: 'μg/m2'
},
{
label: 'PM2.5',
value: 33,
countType: 0,
unit: 'μg/m2'
},
{
label: 'PM10',
value: 34,
countType: 0,
unit: 'μg/m2'
},
{
label: '紫外辐射',
value: 35,
countType: 0,
unit: 'W/m2'
},
{
label: '蒸发量',
value: 36,
countType: 2,
unit: 'mm'
},
{
label: '负氧离子',
value: 37,
countType: 0,
unit: '个/cm3'
},
{
label: '露点温度',
value: 38,
countType: 3,
unit: '℃'
},
{
label: '设备电压',
value: 39,
countType: 2,
unit: 'V'
},
{
label: '设备电流',
value: 40,
countType: 2,
unit: 'A'
},
{
label: '土壤氮含量',
value: 41,
countType: 0,
unit: 'mg/kg'
},
{
label: '土壤磷含量',
value: 42,
countType: 0,
unit: 'mg/kg'
},
{
label: '土壤钾含量',
value: 43,
countType: 0,
unit: 'mg/kg'
},
{
label: '管道压力',
value: 44,
countType: 0,
unit: 'Kpa'
},
{
label: '一氧化碳',
value: 45,
countType: 0,
unit: 'ppm'
},
{
label: '氨气',
value: 46,
countType: 0,
unit: 'ppm'
},
{
label: '硫化氢',
value: 47,
countType: 0,
unit: 'ppm'
},
{
label: '氧气',
value: 48,
countType: 2,
unit: '%vol'
},
{
label: '甲烷',
value: 49,
countType: 2,
unit: '%vol'
},
{
label: '铜（CU）',
value: 50,
countType: 0,
unit: 'mg/kg'
},
{
label: '镉（CD）',
value: 51,
countType: 2,
unit: 'mg/kg'
},
{
label: '铅（PB）',
value: 52,
countType: 0,
unit: 'mg/kg'
},
{
label: '噪声',
value: 53,
countType: 0,
unit: 'dB'
},
{
label: '叶面面积',
value: 54,
countType: 0,
unit: 'mm'
},
{
label: '虫数量',
value: 55,
countType: 0,
unit: '个'
},
{
label: '无线传感器电池电压',
value: 56,
countType: 2,
unit: 'V'
},
{
label: '无线传感器无线信号强度',
value: 57,
countType: 1,
unit: 'dBm'
},
{
label: '无线传感器信噪比（SNR）',
value: 58,
countType: 1,
unit: 'dB'
},
],
}
},
mounted() {
@ -308,6 +689,10 @@ export default {
this.login()
this.getTime()
setInterval(() => {
this.getNowTime()
}, 1000)
},
destroyed() {
this.timer_ = null
@ -317,13 +702,17 @@ export default {
dataInit(userid) {
this.api.Bigdata_getAllControl(userid).then(res => {
console.log('根据用户id查询对应的设备大数据信息', res);
this.dataList = res.data.data
if (res.status === 200) {
res.data.data.forEach(el => {
this.get_weather_echart_data(el.deviceId)
this.get_thisWeekTemperature_echart_data(el.deviceId)
this.get_environmentData(el.deviceId)
this.get_readControl_getState(2023042214250018)
});
this.get_readControl_getState(2023042214250018)
this.getWeatherData(2023042214250027)
}
})
},
@ -443,18 +832,26 @@ export default {
getTime() {
this.time = getnowtime()
console.log(this.time);
// console.log(this.time);
const that = this
setInterval(() => {
that.time = getnowtime()
}, 1000);
},
getNowTime() {
const now = new Date();
const year = now.getFullYear();
const month = (now.getMonth() + 1).toString().padStart(2, '0');
const day = now.getDate().toString().padStart(2, '0');
const formattedDate = `${year}.${month}.${day}`;
return formattedDate
},
// 控制器状态值获取 Copy
get_readControl_getState(deviceId) {
this.api.readControl_getState(deviceId).then(res => {
console.log('控制器状态值获取 Copy', res);
// console.log('控制器状态值获取 Copy', res);
if (res.data.code == 200) {
this.fanStatus.open = res.data.data['1023']
this.fanStatus.status = []
@ -468,11 +865,30 @@ export default {
var statusData = { name: `顶卷膜${i + 1}`, open: res.data.data[(1025 + (i * 3))], progress: res.data.data[(1027 + (i * 3))], index: res.data.data[(1026 + (i * 3))] }
this.statusList.push(statusData)
}
console.log(this.statusList);
// console.log(this.statusList);
}
})
},
// 获取天气预报数据
getWeatherData(equipmentId) {
this.api.getcontrol_rtDatastation(equipmentId).then(res => {
// console.log('获取天气预报数据', res);
if (res.data.code == 200) {
this.weatherDataList = res.data.data
}
})
},
// 数据单位
getTypeList(val) {
let typeList1 = []
typeList1 = this.typeList.filter(item => {
return item.value == val
})
return typeList1[0].unit
},
// 获取本地的userid和token
login() {
// var data = {
@ -498,7 +914,7 @@ export default {
},
createVideoNew(accessToken, url, index) {
console.log(accessToken, url, index, 111);
// console.log(accessToken, url, index, 111);
// divW和divH是获取了父级宽高 使播放容器能铺满div
let divW = document.getElementById('monitor' + index).clientWidth
let divH = document.getElementById('monitor' + index).clientHeight
@ -546,8 +962,10 @@ export default {
this.$router.push({ path: '/realTime' });
},
getCurrent(index) {
getCurrent(index,item) {
this.current = index;
console.log(item,'00000000000000');
this.get_readControl_getState(item.deviceId)
},
drag_boxHandler() {
@ -837,6 +1255,34 @@ export default {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
marquee {
width: 100%;
height: 100%;
.item {
height: 100%;
margin-right: 0.1rem;
display: inline-block;
>img {
width: 0.3rem;
height: 0.3rem;
position: relative;
top: 0.01rem;
margin-right: 0.05rem;
}
>span {
font-size: 0.16rem;
font-weight: 400;
color: #fff;
font-family: Microsoft YaHei;
position: relative;
top: -0.08rem;
}
}
}
}
}
@ -1306,7 +1752,72 @@ export default {
color: #4EFFD5;
}
// >span:nth-child(6) {
// font-size: .14rem;
// font-family: MicrosoftYaHei;
// font-weight: 400;
// color: #7AE1FF;
// margin-right: 0.47rem;
// }
>span:nth-child(6) {
width: .66rem;
height: .30rem;
background: linear-gradient(-35deg, rgba(122, 225, 255, 0.49) 1%, rgba(122, 225, 255, 0.5) 100%);
border: .01rem solid rgba(122, 225, 255, 0.5);
border-radius: .15rem;
font-size: .14rem;
font-family: MicrosoftYaHei;
font-weight: 400;
color: #7AE1FF;
text-align: center;
line-height: 0.3rem;
}
}
.i_title_ {
// width: 4rem;
height: .5rem;
background: url('../../assets/img/i_title_bg.png') center no-repeat;
background-size: 100% 100%;
display: flex;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
padding: 0 0.1rem 0 0.05rem;
>img {
width: .5rem;
height: .5rem;
}
>span:nth-child(2) {
width: 18%;
font-size: .16rem;
font-family: MicrosoftYaHei-Bold;
font-weight: bold;
color: #FFFFFF;
}
.line {
width: .01rem;
height: .20rem;
background: #7ABAFF;
opacity: 0.2;
margin-right: 0.1rem;
}
>span:nth-child(4) {
width: 18%;
font-size: .14rem;
font-family: MicrosoftYaHei;
font-weight: 400;
color: #4EFFD5;
}
>span:nth-child(6) {
width: 18%;
font-size: .14rem;
font-family: MicrosoftYaHei;
font-weight: 400;