From 5ebcd9630bc3511100b50492e84ff1ea55f36d02 Mon Sep 17 00:00:00 2001
From: "851673013@qq.com" <851673013@qq.com>
Date: Mon, 27 Jun 2022 17:03:19 +0800
Subject: [PATCH] =?UTF-8?q?=E5=9F=BA=E7=A1=80=E8=AE=BE=E6=96=BD=E5=B7=A6?=
 =?UTF-8?q?=E4=BE=A7=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../home/detailsPageInfrastructureTree.vue    | 140 +++++++++---------
 1 file changed, 72 insertions(+), 68 deletions(-)

diff --git a/front/src/views/home/detailsPageInfrastructureTree.vue b/front/src/views/home/detailsPageInfrastructureTree.vue
index 621eb4e9..c0c51a00 100644
--- a/front/src/views/home/detailsPageInfrastructureTree.vue
+++ b/front/src/views/home/detailsPageInfrastructureTree.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="wrapper">
     <div class="wrapper-title-left-tree" :key="showKey">
-      <div v-for="item in treeData" :key="item.key" class="primaryNode">
+      <div v-for="item in treeData" :key="item.id" class="primaryNode">
         <!-- <div v-if="!item.children || item.children.length == 0">
           {{ item.title }}
         </div> -->
@@ -10,15 +10,15 @@
           @click="showBottom(item)"
           :class="item.show ? 'topSelect' : ''"
         >
-          {{ item.title }}
+          {{ item.name }}
           <DownOutlined v-show="!item.show" />
           <UpOutlined v-show="item.show" />
         </div>
         <div class="bottom" v-show="item.show">
-          <div v-for="val in item.children" :key="val.key" class="item">
+          <div v-for="val in item.children" :key="val.id" class="item">
             <div
               class="up"
-              :class="selectId == val.key ? 'select' : ''"
+              :class="selectId == val.id ? 'select' : ''"
               @click="showDown(item, val), onSelect(item, val)"
             >
               <div>
@@ -31,7 +31,7 @@
                   p-id="2156"
                   width="0.25rem"
                   height="0.25rem"
-                  v-show="selectId == val.key"
+                  v-show="selectId == val.id"
                 >
                   <path
                     d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z"
@@ -40,10 +40,10 @@
                   ></path>
                 </svg>
                 <span class="name">
-                  {{ val.title }}
+                  {{ val.name }}
                 </span>
               </div>
-              <span v-if="item.title !== '区级'">{{ val.total }}</span>
+              <span v-if="item.children.length < 0">{{ val.total }}</span>
               <span v-else>
                 <down-outlined v-show="!val.show" />
                 <up-outlined v-show="val.show" />
@@ -52,9 +52,9 @@
             <div class="down" v-show="val.show">
               <div
                 v-for="child in val.children"
-                :key="child.key"
+                :key="child.id"
                 class="child"
-                :class="selectId == child.key ? 'select2' : ''"
+                :class="selectId == child.id ? 'select2' : ''"
                 @click="onSelect(item, val, child)"
               >
                 <div>
@@ -67,7 +67,7 @@
                     p-id="2156"
                     width="0.25rem"
                     height="0.25rem"
-                    v-show="selectId == child.key"
+                    v-show="selectId == child.id"
                   >
                     <path
                       d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z"
@@ -76,7 +76,7 @@
                     ></path>
                   </svg>
                   <span class="name">
-                    {{ child.title }}
+                    {{ child.name }}
                   </span>
                 </div>
                 <span>{{ child.total }}</span>
@@ -97,7 +97,7 @@
 
 <script>
   import { defineComponent, ref, watch } from 'vue'
-  import { selectDeptList } from '@/api/home.js'
+  import { getCameraAllOrgan } from '@/api/videoSurveillance'
   import mybus from '@/myplugins/mybus'
   import { useRouter } from 'vue-router'
   import { UpOutlined, DownOutlined } from '@ant-design/icons-vue'
@@ -127,43 +127,44 @@
           '获取url中的select=====================>',
           router.currentRoute.value.query.select
         )
-        if (
-          // select !== '基础设施' &&
-          select !== '数据资源' &&
-          select !== '知识库'
-        ) {
-          selectDeptList({ type: select }).then((res) => {
-            // console.log('区划数据=========================>', res.data.data)
-            res.data.data.forEach((val) => {
-              if (val.type !== '全部能力目录') {
-                let obj = {
-                  title: val.type,
-                  total: val.total,
-                  show: val.type === '市级' ? true : false,
-                  select: false,
-                  key: val.type,
-                  children: [],
-                }
-                switch (val.type) {
-                  case '市级':
-                  case '其他':
-                    generateChildren(val, obj)
-                    break
-                  case '区级':
-                    generateChildren2(val, obj)
-                    break
-                }
-                treeData.value.push(obj)
-              }
-            })
-            // 排序
-            const sortArr = ['全部能力目录', '市级', '区级', '企业', '其他']
-            treeData.value.sort((a, b) => {
-              return sortArr.indexOf(a.key) - sortArr.indexOf(b.key)
-            })
-            console.log('左侧树结构数据======================>', treeData.value)
-            showKey.value++
-          })
+        if (select == '基础设施') {
+          getCameraAllOrgan({ parentId: 'S4NbecfYB1DBH8HNULGS34' }).then(
+            (res) => {
+              treeData.value = res.data.data
+            }
+          )
+          // selectDeptList({ type: select }).then((res) => {
+          //   // console.log('区划数据=========================>', res.data.data)
+          //   res.data.data.forEach((val) => {
+          //     if (val.type !== '全部能力目录') {
+          //       let obj = {
+          //         title: val.type,
+          //         total: val.total,
+          //         show: val.type === '市级' ? true : false,
+          //         select: false,
+          //         key: val.type,
+          //         children: [],
+          //       }
+          //       switch (val.type) {
+          //         case '市级':
+          //         case '其他':
+          //           generateChildren(val, obj)
+          //           break
+          //         case '区级':
+          //           generateChildren2(val, obj)
+          //           break
+          //       }
+          //       treeData.value.push(obj)
+          //     }
+          //   })
+          //   // 排序
+          //   const sortArr = ['全部能力目录', '市级', '区级', '企业', '其他']
+          //   treeData.value.sort((a, b) => {
+          //     return sortArr.indexOf(a.key) - sortArr.indexOf(b.key)
+          //   })
+          //   console.log('左侧树结构数据======================>', treeData.value)
+          //   showKey.value++
+          // })
         }
       }
       mybus.on('getDeptList', () => {
@@ -241,25 +242,20 @@
       // }
       const selectId = ref('')
       const onSelect = (item, val, child) => {
-        if (item.title === '区级') {
-          if (child) {
-            if (selectId.value !== child.key) {
-              mybus.emit('paramsGetResources', [child.key])
-              selectId.value = child.key
-            } else {
-              mybus.emit('paramsGetResources', [])
-              selectId.value = ''
+        console.log('item, val, child', child)
+        getCameraAllOrgan({ parentId: val.id }).then((res) => {
+          treeData.value.map((treeDataItem, index) => {
+            if (item.id == treeDataItem.id) {
+              treeData.value[index].children.map((childItem, childIndex) => {
+                if (childItem.id == val.id) {
+                  treeData.value[index].children[childIndex].children =
+                    res.data.data
+                }
+              })
+              console.log('treeData.value.[index]', treeData.value[index])
             }
-          }
-        } else {
-          if (selectId.value !== val.key) {
-            mybus.emit('paramsGetResources', [val.key])
-            selectId.value = val.key
-          } else {
-            mybus.emit('paramsGetResources', [])
-            selectId.value = ''
-          }
-        }
+          })
+        })
       }
       watch(selectedKeys, () => {
         console.log('selectedKeys', selectedKeys)
@@ -305,10 +301,18 @@
       }
       const showBottom = (item) => {
         item.show = !item.show
+        getCameraAllOrgan({ parentId: item.id }).then((res) => {
+          treeData.value.map((treeDataItem, index) => {
+            if (item.id == treeDataItem.id) {
+              treeData.value[index].children = res.data.data
+              console.log('treeData.value.[index]', treeData.value[index])
+            }
+          })
+        })
       }
       const showDown = (item, val) => {
         console.log('showDown', val)
-        if (item.title === '区级') {
+        if (item.children) {
           val.show = !val.show
         }
       }