2024-05-19 21:20:42 +08:00
|
|
|
|
<script lang="ts" setup>
|
2024-07-14 15:18:02 +08:00
|
|
|
|
import { computed } from 'vue';
|
2024-07-10 00:50:41 +08:00
|
|
|
|
import { useRoute } from 'vue-router';
|
|
|
|
|
|
|
|
|
|
import { preferences } from '@vben-core/preferences';
|
|
|
|
|
import { useCoreTabbarStore } from '@vben-core/stores';
|
2024-07-14 15:18:02 +08:00
|
|
|
|
import { TabsToolMore, TabsToolScreen, TabsView } from '@vben-core/tabs-ui';
|
2024-05-19 21:20:42 +08:00
|
|
|
|
|
2024-07-14 15:18:02 +08:00
|
|
|
|
import { updateContentScreen, useTabs } from './use-tabs';
|
2024-05-19 21:20:42 +08:00
|
|
|
|
|
|
|
|
|
defineOptions({
|
2024-06-09 15:39:11 +08:00
|
|
|
|
name: 'LayoutTabbar',
|
2024-05-19 21:20:42 +08:00
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
defineProps<{ showIcon?: boolean }>();
|
|
|
|
|
|
2024-07-10 00:50:41 +08:00
|
|
|
|
const coreTabbarStore = useCoreTabbarStore();
|
|
|
|
|
|
2024-07-14 15:18:02 +08:00
|
|
|
|
const route = useRoute();
|
|
|
|
|
|
2024-05-19 21:20:42 +08:00
|
|
|
|
const {
|
|
|
|
|
createContextMenus,
|
|
|
|
|
currentActive,
|
|
|
|
|
currentTabs,
|
|
|
|
|
handleClick,
|
|
|
|
|
handleClose,
|
2024-07-10 00:50:41 +08:00
|
|
|
|
handleUnpinTab,
|
2024-05-19 21:20:42 +08:00
|
|
|
|
} = useTabs();
|
2024-07-10 00:50:41 +08:00
|
|
|
|
|
2024-07-14 15:18:02 +08:00
|
|
|
|
const menus = computed(() => {
|
|
|
|
|
return createContextMenus(route);
|
|
|
|
|
});
|
|
|
|
|
|
2024-07-10 00:50:41 +08:00
|
|
|
|
// 刷新后如果不保持tab状态,关闭其他tab
|
|
|
|
|
if (!preferences.tabbar.persist) {
|
|
|
|
|
coreTabbarStore.closeOtherTabs(route);
|
|
|
|
|
}
|
2024-05-19 21:20:42 +08:00
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<template>
|
|
|
|
|
<TabsView
|
2024-06-09 13:31:43 +08:00
|
|
|
|
:active="currentActive"
|
2024-07-14 15:18:02 +08:00
|
|
|
|
:context-menus="createContextMenus"
|
2024-05-19 21:20:42 +08:00
|
|
|
|
:show-icon="showIcon"
|
|
|
|
|
:tabs="currentTabs"
|
|
|
|
|
@close="handleClose"
|
2024-07-14 15:18:02 +08:00
|
|
|
|
@sort-tabs="coreTabbarStore.sortTabs"
|
|
|
|
|
@unpin="handleUnpinTab"
|
2024-06-09 13:31:43 +08:00
|
|
|
|
@update:active="handleClick"
|
2024-05-19 21:20:42 +08:00
|
|
|
|
/>
|
2024-07-14 15:18:02 +08:00
|
|
|
|
<div class="flex-center h-full">
|
|
|
|
|
<TabsToolMore :menus="menus" />
|
|
|
|
|
<TabsToolScreen
|
|
|
|
|
:screen="preferences.sidebar.hidden"
|
|
|
|
|
@change="updateContentScreen"
|
|
|
|
|
@update:screen="updateContentScreen"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
2024-05-19 21:20:42 +08:00
|
|
|
|
</template>
|