92 lines
		
	
	
		
			2.9 KiB
		
	
	
	
		
			TypeScript
		
	
	
			
		
		
	
	
			92 lines
		
	
	
		
			2.9 KiB
		
	
	
	
		
			TypeScript
		
	
	
| import useState from '../../_util/hooks/useState';
 | |
| import type { Ref } from 'vue';
 | |
| import { computed } from 'vue';
 | |
| import type { PaginationProps } from '../../pagination';
 | |
| import type { TablePaginationConfig } from '../interface';
 | |
| import extendsObject from '../../_util/extendsObject';
 | |
| 
 | |
| export const DEFAULT_PAGE_SIZE = 10;
 | |
| 
 | |
| export function getPaginationParam(
 | |
|   mergedPagination: TablePaginationConfig,
 | |
|   pagination: TablePaginationConfig | boolean | undefined,
 | |
| ) {
 | |
|   const param: any = {
 | |
|     current: mergedPagination.current,
 | |
|     pageSize: mergedPagination.pageSize,
 | |
|   };
 | |
|   const paginationObj = pagination && typeof pagination === 'object' ? pagination : {};
 | |
| 
 | |
|   Object.keys(paginationObj).forEach(pageProp => {
 | |
|     const value = (mergedPagination as any)[pageProp];
 | |
| 
 | |
|     if (typeof value !== 'function') {
 | |
|       param[pageProp] = value;
 | |
|     }
 | |
|   });
 | |
| 
 | |
|   return param;
 | |
| }
 | |
| 
 | |
| export default function usePagination(
 | |
|   totalRef: Ref<number>,
 | |
|   paginationRef: Ref<TablePaginationConfig | false | undefined>,
 | |
|   onChange: (current: number, pageSize: number) => void,
 | |
| ): [Ref<TablePaginationConfig>, () => void] {
 | |
|   const pagination = computed(() =>
 | |
|     paginationRef.value && typeof paginationRef.value === 'object' ? paginationRef.value : {},
 | |
|   );
 | |
|   const paginationTotal = computed(() => pagination.value.total || 0);
 | |
|   const [innerPagination, setInnerPagination] = useState<{
 | |
|     current?: number;
 | |
|     pageSize?: number;
 | |
|   }>(() => ({
 | |
|     current: 'defaultCurrent' in pagination.value ? pagination.value.defaultCurrent : 1,
 | |
|     pageSize:
 | |
|       'defaultPageSize' in pagination.value ? pagination.value.defaultPageSize : DEFAULT_PAGE_SIZE,
 | |
|   }));
 | |
| 
 | |
|   // ============ Basic Pagination Config ============
 | |
|   const mergedPagination = computed(() => {
 | |
|     const mP = extendsObject<Partial<TablePaginationConfig>>(
 | |
|       innerPagination.value,
 | |
|       pagination.value,
 | |
|       {
 | |
|         total: paginationTotal.value > 0 ? paginationTotal.value : totalRef.value,
 | |
|       },
 | |
|     );
 | |
|     // Reset `current` if data length or pageSize changed
 | |
|     const maxPage = Math.ceil((paginationTotal.value || totalRef.value) / mP.pageSize!);
 | |
|     if (mP.current! > maxPage) {
 | |
|       // Prevent a maximum page count of 0
 | |
|       mP.current = maxPage || 1;
 | |
|     }
 | |
|     return mP;
 | |
|   });
 | |
| 
 | |
|   const refreshPagination = (current?: number, pageSize?: number) => {
 | |
|     if (paginationRef.value === false) return;
 | |
|     setInnerPagination({
 | |
|       current: current ?? 1,
 | |
|       pageSize: pageSize || mergedPagination.value.pageSize,
 | |
|     });
 | |
|   };
 | |
| 
 | |
|   const onInternalChange: PaginationProps['onChange'] = (current, pageSize) => {
 | |
|     if (paginationRef.value) {
 | |
|       pagination.value.onChange?.(current, pageSize);
 | |
|     }
 | |
|     refreshPagination(current, pageSize);
 | |
|     onChange(current, pageSize || mergedPagination.value.pageSize);
 | |
|   };
 | |
| 
 | |
|   return [
 | |
|     computed(() => {
 | |
|       return paginationRef.value === false
 | |
|         ? {}
 | |
|         : { ...mergedPagination.value, onChange: onInternalChange };
 | |
|     }),
 | |
|     refreshPagination,
 | |
|   ];
 | |
| }
 |