完善树结构大数据量的展示

src/main/java/com/genersoft/iot/vmp/web/custom/conf/CachedBodyHttpServletRequest.java

@@ -122,3 +122,4 @@ public class CachedBodyHttpServletRequest extends HttpServletRequestWrapper {
 }
 
 
+

web/src/api/group.js

@@ -16,15 +16,16 @@ export function add(data) {
     data: data
   })
 }
-export function getTreeList(params) {
+export function getTreeList({ query, parent, hasChannel, page, count }) {
-  const { query, parent, hasChannel } = params
   return request({
     method: 'get',
     url: `/api/group/tree/list`,
     params: {
       query: query,
       parent: parent,
-      hasChannel: hasChannel
+      hasChannel: hasChannel,
+      page: page,
+      count: count
     }
   })
 }

web/src/views/common/GroupTree.vue

@@ -141,6 +141,7 @@ export default {
       },
       showCode: false,
       showAlert: true,
+      treeLimit: 50,
       searchStr: '',
       chooseId: '',
       treeData: [],
@@ -212,6 +213,7 @@ export default {
           type: 0
         }])
       } else {
+        console.log(node.data)
         if (node.data.leaf) {
           resolve([])
           return
@@ -221,10 +223,26 @@ export default {
           parent: node.data.id,
           hasChannel: this.hasChannel
         }).then(data => {
+          console.log(data)
           if (data.length > 0) {
             this.showAlert = false
           }
-          resolve(data)
+          if (data.length > this.treeLimit) {
+            let subData = data.splice(0, this.treeLimit)
+            subData.push({
+              treeId: '---',
+              deviceId: '---',
+              name: '加载更多...',
+              isLeaf: true,
+              leaf: true,
+              type: 100,
+              nextData: data.splice(this.treeLimit, data.length)
+            })
+            resolve(subData)
+          }else {
+            resolve(data)
+          }
+
         }).finally(() => {
           this.locading = false
         })
@@ -447,8 +465,37 @@ export default {
       }, id)
     },
     nodeClickHandler: function(data, node, tree) {
-      this.chooseId = data.deviceId
+      console.log(data)
-      this.$emit('clickEvent', data)
+
+      if (data && data.nextData && data.nextData.length > 0) {
+        const parentNode = node.parent
+        let nextData = data.nextData
+        if (nextData.length > this.treeLimit) {
+          let subData = nextData.splice(0, this.treeLimit)
+          subData.push({
+            treeId: '---',
+            deviceId: '---',
+            name: '加载更多...',
+            isLeaf: true,
+            leaf: true,
+            type: 100,
+            nextData: nextData.splice(this.treeLimit, nextData.length)
+          })
+          this.$refs.veTree.remove(data, parentNode)
+          for (let item of subData) {
+            this.$refs.veTree.append(item, parentNode)
+          }
+
+        } else {
+          this.$refs.veTree.remove(data, parentNode)
+          for (let item of subData) {
+            this.$refs.veTree.append(item, parentNode)
+          }
+        }
+      }else {
+        this.chooseId = data.deviceId
+        this.$emit('clickEvent', data)
+      }
     },
     listClickHandler: function(data) {
       this.chooseId = data.deviceId

web/src/views/common/RegionTree.vue

@@ -137,6 +137,7 @@ export default {
       searchType: 0,
       showCode: false,
       showAlert: true,
+      treeLimit: 50,
       searchStr: '',
       chooseId: '',
       treeData: [],
@@ -220,7 +221,23 @@ export default {
             if (data.length > 0) {
               this.showAlert = false
             }
-            resolve(data)
+            if (data.length > this.treeLimit) {
+              let subData = data.splice(0, this.treeLimit)
+              subData.push({
+                treeId: '---',
+                deviceId: '---',
+                name: '加载更多...',
+                isLeaf: true,
+                leaf: true,
+                type: 100,
+                children: [],
+                nextData: data.splice(this.treeLimit, data.length)
+              })
+              resolve(subData)
+            }else {
+              resolve(data)
+            }
+
           }).finally(() => {
             this.locading = false
           })
@@ -442,8 +459,37 @@ export default {
       }, node.data)
     },
     nodeClickHandler: function(data, node, tree) {
-      this.chooseId = data.deviceId
+
-      this.$emit('clickEvent', data)
+      if (data && data.nextData && data.nextData.length > 0) {
+        const parentNode = node.parent
+        let nextData = data.nextData
+        if (nextData.length > this.treeLimit) {
+          let subData = nextData.splice(0, this.treeLimit)
+          subData.push({
+            treeId: '---',
+            deviceId: '---',
+            name: '加载更多...',
+            isLeaf: true,
+            leaf: true,
+            type: 100,
+            children: [],
+            nextData: nextData.splice(this.treeLimit, nextData.length)
+          })
+          this.$refs.veTree.remove(data, parentNode)
+          for (let item of subData) {
+            this.$refs.veTree.append(item, parentNode)
+          }
+
+        } else {
+          this.$refs.veTree.remove(data, parentNode)
+          for (let item of subData) {
+            this.$refs.veTree.append(item, parentNode)
+          }
+        }
+      }else {
+        this.chooseId = data.deviceId
+        this.$emit('clickEvent', data)
+      }
     },
     listClickHandler: function(data) {
       this.chooseId = data.deviceId