五防页面接口逻辑更换 #74
|
|
@ -78,6 +78,21 @@ export default {
|
|||
this.dataInit();
|
||||
},
|
||||
methods: {
|
||||
countData(data) {
|
||||
if (data) {
|
||||
return (data - 400) / 10
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
// 计算展示值 计算公式 x/10
|
||||
countData10(data) {
|
||||
if (data) {
|
||||
return data / 10
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state;
|
||||
var data = store.equipmentList[store.equipmentIndex - 1].deviceId;
|
||||
|
|
@ -112,7 +127,40 @@ export default {
|
|||
this.routerNow != "/rollByRoll" &&
|
||||
this.routerNow != "/snowRemoval"
|
||||
) {
|
||||
this.$router.push({ path: `/waterPump` });
|
||||
//调取数据
|
||||
var store = this.$store.state;
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
};
|
||||
this.api.readControl_fiveControl(data).then((res) => {
|
||||
store.ControlData=res.data.data
|
||||
//加热水泵数据处理waterPump
|
||||
store.ControlData['21521'] = this.countData(store.ControlData['21521'])
|
||||
store.ControlData['21522'] = this.countData10(store.ControlData['21522'])
|
||||
store.ControlData['21523'] = this.countData(store.ControlData['21523'])
|
||||
store.ControlData['21524'] = this.countData(store.ControlData['21524'])
|
||||
|
||||
//下风口downtake
|
||||
store.ControlData["21544"] = this.countData(store.ControlData["21544"]);
|
||||
|
||||
//地热风机geothermalFan
|
||||
store.ControlData['21527'] = this.countData(store.ControlData['21527'])
|
||||
store.ControlData['21528'] = this.countData10(store.ControlData['21528'])
|
||||
|
||||
//卷被rollByRoll
|
||||
store.ControlData['21552'] = this.countData(store.ControlData['21552'])
|
||||
store.ControlData['21550'] = this.countData10(store.ControlData['21550'])
|
||||
|
||||
//除雪snowRemoval
|
||||
store.ControlData['21544'] = this.countData(store.ControlData['21544'])
|
||||
|
||||
//上风口
|
||||
store.ControlData['21532'] = this.countData(store.ControlData['21532'])
|
||||
store.ControlData['21533'] = this.countData10(store.ControlData['21533'])
|
||||
store.ControlData['21562'] = this.countData10(store.ControlData['21562'])
|
||||
|
||||
this.$router.push({ path: `/waterPump` });
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ export default new Vuex.Store({
|
|||
equipmentName: null,//当前设备 小设备的各个名字
|
||||
nameList: ['One', 'Two', 'Three', 'Four', 'Five', 'Six', 'Seven', 'Eight', 'Nine', 'Ten', 'Elven', 'Twelve', 'Thirteen', 'Fourteen', 'Fifteen', 'Sixteen'],
|
||||
formulaNum: [16, 48, 80, 112, 144, 176, 208, 240],
|
||||
|
||||
ControlData:null,//控制器五方数据
|
||||
activeNames:[],//组件内active
|
||||
//label是名称
|
||||
//value是code码
|
||||
|
|
|
|||
|
|
@ -0,0 +1,2 @@
|
|||
import Vue from 'vue';
|
||||
export const util = new Vue();
|
||||
|
|
@ -1,29 +1,31 @@
|
|||
<template>
|
||||
<div class="formula control">
|
||||
<setParamsControl></setParamsControl>
|
||||
<div class="page-content">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
|
||||
<div class="formula control">
|
||||
<setParamsControl></setParamsControl>
|
||||
<div class="page-content">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import setParamsControl from "../components/setParamsControl.vue";
|
||||
export default {
|
||||
components: {
|
||||
setParamsControl,
|
||||
export default {
|
||||
components: {
|
||||
setParamsControl,
|
||||
},
|
||||
data(){
|
||||
return {}
|
||||
},
|
||||
mounted(){},
|
||||
methods:{},
|
||||
|
||||
}
|
||||
</script>
|
||||
// 当控制器整体页面关闭时 清楚控制器数据
|
||||
beforeDestroy() {
|
||||
var store = this.$store.state;
|
||||
store.ControlData = null;
|
||||
},
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
mounted() {},
|
||||
methods: {},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -143,7 +143,6 @@ export default {
|
|||
this.limitUserId = res.data.data;
|
||||
const foundObject = this.limitUserId.find(item => item.id == 3);
|
||||
const foundName = this.headerList.findIndex(item => item.name == '二维码追溯');
|
||||
console.log(foundObject,foundName,123456);
|
||||
if(foundObject){
|
||||
if(foundName==-1){
|
||||
this.headerList.push({ name: '二维码追溯', router: 'setsuyuan', index: 1, routerList: ['setsuyuan'], img: require('../assets/image/header-img4.png') })
|
||||
|
|
|
|||
|
|
@ -1,279 +1,334 @@
|
|||
<template>
|
||||
<div class="waterPump wufang">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/img/downtake.png" alt=""> 下风口
|
||||
</div>
|
||||
<div class="title-tips">下风口有效性设置</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-btn">
|
||||
<div class="btn" @click="changeOpen(1)" :class="openIndex == 1 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet2.png" alt="" />自动运行
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(2)" :class="openIndex == 2 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet3.png" alt="" />手动打开
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(3)" :class="openIndex == 3 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />手动关闭
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(4)" :class="openIndex == 4 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />停止
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="flex-view">
|
||||
<div class="flex-sel padding-none" @click="changeOpenTrue()">
|
||||
<div v-if="!openTrue" class="no-sel margin-none"></div>
|
||||
<div v-else class="sel margin-none"></div>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>室外温度大于</span>
|
||||
<input @blur="blurChangeCount('21544', $event)" v-model="inputData['21544']" @input="changeCountData('21544', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>℃，打开下风口</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-main">
|
||||
<div>上风口全部打开 (100%) 时</div>
|
||||
<input @blur="blurChange('21543', $event)" v-model="inputData['21543']" @input="change('21543', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>分钟温度降不下来，打开下风口</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view border-none">
|
||||
<div class="input-main">
|
||||
<div>下风口的行程时间</div>
|
||||
<input @blur="blurChange('21545', $event)" v-model="inputData['21545']" @input="change('21545', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>秒</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>打开的通道</div>
|
||||
<input @blur="blurChange('21546', $event)" v-model="inputData['21546']" @input="change('21546', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>关闭的通道</div>
|
||||
<input @blur="blurChange('21547', $event)" v-model="inputData['21547']" @input="change('21547', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="waterPump wufang">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/img/downtake.png" alt="" /> 下风口
|
||||
</div>
|
||||
<div class="title-tips">下风口有效性设置</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-btn">
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(1)"
|
||||
:class="openIndex == 1 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet2.png" alt="" />自动运行
|
||||
</div>
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(2)"
|
||||
:class="openIndex == 2 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet3.png" alt="" />手动打开
|
||||
</div>
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(3)"
|
||||
:class="openIndex == 3 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />手动关闭
|
||||
</div>
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(4)"
|
||||
:class="openIndex == 4 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />停止
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex-view">
|
||||
<div class="flex-sel padding-none" @click="changeOpenTrue()">
|
||||
<div v-if="!openTrue" class="no-sel margin-none"></div>
|
||||
<div v-else class="sel margin-none"></div>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>室外温度大于</span>
|
||||
<input
|
||||
@blur="blurChangeCount('21544', $event)"
|
||||
v-model="inputData['21544']"
|
||||
@input="changeCountData('21544', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>℃，打开下风口</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-main">
|
||||
<div>上风口全部打开 (100%) 时</div>
|
||||
<input
|
||||
@blur="blurChange('21543', $event)"
|
||||
v-model="inputData['21543']"
|
||||
@input="change('21543', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>分钟温度降不下来，打开下风口</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view border-none">
|
||||
<div class="input-main">
|
||||
<div>下风口的行程时间</div>
|
||||
<input
|
||||
@blur="blurChange('21545', $event)"
|
||||
v-model="inputData['21545']"
|
||||
@input="change('21545', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>秒</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>打开的通道</div>
|
||||
<input
|
||||
@blur="blurChange('21546', $event)"
|
||||
v-model="inputData['21546']"
|
||||
@input="change('21546', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>关闭的通道</div>
|
||||
<input
|
||||
@blur="blurChange('21547', $event)"
|
||||
v-model="inputData['21547']"
|
||||
@input="change('21547', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
openIndex: 1,
|
||||
inputData: {},
|
||||
openTrue: false,
|
||||
data() {
|
||||
return {
|
||||
openIndex: 1,
|
||||
inputData: {},
|
||||
openTrue: false,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
var store = this.$store.state;
|
||||
// this.dataInit();
|
||||
if(store.ControlData){
|
||||
this.dataInit();
|
||||
}
|
||||
let inputList = document.querySelectorAll("input");
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
inputList[index].onfocus = this.selectValue; //input放入焦点，全选文本
|
||||
}
|
||||
},
|
||||
//如果接口还未调通 跳转到页面后 监听到数据变化就触发数据读取
|
||||
watch: {
|
||||
"$store.state.ControlData"(newVal) {
|
||||
this.dataInit();
|
||||
},
|
||||
},
|
||||
// 当前页面关闭前将数据存入vuex
|
||||
beforeDestroy() {
|
||||
var store = this.$store.state;
|
||||
this.inputData["21541"]= this.openIndex;
|
||||
this.inputData["21542"] = this.openTrue ? 1 : 0;
|
||||
store.ControlData = this.inputData;
|
||||
},
|
||||
methods: {
|
||||
changeOpenTrue() {
|
||||
this.openTrue = !this.openTrue;
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openTrue ? 1 : 0,
|
||||
},
|
||||
};
|
||||
this.changeBtn("21542", dataNum);
|
||||
},
|
||||
padString(str, length) {
|
||||
return str.padStart(length, "0");
|
||||
},
|
||||
changeOpen(index) {
|
||||
this.openIndex = index;
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openIndex,
|
||||
},
|
||||
};
|
||||
this.changeBtn(21541, dataNum);
|
||||
},
|
||||
//失去焦点 计算公式 x/10
|
||||
blurChange10(code, el) {
|
||||
var store = this.$store.state;
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value * 10,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
},
|
||||
//反向计算 计算公式 x/10
|
||||
changeCount10(code, el) {
|
||||
var data = el.target.value * 10;
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data,
|
||||
},
|
||||
};
|
||||
this.change(code, sendData);
|
||||
},
|
||||
//失去焦点
|
||||
blurChangeCount(code, el) {
|
||||
var store = this.$store.state;
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value * 10 + 400,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
},
|
||||
changeCountData(code, el) {
|
||||
var data = el.target.value * 10 + 400;
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data,
|
||||
},
|
||||
};
|
||||
this.change(code, sendData);
|
||||
},
|
||||
countData(data) {
|
||||
if (data) {
|
||||
return (data - 400) / 10;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
// 计算展示值 计算公式 x/10
|
||||
countData10(data) {
|
||||
if (data) {
|
||||
return data / 10;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state;
|
||||
var store = this.$store.state
|
||||
this.inputData = store.ControlData
|
||||
this.openIndex = this.inputData["21541"];
|
||||
this.openTrue = this.inputData["21542"] == 0 ? false : true;
|
||||
// this.inputData["21544"] = this.countData(this.inputData["21544"]);
|
||||
// var data = {
|
||||
// deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
// };
|
||||
// this.api.readControl_fiveControl(data).then((res) => {
|
||||
// if (res.data.code == 200) {
|
||||
|
||||
// }
|
||||
// });
|
||||
},
|
||||
//全选文本
|
||||
selectValue(e) {
|
||||
var store = this.$store.state;
|
||||
store.nowInput = e.target.value;
|
||||
e.currentTarget.select();
|
||||
},
|
||||
//失去焦点
|
||||
blurChange(code, el) {
|
||||
var store = this.$store.state;
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
},
|
||||
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);
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit();
|
||||
//input获取焦点后全选
|
||||
let inputList = document.querySelectorAll('input');
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
inputList[index].onfocus = this.selectValue;//input放入焦点，全选文本
|
||||
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);
|
||||
},
|
||||
methods: {
|
||||
changeOpenTrue() {
|
||||
this.openTrue = !this.openTrue
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openTrue ? 1 : 0,
|
||||
},
|
||||
};
|
||||
this.changeBtn('21542', dataNum);
|
||||
},
|
||||
padString(str, length) {
|
||||
return str.padStart(length, '0');
|
||||
},
|
||||
changeOpen(index) {
|
||||
this.openIndex = index
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openIndex,
|
||||
},
|
||||
};
|
||||
this.changeBtn(21541, dataNum);
|
||||
},
|
||||
//失去焦点 计算公式 x/10
|
||||
blurChange10(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value * 10,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
changeData(data) {
|
||||
var store = this.$store.state;
|
||||
|
||||
},
|
||||
//反向计算 计算公式 x/10
|
||||
changeCount10(code, el) {
|
||||
var data = el.target.value * 10
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data
|
||||
}
|
||||
}
|
||||
this.change(code, sendData)
|
||||
},
|
||||
//失去焦点
|
||||
blurChangeCount(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: (el.target.value * 10) + 400,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
|
||||
},
|
||||
changeCountData(code, el) {
|
||||
var data = (el.target.value * 10) + 400
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data
|
||||
}
|
||||
}
|
||||
this.change(code, sendData)
|
||||
},
|
||||
countData(data) {
|
||||
if (data) {
|
||||
return (data - 400) / 10
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
// 计算展示值 计算公式 x/10
|
||||
countData10(data) {
|
||||
if (data) {
|
||||
return data / 10
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
|
||||
};
|
||||
this.api.readControl_fiveControl(data).then(res => {
|
||||
if(res.data.code==200){
|
||||
this.inputData = res.data.data
|
||||
this.openIndex = this.inputData['21541']
|
||||
this.openTrue = this.inputData['21542'] == 0 ? false : true
|
||||
this.inputData['21544'] = this.countData(this.inputData['21544'])
|
||||
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
},
|
||||
//全选文本
|
||||
selectValue(e) {
|
||||
var store = this.$store.state
|
||||
store.nowInput=e.target.value
|
||||
e.currentTarget.select();
|
||||
},
|
||||
//失去焦点
|
||||
blurChange(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
|
||||
},
|
||||
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) {
|
||||
var store = this.$store.state
|
||||
|
||||
this.api.postControlWrite(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: res.data.msg,
|
||||
type: "success",
|
||||
});
|
||||
store.nowInput=''
|
||||
// this.dataInit();
|
||||
} else {
|
||||
this.inputData[data.regAddress]=store.nowInput
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
this.timer = null
|
||||
});
|
||||
},
|
||||
this.api.postControlWrite(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: res.data.msg,
|
||||
type: "success",
|
||||
});
|
||||
store.nowInput = "";
|
||||
// this.dataInit();
|
||||
} else {
|
||||
this.inputData[data.regAddress] = store.nowInput;
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
this.timer = null;
|
||||
});
|
||||
},
|
||||
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss"></style>
|
||||
|
||||
|
|
@ -57,8 +57,24 @@ export default {
|
|||
inputData: {},
|
||||
}
|
||||
},
|
||||
//如果接口还未调通 跳转到页面后 监听到数据变化就触发数据读取
|
||||
watch: {
|
||||
"$store.state.ControlData"(newVal) {
|
||||
this.dataInit();
|
||||
},
|
||||
},
|
||||
// 当前页面关闭前将数据存入vuex
|
||||
beforeDestroy() {
|
||||
var store = this.$store.state;
|
||||
this.inputData['21526']=this.openIndex
|
||||
store.ControlData = this.inputData;
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit();
|
||||
var store = this.$store.state;
|
||||
// this.dataInit();
|
||||
if(store.ControlData){
|
||||
this.dataInit();
|
||||
}
|
||||
//input获取焦点后全选
|
||||
let inputList = document.querySelectorAll('input');
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
|
|
@ -142,19 +158,20 @@ export default {
|
|||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
|
||||
};
|
||||
this.api.readControl_fiveControl(data).then(res => {
|
||||
if(res.data.code==200){
|
||||
this.inputData = res.data.data
|
||||
this.inputData = store.ControlData
|
||||
this.openIndex = this.inputData['21526']
|
||||
this.inputData['21527'] = this.countData(this.inputData['21527'])
|
||||
this.inputData['21528'] = this.countData10(this.inputData['21528'])
|
||||
}
|
||||
// this.inputData['21527'] = this.countData(this.inputData['21527'])
|
||||
// this.inputData['21528'] = this.countData10(this.inputData['21528'])
|
||||
// var data = {
|
||||
// deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
|
||||
})
|
||||
// };
|
||||
// this.api.readControl_fiveControl(data).then(res => {
|
||||
// if(res.data.code==200){
|
||||
|
||||
// }
|
||||
|
||||
// })
|
||||
},
|
||||
//全选文本
|
||||
selectValue(e) {
|
||||
|
|
|
|||
|
|
@ -1,368 +1,464 @@
|
|||
<template>
|
||||
<div class="waterPump wufang">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/img/rollByRoll.png" alt=""> 卷被
|
||||
<div class="waterPump wufang">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/img/rollByRoll.png" alt="" /> 卷被
|
||||
|
||||
<div class="title-text">日出:{{ sunrise }}</div>
|
||||
<div class="title-text">日落:{{ sunset }}</div>
|
||||
</div>
|
||||
<div class="title-tips">卷被有效性设置</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-btn">
|
||||
<div class="btn" @click="changeOpen(1)" :class="openIndex == 1 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet2.png" alt="" />自动运行
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(2)" :class="openIndex == 2 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet3.png" alt="" />手动打开
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(3)" :class="openIndex == 3 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />手动关闭
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(4)" :class="openIndex == 4 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />停止
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="flex-view">
|
||||
<div class="flex-sel padding-none" v-if="openTrue.length" @click="changeOpenTrue(0)">
|
||||
<div v-if="openTrue[0] == 0" class="no-sel margin-none"></div>
|
||||
<div v-else class="sel margin-none"></div>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>①室外光照大于</span>
|
||||
<input @blur="blurChange10('21550', $event)" v-model="inputData['21550']"
|
||||
@input="changeCount10('21550', $event)" type="text" value="60" placeholder="60" />
|
||||
<span>klx，收拢卷被</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="flex-sel padding-none" v-if="openTrue.length" @click="changeOpenTrue(1)">
|
||||
<div v-if="openTrue[1] == 0" class="no-sel margin-none"></div>
|
||||
<div v-else class="sel margin-none"></div>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>②日出</span>
|
||||
<input @blur="blurChange('21551', $event)" v-model="inputData['21551']" @input="change('21551', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>分钟，收拢卷被</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="flex-sel padding-none" v-if="openTrue.length" @click="changeOpenTrue(2)">
|
||||
<div v-if="openTrue[2] == 0" class="no-sel margin-none"></div>
|
||||
<div v-else class="sel margin-none"></div>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>③室内1#平均温度低于</span>
|
||||
<input @blur="blurChangeCount('21552', $event)" v-model="inputData['21552']"
|
||||
@input="changeCountData('21552', $event)" type="text" value="60" placeholder="60" />
|
||||
<span>℃时，展开卷被</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="flex-sel padding-none" v-if="openTrue.length" @click="changeOpenTrue(3)">
|
||||
<div v-if="openTrue[3] == 0" class="no-sel margin-none"></div>
|
||||
<div v-else class="sel margin-none"></div>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>④日落前</span>
|
||||
<input @blur="blurChange('21553', $event)" v-model="inputData['21553']" @input="change('21553', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>分钟，展开卷被</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view border-none">
|
||||
<div class="input-main">
|
||||
<div>卷被的行程时间</div>
|
||||
<input @blur="blurChange('21554', $event)" v-model="inputData['21554']" @input="change('21554', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>秒</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>卷被开窗的行程时间</div>
|
||||
<input @blur="blurChange('21555', $event)" v-model="inputData['21555']" @input="change('21555', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>秒</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>展开的输出通道</div>
|
||||
<input @blur="blurChange('21556', $event)" v-model="inputData['21556']" @input="change('21556', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>收拢的输出通道</div>
|
||||
<input @blur="blurChange('21557', $event)" v-model="inputData['21557']" @input="change('21557', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="title-text">日出:{{ sunrise }}</div>
|
||||
<div class="title-text">日落:{{ sunset }}</div>
|
||||
</div>
|
||||
<div class="title-tips">卷被有效性设置</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-btn">
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(1)"
|
||||
:class="openIndex == 1 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet2.png" alt="" />自动运行
|
||||
</div>
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(2)"
|
||||
:class="openIndex == 2 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet3.png" alt="" />手动打开
|
||||
</div>
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(3)"
|
||||
:class="openIndex == 3 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />手动关闭
|
||||
</div>
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(4)"
|
||||
:class="openIndex == 4 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />停止
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex-view">
|
||||
<div
|
||||
class="flex-sel padding-none"
|
||||
v-if="openTrue.length"
|
||||
@click="changeOpenTrue(0)"
|
||||
>
|
||||
<div v-if="openTrue[0] == 0" class="no-sel margin-none"></div>
|
||||
<div v-else class="sel margin-none"></div>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>①室外光照大于</span>
|
||||
<input
|
||||
@blur="blurChange10('21550', $event)"
|
||||
v-model="inputData['21550']"
|
||||
@input="changeCount10('21550', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>klx，收拢卷被</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div
|
||||
class="flex-sel padding-none"
|
||||
v-if="openTrue.length"
|
||||
@click="changeOpenTrue(1)"
|
||||
>
|
||||
<div v-if="openTrue[1] == 0" class="no-sel margin-none"></div>
|
||||
<div v-else class="sel margin-none"></div>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>②日出</span>
|
||||
<input
|
||||
@blur="blurChange('21551', $event)"
|
||||
v-model="inputData['21551']"
|
||||
@input="change('21551', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>分钟，收拢卷被</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div
|
||||
class="flex-sel padding-none"
|
||||
v-if="openTrue.length"
|
||||
@click="changeOpenTrue(2)"
|
||||
>
|
||||
<div v-if="openTrue[2] == 0" class="no-sel margin-none"></div>
|
||||
<div v-else class="sel margin-none"></div>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>③室内1#平均温度低于</span>
|
||||
<input
|
||||
@blur="blurChangeCount('21552', $event)"
|
||||
v-model="inputData['21552']"
|
||||
@input="changeCountData('21552', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>℃时，展开卷被</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div
|
||||
class="flex-sel padding-none"
|
||||
v-if="openTrue.length"
|
||||
@click="changeOpenTrue(3)"
|
||||
>
|
||||
<div v-if="openTrue[3] == 0" class="no-sel margin-none"></div>
|
||||
<div v-else class="sel margin-none"></div>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>④日落前</span>
|
||||
<input
|
||||
@blur="blurChange('21553', $event)"
|
||||
v-model="inputData['21553']"
|
||||
@input="change('21553', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>分钟，展开卷被</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view border-none">
|
||||
<div class="input-main">
|
||||
<div>卷被的行程时间</div>
|
||||
<input
|
||||
@blur="blurChange('21554', $event)"
|
||||
v-model="inputData['21554']"
|
||||
@input="change('21554', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>秒</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>卷被开窗的行程时间</div>
|
||||
<input
|
||||
@blur="blurChange('21555', $event)"
|
||||
v-model="inputData['21555']"
|
||||
@input="change('21555', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>秒</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>展开的输出通道</div>
|
||||
<input
|
||||
@blur="blurChange('21556', $event)"
|
||||
v-model="inputData['21556']"
|
||||
@input="change('21556', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>收拢的输出通道</div>
|
||||
<input
|
||||
@blur="blurChange('21557', $event)"
|
||||
v-model="inputData['21557']"
|
||||
@input="change('21557', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
openIndex: 1,
|
||||
inputData: {},
|
||||
openTrue: [],
|
||||
sunrise: '00:00',
|
||||
sunset: '00:00'
|
||||
}
|
||||
data() {
|
||||
return {
|
||||
openIndex: 1,
|
||||
inputData: {},
|
||||
openTrue: [],
|
||||
sunrise: "00:00",
|
||||
sunset: "00:00",
|
||||
};
|
||||
},
|
||||
//如果接口还未调通 跳转到页面后 监听到数据变化就触发数据读取
|
||||
watch: {
|
||||
"$store.state.ControlData"(newVal) {
|
||||
this.dataInit();
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit();
|
||||
//input获取焦点后全选
|
||||
let inputList = document.querySelectorAll('input');
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
inputList[index].onfocus = this.selectValue;//input放入焦点，全选文本
|
||||
}
|
||||
},
|
||||
// 当前页面关闭前将数据存入vuex
|
||||
beforeDestroy() {
|
||||
var store = this.$store.state;
|
||||
this.inputData["21548"] = this.openIndex;
|
||||
var num = this.myReverse(this.openTrue).join("");
|
||||
this.inputData["21549"] = parseInt(num, 2);
|
||||
store.ControlData = this.inputData;
|
||||
},
|
||||
mounted() {
|
||||
var store = this.$store.state;
|
||||
// this.dataInit();
|
||||
if (store.ControlData) {
|
||||
this.dataInit();
|
||||
}
|
||||
//input获取焦点后全选
|
||||
let inputList = document.querySelectorAll("input");
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
inputList[index].onfocus = this.selectValue; //input放入焦点，全选文本
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//反转数组 不影响原数组
|
||||
myReverse(arr) {
|
||||
return [...arr].reverse();
|
||||
},
|
||||
methods: {
|
||||
//反转数组 不影响原数组
|
||||
myReverse(arr) {
|
||||
return [...arr].reverse()
|
||||
},
|
||||
padString(str, length) {
|
||||
return str.padStart(length, '0');
|
||||
},
|
||||
changeOpenTrue(index) {
|
||||
if (this.openTrue[index] == 0) {
|
||||
this.openTrue[index] = 1
|
||||
} else {
|
||||
this.openTrue[index] = 0
|
||||
}
|
||||
this.$forceUpdate();
|
||||
var num = this.myReverse(this.openTrue).join("")
|
||||
padString(str, length) {
|
||||
return str.padStart(length, "0");
|
||||
},
|
||||
changeOpenTrue(index) {
|
||||
if (this.openTrue[index] == 0) {
|
||||
this.openTrue[index] = 1;
|
||||
} else {
|
||||
this.openTrue[index] = 0;
|
||||
}
|
||||
this.$forceUpdate();
|
||||
var num = this.myReverse(this.openTrue).join("");
|
||||
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('21549', dataNum);
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
padString(str, length) {
|
||||
return str.padStart(length, '0');
|
||||
};
|
||||
this.changeBtn("21549", dataNum);
|
||||
},
|
||||
padString(str, length) {
|
||||
return str.padStart(length, "0");
|
||||
},
|
||||
changeOpen(index) {
|
||||
this.openIndex = index;
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openIndex,
|
||||
},
|
||||
changeOpen(index) {
|
||||
this.openIndex = index
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openIndex,
|
||||
},
|
||||
};
|
||||
this.changeBtn(21548, dataNum);
|
||||
};
|
||||
this.changeBtn(21548, dataNum);
|
||||
},
|
||||
//失去焦点 计算公式 x/10
|
||||
blurChange10(code, el) {
|
||||
var store = this.$store.state;
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value * 10,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
},
|
||||
//反向计算 计算公式 x/10
|
||||
changeCount10(code, el) {
|
||||
var data = el.target.value * 10;
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data,
|
||||
},
|
||||
//失去焦点 计算公式 x/10
|
||||
blurChange10(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value * 10,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
};
|
||||
this.change(code, sendData);
|
||||
},
|
||||
//失去焦点
|
||||
blurChangeCount(code, el) {
|
||||
var store = this.$store.state;
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value * 10 + 400,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
},
|
||||
changeCountData(code, el) {
|
||||
var data = el.target.value * 10 + 400;
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data,
|
||||
},
|
||||
};
|
||||
this.change(code, sendData);
|
||||
},
|
||||
countData(data) {
|
||||
if (data) {
|
||||
return (data - 400) / 10;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
// 计算展示值 计算公式 x/10
|
||||
countData10(data) {
|
||||
if (data) {
|
||||
return data / 10;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
get21549() {
|
||||
var num1 = this.inputData["21549"];
|
||||
var num11 = this.padString(num1.toString(2), 4);
|
||||
var openList1New;
|
||||
openList1New = num11.split("");
|
||||
this.openTrue = openList1New.reverse();
|
||||
},
|
||||
getStatus(data) {
|
||||
this.api.getControlGetState(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.sunrise = this.insertColonEveryTwoDigits(
|
||||
this.convertToTimeMinutes(res.data.data["1021"])
|
||||
);
|
||||
this.sunset = this.insertColonEveryTwoDigits(
|
||||
this.convertToTimeMinutes(res.data.data["1022"])
|
||||
);
|
||||
}
|
||||
});
|
||||
},
|
||||
//16进制转为时间 16位无符号高字节是时，低字节是分
|
||||
convertToTimeMinutes(hexValue) {
|
||||
// 将十进制数转换为16进制字符串
|
||||
let hexString = hexValue.toString(16);
|
||||
|
||||
},
|
||||
//反向计算 计算公式 x/10
|
||||
changeCount10(code, el) {
|
||||
var data = el.target.value * 10
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data
|
||||
}
|
||||
}
|
||||
this.change(code, sendData)
|
||||
},
|
||||
//失去焦点
|
||||
blurChangeCount(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: (el.target.value * 10) + 400,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
// 补零，确保结果是4位16进制数
|
||||
while (hexString.length < 4) {
|
||||
hexString = "0" + hexString;
|
||||
}
|
||||
|
||||
},
|
||||
changeCountData(code, el) {
|
||||
var data = (el.target.value * 10) + 400
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data
|
||||
}
|
||||
}
|
||||
this.change(code, sendData)
|
||||
},
|
||||
countData(data) {
|
||||
if (data) {
|
||||
return (data - 400) / 10
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
// 计算展示值 计算公式 x/10
|
||||
countData10(data) {
|
||||
if (data) {
|
||||
return data / 10
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
get21549() {
|
||||
var num1 = this.inputData['21549']
|
||||
var num11 = this.padString(num1.toString(2), 4)
|
||||
var openList1New
|
||||
openList1New = num11.split("")
|
||||
this.openTrue = openList1New.reverse()
|
||||
},
|
||||
getStatus(data) {
|
||||
this.api.getControlGetState(data).then(res => {
|
||||
if (res.data.code == 200) {
|
||||
this.sunrise = this.insertColonEveryTwoDigits(this.convertToTimeMinutes(res.data.data['1021']))
|
||||
this.sunset = this.insertColonEveryTwoDigits(this.convertToTimeMinutes(res.data.data['1022']))
|
||||
}
|
||||
})
|
||||
},
|
||||
//16进制转为时间 16位无符号高字节是时，低字节是分
|
||||
convertToTimeMinutes(hexValue) {
|
||||
// 将十进制数转换为16进制字符串
|
||||
let hexString = hexValue.toString(16);
|
||||
return hexString;
|
||||
},
|
||||
insertColonEveryTwoDigits(inputString) {
|
||||
// 使用正则表达式将字符串每两位切割
|
||||
const chunks = inputString.match(/.{1,2}/g);
|
||||
return chunks.join(":");
|
||||
// 使用join方法将切割后的数组元素用冒号连接起来
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state;
|
||||
var store = this.$store.state;
|
||||
this.inputData = store.ControlData;
|
||||
this.openIndex = this.inputData["21548"];
|
||||
this.get21549();
|
||||
// this.inputData['21552'] = this.countData(this.inputData['21552'])
|
||||
// this.inputData['21550'] = this.countData10(this.inputData['21550'])
|
||||
// var data = {
|
||||
// deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
|
||||
// 补零，确保结果是4位16进制数
|
||||
while (hexString.length < 4) {
|
||||
hexString = '0' + hexString;
|
||||
}
|
||||
// };
|
||||
// this.api.readControl_fiveControl(data).then(res => {
|
||||
// console.log(res, 111);
|
||||
// if (res.data.code == 200) {
|
||||
|
||||
return hexString;
|
||||
|
||||
},
|
||||
insertColonEveryTwoDigits(inputString) {
|
||||
// 使用正则表达式将字符串每两位切割
|
||||
const chunks = inputString.match(/.{1,2}/g);
|
||||
return chunks.join(':')
|
||||
// 使用join方法将切割后的数组元素用冒号连接起来
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
// }
|
||||
|
||||
};
|
||||
this.api.readControl_fiveControl(data).then(res => {
|
||||
console.log(res, 111);
|
||||
if (res.data.code == 200) {
|
||||
this.inputData = res.data.data
|
||||
this.openIndex = this.inputData['21548']
|
||||
this.get21549()
|
||||
this.inputData['21552'] = this.countData(this.inputData['21552'])
|
||||
this.inputData['21550'] = this.countData10(this.inputData['21550'])
|
||||
}
|
||||
|
||||
|
||||
|
||||
})
|
||||
this.getStatus(data)
|
||||
},
|
||||
//全选文本
|
||||
// })
|
||||
this.getStatus(data);
|
||||
},
|
||||
//全选文本
|
||||
selectValue(e) {
|
||||
var store = this.$store.state
|
||||
store.nowInput=e.target.value
|
||||
e.currentTarget.select();
|
||||
var store = this.$store.state;
|
||||
store.nowInput = e.target.value;
|
||||
e.currentTarget.select();
|
||||
},
|
||||
//失去焦点
|
||||
blurChange(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
//失去焦点
|
||||
blurChange(code, el) {
|
||||
var store = this.$store.state;
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
},
|
||||
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);
|
||||
|
||||
},
|
||||
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);
|
||||
},
|
||||
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) {
|
||||
var store = this.$store.state
|
||||
this.api.postControlWrite(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: res.data.msg,
|
||||
type: "success",
|
||||
});
|
||||
store.nowInput=''
|
||||
// this.dataInit();
|
||||
} else {
|
||||
this.inputData[data.regAddress]=store.nowInput
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
this.timer = null
|
||||
this.timer = setInterval(() => {
|
||||
++i;
|
||||
if (i == j) {
|
||||
that.changeData(data);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
changeData(data) {
|
||||
var store = this.$store.state;
|
||||
this.api.postControlWrite(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: res.data.msg,
|
||||
type: "success",
|
||||
});
|
||||
},
|
||||
store.nowInput = "";
|
||||
// this.dataInit();
|
||||
} else {
|
||||
this.inputData[data.regAddress] = store.nowInput;
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
this.timer = null;
|
||||
});
|
||||
},
|
||||
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss"></style>
|
||||
|
||||
|
|
@ -1,267 +1,306 @@
|
|||
<template>
|
||||
<div class="waterPump wufang">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/img/snowRemoval.png" alt=""> 除雪
|
||||
</div>
|
||||
<div class="title-tips">除雪有效性设置</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-btn">
|
||||
<div class="btn" @click="changeOpen(1)" :class="openIndex == 1 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet2.png" alt="" />自动除雪
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(2)" :class="openIndex == 2 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet3.png" alt="" />手动打开
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(3)" :class="openIndex == 3 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />手动关闭
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="flex-view">
|
||||
<div class="input-main">
|
||||
<span>一键除雪</span>
|
||||
</div>
|
||||
<div class="flex-sel">
|
||||
<div v-if="!openTrue" class="no-sel" @click="changeOpenTrue(true)"></div>
|
||||
<div v-else class="sel" ></div>
|
||||
启动
|
||||
</div>
|
||||
<div class="flex-sel">
|
||||
<div v-if="openTrue" class="no-sel" @click="changeOpenTrue(false)"></div>
|
||||
<div v-else class="sel" ></div>
|
||||
关闭
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex-view border-none">
|
||||
<div class="input-main">
|
||||
<div>除雪时间</div>
|
||||
<input @blur="blurChange('21560', $event)"
|
||||
v-model="inputData['21560']"
|
||||
@input="change('21560', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>秒</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>打开或关闭输出通道</div>
|
||||
<input @blur="blurChange('21561', $event)"
|
||||
v-model="inputData['21561']"
|
||||
@input="change('21561', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="waterPump wufang">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/img/snowRemoval.png" alt="" /> 除雪
|
||||
</div>
|
||||
<div class="title-tips">除雪有效性设置</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-btn">
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(1)"
|
||||
:class="openIndex == 1 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet2.png" alt="" />自动除雪
|
||||
</div>
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(2)"
|
||||
:class="openIndex == 2 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet3.png" alt="" />手动打开
|
||||
</div>
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(3)"
|
||||
:class="openIndex == 3 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />手动关闭
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex-view">
|
||||
<div class="input-main">
|
||||
<span>一键除雪</span>
|
||||
</div>
|
||||
<div class="flex-sel">
|
||||
<div
|
||||
v-if="!openTrue"
|
||||
class="no-sel"
|
||||
@click="changeOpenTrue(true)"
|
||||
></div>
|
||||
<div v-else class="sel"></div>
|
||||
启动
|
||||
</div>
|
||||
<div class="flex-sel">
|
||||
<div
|
||||
v-if="openTrue"
|
||||
class="no-sel"
|
||||
@click="changeOpenTrue(false)"
|
||||
></div>
|
||||
<div v-else class="sel"></div>
|
||||
关闭
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex-view border-none">
|
||||
<div class="input-main">
|
||||
<div>除雪时间</div>
|
||||
<input
|
||||
@blur="blurChange('21560', $event)"
|
||||
v-model="inputData['21560']"
|
||||
@input="change('21560', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>秒</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>打开或关闭输出通道</div>
|
||||
<input
|
||||
@blur="blurChange('21561', $event)"
|
||||
v-model="inputData['21561']"
|
||||
@input="change('21561', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
openIndex: 1,
|
||||
inputData: {},
|
||||
openTrue: false,
|
||||
}
|
||||
data() {
|
||||
return {
|
||||
openIndex: 1,
|
||||
inputData: {},
|
||||
openTrue: false,
|
||||
};
|
||||
},
|
||||
//如果接口还未调通 跳转到页面后 监听到数据变化就触发数据读取
|
||||
watch: {
|
||||
"$store.state.ControlData"(newVal) {
|
||||
this.dataInit();
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit();
|
||||
//input获取焦点后全选
|
||||
let inputList = document.querySelectorAll('input');
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
inputList[index].onfocus = this.selectValue;//input放入焦点，全选文本
|
||||
}
|
||||
},
|
||||
// 当前页面关闭前将数据存入vuex
|
||||
beforeDestroy() {
|
||||
var store = this.$store.state;
|
||||
this.inputData["21558"]= this.openIndex
|
||||
this.inputData["21559"] = this.openTrue ? 1 : 0;
|
||||
store.ControlData = this.inputData;
|
||||
},
|
||||
mounted() {
|
||||
var store = this.$store.state;
|
||||
// this.dataInit();
|
||||
if (store.ControlData) {
|
||||
this.dataInit();
|
||||
}
|
||||
//input获取焦点后全选
|
||||
let inputList = document.querySelectorAll("input");
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
inputList[index].onfocus = this.selectValue; //input放入焦点，全选文本
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeOpenTrue(istrue) {
|
||||
this.openTrue = istrue;
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openTrue ? 1 : 0,
|
||||
},
|
||||
};
|
||||
this.changeBtn(21559, dataNum);
|
||||
},
|
||||
methods: {
|
||||
changeOpenTrue(istrue) {
|
||||
this.openTrue = istrue
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openTrue ? 1 : 0,
|
||||
},
|
||||
};
|
||||
this.changeBtn(21559, dataNum);
|
||||
padString(str, length) {
|
||||
return str.padStart(length, "0");
|
||||
},
|
||||
changeOpen(index) {
|
||||
this.openIndex = index;
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openIndex,
|
||||
},
|
||||
padString(str, length) {
|
||||
return str.padStart(length, '0');
|
||||
};
|
||||
this.changeBtn(21558, dataNum);
|
||||
},
|
||||
//失去焦点 计算公式 x/10
|
||||
blurChange10(code, el) {
|
||||
var store = this.$store.state;
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value * 10,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
},
|
||||
//反向计算 计算公式 x/10
|
||||
changeCount10(code, el) {
|
||||
var data = el.target.value * 10;
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data,
|
||||
},
|
||||
changeOpen(index) {
|
||||
this.openIndex = index
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openIndex,
|
||||
},
|
||||
};
|
||||
this.changeBtn(21558, dataNum);
|
||||
};
|
||||
this.change(code, sendData);
|
||||
},
|
||||
//失去焦点
|
||||
blurChangeCount(code, el) {
|
||||
var store = this.$store.state;
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value * 10 + 400,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
},
|
||||
changeCountData(code, el) {
|
||||
var data = el.target.value * 10 + 400;
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data,
|
||||
},
|
||||
//失去焦点 计算公式 x/10
|
||||
blurChange10(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value * 10,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
};
|
||||
this.change(code, sendData);
|
||||
},
|
||||
countData(data) {
|
||||
if (data) {
|
||||
return (data - 400) / 10;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
// 计算展示值 计算公式 x/10
|
||||
countData10(data) {
|
||||
if (data) {
|
||||
return data / 10;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state;
|
||||
this.inputData = store.ControlData;
|
||||
this.openIndex = this.inputData["21558"];
|
||||
this.openTrue = this.inputData["21559"] == 0 ? false : true;
|
||||
// this.inputData['21544'] = this.countData(this.inputData['21544'])
|
||||
// var data = {
|
||||
// deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
|
||||
},
|
||||
//反向计算 计算公式 x/10
|
||||
changeCount10(code, el) {
|
||||
var data = el.target.value * 10
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data
|
||||
}
|
||||
}
|
||||
this.change(code, sendData)
|
||||
},
|
||||
//失去焦点
|
||||
blurChangeCount(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: (el.target.value * 10) + 400,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
// };
|
||||
// this.api.readControl_fiveControl(data).then(res => {
|
||||
// console.log(res, 111);
|
||||
|
||||
},
|
||||
changeCountData(code, el) {
|
||||
var data = (el.target.value * 10) + 400
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data
|
||||
}
|
||||
}
|
||||
this.change(code, sendData)
|
||||
},
|
||||
countData(data) {
|
||||
if (data) {
|
||||
return (data - 400) / 10
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
// 计算展示值 计算公式 x/10
|
||||
countData10(data) {
|
||||
if (data) {
|
||||
return data / 10
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
|
||||
};
|
||||
this.api.readControl_fiveControl(data).then(res => {
|
||||
console.log(res, 111);
|
||||
this.inputData = res.data.data
|
||||
this.openIndex = this.inputData['21558']
|
||||
this.openTrue = this.inputData['21559'] == 0 ? false : true
|
||||
this.inputData['21544'] = this.countData(this.inputData['21544'])
|
||||
|
||||
|
||||
})
|
||||
},
|
||||
//全选文本
|
||||
// })
|
||||
},
|
||||
//全选文本
|
||||
selectValue(e) {
|
||||
var store = this.$store.state
|
||||
store.nowInput=e.target.value
|
||||
e.currentTarget.select();
|
||||
var store = this.$store.state;
|
||||
store.nowInput = e.target.value;
|
||||
e.currentTarget.select();
|
||||
},
|
||||
//失去焦点
|
||||
blurChange(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
//失去焦点
|
||||
blurChange(code, el) {
|
||||
var store = this.$store.state;
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
},
|
||||
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);
|
||||
|
||||
},
|
||||
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);
|
||||
},
|
||||
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) {
|
||||
var store = this.$store.state
|
||||
this.api.postControlWrite(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: res.data.msg,
|
||||
type: "success",
|
||||
});
|
||||
store.nowInput=''
|
||||
// this.dataInit();
|
||||
} else {
|
||||
this.inputData[data.regAddress]=store.nowInput
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
this.timer = null
|
||||
this.timer = setInterval(() => {
|
||||
++i;
|
||||
if (i == j) {
|
||||
that.changeData(data);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
changeData(data) {
|
||||
var store = this.$store.state;
|
||||
this.api.postControlWrite(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: res.data.msg,
|
||||
type: "success",
|
||||
});
|
||||
},
|
||||
store.nowInput = "";
|
||||
// this.dataInit();
|
||||
} else {
|
||||
this.inputData[data.regAddress] = store.nowInput;
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
this.timer = null;
|
||||
});
|
||||
},
|
||||
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss"></style>
|
||||
|
||||
|
|
@ -1,372 +1,467 @@
|
|||
<template>
|
||||
<div class="waterPump wufang">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/img/uptake.png" alt=""> 上风口
|
||||
</div>
|
||||
<div class="title-tips">上风口有效性设置</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-btn">
|
||||
<div class="btn" @click="changeOpen(1)" :class="openIndex == 1 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet2.png" alt="" />自动运行
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(2)" :class="openIndex == 2 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet3.png" alt="" />手动打开
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(3)" :class="openIndex == 3 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />手动关闭
|
||||
</div>
|
||||
<div class="btn" @click="changeOpen(4)" :class="openIndex == 4 ? 'blue' : 'green'">
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />停止
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-main border-right">
|
||||
<span>室内1#平均温度达到</span>
|
||||
<input @blur="blurChangeCount('21532', $event)" v-model="inputData['21532']"
|
||||
@input="changeCountData('21532', $event)" type="text" value="60" placeholder="60" />
|
||||
<span>℃启动</span>
|
||||
</div>
|
||||
<div class="input-main border-right">
|
||||
<span>滞回带</span>
|
||||
<input @blur="blurChange10('21533', $event)" v-model="inputData['21533']"
|
||||
@input="changeCount10('21533', $event)" type="text" value="60" placeholder="60" />
|
||||
<span>℃</span>
|
||||
</div>
|
||||
<div class="input-main border-right">
|
||||
<span>分</span>
|
||||
<input @blur="blurChange('21534', $event)" v-model="inputData['21534']" @input="change('21534', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>步打开</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>分步打开间隔时间</span>
|
||||
<input @blur="blurChange('21537', $event)" v-model="inputData['21537']" @input="change('21537', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>分</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="flex-sel border-right" @click="changeOpenTrue(0)">
|
||||
<div v-if="openTrue[0] == 0" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
计算的最大开度
|
||||
</div>
|
||||
<div class="flex-sel border-right" @click="changeOpenTrue(1)">
|
||||
<div v-if="openTrue[1] == 0" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
大风保护有效
|
||||
</div>
|
||||
<div class="flex-sel border-right" @click="changeOpenTrue(2)">
|
||||
<div v-if="openTrue[2] == 0" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
下雨保护
|
||||
</div>
|
||||
<div class="flex-sel border-right" @click="changeOpenTrue(3)">
|
||||
<div v-if="openTrue[3] == 0" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
有雨量桶检测
|
||||
</div>
|
||||
<div class="input-main border-right">
|
||||
<span>最大开度</span>
|
||||
<span>{{ statusNum }}</span>
|
||||
<span>%</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>开度系数</span>
|
||||
<input @blur="blurChange('21536', $event)" v-model="inputData['21536']" @input="change('21536', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-main">
|
||||
<div>上风口的行程时间</div>
|
||||
<input @blur="blurChange('21538', $event)" v-model="inputData['21538']" @input="change('21538', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>秒</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>打开的通道</div>
|
||||
<input @blur="blurChange('21539', $event)" v-model="inputData['21539']" @input="change('21539', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>关闭的通道</div>
|
||||
<input @blur="blurChange('21540', $event)" v-model="inputData['21540']" @input="change('21540', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view border-none">
|
||||
<div class="input-main border-right">
|
||||
<span>上风口风速大于多少</span>
|
||||
<input @blur="blurChange10('21562', $event)"
|
||||
v-model="inputData['21562']"
|
||||
@input="changeCount10('21562', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>m/s,禁止开窗</span>
|
||||
</div>
|
||||
<div class="input-main border-right">
|
||||
<span>大风保护时间</span>
|
||||
<input @blur="blurChange('21563', $event)" v-model="inputData['21563']" @input="change('21563', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>分</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>下雨检测时间</span>
|
||||
<input @blur="blurChange('21564', $event)" v-model="inputData['21564']" @input="change('21564', $event)"
|
||||
type="text" value="60" placeholder="60" />
|
||||
<span>分</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="waterPump wufang">
|
||||
<div class="table-title">
|
||||
<img src="../../assets/img/uptake.png" alt="" /> 上风口
|
||||
</div>
|
||||
<div class="title-tips">上风口有效性设置</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-btn">
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(1)"
|
||||
:class="openIndex == 1 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet2.png" alt="" />自动运行
|
||||
</div>
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(2)"
|
||||
:class="openIndex == 2 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet3.png" alt="" />手动打开
|
||||
</div>
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(3)"
|
||||
:class="openIndex == 3 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />手动关闭
|
||||
</div>
|
||||
<div
|
||||
class="btn"
|
||||
@click="changeOpen(4)"
|
||||
:class="openIndex == 4 ? 'blue' : 'green'"
|
||||
>
|
||||
<img src="../../assets/image/irrigateSet1.png" alt="" />停止
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-main border-right">
|
||||
<span>室内1#平均温度达到</span>
|
||||
<input
|
||||
@blur="blurChangeCount('21532', $event)"
|
||||
v-model="inputData['21532']"
|
||||
@input="changeCountData('21532', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>℃启动</span>
|
||||
</div>
|
||||
<div class="input-main border-right">
|
||||
<span>滞回带</span>
|
||||
<input
|
||||
@blur="blurChange10('21533', $event)"
|
||||
v-model="inputData['21533']"
|
||||
@input="changeCount10('21533', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>℃</span>
|
||||
</div>
|
||||
<div class="input-main border-right">
|
||||
<span>分</span>
|
||||
<input
|
||||
@blur="blurChange('21534', $event)"
|
||||
v-model="inputData['21534']"
|
||||
@input="change('21534', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>步打开</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>分步打开间隔时间</span>
|
||||
<input
|
||||
@blur="blurChange('21537', $event)"
|
||||
v-model="inputData['21537']"
|
||||
@input="change('21537', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>分</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="flex-sel border-right" @click="changeOpenTrue(0)">
|
||||
<div v-if="openTrue[0] == 0" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
计算的最大开度
|
||||
</div>
|
||||
<div class="flex-sel border-right" @click="changeOpenTrue(1)">
|
||||
<div v-if="openTrue[1] == 0" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
大风保护有效
|
||||
</div>
|
||||
<div class="flex-sel border-right" @click="changeOpenTrue(2)">
|
||||
<div v-if="openTrue[2] == 0" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
下雨保护
|
||||
</div>
|
||||
<div class="flex-sel border-right" @click="changeOpenTrue(3)">
|
||||
<div v-if="openTrue[3] == 0" class="no-sel"></div>
|
||||
<div v-else class="sel"></div>
|
||||
有雨量桶检测
|
||||
</div>
|
||||
<div class="input-main border-right">
|
||||
<span>最大开度</span>
|
||||
<span>{{ statusNum }}</span>
|
||||
<span>%</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>开度系数</span>
|
||||
<input
|
||||
@blur="blurChange('21536', $event)"
|
||||
v-model="inputData['21536']"
|
||||
@input="change('21536', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view">
|
||||
<div class="input-main">
|
||||
<div>上风口的行程时间</div>
|
||||
<input
|
||||
@blur="blurChange('21538', $event)"
|
||||
v-model="inputData['21538']"
|
||||
@input="change('21538', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>秒</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>打开的通道</div>
|
||||
<input
|
||||
@blur="blurChange('21539', $event)"
|
||||
v-model="inputData['21539']"
|
||||
@input="change('21539', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<div>关闭的通道</div>
|
||||
<input
|
||||
@blur="blurChange('21540', $event)"
|
||||
v-model="inputData['21540']"
|
||||
@input="change('21540', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-view border-none">
|
||||
<div class="input-main border-right">
|
||||
<span>上风口风速大于多少</span>
|
||||
<input
|
||||
@blur="blurChange10('21562', $event)"
|
||||
v-model="inputData['21562']"
|
||||
@input="changeCount10('21562', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>m/s,禁止开窗</span>
|
||||
</div>
|
||||
<div class="input-main border-right">
|
||||
<span>大风保护时间</span>
|
||||
<input
|
||||
@blur="blurChange('21563', $event)"
|
||||
v-model="inputData['21563']"
|
||||
@input="change('21563', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>分</span>
|
||||
</div>
|
||||
<div class="input-main">
|
||||
<span>下雨检测时间</span>
|
||||
<input
|
||||
@blur="blurChange('21564', $event)"
|
||||
v-model="inputData['21564']"
|
||||
@input="change('21564', $event)"
|
||||
type="text"
|
||||
value="60"
|
||||
placeholder="60"
|
||||
/>
|
||||
<span>分</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
openIndex: 1,
|
||||
inputData: {},
|
||||
openTrue: [],
|
||||
statusNum:0,
|
||||
statusInterval:null,
|
||||
data() {
|
||||
return {
|
||||
openIndex: 1,
|
||||
inputData: {},
|
||||
openTrue: [],
|
||||
statusNum: 0,
|
||||
statusInterval: null,
|
||||
};
|
||||
},
|
||||
//如果接口还未调通 跳转到页面后 监听到数据变化就触发数据读取
|
||||
watch: {
|
||||
"$store.state.ControlData"(newVal) {
|
||||
this.dataInit();
|
||||
},
|
||||
},
|
||||
// 当前页面关闭前将数据存入vuex
|
||||
beforeDestroy() {
|
||||
var store = this.$store.state;
|
||||
this.inputData["21530"] = this.openIndex;
|
||||
var num = this.myReverse(this.openTrue).join("");
|
||||
this.inputData["21531"] = parseInt(num, 2);
|
||||
store.ControlData = this.inputData;
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearInterval(this.statusInterval) && this.statusInterval;
|
||||
},
|
||||
mounted() {
|
||||
var store = this.$store.state;
|
||||
// this.dataInit();
|
||||
if (store.ControlData) {
|
||||
this.dataInit();
|
||||
}
|
||||
//input获取焦点后全选
|
||||
let inputList = document.querySelectorAll("input");
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
inputList[index].onfocus = this.selectValue; //input放入焦点，全选文本
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//反转数组 不影响原数组
|
||||
myReverse(arr) {
|
||||
return [...arr].reverse();
|
||||
},
|
||||
changeOpenTrue(index) {
|
||||
if (this.openTrue[index] == 0) {
|
||||
this.openTrue[index] = 1;
|
||||
} else {
|
||||
this.openTrue[index] = 0;
|
||||
}
|
||||
this.$forceUpdate();
|
||||
var num = this.myReverse(this.openTrue).join("");
|
||||
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn("21531", dataNum);
|
||||
},
|
||||
get21531() {
|
||||
var num1 = this.inputData["21531"];
|
||||
var num11 = this.padString(num1.toString(2), 4);
|
||||
var openList1New;
|
||||
openList1New = num11.split("");
|
||||
this.openTrue = openList1New.reverse();
|
||||
},
|
||||
padString(str, length) {
|
||||
return str.padStart(length, "0");
|
||||
},
|
||||
changeOpen(index) {
|
||||
this.openIndex = index;
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openIndex,
|
||||
},
|
||||
};
|
||||
this.changeBtn(21530, dataNum);
|
||||
},
|
||||
//失去焦点 计算公式 x/10
|
||||
blurChange10(code, el) {
|
||||
var store = this.$store.state;
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value * 10,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
},
|
||||
//反向计算 计算公式 x/10
|
||||
changeCount10(code, el) {
|
||||
var data = el.target.value * 10;
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data,
|
||||
},
|
||||
};
|
||||
this.change(code, sendData);
|
||||
},
|
||||
//失去焦点
|
||||
blurChangeCount(code, el) {
|
||||
var store = this.$store.state;
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value * 10 + 400,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
},
|
||||
changeCountData(code, el) {
|
||||
var data = el.target.value * 10 + 400;
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data,
|
||||
},
|
||||
};
|
||||
this.change(code, sendData);
|
||||
},
|
||||
countData(data) {
|
||||
if (data) {
|
||||
return (data - 400) / 10;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
// 计算展示值 计算公式 x/10
|
||||
countData10(data) {
|
||||
if (data) {
|
||||
return data / 10;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state;
|
||||
this.inputData = store.ControlData;
|
||||
this.openIndex = this.inputData["21530"];
|
||||
this.get21531();
|
||||
// this.inputData['21532'] = this.countData(this.inputData['21532'])
|
||||
// this.inputData['21533'] = this.countData10(this.inputData['21533'])
|
||||
// this.inputData['21562'] = this.countData10(this.inputData['21562'])
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
};
|
||||
// this.api.readControl_fiveControl(data).then(res => {
|
||||
// if(res.data.code==200){
|
||||
// this.inputData = res.data.data
|
||||
|
||||
// }
|
||||
|
||||
// })
|
||||
this.getStatus(data);
|
||||
clearInterval(this.statusInterval) && this.statusInterval;
|
||||
this.statusInterval = setInterval(() => {
|
||||
this.getStatus(data);
|
||||
}, 3000);
|
||||
},
|
||||
getStatus(data) {
|
||||
this.api.getControlGetState(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.statusNum = res.data.data["1015"];
|
||||
}
|
||||
});
|
||||
},
|
||||
beforeDestroy(){
|
||||
clearInterval(this.statusInterval)&&this.statusInterval
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit();
|
||||
//input获取焦点后全选
|
||||
let inputList = document.querySelectorAll('input');
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
inputList[index].onfocus = this.selectValue;//input放入焦点，全选文本
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//反转数组 不影响原数组
|
||||
myReverse(arr) {
|
||||
return [...arr].reverse()
|
||||
},
|
||||
changeOpenTrue(index) {
|
||||
if (this.openTrue[index] == 0) {
|
||||
this.openTrue[index] = 1
|
||||
} else {
|
||||
this.openTrue[index] = 0
|
||||
}
|
||||
this.$forceUpdate();
|
||||
var num = this.myReverse(this.openTrue).join("")
|
||||
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: parseInt(num, 2),
|
||||
},
|
||||
};
|
||||
this.changeBtn('21531', dataNum);
|
||||
},
|
||||
get21531() {
|
||||
var num1 = this.inputData['21531']
|
||||
var num11 = this.padString(num1.toString(2), 4)
|
||||
var openList1New
|
||||
openList1New = num11.split("")
|
||||
this.openTrue = openList1New.reverse()
|
||||
},
|
||||
padString(str, length) {
|
||||
return str.padStart(length, '0');
|
||||
},
|
||||
changeOpen(index) {
|
||||
this.openIndex = index
|
||||
var dataNum = {
|
||||
target: {
|
||||
value: this.openIndex,
|
||||
},
|
||||
};
|
||||
this.changeBtn(21530, dataNum);
|
||||
},
|
||||
//失去焦点 计算公式 x/10
|
||||
blurChange10(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value * 10,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
|
||||
},
|
||||
//反向计算 计算公式 x/10
|
||||
changeCount10(code, el) {
|
||||
var data = el.target.value * 10
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data
|
||||
}
|
||||
}
|
||||
this.change(code, sendData)
|
||||
},
|
||||
//失去焦点
|
||||
blurChangeCount(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: (el.target.value * 10) + 400,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
|
||||
},
|
||||
changeCountData(code, el) {
|
||||
var data = (el.target.value * 10) + 400
|
||||
var sendData = {
|
||||
target: {
|
||||
value: data
|
||||
}
|
||||
}
|
||||
this.change(code, sendData)
|
||||
},
|
||||
countData(data) {
|
||||
if (data) {
|
||||
return (data - 400) / 10
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
// 计算展示值 计算公式 x/10
|
||||
countData10(data) {
|
||||
if (data) {
|
||||
return data / 10
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
|
||||
};
|
||||
this.api.readControl_fiveControl(data).then(res => {
|
||||
if(res.data.code==200){
|
||||
this.inputData = res.data.data
|
||||
this.openIndex = this.inputData['21530']
|
||||
this.get21531()
|
||||
this.inputData['21532'] = this.countData(this.inputData['21532'])
|
||||
this.inputData['21533'] = this.countData10(this.inputData['21533'])
|
||||
this.inputData['21562'] = this.countData10(this.inputData['21562'])
|
||||
}
|
||||
|
||||
})
|
||||
this.getStatus(data)
|
||||
clearInterval(this.statusInterval)&&this.statusInterval
|
||||
this.statusInterval=setInterval(() => {
|
||||
this.getStatus(data)
|
||||
}, 3000);
|
||||
},
|
||||
getStatus(data){
|
||||
this.api.getControlGetState(data).then(res=>{
|
||||
if(res.data.code==200){
|
||||
this.statusNum=res.data.data['1015']
|
||||
}
|
||||
})
|
||||
},
|
||||
//全选文本
|
||||
//全选文本
|
||||
selectValue(e) {
|
||||
var store = this.$store.state
|
||||
store.nowInput=e.target.value
|
||||
e.currentTarget.select();
|
||||
var store = this.$store.state;
|
||||
store.nowInput = e.target.value;
|
||||
e.currentTarget.select();
|
||||
},
|
||||
//失去焦点
|
||||
blurChange(code, el) {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
//失去焦点
|
||||
blurChange(code, el) {
|
||||
var store = this.$store.state;
|
||||
var data = {
|
||||
equipmentId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
regAddress: code,
|
||||
num: el.target.value,
|
||||
}; //避免开启多个计时器
|
||||
if (this.timer) {
|
||||
this.timer && clearInterval(this.timer);
|
||||
this.changeData(data);
|
||||
}
|
||||
},
|
||||
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);
|
||||
|
||||
},
|
||||
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);
|
||||
},
|
||||
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) {
|
||||
var store = this.$store.state
|
||||
this.api.postControlWrite(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: res.data.msg,
|
||||
type: "success",
|
||||
});
|
||||
store.nowInput=''
|
||||
// this.dataInit();
|
||||
} else {
|
||||
this.inputData[data.regAddress]=store.nowInput
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
this.timer = null
|
||||
this.timer = setInterval(() => {
|
||||
++i;
|
||||
if (i == j) {
|
||||
that.changeData(data);
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
}, 100);
|
||||
},
|
||||
changeData(data) {
|
||||
var store = this.$store.state;
|
||||
this.api.postControlWrite(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.$message({
|
||||
message: res.data.msg,
|
||||
type: "success",
|
||||
});
|
||||
},
|
||||
},
|
||||
store.nowInput = "";
|
||||
// this.dataInit();
|
||||
} else {
|
||||
this.inputData[data.regAddress] = store.nowInput;
|
||||
|
||||
}
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
this.timer = null;
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss"></style>
|
||||
|
||||
|
|
@ -65,8 +65,24 @@ export default {
|
|||
inputData: {},
|
||||
}
|
||||
},
|
||||
//如果接口还未调通 跳转到页面后 监听到数据变化就触发数据读取
|
||||
watch: {
|
||||
"$store.state.ControlData"(newVal) {
|
||||
this.dataInit();
|
||||
},
|
||||
},
|
||||
// 当前页面关闭前将数据存入vuex
|
||||
beforeDestroy() {
|
||||
var store = this.$store.state;
|
||||
this.inputData['21520']= this.openIndex
|
||||
store.ControlData = this.inputData;
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit();
|
||||
var store = this.$store.state;
|
||||
// this.dataInit();
|
||||
if(store.ControlData){
|
||||
this.dataInit();
|
||||
}
|
||||
//input获取焦点后全选
|
||||
let inputList = document.querySelectorAll('input');
|
||||
for (let index = 0; index < inputList.length; index++) {
|
||||
|
|
@ -150,22 +166,22 @@ export default {
|
|||
},
|
||||
dataInit() {
|
||||
var store = this.$store.state
|
||||
var data = {
|
||||
deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
|
||||
};
|
||||
this.api.readControl_fiveControl(data).then(res => {
|
||||
if(res.data.code==200){
|
||||
this.inputData = res.data.data
|
||||
this.inputData = store.ControlData
|
||||
this.openIndex = this.inputData['21520']
|
||||
this.inputData['21521'] = this.countData(this.inputData['21521'])
|
||||
this.inputData['21522'] = this.countData10(this.inputData['21522'])
|
||||
this.inputData['21523'] = this.countData(this.inputData['21523'])
|
||||
this.inputData['21524'] = this.countData(this.inputData['21524'])
|
||||
}
|
||||
// this.inputData['21521'] = this.countData(this.inputData['21521'])
|
||||
// this.inputData['21522'] = this.countData10(this.inputData['21522'])
|
||||
// this.inputData['21523'] = this.countData(this.inputData['21523'])
|
||||
// this.inputData['21524'] = this.countData(this.inputData['21524'])
|
||||
// var data = {
|
||||
// deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
|
||||
// };
|
||||
// this.api.readControl_fiveControl(data).then(res => {
|
||||
// if(res.data.code==200){
|
||||
|
||||
// }
|
||||
|
||||
|
||||
})
|
||||
// })
|
||||
},
|
||||
//全选文本
|
||||
selectValue(e) {
|
||||
|
|
|
|||
Loading…
Reference in New Issue