feat(components): create navbar component

This commit is contained in:
parent c0c11ba1ea
commit cd64636715
Signed by: tablet
GPG Key ID: 924A5F6AF051E87C

@ -0,0 +1,28 @@
<script lang="ts" setup>
const itemMap = {
"bands": "/bands",
"authors": "/authors"
};
let cur = Object.keys(itemMap).find(a => itemMap[a] === useRoute().name) || "";
let selected: string[] = [cur]
const clickFn = (minfo) => {
navigateTo(itemMap[ minfo.key ])
}
</script>
<template>
<a-menu mode="horizontal" class="navibar" :style="{
height: '40px',
alignSelf: 'center',
justifyContent: 'stretch'
}" @click="clickFn" :selectedKeys="selected">
<a-menu-item key="bands">
Bands
</a-menu-item>
</a-menu>
</template>
<style scoped>
.navibar {
align-self: stretch;
}
</style>