es-grid-template 1.8.65 → 1.8.67

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.
Files changed (162) hide show
  1. package/es/grid-component/TempTable.d.ts +2 -2
  2. package/es/grid-component/TempTable.js +3 -3
  3. package/es/grid-component/hooks/constant.d.ts +1 -0
  4. package/es/grid-component/hooks/constant.js +2 -1
  5. package/es/grid-component/hooks/index.js +0 -1
  6. package/es/grid-component/hooks/useLazyKVMap.d.ts +1 -1
  7. package/es/grid-component/hooks/useLazyKVMap.js +0 -4
  8. package/es/grid-component/hooks/utils.d.ts +3 -4
  9. package/es/grid-component/hooks/utils.js +2 -1
  10. package/es/grid-component/styles.scss +1394 -1394
  11. package/es/grid-component/type.d.ts +0 -414
  12. package/es/grid-component/type.js +490 -1
  13. package/es/table-component/TableContainerEdit.js +2 -127
  14. package/es/table-component/body/TableBodyCellEdit.js +2 -9
  15. package/es/table-component/header/TableHeadCell.js +1 -10
  16. package/es/table-component/header/TableHeadCell2.js +1 -1
  17. package/es/table-component/type.d.ts +3 -1
  18. package/es/table-virtuoso/ColumnsGroup/ColumnsGroup.js +1 -3
  19. package/es/table-virtuoso/InternalTable.js +6 -28
  20. package/es/table-virtuoso/body/TableBodyCell.js +0 -9
  21. package/es/table-virtuoso/body/TableBodyRow.js +0 -4
  22. package/es/table-virtuoso/style.js +2 -1
  23. package/es/table-virtuoso/style.scss +2 -1
  24. package/es/table-virtuoso/table/Grid.js +0 -4
  25. package/es/table-virtuoso/table/TableContainer.js +31 -44
  26. package/es/table-virtuoso/table/TableWrapper.d.ts +2 -0
  27. package/es/table-virtuoso/table/TableWrapper.js +5 -2
  28. package/lib/grid-component/TempTable.d.ts +2 -2
  29. package/lib/grid-component/TempTable.js +3 -5
  30. package/lib/grid-component/hooks/constant.d.ts +1 -0
  31. package/lib/grid-component/hooks/constant.js +3 -2
  32. package/lib/grid-component/hooks/useLazyKVMap.d.ts +1 -1
  33. package/lib/grid-component/hooks/useLazyKVMap.js +0 -3
  34. package/lib/grid-component/hooks/utils.d.ts +3 -4
  35. package/lib/grid-component/hooks/utils.js +3 -0
  36. package/lib/grid-component/styles.scss +1394 -1394
  37. package/lib/grid-component/type.d.ts +0 -414
  38. package/lib/grid-component/type.js +490 -4
  39. package/lib/table-component/TableContainerEdit.js +1 -126
  40. package/lib/table-component/body/TableBodyCellEdit.js +5 -11
  41. package/lib/table-component/header/TableHeadCell.js +4 -13
  42. package/lib/table-component/header/TableHeadCell2.js +4 -4
  43. package/lib/table-component/type.d.ts +3 -1
  44. package/lib/table-virtuoso/ColumnsGroup/ColumnsGroup.js +1 -3
  45. package/lib/table-virtuoso/InternalTable.js +6 -28
  46. package/lib/table-virtuoso/body/TableBodyCell.js +0 -9
  47. package/lib/table-virtuoso/body/TableBodyRow.js +0 -5
  48. package/lib/table-virtuoso/style.js +2 -1
  49. package/lib/table-virtuoso/style.scss +2 -1
  50. package/lib/table-virtuoso/table/Grid.js +0 -4
  51. package/lib/table-virtuoso/table/TableContainer.js +29 -42
  52. package/lib/table-virtuoso/table/TableWrapper.d.ts +2 -0
  53. package/lib/table-virtuoso/table/TableWrapper.js +4 -2
  54. package/package.json +1 -1
  55. package/es/grid-component/AdvanceFilter.d.ts +0 -14
  56. package/es/grid-component/AdvanceFilter.js +0 -454
  57. package/es/grid-component/CheckboxFilter.d.ts +0 -20
  58. package/es/grid-component/CheckboxFilter.js +0 -244
  59. package/es/grid-component/CheckboxFilter2.d.ts +0 -20
  60. package/es/grid-component/CheckboxFilter2.js +0 -244
  61. package/es/grid-component/ColumnsChoose.d.ts +0 -10
  62. package/es/grid-component/ColumnsChoose.js +0 -230
  63. package/es/grid-component/ColumnsGroup/ColumnsGroup.d.ts +0 -12
  64. package/es/grid-component/ColumnsGroup/ColumnsGroup.js +0 -232
  65. package/es/grid-component/ColumnsGroup/index.d.ts +0 -1
  66. package/es/grid-component/ColumnsGroup/index.js +0 -1
  67. package/es/grid-component/Command.d.ts +0 -8
  68. package/es/grid-component/Command.js +0 -80
  69. package/es/grid-component/ContextMenu.d.ts +0 -20
  70. package/es/grid-component/ContextMenu.js +0 -130
  71. package/es/grid-component/EditForm/EditForm.d.ts +0 -27
  72. package/es/grid-component/EditForm/EditForm.js +0 -394
  73. package/es/grid-component/EditForm/index.d.ts +0 -1
  74. package/es/grid-component/EditForm/index.js +0 -1
  75. package/es/grid-component/EditableCell.d.ts +0 -20
  76. package/es/grid-component/EditableCell.js +0 -1030
  77. package/es/grid-component/FilterSearch.d.ts +0 -12
  78. package/es/grid-component/FilterSearch.js +0 -33
  79. package/es/grid-component/GridStyle.d.ts +0 -8
  80. package/es/grid-component/GridStyle.js +0 -5
  81. package/es/grid-component/TableGrid.d.ts +0 -21
  82. package/es/grid-component/TableGrid.js +0 -493
  83. package/es/grid-component/async-select/index.d.ts +0 -11
  84. package/es/grid-component/async-select/index.js +0 -38
  85. package/es/grid-component/async-table-select/index.d.ts +0 -11
  86. package/es/grid-component/async-table-select/index.js +0 -40
  87. package/es/grid-component/checkbox-control/index.d.ts +0 -13
  88. package/es/grid-component/checkbox-control/index.js +0 -40
  89. package/es/grid-component/hooks/columns/index.d.ts +0 -10
  90. package/es/grid-component/hooks/columns/index.js +0 -503
  91. package/es/grid-component/hooks/content/ControlCheckbox.d.ts +0 -13
  92. package/es/grid-component/hooks/content/ControlCheckbox.js +0 -87
  93. package/es/grid-component/hooks/content/HeaderContent.d.ts +0 -14
  94. package/es/grid-component/hooks/content/HeaderContent.js +0 -44
  95. package/es/grid-component/hooks/content/TooltipContent.d.ts +0 -13
  96. package/es/grid-component/hooks/content/TooltipContent.js +0 -74
  97. package/es/grid-component/hooks/useColumns.d.ts +0 -19
  98. package/es/grid-component/hooks/useColumns.js +0 -317
  99. package/es/grid-component/number/index.d.ts +0 -10
  100. package/es/grid-component/number/index.js +0 -39
  101. package/es/grid-component/number-range/index.d.ts +0 -11
  102. package/es/grid-component/number-range/index.js +0 -63
  103. package/es/grid-component/useContext.d.ts +0 -34
  104. package/es/grid-component/useContext.js +0 -8
  105. package/es/table-component/hook/constant.d.ts +0 -73
  106. package/es/table-component/hook/constant.js +0 -240
  107. package/es/table-virtuoso/body/TableBody.d.ts +0 -14
  108. package/es/table-virtuoso/body/TableBody.js +0 -84
  109. package/lib/grid-component/AdvanceFilter.d.ts +0 -14
  110. package/lib/grid-component/AdvanceFilter.js +0 -463
  111. package/lib/grid-component/CheckboxFilter.d.ts +0 -20
  112. package/lib/grid-component/CheckboxFilter.js +0 -253
  113. package/lib/grid-component/CheckboxFilter2.d.ts +0 -20
  114. package/lib/grid-component/CheckboxFilter2.js +0 -253
  115. package/lib/grid-component/ColumnsChoose.d.ts +0 -10
  116. package/lib/grid-component/ColumnsChoose.js +0 -240
  117. package/lib/grid-component/ColumnsGroup/ColumnsGroup.d.ts +0 -12
  118. package/lib/grid-component/ColumnsGroup/ColumnsGroup.js +0 -243
  119. package/lib/grid-component/ColumnsGroup/index.d.ts +0 -1
  120. package/lib/grid-component/ColumnsGroup/index.js +0 -16
  121. package/lib/grid-component/Command.d.ts +0 -8
  122. package/lib/grid-component/Command.js +0 -88
  123. package/lib/grid-component/ContextMenu.d.ts +0 -20
  124. package/lib/grid-component/ContextMenu.js +0 -140
  125. package/lib/grid-component/EditForm/EditForm.d.ts +0 -27
  126. package/lib/grid-component/EditForm/EditForm.js +0 -404
  127. package/lib/grid-component/EditForm/index.d.ts +0 -1
  128. package/lib/grid-component/EditForm/index.js +0 -16
  129. package/lib/grid-component/EditableCell.d.ts +0 -20
  130. package/lib/grid-component/EditableCell.js +0 -1032
  131. package/lib/grid-component/FilterSearch.d.ts +0 -12
  132. package/lib/grid-component/FilterSearch.js +0 -42
  133. package/lib/grid-component/GridStyle.d.ts +0 -8
  134. package/lib/grid-component/GridStyle.js +0 -12
  135. package/lib/grid-component/TableGrid.d.ts +0 -21
  136. package/lib/grid-component/TableGrid.js +0 -493
  137. package/lib/grid-component/async-select/index.d.ts +0 -11
  138. package/lib/grid-component/async-select/index.js +0 -47
  139. package/lib/grid-component/async-table-select/index.d.ts +0 -11
  140. package/lib/grid-component/async-table-select/index.js +0 -49
  141. package/lib/grid-component/checkbox-control/index.d.ts +0 -13
  142. package/lib/grid-component/checkbox-control/index.js +0 -48
  143. package/lib/grid-component/hooks/columns/index.d.ts +0 -10
  144. package/lib/grid-component/hooks/columns/index.js +0 -518
  145. package/lib/grid-component/hooks/content/ControlCheckbox.d.ts +0 -13
  146. package/lib/grid-component/hooks/content/ControlCheckbox.js +0 -95
  147. package/lib/grid-component/hooks/content/HeaderContent.d.ts +0 -14
  148. package/lib/grid-component/hooks/content/HeaderContent.js +0 -53
  149. package/lib/grid-component/hooks/content/TooltipContent.d.ts +0 -13
  150. package/lib/grid-component/hooks/content/TooltipContent.js +0 -81
  151. package/lib/grid-component/hooks/useColumns.d.ts +0 -19
  152. package/lib/grid-component/hooks/useColumns.js +0 -328
  153. package/lib/grid-component/number/index.d.ts +0 -10
  154. package/lib/grid-component/number/index.js +0 -47
  155. package/lib/grid-component/number-range/index.d.ts +0 -11
  156. package/lib/grid-component/number-range/index.js +0 -71
  157. package/lib/grid-component/useContext.d.ts +0 -34
  158. package/lib/grid-component/useContext.js +0 -13
  159. package/lib/table-component/hook/constant.d.ts +0 -73
  160. package/lib/table-component/hook/constant.js +0 -247
  161. package/lib/table-virtuoso/body/TableBody.d.ts +0 -14
  162. package/lib/table-virtuoso/body/TableBody.js +0 -95
@@ -1,12 +0,0 @@
1
- import * as React from 'react';
2
- import type { FilterSearchType, TableLocale } from "antd/es/table/interface";
3
- import type { AnyObject } from "./type";
4
- interface FilterSearchProps<RecordType = AnyObject> {
5
- value: string;
6
- onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
7
- filterSearch: FilterSearchType<RecordType>;
8
- tablePrefixCls: string;
9
- locale?: TableLocale;
10
- }
11
- declare const FilterSearch: <RecordType extends AnyObject = AnyObject>(props: FilterSearchProps<RecordType>) => React.JSX.Element;
12
- export default FilterSearch;
@@ -1,33 +0,0 @@
1
- import * as React from 'react';
2
- import SearchOutlined from '@ant-design/icons/SearchOutlined';
3
- import { Input } from 'rc-master-ui';
4
- const FilterSearch = props => {
5
- const {
6
- value,
7
- filterSearch,
8
- tablePrefixCls,
9
- locale,
10
- onChange
11
- } = props;
12
- if (!filterSearch) {
13
- return null;
14
- }
15
- return /*#__PURE__*/React.createElement("div", {
16
- className: `${tablePrefixCls}-filter-dropdown-search`,
17
- style: {
18
- paddingLeft: 0,
19
- paddingRight: 0
20
- }
21
- }, /*#__PURE__*/React.createElement(Input, {
22
- suffix: /*#__PURE__*/React.createElement(SearchOutlined, null),
23
- placeholder: locale?.filterSearchPlaceholder,
24
- onChange: onChange,
25
- value: value,
26
- autoFocus: true
27
- // for skip min-width of input
28
- ,
29
- htmlSize: 1,
30
- className: `${tablePrefixCls}-filter-dropdown-search-input`
31
- }));
32
- };
33
- export default FilterSearch;
@@ -1,8 +0,0 @@
1
- /// <reference types="react" />
2
- interface GridProps {
3
- $heightTable?: number;
4
- $heightScroll?: number;
5
- $isFullScreen?: boolean;
6
- }
7
- export declare const GridStyle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, GridProps>> & string;
8
- export {};
@@ -1,5 +0,0 @@
1
- import styled from "styled-components";
2
- export const GridStyle = styled.div.withConfig({
3
- displayName: "GridStyle",
4
- componentId: "es-grid-template__sc-sueu2e-0"
5
- })(["height:", ";.ui-rc-table.ui-rc-table-virtual.ui-rc-table-scroll-horizontal{.ui-rc-table-container{&:has(.ui-rc-table-tbody-virtual-scrollbar-horizontal){padding-bottom:8px;border-bottom:1px solid #e0e0e0;}}}.ui-rc-table-container{.ui-rc-table-tbody-virtual.ui-rc-table-tbody{min-height:", ";}.ui-rc-table-body{&:has(.ui-rc-table-placeholder){height:", ";}table{height:100%;.ui-rc-table-placeholder{vertical-align:top;}}}.ui-rc-table-placeholder{}}.ui-rc-toolbar-bottom{position:relative;padding:.25rem 1rem;background-color:#ffffff;&::before{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:100%;bottom:0;left:0;}&::after{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:100%;bottom:0;visibility:visible;right:0;}.toolbar-button{border-radius:0;.ant-btn{border-radius:0;}}}.ui-rc-pagination{border-bottom:1px solid #e0e0e0;border-top:1px solid #e0e0e0;margin:0;padding:.75rem 1rem;background-color:#ffffff;.ui-rc-pagination-total-text{order:2;margin-left:auto;}&::before{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:50px;bottom:0;left:0;}&::after{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:50px;bottom:0;visibility:visible;right:0;}&.pagination-template{position:relative;&::before{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:100%;bottom:0;left:0;}&::after{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:100%;bottom:0;visibility:visible;right:0;}}}.react-resizable{position:relative;background-clip:padding-box;}.rc-resizable-handle{position:absolute;right:0px;bottom:0;z-index:1;width:5px;height:100%;cursor:col-resize;&.none{cursor:auto;display:none;}}"], props => props.$heightTable ? `${props.$heightTable}px` : undefined, props => props.$heightScroll ? `${props.$heightScroll}px` : undefined, props => props.$heightScroll ? `${props.$heightScroll - 1}px` : undefined);
@@ -1,21 +0,0 @@
1
- import React from 'react';
2
- import 'dayjs/locale/es';
3
- import 'dayjs/locale/vi';
4
- import type { ColumnsTable, GetRowKey, GridTableProps } from "./type";
5
- type GridProps<T> = GridTableProps<T> & {
6
- triggerChangeColumns?: (columns: ColumnsTable<T>, type: string) => void;
7
- triggerChangeData?: (newData: T[], type: string) => void;
8
- triggerFilter?: (queries: any) => void;
9
- triggerGroupColumns?: (groupedColumns: string[]) => void;
10
- tableRef: any;
11
- bottomToolbar?: () => React.ReactElement;
12
- getRowKey: GetRowKey<T>;
13
- rowSelection?: any;
14
- groupToolbar?: () => React.ReactNode;
15
- isFilter?: boolean;
16
- setIsFilter?: React.Dispatch<React.SetStateAction<boolean>>;
17
- handleFullScreen?: any;
18
- isFullScreen?: boolean;
19
- };
20
- declare const TableGrid: <RecordType extends object>(props: GridProps<RecordType>) => React.JSX.Element;
21
- export default TableGrid;
@@ -1,493 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
- import React, { Fragment } from 'react';
3
- import { createStyles } from 'antd-style';
4
- import { numericFormatter } from "react-numeric-component";
5
- import { Empty, Table, Toolbar } from "rc-master-ui";
6
- // import Table from "../../core/table"
7
-
8
- import 'dayjs/locale/es';
9
- import 'dayjs/locale/vi';
10
- import ContextMenu from "./ContextMenu";
11
- import classNames from "classnames";
12
- import { checkDecimalSeparator, checkThousandSeparator,
13
- // filterDataByColumns2,
14
- // filterDataByColumns3,
15
- filterDataByColumns4, getFormat,
16
- // convertFlatColumn,
17
- isEmpty, sumByField
18
- // newGuid,
19
- // removeColumns,
20
- // sumDataByField
21
- // updateArrayByKey
22
- } from "./hooks";
23
- // import {ConfigProvider} from "antd";
24
- import { flatColumns } from "./hooks/columns";
25
- import Pagination from "rc-master-ui/es/pagination";
26
- import ComponentSpinner from "./LoadingSpinner";
27
- import { ColumnsChoose } from "./ColumnsChoose";
28
- import useMergedState from "rc-util/es/hooks/useMergedState";
29
- import AdvanceFilter from "./AdvanceFilter";
30
- import { Tooltip } from "react-tooltip";
31
- import { Maximize, Minimize } from 'becoxy-icons';
32
- const useStyle = createStyles(({
33
- css
34
- }) => {
35
- const antCls = 'ui-rc';
36
- return {
37
- customTable: css`
38
- ${antCls}-table {
39
- ${antCls}-table-container {
40
- ${antCls}-table-body,
41
- ${antCls}-table-content {
42
- scrollbar-width: thin;
43
- scrollbar-color: #eaeaea transparent;
44
- scrollbar-gutter: stable;
45
- }
46
- }
47
- }
48
- `
49
- };
50
- });
51
- // type OnChange = NonNullable<TableProps<any>['onChange']>;
52
-
53
- const EMPTY_LIST = [];
54
- const TableGrid = props => {
55
- const {
56
- id,
57
- columns,
58
- tableRef,
59
- dataSource,
60
- locale,
61
- expandable,
62
- rowHoverable,
63
- title,
64
- format,
65
- virtualRow = true,
66
- t,
67
- lang,
68
- contextMenuOpen,
69
- className,
70
- contextMenuItems: propContextMenuItems,
71
- contextMenuHidden,
72
- contextMenuClick,
73
- recordDoubleClick,
74
- toolbarItems,
75
- showColumnChoose,
76
- showAdvanceFilter,
77
- // onFilter,
78
- triggerFilter,
79
- selectionSettings,
80
- rowSelection,
81
- rowSelected,
82
- rowKey = 'id',
83
- pagination,
84
- scroll,
85
- onFilterClick,
86
- dataSourceFilter: propDataSourceFilter,
87
- loading,
88
- triggerChangeColumns,
89
- triggerGroupColumns,
90
- summary,
91
- showToolbar,
92
- // onSorter,
93
- bottomToolbar,
94
- groupSetting,
95
- groupAble,
96
- getRowKey,
97
- groupColumns,
98
- groupToolbar,
99
- showEmptyText,
100
- // setIsFilter,
101
- actionTemplate,
102
- handleFullScreen,
103
- fullScreen,
104
- isFullScreen,
105
- ...rest
106
- } = props;
107
- const {
108
- styles
109
- } = useStyle();
110
- const {
111
- mode,
112
- type,
113
- checkboxOnly,
114
- hideSelectAll,
115
- columnWidth,
116
- selectedRowKeys,
117
- defaultSelectedRowKeys
118
- } = selectionSettings || {};
119
- const clickRef = React.useRef(null);
120
- const menuRef = React.useRef(null);
121
- const viewportWidth = window.innerWidth;
122
- const viewportHeight = window.innerHeight;
123
- const [menuVisible, setMenuVisible] = React.useState(false);
124
- const [selectedRowData, setSelectedRowData] = React.useState(null);
125
- const [position, setPosition] = React.useState({
126
- x: 0,
127
- y: 0,
128
- viewportWidth,
129
- viewportHeight
130
- });
131
-
132
- // const [filterStates, setFilterState] = React.useState<any>(null)
133
-
134
- // const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>(defaultSelected);
135
-
136
- // ========================= Keys =========================
137
- const [mergedSelectedKeys, setMergedSelectedKeys] = useMergedState(selectedRowKeys || defaultSelectedRowKeys || EMPTY_LIST, {
138
- value: selectedRowKeys
139
- });
140
-
141
- // Reset if rowSelection reset
142
-
143
- React.useEffect(() => {
144
- if (!selectionSettings) {
145
- setMergedSelectedKeys(EMPTY_LIST);
146
- }
147
- }, [!!selectionSettings]);
148
- const contextMenuItems = React.useMemo(() => {
149
- if (typeof contextMenuHidden === "function" && propContextMenuItems && selectedRowData) {
150
- const hiddenItems = contextMenuHidden({
151
- rowInfo: {
152
- rowData: selectedRowData
153
- }
154
- });
155
- return propContextMenuItems.filter(item => !hiddenItems.includes(item?.key));
156
- }
157
- if (contextMenuHidden && typeof contextMenuHidden !== 'function' && propContextMenuItems) {
158
- return propContextMenuItems.filter(item => !contextMenuHidden.includes(item?.key));
159
- }
160
- return propContextMenuItems;
161
- }, [propContextMenuItems, contextMenuHidden, selectedRowData]);
162
- React.useLayoutEffect(() => {
163
- setMenuVisible(false);
164
- }, []);
165
- const onContextMenu = data => event => {
166
- event.preventDefault(); // Ngăn chặn menu mặc định của trình duyệt
167
-
168
- setSelectedRowData(data);
169
- contextMenuOpen?.({
170
- rowInfo: {
171
- rowData: data
172
- },
173
- event
174
- });
175
- setMenuVisible(true);
176
-
177
- // Đợi DOM cập nhật và lấy kích thước menu
178
- setTimeout(() => {
179
- const menuElement = menuRef.current; // Lấy menu từ DOM
180
- const menuWidth = menuElement?.offsetWidth || 200; // Mặc định 200px nếu chưa render
181
- const menuHeight = menuElement?.offsetHeight; // Mặc định 450px nếu chưa render
182
-
183
- // Điều chỉnh vị trí menu
184
- let x = event.clientX;
185
- let y = event.clientY;
186
- if (x + menuWidth > viewportWidth) {
187
- x = x - menuWidth - 10; // Cách cạnh phải 10px
188
- }
189
- if (y + menuHeight > viewportHeight) {
190
- if (y < menuHeight) {
191
- y = 10;
192
- } else {
193
- y = y - 10 - menuHeight; // Cách cạnh dưới 10px
194
- }
195
- }
196
- setPosition(prevState => ({
197
- ...prevState,
198
- x,
199
- y
200
- }));
201
- }, 100);
202
- if (!menuVisible) {
203
- document.addEventListener(`click`, function onClickOutside(e) {
204
- const element = e.target;
205
- const menuContainer = document.querySelector(".popup-context-menu");
206
- const isInsideContainer = element.closest(".popup-context-menu") && menuContainer;
207
- if (isInsideContainer) {
208
- return;
209
- }
210
- setMenuVisible(false);
211
- document.removeEventListener(`click`, onClickOutside);
212
- });
213
- }
214
- };
215
- const handleRowClick = () => () => {
216
- // const key = getRowKey(record, index);
217
-
218
- if (checkboxOnly !== true) {
219
- if (type === 'single') {}
220
- }
221
- };
222
- const handleRowDoubleClick = (record, index) => e => {
223
- if (clickRef.current) {
224
- clearTimeout(clickRef.current);
225
- clickRef.current = null;
226
- }
227
- recordDoubleClick?.({
228
- e,
229
- rowIndex: index,
230
- rowData: record
231
- });
232
- };
233
- const onSelectChange = (keys, selectedRows, info, selectedRow) => {
234
- if (info.type === 'all') {
235
- setMergedSelectedKeys(keys);
236
- rowSelected?.({
237
- selected: selectedRows,
238
- type: 'rowSelected',
239
- rowData: {}
240
- });
241
- } else {
242
- if (selectionSettings?.type === 'multiple') {
243
- setMergedSelectedKeys(keys);
244
- rowSelected?.({
245
- selected: selectedRows,
246
- type: 'rowSelected',
247
- rowData: selectedRow
248
- });
249
- } else {
250
- const keySet = new Set(keys);
251
-
252
- // @ts-ignore
253
- if (!keySet.has(selectedRow[rowKey])) {
254
- setMergedSelectedKeys([]);
255
- rowSelected?.({
256
- selected: [],
257
- type: 'rowSelected',
258
- rowData: selectedRow
259
- });
260
- } else {
261
- // @ts-ignore
262
- setMergedSelectedKeys([selectedRow[rowKey]]);
263
- rowSelected?.({
264
- // @ts-ignore
265
- selected: [selectedRow],
266
- type: 'rowSelected',
267
- rowData: selectedRow
268
- });
269
- }
270
- }
271
- }
272
- };
273
-
274
- // const handleChange = (sorter: any) => {
275
- // onSorter?.(sorter)
276
- // }
277
-
278
- // const handleOnFilter = (queries: any) => {
279
- //
280
- // if (onFilter) {
281
- // onFilter?.(convertFilters(queries))
282
- // } else {
283
- // setFilterState(convertFilters(queries))
284
- // if (queries && queries.length > 0) {
285
- // // setIsFilter?.(true)
286
- // } else {
287
- // // setIsFilter?.(false)
288
- // }
289
- // }
290
- //
291
- // }
292
-
293
- return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(ContextMenu, {
294
- open: menuVisible,
295
- pos: position,
296
- setOpen: setMenuVisible,
297
- menuRef: menuRef,
298
- contextMenuItems: contextMenuItems,
299
- contextMenuClick: contextMenuClick,
300
- rowData: selectedRowData
301
- }), /*#__PURE__*/React.createElement(Table, _extends({
302
- ref: tableRef
303
- }, rest, {
304
- tableLayout: 'fixed',
305
- locale: {
306
- ...locale,
307
- emptyText: showEmptyText !== false ? /*#__PURE__*/React.createElement(Empty, {
308
- image: Empty.PRESENTED_IMAGE_SIMPLE,
309
- description: locale?.emptyText
310
- }) : /*#__PURE__*/React.createElement(React.Fragment, null)
311
- },
312
- loading: {
313
- spinning: columns && columns.length === 0 || loading === true,
314
- indicator: /*#__PURE__*/React.createElement(ComponentSpinner, null)
315
- }
316
- // dataSource={columns && columns.length > 0 ? filterDataByColumns3(dataSource, filterStates) : []}
317
-
318
- // dataSource={columns && columns.length > 0 ? filterDataByColumns4(dataSource, filterStates) : []}
319
- ,
320
- dataSource: dataSource,
321
- className: classNames(className, {
322
- 'table-none-column-select': selectionSettings?.mode === undefined && selectionSettings?.type !== 'multiple'
323
- }, styles.customTable),
324
- bordered: true,
325
- virtual: virtualRow,
326
- columns: columns,
327
- rowKey: rowKey,
328
- rowHoverable: rowHoverable,
329
- size: "small",
330
- scroll: scroll ? scroll : {
331
- y: 500
332
- }
333
-
334
- // scroll={{ x: 'max-content', y: 700 }}
335
- ,
336
-
337
- onRow: (data, index) => {
338
- return {
339
- onDoubleClick: handleRowDoubleClick(data, index),
340
- onClick: handleRowClick(),
341
- onContextMenu: onContextMenu(data)
342
- };
343
- },
344
- rowSelection: columns && columns.length === 0 ? undefined : {
345
- ...selectionSettings,
346
- // type: selectionSettings?.mode,
347
- type: mode,
348
- columnWidth: columnWidth ?? 50,
349
- onChange: onSelectChange,
350
- // selectedRowKeys: mode === 'checkbox' && type === 'single' ? selectedRowKeys : undefined,
351
- selectedRowKeys: mergedSelectedKeys,
352
- // defaultSelectedRowKeys: selectionSettings?.defaultSelectedRowKeys,
353
- defaultSelectedRowKeys,
354
- preserveSelectedRowKeys: true,
355
- hideSelectAll: !type || type === 'single' || mode === 'radio' ? true : hideSelectAll ?? type !== 'multiple'
356
- }
357
-
358
- // onFilter={(val: any) => {
359
- // handleOnFilter(val)
360
- // // triggerFilter?.(convertFilters(val))
361
- // // onFilter?.(convertFilters(val))
362
- //
363
- // }}
364
-
365
- // onChange={(paging, filters, sorter) => handleChange(sorter)}
366
- ,
367
-
368
- title: showToolbar !== false || fullScreen !== false ? () => {
369
- return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", null, title?.(dataSource)), /*#__PURE__*/React.createElement("div", {
370
- style: {
371
- display: 'flex',
372
- justifyContent: 'space-between',
373
- alignItems: 'center',
374
- gap: '.75rem'
375
- }
376
- }, groupAble && groupToolbar?.(), toolbarItems && toolbarItems?.length > 0 && /*#__PURE__*/React.createElement("div", {
377
- style: {
378
- flex: 1,
379
- overflow: 'hidden'
380
- }
381
- }, /*#__PURE__*/React.createElement(Toolbar
382
- // @ts-ignore
383
- // style={{width: pagination && pagination.onChange && pagination?.position && pagination?.position[0] === 'topRight' ? `calc(100% - 650px - ${groupAble ? 50 : 0}px` : `calc(100% - 25px - ${groupAble ? 50 : 0}px`}}
384
- , {
385
- items: (toolbarItems ?? []).filter(it => it.position !== 'Bottom'),
386
- mode: 'scroll'
387
- })), /*#__PURE__*/React.createElement("div", {
388
- style: {
389
- display: 'flex',
390
- justifyContent: 'space-between',
391
- alignItems: 'center',
392
- gap: '.75rem'
393
- }
394
- }, pagination && pagination.onChange && pagination?.position && pagination?.position[0] === 'topRight' && /*#__PURE__*/React.createElement(Pagination, _extends({
395
- showSizeChanger: true,
396
- responsive: true,
397
- size: 'small',
398
- rootClassName: 'top-pagination'
399
- // @ts-ignore
400
- ,
401
- showTotal: (total, range) => `${range[0]}-${range[1]} / ${total} ${t ? t(pagination?.locale?.items ?? 'items') : 'items'}`
402
- }, pagination)), typeof actionTemplate === 'function' ? actionTemplate() : actionTemplate, fullScreen !== false && (isFullScreen ? /*#__PURE__*/React.createElement(Minimize, {
403
- fontSize: 16,
404
- onClick: () => handleFullScreen?.(),
405
- "data-tooltip-id": "tooltip-icon",
406
- "data-tooltip-content": t ? t('Minimized') : 'Minimized'
407
- }) : /*#__PURE__*/React.createElement(Maximize, {
408
- fontSize: 16,
409
- onClick: () => handleFullScreen?.(),
410
- "data-tooltip-id": "tooltip-icon",
411
- "data-tooltip-content": t ? t('Full screen') : 'Full screen'
412
- })), showColumnChoose && /*#__PURE__*/React.createElement(ColumnsChoose, {
413
- columns: columns,
414
- t: t,
415
- columnsGroup: groupColumns,
416
- triggerChangeColumns: triggerChangeColumns
417
- }), showAdvanceFilter && /*#__PURE__*/React.createElement(AdvanceFilter, {
418
- columns: columns,
419
- t: t
420
- // columnsGroup={groupColumns}
421
- // triggerChangeColumns={triggerChangeColumns}
422
- }))));
423
- } : undefined,
424
- expandable: {
425
- ...expandable
426
- },
427
- summary: () => {
428
- if (typeof summary === 'function') {
429
- return summary(dataSource);
430
- }
431
- if (!summary) {
432
- return undefined;
433
- }
434
- return /*#__PURE__*/React.createElement(Table.Summary, {
435
- fixed: true
436
- }, /*#__PURE__*/React.createElement(Table.Summary.Row, null, flatColumns(!!mode ? [Table.SELECTION_COLUMN, ...columns] : [...columns]).filter(col => col.hidden !== true).map((col, index) => {
437
- // const cellFormat: IFormat | undefined = col.format ? typeof col.format === 'function' ? col.format({}) : col.format : format
438
-
439
- const colFormat = typeof col.format === 'function' ? col.format({}) : col.format;
440
- const cellFormat = getFormat(colFormat, format);
441
- const thousandSeparator = cellFormat?.thousandSeparator;
442
- const decimalSeparator = cellFormat?.decimalSeparator;
443
-
444
- // const dec = (col.format?.decimalScale || col.format?.decimalScale === 0) ? col.format?.decimalScale : format?.decimalScale
445
- const dec = cellFormat?.decimalScale;
446
-
447
- // const sumValue = col.type === 'number' ? sumDataByField(filterDataByColumns4(dataSource, filterStates) as any[], col?.key as string) : 0
448
- const sumValue = col.type === 'number' ? sumByField(filterDataByColumns4(dataSource, [], []), col?.field) : 0;
449
- const value = !isEmpty(sumValue) ? dec || dec === 0 ? parseFloat(Number(sumValue).toFixed(dec)).toString() : sumValue.toString() : '0';
450
- const cellValue = col.type === 'number' && col.isSummary !== false ? value : '';
451
- const numberValue = Number(value);
452
- const numericFormatProps = {
453
- thousandSeparator: checkThousandSeparator(thousandSeparator, decimalSeparator),
454
- decimalSeparator: checkDecimalSeparator(thousandSeparator, decimalSeparator),
455
- allowNegative: cellFormat?.allowNegative ?? false,
456
- prefix: cellFormat?.prefix,
457
- suffix: cellFormat?.suffix,
458
- decimalScale: dec,
459
- fixedDecimalScale: cellFormat?.fixedDecimalScale ?? false
460
- };
461
- return /*#__PURE__*/React.createElement(Table.Summary.Cell, {
462
- key: col.key,
463
- index: index,
464
- align: col.align ?? 'right',
465
- className: 'ui-rc-table-cell-ellipsis'
466
- }, col.summaryTemplate ? col.summaryTemplate(numberValue, col.key) : numericFormatter(cellValue, numericFormatProps));
467
- })));
468
- },
469
- pagination: !pagination || pagination && pagination?.onChange ? false : {
470
- showTotal: (total, range) => `${range[0]}-${range[1]} / ${total} items`,
471
- ...pagination
472
- }
473
- })), /*#__PURE__*/React.createElement("div", null), pagination && pagination.onChange && !pagination.position && /*#__PURE__*/React.createElement(Pagination
474
- // style={{padding: '0.75rem 1rem'}}
475
- , _extends({
476
- rootClassName: 'pagination-template',
477
- showSizeChanger: true,
478
- responsive: true,
479
- size: 'small'
480
- // @ts-ignore
481
- ,
482
- showTotal: (total, range) => `${range[0]}-${range[1]} / ${total} ${t ? t(pagination?.locale?.items ?? 'items') : 'items'}`
483
- }, pagination)), bottomToolbar?.(), /*#__PURE__*/React.createElement(Tooltip, {
484
- id: `${id}-tooltip-header`,
485
- style: {
486
- zIndex: 1999,
487
- maxWidth: 350
488
- }
489
- }), /*#__PURE__*/React.createElement(Tooltip, {
490
- id: "tooltip-icon"
491
- }));
492
- };
493
- export default TableGrid;
@@ -1,11 +0,0 @@
1
- import React from 'react';
2
- import type { BaseOptionType, DefaultOptionType } from "rc-select/lib/Select";
3
- import type { SelectProps } from "rc-master-ui/es/select";
4
- import type { LoadOptionsArgs } from "../type";
5
- export interface DebounceSelectProps<OptionType extends BaseOptionType = DefaultOptionType> extends SelectProps {
6
- loadOptions?: (search: string, callback: (newOptions: OptionType[]) => void, args?: LoadOptionsArgs) => void;
7
- debounceTimeout?: number;
8
- defaultOptions?: OptionType[];
9
- rowData?: any;
10
- }
11
- export declare function AsyncSelect<OptionType extends BaseOptionType>({ loadOptions, debounceTimeout, defaultOptions, rowData, ...props }: DebounceSelectProps<OptionType>): React.JSX.Element;
@@ -1,38 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
- import React, { useEffect, useMemo, useState } from 'react';
3
- import debounce from 'lodash/debounce';
4
- import { Select } from "rc-master-ui";
5
- export function AsyncSelect({
6
- loadOptions,
7
- debounceTimeout = 500,
8
- defaultOptions,
9
- rowData,
10
- ...props
11
- }) {
12
- const [options, setOptions] = useState(defaultOptions ?? []);
13
- const debounceFetcher = useMemo(() => {
14
- const fetchOptions = value => {
15
- if (value.trim().length === 0) {
16
- setOptions(defaultOptions ?? []);
17
- return;
18
- }
19
- if (loadOptions) {
20
- loadOptions(value, newOptions => {
21
- setOptions(newOptions);
22
- }, {
23
- rowData
24
- });
25
- }
26
- };
27
- return debounce(fetchOptions, debounceTimeout);
28
- }, [loadOptions, debounceTimeout]);
29
- useEffect(() => {
30
- setOptions(defaultOptions ?? []);
31
- }, [defaultOptions]);
32
- return /*#__PURE__*/React.createElement(Select, _extends({}, props, {
33
- filterOption: loadOptions ? false : props?.filterOption,
34
- onSearch: debounceFetcher,
35
- onSelect: () => setOptions(defaultOptions ?? []),
36
- options: options
37
- }));
38
- }
@@ -1,11 +0,0 @@
1
- import React from 'react';
2
- import type { BaseOptionType, DefaultOptionType } from "rc-select/lib/Select";
3
- import type { TableSelectProps } from "rc-master-ui/es/table-select";
4
- import type { LoadOptionsArgs } from "../type";
5
- export interface DebounceSelectProps<OptionType extends BaseOptionType = DefaultOptionType> extends TableSelectProps {
6
- loadOptions?: (search: string, callback: (newOptions: OptionType[]) => void, args?: LoadOptionsArgs) => void;
7
- debounceTimeout?: number;
8
- defaultOptions?: OptionType[];
9
- rowData?: any;
10
- }
11
- export declare function AsyncTableSelect<OptionType extends BaseOptionType>({ loadOptions, debounceTimeout, defaultOptions, columns, rowData, ...props }: DebounceSelectProps<OptionType>): React.JSX.Element;
@@ -1,40 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
- import React, { useEffect, useMemo, useState } from 'react';
3
- import debounce from 'lodash/debounce';
4
- import { TableSelect } from "rc-master-ui";
5
- export function AsyncTableSelect({
6
- loadOptions,
7
- debounceTimeout = 500,
8
- defaultOptions,
9
- columns,
10
- rowData,
11
- ...props
12
- }) {
13
- const [options, setOptions] = useState(defaultOptions ?? []);
14
- const debounceFetcher = useMemo(() => {
15
- const fetchOptions = value => {
16
- if (value.trim().length === 0) {
17
- setOptions(defaultOptions ?? []);
18
- return;
19
- }
20
- if (loadOptions) {
21
- loadOptions(value, newOptions => {
22
- setOptions(newOptions);
23
- }, {
24
- rowData
25
- });
26
- }
27
- };
28
- return debounce(fetchOptions, debounceTimeout);
29
- }, [debounceTimeout, loadOptions, defaultOptions, rowData]);
30
- useEffect(() => {
31
- setOptions(defaultOptions ?? []);
32
- }, [defaultOptions]);
33
- return /*#__PURE__*/React.createElement(TableSelect, _extends({}, props, {
34
- filterOption: loadOptions ? false : props?.filterOption,
35
- onSearch: debounceFetcher,
36
- onSelect: () => setOptions(defaultOptions ?? []),
37
- options: options,
38
- columns: columns
39
- }));
40
- }