智能化衣柜接口对接，除湿、杀菌下发命令接口报错

src/views/index.vue

@@ -5,44 +5,146 @@
       <div class="div-ul">
         <div class="div-li">
           <div>
-            <span>温度：</span>22.2℃
+            <span>温度：</span>{{ deviceInfo.temperature }}℃
           </div>
-          <div> <span>湿度：</span>50%
+          <div> <span>湿度：</span>{{ deviceInfo.humidity }}%
           </div>
         </div>
         <!--   ON：开启 OFF：关闭 -->
         <div class="div-li">
           <div>
             <span>除湿：</span>
-            <el-switch v-model="value2" active-color="#13ce66" inactive-color="#ff4949">
+            <el-switch active-value="1" inactive-value="0" v-model="deviceInfo.dehumidification" active-color="#13ce66"
+              inactive-color="#ff4949" @change="handleDehumidification">
             </el-switch>
           </div>
           <div>
             <span>杀菌：</span>
-            <el-switch v-model="value2" active-color="#13ce66" inactive-color="#ff4949">
+            <el-switch active-value="1" inactive-value="0" v-model="deviceInfo.light" active-color="#13ce66"
+              inactive-color="#ff4949" @change="handleLight">
             </el-switch>
           </div>
         </div>
       </div>
-      <div class="div-tips"><span>标签序列号：</span>AE0B01 </div>
+      <div class="div-tips"><span>标签序列号：</span>{{ deviceInfo.serialNumber }} </div>
     </div>
 
   </div>
 </template>
 
 <script>
+import { queryProjectInfoByKey, deviceList, attributes, sendAttribute, sendCommand } from "@/api/school";
 export default {
   name: "Index",
   data() {
     return {
+      deviceId: "", // 设备id 
+      deviceInfo: {
+        temperature: 0, // 温度
+        threshold: 0, // 阈值
+      },
+      open: false,
       value2: false,
+      loading: false,
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        threshold: [
+          { required: true, message: "阈值不能为空", trigger: "blur" }
+        ],
+      },
       // 版本号
       version: "3.8.9",
     };
   },
+  created() {
+    this.getqueryProjectInfoByKey() // 根据项目key查找项目id
+  },
   methods: {
-    goTarget(href) {
-      window.open(href, "_blank");
+    // 除湿开关
+    handleDehumidification() {
+      sendCommand({
+        "commandId": "447173913707264", // 除湿,
+        "commandParams": this.deviceInfo.dehumidification, // 0 关闭 1 开启,
+        "deviceId":  this.deviceId
+      }).then(res => {
+        this.getDeviceList(res.data.id) // 根据项目id查找设备列表
+      });
+    },
+    // 杀菌灯开关
+    handleLight(){
+      sendCommand({
+        "commandId": "447173913707264", // 除湿,
+        "commandParams": this.deviceInfo.dehumidification, // 0 关闭 1 开启,
+        "deviceId":  this.deviceId
+      }).then(res => {
+        this.getDeviceList(res.data.id) // 根据项目id查找设备列表
+      });
+    },
+    // 阈值设定弹窗
+    handleSettings() {
+      this.open = true;
+      this.form = {
+        threshold: this.deviceInfo.threshold,
+      };
+      // this.$message.success('');
+    },
+
+    // 根据项目key查找项目id
+    getqueryProjectInfoByKey() {
+      this.loading = true;
+      queryProjectInfoByKey({
+        projectKey: "qKStHKKt"
+      }).then(res => {
+        this.getDeviceList(res.data.id) // 根据项目id查找设备列表
+      });
+    },
+    // 根据项目id查找设备列表
+    getDeviceList(_id) {
+      deviceList({
+        projectId: _id
+      }).then(res => {
+        const w2Device = res.rows.find(device => device.deviceName === "W1");
+        this.deviceId = w2Device.id;
+        this.getAttributes(this.deviceId); // 根据设备id查找设备信息
+      })
+    },
+    // 根据设备id查找设备信息
+    getAttributes(_id) {
+      attributes({
+        deviceId: _id,
+      }).then(({ data: { deviceAttributeRecordList: records } }) => {
+        this.loading = false;
+        // 过滤出指定id的数据
+        const findAttr = (id, defaultValue = '-') =>
+          records.find(row => row.id === id)?.attributeValue || defaultValue;
+        // 赋值
+        this.deviceInfo = {
+          temperature: findAttr(447173909669888), // 温度
+          humidity: findAttr(447173911846400),    // 湿度
+          serialNumber: findAttr(447173913707263), // 序列号
+          light: findAttr(447173913707265, '0'),  // 杀菌灯(默认关闭)
+          dehumidification: findAttr(447173913707264, '0'), // 除湿(默认关闭)
+        };
+      });
+    },
+    /** 下发属性 */
+    submitForm: function () {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          let param = { "Wen": `#${this.form.threshold}` } // 阈值
+          sendAttribute({
+            "attributeParams": JSON.stringify(param), // 阈值JSON字符串
+            "deviceId": this.deviceId // 设备id
+          }).then(response => {
+            this.getAttributes(this.deviceId); // 根据设备id查找设备信息
+            this.$modal.msgSuccess("操作成功");
+            this.open = false;
+
+          });
+        }
+      });
     },
   },
 };
@@ -50,6 +152,7 @@ export default {
 
 <style scoped lang="scss">
 .div-box {
+  transform: scale(1.4);
   width: 500px;
   box-sizing: border-box;
   padding: 16px;
@@ -77,15 +180,18 @@ export default {
     display: flex;
     justify-content: space-between;
     margin-bottom: 12px;
+
     div {
       flex: 1
     }
+
     span {
       color: #666;
     }
   }
 }
-.div-tips{
+
+.div-tips {
   span {
     color: #666;
   }