mirror of
https://github.com/vbenjs/vue-vben-admin.git
synced 2025-08-27 19:29:04 +08:00
feat: add the parameter sortFn to the table
This commit is contained in:
@@ -64,7 +64,7 @@
|
||||
import { ROW_KEY } from './const';
|
||||
import { PaginationProps } from './types/pagination';
|
||||
import { deepMerge } from '/@/utils';
|
||||
import { TableCustomRecord } from 'ant-design-vue/types/table/table';
|
||||
import { SorterResult, TableCustomRecord } from 'ant-design-vue/types/table/table';
|
||||
import { useEvent } from '/@/hooks/event/useEvent';
|
||||
|
||||
import './style/index.less';
|
||||
@@ -216,12 +216,22 @@
|
||||
fetch({ searchInfo: info, page: 1 });
|
||||
}
|
||||
|
||||
function handleTableChange(pagination: PaginationProps) {
|
||||
const { clearSelectOnPageChange } = unref(getMergeProps);
|
||||
function handleTableChange(
|
||||
pagination: PaginationProps,
|
||||
filters: Partial<Record<string, string[]>>,
|
||||
sorter: SorterResult<any>
|
||||
) {
|
||||
const { clearSelectOnPageChange, sortFn } = unref(getMergeProps);
|
||||
if (clearSelectOnPageChange) {
|
||||
clearSelectedRowKeys();
|
||||
}
|
||||
setPagination(pagination);
|
||||
|
||||
if (sorter && isFunction(sortFn)) {
|
||||
const sortInfo = sortFn(sorter);
|
||||
fetch({ sortInfo });
|
||||
return;
|
||||
}
|
||||
fetch();
|
||||
}
|
||||
|
||||
|
@@ -1,3 +1,5 @@
|
||||
import { SorterResult } from 'ant-design-vue/types/table/table';
|
||||
|
||||
export const ROW_KEY = 'key';
|
||||
|
||||
export const PAGE_SIZE_OPTIONS = ['10', '50', '80', '100'];
|
||||
@@ -10,3 +12,11 @@ export const FETCH_SETTING = {
|
||||
listField: 'items',
|
||||
totalField: 'total',
|
||||
};
|
||||
|
||||
export function DEFAULT_SORT_FN(sortInfo: SorterResult<any>) {
|
||||
const { field, order } = sortInfo;
|
||||
return {
|
||||
field,
|
||||
order,
|
||||
};
|
||||
}
|
||||
|
@@ -98,6 +98,8 @@ export function useDataSource(
|
||||
...(useSearchForm ? getFieldsValue() : {}),
|
||||
...searchInfo,
|
||||
...(opt ? opt.searchInfo : {}),
|
||||
...(opt ? opt.sortInfo : {}),
|
||||
...(opt ? opt.filterInfo : {}),
|
||||
};
|
||||
if (beforeFetch && isFunction(beforeFetch)) {
|
||||
params = beforeFetch(params) || params;
|
||||
|
@@ -1,15 +1,25 @@
|
||||
import type { PropType } from 'vue';
|
||||
import type { PaginationProps } from './types/pagination';
|
||||
import type { BasicColumn, FetchSetting, TableSetting } from './types/table';
|
||||
import type { TableCustomRecord, TableRowSelection } from 'ant-design-vue/types/table/table';
|
||||
import type {
|
||||
SorterResult,
|
||||
TableCustomRecord,
|
||||
TableRowSelection,
|
||||
} from 'ant-design-vue/types/table/table';
|
||||
import type { FormProps } from '/@/components/Form/index';
|
||||
import { FETCH_SETTING } from './const';
|
||||
import { DEFAULT_SORT_FN, FETCH_SETTING } from './const';
|
||||
|
||||
// 注释看 types/table
|
||||
export const basicProps = {
|
||||
tableSetting: {
|
||||
type: Object as PropType<TableSetting>,
|
||||
},
|
||||
|
||||
sortFn: {
|
||||
type: Function as PropType<(sortInfo: SorterResult<any>) => any>,
|
||||
default: DEFAULT_SORT_FN,
|
||||
},
|
||||
|
||||
showTableSetting: {
|
||||
type: Boolean as PropType<boolean>,
|
||||
default: false,
|
||||
|
@@ -28,6 +28,8 @@ export interface RenderEditableCellParams {
|
||||
export interface FetchParams {
|
||||
searchInfo?: any;
|
||||
page?: number;
|
||||
sortInfo?: any;
|
||||
filterInfo?: any;
|
||||
}
|
||||
|
||||
export interface GetColumnsParams {
|
||||
@@ -75,6 +77,8 @@ export interface TableSetting {
|
||||
}
|
||||
|
||||
export interface BasicTableProps<T = any> {
|
||||
// 自定义排序方法
|
||||
sortFn?: (sortInfo: SorterResult<any>) => any;
|
||||
// 显示表格设置
|
||||
showTableSetting?: boolean;
|
||||
tableSetting?: TableSetting;
|
||||
@@ -106,7 +110,6 @@ export interface BasicTableProps<T = any> {
|
||||
emptyDataIsShowTable?: boolean;
|
||||
// 额外的请求参数
|
||||
searchInfo?: any;
|
||||
|
||||
// 使用搜索表单
|
||||
useSearchForm?: boolean;
|
||||
// 表单配置
|
||||
|
Reference in New Issue
Block a user