react-table-edit 1.4.54 → 1.4.55
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/key-handlers.d.ts +4 -2
- package/dist/index.js +100 -25
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +100 -25
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -42759,7 +42759,7 @@ const PasteData = async (props) => {
|
|
|
42759
42759
|
const rs = column.resultValidate.find((item) => item[column.selectSettings?.fieldValue ?? "value"] === stringData);
|
|
42760
42760
|
if (rs) {
|
|
42761
42761
|
if (column.onPaste) {
|
|
42762
|
-
|
|
42762
|
+
column.onPaste(dataRow, stringData);
|
|
42763
42763
|
}
|
|
42764
42764
|
else {
|
|
42765
42765
|
dataRow[column.field] = stringData;
|
|
@@ -42831,7 +42831,7 @@ const PasteData = async (props) => {
|
|
|
42831
42831
|
else if (column.type === "select") {
|
|
42832
42832
|
if (column.selectSettings?.allowCreate) {
|
|
42833
42833
|
if (column.onPaste) {
|
|
42834
|
-
|
|
42834
|
+
column.onPaste(dataRow, stringData);
|
|
42835
42835
|
}
|
|
42836
42836
|
else {
|
|
42837
42837
|
dataRow[column.field] = stringData;
|
|
@@ -42844,7 +42844,7 @@ const PasteData = async (props) => {
|
|
|
42844
42844
|
const rs = ((column.selectSettings?.optionsField ? item[column.selectSettings?.optionsField] : column.selectSettings?.options) ?? []).find((item) => item[column.selectSettings?.fieldValue ?? "value"] === stringData);
|
|
42845
42845
|
if (rs) {
|
|
42846
42846
|
if (column.onPaste) {
|
|
42847
|
-
|
|
42847
|
+
column.onPaste(dataRow, stringData);
|
|
42848
42848
|
}
|
|
42849
42849
|
else {
|
|
42850
42850
|
dataRow[column.field] = stringData;
|
|
@@ -43069,7 +43069,7 @@ const CellComponent = React__default.memo((props) => {
|
|
|
43069
43069
|
setSelectedCell({ minRow, maxRow, minCol, maxCol });
|
|
43070
43070
|
}
|
|
43071
43071
|
};
|
|
43072
|
-
const handleMouseUp = () => {
|
|
43072
|
+
const handleMouseUp = async () => {
|
|
43073
43073
|
if (!typeDragging.current) {
|
|
43074
43074
|
return;
|
|
43075
43075
|
}
|
|
@@ -43077,13 +43077,40 @@ const CellComponent = React__default.memo((props) => {
|
|
|
43077
43077
|
const column = contentColumns[startCell.col];
|
|
43078
43078
|
const dataCopyRow = dataSource[startCell.row];
|
|
43079
43079
|
if (!(column.editEnable !== true || col.disabledCondition?.(dataCopyRow))) {
|
|
43080
|
+
let objCallback;
|
|
43081
|
+
if (column.onPasteValidate) {
|
|
43082
|
+
const rs = await column.onPasteValidate(dataCopyRow[column.field ?? ''], dataCopyRow, startCell?.row);
|
|
43083
|
+
if (rs && rs.length > 0) {
|
|
43084
|
+
objCallback = rs[0];
|
|
43085
|
+
}
|
|
43086
|
+
else {
|
|
43087
|
+
notificationError(t("PasteExcelNotExist", { index: startCell.row + 1, field: t(column.headerText ?? ""), value: dataCopyRow[column.field ?? ''] }));
|
|
43088
|
+
typeDragging.current = 0;
|
|
43089
|
+
isCopying.current = false;
|
|
43090
|
+
return;
|
|
43091
|
+
}
|
|
43092
|
+
}
|
|
43080
43093
|
const startIndex = startCell.row > indexRow ? startCell.row - 1 : startCell.row + 1;
|
|
43081
43094
|
const condition = (idx) => (startCell.row > indexRow ? idx >= indexRow : idx <= indexRow);
|
|
43082
43095
|
for (let index = startIndex; condition(index); (startCell.row > indexRow ? index-- : index++)) {
|
|
43083
|
-
|
|
43084
|
-
if (column.
|
|
43085
|
-
|
|
43086
|
-
|
|
43096
|
+
//copy dữ liệu
|
|
43097
|
+
if (column.onPaste) {
|
|
43098
|
+
column.onPaste(dataSource[index], dataCopyRow[column.field ?? '']);
|
|
43099
|
+
}
|
|
43100
|
+
else {
|
|
43101
|
+
dataSource[index][column.field ?? ''] = dataCopyRow[column.field ?? ''];
|
|
43102
|
+
}
|
|
43103
|
+
//callback
|
|
43104
|
+
if (column.callback) {
|
|
43105
|
+
//Xác thực dữ liệu được paste
|
|
43106
|
+
if (objCallback) {
|
|
43107
|
+
column.callback(objCallback, index, dataSource[index]);
|
|
43108
|
+
//Giá trị trường callback khi copy
|
|
43109
|
+
}
|
|
43110
|
+
else if (column.callbackValue) {
|
|
43111
|
+
objCallback = column.callbackValue(dataCopyRow);
|
|
43112
|
+
column.callback(objCallback, index, dataSource[index]);
|
|
43113
|
+
}
|
|
43087
43114
|
}
|
|
43088
43115
|
if (rowChange) {
|
|
43089
43116
|
rowChange(dataSource[index], index, column.field);
|
|
@@ -43124,7 +43151,7 @@ const CellComponent = React__default.memo((props) => {
|
|
|
43124
43151
|
const content = typeDis === 'template' ? col.template?.(row, indexRow) ?? '' : value;
|
|
43125
43152
|
const isNegativeNumeric = col.type === 'numeric' && Number(row[col.field]) < 0;
|
|
43126
43153
|
const displayValue = isNegativeNumeric ? jsx("span", { style: { color: formatSetting?.colorNegative ?? 'red' }, children: `${formatSetting?.prefixNegative ?? '-'}${content}${formatSetting?.suffixNegative ?? ''}` }) : content;
|
|
43127
|
-
return (jsx("td", { ...commonTdProps, children: jsx("div", { className: "r-rowcell-div", children: jsxs("div", { className: classNames$2("r-rowcell-content", { "r-active-cell": (isSelected && editDisable) || isActiveCell }, { "r-cell-disable": col.editEnable !== true || col.disabledCondition?.(row) }, { "r-cell-selected-top": indexRow === selectedCell?.minRow && isActiveCell }, { "r-cell-selected-bottom": indexRow === selectedCell?.maxRow && isActiveCell }, { "r-cell-selected-left": indexCol === selectedCell?.minCol && isActiveCell }, { "r-cell-selected-right": indexCol === selectedCell?.maxCol && isActiveCell }, { "r-cell-selected-single": isSingleCellSelected }), style: { textAlign: col.textAlign ?? "left" }, children: [typeDis === 'edit' ? jsx(RenderEditCellComponent, { idTable: idTable, col: col, handleKeyDown: handleKeyDown, handleDataChange: handleDataChange, indexCol: indexCol, indexRow: indexRow, row: row, editDisable: editDisable, formatSetting: formatSetting, gridRef: gridRef }) : jsxs(Fragment$1, { children: [jsx("div", { id: `content-${idTable}-row${indexRow}-col${indexCol}`, tabIndex: Number(`${indexRow + 1}${indexCol + 1}`), onKeyDown: (e) => handleKeyDown(e, row), onMouseDown: (e) => handleMouseDown(e, 1), onDoubleClick: (e) => { focusEditElementCell(e, indexRow, indexCol); }, style: { justifyContent: col.textAlign === "center" ? "center" : col.textAlign === "right" ? "flex-end" : "flex-start" }, className: "r-cell-text", children: displayValue }), content && (jsx(UncontrolledTooltip, { className: "r-tooltip", autohide: false, target: `content-${idTable}-row${indexRow}-col${indexCol}`, children: displayValue }))] }), errorMessage && jsxs(Fragment$1, { children: [jsx("div", { id: `error-row${indexRow}-col${indexCol}`, className: classNames$2("cursor-pointer r-icon-invalid"), children: jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", children: [jsx("g", { "clip-path": "url(#clip0_537_2)", children: jsx("path", { d: "M18.0301 -0.0416304L17.9871 17.5138L0.474868 0.0404105L18.0301 -0.0416304Z", fill: "#da2626ff" }) }), jsx("defs", { children: jsx("clipPath", { id: "clip0_537_2", children: jsx("rect", { width: "18", height: "18", fill: "white" }) }) })] }) }), jsx(UncontrolledTooltip, { target: `error-row${indexRow}-col${indexCol}`, className: "r-tooltip tooltip-error", children: errorMessage?.toString() ?? "" })] }), jsx("div", { className: "drag-handler", onMouseDown: (e) => handleMouseDown(e, 1, true) }), typeDis !== 'edit' && col.type === 'select' && jsx("div", { className: "drop-icon", children: jsx("svg", { height: "20", width: "20", viewBox: "0 0 20 20", children: jsx("path", { d: "M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z" }) }) })] }) }) }));
|
|
43154
|
+
return (jsx("td", { ...commonTdProps, children: jsx("div", { className: "r-rowcell-div", children: jsxs("div", { className: classNames$2("r-rowcell-content", { "r-active-cell": (isSelected && editDisable) || isActiveCell }, { "r-cell-disable": col.editEnable !== true || col.disabledCondition?.(row) }, { "r-cell-selected-top": indexRow === selectedCell?.minRow && isActiveCell }, { "r-cell-selected-bottom": indexRow === selectedCell?.maxRow && isActiveCell }, { "r-cell-selected-left": indexCol === selectedCell?.minCol && isActiveCell }, { "r-cell-selected-right": indexCol === selectedCell?.maxCol && isActiveCell }, { "r-cell-selected-single": isSingleCellSelected }), style: { textAlign: col.textAlign ?? "left" }, children: [typeDis === 'edit' ? jsx(RenderEditCellComponent, { idTable: idTable, col: col, handleKeyDown: handleKeyDown, handleDataChange: handleDataChange, indexCol: indexCol, indexRow: indexRow, row: row, editDisable: editDisable, formatSetting: formatSetting, gridRef: gridRef }) : jsxs(Fragment$1, { children: [jsx("div", { id: `content-${idTable}-row${indexRow}-col${indexCol}`, tabIndex: Number(`${indexRow + 1}${indexCol + 1}`), onKeyDown: (e) => handleKeyDown(e, row), onMouseDown: (e) => handleMouseDown(e, 1), onDoubleClick: (e) => { focusEditElementCell(e, indexRow, indexCol); }, style: { justifyContent: col.textAlign === "center" ? "center" : col.textAlign === "right" ? "flex-end" : "flex-start" }, className: "r-cell-text", children: displayValue }), !!content && (jsx(UncontrolledTooltip, { className: "r-tooltip", autohide: false, target: `content-${idTable}-row${indexRow}-col${indexCol}`, children: displayValue }))] }), errorMessage && jsxs(Fragment$1, { children: [jsx("div", { id: `error-row${indexRow}-col${indexCol}`, className: classNames$2("cursor-pointer r-icon-invalid"), children: jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", children: [jsx("g", { "clip-path": "url(#clip0_537_2)", children: jsx("path", { d: "M18.0301 -0.0416304L17.9871 17.5138L0.474868 0.0404105L18.0301 -0.0416304Z", fill: "#da2626ff" }) }), jsx("defs", { children: jsx("clipPath", { id: "clip0_537_2", children: jsx("rect", { width: "18", height: "18", fill: "white" }) }) })] }) }), jsx(UncontrolledTooltip, { target: `error-row${indexRow}-col${indexCol}`, className: "r-tooltip tooltip-error", children: errorMessage?.toString() ?? "" })] }), jsx("div", { className: "drag-handler", onMouseDown: (e) => handleMouseDown(e, 1, true) }), typeDis !== 'edit' && col.type === 'select' && jsx("div", { className: "drop-icon", children: jsx("svg", { height: "20", width: "20", viewBox: "0 0 20 20", children: jsx("path", { d: "M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z" }) }) })] }) }) }));
|
|
43128
43155
|
});
|
|
43129
43156
|
|
|
43130
43157
|
const handleArrowRight = (e, params) => {
|
|
@@ -43155,20 +43182,44 @@ const handleArrowLeft = (e, params) => {
|
|
|
43155
43182
|
e.preventDefault();
|
|
43156
43183
|
}
|
|
43157
43184
|
};
|
|
43158
|
-
const handleArrowUp = (e, params) => {
|
|
43159
|
-
const { startCell, pagingClient, pagingSetting, handleFocusCell, rowChange, changeDataSource, contentColumns, dataSource, row } = params;
|
|
43185
|
+
const handleArrowUp = async (e, params) => {
|
|
43186
|
+
const { startCell, pagingClient, pagingSetting, handleFocusCell, t, rowChange, changeDataSource, contentColumns, dataSource, row } = params;
|
|
43160
43187
|
if (startCell.row > 0) {
|
|
43161
43188
|
if ((e.ctrlKey || e.metaKey || e.altKey) && e.shiftKey) {
|
|
43162
43189
|
const column = contentColumns[startCell.col];
|
|
43190
|
+
let objCallback;
|
|
43191
|
+
if (column.onPasteValidate) {
|
|
43192
|
+
const rs = await column.onPasteValidate(row[column.field ?? ''], row, startCell?.row);
|
|
43193
|
+
if (rs && rs.length > 0) {
|
|
43194
|
+
objCallback = rs[0];
|
|
43195
|
+
}
|
|
43196
|
+
else {
|
|
43197
|
+
notificationError(t("PasteExcelNotExist", { index: startCell.row + 1, field: t(column.headerText ?? ""), value: row[column.field ?? ''] }));
|
|
43198
|
+
return;
|
|
43199
|
+
}
|
|
43200
|
+
}
|
|
43163
43201
|
for (let index = startCell.row; index >= 0; index--) {
|
|
43164
|
-
|
|
43165
|
-
|
|
43166
|
-
|
|
43167
|
-
|
|
43168
|
-
|
|
43202
|
+
//copy dữ liệu
|
|
43203
|
+
if (column.onPaste) {
|
|
43204
|
+
column.onPaste(dataSource[index], row[column.field ?? '']);
|
|
43205
|
+
}
|
|
43206
|
+
else {
|
|
43207
|
+
dataSource[index][column.field ?? ''] = row[column.field ?? ''];
|
|
43208
|
+
}
|
|
43209
|
+
//callback
|
|
43210
|
+
if (column.callback) {
|
|
43211
|
+
//Xác thực dữ liệu được paste
|
|
43212
|
+
if (objCallback) {
|
|
43213
|
+
column.callback(objCallback, index, dataSource[index]);
|
|
43214
|
+
//Giá trị trường callback khi copy
|
|
43215
|
+
}
|
|
43216
|
+
else if (column.callbackValue) {
|
|
43217
|
+
objCallback = column.callbackValue(row);
|
|
43218
|
+
column.callback(objCallback, index, dataSource[index]);
|
|
43219
|
+
}
|
|
43169
43220
|
}
|
|
43170
43221
|
if (rowChange) {
|
|
43171
|
-
rowChange(
|
|
43222
|
+
rowChange(dataSource[index], index, column.field);
|
|
43172
43223
|
}
|
|
43173
43224
|
}
|
|
43174
43225
|
changeDataSource(dataSource);
|
|
@@ -43182,20 +43233,44 @@ const handleArrowUp = (e, params) => {
|
|
|
43182
43233
|
e.preventDefault();
|
|
43183
43234
|
}
|
|
43184
43235
|
};
|
|
43185
|
-
const handleArrowDown = (e, params) => {
|
|
43186
|
-
const { startCell, totalCount, pagingClient, pagingSetting, handleFocusCell, rowChange, changeDataSource, dataSource, contentColumns, row } = params;
|
|
43236
|
+
const handleArrowDown = async (e, params) => {
|
|
43237
|
+
const { t, startCell, totalCount, pagingClient, pagingSetting, handleFocusCell, rowChange, changeDataSource, dataSource, contentColumns, row } = params;
|
|
43187
43238
|
if (startCell.row < totalCount - 1) {
|
|
43188
43239
|
if ((e.ctrlKey || e.metaKey || e.altKey) && e.shiftKey) {
|
|
43189
43240
|
const column = contentColumns[startCell.col];
|
|
43241
|
+
let objCallback;
|
|
43242
|
+
if (column.onPasteValidate) {
|
|
43243
|
+
const rs = await column.onPasteValidate(row[column.field ?? ''], row, startCell?.row);
|
|
43244
|
+
if (rs && rs.length > 0) {
|
|
43245
|
+
objCallback = rs[0];
|
|
43246
|
+
}
|
|
43247
|
+
else {
|
|
43248
|
+
notificationError(t("PasteExcelNotExist", { index: startCell.row + 1, field: t(column.headerText ?? ""), value: row[column.field ?? ''] }));
|
|
43249
|
+
return;
|
|
43250
|
+
}
|
|
43251
|
+
}
|
|
43190
43252
|
for (let index = startCell.row + 1; index < totalCount; index++) {
|
|
43191
|
-
|
|
43192
|
-
|
|
43193
|
-
|
|
43194
|
-
|
|
43195
|
-
|
|
43253
|
+
//copy dữ liệu
|
|
43254
|
+
if (column.onPaste) {
|
|
43255
|
+
column.onPaste(dataSource[index], row[column.field ?? '']);
|
|
43256
|
+
}
|
|
43257
|
+
else {
|
|
43258
|
+
dataSource[index][column.field ?? ''] = row[column.field ?? ''];
|
|
43259
|
+
}
|
|
43260
|
+
//callback
|
|
43261
|
+
if (column.callback) {
|
|
43262
|
+
//Xác thực dữ liệu được paste
|
|
43263
|
+
if (objCallback) {
|
|
43264
|
+
column.callback(objCallback, index, dataSource[index]);
|
|
43265
|
+
//Giá trị trường callback khi copy
|
|
43266
|
+
}
|
|
43267
|
+
else if (column.callbackValue) {
|
|
43268
|
+
objCallback = column.callbackValue(row);
|
|
43269
|
+
column.callback(objCallback, index, dataSource[index]);
|
|
43270
|
+
}
|
|
43196
43271
|
}
|
|
43197
43272
|
if (rowChange) {
|
|
43198
|
-
rowChange(
|
|
43273
|
+
rowChange(dataSource[index], index, column.field);
|
|
43199
43274
|
}
|
|
43200
43275
|
}
|
|
43201
43276
|
changeDataSource(dataSource);
|