传感器合成
parent
afe6d43b3b
commit
af0a38da60
|
@ -143,5 +143,8 @@ export default {
|
|||
getReadControlliShuiControl(data){
|
||||
return sendGetRequest('/readControl/liShuiControl',data)
|
||||
},
|
||||
|
||||
//控制器 传感器输入合成
|
||||
getReadControlSensorInputSynthesis(data){
|
||||
return sendGetRequest('/readControl/sensorInputSynthesis',data)
|
||||
},
|
||||
};
|
|
@ -1853,3 +1853,112 @@
|
|||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .left-table {
|
||||
width: 140px;
|
||||
border-top: 1px solid rgba(0, 180, 255, 0.75);
|
||||
border-bottom: 1px solid rgba(0, 180, 255, 0.75);
|
||||
padding-bottom: 17px;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .left-table .table-header {
|
||||
font-size: 18px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .right-table {
|
||||
width: calc(100% - 140px - 10px);
|
||||
border-top: 1px solid rgba(0, 180, 255, 0.75);
|
||||
border-bottom: 1px solid rgba(0, 180, 255, 0.75);
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .right-table > div {
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .right-table .table-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .right-table .table-header > div {
|
||||
width: 70px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .right-table .table-tr > div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .right-table .table-tr > div > div {
|
||||
width: 70px;
|
||||
height: 100%;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .table-tr {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .table-tr > div {
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .table-tr > div:nth-child(odd) {
|
||||
background: rgba(0, 47, 94, 0.35);
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .table-tr > div:nth-child(even) {
|
||||
background: rgba(0, 180, 255, 0.2);
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .table-tr .no-sel {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
box-shadow: 0 0 15px rgba(53, 187, 247, 0.5) inset;
|
||||
border: 1px solid rgba(0, 204, 255, 0.7);
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .table-tr .sel {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
background: url(../image/radio.png) no-repeat center;
|
||||
background-size: 100% 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.synthesis-con .synthesis-content .table-header {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
background: rgba(0, 180, 255, 0.2);
|
||||
font-size: 16px;
|
||||
font-family: Arial;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -451,9 +451,10 @@
|
|||
}
|
||||
|
||||
.input-sel {
|
||||
>.title{
|
||||
>.title {
|
||||
margin-bottom: 11px;
|
||||
}
|
||||
|
||||
.el-dropdown-link {
|
||||
width: 300px;
|
||||
height: 44px;
|
||||
|
@ -800,7 +801,7 @@
|
|||
}
|
||||
|
||||
.btn {
|
||||
margin: 0 8px!important;
|
||||
margin: 0 8px !important;
|
||||
padding: 0 20px;
|
||||
border-radius: 3px;
|
||||
height: 40px;
|
||||
|
@ -814,6 +815,7 @@
|
|||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
min-width: 120px;
|
||||
|
||||
>img {
|
||||
margin-right: 10px;
|
||||
width: 14px;
|
||||
|
@ -827,9 +829,10 @@
|
|||
&.blue {
|
||||
background: #0294E2;
|
||||
}
|
||||
&.off{
|
||||
|
||||
&.off {
|
||||
background: #003070;
|
||||
border: 1px solid rgba(2,148,226,0.5);
|
||||
border: 1px solid rgba(2, 148, 226, 0.5);
|
||||
color: #00C0F7;
|
||||
}
|
||||
}
|
||||
|
@ -1186,7 +1189,8 @@
|
|||
color: #FFFFFF;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.sensor-sel{
|
||||
|
||||
.sensor-sel {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: calc(100% - 120px);
|
||||
|
@ -1199,6 +1203,7 @@
|
|||
white-space: nowrap;
|
||||
max-height: 50px;
|
||||
padding: 0 20px;
|
||||
|
||||
>.no-sel {
|
||||
margin-right: 10px;
|
||||
width: 35px;
|
||||
|
@ -1866,57 +1871,64 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.input-100-view{
|
||||
|
||||
.input-100-view {
|
||||
width: 100%;
|
||||
height: 66px;
|
||||
background: rgba(0,186,255,0.15);
|
||||
border: 2px solid rgba(0,186,255,0.4);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding:0 20px ;
|
||||
margin-bottom: 30px;
|
||||
.title{
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.4);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 20px;
|
||||
margin-bottom: 30px;
|
||||
|
||||
.title {
|
||||
font-size: 20px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
span{
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
span {
|
||||
padding: 0 10px;
|
||||
}
|
||||
.line{
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 1px;
|
||||
height: 40px;
|
||||
background: #0294E2;
|
||||
opacity: 0.5;
|
||||
margin: 0 20px;
|
||||
}
|
||||
.input-140{
|
||||
}
|
||||
|
||||
.input-140 {
|
||||
width: 140px;
|
||||
height: 44px;
|
||||
background: rgba(0,186,255,0.15);
|
||||
border: 2px solid rgba(0,186,255,0.4);
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.4);
|
||||
padding-left: 11px;
|
||||
|
||||
&::placeholder {
|
||||
color: rgba(133, 155, 182, 1);
|
||||
}
|
||||
}
|
||||
.input-180{
|
||||
|
||||
.input-180 {
|
||||
width: 180px;
|
||||
height: 44px;
|
||||
background: rgba(0,186,255,0.15);
|
||||
border: 2px solid rgba(0,186,255,0.4);
|
||||
background: rgba(0, 186, 255, 0.15);
|
||||
border: 2px solid rgba(0, 186, 255, 0.4);
|
||||
padding-left: 11px;
|
||||
|
||||
&::placeholder {
|
||||
color: rgba(133, 155, 182, 1);
|
||||
}
|
||||
}
|
||||
.input-100{
|
||||
|
||||
.input-100 {
|
||||
width: 100px;
|
||||
height: 44px;
|
||||
background: rgba(0,48,112,0.75);
|
||||
background: rgba(0, 48, 112, 0.75);
|
||||
border: 1px solid rgba(0, 186, 255, 0.80);
|
||||
padding-left: 11px;
|
||||
|
||||
|
@ -1925,39 +1937,150 @@ span{
|
|||
}
|
||||
}
|
||||
}
|
||||
.bold-title{
|
||||
|
||||
.bold-title {
|
||||
font-size: 20px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.padding-none{
|
||||
|
||||
.padding-none {
|
||||
padding: 0;
|
||||
}
|
||||
.margin-none{
|
||||
|
||||
.margin-none {
|
||||
margin: 0;
|
||||
}
|
||||
.skylight{
|
||||
.input-sel{
|
||||
|
||||
.skylight {
|
||||
.input-sel {
|
||||
margin-right: 20px;
|
||||
.el-dropdown-link{
|
||||
|
||||
.el-dropdown-link {
|
||||
// width: 260px;
|
||||
}
|
||||
}
|
||||
.flex-view{
|
||||
|
||||
.flex-view {
|
||||
border: none;
|
||||
}
|
||||
.input-main{
|
||||
|
||||
.input-main {
|
||||
margin-right: 20px;
|
||||
>input{
|
||||
|
||||
>input {
|
||||
width: 260px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fan{
|
||||
.bold-title{
|
||||
.fan {
|
||||
.bold-title {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.synthesis-con {
|
||||
.synthesis-content {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.left-table {
|
||||
width: 140px;
|
||||
border-top: 1px solid rgba(0, 180, 255, .75);
|
||||
border-bottom: 1px solid rgba(0, 180, 255, .75);
|
||||
padding-bottom: 17px;
|
||||
|
||||
.table-header{
|
||||
font-size: 18px;
|
||||
font-family: Microsoft YaHei;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.right-table {
|
||||
width: calc(100% - 140px - 10px);
|
||||
border-top: 1px solid rgba(0, 180, 255, .75);
|
||||
border-bottom: 1px solid rgba(0, 180, 255, .75);
|
||||
overflow-x: scroll;
|
||||
>div{
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
}
|
||||
.table-header{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
>div{
|
||||
width:70px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
.table-tr{
|
||||
>div{
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
>div{
|
||||
width:70px;
|
||||
height: 100%;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.table-tr{
|
||||
width: 100%;
|
||||
>div{
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
}
|
||||
>div:nth-child(odd){
|
||||
background: rgba(0, 47, 94, .35);
|
||||
}
|
||||
>div:nth-child(even){
|
||||
background: rgba(0,180,255,0.2);
|
||||
}
|
||||
.no-sel {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
box-shadow: 0 0 15px rgba(53, 187, 247, 0.50) inset;
|
||||
border: 1px solid rgba(0, 204, 255, 0.70);
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.sel {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
background: url(../image/radio.png) no-repeat center;
|
||||
background-size: 100% 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.table-header {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
background: rgba(0, 180, 255, 0.2);
|
||||
font-size: 16px;
|
||||
font-family: Arial;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
Binary file not shown.
After Width: | Height: | Size: 2.3 KiB |
|
@ -47,7 +47,7 @@ export default {
|
|||
]
|
||||
},
|
||||
{
|
||||
name: '风机', router: 'fan', list: [
|
||||
name: '风机(丽水项目)', router: 'fan', list: [
|
||||
{ name: '风机1', status: -1, router: 'fan', index: 1 },
|
||||
{ name: '风机2', status: -1, router: 'fan', index: 2 },
|
||||
{ name: '风机3', status: -1, router: 'fan', index: 3 },
|
||||
|
@ -55,7 +55,7 @@ export default {
|
|||
{ name: '风机5', status: -1, router: 'fan', index: 5 },
|
||||
]
|
||||
},
|
||||
// { name: '系统参数配置', list: [], router: 'systemSet-con', isRouter: true, },
|
||||
{ name: '传感器输入合成', list: [], router: 'synthesis-con', isRouter: true, },
|
||||
{ name: '传感器通道配置', list: [], router: 'sensorSet-con', isRouter: true, },
|
||||
{ name: '数据上传', list: [], router: 'upload-con', isRouter: true, },],
|
||||
routerNow: 'skylight',
|
||||
|
|
|
@ -90,6 +90,10 @@ const routes = [
|
|||
path: '/sensorSet-con',
|
||||
name: 'sensorSet-con',
|
||||
component: () => import('../views/page/sensorSet-con.vue')
|
||||
},{
|
||||
path: '/synthesis-con',
|
||||
name: 'synthesis-con',
|
||||
component: () => import('../views/page/synthesis-con.vue')
|
||||
},]
|
||||
},]
|
||||
},
|
||||
|
|
|
@ -212,7 +212,21 @@ export default {
|
|||
if (res.data.code == 200) {
|
||||
this.inputData = res.data.data;
|
||||
this.getNowData()
|
||||
this.inputData[21615] = this.countData(this.inputData[21615])
|
||||
this.inputData[21617] = this.countData(this.inputData[21617])
|
||||
this.inputData[21619] = this.countData(this.inputData[21619])
|
||||
|
||||
this.inputData[21626] = this.countData(this.inputData[21626])
|
||||
this.inputData[21628] = this.countData(this.inputData[21628])
|
||||
this.inputData[21630] = this.countData(this.inputData[21630])
|
||||
|
||||
this.inputData[21637] = this.countData(this.inputData[21637])
|
||||
this.inputData[21639] = this.countData(this.inputData[21639])
|
||||
this.inputData[21641] = this.countData(this.inputData[21641])
|
||||
|
||||
this.inputData[21648] = this.countData(this.inputData[21648])
|
||||
this.inputData[21650] = this.countData(this.inputData[21650])
|
||||
this.inputData[21652] = this.countData(this.inputData[21652])
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
|
@ -221,19 +235,18 @@ export default {
|
|||
//获取当前页面的参数
|
||||
getNowData() {
|
||||
this.openIndex = this.inputData[21613 + ((this.indexs - 1) * 11)]
|
||||
this.inputData[21615 + ((this.indexs - 1) * 11)] = this.countData(this.inputData[21615 + ((this.indexs - 1) * 11)])
|
||||
this.inputData[21617 + ((this.indexs - 1) * 11)] = this.countData(this.inputData[21617 + ((this.indexs - 1) * 11)])
|
||||
this.inputData[21619 + ((this.indexs - 1) * 11)] = this.countData(this.inputData[21619 + ((this.indexs - 1) * 11)])
|
||||
|
||||
|
||||
this.typeSelList.forEach((el, index) => {
|
||||
if( el.value == this.inputData[21657 + (this.indexs - 1)]){
|
||||
if (el.value == this.inputData[21657 + (this.indexs - 1)]) {
|
||||
|
||||
this.TypeSel = el.name
|
||||
this.TypeSelIndex = el.value
|
||||
}else{
|
||||
this.TypeSel = ''
|
||||
this.TypeSelIndex =0
|
||||
}
|
||||
|
||||
if(this.inputData[21657 + (this.indexs - 1)]==0){
|
||||
this.TypeSel = ''
|
||||
this.TypeSelIndex = 0
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
|
|
|
@ -0,0 +1,178 @@
|
|||
<template>
|
||||
<div class="synthesis-con">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/image/synthesis.png" alt=""> 传感器输入合成
|
||||
</div>
|
||||
<div class="synthesis-content">
|
||||
<div class="left-table">
|
||||
<div class="table-header">类别</div>
|
||||
<div class="table-tr">
|
||||
<div v-for="item, index in leftList" :key="index">{{ item }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-table scroll">
|
||||
<div>
|
||||
<div class="table-header">
|
||||
<div class="" v-for="item, index in 16">{{ index + 1 }}</div>
|
||||
</div>
|
||||
<div class="table-tr">
|
||||
<div v-for="item, index in rightList" :key="index">
|
||||
<div v-for="item1, index1 in item">
|
||||
<div :class="item1=='1'?'sel':'no-sel'" @click="changeType(index,index1)"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
inputData: [],
|
||||
leftList: ['1#平均温度',
|
||||
'2#平均温度',
|
||||
'1#平均湿度',
|
||||
'2#平均湿度',
|
||||
'光亮度',
|
||||
'CO2',
|
||||
'土壤温度',
|
||||
'土壤湿度',
|
||||
'营养液PH',
|
||||
'营养液EC',
|
||||
'水温',
|
||||
],
|
||||
rightList: ['0', '0', '0', '0', '0', '0', '0', '0', '0', '0', '0'],
|
||||
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit()
|
||||
},
|
||||
methods: {
|
||||
checkTime(i) {
|
||||
if (i < 10) {
|
||||
i = "0" + i;
|
||||
}
|
||||
|
||||
return i;
|
||||
},
|
||||
padString(str, length) {
|
||||
return str.padStart(length, '0');
|
||||
},
|
||||
getList(data){
|
||||
var num = data
|
||||
var num1 = this.padString(num.toString(2), 16)
|
||||
var openListNew = num1.split("")
|
||||
var list=openListNew.reverse()
|
||||
return list
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
};
|
||||
this.api.getReadControlSensorInputSynthesis(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.inputData = res.data.data;
|
||||
this.leftList.forEach((el,index)=>{
|
||||
|
||||
this.rightList[index]=this.getList(this.inputData['212'+this.checkTime(index)])
|
||||
})
|
||||
this.$forceUpdate();
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
//反转数组 不影响原数组
|
||||
myReverse(arr) {
|
||||
return [...arr].reverse()
|
||||
},
|
||||
changeType(index,index1){
|
||||
if(this.rightList[index][index1]=='1'){
|
||||
this.rightList[index][index1]='0'
|
||||
}else{
|
||||
this.rightList[index][index1]='1'
|
||||
}
|
||||
this.$forceUpdate();
|
||||
var num =this.myReverse(this.rightList[index]).join("");
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('212'+this.checkTime(index),dataNum)
|
||||
},
|
||||
changeBtn(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
};
|
||||
this.delayTimerBtn(0, data);
|
||||
},
|
||||
//切换btn的限制 写入停止后j*100毫秒调取函数
|
||||
delayTimerBtn(i, data) {
|
||||
const that = this;
|
||||
//整体接口
|
||||
let j = this.$store.state.lateSendBtn;
|
||||
//避免开启多个计时器
|
||||
this.timer && clearInterval(this.timer);
|
||||
|
||||
this.timer = setInterval(() => {
|
||||
++i;
|
||||
if (i == j) {
|
||||
that.changeData(data);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
change(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
};
|
||||
this.delayTimer(0, data);
|
||||
},
|
||||
//限制 写入停止后j*100毫秒调取函数
|
||||
delayTimer(i, data) {
|
||||
const that = this;
|
||||
//整体接口
|
||||
let j = this.$store.state.lateSend;
|
||||
//避免开启多个计时器
|
||||
this.timer && clearInterval(this.timer);
|
||||
|
||||
this.timer = setInterval(() => {
|
||||
++i;
|
||||
if (i == j) {
|
||||
that.changeData(data);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
changeData(data) {
|
||||
this.api.postControlWrite(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: res.data.msg,
|
||||
type: "success",
|
||||
});
|
||||
this.dataInit();
|
||||
} else {
|
||||
this.$message.error("请求出错");
|
||||
}
|
||||
this.timer = null
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
<style lang="scss"></style>
|
||||
|
Loading…
Reference in New Issue