ruoyi-plus-vben5/packages/business/layouts/src/basic/header/header.vue

46 lines
1.1 KiB
Vue
Raw Normal View History

2024-05-19 21:20:42 +08:00
<script lang="ts" setup>
2024-06-23 20:03:41 +08:00
import { GlobalSearch, LanguageToggle, ThemeToggle } from '@vben/widgets';
2024-06-16 13:43:33 +08:00
import { usePreferences } from '@vben-core/preferences';
2024-05-19 21:20:42 +08:00
import { VbenFullScreen } from '@vben-core/shadcn-ui';
import { useCoreAccessStore } from '@vben-core/stores';
2024-05-19 21:20:42 +08:00
interface Props {
/**
* Logo 主题
*/
theme?: string;
}
defineOptions({
name: 'LayoutHeader',
});
withDefaults(defineProps<Props>(), {
theme: 'light',
});
const accessStore = useCoreAccessStore();
2024-06-16 13:43:33 +08:00
const { globalSearchShortcutKey } = usePreferences();
2024-05-19 21:20:42 +08:00
</script>
<template>
<div class="flex-center hidden lg:block">
<slot name="breadcrumb"></slot>
</div>
<div class="flex h-full min-w-0 flex-1 items-center">
<slot name="menu"></slot>
</div>
<div class="flex h-full min-w-0 flex-shrink-0 items-center">
2024-05-25 20:02:21 +08:00
<GlobalSearch
2024-06-16 13:43:33 +08:00
:enable-shortcut-key="globalSearchShortcutKey"
2024-05-25 20:02:21 +08:00
:menus="accessStore.getAccessMenus"
2024-06-09 13:31:43 +08:00
class="mr-4"
2024-05-25 20:02:21 +08:00
/>
2024-05-19 21:20:42 +08:00
<ThemeToggle class="mr-2" />
<LanguageToggle class="mr-2" />
<VbenFullScreen class="mr-2" />
<slot name="notification"></slot>
<slot name="user-dropdown"></slot>
</div>
</template>