From 9650dd9f1d1088118af59ded79f5cce18fdb7280 Mon Sep 17 00:00:00 2001
From: sean.zhou <sean.zhou@dji.com>
Date: Fri, 24 Feb 2023 19:36:13 +0800
Subject: [PATCH] Fixed some issues

---
 src/pages/page-web/projects/layer.vue |   11 ++++++++++-
 1 files changed, 10 insertions(+), 1 deletions(-)

diff --git a/src/pages/page-web/projects/layer.vue b/src/pages/page-web/projects/layer.vue
index eb10e53..706aaab 100644
--- a/src/pages/page-web/projects/layer.vue
+++ b/src/pages/page-web/projects/layer.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="project-layer-wrapper">
+  <div class="project-layer-wrapper height-100">
     <div style="height: 50px; line-height: 50px; border-bottom: 1px solid #4f4f4f; font-weight: 450;">
       <a-row>
         <a-col :span="1"></a-col>
@@ -7,6 +7,7 @@
         <a-col :span="1"></a-col>
       </a-row>
     </div>
+    <div class="scrollbar" :style="{ height: scorllHeight + 'px'}">
     <LayersTree
       :layer-data="mapLayers"
       class="project-layer-content"
@@ -15,6 +16,7 @@
       v-model:selectedKeys="selectedKeys"
       v-model:checkedKeys="checkedKeys"
     />
+    </div>
     <a-drawer
       title="Map Element"
       placement="right"
@@ -128,6 +130,7 @@
   { id: 5, name: 'RED', color: '#E23C39', selected: false },
   { id: 6, name: 'NAME_DEFAULT', color: '#212121', selected: false }
 ])
+const scorllHeight = ref()
 
 async function getAllElement () {
   getElementGroups('init')
@@ -245,6 +248,9 @@
   }
 }
 onMounted(() => {
+  const element = document.getElementsByClassName('scrollbar').item(0) as HTMLDivElement
+  const parent = element?.parentNode as HTMLDivElement
+  scorllHeight.value = parent.clientHeight - parent.firstElementChild!.clientHeight
   getAllElement()
 })
 function closeDrawer () {
@@ -439,4 +445,7 @@
     margin-bottom: 10px;
   }
 }
+.scrollbar {
+  overflow: auto;
+}
 </style>

--
Gitblit v1.9.3