blackteay/nova-admin
1
0
Fork 0
mirror of https://github.com/chansee97/nova-admin.git synced 2025-05-21 00:09:16 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: 优化TabBar组件，移除冗余代码并整合useTabScroll钩子

Browse Source
This commit is contained in:
Vigo.zhou 2025-04-30 15:28:57 +08:00
parent 85a5b17721
commit 292471ce2f
1 changed files with 3 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/layouts/components/tab/TabBar.vue
View File

@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import type { NScrollbar } from 'naive-ui'
import type { RouteLocationNormalized } from 'vue-router' import type { RouteLocationNormalized } from 'vue-router'
import { useAppStore, useTabStore } from '@/store' import { useAppStore, useTabStore } from '@/store'
import { useTabScroll } from '@/hooks/useTabScroll'
import { useDraggable } from 'vue-draggable-plus' import { useDraggable } from 'vue-draggable-plus'
import IconClose from '~icons/icon-park-outline/close' import IconClose from '~icons/icon-park-outline/close'
import IconDelete from '~icons/icon-park-outline/delete-four' import IconDelete from '~icons/icon-park-outline/delete-four'
@ -14,12 +14,12 @@ import DropTabs from './DropTabs.vue'
import Reload from './Reload.vue' import Reload from './Reload.vue'
import TabBarItem from './TabBarItem.vue' import TabBarItem from './TabBarItem.vue'
import { useTabScroll } from '@/hooks/useTabScroll'
const tabStore = useTabStore() const tabStore = useTabStore()
const { tabs } = storeToRefs(useTabStore()) const { tabs } = storeToRefs(useTabStore())
const appStore = useAppStore() const appStore = useAppStore()
const {scrollbar, onWheel } = useTabScroll(computed(() => tabStore.currentTabPath))
const router = useRouter() const router = useRouter()
function handleTab(route: RouteLocationNormalized) { function handleTab(route: RouteLocationNormalized) {
router.push(route.fullPath) router.push(route.fullPath)
@ -106,7 +106,6 @@ function onClickoutside() {
} }
const el = ref() const el = ref()
const {scrollbar, onWheel } = useTabScroll(computed(() => tabStore.currentTabPath))
useDraggable(el, tabs, { useDraggable(el, tabs, {
animation: 150, animation: 150,
@ -140,7 +139,6 @@ useDraggable(el, tabs, {
:on-clickoutside="onClickoutside" @select="handleSelect" :on-clickoutside="onClickoutside" @select="handleSelect"
/> />
</div> </div>
<!-- <span class="m-l-auto" /> -->
</div> </div>
<n-el class="absolute right-0 top-0 flex items-center gap-1 bg-[var(--base-color)] h-full"> <n-el class="absolute right-0 top-0 flex items-center gap-1 bg-[var(--base-color)] h-full">
<Reload /> <Reload />