Compare commits

...

2 Commits

@ -1,12 +1,13 @@
<template> <template>
<div class="navbar"> <div class="navbar">
<hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" /> <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container"
@toggleClick="toggleSideBar" />
<breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/> <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav" />
<top-nav id="topmenu-container" class="topmenu-container" v-if="topNav"/> <top-nav id="topmenu-container" class="topmenu-container" v-if="topNav" />
<div class="right-menu"> <div class="right-menu">
<template v-if="device!=='mobile'"> <template v-if="device !== 'mobile'">
<search id="header-search" class="right-menu-item" /> <search id="header-search" class="right-menu-item" />
<!-- 站内信 --> <!-- 站内信 -->
@ -38,9 +39,9 @@
<router-link to="/user/profile"> <router-link to="/user/profile">
<el-dropdown-item>个人中心</el-dropdown-item> <el-dropdown-item>个人中心</el-dropdown-item>
</router-link> </router-link>
<el-dropdown-item @click.native="setting = true"> <!-- <el-dropdown-item @click.native="setting = true">
<span>布局设置</span> <span>布局设置</span>
</el-dropdown-item> </el-dropdown-item> -->
<el-dropdown-item divided @click.native="logout"> <el-dropdown-item divided @click.native="logout">
<span>退出登录</span> <span>退出登录</span>
</el-dropdown-item> </el-dropdown-item>
@ -61,7 +62,7 @@ import Search from '@/components/HeaderSearch'
import RuoYiGit from '@/components/RuoYi/Git' import RuoYiGit from '@/components/RuoYi/Git'
import RuoYiDoc from '@/components/RuoYi/Doc' import RuoYiDoc from '@/components/RuoYi/Doc'
import NotifyMessage from '@/layout/components/Message' import NotifyMessage from '@/layout/components/Message'
import {getPath} from "@/utils/ruoyi"; import { getPath } from "@/utils/ruoyi";
export default { export default {
components: { components: {
@ -108,7 +109,7 @@ export default {
this.$store.dispatch('LogOut').then(() => { this.$store.dispatch('LogOut').then(() => {
location.href = getPath('/index'); location.href = getPath('/index');
}) })
}).catch(() => {}); }).catch(() => { });
} }
} }
} }
@ -119,8 +120,8 @@ export default {
height: 50px; height: 50px;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
background: #fff; background: rgba(51, 55, 68, 1);
box-shadow: 0 1px 4px rgba(0,21,41,.08); box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
.hamburger-container { .hamburger-container {
line-height: 46px; line-height: 46px;
@ -128,7 +129,7 @@ export default {
float: left; float: left;
cursor: pointer; cursor: pointer;
transition: background .3s; transition: background .3s;
-webkit-tap-highlight-color:transparent; -webkit-tap-highlight-color: transparent;
&:hover { &:hover {
background: rgba(0, 0, 0, .025) background: rgba(0, 0, 0, .025)
@ -140,10 +141,13 @@ export default {
} }
.topmenu-container { .topmenu-container {
background: rgba(51, 55, 68, 1);
position: absolute; position: absolute;
left: 50px; left: 50px;
} }
.errLog-container { .errLog-container {
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
@ -163,7 +167,7 @@ export default {
padding: 0 8px; padding: 0 8px;
height: 100%; height: 100%;
font-size: 18px; font-size: 18px;
color: #5a5e66; color: rgba(255, 255, 255, 0.8);
vertical-align: text-bottom; vertical-align: text-bottom;
&.hover-effect { &.hover-effect {
@ -175,6 +179,9 @@ export default {
} }
} }
} }
.right-menu-item:hover {
color: rgba(255, 255, 255);
}
.avatar-container { .avatar-container {
margin-right: 30px; margin-right: 30px;
@ -191,7 +198,8 @@ export default {
height: 35px; height: 35px;
border-radius: 50%; border-radius: 50%;
} }
.user-nickname{
.user-nickname {
margin-left: 5px; margin-left: 5px;
font-size: 14px; font-size: 14px;
} }
@ -208,3 +216,29 @@ export default {
} }
} }
</style> </style>
<style lang="scss">
.topmenu-container.el-menu--horizontal>.el-menu-item {
color: rgba(255, 255, 255, 0.8) !important;
}
.topmenu-container.el-menu--horizontal>.el-menu-item:hover {
color: rgba(255, 255, 255) !important;
}
.topmenu-container.el-menu--horizontal > .el-menu-item.is-active {
color: rgba(255, 255, 255) !important;
}
.topmenu-container.el-menu--horizontal > .el-menu-item:not(.is-disabled):hover, .el-menu--horizontal > .el-menu-item:not(.is-disabled):focus{
background-color: rgba(51, 55, 68, 1);
}
.el-menu--horizontal > .el-submenu .el-submenu__title:hover {
background-color: rgba(51, 55, 68, 1);
}
.topmenu-container.el-menu--horizontal > .el-submenu .el-submenu__title {
color: rgba(255, 255, 255, 0.8) !important;
}
.topmenu-container.el-menu--horizontal > .el-submenu .el-submenu__title:hover {
color: rgba(255, 255, 255) !important;
}
.topmenu-container.el-menu--horizontal > .el-submenu.is-active .el-submenu__title {
color: rgba(255, 255, 255) !important;
}
</style>

@ -2,7 +2,16 @@ import defaultSettings from '@/settings'
const { sideTheme, showSettings, topNav, tagsView, fixedHeader, sidebarLogo, dynamicTitle } = defaultSettings const { sideTheme, showSettings, topNav, tagsView, fixedHeader, sidebarLogo, dynamicTitle } = defaultSettings
const storageSetting = JSON.parse(localStorage.getItem('layout-setting')) || '' let storageSetting = JSON.parse(localStorage.getItem('layout-setting')) || ''
storageSetting = {
dynamicTitle: true,
fixedHeader: true,
sideTheme: "theme-light",
sidebarLogo: true,
tagsView: false,
theme: "#409EFF",
topNav: true
}
const state = { const state = {
title: '', title: '',
theme: storageSetting.theme || '#409EFF', theme: storageSetting.theme || '#409EFF',

Loading…
Cancel
Save