作者 RuoYi

支持主题风格配置

  1 +<?xml version="1.0" encoding="UTF-8"?>
  2 +<svg width="52px" height="45px" viewBox="0 0 52 45" version="1.1"
  3 + xmlns="http://www.w3.org/2000/svg"
  4 + xmlns:xlink="http://www.w3.org/1999/xlink">
  5 + <defs>
  6 + <filter x="-9.4%" y="-6.2%" width="118.8%" height="122.5%" filterUnits="objectBoundingBox" id="filter-1">
  7 + <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
  8 + <feGaussianBlur stdDeviation="1" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
  9 + <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
  10 + <feMerge>
  11 + <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
  12 + <feMergeNode in="SourceGraphic"></feMergeNode>
  13 + </feMerge>
  14 + </filter>
  15 + <rect id="path-2" x="0" y="0" width="48" height="40" rx="4"></rect>
  16 + <filter x="-4.2%" y="-2.5%" width="108.3%" height="110.0%" filterUnits="objectBoundingBox" id="filter-4">
  17 + <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
  18 + <feGaussianBlur stdDeviation="0.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
  19 + <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
  20 + </filter>
  21 + </defs>
  22 + <g id="配置面板" width="48" height="40" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
  23 + <g id="setting-copy-2" width="48" height="40" transform="translate(-1190.000000, -136.000000)">
  24 + <g id="Group-8" width="48" height="40" transform="translate(1167.000000, 0.000000)">
  25 + <g id="Group-5-Copy-5" filter="url(#filter-1)" transform="translate(25.000000, 137.000000)">
  26 + <mask id="mask-3" fill="white">
  27 + <use xlink:href="#path-2"></use>
  28 + </mask>
  29 + <g id="Rectangle-18">
  30 + <use fill="black" fill-opacity="1" filter="url(#filter-4)" xlink:href="#path-2"></use>
  31 + <use fill="#F0F2F5" fill-rule="evenodd" xlink:href="#path-2"></use>
  32 + </g>
  33 + <rect id="Rectangle-11" fill="#FFFFFF" mask="url(#mask-3)" x="0" y="0" width="48" height="10"></rect>
  34 + <rect id="Rectangle-18" fill="#303648" mask="url(#mask-3)" x="0" y="0" width="16" height="40"></rect>
  35 + </g>
  36 + </g>
  37 + </g>
  38 + </g>
  39 +</svg>
  1 +<?xml version="1.0" encoding="UTF-8"?>
  2 +<svg width="52px" height="45px" viewBox="0 0 52 45" version="1.1"
  3 + xmlns="http://www.w3.org/2000/svg"
  4 + xmlns:xlink="http://www.w3.org/1999/xlink">
  5 + <defs>
  6 + <filter x="-9.4%" y="-6.2%" width="118.8%" height="122.5%" filterUnits="objectBoundingBox" id="filter-1">
  7 + <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
  8 + <feGaussianBlur stdDeviation="1" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
  9 + <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
  10 + <feMerge>
  11 + <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
  12 + <feMergeNode in="SourceGraphic"></feMergeNode>
  13 + </feMerge>
  14 + </filter>
  15 + <rect id="path-2" x="0" y="0" width="48" height="40" rx="4"></rect>
  16 + <filter x="-4.2%" y="-2.5%" width="108.3%" height="110.0%" filterUnits="objectBoundingBox" id="filter-4">
  17 + <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
  18 + <feGaussianBlur stdDeviation="0.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
  19 + <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0" type="matrix" in="shadowBlurOuter1"></feColorMatrix>
  20 + </filter>
  21 + </defs>
  22 + <g id="配置面板" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
  23 + <g id="setting-copy-2" transform="translate(-1254.000000, -136.000000)">
  24 + <g id="Group-8" transform="translate(1167.000000, 0.000000)">
  25 + <g id="Group-5" filter="url(#filter-1)" transform="translate(89.000000, 137.000000)">
  26 + <mask id="mask-3" fill="white">
  27 + <use xlink:href="#path-2"></use>
  28 + </mask>
  29 + <g id="Rectangle-18">
  30 + <use fill="black" fill-opacity="1" filter="url(#filter-4)" xlink:href="#path-2"></use>
  31 + <use fill="#F0F2F5" fill-rule="evenodd" xlink:href="#path-2"></use>
  32 + </g>
  33 + <rect id="Rectangle-18" fill="#FFFFFF" mask="url(#mask-3)" x="0" y="0" width="16" height="40"></rect>
  34 + <rect id="Rectangle-11" fill="#FFFFFF" mask="url(#mask-3)" x="0" y="0" width="48" height="10"></rect>
  35 + </g>
  36 + </g>
  37 + </g>
  38 + </g>
  39 +</svg>
@@ -8,6 +8,7 @@ @@ -8,6 +8,7 @@
8 } 8 }
9 9
10 .sidebar-container { 10 .sidebar-container {
  11 + -webkit-transition: width .28s;
11 transition: width 0.28s; 12 transition: width 0.28s;
12 width: $sideBarWidth !important; 13 width: $sideBarWidth !important;
13 background-color: $menuBg; 14 background-color: $menuBg;
@@ -19,6 +20,8 @@ @@ -19,6 +20,8 @@
19 left: 0; 20 left: 0;
20 z-index: 1001; 21 z-index: 1001;
21 overflow: hidden; 22 overflow: hidden;
  23 + -webkit-box-shadow: 2px 0 6px rgba(0,21,41,.35);
  24 + box-shadow: 2px 0 6px rgba(0,21,41,.35);
22 25
23 // reset element-ui css 26 // reset element-ui css
24 .horizontal-collapse-transition { 27 .horizontal-collapse-transition {
@@ -73,21 +76,20 @@ @@ -73,21 +76,20 @@
73 .submenu-title-noDropdown, 76 .submenu-title-noDropdown,
74 .el-submenu__title { 77 .el-submenu__title {
75 &:hover { 78 &:hover {
76 - background-color: $menuHover !important; 79 + background-color: rgba(0, 0, 0, 0.06) !important;
77 } 80 }
78 } 81 }
79 82
80 - .is-active>.el-submenu__title { 83 + & .theme-dark .is-active > .el-submenu__title {
81 color: $subMenuActiveText !important; 84 color: $subMenuActiveText !important;
82 } 85 }
83 86
84 & .nest-menu .el-submenu>.el-submenu__title, 87 & .nest-menu .el-submenu>.el-submenu__title,
85 & .el-submenu .el-menu-item { 88 & .el-submenu .el-menu-item {
86 min-width: $sideBarWidth !important; 89 min-width: $sideBarWidth !important;
87 - background-color: $subMenuBg !important;  
88 90
89 &:hover { 91 &:hover {
90 - background-color: $subMenuHover !important; 92 + background-color: rgba(0, 0, 0, 0.06) !important;
91 } 93 }
92 } 94 }
93 } 95 }
@@ -190,7 +192,7 @@ @@ -190,7 +192,7 @@
190 .el-menu-item { 192 .el-menu-item {
191 &:hover { 193 &:hover {
192 // you can use $subMenuHover 194 // you can use $subMenuHover
193 - background-color: $menuHover !important; 195 + background-color: rgba(0, 0, 0, 0.06) !important;
194 } 196 }
195 } 197 }
196 198
@@ -15,6 +15,11 @@ $subMenuActiveText:#f4f4f5; // https://github.com/ElemeFE/element/issues/12951 @@ -15,6 +15,11 @@ $subMenuActiveText:#f4f4f5; // https://github.com/ElemeFE/element/issues/12951
15 15
16 $menuBg:#304156; 16 $menuBg:#304156;
17 $menuHover:#263445; 17 $menuHover:#263445;
  18 +$sidebarTitle: #ffffff;
  19 +
  20 +$menuLightBg:#ffffff;
  21 +$menuLightHover:#f0f1f5;
  22 +$sidebarLightTitle: #001529;
18 23
19 $subMenuBg:#1f2d3d; 24 $subMenuBg:#1f2d3d;
20 $subMenuHover:#001528; 25 $subMenuHover:#001528;
@@ -29,7 +34,11 @@ $sideBarWidth: 200px; @@ -29,7 +34,11 @@ $sideBarWidth: 200px;
29 subMenuActiveText: $subMenuActiveText; 34 subMenuActiveText: $subMenuActiveText;
30 menuBg: $menuBg; 35 menuBg: $menuBg;
31 menuHover: $menuHover; 36 menuHover: $menuHover;
  37 + menuLightBg: $menuLightBg;
  38 + menuLightHover: $menuLightHover;
32 subMenuBg: $subMenuBg; 39 subMenuBg: $subMenuBg;
33 subMenuHover: $subMenuHover; 40 subMenuHover: $subMenuHover;
34 sideBarWidth: $sideBarWidth; 41 sideBarWidth: $sideBarWidth;
  42 + sidebarTitle: $sidebarTitle;
  43 + sidebarLightTitle: $sidebarLightTitle
35 } 44 }
1 <template> 1 <template>
2 <div class="drawer-container"> 2 <div class="drawer-container">
3 <div> 3 <div>
4 - <h3 class="drawer-title">系统布局配置</h3> 4 + <div class="setting-drawer-content">
  5 + <div class="setting-drawer-title">
  6 + <h3 class="drawer-title">主题风格设置</h3>
  7 + </div>
  8 + <div class="setting-drawer-block-checbox">
  9 + <div class="setting-drawer-block-checbox-item" @click="handleTheme('theme-dark')">
  10 + <img src="@/assets/images/dark.svg" alt="dark">
  11 + <div v-if="sideTheme === 'theme-dark'" class="setting-drawer-block-checbox-selectIcon" style="display: block;">
  12 + <i aria-label="图标: check" class="anticon anticon-check">
  13 + <svg viewBox="64 64 896 896" data-icon="check" width="1em" height="1em" :fill="theme" aria-hidden="true"
  14 + focusable="false" class="">
  15 + <path
  16 + d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"/>
  17 + </svg>
  18 + </i>
  19 + </div>
  20 + </div>
  21 + <div class="setting-drawer-block-checbox-item" @click="handleTheme('theme-light')">
  22 + <img src="@/assets/images/light.svg" alt="light">
  23 + <div v-if="sideTheme === 'theme-light'" class="setting-drawer-block-checbox-selectIcon" style="display: block;">
  24 + <i aria-label="图标: check" class="anticon anticon-check">
  25 + <svg viewBox="64 64 896 896" data-icon="check" width="1em" height="1em" :fill="theme" aria-hidden="true"
  26 + focusable="false" class="">
  27 + <path
  28 + d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 0 0-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"/>
  29 + </svg>
  30 + </i>
  31 + </div>
  32 + </div>
  33 + </div>
5 34
6 - <div class="drawer-item">  
7 - <span>主题颜色</span>  
8 - <theme-picker style="float: right;height: 26px;margin: -3px 8px 0 0;" @change="themeChange" /> 35 + <div class="drawer-item">
  36 + <span>主题颜色</span>
  37 + <theme-picker style="float: right;height: 26px;margin: -3px 8px 0 0;" @change="themeChange" />
  38 + </div>
9 </div> 39 </div>
10 40
  41 + <el-divider/>
  42 +
  43 + <h3 class="drawer-title">系统布局配置</h3>
  44 +
11 <div class="drawer-item"> 45 <div class="drawer-item">
12 <span>开启 Tags-Views</span> 46 <span>开启 Tags-Views</span>
13 <el-switch v-model="tagsView" class="drawer-switch" /> 47 <el-switch v-model="tagsView" class="drawer-switch" />
@@ -36,6 +70,12 @@ export default { @@ -36,6 +70,12 @@ export default {
36 return {} 70 return {}
37 }, 71 },
38 computed: { 72 computed: {
  73 + theme() {
  74 + return this.$store.state.settings.theme
  75 + },
  76 + sideTheme() {
  77 + return this.$store.state.settings.sideTheme
  78 + },
39 fixedHeader: { 79 fixedHeader: {
40 get() { 80 get() {
41 return this.$store.state.settings.fixedHeader 81 return this.$store.state.settings.fixedHeader
@@ -76,33 +116,82 @@ export default { @@ -76,33 +116,82 @@ export default {
76 key: 'theme', 116 key: 'theme',
77 value: val 117 value: val
78 }) 118 })
  119 + },
  120 + handleTheme(val) {
  121 + this.$store.dispatch('settings/changeSetting', {
  122 + key: 'sideTheme',
  123 + value: val
  124 + })
79 } 125 }
80 } 126 }
81 } 127 }
82 </script> 128 </script>
83 129
84 <style lang="scss" scoped> 130 <style lang="scss" scoped>
85 -.drawer-container {  
86 - padding: 24px;  
87 - font-size: 14px;  
88 - line-height: 1.5;  
89 - word-wrap: break-word;  
90 -  
91 - .drawer-title {  
92 - margin-bottom: 12px;  
93 - color: rgba(0, 0, 0, .85);  
94 - font-size: 14px;  
95 - line-height: 22px; 131 + .setting-drawer-content {
  132 + .setting-drawer-title {
  133 + margin-bottom: 12px;
  134 + color: rgba(0, 0, 0, .85);
  135 + font-size: 14px;
  136 + line-height: 22px;
  137 + font-weight: bold;
  138 + }
  139 +
  140 + .setting-drawer-block-checbox {
  141 + display: flex;
  142 + justify-content: flex-start;
  143 + align-items: center;
  144 + margin-top: 10px;
  145 + margin-bottom: 20px;
  146 +
  147 + .setting-drawer-block-checbox-item {
  148 + position: relative;
  149 + margin-right: 16px;
  150 + border-radius: 2px;
  151 + cursor: pointer;
  152 +
  153 + img {
  154 + width: 48px;
  155 + height: 48px;
  156 + }
  157 +
  158 + .setting-drawer-block-checbox-selectIcon {
  159 + position: absolute;
  160 + top: 0;
  161 + right: 0;
  162 + width: 100%;
  163 + height: 100%;
  164 + padding-top: 15px;
  165 + padding-left: 24px;
  166 + color: #1890ff;
  167 + font-weight: 700;
  168 + font-size: 14px;
  169 + }
  170 + }
  171 + }
96 } 172 }
97 173
98 - .drawer-item {  
99 - color: rgba(0, 0, 0, .65); 174 + .drawer-container {
  175 + padding: 24px;
100 font-size: 14px; 176 font-size: 14px;
101 - padding: 12px 0;  
102 - } 177 + line-height: 1.5;
  178 + word-wrap: break-word;
103 179
104 - .drawer-switch {  
105 - float: right 180 + .drawer-title {
  181 + margin-bottom: 12px;
  182 + color: rgba(0, 0, 0, .85);
  183 + font-size: 14px;
  184 + line-height: 22px;
  185 + }
  186 +
  187 + .drawer-item {
  188 + color: rgba(0, 0, 0, .65);
  189 + font-size: 14px;
  190 + padding: 12px 0;
  191 + }
  192 +
  193 + .drawer-switch {
  194 + float: right
  195 + }
106 } 196 }
107 -}  
108 </style> 197 </style>
1 <template> 1 <template>
2 - <div class="sidebar-logo-container" :class="{'collapse':collapse}"> 2 + <div class="sidebar-logo-container" :class="{'collapse':collapse}" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBg : variables.menuLightBg }">
3 <transition name="sidebarLogoFade"> 3 <transition name="sidebarLogoFade">
4 <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/"> 4 <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
5 <img v-if="logo" :src="logo" class="sidebar-logo"> 5 <img v-if="logo" :src="logo" class="sidebar-logo">
6 - <h1 v-else class="sidebar-title">{{ title }} </h1> 6 + <h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.sidebarTitle : variables.sidebarLightTitle }">{{ title }} </h1>
7 </router-link> 7 </router-link>
8 <router-link v-else key="expand" class="sidebar-logo-link" to="/"> 8 <router-link v-else key="expand" class="sidebar-logo-link" to="/">
9 <img v-if="logo" :src="logo" class="sidebar-logo"> 9 <img v-if="logo" :src="logo" class="sidebar-logo">
10 - <h1 class="sidebar-title">{{ title }} </h1> 10 + <h1 class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.sidebarTitle : variables.sidebarLightTitle }">{{ title }} </h1>
11 </router-link> 11 </router-link>
12 </transition> 12 </transition>
13 </div> 13 </div>
@@ -15,6 +15,7 @@ @@ -15,6 +15,7 @@
15 15
16 <script> 16 <script>
17 import logoImg from '@/assets/logo/logo.png' 17 import logoImg from '@/assets/logo/logo.png'
  18 +import variables from '@/assets/styles/variables.scss'
18 19
19 export default { 20 export default {
20 name: 'SidebarLogo', 21 name: 'SidebarLogo',
@@ -24,6 +25,14 @@ export default { @@ -24,6 +25,14 @@ export default {
24 required: true 25 required: true
25 } 26 }
26 }, 27 },
  28 + computed: {
  29 + variables() {
  30 + return variables;
  31 + },
  32 + sideTheme() {
  33 + return this.$store.state.settings.sideTheme
  34 + }
  35 + },
27 data() { 36 data() {
28 return { 37 return {
29 title: '若依管理系统', 38 title: '若依管理系统',
@@ -56,6 +56,9 @@ export default { @@ -56,6 +56,9 @@ export default {
56 }, 56 },
57 methods: { 57 methods: {
58 hasOneShowingChild(children = [], parent) { 58 hasOneShowingChild(children = [], parent) {
  59 + if (!children) {
  60 + children = [];
  61 + }
59 const showingChildren = children.filter(item => { 62 const showingChildren = children.filter(item => {
60 if (item.hidden) { 63 if (item.hidden) {
61 return false 64 return false
1 <template> 1 <template>
2 - <div :class="{'has-logo':showLogo}"> 2 + <div :class="{'has-logo':showLogo}" :style="{ backgroundColor: settings.sideTheme === 'theme-dark' ? variables.menuBg : variables.menuLightBg }">
3 <logo v-if="showLogo" :collapse="isCollapse" /> 3 <logo v-if="showLogo" :collapse="isCollapse" />
4 - <el-scrollbar wrap-class="scrollbar-wrapper"> 4 + <el-scrollbar :class="settings.sideTheme" wrap-class="scrollbar-wrapper">
5 <el-menu 5 <el-menu
6 :default-active="activeMenu" 6 :default-active="activeMenu"
7 :collapse="isCollapse" 7 :collapse="isCollapse"
8 - :background-color="variables.menuBg"  
9 - :text-color="variables.menuText" 8 + :background-color="settings.sideTheme === 'theme-dark' ? variables.menuBg : variables.menuLightBg"
  9 + :text-color="settings.sideTheme === 'theme-dark' ? variables.menuText : 'rgba(0,0,0,.65)'"
10 :unique-opened="true" 10 :unique-opened="true"
11 :active-text-color="settings.theme" 11 :active-text-color="settings.theme"
12 :collapse-transition="false" 12 :collapse-transition="false"
1 <template> 1 <template>
2 - <div :class="classObj" class="app-wrapper">  
3 - <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside" />  
4 - <sidebar class="sidebar-container" /> 2 + <div :class="classObj" class="app-wrapper" :style="{'--current-color': theme}">
  3 + <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside"/>
  4 + <sidebar class="sidebar-container" :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBg : variables.menuLightBg }" />
5 <div :class="{hasTagsView:needTagsView}" class="main-container"> 5 <div :class="{hasTagsView:needTagsView}" class="main-container">
6 <div :class="{'fixed-header':fixedHeader}"> 6 <div :class="{'fixed-header':fixedHeader}">
7 <navbar /> 7 <navbar />
@@ -20,6 +20,7 @@ import RightPanel from '@/components/RightPanel' @@ -20,6 +20,7 @@ import RightPanel from '@/components/RightPanel'
20 import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components' 20 import { AppMain, Navbar, Settings, Sidebar, TagsView } from './components'
21 import ResizeMixin from './mixin/ResizeHandler' 21 import ResizeMixin from './mixin/ResizeHandler'
22 import { mapState } from 'vuex' 22 import { mapState } from 'vuex'
  23 +import variables from '@/assets/styles/variables.scss'
23 24
24 export default { 25 export default {
25 name: 'Layout', 26 name: 'Layout',
@@ -34,6 +35,8 @@ export default { @@ -34,6 +35,8 @@ export default {
34 mixins: [ResizeMixin], 35 mixins: [ResizeMixin],
35 computed: { 36 computed: {
36 ...mapState({ 37 ...mapState({
  38 + theme: state => state.settings.theme,
  39 + sideTheme: state => state.settings.sideTheme,
37 sidebar: state => state.app.sidebar, 40 sidebar: state => state.app.sidebar,
38 device: state => state.app.device, 41 device: state => state.app.device,
39 showSettings: state => state.settings.showSettings, 42 showSettings: state => state.settings.showSettings,
@@ -47,6 +50,9 @@ export default { @@ -47,6 +50,9 @@ export default {
47 withoutAnimation: this.sidebar.withoutAnimation, 50 withoutAnimation: this.sidebar.withoutAnimation,
48 mobile: this.device === 'mobile' 51 mobile: this.device === 'mobile'
49 } 52 }
  53 + },
  54 + variables() {
  55 + return variables;
50 } 56 }
51 }, 57 },
52 methods: { 58 methods: {
@@ -2,6 +2,11 @@ module.exports = { @@ -2,6 +2,11 @@ module.exports = {
2 title: '若依管理系统', 2 title: '若依管理系统',
3 3
4 /** 4 /**
  5 + * 侧边栏主题 深色主题theme-dark,浅色主题theme-light
  6 + */
  7 + sideTheme: 'theme-dark',
  8 +
  9 + /**
5 * 是否系统布局配置 10 * 是否系统布局配置
6 */ 11 */
7 showSettings: false, 12 showSettings: false,
1 import variables from '@/assets/styles/element-variables.scss' 1 import variables from '@/assets/styles/element-variables.scss'
2 import defaultSettings from '@/settings' 2 import defaultSettings from '@/settings'
3 3
4 -const { showSettings, tagsView, fixedHeader, sidebarLogo } = defaultSettings 4 +const { sideTheme, showSettings, tagsView, fixedHeader, sidebarLogo } = defaultSettings
5 5
6 const state = { 6 const state = {
7 theme: variables.theme, 7 theme: variables.theme,
  8 + sideTheme: sideTheme,
8 showSettings: showSettings, 9 showSettings: showSettings,
9 tagsView: tagsView, 10 tagsView: tagsView,
10 fixedHeader: fixedHeader, 11 fixedHeader: fixedHeader,
@@ -51,7 +51,7 @@ const user = { @@ -51,7 +51,7 @@ const user = {
51 return new Promise((resolve, reject) => { 51 return new Promise((resolve, reject) => {
52 getInfo(state.token).then(res => { 52 getInfo(state.token).then(res => {
53 const user = res.user 53 const user = res.user
54 - const avatar = user.avatar == "" ? require("@/assets/image/profile.jpg") : process.env.VUE_APP_BASE_API + user.avatar; 54 + const avatar = user.avatar == "" ? require("@/assets/images/profile.jpg") : process.env.VUE_APP_BASE_API + user.avatar;
55 if (res.roles && res.roles.length > 0) { // 验证返回的roles是否是一个非空数组 55 if (res.roles && res.roles.length > 0) { // 验证返回的roles是否是一个非空数组
56 commit('SET_ROLES', res.roles) 56 commit('SET_ROLES', res.roles)
57 commit('SET_PERMISSIONS', res.permissions) 57 commit('SET_PERMISSIONS', res.permissions)
@@ -148,7 +148,7 @@ export default { @@ -148,7 +148,7 @@ export default {
148 justify-content: center; 148 justify-content: center;
149 align-items: center; 149 align-items: center;
150 height: 100%; 150 height: 100%;
151 - background-image: url("../assets/image/login-background.jpg"); 151 + background-image: url("../assets/images/login-background.jpg");
152 background-size: cover; 152 background-size: cover;
153 } 153 }
154 .title { 154 .title {