fix(table): scrollbar style
This commit is contained in:
parent
f4778431de
commit
d8c38207c0
|
|
@ -68,6 +68,23 @@ export function useTableScroll(
|
||||||
bodyEl = tableEl.querySelector('.ant-table-body');
|
bodyEl = tableEl.querySelector('.ant-table-body');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const hasScrollBarY = bodyEl.scrollHeight > bodyEl.clientHeight;
|
||||||
|
const hasScrollBarX = bodyEl.scrollWidth > bodyEl.clientWidth;
|
||||||
|
|
||||||
|
if (hasScrollBarY) {
|
||||||
|
tableEl.classList.contains('hide-scrollbar-y') &&
|
||||||
|
tableEl.classList.remove('hide-scrollbar-y');
|
||||||
|
} else {
|
||||||
|
!tableEl.classList.contains('hide-scrollbar-y') && tableEl.classList.add('hide-scrollbar-y');
|
||||||
|
}
|
||||||
|
|
||||||
|
if (hasScrollBarX) {
|
||||||
|
tableEl.classList.contains('hide-scrollbar-x') &&
|
||||||
|
tableEl.classList.remove('hide-scrollbar-x');
|
||||||
|
} else {
|
||||||
|
!tableEl.classList.contains('hide-scrollbar-x') && tableEl.classList.add('hide-scrollbar-x');
|
||||||
|
}
|
||||||
|
|
||||||
bodyEl!.style.height = 'unset';
|
bodyEl!.style.height = 'unset';
|
||||||
|
|
||||||
if (!unref(getCanResize) || tableData.length === 0) return;
|
if (!unref(getCanResize) || tableData.length === 0) return;
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
|
|
||||||
// fix table unnecessary scrollbar
|
// fix table unnecessary scrollbar
|
||||||
.@{prefix-cls} {
|
.@{prefix-cls} {
|
||||||
.ant-table-wrapper {
|
.hide-scrollbar-y {
|
||||||
.ant-spin-nested-loading {
|
.ant-spin-nested-loading {
|
||||||
.ant-spin-container {
|
.ant-spin-container {
|
||||||
.ant-table {
|
.ant-table {
|
||||||
|
|
@ -13,7 +13,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-table-body {
|
.ant-table-body {
|
||||||
overflow: auto !important;
|
overflow-y: auto !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -24,6 +24,50 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.ant-table-fixed-left {
|
||||||
|
.ant-table-body-outer {
|
||||||
|
.ant-table-body-inner {
|
||||||
|
overflow-y: auto !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hide-scrollbar-x {
|
||||||
|
.ant-spin-nested-loading {
|
||||||
|
.ant-spin-container {
|
||||||
|
.ant-table {
|
||||||
|
.ant-table-content {
|
||||||
|
.ant-table-scroll {
|
||||||
|
.ant-table-hide-scrollbar {
|
||||||
|
//overflow-x: auto !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table-body {
|
||||||
|
overflow: auto !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table-fixed-right {
|
||||||
|
.ant-table-body-outer {
|
||||||
|
.ant-table-body-inner {
|
||||||
|
overflow-x: auto !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-table-fixed-left {
|
||||||
|
.ant-table-body-outer {
|
||||||
|
.ant-table-body-inner {
|
||||||
|
overflow-x: auto !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue