From d562ff2988f10effb74a792a393ced94828cdc08 Mon Sep 17 00:00:00 2001 From: zhaojisen <1301338853@qq.com> Date: Wed, 22 Jul 2026 16:13:13 +0800 Subject: [PATCH] fix: tree scroll --- .../asset-tree/asset-tree.component.scss | 23 ++++++++-- .../elements/left-bar/left-bar.component.scss | 43 ++++++++++++++++--- 2 files changed, 56 insertions(+), 10 deletions(-) diff --git a/src/app/elements/asset-tree/asset-tree.component.scss b/src/app/elements/asset-tree/asset-tree.component.scss index 961bc6f7d..2e6a619b0 100644 --- a/src/app/elements/asset-tree/asset-tree.component.scss +++ b/src/app/elements/asset-tree/asset-tree.component.scss @@ -11,13 +11,25 @@ @content; } +:host { + display: block; + height: 100%; + min-height: 0; + overflow: hidden; +} + .tree-container { display: flex; flex-direction: column; height: 100%; + min-height: 0; + overflow: hidden; background-color: var(--el-asset-tree-bg-color); .tree-type { + flex: 0 0 30px; + min-height: 30px; + overflow: hidden; transition: all 0.3s; .tree-type-banner { @@ -141,9 +153,10 @@ .tree-type-content { position: relative; + flex: 1 1 auto; padding: 1px; - min-height: 40px; - height: calc(100% - 31px); + min-height: 0; + height: auto; background-color: var(--el-asset-tree-bg-color); overflow: hidden; scrollbar-gutter: stable both-edges; @@ -170,7 +183,11 @@ } &.expand-tree { - height: calc(100% - 31px); + display: flex; + flex: 1 1 0; + flex-direction: column; + min-height: 0; + height: auto; } } } diff --git a/src/app/elements/left-bar/left-bar.component.scss b/src/app/elements/left-bar/left-bar.component.scss index 1dbc99774..4e9a52358 100644 --- a/src/app/elements/left-bar/left-bar.component.scss +++ b/src/app/elements/left-bar/left-bar.component.scss @@ -1,10 +1,23 @@ +:host { + display: block; + height: 100%; + min-height: 0; +} + .sidebar { + display: flex; + flex-direction: column; height: 100%; + min-height: 0; width: 100%; overflow: hidden; .tree { - display: block; + display: flex; + flex: 1 1 auto; + flex-direction: column; + min-height: 0; + overflow: hidden; } .menu-icon { @@ -22,11 +35,16 @@ .menu-icon { display: block; + flex: 1 1 auto; + min-height: 0; + height: auto; + overflow-y: auto; } } .organization { display: flex; + flex: 0 0 30px; flex-direction: column; justify-content: center; height: 30px; @@ -42,26 +60,37 @@ } .my-assets { - height: calc(100vh - 61px); + flex: 1 1 auto; + min-height: 0; + height: auto; + overflow: hidden; color: var(--el-text-color-light); - &.has-org { - height: calc(100vh - 91px); - } - .overflow { display: flex; width: 100%; height: 100%; + min-height: 0; } .ngx-scroll-overlay { - overflow: auto; // for FF + // The tree content owns vertical scrolling. A scrollable wrapper here + // creates a second scrollbar when more tree sections are added. + overflow: hidden; + } + + elements-asset-tree { + display: block; + flex: 1 1 auto; + min-height: 0; + height: 100%; + overflow: hidden; } } .footer-version { display: flex; + flex: 0 0 30px; align-items: center; line-height: 30px; font-size: 9pt;