DeXun/klp-oa
9
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

隐藏按钮bug修改

Browse Source
This commit is contained in:
jhd
2026-07-01 13:29:08 +08:00
parent 59956764b0
commit aa0f645fc8
3 changed files with 50 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
klp-ui/src/assets/styles/sidebar.scss
View File

@@ -167,14 +167,18 @@
.submenu-title-noDropdown { .submenu-title-noDropdown {
padding: 0 !important; padding: 0 !important;
position: relative;
.el-tooltip { .el-tooltip {
padding: 0 !important; padding: 0 !important;
}
.menu-item-inner {
justify-content: center;
padding: 0;
}
.svg-icon { .svg-icon {
margin-left: 20px; margin: 0;
}
} }
} }
@@ -184,16 +188,20 @@
&>.el-submenu__title { &>.el-submenu__title {
padding: 0 !important; padding: 0 !important;
.menu-item-inner {
justify-content: center;
padding: 0;
}
.svg-icon { .svg-icon {
margin-left: 20px; margin: 0;
} }
} }
} }
.el-menu--collapse { .el-menu--collapse {
.el-submenu { .el-menu-item .menu-title,
&>.el-submenu__title { .el-submenu .el-submenu__title .menu-title {
&>span {
height: 0; height: 0;
width: 0; width: 0;
overflow: hidden; overflow: hidden;
@@ -202,8 +210,6 @@
} }
} }
} }
}
}
.el-menu--collapse .el-menu .el-submenu { .el-menu--collapse .el-menu .el-submenu {
min-width: $base-sidebar-width !important; min-width: $base-sidebar-width !important;

32
klp-ui/src/layout/components/Sidebar/Logo.vue
View File

@@ -1,15 +1,9 @@
<template> <template>
<div class="sidebar-logo-container" :class="{'collapse':collapse}" :style="{ backgroundColor: '#fff'}"> <div class="sidebar-logo-container" :class="{'collapse':collapse}" :style="{ backgroundColor: '#fff'}">
<transition name="sidebarLogoFade"> <router-link class="sidebar-logo-link" to="/">
<router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/"> <img :src="logo" class="sidebar-logo" />
<img v-if="logo" :src="logo" class="sidebar-logo" />
<h1 v-else class="sidebar-title">{{ title }} </h1>
</router-link>
<router-link v-else key="expand" class="sidebar-logo-link" to="/">
<img v-if="logo" :src="logo" class="sidebar-logo" />
<h1 class="sidebar-title">{{ title }} </h1> <h1 class="sidebar-title">{{ title }} </h1>
</router-link> </router-link>
</transition>
</div> </div>
</template> </template>
@@ -43,15 +37,6 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.sidebarLogoFade-enter-active {
transition: opacity 1.5s;
}
.sidebarLogoFade-enter,
.sidebarLogoFade-leave-to {
opacity: 0;
}
.sidebar-logo-container { .sidebar-logo-container {
position: relative; position: relative;
width: 100%; width: 100%;
@@ -85,8 +70,19 @@ export default {
} }
&.collapse { &.collapse {
.sidebar-logo-link {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
}
.sidebar-logo { .sidebar-logo {
margin-right: 0px; width: 28px;
height: 28px;
margin-right: 0;
}
.sidebar-title {
display: none;
} }
} }
} }

18
klp-ui/src/layout/components/Sidebar/index.vue
View File

@@ -264,7 +264,7 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 26px; font-size: 66px;
color: #555; color: #555;
.section-logo { .section-logo {
@@ -293,14 +293,22 @@ export default {
} }
&.is-collapse { &.is-collapse {
padding: 0 6px; padding: 0;
justify-content: center; justify-content: center;
.section-icon { .section-title-inner {
margin-right: 0; justify-content: center;
width: auto;
} }
.section-title-right, .section-icon {
margin: 0;
width: 36px;
height: 36px;
font-size: 24px;
}
.section-module,
.section-arrow { .section-arrow {
display: none; display: none;
} }