mirror of
https://github.com/vbenjs/vue-vben-admin.git
synced 2025-02-03 10:58:43 +08:00
feat: add the parameter sortFn to the table
This commit is contained in:
parent
d09406e3cb
commit
491ba9a3cc
@ -4,6 +4,7 @@
|
|||||||
|
|
||||||
- 面包屑支持显示图标
|
- 面包屑支持显示图标
|
||||||
- 新增 tinymce 富文本组件
|
- 新增 tinymce 富文本组件
|
||||||
|
- 表单新增 submitOnReset 控制是否在重置时重新发起请求
|
||||||
|
|
||||||
### 🎫 Chores
|
### 🎫 Chores
|
||||||
|
|
||||||
@ -21,6 +22,7 @@
|
|||||||
- 修复菜单没有子节点时显示折叠的问题
|
- 修复菜单没有子节点时显示折叠的问题
|
||||||
- 修复面包屑显示样式问题
|
- 修复面包屑显示样式问题
|
||||||
- 修复 modal 在 destroyOnClose=true 时多次打开拖拽失效
|
- 修复 modal 在 destroyOnClose=true 时多次打开拖拽失效
|
||||||
|
- 修复表格出现多个 action 列
|
||||||
|
|
||||||
# 2.0.0-rc.4 (2020-10-21)
|
# 2.0.0-rc.4 (2020-10-21)
|
||||||
|
|
||||||
|
@ -64,7 +64,7 @@
|
|||||||
import { ROW_KEY } from './const';
|
import { ROW_KEY } from './const';
|
||||||
import { PaginationProps } from './types/pagination';
|
import { PaginationProps } from './types/pagination';
|
||||||
import { deepMerge } from '/@/utils';
|
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 { useEvent } from '/@/hooks/event/useEvent';
|
||||||
|
|
||||||
import './style/index.less';
|
import './style/index.less';
|
||||||
@ -216,12 +216,22 @@
|
|||||||
fetch({ searchInfo: info, page: 1 });
|
fetch({ searchInfo: info, page: 1 });
|
||||||
}
|
}
|
||||||
|
|
||||||
function handleTableChange(pagination: PaginationProps) {
|
function handleTableChange(
|
||||||
const { clearSelectOnPageChange } = unref(getMergeProps);
|
pagination: PaginationProps,
|
||||||
|
filters: Partial<Record<string, string[]>>,
|
||||||
|
sorter: SorterResult<any>
|
||||||
|
) {
|
||||||
|
const { clearSelectOnPageChange, sortFn } = unref(getMergeProps);
|
||||||
if (clearSelectOnPageChange) {
|
if (clearSelectOnPageChange) {
|
||||||
clearSelectedRowKeys();
|
clearSelectedRowKeys();
|
||||||
}
|
}
|
||||||
setPagination(pagination);
|
setPagination(pagination);
|
||||||
|
|
||||||
|
if (sorter && isFunction(sortFn)) {
|
||||||
|
const sortInfo = sortFn(sorter);
|
||||||
|
fetch({ sortInfo });
|
||||||
|
return;
|
||||||
|
}
|
||||||
fetch();
|
fetch();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,3 +1,5 @@
|
|||||||
|
import { SorterResult } from 'ant-design-vue/types/table/table';
|
||||||
|
|
||||||
export const ROW_KEY = 'key';
|
export const ROW_KEY = 'key';
|
||||||
|
|
||||||
export const PAGE_SIZE_OPTIONS = ['10', '50', '80', '100'];
|
export const PAGE_SIZE_OPTIONS = ['10', '50', '80', '100'];
|
||||||
@ -10,3 +12,11 @@ export const FETCH_SETTING = {
|
|||||||
listField: 'items',
|
listField: 'items',
|
||||||
totalField: 'total',
|
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() : {}),
|
...(useSearchForm ? getFieldsValue() : {}),
|
||||||
...searchInfo,
|
...searchInfo,
|
||||||
...(opt ? opt.searchInfo : {}),
|
...(opt ? opt.searchInfo : {}),
|
||||||
|
...(opt ? opt.sortInfo : {}),
|
||||||
|
...(opt ? opt.filterInfo : {}),
|
||||||
};
|
};
|
||||||
if (beforeFetch && isFunction(beforeFetch)) {
|
if (beforeFetch && isFunction(beforeFetch)) {
|
||||||
params = beforeFetch(params) || params;
|
params = beforeFetch(params) || params;
|
||||||
|
@ -1,15 +1,25 @@
|
|||||||
import type { PropType } from 'vue';
|
import type { PropType } from 'vue';
|
||||||
import type { PaginationProps } from './types/pagination';
|
import type { PaginationProps } from './types/pagination';
|
||||||
import type { BasicColumn, FetchSetting, TableSetting } from './types/table';
|
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 type { FormProps } from '/@/components/Form/index';
|
||||||
import { FETCH_SETTING } from './const';
|
import { DEFAULT_SORT_FN, FETCH_SETTING } from './const';
|
||||||
|
|
||||||
// 注释看 types/table
|
// 注释看 types/table
|
||||||
export const basicProps = {
|
export const basicProps = {
|
||||||
tableSetting: {
|
tableSetting: {
|
||||||
type: Object as PropType<TableSetting>,
|
type: Object as PropType<TableSetting>,
|
||||||
},
|
},
|
||||||
|
|
||||||
|
sortFn: {
|
||||||
|
type: Function as PropType<(sortInfo: SorterResult<any>) => any>,
|
||||||
|
default: DEFAULT_SORT_FN,
|
||||||
|
},
|
||||||
|
|
||||||
showTableSetting: {
|
showTableSetting: {
|
||||||
type: Boolean as PropType<boolean>,
|
type: Boolean as PropType<boolean>,
|
||||||
default: false,
|
default: false,
|
||||||
|
@ -28,6 +28,8 @@ export interface RenderEditableCellParams {
|
|||||||
export interface FetchParams {
|
export interface FetchParams {
|
||||||
searchInfo?: any;
|
searchInfo?: any;
|
||||||
page?: number;
|
page?: number;
|
||||||
|
sortInfo?: any;
|
||||||
|
filterInfo?: any;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface GetColumnsParams {
|
export interface GetColumnsParams {
|
||||||
@ -75,6 +77,8 @@ export interface TableSetting {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export interface BasicTableProps<T = any> {
|
export interface BasicTableProps<T = any> {
|
||||||
|
// 自定义排序方法
|
||||||
|
sortFn?: (sortInfo: SorterResult<any>) => any;
|
||||||
// 显示表格设置
|
// 显示表格设置
|
||||||
showTableSetting?: boolean;
|
showTableSetting?: boolean;
|
||||||
tableSetting?: TableSetting;
|
tableSetting?: TableSetting;
|
||||||
@ -106,7 +110,6 @@ export interface BasicTableProps<T = any> {
|
|||||||
emptyDataIsShowTable?: boolean;
|
emptyDataIsShowTable?: boolean;
|
||||||
// 额外的请求参数
|
// 额外的请求参数
|
||||||
searchInfo?: any;
|
searchInfo?: any;
|
||||||
|
|
||||||
// 使用搜索表单
|
// 使用搜索表单
|
||||||
useSearchForm?: boolean;
|
useSearchForm?: boolean;
|
||||||
// 表单配置
|
// 表单配置
|
||||||
|
Loading…
Reference in New Issue
Block a user