This commit is contained in:
Leo
2026-01-16 20:09:49 +08:00
parent 2ed4625bfd
commit 0053741c05
3 changed files with 8 additions and 46 deletions

View File

@@ -1,7 +1,5 @@
<template>
<div class="navbar">
<hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
<breadcrumb v-if="!topNav" id="breadcrumb-container" class="breadcrumb-container" />
<top-nav v-if="topNav" id="topmenu-container" class="topmenu-container" />
@@ -43,7 +41,6 @@
import { mapGetters } from 'vuex'
import Breadcrumb from '@/components/Breadcrumb'
import TopNav from '@/components/TopNav'
import Hamburger from '@/components/Hamburger'
import Screenfull from '@/components/Screenfull'
import SizeSelect from '@/components/SizeSelect'
import Search from '@/components/HeaderSearch'
@@ -55,7 +52,6 @@ export default {
components: {
Breadcrumb,
TopNav,
Hamburger,
Screenfull,
SizeSelect,
Search,
@@ -64,7 +60,6 @@ export default {
},
computed: {
...mapGetters([
'sidebar',
'avatar',
'device',
'nickName'
@@ -81,9 +76,6 @@ export default {
}
},
methods: {
toggleSideBar() {
this.$store.dispatch('app/toggleSideBar')
},
setLayout(event) {
this.$emit('setLayout')
},
@@ -116,33 +108,6 @@ export default {
padding: 0 5px;
}
.hamburger-container {
line-height: 46px;
height: 100%;
float: left;
cursor: pointer;
transition: background .3s;
-webkit-tap-highlight-color:transparent;
padding: 0 12px;
min-width: 44px; // 增大触摸目标
display: flex;
align-items: center;
justify-content: center;
@media (max-width: 768px) {
line-height: 48px;
padding: 0 10px;
}
&:hover {
background: rgba(0, 0, 0, .025)
}
&:active {
background: rgba(0, 0, 0, .05)
}
}
.breadcrumb-container {
float: left;
@@ -153,10 +118,10 @@ export default {
.topmenu-container {
position: absolute;
left: 50px;
left: 0;
@media (max-width: 768px) {
left: 44px;
left: 0;
}
}

View File

@@ -1,14 +1,14 @@
<template>
<div class="sidebar-logo-container" :class="{'collapse':collapse}">
<transition name="sidebarLogoFade">
<router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
<router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/tools/comment-gen">
<div class="logo-icon">
<i class="el-icon-shopping-cart-2"></i>
<i class="el-icon-chat-line-round"></i>
</div>
</router-link>
<router-link v-else key="expand" class="sidebar-logo-link" to="/">
<router-link v-else key="expand" class="sidebar-logo-link" to="/tools/comment-gen">
<div class="logo-icon">
<i class="el-icon-shopping-cart-2"></i>
<i class="el-icon-chat-line-round"></i>
</div>
<h1 class="sidebar-title">{{ title }}</h1>
</router-link>

View File

@@ -1,10 +1,10 @@
<template>
<div :class="{'has-logo':showLogo}" :style="{ backgroundColor: settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
<logo v-if="showLogo" :collapse="isCollapse" />
<logo v-if="showLogo" :collapse="false" />
<el-scrollbar :class="settings.sideTheme" wrap-class="scrollbar-wrapper">
<el-menu
:default-active="activeMenu"
:collapse="isCollapse"
:collapse="false"
:background-color="settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground"
:text-color="settings.sideTheme === 'theme-dark' ? variables.menuColor : variables.menuLightColor"
:unique-opened="true"
@@ -48,9 +48,6 @@ export default {
},
variables() {
return variables
},
isCollapse() {
return !this.sidebar.opened
}
}
}