Commit b639650397409757e50886126ae3d039d9c6e49d

Authored by lzdjack
Committed by GitHub
1 parent 9217a12b

fix: 修复table自适应高度和title属性声明问题 (#1496)

1.修复table升级ant3.0导致无法自适应剩余高度
2.修复table升级ant3.0导致BasicColumn类型的title属性无法找到
src/components/Table/src/hooks/useTableFooter.ts
... ... @@ -8,7 +8,7 @@ export function useTableFooter(
8 8 propsRef: ComputedRef<BasicTableProps>,
9 9 scrollRef: ComputedRef<{
10 10 x: string | number | true;
11   - y: Nullable<number>;
  11 + y: string | number | null;
12 12 scrollToFirstRowOnChange: boolean;
13 13 }>,
14 14 tableElRef: Ref<ComponentRef>,
... ...
src/components/Table/src/hooks/useTableScroll.ts
1 1 import type { BasicTableProps, TableRowSelection, BasicColumn } from '../types/table';
2 2 import type { Ref, ComputedRef } from 'vue';
3   -import { computed, unref, ref, nextTick, watch } from 'vue';
  3 +import { computed, unref, nextTick, watch } from 'vue';
4 4 import { getViewportOffset } from '/@/utils/domUtils';
5 5 import { isBoolean } from '/@/utils/is';
6 6 import { useWindowSizeFn } from '/@/hooks/event/useWindowSizeFn';
... ... @@ -15,8 +15,6 @@ export function useTableScroll(
15 15 rowSelectionRef: ComputedRef<TableRowSelection | null>,
16 16 getDataSourceRef: ComputedRef<Recordable[]>,
17 17 ) {
18   - const tableHeightRef: Ref<Nullable<number>> = ref(null);
19   -
20 18 const modalFn = useModalContext();
21 19  
22 20 // Greater than animation time 280
... ... @@ -43,8 +41,7 @@ export function useTableScroll(
43 41 });
44 42 }
45 43  
46   - function setHeight(height: number) {
47   - tableHeightRef.value = height;
  44 + function setHeight() {
48 45 // Solve the problem of modal adaptive height calculation when the form is placed in the modal
49 46 modalFn?.redoModalHeight?.();
50 47 }
... ... @@ -141,7 +138,7 @@ export function useTableScroll(
141 138 headerHeight;
142 139  
143 140 height = (height > maxHeight! ? (maxHeight as number) : height) ?? height;
144   - setHeight(height);
  141 + setHeight();
145 142  
146 143 bodyEl!.style.height = `${height}px`;
147 144 }
... ... @@ -179,11 +176,10 @@ export function useTableScroll(
179 176 });
180 177  
181 178 const getScrollRef = computed(() => {
182   - const tableHeight = unref(tableHeightRef);
183 179 const { canResize, scroll } = unref(propsRef);
184 180 return {
185 181 x: unref(getScrollX),
186   - y: canResize ? tableHeight : null,
  182 + y: canResize ? '100%' : null,
187 183 scrollToFirstRowOnChange: false,
188 184 ...scroll,
189 185 };
... ...
src/components/Table/src/types/table.ts
1 1 import type { VNodeChild } from 'vue';
2 2 import type { PaginationProps } from './pagination';
3 3 import type { FormProps } from '/@/components/Form';
4   -import type {
5   - ColumnProps,
6   - TableRowSelection as ITableRowSelection,
7   -} from 'ant-design-vue/lib/table/interface';
  4 +import type { TableRowSelection as ITableRowSelection } from 'ant-design-vue/lib/table/interface';
  5 +import type { ColumnProps } from 'ant-design-vue/lib/table';
8 6  
9 7 import { ComponentType } from './componentType';
10 8 import { VueNode } from '/@/utils/propTypes';
... ...