src/api/index.js

@@ -400,6 +400,11 @@ geteqetdata(data) {
     readskylight(data) {
       return sendGetRequest(`/readControl/readskylight`, data)
     },
+    //空调
+    airconditioner(data) {
+      return sendGetRequest(`/readControl/airconditioner`, data)
+    },
+    
   //固有参数
   intrinsicParameter(data) {
     return sendGetRequest(`/readControl/intrinsicParameter`, data)

src/components/setParamsControl.vue

@@ -245,6 +245,12 @@ if (el.child.length) {
               id: el.id, sort: el.sort,
               name: el.nickName, list: newList, router: "circulationCan",
             });
+          } else if (el.id == 28) {
+            this.routerList.push({
+              id: el.id, sort: el.sort,
+              name: el.nickName, list: [], router: "air-conditioning",
+              isRouter: true,
+            });
           }else if (el.id == 20) {
             
             this.routerList.push({

src/router/index.js

@@ -215,6 +215,10 @@ const routes = [
         path: '/wetFan',
         name: 'wetFan',
         component: () => import('../views/page/wetFan.vue')
+      },{
+        path: '/air-conditioning',
+        name: 'air-conditioning',
+        component: () => import('../views/page/air-conditioning.vue')
       },{
         path: '/LED',
         name: 'LED',

src/views/page/air-conditioning.vue

@@ -0,0 +1,530 @@
+<template>
+  <div class="wetFan">
+    <div class="table-title">
+      <img src="../../assets/img/geothermalFan.png" alt="" />{{ pageName }}
+    </div>
+    <div class="title-tips">
+      工作方式选择
+      <div class="input-btn">
+        <div
+          class="btn btn-tips"
+          @click="changeOpen(0)"
+          :class="inputData[22040] == 0 ? 'blue' : 'green'"
+        >
+          {{ inputData[22040] == 0 ? "无效" : "有效" }}
+        </div>
+      </div>
+    </div>
+    <div class="flex-view">
+      <div class="input-btn">
+        <div
+          class="btn"
+          @click="changeOpen(1)"
+          :class="inputData[22040] == 1 ? 'blue' : 'green'"
+        >
+          <img src="../../assets/image/irrigateSet2.png" alt="" />自动运行
+        </div>
+        <div
+          class="btn"
+          @click="changeOpen(2)"
+          :class="inputData[22040] == 2 ? 'blue' : 'green'"
+        >
+          <img src="../../assets/image/irrigateSet3.png" alt="" />手动打开
+        </div>
+        <div
+          class="btn"
+          @click="changeOpen(3)"
+          :class="inputData[22040] == 3 ? 'blue' : 'green'"
+        >
+          <img src="../../assets/image/irrigateSet1.png" alt="" />手动关闭
+        </div>
+      </div>
+    </div>
+    <div class="title-tips-bold">手动开启设置</div>
+    <div class="flex-view padding-none border-none shrink-none">
+      <div class="input-main-80">
+        <span>1.手动开启时空调设置的温度追踪目标温度</span>
+      </div>
+    </div>
+    <div class="flex-view padding-none border-none shrink-none">
+      <div class="input-sel input-sel-w180">
+        <span>2.空调设置风速</span>
+        <el-dropdown @command="handleCommand1($event, 22041)">
+          <div class="el-dropdown-link">
+            <input
+              v-model="inputDataNew[22041]"
+              type="text"
+              class="input-input"
+              placeholder="无"
+            />
+            <div class="arrow">
+              <img src="../../assets/image/arrow.png" alt="" />
+            </div>
+          </div>
+          <el-dropdown-menu class="input-menu-180" slot="dropdown">
+            <el-dropdown-item
+              v-for="(item, index) in typeList1"
+              :key="index"
+              :command="item.value"
+              >{{ item.label }}</el-dropdown-item
+            >
+          </el-dropdown-menu>
+        </el-dropdown>
+        <span>(0是空调自动调整风速)。 </span>
+      </div>
+    </div>
+    <div class="flex-view padding-none shrink-none">
+      <div class="input-sel input-sel-w180">
+        <span>3.空调设置冷暖模式</span>
+        <el-dropdown @command="handleCommand1($event, 22042)">
+          <div class="el-dropdown-link">
+            <input
+              v-model="inputDataNew[22042]"
+              type="text"
+              class="input-input"
+              placeholder="无"
+            />
+            <div class="arrow">
+              <img src="../../assets/image/arrow.png" alt="" />
+            </div>
+          </div>
+          <el-dropdown-menu class="input-menu-180" slot="dropdown">
+            <el-dropdown-item
+              v-for="(item, index) in typeList2"
+              :key="index"
+              :command="item.value"
+              >{{ item.label }}</el-dropdown-item
+            >
+          </el-dropdown-menu>
+        </el-dropdown>
+      </div>
+    </div>
+    <div class="title-tips-bold">自动设置</div>
+    <div class="flex-view padding-none border-none shrink-none">
+      <div class="input-main-80">
+        <span>目标值控制精度</span>
+        <input
+          @blur="blurChange10(22043, $event)"
+          v-model="inputData[22043]"
+          @input="changeCount10(22043, $event)"
+          type="text"
+          placeholder="0"
+        />
+        <span>PID采样时间 </span>
+        <input
+          @blur="blurChange(22049, $event)"
+          v-model="inputData[22049]"
+          @input="change(22049, $event)"
+          type="text"
+          placeholder="0"
+        />
+      </div>
+    </div>
+    <div class="flex-view padding-none border-none shrink-none">
+      <div class="input-main-80">
+        <span>空调制冷 加暖模式切换时间</span>
+        <input
+          @blur="blurChange(22044, $event)"
+          v-model="inputData[22044]"
+          @input="change(22044, $event)"
+          type="text"
+          placeholder="0"
+        />
+        <span>分钟 </span>
+        <span>比例系数(P)</span>
+        <input
+          @blur="blurChange(22050, $event)"
+          v-model="inputData[22050]"
+          @input="change(22050, $event)"
+          type="text"
+          placeholder="0"
+        />
+      </div>
+    </div>
+    <div class="flex-view padding-none border-none shrink-none">
+        <div class="input-sel input-sel-w180">
+        <span>空调设置风速</span>
+        <el-dropdown @command="handleCommand1($event, 22045)">
+          <div class="el-dropdown-link">
+            <input
+              v-model="inputDataNew[22045]"
+              type="text"
+              class="input-input"
+              placeholder="无"
+            />
+            <div class="arrow">
+              <img src="../../assets/image/arrow.png" alt="" />
+            </div>
+          </div>
+          <el-dropdown-menu class="input-menu-180" slot="dropdown">
+            <el-dropdown-item
+              v-for="(item, index) in typeList1"
+              :key="index"
+              :command="item.value"
+              >{{ item.label }}</el-dropdown-item
+            >
+          </el-dropdown-menu>
+        </el-dropdown>
+        <span>(0是空调自动调整风速)。 </span>
+      </div>
+      <div class="input-main-80">
+        <span>积分系数(I)</span>
+        <input
+          @blur="blurChange(22051, $event)"
+          v-model="inputData[22051]"
+          @input="change(22051, $event)"
+          type="text"
+          placeholder="0"
+        />
+      </div>
+    </div>
+    <div class="flex-view padding-none border-none shrink-none">
+      <div class="input-main-80">
+        <span>空调调整间隔时间</span>
+        <input
+          @blur="blurChange(22046, $event)"
+          v-model="inputData[22046]"
+          @input="change(22046, $event)"
+          type="text"
+          placeholder="0"
+        />
+        <span>微分系数(D) </span>
+        <input
+          @blur="blurChange(22052, $event)"
+          v-model="inputData[22052]"
+          @input="change(22052, $event)"
+          type="text"
+          placeholder="0"
+        />
+      </div>
+    </div>
+    <div class="flex-view padding-none border-none shrink-none">
+      <div class="input-main-80">
+        <span>空调设置最高温度俏</span>
+        <input
+          @blur="blurChange10(22047, $event)"
+          v-model="inputData[22047]"
+          @input="changeCount10(22047, $event)"
+          type="text"
+          placeholder="0"
+        />
+        <span>℃ </span>
+        <span>积分限制</span>
+        <input
+          @blur="blurChange(22053, $event)"
+          v-model="inputData[22053]"
+          @input="change(22053, $event)"
+          type="text"
+          placeholder="0"
+        />
+      </div>
+    </div>
+    <div class="flex-view padding-none border-none shrink-none">
+      <div class="input-main-80">
+        <span>空调设置最低温庶值</span>
+        <input
+          @blur="blurChange(22048, $event)"
+          v-model="inputData[22048]"
+          @input="change(22048, $event)"
+          type="text"
+          placeholder="0"
+        />
+        <span>℃ </span>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      inputData: [],
+      inputDataNew:[],
+      indexs: 1,
+      loading: null,
+      pageName: "空调",
+      typeList1: [
+        { label: "自动调整风速", value: 0 },
+        { label: "1级风速", value: 1 },
+        { label: "2级风速", value: 2 },
+        { label: "3级风速", value: 3 },
+        { label: "4级风速", value: 4 },
+        { label: "5级风速", value: 5 },
+        { label: "6级风速", value: 6 },
+      ],
+      typeList2: [
+        { label: "空调自动调整", value: 0 },
+        { label: "制冷模式", value: 1 },
+        { label: "制热模式", value: 2 },
+      ],
+    };
+  },
+  watch: {
+    $route(newVal, oldVal) {
+      const that = this;
+      this.indexs = this.$route.query.id ? this.$route.query.id : 1;
+      if (this.$route.query.name) {
+        this.pageName = this.$route.query.name;
+      }
+      setTimeout(() => {
+        that.getActive1();
+      }, 0);
+    },
+    "$store.state.equipmentIndex"(newVal, oldVal) {
+      this.dataInit();
+    },
+  },
+  mounted() {
+    const that = this;
+    this.indexs = this.$route.query.id ? this.$route.query.id : 1;
+
+    setTimeout(() => {
+      that.dataInit();
+    }, 0);
+    //input获取焦点后全选
+    let inputList = document.querySelectorAll("input");
+    for (let index = 0; index < inputList.length; index++) {
+      inputList[index].onfocus = this.selectValue; //input放入焦点，全选文本
+    }
+    if (this.$route.query.name) {
+      this.pageName = this.$route.query.name;
+    }
+  },
+  methods: {
+    //失去焦点 计算公式 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 (store.nowInput != el.target.value) {
+        this.changeData(data);
+      }
+      // 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);
+    },
+    // 计算展示值 计算公式 x/10
+    countData10(data) {
+      if (data) {
+        return data / 10;
+      } else {
+        return 0;
+      }
+    },
+    // 计算展示值 计算公式 (x - 400) / 10
+    countData(data) {
+      if (data) {
+        return (data - 400) / 10;
+      } else {
+        return 0;
+      }
+    },
+    //失去焦点
+    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 (store.nowInput != el.target.value) {
+        this.changeData(data);
+      }
+      // 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);
+    },
+    //类型选择
+    handleCommand1(command, code) {
+      this.typeList1.forEach((el, index) => {
+        if (el.value == command) {
+          this.inputDataNew[code] = el.label;
+        }
+      });
+       this.inputData[code] = command;
+      var dataNum = {
+        target: {
+          value: command,
+        },
+      };
+      this.changeBtn(code, dataNum);
+    },
+    // 工作方式选择
+    changeOpen(index) {
+      this.inputData[22040] = index;
+      var dataNum = {
+        target: {
+          value: index,
+        },
+      };
+      this.changeBtn(22040, dataNum);
+    },
+    getData1(data) {
+      var name = "";
+      this.typeList1.forEach((el, index) => {
+        if (el.value == data) {
+          name = el.label;
+        }
+      });
+      return name;
+    },
+    getData2(data) {
+      var name = "";
+      this.typeList2.forEach((el, index) => {
+        if (el.value == data) {
+          name = el.label;
+        }
+      });
+      return name;
+    },
+    dataInit() {
+      this.loading = this.$loading({
+        lock: true,
+        text: "加载中",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)",
+      });
+      var store = this.$store.state;
+      var data = {
+        deviceId: store.equipmentList[store.equipmentIndex - 1].deviceId,
+      };
+      this.api.airconditioner(data).then((res) => {
+        this.loading.close();
+        if (res.data.code == 200) {
+          this.inputData = JSON.parse(JSON.stringify(res.data.data));
+          this.inputDataNew = JSON.parse(JSON.stringify(res.data.data));
+          this.inputData[22047] = this.countData10(this.inputData[22047]);
+          this.inputData[22043] = this.countData10(this.inputData[22043]);
+          this.inputData[22048] = this.countData10(this.inputData[22048]);
+          this.inputDataNew[22041] = this.getData1(this.inputData[22041]);
+          this.inputDataNew[22042] = this.getData2(this.inputData[22042]);
+          this.inputDataNew[22045] = this.getData1(this.inputData[22045]);
+        }
+      });
+    },
+    //二进制转换后的补全
+    padString(str, length) {
+      return str.padStart(length, "0");
+    },
+    //反转数组 不影响原数组
+    myReverse(arr) {
+      return [...arr].reverse();
+    },
+    //全选文本
+    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 (store.nowInput != el.target.value) {
+        this.changeData(data);
+      }
+      // 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;
+      });
+    },
+  },
+};
+</script>
+<style lang="scss"></style>
+