diff --git a/inquiry-backend/src/views/inquiry/styles/admin-fidelity.css b/inquiry-backend/src/views/inquiry/styles/admin-fidelity.css index 39c5cfb..e74a1e0 100644 --- a/inquiry-backend/src/views/inquiry/styles/admin-fidelity.css +++ b/inquiry-backend/src/views/inquiry/styles/admin-fidelity.css @@ -33,29 +33,68 @@ body { .main-stage { background: #f7f8fb !important; min-width: 0 !important; - /* 主区锁视口高度:列表页表格区内滚;看板等非列表页在 .admin-content 内滚 */ + /* + * 中间主区 = 滚动容器(看板/非列表页)。 + * 实测仅改 .admin-content 在生产壳层仍会被裁切且无条;改由本列横竖自滚最稳。 + */ height: 100vh !important; max-height: 100vh !important; min-height: 0 !important; - overflow: hidden !important; + overflow-x: auto !important; + overflow-y: scroll !important; + scrollbar-gutter: stable; + -webkit-overflow-scrolling: touch; display: flex !important; flex-direction: column !important; } +.main-stage { + scrollbar-width: thin; + scrollbar-color: #cbd5e1 transparent; +} +.main-stage::-webkit-scrollbar { + width: 6px; + height: 6px; +} +.main-stage::-webkit-scrollbar-thumb { + background: #cbd5e1; + border-radius: 999px; + border: 1px solid transparent; + background-clip: padding-box; +} +.main-stage::-webkit-scrollbar-thumb:hover { + background: #94a3b8; + background-clip: padding-box; +} +.main-stage::-webkit-scrollbar-track { + background: transparent; +} +.main-stage::-webkit-scrollbar-corner { + background: transparent; +} + .admin-content { padding: 16px 16px 40px !important; gap: 12px !important; min-width: 0 !important; - /* - * flex-basis:0:先按剩余视口占高,再在区内滚动。 - * 若用 1 1 auto,内容区会先被看板撑满,再被 .main-stage 裁掉 → 右侧无滚动条、滚轮无效。 - */ - flex: 1 1 0 !important; + /* 随内容增高/增宽;滚动条在 .main-stage */ + flex: 0 0 auto !important; + height: auto !important; + max-height: none !important; min-height: 0 !important; + overflow: visible !important; +} + +/* 列表页:主区不滚,仍由表格区内滚(工单/账号等) */ +.main-stage:has(.is-list-page) { + overflow: hidden !important; +} +.main-stage:has(.is-list-page) .admin-content { + flex: 1 1 0 !important; height: 0 !important; - overflow-x: hidden !important; - overflow-y: auto !important; - -webkit-overflow-scrolling: touch; + min-height: 0 !important; + max-height: none !important; + overflow: hidden !important; } /* @@ -71,6 +110,12 @@ body { display: flex !important; align-items: center !important; border-bottom: 1px solid #e8edf4 !important; + /* 中间主区滚动时顶栏吸顶,不跟着内容滚走 */ + position: sticky !important; + top: 0 !important; + z-index: 40 !important; + flex-shrink: 0 !important; + background: rgba(255, 255, 255, 0.96) !important; } .admin-brand { @@ -1079,9 +1124,18 @@ h6 { .admin-content:has(.ref-surface--metrics) { padding: 14px 14px 36px !important; gap: 10px !important; - /* 分析看板:明确在内容区竖滚,避免被列表页 overflow:hidden 规则误伤 */ - overflow-x: hidden !important; - overflow-y: auto !important; + /* 分析看板:内容区不裁切,滚动交给 .main-stage */ + overflow: visible !important; + max-height: none !important; +} + +/* 看板缩窄时允许卡片/图表收缩,避免右侧被裁且无横滚 */ +.admin-content .ref-surface, +.admin-content .ref-charts-section, +.admin-content .ref-metrics-grid, +.admin-content .ref-chart-panel { + min-width: 0 !important; + max-width: 100% !important; } /* ---- 话术 ---- */