sccoreui 5.9.99 → 6.0.3
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/App.scss +4 -0
- package/dist/assets/images/drag-and-drop-icon.png +0 -0
- package/dist/components/ag-grid/advancedFeature/advanced-feature.js +1 -1
- package/dist/components/ag-grid/advancedFeature/custom-sort.js +3 -4
- package/dist/components/ag-grid/advancedFeature/hide-column.js +13 -9
- package/dist/components/ag-grid/advancedFeature/new-filter/table-filter.js +1 -1
- package/dist/components/ag-grid/advancedFeature/record-detail.js +1 -1
- package/dist/components/ag-grid/advancedFeature/refresh-grid.js +1 -1
- package/dist/components/ag-grid/grid-checkbox.js +1 -1
- package/dist/components/ag-grid/helper.js +41 -1
- package/dist/components/ag-grid/parent-for-grid.js +15 -1
- package/dist/types/components/ag-grid/helper.d.ts +1 -0
- package/package.json +1 -1
package/dist/App.scss
CHANGED
|
Binary file
|
|
@@ -15,7 +15,7 @@ function AdvancedFeatures({ props }) {
|
|
|
15
15
|
const { featureDetails } = (0, react_1.useContext)(context_provider_1.FeatureContext);
|
|
16
16
|
const conditionsToDisplay = props === null || props === void 0 ? void 0 : props.conditionsToDisplay;
|
|
17
17
|
const { bulkActionComponent: BulkAction } = props;
|
|
18
|
-
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center justify-content-between py-3 px-4" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySearch) && ((0, jsx_runtime_1.jsx)(global_search_1.default, { searchPlaceHolder: props === null || props === void 0 ? void 0 : props.placeholder })), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayFilter) && (0, jsx_runtime_1.jsx)(table_filter_1.default, {})] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center" }, { children: [(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySidePanel) && (0, jsx_runtime_1.jsx)(hide_column_1.default, {}), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayRemoveItems) && (0, jsx_runtime_1.jsx)(remove_items_1.default, {}), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayBulkAction) &&
|
|
18
|
+
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center justify-content-between py-3 px-4" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySearch) && ((0, jsx_runtime_1.jsx)(global_search_1.default, { searchPlaceHolder: props === null || props === void 0 ? void 0 : props.placeholder })), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayFilter) && (0, jsx_runtime_1.jsx)(table_filter_1.default, {})] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySidePanel) && (0, jsx_runtime_1.jsx)(hide_column_1.default, {}), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayRemoveItems) && (0, jsx_runtime_1.jsx)(remove_items_1.default, {}), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayBulkAction) &&
|
|
19
19
|
(props === null || props === void 0 ? void 0 : props.bulkActionComponent) && ((0, jsx_runtime_1.jsx)(BulkAction, { checkBoxSelection: featureDetails.checkBoxSelection })), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displayRefresh) && (0, jsx_runtime_1.jsx)(refresh_grid_1.default, {}), (conditionsToDisplay === null || conditionsToDisplay === void 0 ? void 0 : conditionsToDisplay.displaySort) && (0, jsx_runtime_1.jsx)(custom_sort_1.default, {}), (0, jsx_runtime_1.jsx)(record_detail_1.default, {})] }))] })));
|
|
20
20
|
}
|
|
21
21
|
exports.default = AdvancedFeatures;
|
|
@@ -86,10 +86,9 @@ function Sort() {
|
|
|
86
86
|
setIsApplyDisable(true);
|
|
87
87
|
}
|
|
88
88
|
}, [sortValue, sortBy]);
|
|
89
|
-
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `cursor-pointer sc_icon_hover flex align-items-center border-round ${isOverlayOpened || featureDetails.sort.isSortable
|
|
90
|
-
? "bg-primary-50"
|
|
91
|
-
|
|
92
|
-
? "text-gray-700"
|
|
89
|
+
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: `cursor-pointer sc_icon_hover flex align-items-center border-round hover:bg-primary-50 ${isOverlayOpened || featureDetails.sort.isSortable
|
|
90
|
+
? "bg-primary-50" : "bg-white"}` }, { children: [featureDetails.sort.isSortable && ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: "flex align-items-center text-primary-400 ml-3" }, { children: (sortModelText === null || sortModelText === void 0 ? void 0 : sortModelText.onSelectedSort) ? sortModelText.onSelectedSort : `Selected` }))), (0, jsx_runtime_1.jsx)(button_1.Button, { text: true, className: `p-button-secondary focus:border-0 focus:shadow-none border-none icon-32x32 hover:bg-primary-50`, onClick: (event) => onClickSort(event), icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "switch-vertical-02", size: 16, color: isOverlayOpened || featureDetails.sort.isSortable
|
|
91
|
+
? "text-primary-400"
|
|
93
92
|
: "text-gray-700" }) })] })), (0, jsx_runtime_1.jsxs)(overlaypanel_1.OverlayPanel, Object.assign({ ref: showShort, onShow: () => setIsOverlayOpened(true), onHide: () => setIsOverlayOpened(false), className: "w-18rem mt-2 overlay_list_options" }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "p-4 text-lg font-semibold line-height-3 text-gray-900 border-bottom-1 border-gray-200" }, { children: (sortModelText === null || sortModelText === void 0 ? void 0 : sortModelText.header) ? sortModelText.header : "Column Sorting" })), (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: "pl-0 m-1 max-h-10rem overflow-auto" }, { children: columnData === null || columnData === void 0 ? void 0 : columnData.map((eachColumn, index) => {
|
|
94
93
|
if (eachColumn === null || eachColumn === void 0 ? void 0 : eachColumn.isSortable) {
|
|
95
94
|
const isSelected = eachColumn.field === (sortValue === null || sortValue === void 0 ? void 0 : sortValue.field);
|
|
@@ -9,11 +9,12 @@ const sidebar_1 = require("primereact/sidebar");
|
|
|
9
9
|
const inputswitch_1 = require("primereact/inputswitch");
|
|
10
10
|
const inputtext_1 = require("primereact/inputtext");
|
|
11
11
|
const context_provider_1 = require("../context-provider");
|
|
12
|
+
const drag_and_drop_icon_png_1 = tslib_1.__importDefault(require("../../../assets/images/drag-and-drop-icon.png"));
|
|
12
13
|
function HideColumn() {
|
|
13
14
|
const { gridData, gridApi, updateColumnsForGrid, sidePanelText } = (0, react_1.useContext)(context_provider_1.FeatureContext);
|
|
14
15
|
const [visibleRight, setVisibleRight] = (0, react_1.useState)(false);
|
|
15
16
|
const [checked, setChecked] = (0, react_1.useState)(false);
|
|
16
|
-
|
|
17
|
+
const [inpValue, setInpValue] = (0, react_1.useState)("");
|
|
17
18
|
const [storeNodes, setStoreNodes] = (0, react_1.useState)();
|
|
18
19
|
const [nodes, setNodes] = (0, react_1.useState)();
|
|
19
20
|
const assignInitialValues = () => {
|
|
@@ -38,6 +39,7 @@ function HideColumn() {
|
|
|
38
39
|
};
|
|
39
40
|
// Display search columns
|
|
40
41
|
const searchHandler = (text) => {
|
|
42
|
+
setInpValue(text);
|
|
41
43
|
const searchedColumns = [];
|
|
42
44
|
storeNodes.filter((column) => {
|
|
43
45
|
var _a;
|
|
@@ -49,6 +51,10 @@ function HideColumn() {
|
|
|
49
51
|
});
|
|
50
52
|
setNodes(searchedColumns);
|
|
51
53
|
};
|
|
54
|
+
const clearSearch = () => {
|
|
55
|
+
setNodes(storeNodes);
|
|
56
|
+
setInpValue("");
|
|
57
|
+
};
|
|
52
58
|
// When radio button is switched
|
|
53
59
|
const handleSwitchChange = (selectedColumn, value) => {
|
|
54
60
|
const updatedColumns = [...storeNodes];
|
|
@@ -138,14 +144,12 @@ function HideColumn() {
|
|
|
138
144
|
setStoreNodes(fixNodes);
|
|
139
145
|
}
|
|
140
146
|
}, [visibleRight]);
|
|
141
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { onClick: () => setVisibleRight(true), text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "columns-02", size: 20 }) }), (0, jsx_runtime_1.jsxs)(sidebar_1.Sidebar, Object.assign({ className: "md:w-6 lg:w-
|
|
142
|
-
// value={inpValue}
|
|
143
|
-
onChange: (e) => {
|
|
147
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { onClick: () => setVisibleRight(true), text: true, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "columns-02", size: 20 }) }), (0, jsx_runtime_1.jsxs)(sidebar_1.Sidebar, Object.assign({ className: "md:w-6 lg:w-4", visible: visibleRight, position: "right", onHide: () => setVisibleRight(false) }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center justify-content-between px-4 py-2 border-bottom-1 border-gray-200" }, { children: [(0, jsx_runtime_1.jsx)("h3", { children: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.header) || "Configure Columns" }), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex align-items-center gap-3" }, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { text: true, label: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.disacrd_button) || "Discard", onClick: () => setVisibleRight(false) }), (0, jsx_runtime_1.jsx)(button_1.Button, { label: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.update_button) || "Update", onClick: () => updateColumns() })] }))] })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-4" }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-3 mb-2 border-round border-1 border-gray-300" }, { children: [(0, jsx_runtime_1.jsxs)("h3", Object.assign({ className: "flex align-items-center justify-content-between my-0" }, { children: [(sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.apply_to_all_views) || "Apply to all views", (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: checked, onChange: (e) => setChecked(e.value) })] })), (0, jsx_runtime_1.jsx)("p", Object.assign({ className: "my-0 text-sm" }, { children: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.apply_subHeading) || "Apply the chosen column selection to all available views" }))] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "py-2" }, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "p-input-icon-left p-input-icon-right w-full" }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-prefix" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "search-md" }) })), (inpValue === null || inpValue === void 0 ? void 0 : inpValue.length) > 0 && (0, jsx_runtime_1.jsx)("span", Object.assign({ className: "p-input-suffix cursor-pointer sc_icon_hover", onClick: clearSearch }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "x-close", size: 18 }) })), (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { id: "email", value: inpValue, onChange: (e) => {
|
|
144
148
|
searchHandler(e.target.value);
|
|
145
|
-
}, disabled: false, placeholder: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.search_placeHolder) || "Search by column name", className: "text-lg font-normal text-gray-500 hover:text-gray-900 w-full" })] })) })), (0, jsx_runtime_1.jsxs)("p", Object.assign({ className: "py-2 my-0 text-gray-900 text-lg font-
|
|
146
|
-
|
|
147
|
-
(listItem === null || listItem === void 0 ? void 0 : listItem.selected) && ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className: "flex align-items-center justify-content-between py-3", draggable: true, onDragStart: handleDragStart(idx), onDrop: handleDrop(idx), onDragOver: handleDragOver }, { children: [(0, jsx_runtime_1.
|
|
148
|
-
|
|
149
|
-
(listItem === null || listItem === void 0 ? void 0 : listItem.unSelected) && ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className: "flex align-items-center justify-content-between py-3" }, { children: [(0, jsx_runtime_1.jsx)("span", { children: listItem.headerName }), (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: listItem.checked, onChange: (e) => handleSwitchChange(listItem, e.value) })] }), listItem.id)))) }))] }))] }))] }));
|
|
149
|
+
}, disabled: false, placeholder: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.search_placeHolder) || "Search by column name", className: "text-lg font-normal text-gray-500 hover:text-gray-900 w-full lh-40" })] })) })), (0, jsx_runtime_1.jsxs)("p", Object.assign({ className: "py-2 my-0 text-gray-900 text-lg font-semibold border-bottom-1 border-gray-200" }, { children: [(sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.selected_attributes) || "Selected Attributes", " ", (0, jsx_runtime_1.jsxs)("span", Object.assign({ className: "text-gray-500 text-sm" }, { children: [nodes === null || nodes === void 0 ? void 0 : nodes.filter((node) => node.selected).length, "/", nodes === null || nodes === void 0 ? void 0 : nodes.filter((node) => node.unSelected || node.selected).length] }))] })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "w-full" }, { children: (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: "list-none p-0 px-3" }, { children: (nodes === null || nodes === void 0 ? void 0 : nodes.length) > 0 ?
|
|
150
|
+
nodes === null || nodes === void 0 ? void 0 : nodes.map((listItem, idx) => (listItem === null || listItem === void 0 ? void 0 : listItem.visibleInPanel) &&
|
|
151
|
+
(listItem === null || listItem === void 0 ? void 0 : listItem.selected) && ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className: "flex align-items-center justify-content-between py-3", draggable: true, onDragStart: handleDragStart(idx), onDrop: handleDrop(idx), onDragOver: handleDragOver }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex gap-3" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: drag_and_drop_icon_png_1.default, alt: "Drag and drop", className: "cursor-move" }), (0, jsx_runtime_1.jsx)("span", { children: listItem.headerName })] })), (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: listItem === null || listItem === void 0 ? void 0 : listItem.checked, onChange: (e) => handleSwitchChange(listItem, e.value) })] }), idx))) : ((0, jsx_runtime_1.jsx)("li", { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "flex flex-column" }, { children: [(0, jsx_runtime_1.jsx)("h3", Object.assign({ className: "mt-0 mb-2" }, { children: "Not Found" })), (0, jsx_runtime_1.jsx)("p", Object.assign({ className: "my-0" }, { children: "No results found on the search criteria" }))] })) })) })) })), (0, jsx_runtime_1.jsx)("h3", Object.assign({ className: "mt-6 mb-0 pb-2 border-bottom-1 border-gray-200" }, { children: (sidePanelText === null || sidePanelText === void 0 ? void 0 : sidePanelText.unselected_attributes) || "Unselected Attributes" })), (0, jsx_runtime_1.jsx)("ul", Object.assign({ className: "list-none p-0 px-3" }, { children: (nodes === null || nodes === void 0 ? void 0 : nodes.length) > 0 ?
|
|
152
|
+
nodes === null || nodes === void 0 ? void 0 : nodes.map((listItem) => (listItem === null || listItem === void 0 ? void 0 : listItem.visibleInPanel) &&
|
|
153
|
+
(listItem === null || listItem === void 0 ? void 0 : listItem.unSelected) && ((0, jsx_runtime_1.jsxs)("li", Object.assign({ className: "flex align-items-center justify-content-between py-3" }, { children: [(0, jsx_runtime_1.jsx)("span", { children: listItem.headerName }), (0, jsx_runtime_1.jsx)(inputswitch_1.InputSwitch, { checked: listItem.checked, onChange: (e) => handleSwitchChange(listItem, e.value) })] }), listItem.id))) : ((0, jsx_runtime_1.jsx)("li", { children: "No Data" })) }))] }))] }))] }));
|
|
150
154
|
}
|
|
151
155
|
exports.default = HideColumn;
|
|
@@ -137,7 +137,7 @@ const TableFilter = () => {
|
|
|
137
137
|
setAllFieldsFilled(isAllFieldsFilled && enbleApply);
|
|
138
138
|
}, [conditionsArray, enbleApply]);
|
|
139
139
|
console.log(isOverlayOpened, globalFilters.length, 'toggle property');
|
|
140
|
-
return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: `cursor-pointer filter-btn-grid font-semibold sc_icon_hover flex align-items-center gap-2 border-round-lg ${isOverlayOpened ||
|
|
140
|
+
return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: `cursor-pointer filter-btn-grid font-semibold hover:bg-primary-50 sc_icon_hover flex align-items-center gap-2 border-round-lg ${isOverlayOpened ||
|
|
141
141
|
(globalFilters === null || globalFilters === void 0 ? void 0 : globalFilters.filter((each) => each.isActive).length) >= 1
|
|
142
142
|
? "bg-primary-50"
|
|
143
143
|
: "bg-white"}` }, { children: (0, jsx_runtime_1.jsxs)("span", Object.assign({ onClick: (e) => onClickFilter(e), className: "flex" }, { children: [(0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "filter-lines", size: 18, color: isOverlayOpened ||
|
|
@@ -5,6 +5,6 @@ const react_1 = require("react");
|
|
|
5
5
|
const context_provider_1 = require("../context-provider");
|
|
6
6
|
function RecordDetail() {
|
|
7
7
|
const { totalRecords, recordDetailModelText } = (0, react_1.useContext)(context_provider_1.FeatureContext);
|
|
8
|
-
return ((0, jsx_runtime_1.jsx)(
|
|
8
|
+
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (recordDetailModelText === null || recordDetailModelText === void 0 ? void 0 : recordDetailModelText.totalRecordHeader) ? `${recordDetailModelText.totalRecordHeader} ${totalRecords} ` : `Total ${totalRecords} records` }));
|
|
9
9
|
}
|
|
10
10
|
exports.default = RecordDetail;
|
|
@@ -8,6 +8,6 @@ const svg_component_1 = tslib_1.__importDefault(require("../../../directives/svg
|
|
|
8
8
|
const button_1 = require("primereact/button");
|
|
9
9
|
function RefreshGrid() {
|
|
10
10
|
const { removeFeaturesAndRefresh } = (0, react_1.useContext)(context_provider_1.FeatureContext);
|
|
11
|
-
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(button_1.Button, { className: "icon-32x32 hover:bg-primary-50",
|
|
11
|
+
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(button_1.Button, { className: "p-button-secondary bg-white focus:border-0 focus:shadow-none border-0 icon-32x32 hover:bg-primary-50", onClick: removeFeaturesAndRefresh, icon: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "refresh-ccw-01", color: "text-gray-700" }) }) }));
|
|
12
12
|
}
|
|
13
13
|
exports.default = RefreshGrid;
|
|
@@ -5,6 +5,6 @@ const jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
5
5
|
const checkbox_1 = require("primereact/checkbox");
|
|
6
6
|
const svg_component_1 = tslib_1.__importDefault(require("../../directives/svg-component"));
|
|
7
7
|
const GridCheckBOx = ({ checked, onChange, isIndeterminate }) => {
|
|
8
|
-
return ((0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { icon: isIndeterminate && (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus
|
|
8
|
+
return ((0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { icon: isIndeterminate && (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "minus", color: "#111c5b" }), onChange: onChange, checked: checked, className: "" }));
|
|
9
9
|
};
|
|
10
10
|
exports.default = GridCheckBOx;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.sortColumns = exports.parseIfNeeded = exports.applyDefaultFilters = void 0;
|
|
3
|
+
exports.fillOperation = exports.sortColumns = exports.parseIfNeeded = exports.applyDefaultFilters = void 0;
|
|
4
4
|
const applyDefaultFilters = (defaultFilters) => {
|
|
5
5
|
console.log(defaultFilters, 'deafult filters');
|
|
6
6
|
const filters = defaultFilters === null || defaultFilters === void 0 ? void 0 : defaultFilters.map((item) => {
|
|
@@ -44,3 +44,43 @@ const sortColumns = (columns) => {
|
|
|
44
44
|
return sortedColumns;
|
|
45
45
|
};
|
|
46
46
|
exports.sortColumns = sortColumns;
|
|
47
|
+
const fillOperation = (params, api, initialDragRowIndex, callBack) => {
|
|
48
|
+
const { finalRange } = params;
|
|
49
|
+
const { startRow, endRow, columns, startColumn } = finalRange;
|
|
50
|
+
const columnDetails = columns[0].colDef;
|
|
51
|
+
const selectedColumn = (startColumn === null || startColumn === void 0 ? void 0 : startColumn.userProvidedColDef) || columnDetails;
|
|
52
|
+
// Determine the parent row based on the drag direction
|
|
53
|
+
let parentRowIndex;
|
|
54
|
+
if (initialDragRowIndex <= endRow.rowIndex) {
|
|
55
|
+
parentRowIndex = initialDragRowIndex;
|
|
56
|
+
}
|
|
57
|
+
else {
|
|
58
|
+
parentRowIndex = endRow.rowIndex;
|
|
59
|
+
}
|
|
60
|
+
const parentRowData = api.getDisplayedRowAtIndex(parentRowIndex).data;
|
|
61
|
+
// Collect all selected rows
|
|
62
|
+
const selectedRows = [];
|
|
63
|
+
for (let i = Math.min(startRow.rowIndex, endRow.rowIndex); i <= Math.max(startRow.rowIndex, endRow.rowIndex); i++) {
|
|
64
|
+
const rowNode = api.getDisplayedRowAtIndex(i);
|
|
65
|
+
const rowData = rowNode.data;
|
|
66
|
+
console.log(rowData, 'row data in loop of fill');
|
|
67
|
+
// Update the cell value with the value from the parent row
|
|
68
|
+
rowData[columnDetails.field] = parentRowData[columnDetails.field];
|
|
69
|
+
if (rowData && rowData !== parentRowData) {
|
|
70
|
+
selectedRows.push(rowData);
|
|
71
|
+
}
|
|
72
|
+
// Reflect the change in the grid
|
|
73
|
+
api.applyTransaction({ update: [rowData] });
|
|
74
|
+
}
|
|
75
|
+
// Refresh the cells to show the updated data
|
|
76
|
+
api.refreshCells({ force: true });
|
|
77
|
+
const selectedRowsToUpdate = {
|
|
78
|
+
column: selectedColumn,
|
|
79
|
+
parentRow: parentRowData,
|
|
80
|
+
childRows: selectedRows,
|
|
81
|
+
};
|
|
82
|
+
if (callBack) {
|
|
83
|
+
callBack(selectedRowsToUpdate);
|
|
84
|
+
}
|
|
85
|
+
};
|
|
86
|
+
exports.fillOperation = fillOperation;
|
|
@@ -22,6 +22,7 @@ function ParentForGrid(props) {
|
|
|
22
22
|
const [totalRecords, setTotalRecords] = (0, react_1.useState)(0);
|
|
23
23
|
const [gridReadyEvent, setGridReadyEvent] = (0, react_1.useState)();
|
|
24
24
|
const [defaultSelectedRows, setDefaultSelectedRows] = (0, react_1.useState)([]);
|
|
25
|
+
const [initialDragRowIndex, setInitialDragRowIndex] = (0, react_1.useState)(null);
|
|
25
26
|
const [defaultFilters, setDefaultFilters] = (0, react_1.useState)((props === null || props === void 0 ? void 0 : props.defaultFilters) || []);
|
|
26
27
|
const [emptyResponse] = (0, react_1.useState)({
|
|
27
28
|
totalRecords: 0,
|
|
@@ -202,6 +203,7 @@ function ParentForGrid(props) {
|
|
|
202
203
|
const response = yield getData(startRow, endRow, currentFeatures, params === null || params === void 0 ? void 0 : params.request);
|
|
203
204
|
// simulating real server call with a 500ms delay
|
|
204
205
|
if (((_g = response.rowData) === null || _g === void 0 ? void 0 : _g.length) > 0) {
|
|
206
|
+
gridRef.current.api.hideOverlay();
|
|
205
207
|
// supply rows for requested block to grid
|
|
206
208
|
params.success({ rowData: response.rowData, rowCount: response === null || response === void 0 ? void 0 : response.actualEndRow });
|
|
207
209
|
}
|
|
@@ -215,6 +217,14 @@ function ParentForGrid(props) {
|
|
|
215
217
|
params.api.setGridOption("serverSideDatasource", dataSource);
|
|
216
218
|
}
|
|
217
219
|
});
|
|
220
|
+
// Get the direction of selected range
|
|
221
|
+
const onCellMouseDown = (event) => {
|
|
222
|
+
setInitialDragRowIndex(event.node.rowIndex);
|
|
223
|
+
};
|
|
224
|
+
// Update cell from front end and give a call back to products
|
|
225
|
+
const wrapperToFillOpertation = (params) => {
|
|
226
|
+
(0, helper_1.fillOperation)(params, api, initialDragRowIndex, props === null || props === void 0 ? void 0 : props.updateCell);
|
|
227
|
+
};
|
|
218
228
|
// Options that grid should have
|
|
219
229
|
const gridOptions = {
|
|
220
230
|
columnDefs: gridData.columnData.map((column) => {
|
|
@@ -244,7 +254,11 @@ function ParentForGrid(props) {
|
|
|
244
254
|
loadingOverlayComponent: loading_component_1.default,
|
|
245
255
|
suppressCellFocus: true,
|
|
246
256
|
suppressPropertyNamesCheck: true,
|
|
247
|
-
suppressServerSideFullWidthLoadingRow: true
|
|
257
|
+
suppressServerSideFullWidthLoadingRow: true,
|
|
258
|
+
enableRangeSelection: true,
|
|
259
|
+
enableFillHandle: true,
|
|
260
|
+
onFillEnd: wrapperToFillOpertation,
|
|
261
|
+
onCellMouseDown: onCellMouseDown
|
|
248
262
|
};
|
|
249
263
|
// Fucntion to call the grid
|
|
250
264
|
const callGrid = (featureDetails) => {
|
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
export declare const applyDefaultFilters: (defaultFilters: any) => any;
|
|
2
2
|
export declare const parseIfNeeded: (value: any) => any;
|
|
3
3
|
export declare const sortColumns: (columns: any) => any;
|
|
4
|
+
export declare const fillOperation: (params: any, api: any, initialDragRowIndex: any, callBack: any) => void;
|