react-table-edit 1.4.14 → 1.4.16
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/component/table/header.d.ts +2 -0
- package/dist/index.js +15 -16
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +15 -16
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -41736,7 +41736,7 @@ var css_248z$1 = ".react-resizable {\n position: relative;\n}\n.react-resizable
|
|
|
41736
41736
|
styleInject(css_248z$1);
|
|
41737
41737
|
|
|
41738
41738
|
const HeaderTableCol = (props) => {
|
|
41739
|
-
const { selectEnable, dataSource, setSelectedRows, col, indexCol, indexParent, objWidthFixLeft, objWidthFixRight, totalCount, selectedRows, column, setColumn, isMulti } = props;
|
|
41739
|
+
const { selectEnable, dataSource, setSelectedRows, col, indexCol, indexParent, objWidthFixLeft, objWidthFixRight, totalCount, selectedRows, column, setColumn, fisrtObjWidthFixRight, lastObjWidthFixLeft, isMulti } = props;
|
|
41740
41740
|
const { t } = reactI18next.useTranslation();
|
|
41741
41741
|
const handleResize = (e, { size }) => {
|
|
41742
41742
|
// Update the column width here
|
|
@@ -41753,7 +41753,7 @@ const HeaderTableCol = (props) => {
|
|
|
41753
41753
|
setColumn(newColumns);
|
|
41754
41754
|
}
|
|
41755
41755
|
};
|
|
41756
|
-
return (jsxRuntime.jsx(React$5.Fragment, { children: col.visible !== false && (jsxRuntime.jsx(Resizable, { className: "r-resize", width: typeof col.width === 'number' ? col.width : Number((col.width ?? "").replaceAll(new RegExp(`[^0-9]`, "g"), '')), height: 0, onResize: handleResize, draggableOpts: { enableUserSelectHack: false }, children: jsxRuntime.jsx("th", { rowSpan: col.rowspan !== 1 ? col.rowspan : undefined, colSpan: col.columns?.filter(x => x.visible !== false)?.length ?? 1, className: classnames(`r-headercell fix-${col.fixedType}`, { 'cell-fixed': col.fixedType }), style: {
|
|
41756
|
+
return (jsxRuntime.jsx(React$5.Fragment, { children: col.visible !== false && (jsxRuntime.jsx(Resizable, { className: "r-resize", width: typeof col.width === 'number' ? col.width : Number((col.width ?? "").replaceAll(new RegExp(`[^0-9]`, "g"), '')), height: 0, onResize: handleResize, draggableOpts: { enableUserSelectHack: false }, children: jsxRuntime.jsx("th", { rowSpan: col.rowspan !== 1 ? col.rowspan : undefined, colSpan: col.columns?.filter(x => x.visible !== false)?.length ?? 1, className: classnames(`r-headercell fix-${col.fixedType}`, { 'fixed-last': (col.fixedType === 'left' && indexCol === lastObjWidthFixLeft) || (col.fixedType === 'right' && indexCol === fisrtObjWidthFixRight) }, { 'cell-fixed': col.fixedType }), style: {
|
|
41757
41757
|
top: `${indexParent * 42}px`,
|
|
41758
41758
|
left: col.fixedType === 'left' ? objWidthFixLeft[col.index ?? 0] : undefined,
|
|
41759
41759
|
right: col.fixedType === 'right' ? objWidthFixRight[col.index ?? 0] : undefined,
|
|
@@ -42264,7 +42264,7 @@ const ToolbarBottom = ({ handleAdd, handleDuplicate, handleInsertBefore, handleI
|
|
|
42264
42264
|
return ((item.align === 'center') ? jsxRuntime.jsx("div", { className: "r-toolbar-item", "aria-disabled": "false", children: item.template() }, `toolbar-bottom-center-${index}`) : '');
|
|
42265
42265
|
}) }), jsxRuntime.jsxs("div", { className: "r-toolbar-right", children: [toolbarSetting?.toolbarBottomOptions?.map((item, index) => {
|
|
42266
42266
|
return ((item.align === 'right') ? jsxRuntime.jsx("div", { className: "r-toolbar-item", "aria-disabled": "false", children: item.template() }, `toolbar-bottom-right-${index}`) : '');
|
|
42267
|
-
}), jsxRuntime.jsx("div", { className: classnames('r-toolbar-item me-25', { 'd-none': headerColumns.length > 1 }), "aria-disabled": "false", children: jsxRuntime.jsx(SvgSettings, { className: "text-primary cursor-pointer", onClick: () => setOpenPopupSetupColumn(true) }) }), jsxRuntime.jsx("div", { className: classnames('r-toolbar-item me-25', { 'd-none': editDisable || addDisable }), "aria-disabled": "false", children: jsxRuntime.jsxs(UncontrolledDropdown, { className: 'dropdown-user nav-item', children: [jsxRuntime.jsx(DropdownToggle$1, { tag: 'div', color: "primary", onClick: (e) => e.preventDefault(), children: jsxRuntime.jsx(SvgInfo, { className: "cursor-pointer text-primary" }) }), jsxRuntime.jsx(DropdownMenu$1, { className: 'formula-dropdown icon-dropdown', children: jsxRuntime.jsxs("ul", { className: "mb-0 pe-50", children: [jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n v\u00E0o c\u1ED9t STT \u0111\u1EC3 ch\u1ECDn h\u00E0ng v\u00E0 nh\u1EA5n Ctrl + D \u0111\u1EC3 nh\u00E2n b\u1EA3n" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Ch\u1ECDn \u00F4 v\u00E0 Ctrl + V \u0111\u1EC3 d\u00E1n th\u00F4ng tin t\u1EEB excel" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n v\u00E0o c\u1ED9t STT \u0111\u1EC3 ch\u1ECDn h\u00E0ng v\u00E0 nh\u1EA5n Ctrl + C \u0111\u1EC3 sao ch\u00E9p h\u00E0ng" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n v\u00E0o c\u1ED9t STT \u0111\u1EC3 ch\u1ECDn h\u00E0ng v\u00E0 nh\u1EA5n Ctrl + V \u0111\u1EC3 d\u00E1n h\u00E0ng" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n Ctrl + Shift + \u2193 \u0111\u1EC3 sao ch\u00E9p d\u1EEF li\u1EC7u \u00F4 cho c\u00E1c d\u00F2ng d\u01B0\u1EDBi" })] }) })] }) })] })] }) }));
|
|
42267
|
+
}), jsxRuntime.jsx("div", { className: classnames('r-toolbar-item me-25', { 'd-none': headerColumns.length > 1 }), "aria-disabled": "false", children: jsxRuntime.jsx(SvgSettings, { className: "text-primary cursor-pointer", onClick: () => setOpenPopupSetupColumn(true) }) }), jsxRuntime.jsx("div", { className: classnames('r-toolbar-item me-25', { 'd-none': editDisable || addDisable }), "aria-disabled": "false", children: jsxRuntime.jsxs(UncontrolledDropdown, { className: 'dropdown-user nav-item', children: [jsxRuntime.jsx(DropdownToggle$1, { tag: 'div', color: "primary", onClick: (e) => e.preventDefault(), children: jsxRuntime.jsx(SvgInfo, { className: "cursor-pointer text-primary" }) }), jsxRuntime.jsx(DropdownMenu$1, { className: 'formula-dropdown icon-dropdown', children: jsxRuntime.jsxs("ul", { className: "mb-0 pe-50", children: [jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n v\u00E0o c\u1ED9t STT \u0111\u1EC3 ch\u1ECDn h\u00E0ng v\u00E0 nh\u1EA5n Ctrl + D \u0111\u1EC3 nh\u00E2n b\u1EA3n" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Ch\u1ECDn \u00F4 v\u00E0 Ctrl + V \u0111\u1EC3 d\u00E1n th\u00F4ng tin t\u1EEB excel" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n v\u00E0o c\u1ED9t STT \u0111\u1EC3 ch\u1ECDn h\u00E0ng v\u00E0 nh\u1EA5n Ctrl + C \u0111\u1EC3 sao ch\u00E9p h\u00E0ng" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n v\u00E0o c\u1ED9t STT \u0111\u1EC3 ch\u1ECDn h\u00E0ng v\u00E0 nh\u1EA5n Ctrl + V \u0111\u1EC3 d\u00E1n h\u00E0ng" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n Ctrl + Shift + \u2193 \u0111\u1EC3 sao ch\u00E9p d\u1EEF li\u1EC7u \u00F4 cho c\u00E1c d\u00F2ng d\u01B0\u1EDBi" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n Ctrl + Shift + \u2191 \u0111\u1EC3 sao ch\u00E9p d\u1EEF li\u1EC7u \u00F4 cho c\u00E1c d\u00F2ng tr\u00EAn" })] }) })] }) })] })] }) }));
|
|
42268
42268
|
};
|
|
42269
42269
|
|
|
42270
42270
|
const handleArrowRight = (e, params) => {
|
|
@@ -42302,10 +42302,10 @@ const isSelectMenuOpen = (element) => {
|
|
|
42302
42302
|
};
|
|
42303
42303
|
const handleArrowUp = (e, params) => {
|
|
42304
42304
|
const { idElement, indexCol, indexRow, pagingClient, pagingSetting, setIndexFocus, focusNewElement, rowChange, changeDataSource, contentColumns, dataSource, row } = params;
|
|
42305
|
-
if ((e.ctrlKey || e.metaKey) && e.shiftKey) {
|
|
42305
|
+
if ((e.ctrlKey || e.metaKey || e.altKey) && e.shiftKey) {
|
|
42306
42306
|
if (indexRow > 0) {
|
|
42307
42307
|
const column = contentColumns[indexCol - 1];
|
|
42308
|
-
for (let index = indexRow -
|
|
42308
|
+
for (let index = indexRow - 2; index >= 0; index--) {
|
|
42309
42309
|
const element = dataSource[index];
|
|
42310
42310
|
element[column.field ?? ''] = row[column.field ?? ''];
|
|
42311
42311
|
if (column.callback && column.callbackValue) {
|
|
@@ -42313,7 +42313,7 @@ const handleArrowUp = (e, params) => {
|
|
|
42313
42313
|
column.callback(value, index, element);
|
|
42314
42314
|
}
|
|
42315
42315
|
if (rowChange) {
|
|
42316
|
-
rowChange(element,
|
|
42316
|
+
rowChange(element, index, column.field);
|
|
42317
42317
|
}
|
|
42318
42318
|
}
|
|
42319
42319
|
changeDataSource(dataSource);
|
|
@@ -42338,7 +42338,7 @@ const handleArrowUp = (e, params) => {
|
|
|
42338
42338
|
};
|
|
42339
42339
|
const handleArrowDown = (e, params) => {
|
|
42340
42340
|
const { idElement, indexCol, indexRow, totalCount, pagingClient, pagingSetting, setIndexFocus, focusNewElement, rowChange, changeDataSource, dataSource, contentColumns, row } = params;
|
|
42341
|
-
if ((e.ctrlKey || e.metaKey) && e.shiftKey) {
|
|
42341
|
+
if ((e.ctrlKey || e.metaKey || e.altKey) && e.shiftKey) {
|
|
42342
42342
|
if (indexRow < totalCount) {
|
|
42343
42343
|
const column = contentColumns[indexCol - 1];
|
|
42344
42344
|
for (let index = indexRow; index < totalCount; index++) {
|
|
@@ -42349,7 +42349,7 @@ const handleArrowDown = (e, params) => {
|
|
|
42349
42349
|
column.callback(value, index, element);
|
|
42350
42350
|
}
|
|
42351
42351
|
if (rowChange) {
|
|
42352
|
-
rowChange(element,
|
|
42352
|
+
rowChange(element, index, column.field);
|
|
42353
42353
|
}
|
|
42354
42354
|
}
|
|
42355
42355
|
changeDataSource(dataSource);
|
|
@@ -43087,7 +43087,6 @@ const TableEdit = React$5.forwardRef((props, ref) => {
|
|
|
43087
43087
|
}
|
|
43088
43088
|
});
|
|
43089
43089
|
const column = getColumn(indexCol, index);
|
|
43090
|
-
console.log(column);
|
|
43091
43090
|
if (column) {
|
|
43092
43091
|
if ((!column.disabledCondition || !column.disabledCondition(dataSource[currenRowIndex + 0])) && column.editEnable && column.onPasteValidate) {
|
|
43093
43092
|
const rs = await column.onPasteValidate(stringData.join(','), currenRowIndex + 0, dataSource[currenRowIndex + 0]);
|
|
@@ -43121,7 +43120,7 @@ const TableEdit = React$5.forwardRef((props, ref) => {
|
|
|
43121
43120
|
dataRow[column.field] = stringData;
|
|
43122
43121
|
}
|
|
43123
43122
|
if (column.callback) {
|
|
43124
|
-
column.callback(rs, currenRowIndex + indexRow);
|
|
43123
|
+
column.callback(rs, currenRowIndex + indexRow, dataRow);
|
|
43125
43124
|
}
|
|
43126
43125
|
}
|
|
43127
43126
|
else {
|
|
@@ -43139,7 +43138,7 @@ const TableEdit = React$5.forwardRef((props, ref) => {
|
|
|
43139
43138
|
dataRow[column.field] = date;
|
|
43140
43139
|
}
|
|
43141
43140
|
if (column.callback) {
|
|
43142
|
-
column.callback(date, currenRowIndex + indexRow);
|
|
43141
|
+
column.callback(date, currenRowIndex + indexRow, dataRow);
|
|
43143
43142
|
}
|
|
43144
43143
|
}
|
|
43145
43144
|
else {
|
|
@@ -43156,7 +43155,7 @@ const TableEdit = React$5.forwardRef((props, ref) => {
|
|
|
43156
43155
|
dataRow[column.field] = number;
|
|
43157
43156
|
}
|
|
43158
43157
|
if (column.callback) {
|
|
43159
|
-
column.callback(number, currenRowIndex + indexRow);
|
|
43158
|
+
column.callback(number, currenRowIndex + indexRow, dataRow);
|
|
43160
43159
|
}
|
|
43161
43160
|
}
|
|
43162
43161
|
else {
|
|
@@ -43172,7 +43171,7 @@ const TableEdit = React$5.forwardRef((props, ref) => {
|
|
|
43172
43171
|
dataRow[column.field] = stringData;
|
|
43173
43172
|
}
|
|
43174
43173
|
if (column.callback) {
|
|
43175
|
-
column.callback(stringData, currenRowIndex + indexRow);
|
|
43174
|
+
column.callback(stringData, currenRowIndex + indexRow, dataRow);
|
|
43176
43175
|
}
|
|
43177
43176
|
}
|
|
43178
43177
|
else {
|
|
@@ -43185,7 +43184,7 @@ const TableEdit = React$5.forwardRef((props, ref) => {
|
|
|
43185
43184
|
dataRow[column.field] = stringData;
|
|
43186
43185
|
}
|
|
43187
43186
|
if (column.callback) {
|
|
43188
|
-
column.callback(rs, currenRowIndex + indexRow);
|
|
43187
|
+
column.callback(rs, currenRowIndex + indexRow, dataRow);
|
|
43189
43188
|
}
|
|
43190
43189
|
}
|
|
43191
43190
|
else {
|
|
@@ -43201,7 +43200,7 @@ const TableEdit = React$5.forwardRef((props, ref) => {
|
|
|
43201
43200
|
dataRow[column.field] = stringData;
|
|
43202
43201
|
}
|
|
43203
43202
|
if (column.callback) {
|
|
43204
|
-
column.callback(stringData, currenRowIndex + indexRow);
|
|
43203
|
+
column.callback(stringData, currenRowIndex + indexRow, dataRow);
|
|
43205
43204
|
}
|
|
43206
43205
|
}
|
|
43207
43206
|
}
|
|
@@ -43454,7 +43453,7 @@ const TableEdit = React$5.forwardRef((props, ref) => {
|
|
|
43454
43453
|
}, [searchTerm, searchSetting?.searchTerm]);
|
|
43455
43454
|
return (jsxRuntime.jsxs(React$5.Fragment, { children: [jsxRuntime.jsxs("div", { className: "react-table-edit", children: [jsxRuntime.jsxs("div", { className: 'r-grid', ref: gridRef, children: [toolbarSetting?.showTopToolbar && jsxRuntime.jsx(RenderToolbarTop, { toolbarTopOption: toolbarTopOption }), jsxRuntime.jsx("div", { ref: tableElement, className: "r-gridtable", style: { height: `${height ? `${height}px` : 'auto'}`, minHeight: `${minHeight ? `${minHeight}px` : ''}`, maxHeight: `${maxHeight ? `${maxHeight}px` : '400px'}` }, children: jsxRuntime.jsxs("table", { style: { width: '100%' }, children: [jsxRuntime.jsx("thead", { className: 'r-gridheader', children: headerColumns.map((element, indexParent) => {
|
|
43456
43455
|
return (jsxRuntime.jsx("tr", { className: "r-row", role: "row", children: element?.map((col, index) => {
|
|
43457
|
-
return (jsxRuntime.jsx(HeaderTableCol, { col: col, dataSource: dataSource, indexCol: index, indexParent: indexParent, isMulti: isMulti ?? false, objWidthFixLeft: objWidthFixLeft, objWidthFixRight: objWidthFixRight, selectEnable: selectEnable ?? false, selectedRows: selectedRows, setSelectedRows: setSelectedRows, column: contentColumns, setColumn: setContentColumns, totalCount: totalCount }, `header-${indexParent}-${index}`));
|
|
43456
|
+
return (jsxRuntime.jsx(HeaderTableCol, { col: col, dataSource: dataSource, indexCol: index, indexParent: indexParent, isMulti: isMulti ?? false, objWidthFixLeft: objWidthFixLeft, objWidthFixRight: objWidthFixRight, selectEnable: selectEnable ?? false, selectedRows: selectedRows, setSelectedRows: setSelectedRows, column: contentColumns, setColumn: setContentColumns, fisrtObjWidthFixRight: fisrtObjWidthFixRight, lastObjWidthFixLeft: lastObjWidthFixLeft, totalCount: totalCount }, `header-${indexParent}-${index}`));
|
|
43458
43457
|
}) }, `header-${-indexParent}`));
|
|
43459
43458
|
}) }), jsxRuntime.jsx("tbody", { className: 'r-gridcontent', children: renderData() }), jsxRuntime.jsx("tfoot", { className: "r-gridfoot", children: haveSum == true ? jsxRuntime.jsx("tr", { className: 'r-row', children: contentColumns.map((col, index) => {
|
|
43460
43459
|
return (renderFooterCol(col, index));
|