diff --git a/src/hooks/common/table.ts b/src/hooks/common/table.ts index 6619f8b3e..3741a60fd 100644 --- a/src/hooks/common/table.ts +++ b/src/hooks/common/table.ts @@ -16,12 +16,33 @@ export function useTable(config: NaiveUI.NaiveTabl const isMobile = computed(() => appStore.isMobile); - const { apiFn, apiParams, immediate, showTotal } = config; + const { apiFn, transformer, apiParams, immediate, showTotal } = config; const SELECTION_KEY = '__selection__'; const EXPAND_KEY = '__expand__'; + const defaultTransformer = (res: Awaited>) => { + const { records = [], current = 1, size = 10, total = 0 } = res.data || {}; + + // Ensure that the size is greater than 0, If it is less than 0, it will cause paging calculation errors. + const pageSize = size <= 0 ? 10 : size; + + const recordsWithIndex = records.map((item, index) => { + return { + ...item, + index: (current - 1) * pageSize + index + 1 + }; + }); + + return { + data: recordsWithIndex, + pageNum: current, + pageSize, + total + }; + }; + const { loading, empty, @@ -37,26 +58,7 @@ export function useTable(config: NaiveUI.NaiveTabl apiFn, apiParams, columns: config.columns, - transformer: res => { - const { records = [], current = 1, size = 10, total = 0 } = res.data || {}; - - // Ensure that the size is greater than 0, If it is less than 0, it will cause paging calculation errors. - const pageSize = size <= 0 ? 10 : size; - - const recordsWithIndex = records.map((item, index) => { - return { - ...item, - index: (current - 1) * pageSize + index + 1 - }; - }); - - return { - data: recordsWithIndex, - pageNum: current, - pageSize, - total - }; - }, + transformer: transformer || defaultTransformer, getColumnChecks: cols => { const checks: NaiveUI.TableColumnCheck[] = []; diff --git a/src/typings/naive-ui.d.ts b/src/typings/naive-ui.d.ts index cde80bab3..b13d8d1f7 100644 --- a/src/typings/naive-ui.d.ts +++ b/src/typings/naive-ui.d.ts @@ -50,5 +50,12 @@ declare namespace NaiveUI { * @default false */ showTotal?: boolean; + /** + * the custom transformer function + * + * @param res the response data + * @returns the transformed data + */ + transformer?: (res: Awaited>) => { data: any[]; pageNum: number; pageSize: number; total: number }; }; }