@gx-design-vue/pro-table 0.2.0-beta.10 → 0.2.0-beta.101

package/dist/types/ColumnTypings.d.ts

@@ -1,6 +1,6 @@
-import type { RecordType, VueNode } from '@gx-design-vue/pro-utils';
-import type { DefaultRecordType } from '../typing';
-import type { ColumnType } from '../_utils';
+import type { Fn, ProColumn, RecordType, VueNode } from '@gx-design-vue/pro-utils';
+import type { CSSProperties } from 'vue';
+import type { ColumnType, TooltipProps } from '../_utils';
 /**
  * @param text 文本框
  * @param date 日期 YYYY-MM-DD
@@ -9,7 +9,7 @@ import type { ColumnType } from '../_utils';
  * @param time: 时间 HH:mm:ss
  * @param select 下拉选择器
  */
-export type ProFieldValueType = 'text' | 'date' | 'select' | 'treeSelect' | 'dateMonth' | 'dateRange' | 'time';
+export type ProFieldValueType = 'text' | 'select' | 'treeSelect' | 'date' | 'dateWeek' | 'dateQuarter' | 'dateMonth' | 'dateYear' | 'dateRange' | 'time';
 /**
  * @param text 文本框
  * @param date 日期 YYYY-MM-DD
@@ -19,17 +19,17 @@ export type ProFieldValueType = 'text' | 'date' | 'select' | 'treeSelect' | 'dat
  * @param select 下拉选择器
  */
 export type ProFieldValueFormat = 'YYYY-MM-DD' | 'YYYY-MM' | 'YYYY-MM-DD HH:mm:ss' | 'HH:mm:ss';
-export type ProSchemaValueEnumType = {
+export interface ProSchemaValueEnumType {
     /** @name 演示的文案 */
     text: VueNode | JSX.Element;
     /** @name 演示的value值 */
     value: any;
     /** @name 是否禁用 */
     disabled?: boolean;
-};
+}
 type ProSchemaValueType<ValueType> = (ValueType | ProFieldValueType);
-export type ProSearchMap<ValueType = 'text'> = {
-    name?: string;
+export interface ProSearchMap<ValueType = 'text', ParamsKey = string> {
+    name: ParamsKey;
     /** 选择如何渲染相应的模式 */
     valueType?: ProSchemaValueType<ValueType>;
     /** valueType为date|dateMonth|dateRange|time生效 */
@@ -55,7 +55,15 @@ export type ProSearchMap<ValueType = 'text'> = {
     initialValue?: any;
     /** 针对select、treeselect取值的key */
     valueKey?: string;
-    /** 表单的属性值（ant-design）*/
+    /** 远程查询数据 */
+    request?: Fn;
+    /** 查询表单label */
+    label?: string;
+    /** 查询表单label - 宽度 */
+    labelWidth?: string | number;
+    /** 查询表单label - 对齐方式 */
+    labelAlign?: 'center' | 'left' | 'right';
+    /** 表单的属性值（ant-design） */
     field?: RecordType;
     /**
      * 支持 object 和Map，Map 是支持其他基础类型作为 key
@@ -63,26 +71,36 @@ export type ProSearchMap<ValueType = 'text'> = {
      * @name 映射值的类型
      */
     valueEnum?: ProSchemaValueEnumType[];
-};
-export type ProColumnType<RecordType = DefaultRecordType> = ColumnType<RecordType> & {
-    children?: ProColumnsType<RecordType>;
+}
+export type ProColumnType<DataValue = RecordType, SearchParama = RecordType> = ProColumn<Omit<ColumnType<DataValue>, 'key' | 'dataIndex' | 'width'> & {
+    children?: ProColumnsType<DataValue, SearchParama>;
     uuid?: string | number;
+    index?: number;
+    copyText?: string | ((record: ProColumnType) => string);
+    tooltip?: false | (TooltipProps & {
+        width?: number;
+        targetStyle?: Partial<CSSProperties>;
+        hiddenLine?: number;
+        class?: string;
+    });
     /** 不在列表中显示 */
     show?: boolean;
+    key?: keyof DataValue | string | 'action';
+    dataIndex?: keyof DataValue | string | 'action';
     /** 列表顺序值 */
     order?: number;
     /** 不在配置工具中显示 */
     hideInSetting?: boolean;
     /** 表单搜索配置 */
-    searchConfig?: ProSearchMap;
+    searchConfig?: ProSearchMap<undefined, keyof DataValue | keyof SearchParama>;
     /** 是否拷贝 */
     copyable?: boolean;
     /** 值为空时，默认取值 */
     columnEmptyText?: string;
     valueType?: ProColumnsValueType;
-};
-export type ProColumnsType<RecordType = DefaultRecordType> = (ProColumnType<RecordType>)[];
-export type ProColumnsValueType = 'text' | 'link' | 'time' | 'dateMonth' | 'dateTime' | {
+}>;
+export type ProColumnsType<DataValue = RecordType, SearchParama = RecordType> = ProColumnType<DataValue, SearchParama>[];
+export type ProColumnsValueType = 'text' | 'link' | 'time' | 'dateMonth' | 'dateTime' | 'date' | {
     node?: string;
     class?: string;
     attr?: string;

package/dist/types/SlotsTypings.d.ts

@@ -1,12 +1,45 @@
-import type { CustomRender, WithFalse } from '@gx-design-vue/pro-utils';
-export type HeaderTitleRender = WithFalse<CustomRender>;
-export type TitleTipRender = WithFalse<CustomRender>;
-export type ToolBarBtnRender = WithFalse<CustomRender>;
-export type OptionsExtraRender = WithFalse<CustomRender>;
-export type SettingExtraRender = WithFalse<CustomRender>;
-export type PageItemRender = WithFalse<(opt: {
+import type { CustomRender, RecordType, WithFalse } from '@gx-design-vue/pro-utils';
+import type { ColumnType, RenderExpandIconProps } from '../_utils';
+import type { ProColumnType } from '../types/ColumnTypings';
+export interface ProTableBodyCellProps<T = RecordType> {
+    text: any;
+    value: any;
+    record: T;
+    index: number;
+    column: ProColumnType<T>;
+}
+export interface AntTabelSlotsType {
+    emptyText?: any;
+    expandIcon?: RenderExpandIconProps<any>;
+    title?: any;
+    footer?: any;
+    summary?: any;
+    expandedRowRender?: any;
+    expandColumnTitle?: any;
+    bodyCell?: (props: ProTableBodyCellProps<any>) => void;
+    headerCell?: (props: {
+        title: any;
+        column: ColumnType;
+    }) => void;
+    customFilterIcon?: any;
+    customFilterDropdown?: any;
+    default: any;
+}
+export type ProTableSlotsKey = 'search' | 'headerTitle' | 'toolBarBtn' | 'titleTip' | 'settingExtra' | 'optionsExtra' | 'pageItemRender' | 'customRender';
+export declare const proTableSlotsKey: ProTableSlotsKey[];
+export type Slots = Readonly<Omit<Record<ProTableSlotsKey, () => void>, 'customRender'> & {
+    customRender: (params: CustomRenderResult) => void;
+}>;
+export interface CustomRenderResult<T = RecordType> {
+    currentData: T[];
+    dataSource: T[];
+}
+export type PageItemFn = (opt: {
     page: number;
     type: 'page' | 'prev' | 'next' | 'jump-prev' | 'jump-next';
     originalElement: any;
-}) => CustomRender>;
-export type CustomizeRender = WithFalse<(dataSource: any[]) => CustomRender>;
+}) => CustomRender;
+export type CustomDataFn<T = RecordType> = (params: CustomRenderResult<T>) => CustomRender;
+export type DefaultRender = WithFalse<CustomRender>;
+export type PageItemRender = WithFalse<PageItemFn>;
+export type CustomDataRender<T = RecordType> = WithFalse<CustomDataFn<T>>;

package/dist/types/TableTypings.d.ts

@@ -1,20 +1,21 @@
-import type { CSSProperties } from 'vue';
-import type { RecordType, WithFalse, CustomRender, VueNode, SizeType, Breakpoint } from '@gx-design-vue/pro-utils';
-import type { ProSearchMap, ProColumnType, ProColumnsType } from './ColumnTypings';
-import type { DefaultRecordType } from '../typing';
-import type { HeaderTitleRender, ToolBarBtnRender, CustomizeRender, TitleTipRender, OptionsExtraRender, SettingExtraRender, PageItemRender } from './SlotsTypings';
-import type { TableRowSelection, TablePaginationConfig, SpinProps, TableFilters, TableSorter, TableProps } from '../_utils';
+import type { Breakpoint, CustomRender, RecordType, SizeType, VueNode, WithFalse } from '@gx-design-vue/pro-utils';
+import type { ComputedRef, CSSProperties, Ref } from 'vue';
+import type { FilterValue, SelectionSelectFn, SorterResult, TableCurrentDataSource, TablePaginationConfig, TableProps, TableRowSelection } from '../_utils';
 import type { ColumnSettingProps } from '../components/ColumnSetting';
 import type { ColumnsState, ColumnsStateType } from '../hooks/useColumnSetting';
-export type ProTabelFeachParams = {
-    params?: any;
-    filters?: TableFilters;
-    sorter?: TableSorter;
+import type { ProColumnsType, ProColumnType, ProSearchMap } from './ColumnTypings';
+import type { CustomDataRender, DefaultRender, PageItemRender } from './SlotsTypings';
+export interface ProTabelFeachParams<R = RecordType> {
+    params?: R;
+    filters?: Record<string, FilterValue | null>;
+    sorter?: SorterResult | SorterResult[];
     pagination?: ProTablePagination;
     removeKeys?: (string | number)[];
     immediate?: boolean;
     isPolling?: boolean;
-};
+    showLoading?: boolean;
+    extra?: TableCurrentDataSource;
+}
 export type TablePaginationPosition = 'topLeft' | 'topCenter' | 'topRight' | 'bottomLeft' | 'bottomCenter' | 'bottomRight';
 export type ProFieldEmptyText = string | false;
 export type ProTableRowSelection<T = any> = Omit<TableRowSelection<T>, 'selectedRowKeys'> & {
@@ -25,31 +26,46 @@ export interface ProTablePaginationConfig extends Omit<TablePaginationConfig, 'p
     position?: TablePaginationPosition[];
 }
 export type ProTablePagination = ProTablePaginationConfig | false;
-export type RequestData<T = any> = {
+export interface PageState {
+    pageSize: number;
+    pageNum: number;
+}
+export interface RequestData<T = any> {
     data: T[] | undefined;
     success: boolean;
     total: number;
-} & RecordType;
-export type RequsetConfig = {
-    params: {
-        pageSize?: number;
-        pageNum?: number;
-    };
-    sort: TableSorter;
-    filter: TableFilters;
-};
-export type RequsetFunction<T = any> = (params: RequsetConfig['params'], sort: RequsetConfig['sort'], filter: RequsetConfig['filter']) => Promise<Partial<RequestData<T>>>;
+}
+export interface RequsetConfig<T> {
+    params: T extends undefined ? PageState : {
+        pageSize: number;
+        pageNum: number;
+    } & Partial<T>;
+    sorter: SorterResult | SorterResult[];
+    filter: Record<string, FilterValue | null>;
+    extra: TableCurrentDataSource;
+}
+export type RequsetFunction<T = any, D = undefined> = (params: RequsetConfig<D>['params'], sort: RequsetConfig<D>['sorter'], filter: RequsetConfig<D>['filter']) => Promise<Partial<RequestData<T>> | undefined>;
 export type ColConfig = Partial<Record<Breakpoint, number>>;
-export type SearchConfig = {
-    searchText?: string;
-    resetText?: string;
+export interface SearchConfig {
     className?: string;
+    actions?: {
+        reload?: boolean;
+        reset?: boolean;
+        searchText?: string;
+        resetText?: string;
+    };
     defaultCollapsed?: boolean;
-    showSearch?: boolean;
-    showReset?: boolean;
+    type?: 'auto' | 'button';
+    reetButton?: boolean;
     collapseRender?: WithFalse<(collapsed?: boolean) => CustomRender>;
     span?: ColConfig;
-};
+    label?: {
+        gap?: number;
+        colon?: boolean;
+        width?: number;
+        align?: 'center' | 'left' | 'right';
+    };
+}
 export interface OptionConfig {
     reload?: (() => VueNode | JSX.Element) | boolean;
     density?: boolean;
@@ -57,80 +73,113 @@ export interface OptionConfig {
     fullScreen?: (() => VueNode | JSX.Element) | boolean | (() => Promise<void>);
 }
 /** action表格实例 */
-export interface ProCoreActionType {
-    pageParams?: RecordType | boolean;
-    getLoadingStatus?: boolean | SpinProps | undefined;
+export interface ProCoreActionType<T = RecordType, R = RecordType> {
+    /** @name loadingStatus */
+    loading: Ref<boolean>;
+    dataSource: ComputedRef<T[]>;
+    getLoadingStatus: () => boolean;
+    pagination: R | boolean;
+    pageState: PageState;
+    selectedKeys: ComputedRef<(string | number)[]>;
+    selectedItems: ComputedRef<T[]>;
+    rowsSelection?: {
+        clear: () => void;
+        sync: (data: T[]) => void;
+        remove: (keys: (string | number)[]) => void;
+        select: SelectionSelectFn<T>;
+        selectAll: TableRowSelection<T>['onSelectAll'];
+    };
     /** @name 刷新 */
-    reload?: (info?: ProTabelFeachParams) => void;
+    reload: (info?: ProTabelFeachParams<R>) => void;
     /** @name 刷新并清空表单，重置为第一页 */
-    reloadAndRest?: (callBack?: () => void) => void;
-    /** @name 设置翻页、排序、筛选*/
-    changePageInfo?: (pagination: ProTablePaginationConfig, filters: any, sorter: any) => void;
+    reloadAndReset: (options?: {
+        callBack?: () => void;
+        wait?: boolean;
+    }) => void;
+    /** @name 设置翻页 */
+    setPagination: (pagination: ProTablePaginationConfig) => void;
+    /** @name 设置翻页、排序、筛选、并且reload */
+    setPageAndReload: (pagination: ProTablePaginationConfig, filters?: Record<string, FilterValue | null>, sorter?: SorterResult | SorterResult[], extra?: TableCurrentDataSource) => void;
     /** @name 更新TableData属性值 */
-    reSetDataList?: (data: RecordType[]) => void;
+    reSetDataList: (data: T[]) => void;
     /** @name 更新TableData属性值 */
-    changeDataValue?: ({ key, params }: {
-        key?: string;
-        params: RecordType;
+    setDataValue: ({ key, type, params, value }: {
+        params: Partial<T>;
+        key?: keyof T;
+        value?: any;
+        type?: 'update' | 'push' | 'delete' | 'unshift';
     }) => void;
     /** @name 改变loading状态 */
-    loadingOperation?: (loading: boolean) => void;
+    setLoading: (loading: boolean) => void;
 }
 /** form查询表单实例 */
-export interface ProCoreFormType {
+export interface ProCoreFormType<R = RecordType> {
     /** @name 获取表格-表单请求参数 */
-    formParams?: RecordType;
+    getFormState?: () => R;
     /** @name 获取表格-内部表单参数 */
-    getFormState?: () => RecordType;
+    getFormInnerState?: () => R;
     /** @name 重置内部表单组件参数 */
-    restForm?: (callBack?: () => void) => void;
+    restFormState?: (callBack?: () => void) => void;
 }
-export interface ProTableRef {
-    formRef: () => ProCoreFormType;
-    actionRef: () => ProCoreActionType;
+export interface ProTableRef<T = RecordType, R = RecordType> {
+    formRef: () => ProCoreFormType<R>;
+    actionRef: () => ProCoreActionType<T, R>;
 }
-export type ProTableProps<RecordType extends DefaultRecordType = DefaultRecordType> = Omit<TableProps<RecordType>, 'columns'> & Partial<{
-    tableClassName: string;
-    tableStyle: CSSProperties;
-    rowKey: string;
+export type ProTableProps<DataRecord extends object = RecordType, ParamsType extends object = RecordType> = Omit<TableProps, 'columns' | 'dataSource'> & Partial<{
+    dataSource: DataRecord[];
+    tableProps: {
+        class?: string;
+        style?: CSSProperties;
+    };
+    rowKey: keyof DataRecord;
     titleTipText: string;
     autoScroll: boolean;
+    showSearch: boolean;
+    keepAliveReload: boolean;
+    emptyTextProps: {
+        class?: string;
+        style?: CSSProperties;
+        extraProps?: RecordType;
+    };
     columnEmptyText: ProFieldEmptyText;
+    showLoading: boolean;
     neverScroll: boolean;
     modalScroll: boolean;
     scrollBreakpoint: Breakpoint | number;
     draggabled: boolean;
     bordered: boolean;
     showIndex: boolean;
+    cardBordered: boolean;
     virtualScroll: boolean;
     size: SizeType;
     align: ProColumnType['align'];
     options: OptionConfig | boolean;
     rowSelection: ProTableRowSelection;
-    columns: ProColumnsType<RecordType>;
+    columns: ProColumnsType<DataRecord, ParamsType>;
     columnsState: ColumnsStateType;
     waitRequest: boolean;
     polling: number;
     debounceTime: number;
-    request: RequsetFunction<RecordType>;
-    params: Record<string, unknown>;
-    postData: (data: any[]) => any;
+    request: RequsetFunction<DataRecord, ParamsType>;
+    params: ParamsType;
+    postData: (data: DataRecord[]) => DataRecord[];
     pagination: ProTablePagination;
-    search: SearchConfig;
-    searchMap: ProSearchMap[];
-    onReset: (params?: Partial<Record<string, any>>) => any;
-    onReload: (params?: Partial<Record<string, any>>) => any;
-    onSubmit: (params?: Partial<Record<string, any>>) => any;
+    search: SearchConfig | false;
+    searchMap: ProSearchMap<undefined, keyof ParamsType | keyof DataRecord>[];
+    onReset: (params?: Partial<ParamsType>) => void;
+    onReload: (params?: Partial<ParamsType>) => void;
+    onSubmit: (params?: Partial<ParamsType>) => void;
     onSizeChange: (size: string) => any;
     onLoadingChange: (loading: boolean) => any;
     onRequestError: (e: Error) => void;
-    onBeforeSearchSubmit: RequsetFunction<RecordType>;
+    onBeforeSearchSubmit: RequsetFunction<DataRecord, ParamsType>;
     onColumnsStateChange: (data: ColumnsState[]) => void;
-    titleTip: TitleTipRender;
-    headerTitle: HeaderTitleRender;
-    toolBarBtn: ToolBarBtnRender;
-    customRender: CustomizeRender;
-    optionsExtra: OptionsExtraRender;
-    settingExtra: SettingExtraRender;
+    titleTip: DefaultRender;
+    emptyText: DefaultRender;
+    headerTitle: DefaultRender;
+    toolBarBtn: DefaultRender;
+    customRender: CustomDataRender;
+    optionsExtra: DefaultRender;
+    settingExtra: DefaultRender;
     pageItemRender: PageItemRender;
 }>;

package/dist/utils/utils.d.ts

@@ -1,2 +1,5 @@
 import type { ProColumnsValueType } from '../types/ColumnTypings';
-export declare function valueFormat(value: any, format: ProColumnsValueType | undefined, className: string): any;
+import type { ProTablePagination } from '../types/TableTypings';
+export declare function valueFormat(value: any, format: ProColumnsValueType | undefined, className: string, hashId: string): any;
+export declare function getCuurentData(data: any[], pageInfo: ProTablePagination): any[];
+export declare function handleCopy(codeStr: string): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gx-design-vue/pro-table",
-  "version": "0.2.0-beta.10",
+  "version": "0.2.0-beta.101",
   "scripts": {
     "dev": "vite",
     "build": "vite build",
@@ -14,58 +14,35 @@
     "dist",
     "volar.d.ts"
   ],
+  "type": "module",
   "types": "./dist",
-  "main": "./dist/pro-table.umd.js",
-  "module": "./dist/pro-table.mjs",
+  "main": "./dist/pro-table.umd.cjs",
+  "module": "./dist/pro-table.js",
   "exports": {
     ".": {
-      "import": "./dist/pro-table.mjs",
-      "require": "./dist/pro-table.umd.js"
+      "import": "./dist/pro-table.js",
+      "require": "./dist/pro-table.umd.cjs"
     }
   },
   "dependencies": {
     "@vueuse/core": "^9.10.0",
-    "@gx-design-vue/pro-app": "^0.0.4",
-    "@gx-design-vue/pro-utils": "^0.2.0-beta.6",
-    "@gx-design-vue/pro-hooks": "^0.2.0-beta.6",
-    "@gx-design-vue/pro-provider": "^0.1.0-beta.14",
-    "ant-design-vue": "^4.0.0",
+    "@gx-design-vue/pro-utils": "^0.2.0-beta.60",
+    "@gx-design-vue/pro-hooks": "^0.2.0-beta.42",
+    "@gx-design-vue/pro-provider": "^0.1.0-beta.99",
+    "@gx-design-vue/pro-app": "^0.1.0-beta.23",
     "dayjs": "^1.11.0",
-    "lodash-es": "^4.17.21",
-    "vue": "^3.2.45",
-    "vue-types": "^4.1.1"
+    "lodash-es": "^4.17.21"
   },
   "devDependencies": {
-    "@rollup/plugin-typescript": "^8.3.0",
-    "@rushstack/eslint-patch": "^1.1.0",
     "@types/lodash-es": "^4.17.6",
-    "@types/jsdom": "^16.2.14",
-    "@types/node": "^16.11.26",
-    "@vitejs/plugin-vue": "^4.2.3",
-    "@vitejs/plugin-vue-jsx": "^3.0.1",
-    "@vue/eslint-config-prettier": "^7.0.0",
-    "@vue/eslint-config-typescript": "^10.0.0",
-    "@vue/tsconfig": "^0.1.3",
-    "eslint": "^8.13.0",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-vue": "^8.6.0",
-    "jsdom": "^19.0.0",
-    "less": "^4.1.2",
-    "postcss": "^8.4.12",
-    "postcss-html": "^1.4.1",
-    "postcss-less": "^6.0.0",
-    "prettier": "^2.6.2",
-    "rollup": "^2.70.2",
-    "stylelint": "^14.7.1",
-    "stylelint-config-prettier": "^9.0.3",
-    "stylelint-config-recommended": "^7.0.0",
-    "stylelint-config-recommended-vue": "^1.4.0",
-    "stylelint-config-standard": "^25.0.0",
-    "stylelint-order": "^5.0.0",
-    "typescript": "^4.6.4",
-    "vite": "^4.3.8",
-    "vue-eslint-parser": "^9.0.3",
-    "vue-tsc": "^1.0.24"
+    "typescript": "^5.3.3"
   },
-  "description": "Gx Design"
+  "peerDependencies": {
+    "vue": ">=3.0.0",
+    "ant-design-vue": "^4.1.2"
+  },
+  "description": "Gx Design Pro Table",
+  "authors": [
+    "gx12358 <gx12358@gmail.com> (https://github.com/gx12358)"
+  ]
 }

package/volar.d.ts

@@ -1,8 +1,8 @@
 // Auto generated component declarations
-declare module "vue" {
+declare module 'vue' {
   export interface GlobalComponents {
-    GProTable: typeof import("@gx-design-vue/pro-table")["GProTable"];
+    GProTable: typeof import('@gx-design-vue/pro-table')['GProTable'];
   }
 }
 
-export {};
+export {}