feat: add the parameter sortFn to the table

vbenjs · Oct 25, 2020 · 491ba9a · 491ba9a
1 parent d09406e
commit 491ba9a
Show file tree

Hide file tree

Showing 6 changed files with 43 additions and 6 deletions.
diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md
@@ -4,6 +4,7 @@
 
 - 面包屑支持显示图标
 - 新增 tinymce 富文本组件
+- 表单新增 submitOnReset 控制是否在重置时重新发起请求
 
 ### 🎫 Chores
 
@@ -21,6 +22,7 @@
 - 修复菜单没有子节点时显示折叠的问题
 - 修复面包屑显示样式问题
 - 修复 modal 在 destroyOnClose=true 时多次打开拖拽失效
+- 修复表格出现多个 action 列
 
 # 2.0.0-rc.4 (2020-10-21)
 

diff --git a/src/components/Table/src/BasicTable.vue b/src/components/Table/src/BasicTable.vue
@@ -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();
       }
 

diff --git a/src/components/Table/src/const.ts b/src/components/Table/src/const.ts
@@ -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,
+  };
+}
diff --git a/src/components/Table/src/hooks/useDataSource.ts b/src/components/Table/src/hooks/useDataSource.ts
@@ -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;

diff --git a/src/components/Table/src/props.ts b/src/components/Table/src/props.ts
@@ -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,

diff --git a/src/components/Table/src/types/table.ts b/src/components/Table/src/types/table.ts
@@ -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;
   // 表单配置