智能居家接口对接，阈值回显有问题

src/views/index.vue

@@ -5,32 +5,38 @@
       <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>CO：</span>5PPM
+            <span>CO：</span>{{ deviceInfo.co || '-' }}PPM
           </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.warning" active-color="#13ce66"
+              inactive-color="#ff4949">
             </el-switch>
           </div>
         </div>
       </div>
-      <div class="div-tips"><span>阈值设定：</span>30 <i class="el-icon-edit"
+      <div class="div-tips"><span>阈值设定：</span>{{ getThreshold() }} <i class="el-icon-edit"
           style="color: rgb(64, 158, 255);margin-left: 4px;cursor: pointer;" @click="handleSettings"></i></div>
     </div>
     <!-- 添加或修改公告对话框 -->
     <el-dialog title="阈值设定" :visible.sync="open" width="780px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-
+        <el-form-item label="温度" prop="temperature">
-        <el-form-item label="阈值" prop="noticeTitle">
+          <el-input v-model="form.temperature" placeholder="请输入温度" />
-          <el-input v-model="form.noticeTitle" placeholder="请输入阈值" />
+        </el-form-item>
+        <el-form-item label="湿度" prop="humidity">
+          <el-input v-model="form.humidity" placeholder="请输入湿度" />
+        </el-form-item>
+        <el-form-item label="CO" prop="co">
+          <el-input v-model="form.co" placeholder="请输入CO" />
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -42,46 +48,126 @@
 </template>
 
 <script>
-import {  updateNotice } from "@/api/system/notice";
+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: {
-        noticeTitle: [
+        temperature: [
-          { required: true, message: "公告标题不能为空", trigger: "blur" }
+          { required: true, message: "温度不能为空", trigger: "blur" }
+        ],
+        humidity: [
+          { required: true, message: "湿度不能为空", trigger: "blur" }
+        ],
+        co: [
+          { required: true, message: "CO不能为空", trigger: "blur" }
         ],
-        noticeType: [
-          { required: true, message: "公告类型不能为空", trigger: "change" }
-        ]
       },
       // 版本号
       version: "3.8.9",
     };
   },
+  created() {
+    this.getqueryProjectInfoByKey() // 根据项目key查找项目id
+  },
   methods: {
     // 阈值设定弹窗
     handleSettings() {
       this.open = true;
       this.form = {
-        noticeTitle: "30",
+        temperature: this.deviceInfo.temperature1, // 温度
+        humidity: this.deviceInfo.humidity1, // 湿度
+        co: this.deviceInfo.co1, // CO
       };
       // this.$message.success('');
     },
-    /** 提交按钮 */
+
-    submitForm: function() {
+    // 根据项目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 === "S1");
+        this.deviceId = w2Device.id;
+        this.getAttributes(this.deviceId); // 根据设备id查找设备信息
+      })
+    },
+
+    // 根据设备id查找设备信息
+    getAttributes(_id) {
+      attributes({
+        deviceId: _id,
+      }).then(res => {
+        this.loading = false;
+        // 获取温度和阈值信息，并赋值给deviceInfo
+        let deviceAttributesList = res.data.deviceAttributesList
+        // 温度、温度阈值
+        let temperature = deviceAttributesList.find(row => row.id === 447247444691968)?.attributeValue;
+        let temperature1 = deviceAttributesList.find(row => row.id === 447247458859777)?.attributeValue;
+        // 湿度、湿度阈值
+        let humidity = deviceAttributesList.find(row => row.id === 447247449387520)?.attributeValue;
+        let humidity1 = deviceAttributesList.find(row => row.id === 447247458859778)?.attributeValue;
+        // CO、CO阈值
+        let co = deviceAttributesList.find(row => row.id === 447247453780224)?.attributeValue;
+        let co1 = deviceAttributesList.find(row => row.id === 447247458859779)?.attributeValue;
+
+        // 预警
+        let warning = deviceAttributesList.find(row => row.id === 447247458859776)?.attributeValue;
+
+        this.deviceInfo = {
+          temperature: temperature, // 温度
+          temperature1: temperature1, // 温度
+          humidity: humidity, // 湿度
+          humidity1: humidity1, // 湿度
+          co: co, // CO
+          co1: co1, // CO
+          warning: warning || 0, // 预警
+        }
+
+      });
+    },
+    getThreshold() {
+      return `温度：${this.deviceInfo.temperature1 || '-'}℃ 湿度：${this.deviceInfo.humidity1 || '-'}% CO：${this.deviceInfo.co1 || '-'}PPM`;
+    },
+    /** 下发属性 */
+    submitForm: function () {
       this.$refs["form"].validate(valid => {
         if (valid) {
-          updateNotice(this.form).then(response => {
+          let attributeParams = {
-              this.$modal.msgSuccess("操作成功");
+            temperature: this.form.temperature, // 温度
-              this.open = false;
+            humidity: this.form.humidity, // 湿度
-              this.getList();
+            co: this.form.co, // CO
-            });
+          }
+          sendAttribute({
+            "attributeParams": JSON.stringify(attributeParams), // 阈值JSON字符串
+            "deviceId": this.deviceId // 设备id
+          }).then(response => {
+            this.getAttributes(this.deviceId); // 根据设备id查找设备信息
+            this.$modal.msgSuccess("操作成功");
+            this.open = false;
+
+          });
         }
       });
     },
@@ -91,6 +177,7 @@ export default {
 
 <style scoped lang="scss">
 .div-box {
+  transform: scale(1.4);
   width: 500px;
   box-sizing: border-box;
   padding: 16px;