From 2575c17f477f3c3240e451512e55f80b0fa712d7 Mon Sep 17 00:00:00 2001
From: RuoYi <yzz_ivy@163.com>
Date: Mon, 19 Apr 2021 16:59:56 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=BB=E9=A2=98=E9=A2=9C=E8=89=B2=E4=BF=9D?=
 =?UTF-8?q?=E5=AD=98=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ruoyi-ui/src/assets/styles/ruoyi.scss             |  6 ------
 ruoyi-ui/src/components/ThemePicker/index.vue     |  1 -
 ruoyi-ui/src/components/TopNav/index.vue          | 15 ++++++++++++---
 ruoyi-ui/src/layout/components/Settings/index.vue |  8 ++++----
 ruoyi-ui/src/store/modules/settings.js            |  2 +-
 5 files changed, 17 insertions(+), 15 deletions(-)

diff --git a/ruoyi-ui/src/assets/styles/ruoyi.scss b/ruoyi-ui/src/assets/styles/ruoyi.scss
index 579e82db9..55118fada 100644
--- a/ruoyi-ui/src/assets/styles/ruoyi.scss
+++ b/ruoyi-ui/src/assets/styles/ruoyi.scss
@@ -176,12 +176,6 @@
   color: #FFFFFF;
 }
 
-/* submenu item */
-.el-menu--horizontal > .el-submenu .el-submenu__title {
-	height: 50px !important;
-	line-height: 50px !important;
-}
-
 /* text color */
 .text-navy {
 	color: #1ab394;
diff --git a/ruoyi-ui/src/components/ThemePicker/index.vue b/ruoyi-ui/src/components/ThemePicker/index.vue
index 9a77cd343..5c16ee451 100644
--- a/ruoyi-ui/src/components/ThemePicker/index.vue
+++ b/ruoyi-ui/src/components/ThemePicker/index.vue
@@ -35,7 +35,6 @@ export default {
       if (typeof val !== 'string') return
       const themeCluster = this.getThemeCluster(val.replace('#', ''))
       const originalCluster = this.getThemeCluster(oldVal.replace('#', ''))
-      console.log(themeCluster, originalCluster)
 
       const $message = this.$message({
         message: '  Compiling the theme',
diff --git a/ruoyi-ui/src/components/TopNav/index.vue b/ruoyi-ui/src/components/TopNav/index.vue
index c5e0e0170..6f7b68826 100644
--- a/ruoyi-ui/src/components/TopNav/index.vue
+++ b/ruoyi-ui/src/components/TopNav/index.vue
@@ -5,7 +5,7 @@
     @select="handleSelect"
   >
     <template v-for="(item, index) in topMenus">
-      <el-menu-item :index="item.path" :key="index" v-if="index < visibleNumber"
+      <el-menu-item :style="{'--theme': theme}" :index="item.path" :key="index" v-if="index < visibleNumber"
         ><svg-icon :icon-class="item.meta.icon" />
         {{ item.meta.title }}</el-menu-item
       >
@@ -42,6 +42,9 @@ export default {
     };
   },
   computed: {
+    theme() {
+      return this.$store.state.settings.theme;
+    },
     // 顶部显示菜单
     topMenus() {
       let topMenus = [];
@@ -149,7 +152,7 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
 .el-menu--horizontal > .el-menu-item {
   float: left;
   height: 50px;
@@ -162,7 +165,13 @@ export default {
 }
 
 .el-menu--horizontal > .el-menu-item.is-active {
-  border-bottom: 3px solid #409eff;
+  border-bottom: 3px solid #{'var(--theme)'};
   color: #303133;
 }
+
+/* submenu item */
+.el-menu--horizontal > .el-submenu .el-submenu__title {
+	height: 50px !important;
+	line-height: 50px !important;
+}
 </style>
diff --git a/ruoyi-ui/src/layout/components/Settings/index.vue b/ruoyi-ui/src/layout/components/Settings/index.vue
index eba813988..efdc0fd0f 100644
--- a/ruoyi-ui/src/layout/components/Settings/index.vue
+++ b/ruoyi-ui/src/layout/components/Settings/index.vue
@@ -77,13 +77,11 @@ export default {
   components: { ThemePicker },
   data() {
     return {
+      theme: this.$store.state.settings.theme,
       sideTheme: this.$store.state.settings.sideTheme
     };
   },
   computed: {
-    theme() {
-      return this.$store.state.settings.theme
-    },
     fixedHeader: {
       get() {
         return this.$store.state.settings.fixedHeader
@@ -138,6 +136,7 @@ export default {
         key: 'theme',
         value: val
       })
+      this.theme = val;
     },
     handleTheme(val) {
       this.$store.dispatch('settings/changeSetting', {
@@ -161,7 +160,8 @@ export default {
             "tagsView":${this.tagsView},
             "fixedHeader":${this.fixedHeader},
             "sidebarLogo":${this.sidebarLogo},
-            "sideTheme":"${this.sideTheme}"
+            "sideTheme":"${this.sideTheme}",
+            "theme":"${this.theme}"
           }`
       );
       setTimeout(loading.close(), 1000)
diff --git a/ruoyi-ui/src/store/modules/settings.js b/ruoyi-ui/src/store/modules/settings.js
index 7192f1c06..aeedaba16 100644
--- a/ruoyi-ui/src/store/modules/settings.js
+++ b/ruoyi-ui/src/store/modules/settings.js
@@ -5,7 +5,7 @@ const { sideTheme, showSettings, topNav, tagsView, fixedHeader, sidebarLogo } =
 
 const storageSetting = JSON.parse(localStorage.getItem('layout-setting')) || ''
 const state = {
-  theme: variables.theme,
+  theme: storageSetting.theme || variables.theme,
   sideTheme: storageSetting.sideTheme || sideTheme,
   showSettings: showSettings,
   topNav:  storageSetting.topNav === undefined ? topNav : storageSetting.topNav,