云设备录入

src/components/tree/device.vue

@@ -99,6 +99,32 @@
                         </template>
                     </el-tree>
                 </el-collapse-item>
+                <el-collapse-item title="云前置设备" name="2" v-if="frontDeviceData.length != 0">
+                    <el-tree
+                        :style="{ height: zlDeviceData.length != 0 ? 'calc(100vh - 280px)' : 'calc(100vh - 238px)' }"
+                        ref="treeRef3"
+                        :props="defaultProps"
+                        highlight-current
+                        default-expand-all
+                        :filter-node-method="filterNode"
+                        node-key="id"
+                        :data="frontDeviceData"
+                        v-bind="$attrs"
+                        style="overflow: auto"
+                    >
+                        <template #default="{ node, data }">
+                            <span class="custom-tree-node">
+                                <Icon
+                                    :name="data.icon"
+                                    style="font-size: 16px"
+                                    :style="{ color: data.color }"
+                                    v-if="data.icon"
+                                />
+                                <span style="margin-left: 4px">{{ node.label }}</span>
+                            </span>
+                        </template>
+                    </el-tree>
+                </el-collapse-item>
             </el-collapse>
         </div>
     </div>
@@ -140,6 +166,8 @@ const zlDeviceData = ref([])
 const zlDevList = ref<any>([])
 //便携式设备数据
 const bxsDeviceData = ref([])
+//前置设备数据
+const frontDeviceData = ref([])
 watch(
     () => props.data,
     (val, oldVal) => {
@@ -153,6 +181,11 @@ watch(
                     item.children.map((vv: any) => {
                         bxsDeviceData.value.push(vv)
                     })
+                }else if (item.name == '云前置设备') {
+                    item.children.map((vv: any) => {
+                        frontDeviceData.value.push(vv)
+                    })
+                    
                 }
             })
         }
@@ -166,8 +199,10 @@ watch(
 watch(filterText, val => {
     if (activeName.value == '0') {
         treeRef1.value!.filter(val)
-    } else {
+    } else if(activeName.value == '1'){
         treeRef2.value!.filter(val)
+    }else  {
+        treeRef3.value!.filter(val)
     }
 })
 watch(process, val => {
@@ -242,6 +277,7 @@ const chooseNode = (value: string, data: any, node: any) => {
 }
 
 const changeDevice = (val: any) => {
+    console.log('changeDevice', val)
     let arr1: any = []
 
     //zlDeviceData
@@ -258,6 +294,14 @@ const changeDevice = (val: any) => {
         arr2.push(item)
         // })
     })
+    let arr3: any = []
+    frontDeviceData.value.forEach((item: any) => {
+         item.children.forEach((item2: any) => {
+            item2.children.forEach((item3: any) => {
+                arr3.push(item3)
+            })
+        })
+    })
     if (val == '0') {
         arr2.map((item: any) => {
             item.checked = false
@@ -272,11 +316,20 @@ const changeDevice = (val: any) => {
         treeRef2.value && treeRef2.value.setCurrentKey(arr2[0].id)
         emit('changeDeviceType', activeName.value, arr2[0])
     }
+    if (val == '2') {
+        arr3.map((item: any) => {
+            item.checked = false
+        })
+        treeRef3.value && treeRef3.value.setCurrentKey(arr3[0].id)
+        emit('changeDeviceType', activeName.value, arr3[0])
+    }
 }
 //治理
 const treeRef1 = ref<InstanceType<typeof ElTree>>()
 //便携式
 const treeRef2 = ref<InstanceType<typeof ElTree>>()
+//前置
+const treeRef3 = ref<InstanceType<typeof ElTree>>()
 defineExpose({ treeRef1, treeRef2 })
 onMounted(() => {
     setTimeout(() => {