48 lines
928 B
Vue
48 lines
928 B
Vue
|
<template>
|
||
|
|
<ToolBar :bars="toolBars" />
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup lang="ts">
|
||
|
|
import { h } from 'vue'
|
||
|
|
import { useRouter } from 'vue-router'
|
||
|
|
|
||
|
|
import LogoView from '@/components/LogoView'
|
||
|
|
import type { ToolBarItemType } from '@/components/ToolBar'
|
||
|
|
import { ToolBar } from '@/components/ToolBar'
|
||
|
|
|
||
|
|
import { toggleTheme } from './modules/actions'
|
||
|
|
import ThemeIcon from './modules/themeSwitch/ThemeIcon.vue'
|
||
|
|
|
||
|
|
const router = useRouter()
|
||
|
|
|
||
|
|
const toolBars: ToolBarItemType[] = [
|
||
|
|
{
|
||
|
|
label: '首页',
|
||
|
|
action: async (_e: MouseEvent) => {
|
||
|
|
await router.push({
|
||
|
|
name: 'Pages'
|
||
|
|
})
|
||
|
|
},
|
||
|
|
icon: () =>
|
||
|
|
h(LogoView, {
|
||
|
|
width: '60px'
|
||
|
|
}),
|
||
|
|
divider: true,
|
||
|
|
location: 'left'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '主题',
|
||
|
|
action: toggleTheme,
|
||
|
|
icon: () => h(ThemeIcon),
|
||
|
|
location: 'right'
|
||
|
|
}
|
||
|
|
]
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="less">
|
||
|
|
.tool-bar-title {
|
||
|
|
font-size: 20px;
|
||
|
|
font-weight: 400;
|
||
|
|
}
|
||
|
|
</style>
|