From 8efe771cc70f530992af95f672ff1167c5b30402 Mon Sep 17 00:00:00 2001
From: birt <2499248221@qq.com>
Date: 星期日, 13 四月 2025 12:56:00 +0800
Subject: [PATCH] 123
---
zhitan-vue/src/assets/styles/index.scss | 20 ++++++++++++++++++++
zhitan-vue/src/assets/styles/sidebar.scss | 3 ++-
zhitan-vue/src/layout/components/Sidebar/index.vue | 37 ++++++++++++++++++++++++++++++++++---
3 files changed, 56 insertions(+), 4 deletions(-)
diff --git a/zhitan-vue/src/assets/styles/index.scss b/zhitan-vue/src/assets/styles/index.scss
index 7a592be..9ef36a6 100644
--- a/zhitan-vue/src/assets/styles/index.scss
+++ b/zhitan-vue/src/assets/styles/index.scss
@@ -205,4 +205,24 @@
// ::v-deep(.el-range-separator) {
color: #999 !important;
}
+}
+
+/* 鍏ㄥ眬婊氬姩鏉℃牱寮� */
+::-webkit-scrollbar {
+ width: 6px;
+ height: 6px;
+}
+
+::-webkit-scrollbar-track {
+ background-color: rgba(0, 0, 0, 0.05);
+ border-radius: 10px;
+}
+
+::-webkit-scrollbar-thumb {
+ background-color: rgba(144, 147, 153, 0.3);
+ border-radius: 10px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+ background-color: rgba(144, 147, 153, 0.5);
}
\ No newline at end of file
diff --git a/zhitan-vue/src/assets/styles/sidebar.scss b/zhitan-vue/src/assets/styles/sidebar.scss
index a698226..2a62f02 100644
--- a/zhitan-vue/src/assets/styles/sidebar.scss
+++ b/zhitan-vue/src/assets/styles/sidebar.scss
@@ -51,10 +51,11 @@
.scrollbar-wrapper {
overflow-x: hidden !important;
+ height: calc(100% - 290px) !important;
}
.el-scrollbar__bar.is-vertical {
- right: 0px;
+ right: 0 !important;
}
.el-scrollbar {
diff --git a/zhitan-vue/src/layout/components/Sidebar/index.vue b/zhitan-vue/src/layout/components/Sidebar/index.vue
index 603f4f2..b446637 100644
--- a/zhitan-vue/src/layout/components/Sidebar/index.vue
+++ b/zhitan-vue/src/layout/components/Sidebar/index.vue
@@ -2,8 +2,9 @@
<div
:class="{ 'has-logo': showLogo }"
:style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }"
+ class="sidebar-container-wrapper"
>
- <el-scrollbar :class="sideTheme" wrap-class="scrollbar-wrapper">
+ <el-scrollbar :class="sideTheme" wrap-class="scrollbar-wrapper" view-class="scrollbar-view">
<!-- 棣栭〉鏃朵笉鏄剧ず浠讳綍鑿滃崟椤� -->
<el-menu
v-if="!isHomePage"
@@ -152,9 +153,38 @@
}
</script>
<style lang="scss" scoped>
+.sidebar-container-wrapper {
+ position: relative;
+ height: 100%;
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+}
+
+:deep(.scrollbar-wrapper) {
+ height: calc(100% - 290px) !important;
+ overflow-x: hidden !important;
+}
+
+:deep(.scrollbar-view) {
+ height: 100%;
+}
+
+:deep(.el-scrollbar__bar.is-vertical) {
+ right: 0;
+ width: 6px;
+}
+
+:deep(.el-scrollbar__thumb) {
+ background-color: rgba(144, 147, 153, 0.3);
+ &:hover {
+ background-color: rgba(144, 147, 153, 0.5);
+ }
+}
+
:deep(.custom-menu) {
padding: 6px 0;
- height: calc(100% - 150px); // 鐣欏嚭搴曢儴鐢ㄦ埛鍖哄煙鐨勭┖闂�
+ height: auto !important; // 鏀逛负鑷�傚簲楂樺害锛岄伩鍏嶅浐瀹氶珮搴﹀鑷村唴瀹规孩鍑�
// Override Element Plus default menu styles
.el-menu-item {
@@ -209,7 +239,8 @@
// 棣栭〉绌虹櫧鑿滃崟鍖哄煙鏍峰紡
.home-empty-menu {
- height: calc(100% - 150px);
+ height: auto;
+ min-height: 100px;
}
// 搴曢儴鐢ㄦ埛鍖哄煙鏍峰紡
--
Gitblit v1.9.3