Files
vue3-element-admin/src/layouts/components/LayoutNavbar.vue
Ray.Hao c9bd327fc0 refactor: 优化通用组件实现与工具类型
- src/components/DictSelect: 改用 defineModel 与 computed,修复选项加载时清空已选值与父子值分叉
- src/components/ThemeSwitcher: ThemeSwitch 改名,修正 theneList 拼写
- src/composables/useTableSelection: 显式判空,避免 id 为 0 的行被过滤
- src/utils/download: 收窄入参类型,headers 改为可选
- src/api/system/user: 导出与模板下载接口声明 Blob 响应类型
- src/views/system/dict: 标签类型选项排除空串,el-tag 去掉 as any
- src/views/system/user/components/UserImportDialog: 去掉响应类型的 any 标注
- src/layouts、src/views/login: 删除可自动导入组件的冗余 import
2026-09-01 07:26:09 +08:00

56 lines
1.2 KiB
Vue

<template>
<div class="layout-navbar">
<div class="flex-y-center">
<Hamburger :is-active="sidebarState.opened" @toggle-click="sidebarState.toggle" />
<Breadcrumb />
</div>
<div class="layout-navbar__actions">
<LayoutToolbar />
</div>
</div>
</template>
<script setup lang="ts">
import { useAppStore } from "@/stores";
const props = withDefaults(
defineProps<{
toggleTarget?: "primary" | "secondary";
}>(),
{
toggleTarget: "primary",
}
);
const appStore = useAppStore();
const sidebarState = computed(() =>
props.toggleTarget === "secondary"
? {
opened: appStore.secondarySidebar?.opened ?? true,
toggle: () => appStore.toggleSecondarySidebar(),
}
: { opened: appStore.sidebar.opened, toggle: () => appStore.toggleSidebar() }
);
</script>
<style lang="scss" scoped>
.layout-navbar {
display: flex;
align-items: center;
justify-content: space-between;
height: $navbar-height;
padding: 0 14px 0 6px;
background-color: var(--content-bg);
border-bottom: 1px solid var(--card-border);
box-shadow: 0 1px 0 rgb(15 23 42 / 3%);
&__actions {
display: flex;
align-items: center;
height: 100%;
}
}
</style>