106 lines
3.5 KiB
JavaScript
106 lines
3.5 KiB
JavaScript
import { useAntdTable } from "ahooks";
|
||
import useUrlQueryCriteria from "../useUrlQueryCriteria";
|
||
|
||
/**
|
||
* 获取数据
|
||
*/
|
||
function getService(service, getExtraParams = {}, transform) {
|
||
// 获取额外的参数
|
||
const extraParams = (typeof getExtraParams === "function" ? getExtraParams() : getExtraParams) || {};
|
||
// 获取数据
|
||
return async ({ current, pageSize }, formData = {}) => {
|
||
// 如果提供了 transform 函数,则在请求之前调用它
|
||
let transformedFormData = formData;
|
||
if (typeof transform === "function") {
|
||
const transformResult = transform(formData);
|
||
// 如果 transform 函数有返回值,则将其与原始表单数据合并,transform 的优先级更高
|
||
if (transformResult && typeof transformResult === "object") {
|
||
transformedFormData = { ...formData, ...transformResult };
|
||
}
|
||
}
|
||
|
||
// 发起请求
|
||
const res = await service({
|
||
pageIndex: current,
|
||
pageSize,
|
||
...transformedFormData,
|
||
...extraParams,
|
||
});
|
||
// 返回数据
|
||
return {
|
||
list: res.data || [],
|
||
total: res.totalCount || 0,
|
||
...res,
|
||
};
|
||
};
|
||
}
|
||
|
||
/**
|
||
* 自定义 useTable,继承 ahooks 的 useAntdTable,根据需求进行扩展
|
||
*/
|
||
function useTable(service, options) {
|
||
if (!service)
|
||
throw new Error("请传入 service");
|
||
|
||
// 获取额外参数和转换函数
|
||
const { params: extraParams, transform, ...restOptions } = options || {};
|
||
|
||
// 获取配置项
|
||
const {
|
||
useStorageQueryCriteria = true,
|
||
usePagination = true,
|
||
defaultType = "advance",
|
||
defaultCurrent = 1,
|
||
defaultPageSize = 20,
|
||
defaultPagination = { current: defaultCurrent, pageSize: defaultPageSize },
|
||
...restRestOptions
|
||
} = restOptions;
|
||
|
||
const { setUrlCriteriaQuery, getUrlCriteriaQuery } = useUrlQueryCriteria();
|
||
|
||
// 获取存储的查询条件
|
||
const storageQueryCriteriaSearchForm = useStorageQueryCriteria ? getUrlCriteriaQuery("searchFormKeys", "searchFormValues") : {};
|
||
const storageQueryCriteriaPagination = useStorageQueryCriteria && usePagination ? getUrlCriteriaQuery("paginationKeys", "paginationValues") : {};
|
||
|
||
// 确定实际使用的搜索表单和分页参数
|
||
const actualSearchForm = Object.keys(storageQueryCriteriaSearchForm).length > 0 ? storageQueryCriteriaSearchForm : {};
|
||
/** @type {{current: number, pageSize: number}} */
|
||
const actualPagination = usePagination ? Object.keys(storageQueryCriteriaPagination).length > 0 ? storageQueryCriteriaPagination : defaultPagination : {};
|
||
|
||
// 调用 ahooks 的 useAntdTable
|
||
const res = useAntdTable(
|
||
getService(service, extraParams, transform),
|
||
{
|
||
...restRestOptions,
|
||
defaultParams: [actualPagination, actualSearchForm],
|
||
defaultType,
|
||
onSuccess: (data, params) => {
|
||
// 执行成功回调,为了保留 ahooks 的 onSuccess 回调
|
||
restOptions.onSuccess && restOptions.onSuccess(data, params);
|
||
// 存储查询条件和分页到 URL
|
||
useStorageQueryCriteria && setUrlCriteriaQuery(
|
||
params[1] ?? {},
|
||
usePagination
|
||
? { current: res.tableProps.pagination.current, pageSize: res.tableProps.pagination.pageSize }
|
||
: {},
|
||
);
|
||
},
|
||
},
|
||
);
|
||
|
||
// 执行回调函数
|
||
restOptions.callback && restOptions.callback(res?.data?.list || [], res?.data || {});
|
||
|
||
// 返回结果
|
||
return {
|
||
...res,
|
||
tableProps: {
|
||
...res.tableProps,
|
||
pagination: usePagination ? { ...res.tableProps.pagination, showQuickJumper: true, showSizeChanger: true } : false,
|
||
},
|
||
getData: res.search.submit,
|
||
};
|
||
}
|
||
|
||
export default useTable;
|