Просмотр исходного кода

【功能完善】IoT: 场景联动产品设备信息回显

puhui999 1 год назад
Родитель
Сommit
6b99fdb41f

+ 11 - 0
src/api/iot/device/device/index.ts

@@ -165,5 +165,16 @@ export const DeviceApi = {
   // 获取设备MQTT连接参数
   getMqttConnectionParams: async (deviceId: number) => {
     return await request.get({ url: `/iot/device/mqtt-connection-params`, params: { deviceId } })
+  },
+
+  // 根据ProductKey和DeviceNames获取设备列表
+  getDevicesByProductKeyAndNames: async (productKey: string, deviceNames: string[]) => {
+    return await request.get({
+      url: `/iot/device/get-by-product-key-and-names`,
+      params: {
+        productKey,
+        deviceNames: deviceNames.join(',')
+      }
+    })
   }
 }

+ 5 - 0
src/api/iot/product/product/index.ts

@@ -78,5 +78,10 @@ export const ProductApi = {
   // 查询产品(精简)列表
   getSimpleProductList() {
     return request.get({ url: '/iot/product/simple-list' })
+  },
+  
+  // 根据ProductKey获取产品信息
+  getProductByKey: async (productKey: string) => {
+    return await request.get({ url: `/iot/product/get-by-key`, params: { productKey } })
   }
 }

+ 57 - 5
src/views/iot/rule/scene/components/action/ActionExecutor.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="m-10px">
-    <!-- TODO puhui999: 产品设备回显 -->
+    <!-- 产品设备回显区域 -->
     <div class="relative bg-[#eff3f7] h-50px flex items-center px-10px">
       <div class="flex items-center mr-60px">
         <span class="mr-10px">执行动作</span>
@@ -79,15 +79,14 @@
 
 <script setup lang="ts">
 import { useVModel } from '@vueuse/core'
-import { isEmpty } from '@/utils/is'
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import ProductTableSelect from '@/views/iot/product/product/components/ProductTableSelect.vue'
 import DeviceTableSelect from '@/views/iot/device/device/components/DeviceTableSelect.vue'
 import DeviceControlAction from './DeviceControlAction.vue'
 import AlertAction from './AlertAction.vue'
 import DataBridgeAction from './DataBridgeAction.vue'
-import { ProductVO } from '@/api/iot/product/product'
-import { DeviceVO } from '@/api/iot/device/device'
+import { ProductApi, ProductVO } from '@/api/iot/product/product'
+import { DeviceApi, DeviceVO } from '@/api/iot/device/device'
 import {
   ActionAlert,
   ActionConfig,
@@ -190,8 +189,61 @@ watch(
   { immediate: true }
 )
 
+/**
+ * 初始化产品回显信息
+ */
+const initProductInfo = async () => {
+  if (!actionConfig.value.deviceControl?.productKey) {
+    return
+  }
+
+  try {
+    // 使用新的API直接通过productKey获取产品信息
+    const productData = await ProductApi.getProductByKey(
+      actionConfig.value.deviceControl.productKey
+    )
+    if (productData) {
+      product.value = productData
+    }
+  } catch (error) {
+    console.error('获取产品信息失败:', error)
+  }
+}
+
+/**
+ * 初始化设备回显信息
+ */
+const initDeviceInfo = async () => {
+  if (
+    !actionConfig.value.deviceControl?.productKey ||
+    !actionConfig.value.deviceControl?.deviceNames?.length
+  ) {
+    return
+  }
+
+  try {
+    // 使用新的API直接通过productKey和deviceNames获取设备列表
+    const deviceData = await DeviceApi.getDevicesByProductKeyAndNames(
+      actionConfig.value.deviceControl.productKey,
+      actionConfig.value.deviceControl.deviceNames
+    )
+
+    if (deviceData && deviceData.length > 0) {
+      deviceList.value = deviceData
+    }
+  } catch (error) {
+    console.error('获取设备信息失败:', error)
+  }
+}
+
 /** 初始化 */
-onMounted(() => {
+onMounted(async () => {
   initActionConfig()
+
+  // 初始化产品和设备回显
+  if (actionConfig.value.deviceControl) {
+    await initProductInfo()
+    await initDeviceInfo()
+  }
 })
 </script>

+ 63 - 2
src/views/iot/rule/scene/components/listener/DeviceListener.vue

@@ -144,8 +144,8 @@ import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import DeviceListenerCondition from './DeviceListenerCondition.vue'
 import ProductTableSelect from '@/views/iot/product/product/components/ProductTableSelect.vue'
 import DeviceTableSelect from '@/views/iot/device/device/components/DeviceTableSelect.vue'
-import { ProductVO } from '@/api/iot/product/product'
-import { DeviceVO } from '@/api/iot/device/device'
+import { ProductApi, ProductVO } from '@/api/iot/product/product'
+import { DeviceApi, DeviceVO } from '@/api/iot/device/device'
 import { ThingModelApi } from '@/api/iot/thingmodel'
 import {
   IotDeviceMessageIdentifierEnum,
@@ -219,9 +219,56 @@ const openDeviceSelect = () => {
   deviceTableSelectRef.value?.open()
 }
 
+/**
+ * 初始化产品回显信息
+ */
+const initProductInfo = async () => {
+  if (!triggerConfig.value.productKey) {
+    return
+  }
+
+  try {
+    // 使用新的API直接通过productKey获取产品信息
+    const productData = await ProductApi.getProductByKey(triggerConfig.value.productKey)
+    if (productData) {
+      product.value = productData
+      // 加载物模型数据
+      await getThingModelTSL()
+    }
+  } catch (error) {
+    console.error('获取产品信息失败:', error)
+  }
+}
+
+/**
+ * 初始化设备回显信息
+ */
+const initDeviceInfo = async () => {
+  if (!triggerConfig.value.productKey || !triggerConfig.value.deviceNames?.length) {
+    return
+  }
+
+  try {
+    // 使用新的API直接通过productKey和deviceNames获取设备列表
+    const deviceData = await DeviceApi.getDevicesByProductKeyAndNames(
+      triggerConfig.value.productKey,
+      triggerConfig.value.deviceNames
+    )
+
+    if (deviceData && deviceData.length > 0) {
+      deviceList.value = deviceData
+    }
+  } catch (error) {
+    console.error('获取设备信息失败:', error)
+  }
+}
+
 /** 获取产品物模型 */
 const thingModelTSL = ref<any>()
 const thingModels = computed(() => (condition: TriggerCondition) => {
+  if (isEmpty(thingModelTSL.value)) {
+    return []
+  }
   switch (condition.type) {
     case IotDeviceMessageTypeEnum.PROPERTY:
       return thingModelTSL.value.properties
@@ -239,4 +286,18 @@ const getThingModelTSL = async () => {
   }
   thingModelTSL.value = await ThingModelApi.getThingModelTSLByProductId(product.value.id)
 }
+
+/** 初始化 */
+onMounted(async () => {
+  // 初始化产品和设备回显
+  if (triggerConfig.value) {
+    // 初始化conditions数组,如果不存在
+    if (!triggerConfig.value.conditions) {
+      triggerConfig.value.conditions = []
+    }
+
+    await initProductInfo()
+    await initDeviceInfo()
+  }
+})
 </script>