From 8a1c08baaf0ee002b471996b195e7da180b90209 Mon Sep 17 00:00:00 2001
From: feige <791364011@qq.com>
Date: 星期一, 21 七月 2025 09:38:47 +0800
Subject: [PATCH] 增加了前端代码库
---
src/layout/components/Sidebar/index.vue | 57 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 57 insertions(+), 0 deletions(-)
diff --git a/src/layout/components/Sidebar/index.vue b/src/layout/components/Sidebar/index.vue
new file mode 100644
index 0000000..cd86ea6
--- /dev/null
+++ b/src/layout/components/Sidebar/index.vue
@@ -0,0 +1,57 @@
+<template>
+ <div :class="{'has-logo':showLogo}" :style="{ backgroundColor: settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
+ <logo v-if="showLogo" :collapse="isCollapse" />
+ <el-scrollbar :class="settings.sideTheme" wrap-class="scrollbar-wrapper">
+ <el-menu
+ :default-active="activeMenu"
+ :collapse="isCollapse"
+ :background-color="settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground"
+ :text-color="settings.sideTheme === 'theme-dark' ? variables.menuColor : variables.menuLightColor"
+ :unique-opened="true"
+ :active-text-color="settings.theme"
+ :collapse-transition="false"
+ mode="vertical"
+ >
+ <sidebar-item
+ v-for="(route, index) in sidebarRouters"
+ :key="route.path + index"
+ :item="route"
+ :base-path="route.path"
+ />
+ </el-menu>
+ </el-scrollbar>
+ </div>
+</template>
+
+<script>
+import { mapGetters, mapState } from "vuex"
+import Logo from "./Logo"
+import SidebarItem from "./SidebarItem"
+import variables from "@/assets/styles/variables.scss"
+
+export default {
+ components: { SidebarItem, Logo },
+ computed: {
+ ...mapState(["settings"]),
+ ...mapGetters(["sidebarRouters", "sidebar"]),
+ activeMenu() {
+ const route = this.$route
+ const { meta, path } = route
+ // if set path, the sidebar will highlight the path you set
+ if (meta.activeMenu) {
+ return meta.activeMenu
+ }
+ return path
+ },
+ showLogo() {
+ return this.$store.state.settings.sidebarLogo
+ },
+ variables() {
+ return variables
+ },
+ isCollapse() {
+ return !this.sidebar.opened
+ }
+ }
+}
+</script>
--
Gitblit v1.9.1