react-table-edit 1.5.18 → 1.5.20
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/type/index.d.ts +2 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +13 -11
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +13 -11
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -39771,13 +39771,15 @@ const SettingColumn = (props) => {
|
|
|
39771
39771
|
|
|
39772
39772
|
const ToolbarBottom = ({ handleAdd, handleDuplicate, handleInsertBefore, handleInsertAfter, handleDeleteAll, setOpenPopupSetupColumn, focusRow, editDisable, addDisable, buttonSetting, toolbarSetting, headerColumns }) => {
|
|
39773
39773
|
const { t } = useTranslation();
|
|
39774
|
-
return (jsx("div", { id: "table_custom_bottom_toolbar", className: "r-toolbar r-toolbar-bottom", role: "toolbar", "aria-disabled": "false", "aria-haspopup": "false", "aria-orientation": "horizontal", children: jsxs("div", { className: "r-toolbar-items", children: [jsxs("div", { className: "r-toolbar-left", children: [jsxs("div", { className: classNames$1('r-toolbar-item d-flex', { 'd-none': editDisable || addDisable }), "aria-disabled": "false", children: [jsx(Button$1$1, { color:
|
|
39775
|
-
|
|
39774
|
+
return (jsx("div", { id: "table_custom_bottom_toolbar", className: "r-toolbar r-toolbar-bottom", role: "toolbar", "aria-disabled": "false", "aria-haspopup": "false", "aria-orientation": "horizontal", children: jsxs("div", { className: "r-toolbar-items", children: [jsxs("div", { className: "r-toolbar-left", children: [jsxs("div", { className: classNames$1('r-toolbar-item d-flex', { 'd-none': editDisable || addDisable }), "aria-disabled": "false", children: [jsx(Button$1$1, { color: "success", outline: true, onClick: () => handleAdd(1), className: "d-flex", children: t('Add item') }), !!buttonSetting?.disableAddMulti && (jsxs(UncontrolledDropdown, { className: "nav-item", children: [jsx(DropdownToggle$1, { tag: "div", className: "me-0 d-flex", children: jsx(Button$1$1, { type: "button", color: "success", outline: true, style: { marginLeft: -1 }, className: "px-25", children: jsx("svg", { fill: "#28c76f", height: "15", 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" }) }) }) }), jsxs(DropdownMenu$1, { className: "formula-dropdown icon-dropdown p-0", children: [jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(10), children: "10 h\u00E0ng" }), jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(20), children: "20 h\u00E0ng" }), jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(30), children: "30 h\u00E0ng" }), jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(40), children: "40 h\u00E0ng" }), jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(50), children: "50 h\u00E0ng" }), jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(100), children: "100 h\u00E0ng" }), jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(1000), children: "1000 h\u00E0ng" })] })] }))] }), (focusRow ?? -1) > -1 ? (jsxs(Fragment$1, { children: [jsx("div", { className: classNames$1('r-toolbar-item', { 'd-none': editDisable || addDisable || buttonSetting?.duplicateDisable }), "aria-disabled": "false", children: jsx(Button$1$1, { color: "success", outline: true, onClick: () => {
|
|
39775
|
+
handleDuplicate();
|
|
39776
|
+
}, className: "d-flex", children: t('Duplicate') }) }), jsx("div", { className: classNames$1('r-toolbar-item', { 'd-none': editDisable || addDisable || buttonSetting?.insertBeforeDisable }), "aria-disabled": "false", children: jsx(Button$1$1, { color: "success", outline: true, onClick: handleInsertBefore, className: "d-flex", children: t('Insert item before') }) }), jsx("div", { className: classNames$1('r-toolbar-item', { 'd-none': editDisable || addDisable || buttonSetting?.insertAfterDisable }), "aria-disabled": "false", children: jsx(Button$1$1, { color: "success", outline: true, onClick: handleInsertAfter, className: "d-flex", children: t('Insert item after') }) })] })) : (jsx(Fragment$1, { children: " " })), jsx("div", { className: classNames$1('r-toolbar-item', { 'd-none': editDisable || buttonSetting?.deleteAllDisable }), "aria-disabled": "false", children: jsx(Button$1$1, { color: "primary", outline: true, onClick: handleDeleteAll, className: "d-flex", children: t('Delete all item') }) }), toolbarSetting?.toolbarBottomOptions?.map((item, index) => {
|
|
39777
|
+
return item.align === 'left' ? (jsx("div", { className: "r-toolbar-item", "aria-disabled": "false", children: item.template() }, `toolbar-bottom-left-${index}`)) : ('');
|
|
39776
39778
|
})] }), jsx("div", { className: "r-toolbar-center", children: toolbarSetting?.toolbarBottomOptions?.map((item, index) => {
|
|
39777
|
-
return
|
|
39779
|
+
return item.align === 'center' ? (jsx("div", { className: "r-toolbar-item", "aria-disabled": "false", children: item.template() }, `toolbar-bottom-center-${index}`)) : ('');
|
|
39778
39780
|
}) }), jsxs("div", { className: "r-toolbar-right", children: [toolbarSetting?.toolbarBottomOptions?.map((item, index) => {
|
|
39779
|
-
return
|
|
39780
|
-
}), jsx("div", { className: classNames$1('r-toolbar-item me-25', { 'd-none': headerColumns.length > 1 }), "aria-disabled": "false", children: jsx(SvgSettings, { className: "text-primary cursor-pointer", onClick: () => setOpenPopupSetupColumn(true) }) }), jsx("div", { className: classNames$1('r-toolbar-item me-25', { 'd-none': editDisable || addDisable }), "aria-disabled": "false", children: jsxs(UncontrolledDropdown, { className:
|
|
39781
|
+
return item.align === 'right' ? (jsx("div", { className: "r-toolbar-item", "aria-disabled": "false", children: item.template() }, `toolbar-bottom-right-${index}`)) : ('');
|
|
39782
|
+
}), jsx("div", { className: classNames$1('r-toolbar-item me-25', { 'd-none': headerColumns.length > 1 }), "aria-disabled": "false", children: jsx(SvgSettings, { className: "text-primary cursor-pointer", onClick: () => setOpenPopupSetupColumn(true) }) }), jsx("div", { className: classNames$1('r-toolbar-item me-25', { 'd-none': editDisable || addDisable }), "aria-disabled": "false", children: jsxs(UncontrolledDropdown, { className: "dropdown-user nav-item", children: [jsx(DropdownToggle$1, { tag: "div", color: "primary", onClick: (e) => e.preventDefault(), children: jsx(SvgInfo, { className: "cursor-pointer text-primary" }) }), jsx(DropdownMenu$1, { className: "formula-dropdown icon-dropdown", children: jsxs("ul", { className: "mb-0 pe-50", children: [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" }), jsx("li", { style: { fontSize: 13 }, children: "Ch\u1ECDn \u00F4 v\u00E0 Ctrl + V \u0111\u1EC3 d\u00E1n th\u00F4ng tin t\u1EEB excel" }), 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" }), 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" }), jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n Ctrl ho\u1EB7c Alt + Shift + \u2193 \u0111\u1EC3 sao ch\u00E9p d\u1EEF li\u1EC7u \u00F4 cho c\u00E1c d\u00F2ng d\u01B0\u1EDBi" }), jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n Ctrl ho\u1EB7c Alt + Shift + \u2191 \u0111\u1EC3 sao ch\u00E9p d\u1EEF li\u1EC7u \u00F4 cho c\u00E1c d\u00F2ng tr\u00EAn" })] }) })] }) })] })] }) }));
|
|
39781
39783
|
};
|
|
39782
39784
|
|
|
39783
39785
|
const TableEdit = forwardRef((props, ref) => {
|
|
@@ -68669,7 +68671,7 @@ const RenderContentCol = (props) => {
|
|
|
68669
68671
|
// ✅ Format dữ liệu theo loại cột
|
|
68670
68672
|
if (col.type === 'numeric') {
|
|
68671
68673
|
value = formartNumberic(row[col.field], formatSetting?.decimalSeparator ?? ',', formatSetting?.thousandSeparator ?? '.', col.numericSettings?.fraction, true, false) ?? 0;
|
|
68672
|
-
if (!zeroVisiable && (value === '0' || value === 0)) {
|
|
68674
|
+
if (!zeroVisiable && !(row?.sortOrder < 0 || row?.sortOrder > 100000) && (value === '0' || value === 0)) {
|
|
68673
68675
|
value = '';
|
|
68674
68676
|
}
|
|
68675
68677
|
}
|
|
@@ -68743,12 +68745,12 @@ const TableView = ({ idTable, dataSource, height = 400, columns, isMutil = false
|
|
|
68743
68745
|
const fieldKey = columns.find((item) => item.isPrimarykey === true)?.field ?? 'id';
|
|
68744
68746
|
const [contentColumns, setContentColumns] = useState([]);
|
|
68745
68747
|
const [groupColumns, setGroupColumns] = useState([]);
|
|
68746
|
-
const [expandsAll, setExpandsAll] = useState();
|
|
68748
|
+
const [expandsAll, setExpandsAll] = useState(true);
|
|
68747
68749
|
useEffect(() => {
|
|
68748
68750
|
if (groupSetting?.groupColumns) {
|
|
68749
68751
|
setGroupColumns([...groupSetting.groupColumns]);
|
|
68750
68752
|
}
|
|
68751
|
-
setExpandsAll(
|
|
68753
|
+
setExpandsAll(true);
|
|
68752
68754
|
}, [groupSetting?.groupColumns]);
|
|
68753
68755
|
const { levels: headerColumns, flatVisble, objHeaderWidthFixLeft, objHeaderWidthFixRight, objWidthFixLeft, objWidthFixRight, lastObjWidthFixLeft, fisrtObjWidthFixRight } = useMemo(() => {
|
|
68754
68756
|
const rs = calculateTableStructure(columns, settingColumns?.value);
|
|
@@ -68967,7 +68969,7 @@ const TableView = ({ idTable, dataSource, height = 400, columns, isMutil = false
|
|
|
68967
68969
|
const firstColSpan = flatVisble.length > 6 ? 3 : Math.floor(flatVisble.length / 2);
|
|
68968
68970
|
const RenderContent = ({ datas, level = 0 }) => {
|
|
68969
68971
|
return (jsx(Fragment$1, { children: datas.map((row, indexRow) => {
|
|
68970
|
-
const [expand, setExpand] = useState(row.expand ??
|
|
68972
|
+
const [expand, setExpand] = useState(row.expand ?? true);
|
|
68971
68973
|
useEffect(() => {
|
|
68972
68974
|
if (expandsAll !== undefined) {
|
|
68973
68975
|
setExpand(expandsAll);
|
|
@@ -69010,7 +69012,7 @@ const TableView = ({ idTable, dataSource, height = 400, columns, isMutil = false
|
|
|
69010
69012
|
sumValue = '';
|
|
69011
69013
|
}
|
|
69012
69014
|
}
|
|
69013
|
-
return (jsx("td", { className: "r-rowcell r-cell-sum-group", children: jsx("div", { className: "r-rowcell-div", style: { justifyContent: colSum.textAlign ? colSum.textAlign : 'left' }, children: (haveSum || colSum.haveSum === true) && Number(sumValue) < 0 ?
|
|
69015
|
+
return (jsx("td", { className: "r-rowcell r-cell-sum-group", children: jsx("div", { className: "r-rowcell-div", style: { justifyContent: colSum.textAlign ? colSum.textAlign : 'left' }, children: (haveSum || colSum.haveSum === true) && Number(sumValue) < 0 ? jsxs("div", { style: { color: formatSetting?.colorNegative ?? 'red' }, children: [" ", `${formatSetting?.prefixNegative ?? '-'}${sumValue}${formatSetting?.suffixNegative ?? ''}`] }) : sumValue }) }, `group-sum-cell-${level}-${indexRow}-${indexCol}`));
|
|
69014
69016
|
})] }), expand && jsx(RenderContent, { datas: row.children, level: level + 1 })] }, `row-${level}-${indexRow}`));
|
|
69015
69017
|
}
|
|
69016
69018
|
else {
|
|
@@ -69049,7 +69051,7 @@ const TableView = ({ idTable, dataSource, height = 400, columns, isMutil = false
|
|
|
69049
69051
|
left: col.fixedType === 'left' ? objWidthFixLeft[indexCol] : undefined,
|
|
69050
69052
|
right: col.fixedType === 'right' ? objWidthFixRight[indexCol] : undefined,
|
|
69051
69053
|
textAlign: col.textAlign ? col.textAlign : 'left'
|
|
69052
|
-
}, children: jsx("div", { className: "r-footer-div", children: (item || col.haveSum === true) && Number(sumValue) < 0 ?
|
|
69054
|
+
}, children: jsx("div", { className: "r-footer-div", children: (item || col.haveSum === true) && Number(sumValue) < 0 ? jsxs("div", { style: { color: formatSetting?.colorNegative ?? 'red' }, children: [" ", `${formatSetting?.prefixNegative ?? '-'}${sumValue}${formatSetting?.suffixNegative ?? ''}`] }) : sumValue }) }, `summarycell-${indexCol}`));
|
|
69053
69055
|
}) })) })] }), (viewData.length ?? 0) === 0 && !isLoading && (jsxs("div", { className: "r-no-data", children: [jsx("svg", { width: "64", height: "41", viewBox: "0 0 64 41", xmlns: "http://www.w3.org/2000/svg", children: jsxs("g", { transform: "translate(0 1)", fill: "none", fillRule: "evenodd", children: [jsx("ellipse", { fill: "#f5f5f5", cx: "32", cy: "33", rx: "32", ry: "7" }), jsxs("g", { fillRule: "nonzero", stroke: "#d9d9d9", children: [jsx("path", { d: "M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z" }), jsx("path", { d: "M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z", fill: "#fafafa" })] })] }) }), t('No data available.')] })), isLoading && (jsx("div", { className: "r-loading-overlay", children: jsxs("div", { className: "r-loading", children: [jsx(Spinner$1, { className: "me-1" }), t('Loading...')] }) }))] })] }), pagingSetting?.allowPaging && (jsx(PagingComponent, { gridRef: gridRef, onChangePage: onChangePage, pageSize: pagingSetting?.pageSize ?? 0, currentPage: pagingSetting?.currentPage ?? 0, pageOptions: pagingSetting?.pageOptions ?? [20, 30, 50, 100], totalItem: pagingSetting?.totalItem ?? 0, onChangePageSize: onChangePageSize })), jsx(SettingColumn, { gridRef: gridRef, handleSidebar: () => {
|
|
69054
69056
|
setOpenPopupSetupColumn(!openPopupSetupColumn);
|
|
69055
69057
|
}, settingColumns: settingColumns, openSidebar: openPopupSetupColumn, column: [...contentColumns], resetDefaultColumns: resetDefaultColumns, setColumn: (newColumns) => {
|