sti-antd-package 0.0.38 → 0.0.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Table/Async/Component.d.ts +3 -1
- package/dist/components/Table/Async/Search/types.d.ts +1 -0
- package/dist/components/Table/Async/types.d.ts +1 -0
- package/dist/components/Table/Component.d.ts +1 -1
- package/dist/components/Table/types.d.ts +12 -4
- package/dist/index.d.ts +16 -6
- package/dist/index.esm.js +20 -19
- package/dist/index.js +20 -19
- package/package.json +1 -1
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { TableAsyncSearchProviderProps } from "../../../context";
|
|
2
|
+
import { TableComponentProps } from "../types";
|
|
2
3
|
import { TableAsyncComponentRef, TableButtonMiddleAsync } from "./types";
|
|
3
4
|
import { AnyObject } from "antd/es/_util/type";
|
|
4
5
|
import { TableRowSelection } from "antd/es/table/interface";
|
|
5
6
|
import React from "react";
|
|
6
|
-
declare const _default: React.NamedExoticComponent<
|
|
7
|
+
declare const _default: React.NamedExoticComponent<TableComponentProps<AnyObject> & {
|
|
7
8
|
buttonMiddle?: TableButtonMiddleAsync[];
|
|
9
|
+
buttonFilterText?: boolean;
|
|
8
10
|
search?: boolean;
|
|
9
11
|
searchOnChange?: boolean;
|
|
10
12
|
noReload?: boolean;
|
|
@@ -67,6 +67,7 @@ export type TableAsyncSearchItem = TableAsyncSearchText | TableAsyncSearchSelect
|
|
|
67
67
|
export interface TableAsyncSearchComponentProps {
|
|
68
68
|
noInitSubmit?: boolean;
|
|
69
69
|
noButton?: boolean;
|
|
70
|
+
buttonText?: boolean;
|
|
70
71
|
name?: string;
|
|
71
72
|
items?: TableAsyncSearchItem[];
|
|
72
73
|
header?: React.ReactNode;
|
|
@@ -73,6 +73,7 @@ export interface TableAsyncComponentRef {
|
|
|
73
73
|
}
|
|
74
74
|
export type TableAsyncComponentProps = TableComponentProps<AnyObject> & {
|
|
75
75
|
buttonMiddle?: TableButtonMiddleAsync[];
|
|
76
|
+
buttonFilterText?: boolean;
|
|
76
77
|
search?: boolean;
|
|
77
78
|
searchOnChange?: boolean;
|
|
78
79
|
noReload?: boolean;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { BaseModel } from "../../models";
|
|
2
2
|
import { TableComponentProps } from "./types";
|
|
3
3
|
import { AnyObject } from "antd/es/_util/type";
|
|
4
|
-
declare const TableComponent: <T extends (BaseModel<T> | AnyObject)>({ noPagination, buttonReload, buttonAdd, buttonMiddle, buttonDelete, search, buttonFilter,
|
|
4
|
+
declare const TableComponent: <T extends (BaseModel<T> | AnyObject)>({ noPagination, buttonReload, buttonAdd, buttonMiddle, buttonDelete, search, buttonFilter, bordered, rowHoverable, virtual, rootClassNames, classNames, rowClassName, size, indentSize, title, caption, columns, rowKey, data, expandable, pagination, loading, scroll, sticky, components, summary, onChange, rowSelection, style, }: TableComponentProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
5
5
|
declare const _default: typeof TableComponent;
|
|
6
6
|
export default _default;
|
|
@@ -3,7 +3,7 @@ import { AnyObject } from "antd/es/_util/type";
|
|
|
3
3
|
import { SizeType } from "antd/es/config-provider/SizeContext";
|
|
4
4
|
import { ColumnsType, FilterValue, SorterResult, TableCurrentDataSource, TablePaginationConfig, TableRowSelection } from "antd/es/table/interface";
|
|
5
5
|
import { TableProps } from "rc-table";
|
|
6
|
-
import { ExpandableConfig, GetRowKey } from "rc-table/lib/interface";
|
|
6
|
+
import { ExpandableConfig, GetRowKey, PanelRender } from "rc-table/lib/interface";
|
|
7
7
|
import { JSXElementConstructor } from "react";
|
|
8
8
|
export interface TableButtonMiddle {
|
|
9
9
|
classNames?: string[];
|
|
@@ -35,11 +35,18 @@ export interface TableComponentProps<T extends (BaseModel<T> | AnyObject)> {
|
|
|
35
35
|
onClear?: React.MouseEventHandler<HTMLSpanElement>;
|
|
36
36
|
};
|
|
37
37
|
buttonFilter?: React.ReactElement<any, string | JSXElementConstructor<any>>;
|
|
38
|
-
|
|
38
|
+
bordered?: boolean;
|
|
39
|
+
rowHoverable?: boolean;
|
|
40
|
+
virtual?: boolean;
|
|
41
|
+
rootClassNames?: string[];
|
|
42
|
+
classNames?: string[];
|
|
39
43
|
rowClassName?: TableProps<T>['rowClassName'];
|
|
40
|
-
|
|
41
|
-
|
|
44
|
+
size?: SizeType;
|
|
45
|
+
indentSize?: number;
|
|
46
|
+
title?: PanelRender<T>;
|
|
47
|
+
caption?: React.ReactNode;
|
|
42
48
|
columns?: ColumnsType<T>;
|
|
49
|
+
rowKey?: string | GetRowKey<T>;
|
|
43
50
|
data?: T[];
|
|
44
51
|
expandable?: ExpandableConfig<T>;
|
|
45
52
|
pagination?: false | TablePaginationConfig;
|
|
@@ -54,5 +61,6 @@ export interface TableComponentProps<T extends (BaseModel<T> | AnyObject)> {
|
|
|
54
61
|
components?: TableProps<T>['components'];
|
|
55
62
|
summary?: (data: readonly T[]) => React.ReactNode;
|
|
56
63
|
onChange?: (pagination: TablePaginationConfig, filters: Record<string, FilterValue | null>, sorter: SorterResult<T> | SorterResult<T>[], extra: TableCurrentDataSource<T>) => void;
|
|
64
|
+
rowSelection?: TableRowSelection<T>;
|
|
57
65
|
style?: React.CSSProperties;
|
|
58
66
|
}
|
package/dist/index.d.ts
CHANGED
|
@@ -26,9 +26,9 @@ import { OnValueChange } from 'react-number-format';
|
|
|
26
26
|
import { RadioGroupButtonStyle, RadioGroupOptionType } from 'antd/lib/radio';
|
|
27
27
|
import { DefaultOptionType as DefaultOptionType$1 } from 'antd/es/select';
|
|
28
28
|
import { ClassTransformOptions } from 'class-transformer';
|
|
29
|
-
import {
|
|
29
|
+
import { ColumnsType, TablePaginationConfig, FilterValue, SorterResult, TableCurrentDataSource, TableRowSelection, ColumnType, ColumnGroupType } from 'antd/es/table/interface';
|
|
30
30
|
import { TableProps } from 'rc-table';
|
|
31
|
-
import { GetRowKey, ExpandableConfig } from 'rc-table/lib/interface';
|
|
31
|
+
import { PanelRender, GetRowKey, ExpandableConfig } from 'rc-table/lib/interface';
|
|
32
32
|
import { TabsType, TabsPosition, TabsProps } from 'antd/es/tabs';
|
|
33
33
|
import { RcFile } from 'antd/es/upload';
|
|
34
34
|
import { UploadListType, UploadChangeParam, UploadFile } from 'antd/es/upload/interface';
|
|
@@ -758,11 +758,18 @@ interface TableComponentProps<T extends (BaseModel<T> | AnyObject)> {
|
|
|
758
758
|
onClear?: React.MouseEventHandler<HTMLSpanElement>;
|
|
759
759
|
};
|
|
760
760
|
buttonFilter?: React.ReactElement<any, string | JSXElementConstructor<any>>;
|
|
761
|
-
|
|
761
|
+
bordered?: boolean;
|
|
762
|
+
rowHoverable?: boolean;
|
|
763
|
+
virtual?: boolean;
|
|
764
|
+
rootClassNames?: string[];
|
|
765
|
+
classNames?: string[];
|
|
762
766
|
rowClassName?: TableProps<T>['rowClassName'];
|
|
763
|
-
|
|
764
|
-
|
|
767
|
+
size?: SizeType;
|
|
768
|
+
indentSize?: number;
|
|
769
|
+
title?: PanelRender<T>;
|
|
770
|
+
caption?: React.ReactNode;
|
|
765
771
|
columns?: ColumnsType<T>;
|
|
772
|
+
rowKey?: string | GetRowKey<T>;
|
|
766
773
|
data?: T[];
|
|
767
774
|
expandable?: ExpandableConfig<T>;
|
|
768
775
|
pagination?: false | TablePaginationConfig;
|
|
@@ -777,10 +784,11 @@ interface TableComponentProps<T extends (BaseModel<T> | AnyObject)> {
|
|
|
777
784
|
components?: TableProps<T>['components'];
|
|
778
785
|
summary?: (data: readonly T[]) => React.ReactNode;
|
|
779
786
|
onChange?: (pagination: TablePaginationConfig, filters: Record<string, FilterValue | null>, sorter: SorterResult<T> | SorterResult<T>[], extra: TableCurrentDataSource<T>) => void;
|
|
787
|
+
rowSelection?: TableRowSelection<T>;
|
|
780
788
|
style?: React.CSSProperties;
|
|
781
789
|
}
|
|
782
790
|
|
|
783
|
-
declare const TableComponent: <T extends (BaseModel<T> | AnyObject)>({ noPagination, buttonReload, buttonAdd, buttonMiddle, buttonDelete, search, buttonFilter,
|
|
791
|
+
declare const TableComponent: <T extends (BaseModel<T> | AnyObject)>({ noPagination, buttonReload, buttonAdd, buttonMiddle, buttonDelete, search, buttonFilter, bordered, rowHoverable, virtual, rootClassNames, classNames, rowClassName, size, indentSize, title, caption, columns, rowKey, data, expandable, pagination, loading, scroll, sticky, components, summary, onChange, rowSelection, style, }: TableComponentProps<T>) => react_jsx_runtime.JSX.Element;
|
|
784
792
|
declare const _default$3: typeof TableComponent;
|
|
785
793
|
|
|
786
794
|
type TableAsyncSearchItemType = "text" | "select" | "select-multiple" | "switch" | "checkbox" | "date" | "date-range";
|
|
@@ -1014,6 +1022,7 @@ interface TableAsyncComponentRef {
|
|
|
1014
1022
|
}
|
|
1015
1023
|
type TableAsyncComponentProps = TableComponentProps<AnyObject> & {
|
|
1016
1024
|
buttonMiddle?: TableButtonMiddleAsync[];
|
|
1025
|
+
buttonFilterText?: boolean;
|
|
1017
1026
|
search?: boolean;
|
|
1018
1027
|
searchOnChange?: boolean;
|
|
1019
1028
|
noReload?: boolean;
|
|
@@ -1027,6 +1036,7 @@ type TableAsyncComponentProps = TableComponentProps<AnyObject> & {
|
|
|
1027
1036
|
|
|
1028
1037
|
declare const _default$2: React$1.NamedExoticComponent<TableComponentProps<AnyObject> & {
|
|
1029
1038
|
buttonMiddle?: TableButtonMiddleAsync[];
|
|
1039
|
+
buttonFilterText?: boolean;
|
|
1030
1040
|
search?: boolean;
|
|
1031
1041
|
searchOnChange?: boolean;
|
|
1032
1042
|
noReload?: boolean;
|
package/dist/index.esm.js
CHANGED
|
@@ -8404,7 +8404,7 @@ const styleProps$1 = {
|
|
|
8404
8404
|
sm: 12,
|
|
8405
8405
|
},
|
|
8406
8406
|
};
|
|
8407
|
-
const TableComponent = ({ noPagination, buttonReload, buttonAdd, buttonMiddle, buttonDelete, search, buttonFilter,
|
|
8407
|
+
const TableComponent = ({ noPagination, buttonReload, buttonAdd, buttonMiddle, buttonDelete, search, buttonFilter, bordered, rowHoverable, virtual, rootClassNames = [], classNames = [], rowClassName, size, indentSize, title, caption, columns, rowKey, data, expandable, pagination, loading, scroll, sticky, components, summary, onChange, rowSelection, style, }) => {
|
|
8408
8408
|
var _a, _b;
|
|
8409
8409
|
const rowSelectionTable = rowSelection
|
|
8410
8410
|
? Object.assign({ type: (_a = rowSelection.type) !== null && _a !== void 0 ? _a : 'checkbox' }, rowSelection) : undefined;
|
|
@@ -8418,7 +8418,7 @@ const TableComponent = ({ noPagination, buttonReload, buttonAdd, buttonMiddle, b
|
|
|
8418
8418
|
};
|
|
8419
8419
|
return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [(buttonReload || buttonAdd || buttonMiddle || buttonDelete || search || buttonFilter) && (jsxRuntimeExports.jsxs(Row, { className: styleTable['row-top'], children: [jsxRuntimeExports.jsxs(Col, Object.assign({}, styleProps$1.col, { children: [buttonReload && (jsxRuntimeExports.jsx(ButtonComponent$1, { tooltip: !buttonReload.text ? { title: 'Reload' } : undefined, icon: jsxRuntimeExports.jsx(RefIcon$1, {}), classNames: [styleTable['button']], loading: loading, onClick: buttonReload.onClick, href: buttonReload.href, children: buttonReload.text ? 'Reload' : undefined })), buttonAdd && (jsxRuntimeExports.jsx(ButtonComponent$1, { type: "primary", tooltip: !buttonAdd.text ? { title: 'Add' } : undefined, icon: jsxRuntimeExports.jsx(RefIcon$5, {}), classNames: [styleTable['button']], disabled: buttonAdd.disabled, onClick: buttonAdd.onClick, href: buttonAdd.href, children: buttonAdd.text ? 'Add' : undefined })), (_b = buttonMiddle === null || buttonMiddle === void 0 ? void 0 : buttonMiddle.map) === null || _b === void 0 ? void 0 : _b.call(buttonMiddle, buttonMiddleClone), buttonDelete && (jsxRuntimeExports.jsx(ButtonComponent$1, { type: "primary", tooltip: !buttonDelete.text ? { title: 'Delete' } : undefined, icon: jsxRuntimeExports.jsx(RefIcon$b, {}), classNames: [styleTable['button']], disabled: buttonDelete.disabled || loading, onClick: event => { var _a; (_a = buttonDelete.onClick) === null || _a === void 0 ? void 0 : _a.call(buttonDelete, event, undefined); }, children: buttonDelete.text ? 'Delete' : undefined }))] })), jsxRuntimeExports.jsxs(Col, Object.assign({}, styleProps$1.col, { children: [search && (jsxRuntimeExports.jsx(InputComponent$1, { noItem: true, placeholder: "Search", classNames: [styleTable['input-search']], readOnly: loading, onChange: search.onChange, onPressEnter: search.onPressEnter, suffix: jsxRuntimeExports.jsx(RefIcon$2, { onClick: search.onSearch }), allowClear: {
|
|
8420
8420
|
clearIcon: (jsxRuntimeExports.jsx(RefIcon$e, { onClick: search.onClear })),
|
|
8421
|
-
} })), buttonFilter] }))] })), jsxRuntimeExports.jsx(Table, { showSorterTooltip: true, tableLayout: "fixed", className:
|
|
8421
|
+
} })), buttonFilter] }))] })), jsxRuntimeExports.jsx(Table, { showSorterTooltip: true, bordered: bordered, rowHoverable: rowHoverable, virtual: virtual, tableLayout: "fixed", rootClassName: rootClassNames.join(' '), className: ['table-data', ...classNames].join(' '), rowClassName: rowClassName, size: size !== null && size !== void 0 ? size : 'middle', indentSize: indentSize, title: title, caption: caption, columns: columns, rowKey: rowKey !== null && rowKey !== void 0 ? rowKey : 'id', dataSource: data, expandable: expandable, pagination: !noPagination && Object.assign({ pageSizeOptions: ['10', '20', '50', '100', '200'], showSizeChanger: true, showQuickJumper: true, showTotal: (total, range) => `${range[0]}-${range[1]} of ${total} items` }, pagination), loading: loading, scroll: scroll !== null && scroll !== void 0 ? scroll : { y: 'calc(100vh - 300px)' }, sticky: sticky, components: components, summary: summary, onChange: onChange, rowSelection: rowSelectionTable, style: style })] }));
|
|
8422
8422
|
};
|
|
8423
8423
|
var TableComponent$1 = React__default.memo(TableComponent);
|
|
8424
8424
|
|
|
@@ -8441,7 +8441,7 @@ const styleProps = {
|
|
|
8441
8441
|
md: 12,
|
|
8442
8442
|
},
|
|
8443
8443
|
};
|
|
8444
|
-
const TableAsyncSearchComponent = ({ noInitSubmit, noButton, name, items, header, style, }) => {
|
|
8444
|
+
const TableAsyncSearchComponent = ({ noInitSubmit, noButton, buttonText, name, items, header, style, }) => {
|
|
8445
8445
|
var _a;
|
|
8446
8446
|
const { loading, filters, setFilters, filterReady, setFilterReady, setTableParams, tableParamsFormatter, drawerOpen, setDrawerOpen, multiSelectedOptions, setMultiSelectedOptions, } = useTableAsyncSearch();
|
|
8447
8447
|
const filterStorage = getTableFilterStorage();
|
|
@@ -8547,7 +8547,7 @@ const TableAsyncSearchComponent = ({ noInitSubmit, noButton, name, items, header
|
|
|
8547
8547
|
text: item.text,
|
|
8548
8548
|
})) })));
|
|
8549
8549
|
};
|
|
8550
|
-
return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx(ButtonComponent$1, { tooltip: { title: 'Filter' }, icon: jsxRuntimeExports.jsx(RefIcon$7, {}), classNames: [styleTableAsyncSearch['button-filter']], loading: loading, onClick: () => setDrawerOpen === null || setDrawerOpen === void 0 ? void 0 : setDrawerOpen(true), style: style }), jsxRuntimeExports.jsx(Drawer, Object.assign({ forceRender: true, title: drawerTitle, className: styleTableAsyncSearch['drawer-header'], placement: "top", open: drawerOpen, onClose: () => setDrawerOpen === null || setDrawerOpen === void 0 ? void 0 : setDrawerOpen(false) }, !noButton && {
|
|
8550
|
+
return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx(ButtonComponent$1, { tooltip: !buttonText ? { title: 'Filter' } : undefined, icon: jsxRuntimeExports.jsx(RefIcon$7, {}), classNames: [styleTableAsyncSearch['button-filter']], loading: loading, onClick: () => setDrawerOpen === null || setDrawerOpen === void 0 ? void 0 : setDrawerOpen(true), style: style, children: buttonText ? 'Filter' : undefined }), jsxRuntimeExports.jsx(Drawer, Object.assign({ forceRender: true, title: drawerTitle, className: styleTableAsyncSearch['drawer-header'], placement: "top", open: drawerOpen, onClose: () => setDrawerOpen === null || setDrawerOpen === void 0 ? void 0 : setDrawerOpen(false) }, !noButton && {
|
|
8551
8551
|
footer: (jsxRuntimeExports.jsx(Row, { justify: 'end', children: jsxRuntimeExports.jsxs("div", { style: { float: 'right' }, children: [jsxRuntimeExports.jsx(ButtonComponent$1, { tooltip: { title: 'Filter Data' }, icon: jsxRuntimeExports.jsx(RefIcon$8, {}), type: 'primary', classNames: [styleTableAsyncSearch['button-filter-submit']], loading: loading, onClick: form.submit }), jsxRuntimeExports.jsx(ButtonComponent$1, { tooltip: { title: 'Clear Field' }, icon: jsxRuntimeExports.jsx(RefIcon$4, {}),
|
|
8552
8552
|
// htmlType='reset'
|
|
8553
8553
|
loading: loading, onClick: clearHandler })] }) })),
|
|
@@ -8575,8 +8575,8 @@ const TableAsyncSearchComponent = ({ noInitSubmit, noButton, name, items, header
|
|
|
8575
8575
|
var TableAsyncSearchComponent$1 = React__default.memo(TableAsyncSearchComponent);
|
|
8576
8576
|
|
|
8577
8577
|
const TableAsyncChildrenComponent = (_a) => {
|
|
8578
|
-
var _b, _c
|
|
8579
|
-
var { search, searchOnChange, rowSelect, noReload, filterFields, ref } = _a, props = __rest$5(_a, ["search", "searchOnChange", "rowSelect", "noReload", "filterFields", "ref"]);
|
|
8578
|
+
var _b, _c;
|
|
8579
|
+
var { buttonFilterText, search, searchOnChange, rowSelect, noReload, filterFields, ref } = _a, props = __rest$5(_a, ["buttonFilterText", "search", "searchOnChange", "rowSelect", "noReload", "filterFields", "ref"]);
|
|
8580
8580
|
const { loading, filters, tableData, tableParams, setTableParams, tableSearch, setTableSearch, selectedRowKeys, setSelectedRowKeys, tableParamsFormatter, pagination, params, fetchData, } = useTableAsyncSearch();
|
|
8581
8581
|
const buttonMiddle = ((_b = props.buttonMiddle) === null || _b === void 0 ? void 0 : _b.map((item) => {
|
|
8582
8582
|
const { component } = item;
|
|
@@ -8591,13 +8591,22 @@ const TableAsyncChildrenComponent = (_a) => {
|
|
|
8591
8591
|
component: cloneElement(component, additionalProps),
|
|
8592
8592
|
};
|
|
8593
8593
|
})) || props.buttonMiddle || [];
|
|
8594
|
-
const
|
|
8595
|
-
|
|
8596
|
-
|
|
8594
|
+
const buttons = {
|
|
8595
|
+
buttonReload: !noReload
|
|
8596
|
+
? Object.assign(Object.assign({}, props.buttonReload), { onClick: fetchData })
|
|
8597
|
+
: undefined,
|
|
8598
|
+
buttonMiddle,
|
|
8599
|
+
buttonDelete: props.buttonDelete
|
|
8600
|
+
? {
|
|
8597
8601
|
disabled: !(selectedRowKeys === null || selectedRowKeys === void 0 ? void 0 : selectedRowKeys.length),
|
|
8598
8602
|
onClick: (event) => { var _a, _b; return (_b = (_a = props.buttonDelete) === null || _a === void 0 ? void 0 : _a.onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event, selectedRowKeys); },
|
|
8603
|
+
text: props.buttonDelete.text,
|
|
8599
8604
|
}
|
|
8600
|
-
|
|
8605
|
+
: undefined,
|
|
8606
|
+
buttonFilter: filterFields
|
|
8607
|
+
? (jsxRuntimeExports.jsx(TableAsyncSearchComponent$1, { buttonText: buttonFilterText, name: props.name, items: filterFields }))
|
|
8608
|
+
: undefined,
|
|
8609
|
+
};
|
|
8601
8610
|
const handleSearchDataTableChange = (event, onChange = false) => {
|
|
8602
8611
|
const { value } = event.target;
|
|
8603
8612
|
setTableSearch === null || setTableSearch === void 0 ? void 0 : setTableSearch(value);
|
|
@@ -8619,12 +8628,6 @@ const TableAsyncChildrenComponent = (_a) => {
|
|
|
8619
8628
|
return (Object.assign({}, (_a = tableParamsFormatter === null || tableParamsFormatter === void 0 ? void 0 : tableParamsFormatter(prevState, { search: '' })) !== null && _a !== void 0 ? _a : prevState));
|
|
8620
8629
|
});
|
|
8621
8630
|
};
|
|
8622
|
-
if ((_c = props.buttonDelete) === null || _c === void 0 ? void 0 : _c.onClick) {
|
|
8623
|
-
props.buttonDelete.onClick = value => {
|
|
8624
|
-
props.buttonDelete.onClick(value, undefined);
|
|
8625
|
-
fetchData === null || fetchData === void 0 ? void 0 : fetchData();
|
|
8626
|
-
};
|
|
8627
|
-
}
|
|
8628
8631
|
const searchField = searchOnChange ? {
|
|
8629
8632
|
onClear: handleSearchClear,
|
|
8630
8633
|
onChange: event => handleSearchDataTableChange(event, true),
|
|
@@ -8653,9 +8656,7 @@ const TableAsyncChildrenComponent = (_a) => {
|
|
|
8653
8656
|
tableSearch: () => tableSearch,
|
|
8654
8657
|
selectedRowKeys: () => selectedRowKeys,
|
|
8655
8658
|
}));
|
|
8656
|
-
return (jsxRuntimeExports.jsx(TableComponent$1, Object.assign({}, props, {
|
|
8657
|
-
onClick: fetchData,
|
|
8658
|
-
} : undefined, buttonFilter: filterFields ? (jsxRuntimeExports.jsx(TableAsyncSearchComponent$1, { name: props.name, items: filterFields })) : undefined, search: search ? searchField : undefined, rowSelection: rowSelection, data: (_d = tableData === null || tableData === void 0 ? void 0 : tableData.data) !== null && _d !== void 0 ? _d : [], loading: loading, onChange: (pagination, filters, sorter, extra) => setTableParams === null || setTableParams === void 0 ? void 0 : setTableParams((prevState) => {
|
|
8659
|
+
return (jsxRuntimeExports.jsx(TableComponent$1, Object.assign({}, props, buttons, { search: search ? searchField : undefined, rowSelection: rowSelection, data: (_c = tableData === null || tableData === void 0 ? void 0 : tableData.data) !== null && _c !== void 0 ? _c : [], loading: loading, onChange: (pagination, filters, sorter, extra) => setTableParams === null || setTableParams === void 0 ? void 0 : setTableParams((prevState) => {
|
|
8659
8660
|
var _a;
|
|
8660
8661
|
return (Object.assign({}, (_a = tableParamsFormatter === null || tableParamsFormatter === void 0 ? void 0 : tableParamsFormatter(prevState, {
|
|
8661
8662
|
current: pagination.current,
|
package/dist/index.js
CHANGED
|
@@ -8423,7 +8423,7 @@ const styleProps$1 = {
|
|
|
8423
8423
|
sm: 12,
|
|
8424
8424
|
},
|
|
8425
8425
|
};
|
|
8426
|
-
const TableComponent = ({ noPagination, buttonReload, buttonAdd, buttonMiddle, buttonDelete, search, buttonFilter,
|
|
8426
|
+
const TableComponent = ({ noPagination, buttonReload, buttonAdd, buttonMiddle, buttonDelete, search, buttonFilter, bordered, rowHoverable, virtual, rootClassNames = [], classNames = [], rowClassName, size, indentSize, title, caption, columns, rowKey, data, expandable, pagination, loading, scroll, sticky, components, summary, onChange, rowSelection, style, }) => {
|
|
8427
8427
|
var _a, _b;
|
|
8428
8428
|
const rowSelectionTable = rowSelection
|
|
8429
8429
|
? Object.assign({ type: (_a = rowSelection.type) !== null && _a !== void 0 ? _a : 'checkbox' }, rowSelection) : undefined;
|
|
@@ -8437,7 +8437,7 @@ const TableComponent = ({ noPagination, buttonReload, buttonAdd, buttonMiddle, b
|
|
|
8437
8437
|
};
|
|
8438
8438
|
return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [(buttonReload || buttonAdd || buttonMiddle || buttonDelete || search || buttonFilter) && (jsxRuntimeExports.jsxs(antd.Row, { className: styleTable['row-top'], children: [jsxRuntimeExports.jsxs(antd.Col, Object.assign({}, styleProps$1.col, { children: [buttonReload && (jsxRuntimeExports.jsx(ButtonComponent$1, { tooltip: !buttonReload.text ? { title: 'Reload' } : undefined, icon: jsxRuntimeExports.jsx(RefIcon$1, {}), classNames: [styleTable['button']], loading: loading, onClick: buttonReload.onClick, href: buttonReload.href, children: buttonReload.text ? 'Reload' : undefined })), buttonAdd && (jsxRuntimeExports.jsx(ButtonComponent$1, { type: "primary", tooltip: !buttonAdd.text ? { title: 'Add' } : undefined, icon: jsxRuntimeExports.jsx(RefIcon$5, {}), classNames: [styleTable['button']], disabled: buttonAdd.disabled, onClick: buttonAdd.onClick, href: buttonAdd.href, children: buttonAdd.text ? 'Add' : undefined })), (_b = buttonMiddle === null || buttonMiddle === void 0 ? void 0 : buttonMiddle.map) === null || _b === void 0 ? void 0 : _b.call(buttonMiddle, buttonMiddleClone), buttonDelete && (jsxRuntimeExports.jsx(ButtonComponent$1, { type: "primary", tooltip: !buttonDelete.text ? { title: 'Delete' } : undefined, icon: jsxRuntimeExports.jsx(RefIcon$b, {}), classNames: [styleTable['button']], disabled: buttonDelete.disabled || loading, onClick: event => { var _a; (_a = buttonDelete.onClick) === null || _a === void 0 ? void 0 : _a.call(buttonDelete, event, undefined); }, children: buttonDelete.text ? 'Delete' : undefined }))] })), jsxRuntimeExports.jsxs(antd.Col, Object.assign({}, styleProps$1.col, { children: [search && (jsxRuntimeExports.jsx(InputComponent$1, { noItem: true, placeholder: "Search", classNames: [styleTable['input-search']], readOnly: loading, onChange: search.onChange, onPressEnter: search.onPressEnter, suffix: jsxRuntimeExports.jsx(RefIcon$2, { onClick: search.onSearch }), allowClear: {
|
|
8439
8439
|
clearIcon: (jsxRuntimeExports.jsx(RefIcon$e, { onClick: search.onClear })),
|
|
8440
|
-
} })), buttonFilter] }))] })), jsxRuntimeExports.jsx(antd.Table, { showSorterTooltip: true, tableLayout: "fixed", className:
|
|
8440
|
+
} })), buttonFilter] }))] })), jsxRuntimeExports.jsx(antd.Table, { showSorterTooltip: true, bordered: bordered, rowHoverable: rowHoverable, virtual: virtual, tableLayout: "fixed", rootClassName: rootClassNames.join(' '), className: ['table-data', ...classNames].join(' '), rowClassName: rowClassName, size: size !== null && size !== void 0 ? size : 'middle', indentSize: indentSize, title: title, caption: caption, columns: columns, rowKey: rowKey !== null && rowKey !== void 0 ? rowKey : 'id', dataSource: data, expandable: expandable, pagination: !noPagination && Object.assign({ pageSizeOptions: ['10', '20', '50', '100', '200'], showSizeChanger: true, showQuickJumper: true, showTotal: (total, range) => `${range[0]}-${range[1]} of ${total} items` }, pagination), loading: loading, scroll: scroll !== null && scroll !== void 0 ? scroll : { y: 'calc(100vh - 300px)' }, sticky: sticky, components: components, summary: summary, onChange: onChange, rowSelection: rowSelectionTable, style: style })] }));
|
|
8441
8441
|
};
|
|
8442
8442
|
var TableComponent$1 = React.memo(TableComponent);
|
|
8443
8443
|
|
|
@@ -8460,7 +8460,7 @@ const styleProps = {
|
|
|
8460
8460
|
md: 12,
|
|
8461
8461
|
},
|
|
8462
8462
|
};
|
|
8463
|
-
const TableAsyncSearchComponent = ({ noInitSubmit, noButton, name, items, header, style, }) => {
|
|
8463
|
+
const TableAsyncSearchComponent = ({ noInitSubmit, noButton, buttonText, name, items, header, style, }) => {
|
|
8464
8464
|
var _a;
|
|
8465
8465
|
const { loading, filters, setFilters, filterReady, setFilterReady, setTableParams, tableParamsFormatter, drawerOpen, setDrawerOpen, multiSelectedOptions, setMultiSelectedOptions, } = useTableAsyncSearch();
|
|
8466
8466
|
const filterStorage = getTableFilterStorage();
|
|
@@ -8566,7 +8566,7 @@ const TableAsyncSearchComponent = ({ noInitSubmit, noButton, name, items, header
|
|
|
8566
8566
|
text: item.text,
|
|
8567
8567
|
})) })));
|
|
8568
8568
|
};
|
|
8569
|
-
return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx(ButtonComponent$1, { tooltip: { title: 'Filter' }, icon: jsxRuntimeExports.jsx(RefIcon$7, {}), classNames: [styleTableAsyncSearch['button-filter']], loading: loading, onClick: () => setDrawerOpen === null || setDrawerOpen === void 0 ? void 0 : setDrawerOpen(true), style: style }), jsxRuntimeExports.jsx(antd.Drawer, Object.assign({ forceRender: true, title: drawerTitle, className: styleTableAsyncSearch['drawer-header'], placement: "top", open: drawerOpen, onClose: () => setDrawerOpen === null || setDrawerOpen === void 0 ? void 0 : setDrawerOpen(false) }, !noButton && {
|
|
8569
|
+
return (jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx(ButtonComponent$1, { tooltip: !buttonText ? { title: 'Filter' } : undefined, icon: jsxRuntimeExports.jsx(RefIcon$7, {}), classNames: [styleTableAsyncSearch['button-filter']], loading: loading, onClick: () => setDrawerOpen === null || setDrawerOpen === void 0 ? void 0 : setDrawerOpen(true), style: style, children: buttonText ? 'Filter' : undefined }), jsxRuntimeExports.jsx(antd.Drawer, Object.assign({ forceRender: true, title: drawerTitle, className: styleTableAsyncSearch['drawer-header'], placement: "top", open: drawerOpen, onClose: () => setDrawerOpen === null || setDrawerOpen === void 0 ? void 0 : setDrawerOpen(false) }, !noButton && {
|
|
8570
8570
|
footer: (jsxRuntimeExports.jsx(antd.Row, { justify: 'end', children: jsxRuntimeExports.jsxs("div", { style: { float: 'right' }, children: [jsxRuntimeExports.jsx(ButtonComponent$1, { tooltip: { title: 'Filter Data' }, icon: jsxRuntimeExports.jsx(RefIcon$8, {}), type: 'primary', classNames: [styleTableAsyncSearch['button-filter-submit']], loading: loading, onClick: form.submit }), jsxRuntimeExports.jsx(ButtonComponent$1, { tooltip: { title: 'Clear Field' }, icon: jsxRuntimeExports.jsx(RefIcon$4, {}),
|
|
8571
8571
|
// htmlType='reset'
|
|
8572
8572
|
loading: loading, onClick: clearHandler })] }) })),
|
|
@@ -8594,8 +8594,8 @@ const TableAsyncSearchComponent = ({ noInitSubmit, noButton, name, items, header
|
|
|
8594
8594
|
var TableAsyncSearchComponent$1 = React.memo(TableAsyncSearchComponent);
|
|
8595
8595
|
|
|
8596
8596
|
const TableAsyncChildrenComponent = (_a) => {
|
|
8597
|
-
var _b, _c
|
|
8598
|
-
var { search, searchOnChange, rowSelect, noReload, filterFields, ref } = _a, props = __rest$5(_a, ["search", "searchOnChange", "rowSelect", "noReload", "filterFields", "ref"]);
|
|
8597
|
+
var _b, _c;
|
|
8598
|
+
var { buttonFilterText, search, searchOnChange, rowSelect, noReload, filterFields, ref } = _a, props = __rest$5(_a, ["buttonFilterText", "search", "searchOnChange", "rowSelect", "noReload", "filterFields", "ref"]);
|
|
8599
8599
|
const { loading, filters, tableData, tableParams, setTableParams, tableSearch, setTableSearch, selectedRowKeys, setSelectedRowKeys, tableParamsFormatter, pagination, params, fetchData, } = useTableAsyncSearch();
|
|
8600
8600
|
const buttonMiddle = ((_b = props.buttonMiddle) === null || _b === void 0 ? void 0 : _b.map((item) => {
|
|
8601
8601
|
const { component } = item;
|
|
@@ -8610,13 +8610,22 @@ const TableAsyncChildrenComponent = (_a) => {
|
|
|
8610
8610
|
component: React.cloneElement(component, additionalProps),
|
|
8611
8611
|
};
|
|
8612
8612
|
})) || props.buttonMiddle || [];
|
|
8613
|
-
const
|
|
8614
|
-
|
|
8615
|
-
|
|
8613
|
+
const buttons = {
|
|
8614
|
+
buttonReload: !noReload
|
|
8615
|
+
? Object.assign(Object.assign({}, props.buttonReload), { onClick: fetchData })
|
|
8616
|
+
: undefined,
|
|
8617
|
+
buttonMiddle,
|
|
8618
|
+
buttonDelete: props.buttonDelete
|
|
8619
|
+
? {
|
|
8616
8620
|
disabled: !(selectedRowKeys === null || selectedRowKeys === void 0 ? void 0 : selectedRowKeys.length),
|
|
8617
8621
|
onClick: (event) => { var _a, _b; return (_b = (_a = props.buttonDelete) === null || _a === void 0 ? void 0 : _a.onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event, selectedRowKeys); },
|
|
8622
|
+
text: props.buttonDelete.text,
|
|
8618
8623
|
}
|
|
8619
|
-
|
|
8624
|
+
: undefined,
|
|
8625
|
+
buttonFilter: filterFields
|
|
8626
|
+
? (jsxRuntimeExports.jsx(TableAsyncSearchComponent$1, { buttonText: buttonFilterText, name: props.name, items: filterFields }))
|
|
8627
|
+
: undefined,
|
|
8628
|
+
};
|
|
8620
8629
|
const handleSearchDataTableChange = (event, onChange = false) => {
|
|
8621
8630
|
const { value } = event.target;
|
|
8622
8631
|
setTableSearch === null || setTableSearch === void 0 ? void 0 : setTableSearch(value);
|
|
@@ -8638,12 +8647,6 @@ const TableAsyncChildrenComponent = (_a) => {
|
|
|
8638
8647
|
return (Object.assign({}, (_a = tableParamsFormatter === null || tableParamsFormatter === void 0 ? void 0 : tableParamsFormatter(prevState, { search: '' })) !== null && _a !== void 0 ? _a : prevState));
|
|
8639
8648
|
});
|
|
8640
8649
|
};
|
|
8641
|
-
if ((_c = props.buttonDelete) === null || _c === void 0 ? void 0 : _c.onClick) {
|
|
8642
|
-
props.buttonDelete.onClick = value => {
|
|
8643
|
-
props.buttonDelete.onClick(value, undefined);
|
|
8644
|
-
fetchData === null || fetchData === void 0 ? void 0 : fetchData();
|
|
8645
|
-
};
|
|
8646
|
-
}
|
|
8647
8650
|
const searchField = searchOnChange ? {
|
|
8648
8651
|
onClear: handleSearchClear,
|
|
8649
8652
|
onChange: event => handleSearchDataTableChange(event, true),
|
|
@@ -8672,9 +8675,7 @@ const TableAsyncChildrenComponent = (_a) => {
|
|
|
8672
8675
|
tableSearch: () => tableSearch,
|
|
8673
8676
|
selectedRowKeys: () => selectedRowKeys,
|
|
8674
8677
|
}));
|
|
8675
|
-
return (jsxRuntimeExports.jsx(TableComponent$1, Object.assign({}, props, {
|
|
8676
|
-
onClick: fetchData,
|
|
8677
|
-
} : undefined, buttonFilter: filterFields ? (jsxRuntimeExports.jsx(TableAsyncSearchComponent$1, { name: props.name, items: filterFields })) : undefined, search: search ? searchField : undefined, rowSelection: rowSelection, data: (_d = tableData === null || tableData === void 0 ? void 0 : tableData.data) !== null && _d !== void 0 ? _d : [], loading: loading, onChange: (pagination, filters, sorter, extra) => setTableParams === null || setTableParams === void 0 ? void 0 : setTableParams((prevState) => {
|
|
8678
|
+
return (jsxRuntimeExports.jsx(TableComponent$1, Object.assign({}, props, buttons, { search: search ? searchField : undefined, rowSelection: rowSelection, data: (_c = tableData === null || tableData === void 0 ? void 0 : tableData.data) !== null && _c !== void 0 ? _c : [], loading: loading, onChange: (pagination, filters, sorter, extra) => setTableParams === null || setTableParams === void 0 ? void 0 : setTableParams((prevState) => {
|
|
8678
8679
|
var _a;
|
|
8679
8680
|
return (Object.assign({}, (_a = tableParamsFormatter === null || tableParamsFormatter === void 0 ? void 0 : tableParamsFormatter(prevState, {
|
|
8680
8681
|
current: pagination.current,
|