@visns-studio/visns-components 2.5.14 → 2.5.16

package/components/crm/DataGrid.jsx

@@ -153,7 +153,6 @@ const DataGrid = forwardRef(
         const data = useCallback(
             (params) => {
                 const sqlResult = loadData(params, dSearch, ajaxSetting);
-
                 if (setFilterData && params.filterValue) {
                     setFilterData(params.filterValue);
                 }
@@ -172,6 +171,7 @@ const DataGrid = forwardRef(
         const [filterDataSource, setFilterDataSource] = useState([]);
         const [filterValue, setFilterValue] = useState([]);
         const [gridColumns, setGridColumns] = useState([]);
+        const gridRef = useRef(null);
         const [limit, setLimit] = useState(0);
         const [search, setSearch] = useState('');
         const [selected, setSelected] = useState({});
@@ -183,9 +183,18 @@ const DataGrid = forwardRef(
             },
         }));
 
-        const handleSelectionChnage = useCallback(({ selected }) => {
-            console.info(selected, data);
-            setSelected(selected);
+        const handleSelectionChange = useCallback((param) => {
+            if (param.selected === true) {
+                const s = {};
+
+                param.data.forEach((obj) => {
+                    s[obj.id] = obj;
+                });
+
+                setSelected(s);
+            } else {
+                setSelected(param.selected);
+            }
         }, []);
 
         const handleFilterChange = useCallback((d) => {
@@ -572,7 +581,9 @@ const DataGrid = forwardRef(
 
         /** Table Hooks */
         useEffect(() => {
-            setRowsSelected(selected);
+            if (setRowsSelected) {
+                setRowsSelected(selected);
+            }
         }, [selected]);
 
         useEffect(() => {
@@ -1888,16 +1899,17 @@ const DataGrid = forwardRef(
                             limit={limit}
                             enableColumnAutosize={false}
                             enableColumnFilterContextMenu={false}
-                            enableSelection={true}
+                            handle={(ref) =>
+                                (gridRef.current = ref ? ref.current : null)
+                            }
                             headerProps={headerProps}
                             idProperty="id"
                             minRowHeight={40}
-                            multiSelect={true}
                             onFilterValueChange={(filterValue) => {
                                 handleFilterChange(filterValue);
                             }}
                             onLimitChange={setLimit}
-                            onSelectionChange={handleSelectionChnage}
+                            onSelectionChange={handleSelectionChange}
                             onSortInfoChange={handleSort}
                             onRenderRow={onRenderRow}
                             pagination

package/components/crm/generic/GenericIndex.jsx

@@ -1,6 +1,7 @@
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import { Outlet } from 'react-router-dom';
 import { toast } from 'react-toastify';
+import CustomFetch from '../Fetch';
 import Table from '../DataGrid';
 import TableFilter from '../TableFilter';
 
@@ -16,6 +17,7 @@ function GenericIndex({ layout = 'full', setting, userProfile }) {
         tableSetting,
         tabs,
     } = setting;
+    const gridRef = useRef(null);
 
     const [config, setConfig] = useState({});
     const [rowsSelected, setRowsSelected] = useState({});
@@ -28,16 +30,30 @@ function GenericIndex({ layout = 'full', setting, userProfile }) {
         return Object.keys(obj).length === 0;
     };
 
-    const handleCheckboxUpdate = (e) => {
-        e.preventDefault();
-        const message = functions.checkboxUpdate.message;
-
-        console.info(isObjectEmpty(rowsSelected), rowsSelected);
-
-        if (isObjectEmpty(rowsSelected)) {
-            toast.warning(message.warning);
-        } else {
-            console.info(rowsSelected);
+    const handleCheckboxUpdate = async (e) => {
+        try {
+            e.preventDefault();
+            const { data, method, message, url } = functions.checkboxUpdate;
+
+            if (isObjectEmpty(rowsSelected)) {
+                toast.warning(message.warning);
+            } else {
+                const res = await CustomFetch(url, method, {
+                    ...data,
+                    rows: rowsSelected,
+                });
+
+                console.info(res);
+
+                if (res.data.error === '') {
+                    toast.success(message.success);
+                    gridRef.current.reload();
+                } else {
+                    toast.error(message.error);
+                }
+            }
+        } catch (error) {
+            console.error(error);
         }
     };
 
@@ -126,6 +142,7 @@ function GenericIndex({ layout = 'full', setting, userProfile }) {
                                         <div className={`grid__subcontent`}>
                                             <Table
                                                 {...config}
+                                                ref={gridRef}
                                                 gridHeight={windowHeight * 0.65}
                                                 setConfig={setConfig}
                                                 setTotal={setTotal}
@@ -150,6 +167,7 @@ function GenericIndex({ layout = 'full', setting, userProfile }) {
                                             <div className={`tabcontent__main`}>
                                                 <Table
                                                     {...config}
+                                                    ref={gridRef}
                                                     gridHeight={
                                                         windowHeight * 0.65
                                                     }
@@ -169,6 +187,7 @@ function GenericIndex({ layout = 'full', setting, userProfile }) {
                             <div className="grid__full">
                                 <Table
                                     {...config}
+                                    ref={gridRef}
                                     gridHeight={windowHeight * 0.65}
                                     setConfig={setConfig}
                                     setTotal={setTotal}

package/package.json

@@ -42,7 +42,7 @@
         "react-dom": "^17.0.1"
     },
     "name": "@visns-studio/visns-components",
-    "version": "2.5.14",
+    "version": "2.5.16",
     "description": "Various packages to assist in the development of our Custom Applications.",
     "main": "index.js",
     "scripts": {