3D库房档案库数据显示 定时请求

src/views/storeManage/deviceManage/module/deviceDetail.vue

@@ -16,7 +16,7 @@
         <template v-slot:rightButtonGroup>
           <div class="archives-handler-btn">
             <el-button class="binding-mac-btn iconfont icon-bangdingshebei-fanbai" type="primary" :disabled="crud.selections.length !== 1 || (crud.selections[0].deviceTypeId && crud.selections[0].deviceTypeId.name !== '桌面式RFID读写器')" @click="bindingMac()">绑定设备</el-button>
-            <el-button class="binding-param-btn iconfont icon-bangdingcanshu-fanbai" type="primary" :disabled="crud.selections.length !== 1 || (crud.selections[0].deviceTypeId && (crud.selections[0].deviceTypeId.name !== '空调' && crud.selections[0].deviceTypeId.name !== '恒湿机' && crud.selections[0].deviceTypeId.name !== '漏水传感器' && crud.selections[0].deviceTypeId.name !== '温湿度感应器' && crud.selections[0].deviceTypeId.name !== '空气质量检测设备'))" @click="bindingParam(crud.selections[0].id)">绑定参数</el-button>
+            <el-button class="binding-param-btn iconfont icon-bangdingcanshu-fanbai" type="primary" :disabled="crud.selections.length !== 1 || (crud.selections[0].deviceTypeId && (crud.selections[0].deviceTypeId.name !== '漏水传感器' && crud.selections[0].deviceTypeId.name !== '温湿度感应器' && crud.selections[0].deviceTypeId.name !== '空气质量检测设备'))" @click="bindingParam(crud.selections[0].id)">绑定参数</el-button>
           </div>
         </template>
       </crudOperation>
@@ -289,14 +289,14 @@ export default {
       }
     },
     rules() {
-      const checkDeviceIp = (rule, value, callback) => {
-        const reg = /^((2[0-4]\d|25[0-5]|[01]?\d\d?)\.){3}(2[0-4]\d|25[0-5]|[01]?\d\d?)$/
-        if (reg.test(value)) {
-          callback()
-        } else {
-          callback(new Error('设备IP格式错误'))
-        }
-      }
+      // const checkDeviceIp = (rule, value, callback) => {
+      //   const reg = /^((2[0-4]\d|25[0-5]|[01]?\d\d?)\.){3}(2[0-4]\d|25[0-5]|[01]?\d\d?)$/
+      //   if (reg.test(value)) {
+      //     callback()
+      //   } else {
+      //     callback(new Error('设备IP格式错误'))
+      //   }
+      // }
       const checkDevicePort = (rule, value, callback) => {
         const reg = /^([0-9]|[1-9]\d{1,3}|[1-5]\d{4}|6[0-4]\d{4}|65[0-4]\d{2}|655[0-2]\d|6553[0-5])$/
         if (reg.test(value)) {
@@ -321,8 +321,9 @@ export default {
       }
       if (this.selectedDeviceType === '密集架' || this.selectedDeviceType === '回转柜' || this.selectedDeviceType === '摄像头' || this.isInsidedevices) {
         this.$set(validateRule, 'deviceIp', [
-          { required: true, message: '请输入接口IP', trigger: 'blur' },
-          { validator: checkDeviceIp, trigger: 'blur' }
+          { required: true, message: '请输入接口IP', trigger: 'blur' }
+          // ,
+          // { validator: checkDeviceIp, trigger: 'blur' }
         ])
         this.$set(validateRule, 'devicePort', [
           { required: true, message: '请输入端口号', trigger: 'blur' },

src/views/storeManage/warehouse3D/archivesStorage/index.vue

@@ -181,7 +181,7 @@ export default {
     }
     window.addEventListener('message', this.handleMessageDevice)
     // 定时请求第三方数据，更新页面数据
-    setInterval(async() => {
+    this.timer = setInterval(async() => {
       await _this.getRealTimeData()
       _this.handleAQI()
     }, 4000)
@@ -247,10 +247,13 @@ export default {
       }
     },
     getRealTimeData() {
+      if (this.allDeviceIds.length > 0) {
         thirdApi.getRealTimeData({ ids: this.allDeviceIds, url: this.url }).then((data) => {
           this.oaoMessage.splice(0, this.oaoMessage.length)
+          console.log(this.displayConfigData)
           this.displayConfigData.forEach(element => {
             if (element.divPosition.includes('TOP') && element.deviceSpecParams[0]) {
+              // 获取页面div显示的数据
               const result = data.find((item) => {
                 return item.property_id === element.deviceSpecParams[0].paramId && item.device_id === element.deviceInfo.deviceId
               })
@@ -261,6 +264,7 @@ export default {
                 curstatus: result.curstatus
               })
             } else {
+              // 获取3D弹窗显示的数据
               const wenduParamId = element.deviceSpecParams.find((item) => { return item.paramName === '温度' })?.paramId
               const siduParamId = element.deviceSpecParams.find((item) => { return item.paramName === '湿度' })?.paramId
               let wendu = {}
@@ -287,6 +291,7 @@ export default {
       }
     }
   }
+}
 </script>
 
 <style lang="scss" scoped>

src/views/storeManage/warehouse3DConfig/index.vue

@@ -42,7 +42,7 @@
       </el-table>
     </div>
     <!-- 绑定参数对话框 -->
-    <el-dialog title="绑定参数" :visible.sync="dialogVisible">
+    <el-dialog title="绑定参数" :visible.sync="dialogVisible" @opened="opened">
       <span class="dialog-right-top" />
       <span class="dialog-left-bottom" />
       <div class="setting-dialog">
@@ -51,7 +51,7 @@
             <!-- <input-select :options="options" @selectValue="handleSelectValue" /> -->
             <p class="form-first">{{ form.divPosition }}</p>
           </el-form-item>
-          <el-form-item label="设备绑定" prop="deviceInfo.id">
+          <el-form-item label="设备绑定" prop="deviceInfo">
             <el-select v-model="form.deviceInfo.id" placeholder="请选择" clearable filterable @change="getParamsOptionsList">
               <el-option v-for="item in devOptions" :key="item.value" :label="item.label" :value="item.value">
                 <span style="float: left">{{ item.label }}&nbsp;-&nbsp;{{ item.info }}</span>
@@ -87,6 +87,14 @@ import { getParams } from '@/api/storeManage/deviceManage/param'
 import { getRooms } from '@/api/storeManage/deviceManage/storeroom'
 export default {
   data() {
+    // 对应字典必填判断
+    var checkDeviceInfo = (rule, value, callback) => {
+      if (!this.form.deviceInfo.id) {
+        callback(new Error('绑定设备不可为空！'))
+      } else {
+        callback()
+      }
+    }
     return {
       room: '选项1',
       // 库房选择
@@ -95,7 +103,8 @@ export default {
       selections: [],
       dialogVisible: false,
       cameraTypeId: '',
-      airEquipmentTypeId: '',
+      airEquipmentTypeId: '', // 空气质量检测设备
+      temperaSensorTypeId: '', // 温湿度感应器
       form: { deviceInfo: {}},
       // 设备绑定
       devVal: '',
@@ -105,7 +114,7 @@ export default {
       paramsOptions: [],
       rules: {
         deviceInfo: [
-          { required: true, message: '请选择设备', trigger: 'blur' }
+          { required: true, validator: checkDeviceInfo, trigger: 'change' }
         ]
       }
     }
@@ -120,6 +129,7 @@ export default {
     crudDevice.getDeviceType().then((data) => {
       this.cameraTypeId = data.find((x) => { return x.name === '摄像头' }).id
       this.airEquipmentTypeId = data.find((x) => { return x.name === '空气质量检测设备' }).id
+      this.temperaSensorTypeId = data.find((x) => { return x.name === '温湿度感应器' }).id
     })
   },
   methods: {
@@ -135,6 +145,7 @@ export default {
       }
     },
     handleBindParam() {
+      console.log(1111)
       if (this.selections.length === 1) {
         this.form = JSON.parse(JSON.stringify(this.selections[0]))
         if (!this.form.deviceInfo) {
@@ -144,8 +155,10 @@ export default {
         const isCAM = this.form.divPosition.includes('CAM')
         if (isCAM) {
           deviceTypeId = this.cameraTypeId
-        } else {
+        } else if (this.form.divPosition.includes('TOP')) {
           deviceTypeId = this.airEquipmentTypeId
+        } else {
+          deviceTypeId = this.temperaSensorTypeId
         }
         // 获取设备选项
         crudDevice.getDeviceList({ storeroomId: this.room, deviceTypeId: deviceTypeId }).then((data) => {
@@ -157,7 +170,15 @@ export default {
         })
         // 温湿度感应器
         if (!isCAM && this.form.deviceInfo.id) {
+          // 获取参数选项
           this.getParamsOptionsList()
+        } else {
+          this.paramsOptions.splice(0, this.paramsOptions.length)
+          if (this.form.divPosition.includes('TOP')) {
+            this.form.deviceSpecParams = ''
+          } else {
+            this.form.deviceSpecParams.splice(0, this.form.deviceSpecParams.length)
+          }
         }
         if (this.form.deviceSpecParams && this.form.deviceSpecParams.length > 0) {
           let formParams = this.form.deviceSpecParams.map((item) => { return item.id })
@@ -179,6 +200,8 @@ export default {
       this.$refs.table.toggleRowSelection(row) // 单选选中
     },
     handleConfirm() {
+      this.$refs.formDom.validate((valid) => {
+        if (valid) {
           this.form.deviceInfo = this.devOptions.find((option) => { return option.value === this.form.deviceInfo.id }).self
           if (Array.isArray(this.form.deviceSpecParams)) {
             const paramValues = this.paramsOptions.filter((option) => { return this.form.deviceSpecParams.includes(option.value) })
@@ -195,6 +218,10 @@ export default {
             this.dialogVisible = false
             this.getDisplayConfigList()
           })
+        } else {
+          return false
+        }
+      })
     },
     getDisplayConfigList() {
       displayConfigApi.list({ storeroomId: this.room }).then((data) => {
@@ -202,10 +229,15 @@ export default {
       })
     },
     getParamsOptionsList() {
+      if (this.form.deviceInfo.id) {
         getParams({ deviceInfoId: this.form.deviceInfo.id }).then((data) => {
           this.paramsOptions = data.map(data => { return { value: data.id, label: data.paramName, info: data.paramId, self: data } })
         })
       }
+    },
+    opened() {
+      this.$refs.formDom.clearValidate()
+    }
   }
 }
 </script>