fix: the issue that the sidebar retracts unsuccessfully in some browsers

livraison-dev · Dec 7, 2023 · 0da1917 · 0da1917
1 parent a9b9682
commit 0da1917
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 32 deletions.
diff --git a/components/sidebar/Sidebar.vue b/components/sidebar/Sidebar.vue
@@ -1,21 +1,16 @@
 <script setup lang="ts">
 const sidebar = useSidebarStore()
 
-watch(() => sidebar.show, () => {
-  if (sidebar.show)
-    sidebar.handleCreateSize()
-
-  else
-    sidebar.handleClearSize()
-})
+const { panSize, show } = storeToRefs(sidebar)
 </script>
 
 <template>
   <SplitpanesPane
+    v-if="show"
     class="bg-light-50 dark:bg-#050505 border-r border-gray-400/20"
-    :size="sidebar.panSize.size"
-    :min-size="sidebar.panSize.minSize"
-    :max-size="sidebar.panSize.maxSize"
+    :size="panSize.size"
+    :min-size="panSize.minSize"
+    :max-size="panSize.maxSize"
   >
     <nav class="flex flex-col" livraison-app="sideabr">
       <SidebarIconAction />

diff --git a/store/sidebar.ts b/store/sidebar.ts
@@ -19,34 +19,12 @@ export const useSidebarStore = defineStore('sidebar', () => {
     show.value = !show.value
   }
 
-  function handleMoveSize() {
-    size.value = panSize.value.size
-  }
-
-  function handleClearSize() {
-    handleMoveSize()
-    panSize.value = {
-      minSize: 0,
-      size: 0,
-      maxSize: 0,
-    }
-  }
 
-  function handleCreateSize() {
-    panSize.value = {
-      minSize: 15,
-      size: size.value,
-      maxSize: 30,
-    }
-  }
   return {
     size,
     show,
     panSize,
-    handleMoveSize,
     handleToggleSidebar,
-    handleClearSize,
-    handleCreateSize,
   }
 }, {
   persist: true,