From d43ab86e2c877a433b09fca677d26de98373dcd9 Mon Sep 17 00:00:00 2001
From: wf <2547096351@qq.com>
Date: Mon, 6 May 2024 16:57:00 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BE=A7=E8=BE=B9=E6=A0=8F=E6=B7=B1?=
 =?UTF-8?q?=E8=89=B2=E3=80=81logo=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/components/Aside/index.vue | 23 ++---------------------
 src/layout/components/Logo/index.vue  | 15 +++++++++++++--
 2 files changed, 15 insertions(+), 23 deletions(-)

diff --git a/src/layout/components/Aside/index.vue b/src/layout/components/Aside/index.vue
index 80b0e3e..8831d19 100644
--- a/src/layout/components/Aside/index.vue
+++ b/src/layout/components/Aside/index.vue
@@ -1,9 +1,6 @@
 <template>
   <div :class="asideDark ? 'aside dark' : 'aside'">
-    <div class="logo_head">
-      <img :src="Logo" class="logo" />
-      <span class="logo_title" v-if="!collapsed">dc admin</span>
-    </div>
+    <Logo />
     <a-layout-sider :collapsed="collapsed" breakpoint="xl" class="layout_side" :width="220">
       <a-scrollbar style="height: 100%; overflow: auto" outer-class="scrollbar"><Menu /></a-scrollbar>
     </a-layout-sider>
@@ -11,7 +8,7 @@
 </template>
 
 <script setup lang="ts">
-import Logo from "@/assets/img/logo.jpg";
+import Logo from "@/layout/components/Logo/index.vue";
 import Menu from "@/layout/components/Menu/index.vue";
 import { storeToRefs } from "pinia";
 import { useThemeConfig } from "@/store/modules/theme-config";
@@ -27,22 +24,6 @@ const { collapsed, asideDark } = storeToRefs(themeStore);
 .dark {
   background: #232324;
 }
-// 头部
-.logo_head {
-  height: 60px;
-  display: flex;
-  justify-content: space-around;
-  align-items: center;
-  box-sizing: border-box;
-  border-right: $border-1 solid $color-border-2;
-  .logo {
-    width: 30px;
-  }
-  .logo_title {
-    font-weight: bold;
-    font-size: $font-size-title-2;
-  }
-}
 
 .layout_side {
   height: calc(100% - 60px);
diff --git a/src/layout/components/Logo/index.vue b/src/layout/components/Logo/index.vue
index 416acb3..ca0435e 100644
--- a/src/layout/components/Logo/index.vue
+++ b/src/layout/components/Logo/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="logo_head">
     <img :src="Logo" class="logo" />
-    <span class="logo_title" v-if="!collapsed">dc admin</span>
+    <span :class="isDark ? 'logo_title dark' : 'logo_title'" v-if="!collapsed">dc admin</span>
   </div>
 </template>
 
@@ -10,7 +10,15 @@ import Logo from "@/assets/img/logo.jpg";
 import { storeToRefs } from "pinia";
 import { useThemeConfig } from "@/store/modules/theme-config";
 const themeStore = useThemeConfig();
-const { collapsed } = storeToRefs(themeStore);
+const { collapsed, asideDark, layoutType } = storeToRefs(themeStore);
+
+const isDark = computed(() => {
+  if (asideDark.value && layoutType.value === "layoutDefaults") {
+    return true;
+  } else {
+    return false;
+  }
+});
 </script>
 
 <style lang="scss" scoped>
@@ -31,5 +39,8 @@ const { collapsed } = storeToRefs(themeStore);
     font-weight: bold;
     font-size: $font-size-title-2;
   }
+  .dark {
+    color: #fff;
+  }
 }
 </style>