wip: 临时提交

src/layouts/components/Sidebar/index.vue

@@ -1,48 +0,0 @@
-<template>
-  <div :class="{ 'has-logo': showLogo }" class="layout-sidebar">
-    <!-- Logo -->
-    <SidebarLogo v-if="showLogo" :collapse="isCollapsed" />
-    <!-- 主菜单内容 -->
-    <slot></slot>
-  </div>
-</template>
-
-<script setup lang="ts">
-import SidebarLogo from "./components/SidebarLogo.vue";
-
-defineProps({
-  /**
-   * 是否显示Logo
-   */
-  showLogo: {
-    type: Boolean,
-    default: true,
-  },
-  /**
-   * 是否折叠
-   */
-  isCollapsed: {
-    type: Boolean,
-    default: false,
-  },
-});
-</script>
-
-<style lang="scss" scoped>
-.layout-sidebar {
-  position: relative;
-  height: 100%;
-  background-color: var(--menu-background);
-  transition: width 0.28s;
-
-  &.has-logo {
-    .el-scrollbar {
-      height: calc(100vh - $navbar-height);
-    }
-  }
-
-  :deep(.el-menu) {
-    border: none;
-  }
-}
-</style>

src/layouts/views/LeftLayout.vue

@@ -2,11 +2,14 @@
   <BaseLayout>
     <!-- 左侧菜单栏 -->
     <div class="layout__sidebar" :class="{ 'layout__sidebar--collapsed': !isSidebarOpen }">
-      <Sidebar :show-logo="isShowLogo" :is-collapsed="!isSidebarOpen">
+      <div :class="{ 'has-logo': isShowLogo }" class="layout-sidebar">
+        <!-- Logo -->
+        <AppLogo v-if="isShowLogo" :collapse="!isSidebarOpen" />
+        <!-- 主菜单内容 -->
         <el-scrollbar>
           <Menu :data="routes" base-path="" />
         </el-scrollbar>
-      </Sidebar>
+      </div>
     </div>
 
     <!-- 主内容区 -->
@@ -28,7 +31,7 @@
 import { useLayout } from "../composables/useLayout";
 import { useLayoutMenu } from "../composables/useLayoutMenu";
 import BaseLayout from "./BaseLayout.vue";
-import Sidebar from "../components/Sidebar/index.vue";
+import AppLogo from "../components/AppLogo/index.vue";
 import NavBar from "../components/NavBar/index.vue";
 import TagsView from "../components/TagsView/index.vue";
 import AppMain from "../components/AppMain/index.vue";
@@ -60,6 +63,23 @@ console.log("🔍 LeftLayout - isMobile:", isMobile.value);
     &--collapsed {
       width: $sidebar-width-collapsed;
     }
+
+    .layout-sidebar {
+      position: relative;
+      height: 100%;
+      background-color: var(--menu-background);
+      transition: width 0.28s;
+
+      &.has-logo {
+        .el-scrollbar {
+          height: calc(100vh - $navbar-height);
+        }
+      }
+
+      :deep(.el-menu) {
+        border: none;
+      }
+    }
   }
 
   &__main {

src/layouts/views/MixLayout.vue

@@ -5,7 +5,7 @@
       <div class="layout__header-content">
         <!-- Logo区域 -->
         <div v-if="isShowLogo" class="layout__header-logo">
-          <SidebarLogo :collapse="false" />
+          <AppLogo :collapse="false" />
         </div>
 
         <!-- 顶部菜单区域 -->
@@ -63,7 +63,7 @@ import { useRoute } from "vue-router";
 import { useLayout } from "../composables/useLayout";
 import { useLayoutMenu } from "../composables/useLayoutMenu";
 import BaseLayout from "./BaseLayout.vue";
-import SidebarLogo from "../components/Sidebar/components/SidebarLogo.vue";
+import AppLogo from "../components/AppLogo/index.vue";
 import MixTopMenu from "../components/NavMenu/components/MixTopMenu.vue";
 import NavbarActions from "../components/NavBar/components/NavbarActions.vue";
 import TagsView from "../components/TagsView/index.vue";

src/layouts/views/TopLayout.vue

@@ -4,7 +4,7 @@
     <div class="layout__header">
       <div class="layout__header-left">
         <!-- Logo -->
-        <SidebarLogo v-if="isShowLogo" :collapse="false" />
+        <AppLogo v-if="isShowLogo" :collapse="false" />
         <!-- 菜单 -->
         <Menu :data="routes" menu-mode="horizontal" base-path="" />
       </div>
@@ -26,7 +26,7 @@
 import { useLayout } from "../composables/useLayout";
 import { useLayoutMenu } from "../composables/useLayoutMenu";
 import BaseLayout from "./BaseLayout.vue";
-import SidebarLogo from "../components/Sidebar/components/SidebarLogo.vue";
+import AppLogo from "../components/AppLogo/index.vue";
 import Menu from "../components/NavMenu/index.vue";
 import NavbarActions from "../components/NavBar/components/NavbarActions.vue";
 import TagsView from "../components/TagsView/index.vue";