sccoreui
Version:
ui-sccore
838 lines (837 loc) • 36.6 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const constants_1 = require("../../components/ag-grid/constants");
const react_1 = require("react");
const BulkAction_1 = tslib_1.__importDefault(require("./BulkAction"));
const parent_for_grid_1 = tslib_1.__importDefault(require("../../components/ag-grid/parent-for-grid"));
const axios_1 = tslib_1.__importDefault(require("axios"));
const inputtext_1 = require("primereact/inputtext");
const type_1 = require("../../components/types/type");
const svg_component_1 = tslib_1.__importDefault(require("../../directives/svg-component"));
// import { Dropdown } from "primereact/dropdown";
// import CustomDropDown from "../../components/ag-grid/custom-dropdown";
// import { FakeServer } from "./fakeServer";
// import IdCell from "./id-cell";
// import { Dropdown } from "primereact/dropdown";
// import { FilterDataType } from "../../components/ag-grid/constants";
const treeData = [
{
orgHierarchy: ["Testing configuable products"],
id: "66d8352fb870ddafea4cbb77",
code: "Testingconfiguableproducts",
type: 2,
totalSkuCount: 6,
},
{
orgHierarchy: [
"Testing configuable products",
"Testingconfiguableproducts-Blue-cc1234-fbdfb",
],
id: "66d86873bc124aba35f15190",
code: "Testingconfiguableproducts-Blue-cc1234-fbdfb",
},
{
orgHierarchy: [
"Testing configuable products",
"Testingconfiguableproducts-Blue-cc1234-red",
],
id: "66d86873bc124aba35f1518e",
code: "Testingconfiguableproducts-Blue-cc1234-red",
},
];
const AgGridPage = () => {
const [rowData, setRowData] = (0, react_1.useState)([]);
const [shouldRefetch, setShouldRefetch] = (0, react_1.useState)(false);
const [defaultFilters] = (0, react_1.useState)([]);
const [storeResult, setStoreResult] = (0, react_1.useState)();
// const deleteComponent = () => {
// return (
// <div>
// <button className="bg-white" onClick={() => setShouldRefetch(true)}>
// Delete
// </button>
// </div>
// );
// };
// const AdvancedFilter = () => {
// return <p>Advnaced Filter</p>;
// };
const initialConditions = {
displayFilter: type_1.VisibilityState.ENABLE,
displayAdvancedFilter: type_1.VisibilityState.ENABLE,
displaySort: type_1.VisibilityState.DISABLE,
displaySearch: type_1.VisibilityState.ENABLE,
displayRefresh: type_1.VisibilityState.DISABLE,
displayRemoveItems: type_1.VisibilityState.DISABLE,
displayBulkAction: type_1.VisibilityState.HIDE,
enableViewCreate: true,
displaySidePanel: type_1.VisibilityState.ENABLE,
enableFillHandle: true,
displayBulkEdit: type_1.VisibilityState.DISABLE,
displayDiscardEdit: false,
displaySaveEditButton: false,
displayRecords: type_1.VisibilityState.ENABLE,
displayEditHeading: type_1.VisibilityState.ENABLE,
displayFeaturesHeader: true,
displayCheckboxOnRight: false,
displayGroupCount: true,
displayCheckboxForGroupChild: false,
displayCheckboxForGroups: false,
displayRowGroupingElement: type_1.VisibilityState.ENABLE,
isGridAutoHeight: false,
};
const [conditionsToDisplay, setConditionsToDisplay] = (0, react_1.useState)(initialConditions);
// const updateRows = (row) => {
// setUpdateRowData({ rowData: row, shouldUpdate: true })
// }
// const statusDropDwon = (params) => {
// return <Dropdown
// onChange={(e) => { params.data.status = e.value, console.log(e.value, 'value updating on change'), updateRows(params.data) }}
// value={params.data?.status}
// options={[{ id: 1, label: "Draft", value: 1 },
// { id: 2, label: "Active", value: 2 },
// {
// id: 3,
// label: "Inactive",
// value: 3,
// }]}
// />
// }
const [shouldClearFilters, setShouldClearFilters] = (0, react_1.useState)(false);
// Callback for remove button click
// const removeCallBack = (featureDetails) => {
// console.log(featureDetails, "feature details in products on remove click");
// };
// const groupColumns = [
// {
// id: "1",
// seq: 1,
// field: "rank",
// headerName: "rank",
// rowGroup: true,
// },
// {
// id: "2",
// seq: 2,
// field: "name",
// headerName: "Name",
// },
// ];
// const [columnDefs] = useState(
// // [
// // {
// // seq: 1,
// // // pinned: "left",
// // // lockPosition: "left",
// // // cellClass: "lock-pinned",
// // // suppressMovable: true,
// // enableHeaderCheckbox: true,
// // hide: false,
// // enableChildCheckbox: true,
// // id: "101",
// // headerName: "ID",
// // field: "id",
// // isSortable: false,
// // code: 1,
// // dataType: FilterDataType.STRING,
// // editable: true,
// // isFilterable: false,
// // cellStyle: { borderRight: "1px solid #ccc" },
// // visibleInPanel: true,
// // cellRendererSelector: (params) => {
// // if (params.node.rowPinned) {
// // return {
// // component: CustomDropDown,
// // params: {
// // style: { color: "#5577CC" },
// // },
// // };
// // } else {
// // return undefined;
// // }
// // },
// // suppressFillHandle: true,
// // isEditable: false
// // },
// // {
// // id: "111",
// // seq: 3,
// // headerName: "Email",
// // dataType: FilterDataType.STRING,
// // editable: true,
// // visibleInPanel: true,
// // isFilterable: false,
// // field: "email",
// // suppressFillHandle: false,
// // isEditable: true,
// // filter: "agTextColumnFilter",
// // },
// // {
// // seq: 3,
// // filter: "agTextColumnFilter",
// // // lockPinned: true,
// // hide: false,
// // id: "102",
// // headerName: "Title",
// // cellRendererSelector: (params) => {
// // if (params.node.rowPinned) {
// // return {
// // component: CustomDropDown,
// // params: {
// // style: { color: "#5577CC" },
// // },
// // };
// // } else {
// // return undefined;
// // }
// // },
// // field: "name",
// // isSortable: true,
// // code: 1,
// // dataType: FilterDataType.STRING,
// // editable: true,
// // visibleInPanel: true,
// // isFilterable: false,
// // suppressFillHandle: false,
// // isEditable: true
// // },
// // {
// // seq: 2,
// // hide: true,
// // // lockPinned: true,
// // id: "103",
// // headerName: "Body",
// // field: "body",
// // isSortable: true,
// // code: 1,
// // dataType: FilterDataType.STRING,
// // editable: true,
// // visibleInPanel: true,
// // isFilterable: true,
// // suppressFillHandle: false,
// // isEditable: true,
// // filter: "agTextColumnFilter",
// // },
// // {
// // seq: 4,
// // hide: false,
// // id: "104",
// // headerName: "Status",
// // field: "status",
// // isSortable: true,
// // visibleInPanel: true,
// // columnType: "single",
// // filter: true,
// // rowGroup: false,
// // filterParams: {
// // values: [
// // 1,
// // 2,
// // 3
// // ]
// // },
// // options: [
// // { id: 1, label: "Draft", value: 1 },
// // { id: 2, label: "Active", value: 2 },
// // { id: 3, label: "Inactive", value: 3 },
// // ],
// // code: 1,
// // dataType: FilterDataType.SELECT,
// // editable: false,
// // isFilterable: true,
// // cellRenderer: statusDropDwon,
// // suppressFillHandle: false,
// // isEditable: true
// // },
// // {
// // seq: 6,
// // hide: false,
// // // lockPinned: true,
// // id: "555",
// // headerName: "Price",
// // field: "price",
// // isSortable: true,
// // code: 1,
// // dataType: FilterDataType.INTEGER,
// // editable: true,
// // visibleInPanel: true,
// // isFilterable: true,
// // suppressFillHandle: false,
// // isEditable: true,
// // filter: "agNumberColumnFilter",
// // },
// // {
// // seq: 6,
// // hide: false,
// // // lockPinned: true,
// // id: "666",
// // headerName: "Date",
// // field: "date",
// // isSortable: true,
// // code: 1,
// // dataType: FilterDataType.DATE,
// // editable: false,
// // visibleInPanel: true,
// // isFilterable: true,
// // suppressFillHandle: false,
// // isEditable: true,
// // filter: true,
// // },
// // {
// // seq: 5,
// // id: "105",
// // hide: false,
// // isEditable: false,
// // // pinned: "right",
// // // lockPosition: "rigth",
// // // cellClass: "lock-pinned",
// // visibleInPanel: false,
// // suppressFillHandle: true,
// // cellRendererSelector: (params) => {
// // if (params.node.rowPinned) {
// // return () => null;
// // } else {
// // return { component: deleteComponent };
// // }
// // },
// // },
// // ]
// []
// );
const [columnsToDisplay, setColumnsToDisplay] = (0, react_1.useState)([]);
const inputText = (row, field) => {
return ((0, jsx_runtime_1.jsx)("div", Object.assign({ title: row[field], className: "overflow-hidden white-space-nowrap text-overflow-ellipsis max-w-16rem text-base line-heignt-3" }, { children: (0, jsx_runtime_1.jsx)(inputtext_1.InputText, { value: row[field], onChange: (e) => setRowData3((prev) => [
...prev.map((x) => {
if (x.id === row.id) {
return Object.assign(Object.assign({}, x), { name: e.target.value });
}
return x;
}),
]) }) })));
};
const commonFieldsTemplate = (row, field) => {
return ((0, jsx_runtime_1.jsx)("div", Object.assign({ title: row[field], className: "overflow-hidden white-space-nowrap text-overflow-ellipsis max-w-16rem text-base line-heignt-3" }, { children: row[field] ? row[field] : "--" })));
};
// const statusData = () => {
// return (
// <>
// <p>{"cell renderer"}</p>
// </>
// );
// };
const DeleteRow = (params) => {
console.log(params, "params in delete");
return (0, jsx_runtime_1.jsx)("p", Object.assign({ onClick: () => deleteRow(params) }, { children: "delete" }));
};
const AddRow = (params) => {
return (0, jsx_runtime_1.jsx)("p", Object.assign({ onClick: () => addRow(params) }, { children: "Add" }));
};
const deleteRow = (params) => {
const { node } = params;
const api = params === null || params === void 0 ? void 0 : params.api;
api.applyTransaction({ remove: [node.data] });
};
const addRow = (params) => {
const api = params.api;
const newRow = { id: "101", status: 3, name: "New Product" };
api.applyTransaction({ add: [newRow] });
};
const fillDynamicColumns = () => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
const result = yield axios_1.default.get("https://paymentconfig_queriesapi.easyfastnow.com/api/grid/get-meta-data?screenId=1&viewId=1");
const options = { data: { response: { data: [] } } };
let x = result.data.response.columns.map((col, index) => {
let obj = {
headerName: col.fieldDisplayName,
suppressMovable: true,
enableHeaderCheckbox: col.enableHeaderCheckbox,
enableChildCheckbox: col.enableChildCheckbox,
hide: col.fieldName === "status" ? false : col.hide,
isFilterable: col.isFilterable,
isSortable: col.isSortable,
field: col.fieldName,
filter: true,
visibleInPanel: true,
dataType: col.datatype,
id: index + index,
seq: index,
grouping: index === 0,
attributeType: col.isCustomAttribute ? 2 : 1,
cellRenderer: (data) => ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: data.data ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: col.fieldName === "name" ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: inputText(data.data, col.fieldName) })) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: commonFieldsTemplate(data.data, col.fieldName) })) })) : ("") })),
// cellRenderer: statusData,
};
if (col.isCustomAttribute) {
obj = Object.assign(Object.assign({}, obj), { visibleInPanel: true, field: col.fieldID, isFilterable: true });
}
if (col.pinned) {
obj = Object.assign(Object.assign({}, obj), { pinned: "left", lockPosition: "left", cellClass: "lock-pinned", minWidth: 350 });
}
if (col.datatype === 14 || col.datatype === 12) {
obj["options"] = [
{ id: 1, label: "Draft", value: "DRAFT" },
{ id: 2, label: "Active", value: "Active" },
{ id: 3, label: "Inactive", value: "Inactive" },
];
}
return obj;
});
options.data.response.data
.filter((x) => !x.isMerged)
.map((option) => {
let obj = {
headerName: option.name,
suppressMovable: true,
enableHeaderCheckbox: false,
enableChildCheckbox: false,
hide: true,
isFilterable: true,
isSortable: false,
field: option.id,
dataType: 14,
visibleInPanel: false,
attributeType: 3,
options: option.optionValues
? option.optionValues.map((option1) => (Object.assign(Object.assign({}, option1), { label: option1.name, value: option1.id, minWidth: 200 })))
: [],
};
x.push(obj);
return obj;
});
const deleteColumn = {
cellRenderer: DeleteRow,
};
const addColumn = {
cellRenderer: AddRow,
};
x.splice(3, x.length - 1);
x.push(deleteColumn);
x.push(addColumn);
setColumnsToDisplay(x);
});
const [rowData3, setRowData3] = (0, react_1.useState)([]);
const fetchData = () => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
var _a, _b;
const result = yield axios_1.default.post("https://paymentconfig_queriesapi.easyfastnow.com/api/grid/get-data", {
pageIndex: 1,
pageSize: 100,
screenId: 1,
});
console.log("resulttt in ag grid", result);
const treeData = (_b = (_a = result === null || result === void 0 ? void 0 : result.data) === null || _a === void 0 ? void 0 : _a.response) === null || _b === void 0 ? void 0 : _b.map((row, idx) => {
// row.orgHierarchy = [row.id]
if (idx < 4) {
row.orgHierarchy = [row.id];
}
else {
row.orgHierarchy = [row.id];
}
return row;
});
setRowData3(treeData);
});
(0, react_1.useEffect)(() => {
fetchData();
fillDynamicColumns();
}, []);
const noRowsOverlayComponent = () => {
// const displayedRowCount = getGridRef?.current!.api?.getDisplayedRowCount();
// const text = getGridRef?.current!.api?.getQuickFilter();
return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("p", { children: "No Rows, message from products" }) }));
};
console.log(rowData3, "rowdara");
const updateCell = (selectedRowsToUpdate) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
console.log(selectedRowsToUpdate, "selected rows to update");
setRowData(rowData);
setStoreResult(rowData);
const output = {
isSuccess: true,
};
return output;
});
// const [selectedCity, setSelectedCity] = useState(null);
const pinnedTopRowData = (0, react_1.useMemo)(() => {
return [{ id: "1", name: "nitesh", body: "working out" }];
}, []);
// Update columns based on hide panel
const updateColumns = (updatedColumns) => {
console.log(updatedColumns, "updated columns in products");
setColumnsToDisplay(updatedColumns.columns);
};
console.log(setColumnsToDisplay);
// Remove items from - button
// const removeItem = (checkboxSelectionDetails) => {
// const unSelectedData = checkboxSelectionDetails?.excludedRecords;
// const selectedData = checkboxSelectionDetails?.includedRecords;
// const isIternminite = checkboxSelectionDetails?.isIndeterminate;
// console.log(checkboxSelectionDetails, "coming in remove item products");
// let updatedRowData = [];
// if (isIternminite) {
// updatedRowData = unSelectedData;
// } else if (selectedData?.length && !isIternminite) {
// const childIds = new Set(selectedData?.map((child) => child.id));
// updatedRowData = rowData.filter((parent) => !childIds.has(parent.id));
// }
// console.log(updatedRowData, "result data from remove items in products");
// return updatedRowData;
// };
const getCheckedRows = (checkedRows) => {
console.log(checkedRows, "checked rows in products");
};
// const updateForFillOperation =(fillSelected)=>{
// console.log('store row data in update fill',storeResult,fillSelected)
// const updatedResult = JSON.parse(JSON.stringify(storeResult.rowData))?.map((item)=>{
// fillSelected.childRows?.filter((fillItem)=>{
// console.log(item.id ,fillItem.id)
// if(item.id===fillItem.id){
// console.log('coming in satisfied item')
// console.log(item[fillSelected.column.field],fillItem[fillSelected.column.field],'field in item and fill item')
// item[fillSelected.column.field] = fillSelected.parentRow[fillSelected.column.field]
// }
// })
// return item
// })
// const newOutput = {
// rowData : updatedResult,
// totalRecords:storeResult.totalRecords
// }
// console.log(updatedResult,'updated result on fill')
// return newOutput
// // const updatedRowData = storeResult.rowData.map
// }
// const SaveEdit = (params) => {
// console.log(params, "params in save edit");
// console.log(editedRecords, "edited records in page");
// const saveChanges = () => {
// setEmptyCheckboxStatus(true);
// console.log("changes saved", editedRecords);
// setColumnsToDisplay(columnDefs);
// setShouldRefetch(true);
// setEditMode(false);
// setConditionsToDisplay(initialConditions);
// };
// return (
// <button
// disabled={!editedRecords.length}
// onClick={saveChanges}
// className="bg-white"
// >
// Save Changes
// </button>
// );
// };
// Discard component for bulk edit
// const DiscardEdit = () => {
// const discard = () => {
// setColumnsToDisplay(columnDefs);
// setShouldRefetch(true);
// setEditMode(false);
// setConditionsToDisplay(initialConditions);
// };
// return (
// <div>
// <p onClick={discard}>Discard</p>
// </div>
// );
// };
// Edit headeing details
// const EditHeadingDetails = () => {
// return (
// <div>
// <p>Bulk Edit 4 products 4 variants</p>
// </div>
// );
// };
// Bulk edit component
const BulkEdit = () => {
const updateColumns = () => {
const tempColumns = [...columnsToDisplay].filter((column) => column.isEditable);
console.log(tempColumns, "temp columsn");
setColumnsToDisplay(tempColumns);
setShouldRefetch(true);
// setEditMode(true);
const tempConditions = conditionsToDisplay;
tempConditions.displayFilter = type_1.VisibilityState.ENABLE;
tempConditions.displaySort = type_1.VisibilityState.DISABLE;
tempConditions.displayBulkAction = type_1.VisibilityState.HIDE;
tempConditions.enableFillHandle = true;
tempConditions.displayDiscardEdit = true;
tempConditions.displayRefresh = type_1.VisibilityState.DISABLE;
tempConditions.displayRemoveItems = type_1.VisibilityState.DISABLE;
tempConditions.displayBulkEdit = type_1.VisibilityState.DISABLE;
tempConditions.displaySaveEditButton = true;
tempConditions.displayEditHeading = type_1.VisibilityState.ENABLE;
setConditionsToDisplay(tempConditions);
};
return ((0, jsx_runtime_1.jsx)("div", Object.assign({ onClick: updateColumns, className: "disabled" }, { children: (0, jsx_runtime_1.jsx)(svg_component_1.default, { icon: "edit-02", color: "text-gray-500" }) })));
};
// const getRowData = async (startRow, endRow, featureDetails, params?: any) => {
// const getRowData = async () => {
// console.log("called");
// // const dummyRecordForGroup = [
// // {name:"nitesh",rank:1,id:"01"},
// // {name:"pawan",rank:1,id:"02"},
// // {name:"harish",rank:2,id:"03"},
// // {name:"nitesh",rank:3,id:"04"},
// // {name:"nitesh",rank:2,id:"05"},
// // {name:"nitesh",rank:3,id:"06"},
// // {name:"nitesh",rank:3,id:"07"},
// // {name:"nitesh",rank:3,id:"08"},
// // ]
// // console.log(params, "params in page");
// // console.log(featureDetails, "feature details in page for filter queries");
// // if(featureDetails?.fillSelected?.childRows?.length){
// // return updateForFillOperation(featureDetails.fillSelected)
// // }
// // const features: Features = featureDetails;
// // const conditionToRemoveItem = features.checkBoxSelection.allBoxChecked || features.checkBoxSelection.isIndeterminate || features.checkBoxSelection.includedRecords.length || features.checkBoxSelection.excludedRecords.length
// // if (featureDetails.isRemoveClicked) {
// // const result = removeItem(features.checkBoxSelection);
// // const output = {
// // totalRecords: result.length,
// // rowData: result,
// // };
// // return await output;
// // }
// // let totalRecords = 500;
// // const serverSideUrl = `https://jsonplaceholder.typicode.com/comments?_start=${startRow}&_end=${endRow}`;
// // const clientSideUrl = "https://jsonplaceholder.typicode.com/comments?_limit=200";
// // console.log(serverSideUrl, clientSideUrl);
// // const { startRow, featureDetails } = payload
// // const stringWithoutZeros = String(startRow).replace(/00/g, '');
// // const numberWithoutZeros = parseInt(stringWithoutZeros) + 1
// // const requestObject: any = { pageIndex: numberWithoutZeros, pageSize: 100 }
// // debugger
// // // Add sort info if given any by gird component
// // if (featureDetails?.sort?.isSortable) {
// // const sortInfo = featureDetails?.sort
// // requestObject.sortOrder = {
// // direction: sortInfo?.orderToSort?.sortId,
// // propertyName: sortInfo?.columnToSort?.field
// // }
// // }
// // // Add search info if given any by gird component
// // if (featureDetails?.searchedText?.length) {
// // requestObject.searchString = featureDetails?.searchedText
// // }
// // // Add filter info if given any by gird component
// // const filterFromGrid = featureDetails?.filterQueries ?? [];
// // if (filterFromGrid.length > 0) {
// // const requestFilters: any[] = filterFromGrid.map((element: any) => ({
// // fieldName: element?.selectedColumn?.code,
// // fieldValue: element?.value.toString(),
// // conditionalOperator: element?.selectedOperation,
// // logicalOperator: element.logicalOperator
// // }));
// // requestObject.filters = requestFilters;
// // }
// const result: any = await axios.post(
// "https://productservice.easyfastnow.com/products/search",
// {}
// );
// console.log("resulttt in ag grid", result);
// const treeData = result?.data?.response?.data?.map((row, idx) => {
// // row.orgHierarchy = [row.id]
// if (idx < 4) {
// row.orgHierarchy = [row.id];
// } else {
// row.orgHierarchy = [row.id];
// }
// return row;
// });
// console.log(result, treeData, "row data api call");
// // debugger
// // Enable row group local server
// // const grouping = false;
// // const outputData = result?.data
// // .map((item, idx) => {
// // if (idx == 2 || idx == 3) {
// // item.type = 2
// // item.price = "--"
// // } else {
// // item.type = 1
// // item.status = 3
// // item.price = 500;
// // }
// // delete item.postId;
// // return item;
// // });
// // const dummyData = [
// // {status:3,name:"product 1", id:1},
// // {status:4,name:"product 2", id:2},
// // {status:5,name:"product 3", id:3},
// // {status:2,name:"product 4", id:4},
// // {status:1,name:"product 5", id:5},
// // {status:3,name:"product 6", id:6},
// // ]
// // const dummy = treeData.map((item, index) => {
// // return {
// // ...item,
// // status:index % 2 == 0 ? "--" : item.status
// // };
// // });
// const dummy = treeData.splice(0, 6);
// console.log(dummy);
// let output = {
// totalRecords: dummy,
// rowData: dummy,
// };
// // Performs when grouping is present
// // if (grouping) {
// // const result: any = await axios.get(serverSideUrl);
// // result?.data.map((item) => {
// // item.status = "Active";
// // return item;
// // });
// // let fakeServer = FakeServer(result.data, ["status"]);
// // const groupingResponse = fakeServer.getData(params);
// // console.log(groupingResponse, 'grouping response')
// // const lastRow =
// // params.groupKeys?.length == 0
// // ? groupingResponse?.lastRow
// // : totalRecords;
// // output.rowData = groupingResponse.rows;
// // output.totalRecords = lastRow;
// // }
// setStoreResult(output);
// setRowData(result.data);
// setShouldRefetch(false);
// setShouldClearFilters(false);
// return output;
// };
const style = {
height: "100vh",
width: "100%",
};
console.log(pinnedTopRowData, defaultFilters);
// const createView = (viewDetails) => {
// console.log(viewDetails, "parsed value for create view");
// };
console.log(storeResult, "sotred result");
const selectFilter = () => {
var _a;
(_a = getGridRef.current.api) === null || _a === void 0 ? void 0 : _a.showAdvancedFilterBuilder();
// const defaultFilters = [
// {
// columnName: {
// name: "Body",
// code: "body",
// dataType: "string",
// },
// condition: 5, // Convert to type number
// value: "data", // type can be anything
// id: "0.028544677566825438", // "string"
// isActive: true, // boolean
// logicalOperator: 1, // number
// },
// ];
// setShouldRefetch(true);
// setDefaultFilters(defaultFilters);
// setRowData3([...rowData3.slice(1)]);
};
// const dynamicText = {
// filterModelText: {
// header: "Filter",
// subHeader: "Streamline Your Search With Filters",
// resetFilterAction: "Reset Filter",
// createViewInputPlaceHolder: "Enter",
// createViewAction: "Create View",
// applyAction: "Apply",
// elementOnePlaceHolder: "Select",
// elementTwoPlaceHolder: "Select",
// elementThreePlaceHolder_Input: "Enter Text",
// elementThreePlaceHolder_Input_Number: "Enter Number",
// elementThreePlaceHolder_DropDown: "Select",
// elementThreePlaceHolder_MultiSelect: "Select",
// elementThreePlaceHolder_Calender: "Select Date",
// onSelectedFilter: "Selected",
// },
// sortModelText: {
// header: "Column Sorting",
// clearAction: "Clear",
// applyAction: "Apply",
// onSelectedSort: "Selected",
// },
// recordDetailModelText: {
// totalRecordHeader: "Total Records",
// },
// sidePanelText: {
// header: "Configure Columns",
// disacrd_button: "Discard",
// update_button: "Update",
// apply_to_all_views: "Apply to all views",
// apply_subHeading:
// "Apply the chosen column selection to all available views",
// search_placeHolder: "Search by column name",
// selected_attributes: "Selected Attributes",
// unselected_attributes: "Unselected Attributes",
// },
// bulkEditAction: {
// discard: "Discard",
// save: "Save Changes",
// },
// };
// const GroupHeaderComponent = (params) =>{
// console.log(params)
// return <><p>Group Header</p> </>
// }
// const getGroupedColumnsWithOrder = (params) => {
// // Get all row group columns in the order they are grouped
// const rowGroupColumns = params?.api?.getRowGroupColumns() || [];
// // Extract column details including ID and field
// const groupedColumnsInOrder = rowGroupColumns.map((col) => ({
// field: col.getColDef().headerName,
// }));
// console.log("Grouped Columns in Order:", rowGroupColumns);
// return groupedColumnsInOrder;
// };
// const GroupHeaderName = (props) => {
// const { params } = props;
// // const level = params.node.level;
// const groupId = params.node.key; // The unique key for the current group
// const parentGroupId = params?.node?.key; // The unique key for the parent group, if available
// // Get the grouped columns with their details
// const columnsSelectedForGroup = getGroupedColumnsWithOrder(params);
// // Custom names for groups and subgroups
// const customNames = {
// group1: `GROUP BY - ${columnsSelectedForGroup[0]?.field?.toUpperCase()} : ${groupId}`,
// group2: `${columnsSelectedForGroup[1]?.field?.toUpperCase()} BY ${parentGroupId}`,
// };
// // Determine the group name based on the level
// // const groupName = params?.node?.level === 0 ? customNames.group1 : customNames.group2;
// return (
// <>
// {params?.node?.level === 0 && customNames.group1}
// {params?.node?.level === 1 && customNames.group2}
// </>
// );
// };
// Store ref and update grid
// const getGridRef = (gridRef) => {
// console.log(gridRef, "grid ref in products");
// const newRow = { name: "nitesh", id: "101", status: "199" };
// console.log(newRow);
// if (gridRef?.current) {
// // gridRef.current?.api?.applyTransaction({ add: [newRow] })
// }
// };
const ChildComponentForGroup = () => {
return (0, jsx_runtime_1.jsx)("p", { children: "hhhh" });
};
const GroupHeaderComponent = () => {
return (0, jsx_runtime_1.jsx)("h3", { children: "MODULES" });
};
const RowGroupHeaderComponent = () => {
return (0, jsx_runtime_1.jsx)("span", { children: "ttt" });
};
const getGridRef = (0, react_1.useRef)(null);
const loadingOverlayComponentParams = (0, react_1.useMemo)(() => {
return { loadingMessage: "One moment please..." };
}, []);
return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("button", Object.assign({ onClick: selectFilter }, { children: "Select Filter" })), (0, jsx_runtime_1.jsx)("button", Object.assign({ onClick: () => setShouldClearFilters(true) }, { children: "clear filter" })), columnsToDisplay.length > 0 && ((0, jsx_runtime_1.jsx)(parent_for_grid_1.default, { columnData: columnsToDisplay, style: style,
// getRowData={getRowData}
rowData: treeData, conditionsToDisplay: conditionsToDisplay, rowModelType: constants_1.ROWMODELTYPE.CLIENT_SIDE, pinnedTopRowData: pinnedTopRowData, bulkActionComponent: BulkAction_1.default, getCheckedRows: getCheckedRows, shouldRefetch: shouldRefetch, noRowsOverlayComponent: noRowsOverlayComponent, enableManageColumnsCallback: true, clearFilters: shouldClearFilters, updateColumnsForGrid: updateColumns, updateCell: updateCell, BulkEditComponent: BulkEdit, getGridRef: getGridRef, enableAdvancedFilter: false, ChildComponentForGroup: ChildComponentForGroup, displayRowGroupingElement: true, GroupHeaderComponent: GroupHeaderComponent, rowGroupColumnWidth: 200, displayCheckboxForGroups: true, displayCheckboxForGroupChild: false, displayCheckboxOnRight: false, rowGroupHeaderComponent: RowGroupHeaderComponent, enableCheckboxForGroupHeader: false, enableChildCheckbox: false, enableHeaderCheckbox: false, onRowClicked: (data) => {
console.log(data, "data");
}, loadingOverlayComponentParams: loadingOverlayComponentParams }))] }));
};
exports.default = AgGridPage;