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,13 +0,0 @@
1
- import React from "react";
2
- type OptionType = {
3
- value: any;
4
- label: string;
5
- [key: string]: any;
6
- };
7
- type Props<T> = {
8
- options: T[];
9
- value: any[];
10
- onChange?: (value: any[]) => void;
11
- };
12
- declare const CheckboxControl: <T extends OptionType>(props: Props<T>) => React.JSX.Element;
13
- export default CheckboxControl;
@@ -1,40 +0,0 @@
1
- import React, { useMemo } from "react";
2
- import { Checkbox } from "rc-master-ui";
3
- const CheckboxControl = props => {
4
- const {
5
- options,
6
- value,
7
- onChange
8
- } = props;
9
- const selected = useMemo(() => {
10
- return value ? value : [];
11
- }, [value]);
12
- const list = useMemo(() => {
13
- return options ? options : [];
14
- }, [options]);
15
- const onChangeValue = val => {
16
- const findIndex = selected.findIndex(it => it === val);
17
- if (findIndex > -1) {
18
- const newVal = selected.filter(it => it !== val);
19
- onChange?.(newVal);
20
- } else {
21
- const newVal = [...selected, val];
22
- onChange?.(newVal);
23
- }
24
- };
25
- return /*#__PURE__*/React.createElement("div", {
26
- className: "d-flex flex-column gap-50",
27
- style: {}
28
- }, list.map((it, index) => {
29
- return /*#__PURE__*/React.createElement("div", {
30
- key: index,
31
- className: "d-flex align-items-center"
32
- }, /*#__PURE__*/React.createElement(Checkbox, {
33
- checked: selected.includes(it.value),
34
- type: "checkbox",
35
- className: "cursor-pointer me-50",
36
- onChange: () => onChangeValue(it.value)
37
- }), /*#__PURE__*/React.createElement("span", null, it.label));
38
- }));
39
- };
40
- export default CheckboxControl;
@@ -1,10 +0,0 @@
1
- import type { ColumnTable, IFormat } from "../../type";
2
- import React from "react";
3
- import type { TableLocale } from "rc-master-ui/lib/table/interface";
4
- import type { ColumnsTable } from "../../type";
5
- export declare function flatColumns<RecordType>(columns: ColumnsTable<RecordType>, parentKey?: string): ColumnsTable<RecordType>;
6
- export declare const flatColumns2: <RecordType>(columns: ColumnsTable<RecordType>) => ColumnsTable<RecordType>;
7
- export declare const getValueCell: <T>(column: ColumnTable<T>, value: any, record: T, rowIndex: number, colIndex: number, format?: IFormat) => any;
8
- export declare const renderValueCell: <T>(column: ColumnTable<T>, value: any, record: T, rowIndex: number, colIndex: number, format?: IFormat, editAble?: boolean) => any;
9
- export declare const renderContent: <T>(column: ColumnTable<T>, value: any, record: any, index: number, colIndex: number, editAble?: boolean, format?: IFormat, onClick?: any) => React.JSX.Element;
10
- export declare const renderFilter: <RecordType>(column: ColumnTable<RecordType>, selectedKeys: string[], setSelectedKeys: any, confirm: any, visible: boolean, searchValue: string, setSearchValue: any, dataSourceFilter: any[], buddhistLocale: any, locale?: TableLocale, t?: any, format?: IFormat, dateRangeLocale?: any) => React.JSX.Element;
@@ -1,503 +0,0 @@
1
- import { checkDecimalSeparator, checkThousandSeparator, convertDateToDayjs, convertDayjsToDate, convertFormat, getDatepickerFormat, getDateRangeFormat, getDateString, getEditType, getFormat, getTypeFilter, isColor, isEmpty } from "../utils";
2
- import { numericFormatter } from "react-numeric-component";
3
- import dayjs from "dayjs";
4
- import moment from "moment/moment";
5
- import React, { Fragment } from "react";
6
- import { CustomProvider, DatePicker, DateRangePicker, Empty, Input, Select } from "rc-master-ui";
7
- import CheckboxFilter from "../../CheckboxFilter";
8
- import { SELECTION_COLUMN } from "rc-master-ui/es/table/hooks/useSelection";
9
- import NumberRange from "../../number-range";
10
- import NumberInput from "../../number";
11
- import ControlCheckbox from "../content/ControlCheckbox";
12
- // import {Typography} from "antd";
13
- // const {RangePicker} = DatePicker
14
-
15
- // const { Text } = Typography;
16
-
17
- export function flatColumns(columns, parentKey = 'key') {
18
- // @ts-ignore
19
- return columns.filter(column => column && typeof column === 'object').reduce((list, column, index) => {
20
- const {
21
- fixed
22
- } = column;
23
- // Convert `fixed='true'` to `fixed='left'` instead
24
- const parsedFixed = fixed === true ? 'left' : fixed;
25
- const mergedKey = `${parentKey}-${index}`;
26
- const subColumns = column.children;
27
- if (subColumns && subColumns.length > 0) {
28
- return [...list, ...flatColumns(subColumns, mergedKey).map(subColum => ({
29
- fixed: parsedFixed,
30
- ...subColum
31
- }))];
32
- }
33
- return [...list, {
34
- key: mergedKey,
35
- ...column,
36
- fixed: parsedFixed
37
- }];
38
- }, []);
39
- }
40
- export const flatColumns2 = columns => {
41
- return columns.reduce((list, column) => {
42
- const subColumns = column.children;
43
- if (column === SELECTION_COLUMN) {
44
- return [...list, {
45
- ...column
46
- }];
47
- }
48
- if (subColumns && subColumns.length > 0) {
49
- return [...list, ...flatColumns2(subColumns).map(subColum => ({
50
- // fixed: parsedFixed,
51
- ...subColum
52
- }))];
53
- }
54
- return [...list, {
55
- ...column
56
- }];
57
- }, []);
58
- };
59
- export const getValueCell = (column, value, record, rowIndex, colIndex, format) => {
60
- switch (column?.type) {
61
- case 'number':
62
- const colFormat = typeof column.format === 'function' ? column.format(record) : column.format;
63
- const cellFormat = getFormat(colFormat, format);
64
- const thousandSeparator = cellFormat?.thousandSeparator;
65
- const decimalSeparator = cellFormat?.decimalSeparator;
66
- const dec = cellFormat?.decimalScale;
67
-
68
- // const contentNumber = !isEmpty(value) ? ((dec || dec === 0) ? parseFloat(Number(value).toFixed(dec)).toString() : value.toString()) : '0'
69
-
70
- const tmpval = typeof value === 'string' ? Number(value) : value;
71
- const numericFormatProps = {
72
- thousandSeparator: checkThousandSeparator(thousandSeparator, decimalSeparator),
73
- decimalSeparator: checkDecimalSeparator(thousandSeparator, decimalSeparator),
74
- allowNegative: cellFormat?.allowNegative ?? true,
75
- prefix: cellFormat?.prefix,
76
- suffix: cellFormat?.suffix,
77
- decimalScale: dec,
78
- fixedDecimalScale: cellFormat?.fixedDecimalScale ?? false
79
- };
80
-
81
- // if ( typeof value === "string") {
82
- // const ttt = removeNumericFormat(value, undefined, numericFormatProps )
83
- //
84
- // }
85
-
86
- const contentNumber = !isEmpty(value) ? dec || dec === 0 ? parseFloat(tmpval.toFixed(dec)).toString() : tmpval.toString() : '0';
87
- // const contentNumber = !isEmpty(value) ? ((dec || dec === 0) ? tmpval.toString() : tmpval.toString()) : '0'
88
-
89
- return !isEmpty(contentNumber) ? numericFormatter(contentNumber, numericFormatProps) : '';
90
- case 'date':
91
- return value ? dayjs(value).format(format?.dateFormat ?? 'DD/MM/YYYY') : '';
92
- case 'time':
93
- return value ? value : '';
94
- case 'year':
95
- const year = value ? moment(value).format('yyyy') : '';
96
- return /*#__PURE__*/React.createElement(Fragment, null, year);
97
- case 'datetime':
98
- return value ? moment(value).format(format?.datetimeFormat ?? 'DD/MM/YYYY HH:mm') : '';
99
- case 'boolean':
100
- return value ? 'true' : 'false';
101
- case 'color':
102
- return value;
103
- case 'checkbox':
104
- return typeof value === 'boolean' ? value ? 'true' : 'false' : value ? '1' : '0';
105
- case 'file':
106
- const nameFile = typeof value === 'object' && !Array.isArray(value) ? value.name : Array.isArray(value) ? value.map(it => typeof it === 'object' ? it.name : it).filter(Boolean).join(", ") : '';
107
- return value ? nameFile : '';
108
- default:
109
- if (Array.isArray(value)) {
110
- return value.join(', ');
111
- }
112
- return value;
113
- }
114
- };
115
- export const renderValueCell = (column, value, record, rowIndex, colIndex, format, editAble) => {
116
- switch (column?.type) {
117
- case 'number':
118
- const colFormat = typeof column.format === 'function' ? column.format(record) : column.format;
119
- const cellFormat = getFormat(colFormat, format);
120
- const thousandSeparator = cellFormat?.thousandSeparator;
121
- const decimalSeparator = cellFormat?.decimalSeparator;
122
- const dec = cellFormat?.decimalScale;
123
-
124
- // const contentNumber = !isEmpty(value) ? ((dec || dec === 0) ? parseFloat(Number(value).toFixed(dec)).toString() : value.toString()) : '0'
125
-
126
- const tmpval = typeof value === 'string' ? Number(value) : value;
127
- const numericFormatProps = {
128
- thousandSeparator: checkThousandSeparator(thousandSeparator, decimalSeparator),
129
- decimalSeparator: checkDecimalSeparator(thousandSeparator, decimalSeparator),
130
- allowNegative: cellFormat?.allowNegative ?? true,
131
- prefix: cellFormat?.prefix,
132
- suffix: cellFormat?.suffix,
133
- decimalScale: dec,
134
- fixedDecimalScale: cellFormat?.fixedDecimalScale ?? false
135
- };
136
-
137
- // if ( typeof value === "string") {
138
- // const ttt = removeNumericFormat(value, undefined, numericFormatProps )
139
- //
140
- // }
141
-
142
- const contentNumber = !isEmpty(value) ? dec || dec === 0 ? parseFloat(tmpval.toFixed(dec)).toString() : tmpval.toString() : '0';
143
- // const contentNumber = !isEmpty(value) ? ((dec || dec === 0) ? tmpval.toString() : tmpval.toString()) : '0'
144
-
145
- return !isEmpty(contentNumber) ? numericFormatter(contentNumber, numericFormatProps) : '';
146
- case 'date':
147
- return value ? dayjs(value).format(format?.dateFormat ?? 'DD/MM/YYYY') : '';
148
- case 'time':
149
- return value ? value : '';
150
- case 'year':
151
- const year = value ? moment(value).format('yyyy') : '';
152
- return /*#__PURE__*/React.createElement(Fragment, null, year);
153
- case 'datetime':
154
- return value ? moment(value).format(format?.datetimeFormat ?? 'DD/MM/YYYY HH:mm') : '';
155
- case 'boolean':
156
- return value ? 'true' : 'false';
157
- case 'color':
158
- return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
159
- className: 'w-100 h-100',
160
- style: {
161
- backgroundColor: isColor(value) ? value : '#fff',
162
- border: '1px solid #f0f0f0',
163
- height: '100%',
164
- minHeight: 20
165
- }
166
- }));
167
- case 'checkbox':
168
- // return (
169
- // <Checkbox
170
- // checked={!!value}
171
- //
172
- // />
173
- // )
174
-
175
- return /*#__PURE__*/React.createElement(ControlCheckbox, {
176
- column: column,
177
- record: record,
178
- rowIndex: rowIndex,
179
- colIndex: colIndex,
180
- checked: !!value,
181
- checkValue: value,
182
- editAble: editAble
183
- });
184
- case 'file':
185
- const nameFile = typeof value === 'object' && !Array.isArray(value) ? value.name : Array.isArray(value) ? value.map(it => typeof it === 'object' ? it.name : it).filter(Boolean).join(", ") : '';
186
- return value ? nameFile : '';
187
- default:
188
- if (Array.isArray(value)) {
189
- return value.join(', ');
190
- }
191
- return value;
192
- }
193
- };
194
- export const renderContent = (column, value, record, index, colIndex, editAble, format, onClick) => {
195
- const cellValue = value instanceof Date ? getDateString(column, value) : value;
196
- const content = renderValueCell(column, cellValue, record, index, colIndex, format, editAble);
197
- const editType = getEditType(column, record);
198
- return /*#__PURE__*/React.createElement(Fragment, null, column?.template ? typeof column.template === "function" ? column.template({
199
- value,
200
- index,
201
- rowData: record,
202
- field: column.field
203
- }) : column.template : content, (editType === 'select' || editType === 'selectTable') && /*#__PURE__*/React.createElement("span", {
204
- className: 'caret-down',
205
- onClick: onClick
206
- }));
207
- };
208
- export const renderFilter = (column, selectedKeys, setSelectedKeys, confirm, visible, searchValue, setSearchValue, dataSourceFilter, buddhistLocale, locale, t, format, dateRangeLocale) => {
209
- const cellFormat = column.format ? typeof column.format === 'function' ? column.format({}) : column.format : format;
210
- const type = getTypeFilter(column);
211
- const dateFormat = getDatepickerFormat(column?.typeFilter ?? column?.type, cellFormat) ?? 'DD/MM/YYYY';
212
- const dateRangeFormat = convertFormat(getDateRangeFormat(column?.type, cellFormat) ?? 'dd/MM/yyyy');
213
- const find = dataSourceFilter?.find(it => it.key === column?.field);
214
- const options = find ? find.data : [];
215
- switch (type) {
216
- case 'Number':
217
- return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
218
- className: 'mb-1'
219
- }, /*#__PURE__*/React.createElement(NumberInput, {
220
- t: t,
221
- value: selectedKeys[0],
222
- onChange: vals => {
223
- setSelectedKeys(vals);
224
- }
225
- }))));
226
- case 'NumberRange':
227
- return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(NumberRange, {
228
- t: t,
229
- min: selectedKeys[0],
230
- max: selectedKeys[1],
231
- onChange: vals => {
232
- setSelectedKeys(vals);
233
- }
234
- })));
235
- case 'Date':
236
- const dateValue = selectedKeys[0] ? convertDateToDayjs(new Date(selectedKeys[0]), dateFormat) : null;
237
- return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
238
- className: 'mb-1'
239
- }, /*#__PURE__*/React.createElement(DatePicker, {
240
- format: {
241
- format: dateFormat,
242
- type: 'mask'
243
- },
244
- locale: buddhistLocale,
245
- style: {
246
- width: '100%',
247
- height: '100%'
248
- },
249
- value: dateValue,
250
- defaultValue: dateValue
251
- // placeholder={t ? t(column?.placeholder) : column?.placeholder}
252
- ,
253
- onChange: (date, dateString) => {
254
- const newDateValue = dateString ? moment(convertDayjsToDate(dateString, dateFormat)).format() : null;
255
- setSelectedKeys(newDateValue ? [newDateValue] : []);
256
- }
257
- }))));
258
- case 'DateRange':
259
- // const dateRangeValue: any = [selectedKeys[0] ? convertDateToDayjs(new Date(selectedKeys[0]), dateRangeFormat) : '', selectedKeys[1] ? convertDateToDayjs(new Date(selectedKeys[1]), dateRangeFormat) : '']
260
- const dateRangeValue = selectedKeys && selectedKeys.length > 0 ? [selectedKeys[0] ? new Date(selectedKeys[0]) : '', selectedKeys[1] ? new Date(selectedKeys[1]) : ''] : null;
261
- return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
262
- className: 'mb-1'
263
- }, /*#__PURE__*/React.createElement(CustomProvider, {
264
- locale: dateRangeLocale
265
- }, /*#__PURE__*/React.createElement(DateRangePicker
266
- // placeholder={['Ngày bắt đầu', 'Ngày bắt đầu']}
267
- , {
268
- style: {
269
- width: 300
270
- },
271
- format: dateRangeFormat,
272
- value: dateRangeValue,
273
- onChange: value => {
274
- const newDateRangeValue = value ? [value[0] ? moment(value[0]).format() : '', value[1] ? moment(value[1]).format() : ''] : [];
275
- setSelectedKeys(newDateRangeValue);
276
- }
277
- })))));
278
- case 'Week':
279
- const weekValue = !isEmpty(selectedKeys[0]) ? dayjs(selectedKeys[0], dateFormat) : null;
280
- return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
281
- className: 'mb-1'
282
- }, /*#__PURE__*/React.createElement(DatePicker, {
283
- format: {
284
- format: dateFormat,
285
- type: 'mask'
286
- },
287
- picker: 'week',
288
- locale: buddhistLocale,
289
- style: {
290
- width: '100%',
291
- height: '100%'
292
- },
293
- value: weekValue,
294
- defaultValue: weekValue,
295
- placeholder: column?.placeholder,
296
- onChange: (date, dateString) => {
297
- const newDateValue = dateString ?? null;
298
- setSelectedKeys(newDateValue ? [newDateValue] : []);
299
- }
300
- }))));
301
- case 'Month':
302
- const monthValue = !isEmpty(selectedKeys[0]) ? dayjs(selectedKeys[0], dateFormat) : null;
303
- return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
304
- className: 'mb-1'
305
- }, /*#__PURE__*/React.createElement(DatePicker, {
306
- format: {
307
- format: dateFormat,
308
- type: 'mask'
309
- },
310
- picker: 'month',
311
- locale: buddhistLocale,
312
- style: {
313
- width: '100%',
314
- height: '100%'
315
- },
316
- value: monthValue,
317
- defaultValue: monthValue,
318
- placeholder: column?.placeholder,
319
- onChange: (date, dateString) => {
320
- const newDateValue = dateString ?? null;
321
- setSelectedKeys(newDateValue ? [newDateValue] : []);
322
- }
323
- })));
324
-
325
- // case 'Quarter':
326
- //
327
- // // const monthValue = selectedKeys[0] ? convertDateToDayjs(new Date(selectedKeys[0]), dateFormat) : null
328
- //
329
- // const pickerFormat = getDatepickerFormat(getEditType(col) as IEditType, col)
330
- // const pickerValue = !isEmpty(selectedKeys[0]) ? dayjs(selectedKeys[0], pickerFormat) : null
331
- //
332
- // return (
333
- // <Fragment>
334
- // <div>
335
- //
336
- //
337
- // <div className={'mb-1'}>
338
- //
339
- // <DatePicker
340
- // format={{
341
- // format: dateFormat,
342
- // type: 'mask'
343
- // }}
344
- // locale={buddhistLocale}
345
- // style={{width: '100%', height: '100%'}}
346
- // value={pickerValue}
347
- // defaultValue={pickerValue}
348
- // placeholder={column.placeholder}
349
- // onChange={(date, dateString) => {
350
- // const newDateValue = dateString ? moment(convertDayjsToDate(dateString as string, dateFormat)).format() : null
351
- // setSelectedKeys(newDateValue ? [newDateValue] : [])
352
- //
353
- // }}
354
- //
355
- // />
356
- // </div>
357
- //
358
- //
359
- // </div>
360
- // </Fragment>
361
- // )
362
- //
363
- // case 'Year':
364
- //
365
- // // const monthValue = selectedKeys[0] ? convertDateToDayjs(new Date(selectedKeys[0]), dateFormat) : null
366
- //
367
- // const pickerFormat = getDatepickerFormat(getEditType(col) as IEditType, col)
368
- // const pickerValue = !isEmpty(selectedKeys[0]) ? dayjs(selectedKeys[0], pickerFormat) : null
369
- //
370
- // return (
371
- // <Fragment>
372
- // <div>
373
- //
374
- //
375
- // <div className={'mb-1'}>
376
- //
377
- // <DatePicker
378
- // format={{
379
- // format: dateFormat,
380
- // type: 'mask'
381
- // }}
382
- // locale={buddhistLocale}
383
- // style={{width: '100%', height: '100%'}}
384
- // value={pickerValue}
385
- // defaultValue={pickerValue}
386
- // placeholder={column.placeholder}
387
- // onChange={(date, dateString) => {
388
- // const newDateValue = dateString ? moment(convertDayjsToDate(dateString as string, dateFormat)).format() : null
389
- // setSelectedKeys(newDateValue ? [newDateValue] : [])
390
- //
391
- // }}
392
- //
393
- // />
394
- // </div>
395
- //
396
- //
397
- // </div>
398
- // </Fragment>
399
- // )
400
-
401
- case 'Dropdown':
402
- return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
403
- className: 'mb-1'
404
- }, /*#__PURE__*/React.createElement(Select
405
- // options={translateOption(numberOperator, t)}
406
- // options={find ? options : column.source ?? []}
407
- , {
408
- options: column.source ? column.source : options ?? [],
409
- style: {
410
- width: '100%',
411
- marginBottom: 8
412
- },
413
- value: selectedKeys[0],
414
- notFoundContent: /*#__PURE__*/React.createElement(Empty, {
415
- image: Empty.PRESENTED_IMAGE_SIMPLE,
416
- description: locale?.emptyText
417
- }),
418
- onChange: val => {
419
- // setOperatorKey(val)
420
- setSelectedKeys(val ? [val] : []);
421
- },
422
- showSearch: true,
423
- allowClear: true
424
- }))));
425
-
426
- // case 'DropTree':
427
- // return (
428
- // <Fragment>
429
- // <div>
430
- // {col.filterOption && col.filterOption.showOperator === false ? (
431
- // ''
432
- // ) : (
433
- // <div className={'mb-1'}>
434
- // <Select
435
- // options={translateOption(numberOperator, t)}
436
- // // options={t ? numberOperator.map((it: any) => ({...it, label: t(it.label)})) : numberOperator}
437
- //
438
- // classNamePrefix='select'
439
- // className={`react-select`}
440
- // value={translateOption(numberOperator, t).find(
441
- // ope => ope.value === (operator ? operator : getDefaultOperator(col))
442
- // )}
443
- // onChange={(val: any) => {
444
- // setCurrentFilter((prevState: any) => ({ ...prevState, operator: val.value }))
445
- // }}
446
- // />
447
- // </div>
448
- // )}
449
- //
450
- // <div className={'mb-1'}>
451
- // <Input
452
- // placeholder={'Nhập giá trị'}
453
- // value={value}
454
- // onChange={(val: any) => {
455
- // onChangeValueFilter(type, val.value)
456
- // }}
457
- // />
458
- // </div>
459
- //
460
- // <div className={'d-flex justify-content-end'}>
461
- // <Button color='flat-primary' className={'me-1 be-button'} onClick={(e: any) => handleOnFilter(e)}>
462
- // {t ? t('Filter') : 'Filter'}
463
- // </Button>
464
- // <Button color='flat-secondary' className={'be-button'} onClick={(e: any) => handleClearFilter(e)}>
465
- // {t ? t('Delete') : 'Delete'}
466
- // </Button>
467
- // </div>
468
- // </div>
469
- // </Fragment>
470
- // )
471
- //
472
- case 'Checkbox':
473
- return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
474
- className: 'mb-1'
475
- }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CheckboxFilter, {
476
- locale: locale,
477
- selectedKeys: selectedKeys,
478
- onSelect: setSelectedKeys
479
- // options={options}
480
- ,
481
- options: column.source ? column.source : options ?? [],
482
- filterMultiple: true,
483
- open: visible,
484
- searchValue: searchValue,
485
- setSearchValue: setSearchValue
486
- })))));
487
- case 'Text':
488
- default:
489
- return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
490
- className: 'mb-1'
491
- }, /*#__PURE__*/React.createElement(Input, {
492
- placeholder: t ? t('Search') : `Search`,
493
- value: selectedKeys[0],
494
- onChange: e => {
495
- setSelectedKeys(e.target.value ? [e.target.value] : ['']);
496
- }
497
- // onPressEnter={() => handleSearch(selectedKeys as string[], confirm)}
498
- ,
499
- onPressEnter: () => confirm(),
500
- allowClear: true
501
- }))));
502
- }
503
- };
@@ -1,13 +0,0 @@
1
- import React from "react";
2
- import type { ColumnTable } from "../../type";
3
- type Props = {
4
- column: ColumnTable;
5
- record?: any;
6
- rowIndex: number;
7
- colIndex: number;
8
- checkValue: any;
9
- checked: boolean;
10
- editAble?: boolean;
11
- };
12
- declare const ControlCheckbox: (props: Props) => React.JSX.Element;
13
- export default ControlCheckbox;
@@ -1,87 +0,0 @@
1
- import React, { useContext } from "react";
2
- import { isDisable, isEditable, parseBooleanToValue } from "../utils";
3
- import { Checkbox } from "rc-master-ui";
4
- import { TableContext } from "../../useContext";
5
- const ControlCheckbox = props => {
6
- const {
7
- column,
8
- record,
9
- rowIndex,
10
- colIndex,
11
- checkValue,
12
- editAble,
13
- checked
14
- } = props;
15
- const {
16
- handleCellChange,
17
- getRowKey
18
- } = useContext(TableContext);
19
-
20
- // const isEdit = getEditType(column, record)
21
-
22
- const isEdit = React.useMemo(() => {
23
- return isEditable(column, record);
24
- }, [column, record]);
25
-
26
- // const [isHover, setIsHover] = useState(false)
27
-
28
- const inputNode = value => {
29
- return /*#__PURE__*/React.createElement(Checkbox, {
30
- checked: Boolean(value),
31
- defaultChecked: Boolean(checked)
32
- // style={{ textAlign: column.align ?? 'left' }}
33
- ,
34
- onChange: val => {
35
- const newVal = typeof checkValue === "number" ? parseBooleanToValue(val.target.checked, typeof value) : val.target.checked;
36
-
37
- // onChange(newVal)
38
-
39
- const key = getRowKey?.(record, rowIndex);
40
- // const formState = getValues()
41
-
42
- handleCellChange?.({
43
- key: key,
44
- // @ts-ignore
45
- record: {
46
- ...record,
47
- [column.field]: newVal
48
- },
49
- option: value,
50
- prevState: value,
51
- newState: newVal,
52
- field: column.field ?? column.dataIndex,
53
- indexCol: colIndex,
54
- indexRow: rowIndex,
55
- type: 'blur'
56
- });
57
- },
58
- disabled: isDisable(column, record) ?? false
59
- });
60
- };
61
- return /*#__PURE__*/React.createElement("div", {
62
- // onMouseEnter={() => {
63
- // setIsHover(true)
64
- // }}
65
- //
66
- // onMouseLeave={() => {
67
- // setIsHover(false)
68
- // }}
69
- style: {
70
- display: 'flex',
71
- alignItems: 'center',
72
- justifyContent: column.align ?? 'center',
73
- paddingInline: 5,
74
- height: '100%',
75
- width: '100%'
76
- }
77
- }, editAble && isEdit !== false ? inputNode(checkValue) : /*#__PURE__*/React.createElement(Checkbox, {
78
- checked: checked,
79
- onChange: e => {
80
- e.preventDefault();
81
- },
82
- style: {
83
- textAlign: column.align ?? 'left'
84
- }
85
- }));
86
- };
87
- export default ControlCheckbox;
@@ -1,14 +0,0 @@
1
- import React from "react";
2
- import type { ColumnTable } from "../../type";
3
- import type { IWrapSettings } from "../../type";
4
- type Props = React.HTMLAttributes<HTMLDivElement> & {
5
- t?: any;
6
- id?: string;
7
- content?: string;
8
- wrapSettings?: IWrapSettings;
9
- column?: ColumnTable;
10
- template?: React.ReactElement | React.ReactNode | (() => React.ReactElement | React.ReactNode);
11
- tooltip?: string | number | React.ReactElement | React.ReactNode | (() => React.ReactElement | React.ReactNode);
12
- };
13
- declare const HeaderContent: (props: Props) => React.JSX.Element;
14
- export default HeaderContent;