es-grid-template 1.8.43 → 1.8.45
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/es/table-component/TableContainerEdit.js +31 -21
- package/es/table-component/body/EditableCell.js +28 -16
- package/es/table-component/style.scss +4 -3
- package/lib/table-component/TableContainerEdit.js +31 -21
- package/lib/table-component/body/EditableCell.js +28 -16
- package/lib/table-component/style.scss +4 -3
- package/package.json +1 -1
|
@@ -474,27 +474,37 @@ const TableContainerEdit = props => {
|
|
|
474
474
|
const isEdit = typeof columnOri?.editEnable === 'function' ? columnOri.editEnable(newData[targetRow]) : columnOri.editEnable;
|
|
475
475
|
if (isEdit) {
|
|
476
476
|
const columnKey = allCols[targetCol].id;
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
477
|
+
|
|
478
|
+
// if (columnOri.type === 'number' && isFormattedNumber(cellValue.trim())) {
|
|
479
|
+
if (columnOri.type === 'number') {
|
|
480
|
+
if (cellValue.trim() === '') {
|
|
481
|
+
newData[targetRow] = {
|
|
482
|
+
...newData[targetRow],
|
|
483
|
+
[columnKey]: null
|
|
484
|
+
};
|
|
485
|
+
}
|
|
486
|
+
if (isFormattedNumber(cellValue.trim())) {
|
|
487
|
+
const colFormat = typeof columnOri.format === 'function' ? columnOri.format(record) : columnOri.format;
|
|
488
|
+
const valuePasteFormat = detectSeparators(cellValue.trim());
|
|
489
|
+
const cellFormat = getFormat(colFormat, format);
|
|
490
|
+
const thousandSeparator = valuePasteFormat?.thousandSeparator ?? cellFormat?.thousandSeparator;
|
|
491
|
+
const decimalSeparator = valuePasteFormat?.decimalSeparator ?? cellFormat?.decimalSeparator;
|
|
492
|
+
const dec = cellFormat?.decimalScale;
|
|
493
|
+
const numericFormatProps = {
|
|
494
|
+
thousandSeparator: checkThousandSeparator(thousandSeparator, decimalSeparator),
|
|
495
|
+
decimalSeparator: checkDecimalSeparator(thousandSeparator, decimalSeparator),
|
|
496
|
+
allowNegative: cellFormat?.allowNegative ?? true,
|
|
497
|
+
prefix: cellFormat?.prefix,
|
|
498
|
+
suffix: cellFormat?.suffix,
|
|
499
|
+
decimalScale: dec,
|
|
500
|
+
fixedDecimalScale: cellFormat?.fixedDecimalScale ?? false
|
|
501
|
+
};
|
|
502
|
+
const val = removeNumericFormat(cellValue.trim(), undefined, numericFormatProps);
|
|
503
|
+
newData[targetRow] = {
|
|
504
|
+
...newData[targetRow],
|
|
505
|
+
[columnKey]: Number(val)
|
|
506
|
+
};
|
|
507
|
+
}
|
|
498
508
|
} else {
|
|
499
509
|
newData[targetRow] = {
|
|
500
510
|
...newData[targetRow],
|
|
@@ -367,10 +367,13 @@ const EditableCell = props => {
|
|
|
367
367
|
// @ts-ignore
|
|
368
368
|
valueSelectTable = record[fieldValue] ?? value;
|
|
369
369
|
}
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
370
|
+
|
|
371
|
+
// if (isMulti || selectMode === 'checkbox') {
|
|
372
|
+
// // @ts-ignore
|
|
373
|
+
// valueSelectTable = (!isNullOrUndefined(record[dataIndex]) && Array.isArray(record[dataIndex]) && record[dataIndex]?.length > 0) ? options.filter((val: any) => record[dataIndex]?.includes(val[keySelect])) : undefined
|
|
374
|
+
|
|
375
|
+
// }
|
|
376
|
+
|
|
374
377
|
return /*#__PURE__*/React.createElement(AsyncTableSelect
|
|
375
378
|
// id={`col${indexCol}-record${indexRow}`}
|
|
376
379
|
, {
|
|
@@ -475,10 +478,13 @@ const EditableCell = props => {
|
|
|
475
478
|
// @ts-ignore
|
|
476
479
|
valueSelect = record[fieldValue] ?? value;
|
|
477
480
|
}
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
481
|
+
|
|
482
|
+
// if (isMulti || selectMode === 'checkbox') {
|
|
483
|
+
// // @ts-ignore
|
|
484
|
+
// valueSelect = (!isNullOrUndefined(record[dataIndex]) && Array.isArray(record[dataIndex]) && record[dataIndex]?.length > 0) ? options.filter((val: any) => record[dataIndex]?.includes(val[keySelect])) : undefined
|
|
485
|
+
|
|
486
|
+
// }
|
|
487
|
+
|
|
482
488
|
return /*#__PURE__*/React.createElement(Select, {
|
|
483
489
|
options: options,
|
|
484
490
|
value: valueSelect,
|
|
@@ -562,10 +568,13 @@ const EditableCell = props => {
|
|
|
562
568
|
// @ts-ignore
|
|
563
569
|
valueAsyncSelect = record[fieldValue] ?? value;
|
|
564
570
|
}
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
571
|
+
|
|
572
|
+
// if (isMulti || selectMode === 'checkbox') {
|
|
573
|
+
// // @ts-ignore
|
|
574
|
+
// valueAsyncSelect = (!isNullOrUndefined(record[dataIndex]) && Array.isArray(record[dataIndex]) && record[dataIndex]?.length > 0) ? options.filter((val: any) => record[dataIndex]?.includes(val[keySelect])) : undefined
|
|
575
|
+
|
|
576
|
+
// }
|
|
577
|
+
|
|
569
578
|
return /*#__PURE__*/React.createElement(AsyncSelect, {
|
|
570
579
|
options: options,
|
|
571
580
|
defaultOptions: options,
|
|
@@ -694,10 +703,13 @@ const EditableCell = props => {
|
|
|
694
703
|
// @ts-ignore
|
|
695
704
|
valueTreeSelect = record[fieldValue] ?? value;
|
|
696
705
|
}
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
706
|
+
|
|
707
|
+
// if (isMulti || selectMode === 'checkbox') {
|
|
708
|
+
// // @ts-ignore
|
|
709
|
+
// valueTreeSelect = (!isNullOrUndefined(record[dataIndex]) && Array.isArray(record[dataIndex]) && record[dataIndex]?.length > 0) ? options.filter((val: any) => record[dataIndex]?.includes(val[keySelect])) : undefined
|
|
710
|
+
|
|
711
|
+
// }
|
|
712
|
+
|
|
701
713
|
return /*#__PURE__*/React.createElement(TreeSelect, {
|
|
702
714
|
id: `col${indexCol}-record${indexRow}`,
|
|
703
715
|
className: 'be-tree-select',
|
|
@@ -16,7 +16,7 @@ $cell-selected-bg: #F3F8FF !default;
|
|
|
16
16
|
$cell-index-selected-bg: #1869E6 !default;
|
|
17
17
|
//$cell-index-focus-bg: #CEDBEF !default;
|
|
18
18
|
$cell-index-focus-bg: #E6EFFD !default;
|
|
19
|
-
$rowSelectedHoverBg: 'ui-rc' !default;
|
|
19
|
+
// $rowSelectedHoverBg: 'ui-rc' !default;
|
|
20
20
|
$boxShadowColor: rgba(5, 5, 5, 0.09) !default;
|
|
21
21
|
$fontFamily: "Montserrat", Helvetica, Arial, serif !default;
|
|
22
22
|
|
|
@@ -546,9 +546,10 @@ $fontFamily: "Montserrat", Helvetica, Arial, serif !default;
|
|
|
546
546
|
// ------------ select ---------------
|
|
547
547
|
|
|
548
548
|
.#{$prefix}-table-select-single .#{$prefix}-table-select-selector,
|
|
549
|
-
.#{$prefix}-select-single .#{$prefix}-select-selector
|
|
549
|
+
.#{$prefix}-select-single .#{$prefix}-select-selector,
|
|
550
|
+
.ui-rc-table-select-selector {
|
|
550
551
|
|
|
551
|
-
border-radius: 0;
|
|
552
|
+
border-radius: 0 !important;
|
|
552
553
|
|
|
553
554
|
}
|
|
554
555
|
|
|
@@ -481,27 +481,37 @@ const TableContainerEdit = props => {
|
|
|
481
481
|
const isEdit = typeof columnOri?.editEnable === 'function' ? columnOri.editEnable(newData[targetRow]) : columnOri.editEnable;
|
|
482
482
|
if (isEdit) {
|
|
483
483
|
const columnKey = allCols[targetCol].id;
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
484
|
+
|
|
485
|
+
// if (columnOri.type === 'number' && isFormattedNumber(cellValue.trim())) {
|
|
486
|
+
if (columnOri.type === 'number') {
|
|
487
|
+
if (cellValue.trim() === '') {
|
|
488
|
+
newData[targetRow] = {
|
|
489
|
+
...newData[targetRow],
|
|
490
|
+
[columnKey]: null
|
|
491
|
+
};
|
|
492
|
+
}
|
|
493
|
+
if ((0, _utils.isFormattedNumber)(cellValue.trim())) {
|
|
494
|
+
const colFormat = typeof columnOri.format === 'function' ? columnOri.format(record) : columnOri.format;
|
|
495
|
+
const valuePasteFormat = (0, _utils.detectSeparators)(cellValue.trim());
|
|
496
|
+
const cellFormat = (0, _utils.getFormat)(colFormat, format);
|
|
497
|
+
const thousandSeparator = valuePasteFormat?.thousandSeparator ?? cellFormat?.thousandSeparator;
|
|
498
|
+
const decimalSeparator = valuePasteFormat?.decimalSeparator ?? cellFormat?.decimalSeparator;
|
|
499
|
+
const dec = cellFormat?.decimalScale;
|
|
500
|
+
const numericFormatProps = {
|
|
501
|
+
thousandSeparator: (0, _utils.checkThousandSeparator)(thousandSeparator, decimalSeparator),
|
|
502
|
+
decimalSeparator: (0, _utils.checkDecimalSeparator)(thousandSeparator, decimalSeparator),
|
|
503
|
+
allowNegative: cellFormat?.allowNegative ?? true,
|
|
504
|
+
prefix: cellFormat?.prefix,
|
|
505
|
+
suffix: cellFormat?.suffix,
|
|
506
|
+
decimalScale: dec,
|
|
507
|
+
fixedDecimalScale: cellFormat?.fixedDecimalScale ?? false
|
|
508
|
+
};
|
|
509
|
+
const val = (0, _reactNumericComponent.removeNumericFormat)(cellValue.trim(), undefined, numericFormatProps);
|
|
510
|
+
newData[targetRow] = {
|
|
511
|
+
...newData[targetRow],
|
|
512
|
+
[columnKey]: Number(val)
|
|
513
|
+
};
|
|
514
|
+
}
|
|
505
515
|
} else {
|
|
506
516
|
newData[targetRow] = {
|
|
507
517
|
...newData[targetRow],
|
|
@@ -369,10 +369,13 @@ const EditableCell = props => {
|
|
|
369
369
|
// @ts-ignore
|
|
370
370
|
valueSelectTable = record[fieldValue] ?? value;
|
|
371
371
|
}
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
372
|
+
|
|
373
|
+
// if (isMulti || selectMode === 'checkbox') {
|
|
374
|
+
// // @ts-ignore
|
|
375
|
+
// valueSelectTable = (!isNullOrUndefined(record[dataIndex]) && Array.isArray(record[dataIndex]) && record[dataIndex]?.length > 0) ? options.filter((val: any) => record[dataIndex]?.includes(val[keySelect])) : undefined
|
|
376
|
+
|
|
377
|
+
// }
|
|
378
|
+
|
|
376
379
|
return /*#__PURE__*/_react.default.createElement(_asyncTableSelect.AsyncTableSelect
|
|
377
380
|
// id={`col${indexCol}-record${indexRow}`}
|
|
378
381
|
, {
|
|
@@ -477,10 +480,13 @@ const EditableCell = props => {
|
|
|
477
480
|
// @ts-ignore
|
|
478
481
|
valueSelect = record[fieldValue] ?? value;
|
|
479
482
|
}
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
483
|
+
|
|
484
|
+
// if (isMulti || selectMode === 'checkbox') {
|
|
485
|
+
// // @ts-ignore
|
|
486
|
+
// valueSelect = (!isNullOrUndefined(record[dataIndex]) && Array.isArray(record[dataIndex]) && record[dataIndex]?.length > 0) ? options.filter((val: any) => record[dataIndex]?.includes(val[keySelect])) : undefined
|
|
487
|
+
|
|
488
|
+
// }
|
|
489
|
+
|
|
484
490
|
return /*#__PURE__*/_react.default.createElement(_rcMasterUi.Select, {
|
|
485
491
|
options: options,
|
|
486
492
|
value: valueSelect,
|
|
@@ -564,10 +570,13 @@ const EditableCell = props => {
|
|
|
564
570
|
// @ts-ignore
|
|
565
571
|
valueAsyncSelect = record[fieldValue] ?? value;
|
|
566
572
|
}
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
573
|
+
|
|
574
|
+
// if (isMulti || selectMode === 'checkbox') {
|
|
575
|
+
// // @ts-ignore
|
|
576
|
+
// valueAsyncSelect = (!isNullOrUndefined(record[dataIndex]) && Array.isArray(record[dataIndex]) && record[dataIndex]?.length > 0) ? options.filter((val: any) => record[dataIndex]?.includes(val[keySelect])) : undefined
|
|
577
|
+
|
|
578
|
+
// }
|
|
579
|
+
|
|
571
580
|
return /*#__PURE__*/_react.default.createElement(_asyncSelect.AsyncSelect, {
|
|
572
581
|
options: options,
|
|
573
582
|
defaultOptions: options,
|
|
@@ -696,10 +705,13 @@ const EditableCell = props => {
|
|
|
696
705
|
// @ts-ignore
|
|
697
706
|
valueTreeSelect = record[fieldValue] ?? value;
|
|
698
707
|
}
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
708
|
+
|
|
709
|
+
// if (isMulti || selectMode === 'checkbox') {
|
|
710
|
+
// // @ts-ignore
|
|
711
|
+
// valueTreeSelect = (!isNullOrUndefined(record[dataIndex]) && Array.isArray(record[dataIndex]) && record[dataIndex]?.length > 0) ? options.filter((val: any) => record[dataIndex]?.includes(val[keySelect])) : undefined
|
|
712
|
+
|
|
713
|
+
// }
|
|
714
|
+
|
|
703
715
|
return /*#__PURE__*/_react.default.createElement(_rcMasterUi.TreeSelect, {
|
|
704
716
|
id: `col${indexCol}-record${indexRow}`,
|
|
705
717
|
className: 'be-tree-select',
|
|
@@ -16,7 +16,7 @@ $cell-selected-bg: #F3F8FF !default;
|
|
|
16
16
|
$cell-index-selected-bg: #1869E6 !default;
|
|
17
17
|
//$cell-index-focus-bg: #CEDBEF !default;
|
|
18
18
|
$cell-index-focus-bg: #E6EFFD !default;
|
|
19
|
-
$rowSelectedHoverBg: 'ui-rc' !default;
|
|
19
|
+
// $rowSelectedHoverBg: 'ui-rc' !default;
|
|
20
20
|
$boxShadowColor: rgba(5, 5, 5, 0.09) !default;
|
|
21
21
|
$fontFamily: "Montserrat", Helvetica, Arial, serif !default;
|
|
22
22
|
|
|
@@ -546,9 +546,10 @@ $fontFamily: "Montserrat", Helvetica, Arial, serif !default;
|
|
|
546
546
|
// ------------ select ---------------
|
|
547
547
|
|
|
548
548
|
.#{$prefix}-table-select-single .#{$prefix}-table-select-selector,
|
|
549
|
-
.#{$prefix}-select-single .#{$prefix}-select-selector
|
|
549
|
+
.#{$prefix}-select-single .#{$prefix}-select-selector,
|
|
550
|
+
.ui-rc-table-select-selector {
|
|
550
551
|
|
|
551
|
-
border-radius: 0;
|
|
552
|
+
border-radius: 0 !important;
|
|
552
553
|
|
|
553
554
|
}
|
|
554
555
|
|