import type { PaginationProps } from '../types/pagination'; import type { BasicTableProps } from '../types/table'; import { computed, unref, ref, ComputedRef, watchEffect } from 'vue'; import { isBoolean } from '@/utils/is'; import { DEFAULTPAGESIZE, PAGESIZES, APISETTING } from '../const'; export function usePagination(refProps: ComputedRef) { const configRef = ref({}); const show = ref(true); watchEffect(() => { const { pagination } = unref(refProps); if (!isBoolean(pagination) && pagination) { configRef.value = { ...unref(configRef), ...(pagination ?? {}), }; } }); const getPaginationInfo = computed((): PaginationProps | boolean => { const { pagination } = unref(refProps); if (!unref(show) || (isBoolean(pagination) && !pagination)) { return false; } const { totalField, countField } = APISETTING; const pageCount = unref(configRef)[totalField] || undefined; const itemCount = unref(configRef)[countField] || 0; return pageCount ? { current: 1, //当前页 pageSize: DEFAULTPAGESIZE, //分页大小 pageSizeOptions: PAGESIZES, // 每页条数 showSizeChanger: true, showQuickJumper: true, size: 'middle', ...(isBoolean(pagination) ? {} : pagination), ...unref(configRef), showTotal: () => `共 ${itemCount} 条`, total: itemCount, } : false; }); function setPagination(info: Partial) { const paginationInfo = unref(getPaginationInfo); configRef.value = { ...(!isBoolean(paginationInfo) ? paginationInfo : {}), ...info, }; } function getPagination() { return unref(getPaginationInfo); } function getShowPagination() { return unref(show); } async function setShowPagination(flag: boolean) { show.value = flag; } return { getPagination, getPaginationInfo, setShowPagination, getShowPagination, setPagination }; }