mirrors/nocobase
1
0
Fork 0
mirror of https://github.com/nocobase/nocobase synced 2024-11-16 01:17:43 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

perf(Table): improve pagination performance

Browse Source
This commit is contained in:
Zeke Zhang 2024-10-31 21:08:52 +08:00
parent c5bd4ce6af
commit d954d565e4
2 changed files with 25 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
packages/core/client/src/modules/blocks/data-blocks/table/hooks/useTableBlockProps.tsx
View File

@ -10,7 +10,7 @@
import { ArrayField } from '@formily/core';
import { useField, useFieldSchema } from '@formily/react';
import { isEqual } from 'lodash';
import { useCallback, useEffect, useRef } from 'react';
import { useCallback, useEffect, useMemo, useRef } from 'react';
import { useTableBlockContext } from '../../../../../block-provider/TableBlockProvider';
import { findFilterTargets } from '../../../../../block-provider/hooks';
import { DataBlock, useFilterBlock } from '../../../../../filter-provider/FilterProvider';
@ -26,12 +26,20 @@ export const useTableBlockProps = () => {
const ctxRef = useRef(null);
ctxRef.current = ctx;
const meta = ctx?.service?.data?.meta || {};
const pagination = useMemo(
() => ({
pageSize: meta?.pageSize,
total: meta?.count,
current: meta?.page,
}),
[meta?.count, meta?.page, meta?.pageSize],
);
useEffect(() => {
if (!isLoading) {
const serviceResponse = ctx?.service?.data;
const data = serviceResponse?.data || [];
const meta = serviceResponse?.meta || {};
const selectedRowKeys = ctx?.field?.data?.selectedRowKeys;
if (!isEqual(field.value, data)) {
@ -44,12 +52,9 @@ export const useTableBlockProps = () => {
field.data.selectedRowKeys = selectedRowKeys;
}
field.componentProps.pagination = field.componentProps.pagination || {};
field.componentProps.pagination.pageSize = meta?.pageSize;
field.componentProps.pagination.total = meta?.count;
field.componentProps.pagination.current = meta?.page;
field.componentProps.pagination = pagination;
}
}, [field, ctx?.service?.data, isLoading, ctx?.field?.data?.selectedRowKeys]);
}, [field, ctx?.service?.data, isLoading, ctx?.field?.data?.selectedRowKeys, pagination]);
return {
defaultDataSource: ctx?.service?.data?.data || [],
@ -59,7 +64,7 @@ export const useTableBlockProps = () => {
showIndex: ctx.showIndex,
dragSort: ctx.dragSort && ctx.dragSortBy,
rowKey: ctx.rowKey || fieldSchema?.['x-component-props']?.rowKey || 'id',
pagination: fieldSchema?.['x-component-props']?.pagination === false ? false : field.componentProps.pagination,
pagination: fieldSchema?.['x-component-props']?.pagination === false ? false : pagination,
onRowSelectionChange: useCallback((selectedRowKeys, selectedRowData) => {
ctx.field.data = ctx?.field?.data || {};
ctx.field.data.selectedRowKeys = selectedRowKeys;

19
packages/core/client/src/schema-component/antd/table-v2/Table.tsx
View File

@ -308,14 +308,19 @@ const usePaginationProps = (pagination1, pagination2) => {
},
[t, totalCount],
);
const showTotalResult = useMemo(() => {
return {
pageSizeOptions,
showTotal,
showSizeChanger: true,
...pagination,
};
}, [pagination, showTotal]);
const result = useMemo(() => {
if (totalCount) {
return {
pageSizeOptions,
showTotal,
showSizeChanger: true,
...pagination,
};
return showTotalResult;
} else {
return {
pageSizeOptions,
@ -351,7 +356,7 @@ const usePaginationProps = (pagination1, pagination2) => {
},
};
}
}, [pagination, t, showTotal, field.value?.length]);
}, [pagination, t, showTotal, field.value?.length, showTotalResult]);
if (pagination2 === false) {
return false;