|
|
@@ -53,10 +53,10 @@
|
|
|
<!-- 设备图 -->
|
|
|
<view class="devicePhoto" v-if="current == 0">
|
|
|
<view class="titleBox">
|
|
|
- <u-alert-tips type="primary" :title-style="alertTipColor" title="点击按钮可对应控制阀门开关"
|
|
|
+ <u-alert-tips type="primary" :title-style="alertTipColor" title="点击按钮可对应控制阀门开关，开即打开，关即关闭"
|
|
|
:show-icon="true"></u-alert-tips>
|
|
|
- <view class="btn" @click="statusPanel=true">控制面板</view>
|
|
|
- <u-popup v-model="statusPanel" mode="bottom">
|
|
|
+ <!-- <view class="btn" @click="statusPanel=true">控制面板</view> -->
|
|
|
+ <!-- <u-popup v-model="statusPanel" mode="bottom">
|
|
|
<view class="consoleBox">
|
|
|
<view class="swichBox">
|
|
|
<u-row :gutter="16" justify="space-between">
|
|
|
@@ -81,37 +81,76 @@
|
|
|
</view>
|
|
|
<u-button type="success" @click="statusPanel=false">确定</u-button>
|
|
|
</view>
|
|
|
- </u-popup>
|
|
|
+ </u-popup> -->
|
|
|
</view>
|
|
|
<view class="main">
|
|
|
- <image class="mainContent" src="../../static/images/waterandfernew/main.png"></image>
|
|
|
- <view class="sourceBox">
|
|
|
+ <image class="mainContent" src="../../static/images/waterandfernew/mainNew.png"></image>
|
|
|
+ <!-- <view class="sourceBox">
|
|
|
<view class="smallBox">
|
|
|
水源
|
|
|
</view>
|
|
|
- </view>
|
|
|
+ </view> -->
|
|
|
<!-- 桶 -->
|
|
|
<view class="colList">
|
|
|
- <view class="preClo" v-for="(fei, index) in Array(feiNum / 2)" :key="`fei${index}`">
|
|
|
+ <view class="preClo" v-for="item, index in buttonList" v-if="(index + 1) % 2 == 1" :key="`fei${index}`">
|
|
|
<view>
|
|
|
- 肥料{{ index + 1 }}
|
|
|
+ 肥料{{ (index + 1) / 2 > 1 ? (index + 2) / 2 : 1 }}
|
|
|
+ </view>
|
|
|
+ <image src="../../static/images/waterandfernew/colNew.png" v-if="buttonList.length == 2"></image>
|
|
|
+ <image src="../../static/images/waterandfernew/colLeft.png" v-else-if="buttonList.length > 2 && index == 0"></image>
|
|
|
+ <image src="../../static/images/waterandfernew/colRight.png" v-else-if="buttonList.length > 2 && index == buttonList.length - 2"></image>
|
|
|
+ <image src="../../static/images/waterandfernew/colCenter.png" v-else></image>
|
|
|
+ <view class="jiaoBtn" v-if="facilityvalve.length > 0">
|
|
|
+ <u-switch v-model="facilityvalve[`${index == 0 ? 10 : index == 2 ? 9 : 8}`]['off']" active-color="#14A478" inactive-color="#AEB4C2" :loading="facilityvalve[`${index == 0 ? 10 : index == 2 ? 9 : 8}`]['disabled']"
|
|
|
+ @change="switchchange($event, facilityvalve[`${index == 0 ? 10 : index == 2 ? 9 : 8}`]['number'], facilityvalve[`${index == 0 ? 10 : index == 2 ? 9 : 8}`], index == 0 ? 10 : index == 2 ? 9 : 8)"></u-switch>
|
|
|
+ </view>
|
|
|
+ <view class="shanBox" v-if="facilityvalve.length > 0">
|
|
|
+ <image v-if="!facilityvalve[`${index == 0 ? 10 : index == 2 ? 9 : 8}`]['off']" src="../../static/images/waterandfernew/shan.png"></image>
|
|
|
+ <image v-else class="circleAnm" src="../../static/images/waterandfernew/shanannimate.png"></image>
|
|
|
+ </view>
|
|
|
+ <view class="btnBox" @click="switchchange($event, item.number, item, index, true)">
|
|
|
+ <image v-if="item.off" src="../../static/images/waterandfernew/feiopen.png"></image>
|
|
|
+ <image v-else src="../../static/images/waterandfernew/feiclose.png"></image>
|
|
|
</view>
|
|
|
- <image src="../../static/images/waterandfernew/col.png"></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
+ <!-- 废料管口 -->
|
|
|
+ <view class="exit">
|
|
|
+ <image src="../../static/images/waterandfernew/exit.png"></image>
|
|
|
+ </view>
|
|
|
+ <!-- 注肥泵 -->
|
|
|
+ <view class="feiLight" @click="switchchange(!feiBeng, facilityvalve[6].number, facilityvalve[6], 6)">
|
|
|
+ <image v-if="feiBeng" src="../../static/images/waterandfernew/feiAllopen.png"></image>
|
|
|
+ <image v-else src="../../static/images/waterandfernew/feiAllclose.png"></image>
|
|
|
+ </view>
|
|
|
+ <!-- 控制柜 -->
|
|
|
+ <view class="kongBox">
|
|
|
+ <image v-if="feiBeng" src="../../static/images/waterandfernew/kongclose.png"></image>
|
|
|
+ <image v-else src="../../static/images/waterandfernew/kongopen.png"></image>
|
|
|
+ </view>
|
|
|
+ <!-- 进水泵 -->
|
|
|
+ <view class="warterIn" @click="switchchange(!mainBeng, facilityvalve[7].number, facilityvalve[7], 7)">
|
|
|
+ <image v-if="mainBeng" src="../../static/images/waterandfernew/feiopen.png"></image>
|
|
|
+ <image v-else src="../../static/images/waterandfernew/feiclose.png"></image>
|
|
|
+ </view>
|
|
|
+ <!-- 进水指示 -->
|
|
|
+ <view class="warterLight">
|
|
|
+ <image v-if="mainBeng" src="../../static/images/waterandfernew/bengopen.png"></image>
|
|
|
+ <image v-else src="../../static/images/waterandfernew/bengclose.png"></image>
|
|
|
+ </view>
|
|
|
<!-- 电风扇 -->
|
|
|
- <view class="fengBox">
|
|
|
+ <!-- <view class="fengBox">
|
|
|
<view class="relativeBox">
|
|
|
<image src="../../static/images/waterandfernew/fengmain.png"></image>
|
|
|
<image :class="feiBeng ? 'circleAnm' : ''"
|
|
|
src="../../static/images/waterandfernew/fengleafs.png"></image>
|
|
|
</view>
|
|
|
- </view>
|
|
|
+ </view> -->
|
|
|
<!-- 水管控制阀 -->
|
|
|
<view class="benList">
|
|
|
- <view class="preBen" v-for="item, index in buttonList" v-if="(index + 1) % 2 == 1"
|
|
|
+ <!-- <view class="preBen" v-for="item, index in buttonList" v-if="(index + 1) % 2 == 1"
|
|
|
@click="switchchange(!item.off, item.number, item, index, true)">
|
|
|
- <image class="daoguan" src="../../static/images/waterandfernew/bottom.png"
|
|
|
+ <image class="daoguan" src="../../static/images/waterandfernew/bottomNew.png"
|
|
|
v-if="(index + 1) % 2 < 4"></image>
|
|
|
<view class="info">
|
|
|
肥料{{ (index + 1) / 2 > 1 ? (index + 2) / 2 : 1 }}开关
|
|
|
@@ -119,11 +158,11 @@
|
|
|
<image class="status" v-if="item.off" src="../../static/images/waterandfernew/open.png">
|
|
|
</image>
|
|
|
<image class="status" v-else src="../../static/images/waterandfernew/close.png"></image>
|
|
|
- </view>
|
|
|
- <view class="preBen" v-for="item, index in facilityvalve" v-if="index > buttonList.length - 1"
|
|
|
+ </view> -->
|
|
|
+ <view class="preBen" v-for="item, index in facilityvalve" v-if="index > 10"
|
|
|
@click="switchchange(!item.off, item.number, item, index)">
|
|
|
- <image class="daoguan" src="../../static/images/waterandfernew/bottom.png"
|
|
|
- v-if="(index-buttonList.length + buttonList.length/2) < 4"></image>
|
|
|
+ <image class="daoguan" src="../../static/images/waterandfernew/bottomNew.png"
|
|
|
+ v-if="index > 10"></image>
|
|
|
<view class="info">
|
|
|
{{item.name}}
|
|
|
</view>
|
|
|
@@ -174,7 +213,7 @@
|
|
|
return {
|
|
|
alertTipColor: {
|
|
|
color: '#1890FF',
|
|
|
- fontSize: "28rpx"
|
|
|
+ fontSize: "12px"
|
|
|
},
|
|
|
device_id: '',
|
|
|
mainBeng: false,
|
|
|
@@ -516,6 +555,7 @@
|
|
|
}
|
|
|
}
|
|
|
this.facilityvalve.forEach(item => {
|
|
|
+ item.disabled = false;
|
|
|
if (item.type == 'j9' && item.off == true) {
|
|
|
// 判断注水泵是否打开
|
|
|
this.mainBeng = true;
|
|
|
@@ -559,7 +599,7 @@
|
|
|
},
|
|
|
})
|
|
|
uni.hideLoading();
|
|
|
- if (res.controlState) {
|
|
|
+ if (res.msg_code == 200) {
|
|
|
uni.showToast({
|
|
|
title: '指令下发成功',
|
|
|
duration: 2000,
|
|
|
@@ -567,10 +607,13 @@
|
|
|
});
|
|
|
} else {
|
|
|
uni.showToast({
|
|
|
- title: res.message,
|
|
|
+ title: res.msg,
|
|
|
duration: 2000,
|
|
|
icon: 'none'
|
|
|
})
|
|
|
+ setTimeout(()=> {
|
|
|
+ this.getEquipstatus()
|
|
|
+ }, 2000)
|
|
|
}
|
|
|
},
|
|
|
// sf_control_data
|
|
|
@@ -624,9 +667,9 @@
|
|
|
},
|
|
|
switchchange(e, state, item, index, isfeiButton) {
|
|
|
// 是否是肥料开关，是的话 两个合并为一个
|
|
|
+ item.disabled = true;
|
|
|
if (isfeiButton) {
|
|
|
item.off = e;
|
|
|
- item.disabled = true;
|
|
|
this.changeTimeStatus(item, index);
|
|
|
// 当前是打开
|
|
|
if (e) {
|
|
|
@@ -696,6 +739,21 @@
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="less">
|
|
|
+
|
|
|
+ .circleAnm {
|
|
|
+ animation: ancirle 2s linear infinite;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 旋转
|
|
|
+ @keyframes ancirle {
|
|
|
+ 0% {
|
|
|
+ transform: rotate(0);
|
|
|
+ }
|
|
|
+
|
|
|
+ 100% {
|
|
|
+ transform: rotate(360deg);
|
|
|
+ }
|
|
|
+ }
|
|
|
.box {
|
|
|
position: relative;
|
|
|
width: 100%;
|
|
|
@@ -891,9 +949,9 @@
|
|
|
position: absolute;
|
|
|
left: 50%;
|
|
|
transform: translateX(-50%);
|
|
|
- width: 565rpx;
|
|
|
- top: 112rpx;
|
|
|
- height: 242rpx;
|
|
|
+ width: 678rpx;
|
|
|
+ top: 10rpx;
|
|
|
+ height: 602rpx;
|
|
|
z-index: 1;
|
|
|
}
|
|
|
|
|
|
@@ -924,15 +982,18 @@
|
|
|
.colList {
|
|
|
position: absolute;
|
|
|
z-index: 2;
|
|
|
- top: 24rpx;
|
|
|
- left: 120rpx;
|
|
|
- width: 470rpx;
|
|
|
+ top: 44rpx;
|
|
|
+ left: 160rpx;
|
|
|
+ width: 528rpx;
|
|
|
display: flex;
|
|
|
- justify-content: space-between;
|
|
|
+ justify-content: center;
|
|
|
+ overflow: hidden;
|
|
|
|
|
|
.preClo {
|
|
|
- width: 80rpx;
|
|
|
- margin-left: 40rpx;
|
|
|
+ position: relative;
|
|
|
+ float: left;
|
|
|
+ width: 88rpx;
|
|
|
+ // margin-left: 40rpx;
|
|
|
|
|
|
view {
|
|
|
text-align: center;
|
|
|
@@ -942,23 +1003,65 @@
|
|
|
}
|
|
|
|
|
|
image {
|
|
|
- width: 80rpx;
|
|
|
- height: 164rpx;
|
|
|
+ width: 88rpx;
|
|
|
+ height: 272rpx;
|
|
|
+ }
|
|
|
+ .shanBox{
|
|
|
+ position: absolute;
|
|
|
+ width: 64rpx;
|
|
|
+ height: 64rpx;
|
|
|
+ top: 116rpx;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ z-index: 2;
|
|
|
+ image {
|
|
|
+ width: 64rpx;
|
|
|
+ height: 64rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .jiaoBtn{
|
|
|
+ position: absolute;
|
|
|
+ width: 64rpx;
|
|
|
+ height: 32rpx;
|
|
|
+ top: 72rpx;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ z-index: 2;
|
|
|
+ .u-switch{
|
|
|
+ width: 64rpx;
|
|
|
+ height: 32rpx;
|
|
|
+ /deep/ .u-switch__node{
|
|
|
+ width: 28rpx !important;
|
|
|
+ height: 28rpx !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .btnBox{
|
|
|
+ position: absolute;
|
|
|
+ width: 66rpx;
|
|
|
+ height: 72rpx;
|
|
|
+ bottom: 40rpx;
|
|
|
+ left: 22rpx;
|
|
|
+ z-index: 2;
|
|
|
+ image {
|
|
|
+ width: 66rpx;
|
|
|
+ height: 72rpx;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.benList {
|
|
|
position: absolute;
|
|
|
- width: 565rpx;
|
|
|
+ width: 678rpx;
|
|
|
left: 50%;
|
|
|
transform: translateX(-50%);
|
|
|
- top: 342rpx;
|
|
|
+ top: 610rpx;
|
|
|
|
|
|
.preBen {
|
|
|
float: left;
|
|
|
text-align: center;
|
|
|
- width: 25%;
|
|
|
+ width: 20%;
|
|
|
|
|
|
.daoguan {
|
|
|
width: 20rpx;
|
|
|
@@ -978,7 +1081,69 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+ .lineExit{
|
|
|
+
|
|
|
+ }
|
|
|
+ .exit{
|
|
|
+ position: absolute;
|
|
|
+ width: 22rpx;
|
|
|
+ height: 20rpx;
|
|
|
+ top: 360rpx;
|
|
|
+ right: 252rpx;
|
|
|
+ z-index: 2;
|
|
|
+ image{
|
|
|
+ width: 22rpx;
|
|
|
+ height: 20rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .warterIn{
|
|
|
+ position: absolute;
|
|
|
+ width: 66rpx;
|
|
|
+ height: 72rpx;
|
|
|
+ top: 190rpx;
|
|
|
+ left: 54rpx;
|
|
|
+ z-index: 3;
|
|
|
+ image{
|
|
|
+ width: 66rpx;
|
|
|
+ height: 72rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .warterLight{
|
|
|
+ position: absolute;
|
|
|
+ width: 72rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ top: 506rpx;
|
|
|
+ left: 110rpx;
|
|
|
+ z-index: 3;
|
|
|
+ image{
|
|
|
+ width: 72rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .feiLight{
|
|
|
+ position: absolute;
|
|
|
+ width: 72rpx;
|
|
|
+ height: 66rpx;
|
|
|
+ top: 424rpx;
|
|
|
+ right: 140rpx;
|
|
|
+ z-index: 3;
|
|
|
+ image{
|
|
|
+ width: 72rpx;
|
|
|
+ height: 66rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .kongBox{
|
|
|
+ position: absolute;
|
|
|
+ width: 84rpx;
|
|
|
+ height: 108rpx;
|
|
|
+ top: 390rpx;
|
|
|
+ right: 228rpx;
|
|
|
+ z-index: 3;
|
|
|
+ image{
|
|
|
+ width: 84rpx;
|
|
|
+ height: 108rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
.fengBox {
|
|
|
position: absolute;
|
|
|
right: 12rpx;
|
|
|
@@ -1006,20 +1171,6 @@
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .circleAnm {
|
|
|
- animation: ancirle 2s linear infinite;
|
|
|
- }
|
|
|
-
|
|
|
- // 旋转
|
|
|
- @keyframes ancirle {
|
|
|
- 0% {
|
|
|
- transform: rotate(0);
|
|
|
- }
|
|
|
-
|
|
|
- 100% {
|
|
|
- transform: rotate(360deg);
|
|
|
- }
|
|
|
- }
|
|
|
}
|
|
|
}
|
|
|
}
|
