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

智能施肥机添加 #260

Merged
xiaomeng merged 1 commits from pc-master into portal 2025-07-04 00:18:52 +00:00
Conversation 0 Commits 1 Files Changed 6 +418 -488
6 changed files with 418 additions and 488 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/api/index.js
View File

@ -252,6 +252,16 @@ export default {
getSeldevicebyid(data) { getSeldevicebyid(data) {
return sendGetRequest(`/admin/seldevicebyid`, data); return sendGetRequest(`/admin/seldevicebyid`, data);
}, },
// ID13的大数据里智能施肥机页面接口
pinfengGetstate(data) {
return sendPostRequest(`/pinfeng/getstate`, data);
},
pinfengGetrtdata(data) {
return sendPostRequest(`/pinfeng/getrtdata`, data);
},
pinfengSetdevice(data) {
return sendPostRequest(`/pinfeng/setdevice`, data);
},
//根据用户id查询对应的设备数据 //根据用户id查询对应的设备数据
getEqbyid(data) { getEqbyid(data) {
return sendGetRequest(`/sel/eqbyid/` + data, ``); return sendGetRequest(`/sel/eqbyid/` + data, ``);

46
src/assets/css/main.css
View File

@ -2259,6 +2259,22 @@ textarea {
width: 100%; width: 100%;
} }
.realTime .page-content .realTime-bottom.videoMonitoring-monitor.center {
justify-content: center;
}
.realTime .page-content .realTime-bottom.videoMonitoring-monitor.center .left-view {
width: calc(100% - 400px);
}
.realTime .page-content .realTime-bottom.videoMonitoring-monitor.center .monitor {
width: 100%;
}
.realTime .page-content .realTime-bottom.videoMonitoring-monitor.center .monitor .video-js {
width: 100%;
}
.realTime .page-content .realTime-bottom > div { .realTime .page-content .realTime-bottom > div {
flex-shrink: 0; flex-shrink: 0;
} }
@ -2336,10 +2352,6 @@ textarea {
position: relative; position: relative;
} }
.realTime .page-content .realTime-bottom .left-view > div.center {
justify-content: center;
}
.realTime .page-content .realTime-bottom .left-view > div .video-js { .realTime .page-content .realTime-bottom .left-view > div .video-js {
width: calc(100% - 400px); width: calc(100% - 400px);
height: 100%; height: 100%;
@ -4070,15 +4082,35 @@ textarea {
color: #fff; color: #fff;
} }
.model-sel .w-100 {
width: 100%;
}
.model-sel .el-switch__label {
color: #fff;
}
.model-sel .el-switch__label.is-active {
color: #409EFF;
}
.model-sel.largeScreen4 {
max-height: 500px;
}
.model-sel > div { .model-sel > div {
width: 33%; width: 25%;
margin-bottom: 20px;
white-space: nowrap; white-space: nowrap;
flex-shrink: 0; flex-shrink: 0;
margin-bottom: 10px; display: block;
display: flex;
align-items: center; align-items: center;
} }
.model-sel > div .label {
margin-bottom: 5px;
}
.setsuyuan { .setsuyuan {
width: 100%; width: 100%;
height: 100%; height: 100%;

39
src/assets/css/main.scss
View File

@ -2394,6 +2394,19 @@ textarea {
.left-view { .left-view {
width: 100%; width: 100%;
} }
&.center{
justify-content: center;
.left-view {
width: calc(100% - 400px);
}
.monitor{
width: 100%;
.video-js{
width: 100%;
}
}
}
} }
>div { >div {
@ -2472,9 +2485,7 @@ textarea {
display: flex; display: flex;
align-items: center; align-items: center;
position: relative; position: relative;
&.center{
justify-content: center;
}
.video-js { .video-js {
width: calc(100% - 400px); width: calc(100% - 400px);
height: 100%; height: 100%;
@ -4326,14 +4337,28 @@ textarea {
overflow: auto; overflow: auto;
padding: 0 30px; padding: 0 30px;
color: #fff; color: #fff;
.w-100{
width: 100%;
}
.el-switch__label{
color: #fff;
&.is-active{
color: #409EFF;
}
}
&.largeScreen4{
max-height: 500px;
}
>div { >div {
width: 33%; width: 25%;
margin-bottom: 20px;
white-space: nowrap; white-space: nowrap;
flex-shrink: 0; flex-shrink: 0;
margin-bottom: 10px; display: block;
display: flex;
align-items: center; align-items: center;
.label{
margin-bottom: 5px;
}
} }

791
src/views/page/largeScreen4.vue
View File

@ -4,83 +4,83 @@
<largeNav :active="3"></largeNav> <largeNav :active="3"></largeNav>
<div class="content-left"> <div class="content-left">
<div class="left-view1"> <div class="left-view1">
<div class="main-title"><span>{{$t('status.irrigationStatus')}} </span></div>
<div class="view-content"> <div class="view-content">
<div> <div>
<div class="input-50"> <div class="input-50">
<div class="input-title">{{$t('status.remainingTime')}}</div> <div class="input-title">工作状态</div>
<div class="input">{{ countData(inputData['36']) }}</div> <div class="input">{{ newData.Data_3=='0'?'待机':'自动运行' }}</div>
</div> </div>
<div class="input-50"> <div class="input-50">
<div class="input-title">{{$t('status.instantFlow')}}</div> <div class="input-title">控制方式</div>
<div class="input">{{ countData(inputData['28']) }}</div> <div class="input">{{ newData.Data_2=='0'?'手动':'自动' }}</div>
</div> </div>
</div> </div>
<div> <div>
<div class="input-50"> <div class="input-50">
<div class="input-title">{{$t('status.currentVolume')}}</div> <div class="input-title">自动工作方式</div>
<div class="input">{{ countData(inputData['37']) }}</div> <div class="input">{{ getType3(newData.Data_3) }}</div>
</div> </div>
<div class="input-50"> <div class="input-50 w-100">
<div class="input-title">{{$t('status.startupMethod')}}</div> <div class="input-title">吸肥泵压力 MP</div>
<div class="input green">{{ openType }}</div> <div class="input green">{{ newData1.Data_35 }}</div>
</div> </div>
</div> </div>
<div> <div>
<div class="input-50"> <div class="input-50 w-100">
<div class="input-title">{{$t('status.formulaNumber')}}</div> <div class="input-title">主管道累计流量 m³</div>
<div class="input">{{ countData(inputData['31']) }}</div> <div class="input green">{{ newData1.Data_33 }}</div>
</div> </div>
<div class="input-50"> <div class="input-50 w-100">
<div class="input-title">{{$t('status.executingGroup')}}</div> <div class="input-title">主管道瞬时流量 m³/H</div>
<div class="input">{{ countData(inputData['38']) }}</div> <div class="input green">{{ newData1.Data_34?Number(newData1.Data_34).toFixed(2):'0' }}</div>
</div> </div>
</div> </div>
<div class="left-btn">
<div :class="left1Act[1]==1 ? 'active' : ''">{{$t('status.inletPump')}}</div> <!-- <div class="left-btn">
<div :class="left1Act[0]==1 ? 'active' : ''">{{$t('status.fertilizerPump')}}</div> <div :class="newData.Data_4==1 ? 'active' : ''">水泵</div>
</div> <div :class="newData.Data_5==1 ? 'active' : ''">吸肥泵</div>
</div> -->
</div> </div>
</div> </div>
<div class="left-view2"> <div class="left-view2">
<div class="main-title"><span>{{$t('status.fertilizerIntensity')}} </span></div> <div class="main-title"><span>输出脉宽</span></div>
<div class="view-content"> <div class="view-content">
<div v-for="item, index in left2List" :key="index"> <div v-for="item, index in left2List" :key="index">
<div class="left" :style="item.img ? `background: url(${item.img}) no-repeat center;` : ''"><span>{{ <div class="left" :style="item.img ? `background: url(${item.img}) no-repeat center;` : ''"><span>{{
item.title }}</span></div> item.title }}</span></div>
<div class="name">{{ item.name }}</div> <!-- <div class="name">{{ item.name }}</div> -->
<div class="number">{{ item.number }}</div> <div class="number">{{ item.number }}</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="content-center"> <div class="content-center">
<div class="center-title"><span v-if="deviceDetail">{{ deviceDetail.stationName }}</span></div> <div class="center-title"><span>智能施肥机</span></div>
<div> <div>
<div class="center-center"> <div class="center-center">
<div class="view view-1"> <div class="view view-1">
<div class="name">{{$t('status.targetPH')}}</div> <div class="name">PH实际值</div>
<div class="number">{{ countData100(inputData['6']) }}</div> <div class="number">{{ countType5(newData1.Data_2) }}</div>
</div> </div>
<div class="view view-2"> <!-- <div class="view view-2">
<div class="name">{{$t('status.measuredPH')}}</div> <div class="name">2#PH</div>
<div class="number">{{ countData100(inputData['8']) }}</div> <div class="number">{{ newData.Data_10 }}</div>
</div> </div>
<div class="view view-3"> <div class="view view-3">
<div class="name">{{$t('status.measuredEC')}}</div> <div class="name">1#EC</div>
<div class="number">{{ countData100(inputData['9']) }}</div> <div class="number">{{ newData.Data_11 }}</div>
</div> </div> -->
<div class="view view-4"> <div class="view view-4">
<div class="name">{{$t('status.targetEC')}}</div> <div class="name">EC实际值</div>
<div class="number">{{ countData100(inputData['7']) }}</div> <div class="number">{{ countType5(newData1.Data_1) }}</div>
</div> </div>
</div> </div>
<div class="center-bottom"> <div class="center-bottom">
<div class="center-bottom-title"><span>{{$t('status.solenoidValveStatus')}}</span></div> <div class="center-bottom-title"><span>田间阀状态</span></div>
<div class="center-bottom-flex"> <div class="center-bottom-flex">
<template v-for="item, index in 64"> <template v-for="item, index in 40">
<div v-if="centerBottom.indexOf(index) != -1"> <div v-if="newData['Data_'+(index+1+20)] == '1'">
<span> {{ index + 1 }}#</span> <span> {{ index + 1 }}#</span>
<img src="../../assets/image/center-flex-active.png" alt=""> <img src="../../assets/image/center-flex-active.png" alt="">
</div> </div>
@ -92,40 +92,15 @@
</div> </div>
<div class="content-right"> <div class="content-right">
<div class="right-view1"> <div class="right-view1">
<div class="main-table-title"> <div class="main-title"><span>设备状态 </span></div>
<div>{{$t('status.sensorData')}}</div>
<div>{{$t('status.value')}}</div>
<div>{{$t('status.adValue')}}</div>
</div>
<div class="table-content">
<div class="seamless-warp" v-if="!loading">
<div class="tr" v-for="item, index in tableList1" :key="index" :class="'tr-' + (index + 1)">
<div class="td name">
<div>
{{ item.name }}
</div>
</div>
<div class="td number">{{ item.data }}</div>
<div class="td ADnumber">{{ item.ADdata }}</div>
</div>
</div>
<!-- <vue-seamless class="seamless-warp" :data="tableList1" :class-option="defaultOption">
</vue-seamless> -->
</div>
</div> </div>
<div class="right-view2"> <div class="right-view2">
<div> <div v-for="item, index in rightList2"
<div v-for="item, index in rightList2.slice(0, 4)" :class="newData[item.value] == 1 ? 'active' : ''">{{ item.label }}</div>
:class="right2Index.indexOf(index) != -1 ? 'active' : ''">{{ item }}</div>
</div>
<div>
<div v-for="item, index in rightList2.slice(4, 8)"
:class="right2Index.indexOf(index + 4) != -1 ? 'active' : ''">{{ item }}</div>
</div>
</div> </div>
<div class="right-view3"> <div class="right-view3">
<div class="main-title"><span>{{$t('status.fertilizationSpeed')}} (L/h) </span></div> <div class="main-title"><span>吸肥阀运行状态 </span></div>
<div class="view-content"> <div class="view-content">
<div v-for="item, index in rightList3" :key="index"> <div v-for="item, index in rightList3" :key="index">
<div class="name">{{ item.name }}</div> <div class="name">{{ item.name }}</div>
@ -133,12 +108,49 @@
</div> </div>
</div> </div>
</div> </div>
<div class="right-view4">
<el-button type="primary" @click="openModel">修改设定值</el-button>
</div>
</div> </div>
<el-dialog title="修改设定值" :append-to-body="true" :visible.sync="statusShow" width="70%">
<div class="model-title">修改设定值</div>
<div class="model-sel largeScreen4 scroll">
<div v-for="item, index in statusList" :key="index">
<div class="w-100 label">
{{ item.label }}
</div>
<div>
<span>当前状态：</span>
<el-switch
v-if="index==0"
v-model="item.value"
active-value="1"
inactive-value="0"
active-text="手动"
@change='setData($event,item)'
inactive-text="自动">
</el-switch>
<el-switch
v-if="index!=0"
v-model="item.value"
@change='setData($event,item)'
active-value="1"
inactive-value="0">
</el-switch>
</div>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="statusShow = false">确认</el-button>
</span>
</el-dialog>
</div> </div>
</template> </template>
<script> <script>
import largeNav from '@/components/large-nav.vue' import largeNav from '@/components/large-nav.vue'
import vueSeamless from 'vue-seamless-scroll' import vueSeamless from 'vue-seamless-scroll'
import { log } from 'video.js'
export default { export default {
data() { data() {
return { return {
@ -153,6 +165,111 @@ export default {
numberList: [273, 278, 283, 288, 293, 298], numberList: [273, 278, 283, 288, 293, 298],
inputData1: [], inputData1: [],
loading: true, loading: true,
newData:{},//pinfengGetstate接口
newData1:{},//pinfengGetrtdata接口
rightList2:[
{label:'水泵',value:'Data_4'},
{label:'吸肥泵',value:'Data_5'},
{label:'1#搅拌',value:'Data_16'},
{label:'2#搅拌',value:'Data_17'},
{label:'3#搅拌',value:'Data_18'},
{label:'4#搅拌',value:'Data_19'},
{label:'5#搅拌',value:'Data_20'},
],
rightList3:[{
name: '1#',
number: '0',
}, {
name: '2#',
number: '0',
}, {
name: '3#',
number: '0',
}, {
name: '4#',
number: '0',
}, {
name: '5#',
number: '0',
},],
left2List:[
{
title: '1#',
name:'',
number: '0%',
img: ''
}, {
title: '2#',
name:'',
number: '0%',
img: ''
}, {
title: '3#',
name:'',
number: '0%',
img: ''
}, {
title: '4#',
name:'',
number: '0%',
img: ''
}, {
title: '5#',
name:'',
number: '0%',
img: ''
},
],
statusShow:false,
statusList:[
{label:'控制方式',value:0,name:'Data_2',changeName:'Data_1'},
{label:'1#搅拌',value:0,name:'Data_16',changeName:'Data_4'},
{label:'2#搅拌',value:0,name:'Data_17',changeName:'Data_5'},
{label:'3#搅拌',value:0,name:'Data_18',changeName:'Data_6'},
{label:'4#搅拌',value:0,name:'Data_19',changeName:'Data_7'},
{label:'酸搅拌',value:0,name:'Data_20',changeName:'Data_8'},
{label:'水泵',value:0,name:'Data_4',changeName:'Data_2'},
{label:'肥泵',value:0,name:'Data_5',changeName:'Data_3'},
{label:'1#阀',value:0,name:'Data_21',changeName:'Data_19'},
{label:'2#阀',value:0,name:'Data_22',changeName:'Data_20'},
{label:'3#阀',value:0,name:'Data_23',changeName:'Data_21'},
{label:'4#阀',value:0,name:'Data_24',changeName:'Data_22'},
{label:'5#阀',value:0,name:'Data_25',changeName:'Data_23'},
{label:'6#阀',value:0,name:'Data_26',changeName:'Data_24'},
{label:'7#阀',value:0,name:'Data_27',changeName:'Data_25'},
{label:'8#阀',value:0,name:'Data_28',changeName:'Data_26'},
{label:'9#阀',value:0,name:'Data_29',changeName:'Data_27'},
{label:'10#阀',value:0,name:'Data_30',changeName:'Data_28'},
{label:'11#阀',value:0,name:'Data_31',changeName:'Data_29'},
{label:'12#阀',value:0,name:'Data_32',changeName:'Data_30'},
{label:'13#阀',value:0,name:'Data_33',changeName:'Data_31'},
{label:'14#阀',value:0,name:'Data_34',changeName:'Data_32'},
{label:'15#阀',value:0,name:'Data_35',changeName:'Data_33'},
{label:'16#阀',value:0,name:'Data_36',changeName:'Data_34'},
{label:'17#阀',value:0,name:'Data_37',changeName:'Data_35'},
{label:'18#阀',value:0,name:'Data_38',changeName:'Data_36'},
{label:'19#阀',value:0,name:'Data_39',changeName:'Data_37'},
{label:'20#阀',value:0,name:'Data_40',changeName:'Data_38'},
{label:'21#阀',value:0,name:'Data_41',changeName:'Data_39'},
{label:'22#阀',value:0,name:'Data_42',changeName:'Data_40'},
{label:'23#阀',value:0,name:'Data_43',changeName:'Data_41'},
{label:'24#阀',value:0,name:'Data_44',changeName:'Data_42'},
{label:'25#阀',value:0,name:'Data_45',changeName:'Data_43'},
{label:'26#阀',value:0,name:'Data_46',changeName:'Data_44'},
{label:'27#阀',value:0,name:'Data_47',changeName:'Data_45'},
{label:'28#阀',value:0,name:'Data_48',changeName:'Data_46'},
{label:'29#阀',value:0,name:'Data_49',changeName:'Data_47'},
{label:'30#阀',value:0,name:'Data_50',changeName:'Data_48'},
{label:'31#阀',value:0,name:'Data_51',changeName:'Data_49'},
{label:'32#阀',value:0,name:'Data_52',changeName:'Data_50'},
{label:'33#阀',value:0,name:'Data_53',changeName:'Data_51'},
{label:'34#阀',value:0,name:'Data_54',changeName:'Data_52'},
{label:'35#阀',value:0,name:'Data_55',changeName:'Data_53'},
{label:'36#阀',value:0,name:'Data_56',changeName:'Data_54'},
{label:'37#阀',value:0,name:'Data_57',changeName:'Data_55'},
{label:'38#阀',value:0,name:'Data_58',changeName:'Data_56'},
{label:'39#阀',value:0,name:'Data_59',changeName:'Data_57'},
{label:'40#阀',value:0,name:'Data_60',changeName:'Data_58'}]
} }
}, },
components: { vueSeamless,largeNav }, components: { vueSeamless,largeNav },
@ -169,130 +286,8 @@ export default {
waitTime: 1000 // 单步运动停止的时间(默认值1000ms) waitTime: 1000 // 单步运动停止的时间(默认值1000ms)
} }
}, },
left2List(){
var data=[
{
title: 'A',
name: this.$t('status.fertilizerTypes.a'),
number: '26%',
img: ''
}, {
title: 'B',
name: this.$t('status.fertilizerTypes.b'),
number: '26%',
img: ''
}, {
title: 'C',
name: this.$t('status.fertilizerTypes.c'),
number: '26%',
img: ''
}, {
title: 'D',
name: this.$t('status.fertilizerTypes.d'),
number: '26%',
img: ''
}, {
title: 'E',
name: this.$t('status.fertilizerTypes.e'),
number: '26%',
img: ''
}, {
title: 'F',
name: this.$t('status.fertilizerTypes.f'),
number: '26%',
img: ''
}, {
title: 'G',
name: this.$t('status.fertilizerTypes.g'),
number: '26%',
img: ''
}, {
title: '',
name: this.$t('status.fertilizerTypes.acid'),
number: '26%',
img: require('../../assets/image/left2-icon1.png')
},
]
return data
},
rightList3(){
var data=[
{
name: this.$t('status.fertilizerTypes.a'),
number: '0',
}, {
name: this.$t('status.fertilizerTypes.b'),
number: '0',
}, {
name: this.$t('status.fertilizerTypes.c'),
number: '0',
}, {
name: this.$t('status.fertilizerTypes.d'),
number: '0',
}, {
name: this.$t('status.fertilizerTypes.e'),
number: '0',
}, {
name: this.$t('status.fertilizerTypes.f'),
number: '0',
}, {
name: this.$t('status.fertilizerTypes.g'),
number: '0',
}, {
name: this.$t('status.fertilizerTypes.acidFertilizer'),
number: '0',
},
]
return data
},
tableList1(){
var data=[{
name: this.$t('status.sensorTypes.ph'),
data: '1#PH 0',
ADdata: '2#PH 0',
}, {
name: this.$t('status.sensorTypes.ec'),
data: '1#EC 0',
ADdata: '2#EC 0',
}, {
name: this.$t('status.sensorTypes.generic',{index:1}),
data: 0,
ADdata: 0,
}, {
name: this.$t('status.sensorTypes.generic',{index:2}),
data: 0,
ADdata: 0,
}, {
name: this.$t('status.sensorTypes.generic',{index:3}),
data: 0,
ADdata: 0,
}, {
name: this.$t('status.sensorTypes.generic',{index:4}),
data: 0,
ADdata: 0,
}, {
name: this.$t('status.sensorTypes.generic',{index:5}),
data: 0,
ADdata: 0,
}, {
name: this.$t('status.sensorTypes.generic',{index:6}),
data: 0,
ADdata: 0,
},]
return data
},
rightList2(){
var data= [this.$t('status.externalControlSignal1',{index:1}),
this.$t('status.externalControlSignal1',{index:2}),
this.$t('status.externalControlSignal1',{index:3}),
this.$t('status.externalControlSignal1',{index:4}),
this.$t('status.controlSignals.highLevel'),
this.$t('status.controlSignals.mediumLevel'),
this.$t('status.controlSignals.lowLevel'),
this.$t('status.controlSignals.motor')
]
return data
},
}, },
//清除监听 //清除监听
beforeDestroy() { beforeDestroy() {
@ -303,21 +298,19 @@ export default {
mounted() { mounted() {
const that = this; const that = this;
if (localStorage.getItem('token')) { if (localStorage.getItem('token')) {
that.getEqbyid(); this.dataInit()
that.getReg()
setTimeout(() => { setTimeout(() => {
that.pageTimer && clearInterval(that.pageTimer) that.pageTimer && clearInterval(that.pageTimer)
that.pageTimer = setInterval(() => { that.pageTimer = setInterval(() => {
that.getEqbyid(); that.dataInit()
}, 10000);
}, 5000);
}, 0); }, 0);
} else { } else {
// this.$router.push({ name: 'login' }) // this.$router.push({ name: 'login' })
} }
this.$bus.$on('refreshData', (res) => { // this.$bus.$on('refreshData', (res) => {
that.getEqbyid(); // that.getEqbyid();
}) // })
}, },
methods: { methods: {
//countType计算类型 //countType计算类型
@ -343,107 +336,16 @@ export default {
var num = (data - 1000) / 10 var num = (data - 1000) / 10
return num.toFixed(2) return num.toFixed(2)
}, },
getTypeData(dataCode, typeCode) { countType5(data) {
var typeList = this.$store.state.typeList if(data){
var num = data / 100
var countType = 0 return num.toFixed(2)
typeList.forEach((el, index) => { }else{
return 0
if (el.value == this.inputData1[typeCode]) { }
countType = el.countType
}
})
if (countType == 0) {
return this.inputData[dataCode]
} else if (countType == 1) {
return this.countType1(this.inputData[dataCode])
} else if (countType == 2) {
return this.countType2(this.inputData[dataCode])
} else if (countType == 3) {
return this.countType3(this.inputData[dataCode])
}
},
getTabelList() {
var inputData = this.inputData
this.tableList1[0] = {
name: this.$t('status.sensorTypes.ph'),
data: '1#PH ' + this.countData100(inputData['51']),
ADdata: '2#PH ' + this.countData100(inputData['53']),
}
this.tableList1[1] = {
name: this.$t('status.sensorTypes.ec'),
data: '1#EC ' + this.countData100(inputData['52']),
ADdata: '2#EC ' + this.countData100(inputData['54']),
}
this.tableList1[2] = {
name: this.$t('status.sensorTypes.generic',{index:1}),
data: this.getTypeData('40', '273'),
ADdata: inputData['39'],
}
this.tableList1[3] = {
name: this.$t('status.sensorTypes.generic',{index:2}),
data: this.getTypeData('42', '278'),
ADdata: inputData['41'],
}
this.tableList1[4] = {
name: this.$t('status.sensorTypes.generic',{index:3}),
data: this.getTypeData('44', '283'),
ADdata: inputData['43'],
}
this.tableList1[5] = {
name: this.$t('status.sensorTypes.generic',{index:4}),
data: this.getTypeData('46', '288'),
ADdata: inputData['45'],
}
this.tableList1[6] = {
name: this.$t('status.sensorTypes.generic',{index:5}),
data: this.getTypeData('48', '293'),
ADdata: inputData['47'],
}
this.tableList1[7] = {
name: this.$t('status.sensorTypes.generic',{index:6}),
data: this.getTypeData('50', '298'),
ADdata: inputData['49'],
}
this.loading = false
},
getEqbyid() {
var store = this.$store.state
var list=[]
this.$store.state.equipmentList.forEach((el, index) => {
//链接中的deviceId
if (this.deviceId && this.deviceId == el.deviceId) {
this.$store.state.equipmentIndex = index + 1
}
if (el.deviceName == 1) {
list.push(el)
}
})
list.sort(this.compare('equipmentStatu'))
console.log( list,111);
this.deviceDetail = list.length?list[0]:{
"deviceId": 2023042214250005,
"deviceName": "10",
"deviceState": "1",
"deviceTypeName": "施肥机",
"stationName": "施肥机",
"equipmentStatu": 1,
},
this.dataInit()
}, },
compare(property) { compare(property) {
return function (a, b) { return function (a, b) {
let value1 = a[property]; let value1 = a[property];
@ -451,47 +353,8 @@ export default {
return value1 - value2; return value1 - value2;
}; };
}, },
getcenterBottom() {
this.centerBottom = []
var inputData = this.inputData
var list1 = this.padString(inputData['32'].toString(2), 16)
var list2 = this.padString(inputData['33'].toString(2), 16)
var list3 = this.padString(inputData['34'].toString(2), 16)
var list4 = this.padString(inputData['35'].toString(2), 16)
var number = 16
for (var i = 0; i < number; i++) {
if (Number(list1[list1.length - 1 - i])) {
this.centerBottom.push(i)
}
}
for (var j = 0; j < number; j++) {
if (Number(list2[list2.length - 1 - j])) {
this.centerBottom.push(j + 16)
}
}
for (var k = 0; k < number; k++) {
if (Number(list3[list3.length - 1 - k])) {
this.centerBottom.push(k + 32)
}
}
for (var l = 0; l < number; l++) {
if (Number(list4[list4.length - 1 - l])) {
this.centerBottom.push(l + 48)
}
}
},
getrightList3() {
var list = [19, 20, 21, 22, 23, 24, 25, 27]
list.forEach((el, index) => {
this.rightList3[index].number = this.inputData[el]
})
},
getleft2List() {
var list = [10, 11, 12, 13, 14, 15, 16, 18]
list.forEach((el, index) => {
this.left2List[index].number = this.inputData[el] + '%'
})
},
countData(data) { countData(data) {
if (data) { if (data) {
return data return data
@ -509,98 +372,110 @@ export default {
return 0 return 0
} }
}, },
getType29(index) { getType3(index) {
if (index == 0) { if (index == 0) {
return this.$t('status.startupMethods.manual') return '灌溉模式'
} else if (index == 1) { } else if (index == 1) {
return this.$t('status.startupMethods.externalControl') return 'EC施肥'
} else if (index == 2) { } else if (index == 2) {
return this.$t('status.startupMethods.lightAccumulation') return '定量施肥'
} else if (index == 3) { } else if (index == 3) {
return this.$t('status.startupMethods.soilMoistureControl') return '定时施肥'
} else if (index == 4) {
return this.$t('status.startupMethods.interval')
} else if (index == 5) {
return this.$t('status.startupMethods.timed')
} else {
return this.$t('status.startupMethods.none')
} }
}, },
//什么方式启动的灌溉
getData29() {
var number = this.padString(this.inputData['29'].toString(2), 14)
var index = 6
var typeNumber = -1
for (var i = 0; i < index; i++) {
if (Number(number[i])) {
typeNumber = i
}
}
this.openType = this.getType29(typeNumber)
var statusIndex = 8
var list=[]
for (var j = 0; j < statusIndex; j++) {
if (Number(number[number.length - 1 - j])) {
if (j == 0) {
list.push('1')
} else if (j == 1) {
list.push('0')
} else {
list.push(j)
}
}
}
this.right2Index=list
},
//进水泵和出水泵状态 //进水泵和出水泵状态
getData30() { getData30() {
var number = this.padString(this.inputData['30'].toString(2), 2) var number = this.padString(this.inputData['30'].toString(2), 2)
this.left1Act=number this.left1Act=number
}, },
dataInit() { dataInit() {
const that = this this.api.pinfengGetstate().then(res=>{
var deviceDetail = this.deviceDetail if(res.data.code==200){
var data = { this.newData=res.data.data.result.data
"equipmentId": deviceDetail.deviceId, this.rightList3=[
"pattern": 0,//需要根据文档填写 //6目标ph-数值 {
"regNum": 72 name: '1#',
} number:`${this.newData.Data_6=='1'?'开启':'关闭'}`,
var week = [ }, {
"星期日", name: '2#',
"星期一", number:`${this.newData.Data_8=='1'?'开启':'关闭'}`,
"星期二", }, {
"星期三", name: '3#',
"星期四", number:`${this.newData.Data_10=='1'?'开启':'关闭'}`,
"星期五", }, {
"星期六", name: '4#',
number:`${this.newData.Data_12=='1'?'开启':'关闭'}`,
}, {
name: '5#',
number:`${this.newData.Data_14=='1'?'开启':'关闭'}`,
},
] ]
this.api.postState(data).then(res => { this.left2List=[
if (res.data.code == 200) { {
this.inputData = res.data.data; title: '1#',
this.getData30() //数据30/进水出水泵 name:'',
this.getData29()//数据29 启动方式/信号 number: this.newData.Data_7+'%',
img: ''
}, {
this.getleft2List()//获取左下角数据 title: '2#',
this.getrightList3()//获取又下角数据 name:'',
this.getcenterBottom()//获取电磁阀 number: this.newData.Data_9+'%',
var h = this.checkTime(this.inputData[3]) img: ''
var m = this.checkTime(this.inputData[4]) }, {
var month_ = this.checkTime(this.inputData[1]) title: '3#',
var date_ = this.checkTime(this.inputData[2]) name:'',
var time = { number: this.newData.Data_11+'%',
year: { year: this.inputData[0], month: month_, date: date_ }, img: ''
week: week[this.inputData[5]], }, {
time: h + ":" + m, title: '4#',
} name:'',
this.$bus.$emit('refreshTime', time) number: this.newData.Data_13+'%',
} else { img: ''
this.$message.error(res.data.msg); }, {
title: '5#',
name:'',
number: this.newData.Data_15+'%',
img: ''
},
]
}else{
this.newData={}
} }
}) })
this.api.pinfengGetrtdata().then(res=>{
if(res.data.code==200){
this.newData1=res.data.data.result.data
}else{
this.newData1={}
}
})
},
setData(e,item){
var data={name:item.changeName,value:e}
this.api.pinfengSetdevice(data).then(res=>{
if(res.data.code==200){
this.$message.success('修改成功')
this.newData[item.name]=e
}else{
this.$message.warning('修改失败')
}
})
},
openModel(){
this.statusList= this.statusList.map(item=>{
var data={
...item,
value:this.newData[item.name]
}
return data
})
setTimeout(() => {
this.statusShow=true
}, 0);
}, },
checkTime(i) { checkTime(i) {
@ -610,24 +485,7 @@ export default {
return i; return i;
}, },
getReg() {
var store = this.$store.state
var deviceDetail = this.deviceDetail
//获取传感器种类
var data1 = {
equipmentId: deviceDetail.deviceId,
pattern: 272, //需要根据文档填写 //6目标ph-数值
regNum: 31,//从pattern取多少个数据
};
this.api.postReg(data1).then((res) => {
if (res.data.code == 200) {
this.inputData1 = res.data.data;
this.getTabelList()//右上角标题
} else {
this.$message.error(res.data.msg);
}
});
},
}, },
} }
@ -656,12 +514,12 @@ export default {
width: 100%; width: 100%;
.view-content { .view-content {
height: 400px; height:400px;
padding: 20px 16px 37px; padding: 20px 16px 37px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-around;
>div { >div {
display: flex; display: flex;
@ -672,6 +530,8 @@ export default {
.input-50 { .input-50 {
width: calc((100% - 14px) / 2); width: calc((100% - 14px) / 2);
} }
.left-btn { .left-btn {
@ -707,7 +567,7 @@ export default {
width: 100%; width: 100%;
.view-content { .view-content {
height: 321px; height: 350px;
display: grid; display: grid;
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(2, 1fr);
grid-row-gap: 10px; //纵向间隔 grid-row-gap: 10px; //纵向间隔
@ -754,7 +614,7 @@ export default {
font-family: Oswald; font-family: Oswald;
font-weight: 500; font-weight: 500;
color: #FFFFFF; color: #FFFFFF;
margin-left: 10px;
background: linear-gradient(180deg, #34AFF6 0%, #EDFDFF 100%); background: linear-gradient(180deg, #34AFF6 0%, #EDFDFF 100%);
-webkit-background-clip: text; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
@ -780,17 +640,23 @@ export default {
.view-content { .view-content {
padding: 20px 20px 0; padding: 20px 20px 0;
display: grid; // display: grid;
grid-template-columns: repeat(4, 1fr); // grid-template-columns: repeat(3, 1fr);
grid-row-gap: 30px; //纵向间隔 // grid-row-gap: 30px; //纵向间隔
grid-column-gap: auto; //横向间隔 // grid-column-gap: auto; //横向间隔
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
height: 350px;
>div { >div {
width: 86px;
flex-shrink: 0;
width:130px;
height: 117px; height: 117px;
background: url(../../assets/image/right-view3.png) no-repeat center; background: url(../../assets/image/right-view3.png) no-repeat center;
background-size: 100% 100%; background-size:86px 100%;
padding-top: 20px; padding: 20px 15px 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
@ -813,7 +679,7 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 24px; font-size: 18px;
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
font-weight: 500; font-weight: 500;
color: #FFFFFF; color: #FFFFFF;
@ -824,26 +690,19 @@ export default {
.right-view2 { .right-view2 {
width: 100%; width: 100%;
height: 136px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-around;
white-space: nowrap; white-space: nowrap;
display: grid;
>div { grid-template-columns: repeat(2,1fr);
width: 100%; grid-row-gap:30px;//纵向间隔
display: flex; grid-column-gap:20px;//横向间隔
align-items: center; padding: 20px 0;
justify-content: space-between;
>div { >div {
width: 90px; height: 50px;
height: 34px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 16px; font-size: 24px;
font-family: Alibaba PuHuiTi; font-family: Alibaba PuHuiTi;
font-weight: 500; font-weight: 500;
color: #A9D1FF; color: #A9D1FF;
@ -859,9 +718,13 @@ export default {
color: #FFFFFF; color: #FFFFFF;
} }
} }
}
} }
.right-view4{
display: flex;
margin-top: 20px;
align-items: center;
justify-content: flex-end;
}
.main-table-title { .main-table-title {
width: 100%; width: 100%;
height: 41px; height: 41px;

6
src/views/page/videoMonitoring.vue
View File

@ -5,9 +5,9 @@
<img src="../../assets/image/real-time.png" alt="" /> <img src="../../assets/image/real-time.png" alt="" />
{{ deviceTypeName }}—{{ $t('videoMonitoring.title') }}<span class="outline" v-if="deviceState == 0">({{ $t('realTime.deviceOffline') }})</span> {{ deviceTypeName }}—{{ $t('videoMonitoring.title') }}<span class="outline" v-if="deviceState == 0">({{ $t('realTime.deviceOffline') }})</span>
</div> </div>
<div class="flex-list realTime-bottom videoMonitoring-monitor" :class="limitUserId==13?'noHeader':''"> <div class="flex-list realTime-bottom videoMonitoring-monitor" :class="limitUserId==13?'noHeader':''+' '+cameraName==1?'':'center'">
<div class="left-view" v-if="deviceName != 30"> <div class="left-view" v-if="deviceName != 30">
<div ref="monitor" class="monitor" :class="cameraName==1?'':'center'" id="monitor"> <div ref="monitor" class="monitor" id="monitor">
<!-- <video ref="videoPlayer" class="video-js" id="video-js"></video> --> <!-- <video ref="videoPlayer" class="video-js" id="video-js"></video> -->
<img v-if="imgUrl" class="video-js" :src="imgUrl" alt=""> <img v-if="imgUrl" class="video-js" :src="imgUrl" alt="">

4
vue.config.js
View File

@ -44,9 +44,9 @@ module.exports = {
}, },
proxy: { proxy: {
"/api": { "/api": {
target: 'https://api.lihe-control.com', //地址 // target: 'https://api.lihe-control.com', //地址
// target: 'http://jiaxingtest.a1.luyouxia.net:21114', //地址 // target: 'http://jiaxingtest.a1.luyouxia.net:21114', //地址
// target: 'http://jiaxingtest.e1.luyouxia.top:19159', //地址 target: 'http://jiaxingtest.e1.luyouxia.top:19159', //地址
// target: 'http://jiaxingtest.a1.luyouxia.net:25762', //地址 // target: 'http://jiaxingtest.a1.luyouxia.net:25762', //地址
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {