主题颜色保存配置

This commit is contained in:
RuoYi 2021-04-19 16:59:56 +08:00
parent b6f13c546b
commit 2575c17f47
5 changed files with 17 additions and 15 deletions

View File

@ -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;

View File

@ -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',

View File

@ -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>

View File

@ -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)

View File

@ -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,