feat: 布局面板基础结构

This commit is contained in:
手瓜一十雪
2024-11-15 13:25:02 +08:00
parent ddc0ed066d
commit 1e2c76bb47
8 changed files with 85 additions and 12 deletions

View File

@@ -1,10 +1,10 @@
<template>
<t-menu theme="light" default-value="2-1" :collapsed="collapsed">
<t-menu theme="light" default-value="2-1" :collapsed="collapsed" class="sidebar-menu">
<template #logo>
<span>WebUi</span>
</template>
<router-link v-for="item in menuItems" :key="item.value" :to="item.route">
<t-menu-item :value="item.value" :disabled="item.disabled">
<t-menu-item :value="item.value" :disabled="item.disabled" class="menu-item">
<template #icon>
<t-icon :name="item.icon" />
</template>
@@ -24,4 +24,18 @@ export default {
}
}
}
</script>
</script>
<style scoped>
.sidebar-menu {
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 200px; /* 根据需要调整宽度 */
}
.menu-item {
margin-bottom: 10px; /* 根据需要调整间距 */
}
</style>