canrd-outside / order-erp-front · Commits

Commit 6095cb54afe3f4fcabbfff26ac6704ecfbbddae5

Authored by Vben
1 parent 2c6aa852

fix(table): ensure that the height calculation is normal close #349

Inline Side-by-side
Showing 1 changed file with 16 additions and 14 deletions
src/components/Table/src/hooks/useTableScroll.ts
  View file @6095cb5
... ... @@ -23,7 +23,7 @@ export function useTableScroll(
23 23 const modalFn = useModalContext();
24 24  
25 25 // Greater than animation time 280
26   - const [debounceRedoHeight] = useDebounce(redoHeight, 200);
  26 + const [debounceRedoHeight] = useDebounce(redoHeight, 100);
27 27  
28 28 const getCanResize = computed(() => {
29 29 const { canResize, scroll } = unref(propsRef);
... ... @@ -41,11 +41,9 @@ export function useTableScroll(
41 41 );
42 42  
43 43 function redoHeight() {
44   - if (unref(getCanResize)) {
45   - nextTick(() => {
46   - calcTableHeight();
47   - });
48   - }
  44 + nextTick(() => {
  45 + calcTableHeight();
  46 + });
49 47 }
50 48  
51 49 function setHeight(heigh: number) {
... ... @@ -63,15 +61,23 @@ export function useTableScroll(
63 61 const { resizeHeightOffset, pagination, maxHeight } = unref(propsRef);
64 62 const tableData = unref(getDataSourceRef);
65 63  
66   - if (!unref(getCanResize) || tableData.length === 0) return;
67   -
68   - await nextTick();
69   - //Add a delay to get the correct bottomIncludeBody paginationHeight footerHeight headerHeight
70 64 const table = unref(tableElRef);
71 65 if (!table) return;
72 66  
73 67 const tableEl: Element = table.$el;
74 68 if (!tableEl) return;
  69 +
  70 + if (!bodyEl) {
  71 + bodyEl = tableEl.querySelector('.ant-table-body');
  72 + }
  73 +
  74 + bodyEl!.style.height = 'unset';
  75 +
  76 + if (!unref(getCanResize) || tableData.length === 0) return;
  77 +
  78 + await nextTick();
  79 + //Add a delay to get the correct bottomIncludeBody paginationHeight footerHeight headerHeight
  80 +
75 81 const headEl = tableEl.querySelector('.ant-table-thead ');
76 82  
77 83 if (!headEl) return;
... ... @@ -124,10 +130,6 @@ export function useTableScroll(
124 130 height = (height > maxHeight! ? (maxHeight as number) : height) ?? height;
125 131 setHeight(height);
126 132  
127   - if (!bodyEl) {
128   - bodyEl = tableEl.querySelector('.ant-table-body');
129   - }
130   -
131 133 bodyEl!.style.height = `${height}px`;
132 134 }
133 135 useWindowSizeFn(calcTableHeight, 280);
... ...