提交 | 用户 | age
|
a1ffb6
|
1 |
import type { PaginationProps } from '../types/pagination'; |
V |
2 |
import type { BasicTableProps } from '../types/table'; |
d6f65d
|
3 |
import { computed, unref, ref, ComputedRef, watch } from 'vue'; |
faf3f4
|
4 |
import { LeftOutlined, RightOutlined } from '@ant-design/icons-vue'; |
a1ffb6
|
5 |
import { isBoolean } from '/@/utils/is'; |
faf3f4
|
6 |
import { PAGE_SIZE, PAGE_SIZE_OPTIONS } from '../const'; |
dc09de
|
7 |
import { useI18n } from '/@/hooks/web/useI18n'; |
V |
8 |
|
354904
|
9 |
interface ItemRender { |
V |
10 |
page: number; |
|
11 |
type: 'page' | 'prev' | 'next'; |
|
12 |
originalElement: any; |
|
13 |
} |
|
14 |
|
|
15 |
function itemRender({ page, type, originalElement }: ItemRender) { |
|
16 |
if (type === 'prev') { |
|
17 |
return page === 0 ? null : <LeftOutlined />; |
|
18 |
} else if (type === 'next') { |
|
19 |
return page === 1 ? null : <RightOutlined />; |
|
20 |
} |
|
21 |
return originalElement; |
|
22 |
} |
|
23 |
|
faf3f4
|
24 |
export function usePagination(refProps: ComputedRef<BasicTableProps>) { |
391da9
|
25 |
const { t } = useI18n(); |
faf3f4
|
26 |
|
391da9
|
27 |
const configRef = ref<PaginationProps>({}); |
a2c89d
|
28 |
const show = ref(true); |
V |
29 |
|
d6f65d
|
30 |
watch( |
L |
31 |
() => unref(refProps).pagination, |
|
32 |
(pagination) => { |
|
33 |
if (!isBoolean(pagination) && pagination) { |
|
34 |
configRef.value = { |
|
35 |
...unref(configRef), |
|
36 |
...(pagination ?? {}), |
|
37 |
}; |
|
38 |
} |
|
39 |
}, |
|
40 |
); |
e32789
|
41 |
|
354904
|
42 |
const getPaginationInfo = computed((): PaginationProps | boolean => { |
V |
43 |
const { pagination } = unref(refProps); |
|
44 |
|
a2c89d
|
45 |
if (!unref(show) || (isBoolean(pagination) && !pagination)) { |
faf3f4
|
46 |
return false; |
陈 |
47 |
} |
a2c89d
|
48 |
|
faf3f4
|
49 |
return { |
陈 |
50 |
current: 1, |
|
51 |
pageSize: PAGE_SIZE, |
|
52 |
size: 'small', |
|
53 |
defaultPageSize: PAGE_SIZE, |
962f90
|
54 |
showTotal: (total) => t('component.table.total', { total }), |
faf3f4
|
55 |
showSizeChanger: true, |
陈 |
56 |
pageSizeOptions: PAGE_SIZE_OPTIONS, |
354904
|
57 |
itemRender: itemRender, |
faf3f4
|
58 |
showQuickJumper: true, |
陈 |
59 |
...(isBoolean(pagination) ? {} : pagination), |
|
60 |
...unref(configRef), |
|
61 |
}; |
|
62 |
}); |
|
63 |
|
|
64 |
function setPagination(info: Partial<PaginationProps>) { |
354904
|
65 |
const paginationInfo = unref(getPaginationInfo); |
faf3f4
|
66 |
configRef.value = { |
354904
|
67 |
...(!isBoolean(paginationInfo) ? paginationInfo : {}), |
faf3f4
|
68 |
...info, |
陈 |
69 |
}; |
|
70 |
} |
354904
|
71 |
|
V |
72 |
function getPagination() { |
|
73 |
return unref(getPaginationInfo); |
|
74 |
} |
a2c89d
|
75 |
|
V |
76 |
function getShowPagination() { |
|
77 |
return unref(show); |
|
78 |
} |
|
79 |
|
|
80 |
async function setShowPagination(flag: boolean) { |
|
81 |
show.value = flag; |
|
82 |
} |
|
83 |
|
|
84 |
return { getPagination, getPaginationInfo, setShowPagination, getShowPagination, setPagination }; |
faf3f4
|
85 |
} |