Datatable pagination ok

src/views/settings/projects/TableServerSide.js

@@ -31,22 +31,22 @@ const DataTableServerSide = () => {
   useEffect(() => {
     dispatch(
       getData_projects({
-        page: currentPage,
-        perPage: rowsPerPage,
+        start: (currentPage - 1) * rowsPerPage,
+        length: rowsPerPage,
         q: searchValue
       })
     )
   }, [dispatch])
 
   // ** Function to handle filter
-  const handleFilter = e => {
-    setSearchValue(e.target.value)
+  const handleFilter = value => {
+    setSearchValue(value)
 
     dispatch(
       getData_projects({
-        page: currentPage,
-        perPage: rowsPerPage,
-        q: e.target.value
+        start: (currentPage - 1) * rowsPerPage,
+        length: rowsPerPage,
+        q: value
       })
     )
   }
@@ -56,8 +56,9 @@ const DataTableServerSide = () => {
   const handlePagination = page => {
     dispatch(
       getData_projects({
+        start: (page.selected) * rowsPerPage,
         page: page.selected + 1,
-        perPage: rowsPerPage,
+        length: rowsPerPage,
         q: searchValue
       })
     )
@@ -68,8 +69,8 @@ const DataTableServerSide = () => {
   const handlePerPage = e => {
     dispatch(
       getData_projects({
-        page: currentPage,
-        perPage: parseInt(e.target.value),
+        start: 0,
+        length: parseInt(e.target.value),
         q: searchValue
       })
     )
@@ -78,8 +79,7 @@ const DataTableServerSide = () => {
 
   // ** Custom Pagination
   const CustomPagination = () => {
-    const count = Number((store.total / rowsPerPage).toFixed(0))
-
+    const count = Number((store.totalProjects / rowsPerPage).toFixed(0))
     return (
       <ReactPaginate
         previousLabel={''}
@@ -119,14 +119,15 @@ const DataTableServerSide = () => {
       return filters[k].length > 0
     })
     console.log(store)
-    return store.allDataProjects.slice(0, rowsPerPage)
-    // if (store.data.length > 0) {
-    //   return store.data
-    // } else if (store.data.length === 0 && isFiltered) {
-    //   return []
-    // } else {
-    //   return store.allData.slice(0, rowsPerPage)
-    // }
+    console.log(store.allDataProjects)
+    
+    if (store.allDataProjects.length > 0) {
+      return store.allDataProjects
+    } else if (store.allDataProjects.length === 0 && isFiltered) {
+      return []
+    } else {
+      return store.allDataProjects.slice(0, rowsPerPage)
+    }
   }
 
   return (

src/views/settings/store/actions/index.js

@@ -40,14 +40,15 @@ export const setErrorMsg = params => {
 
 // ** Get table Data ///api/datatables/data
 export const getData_projects = params => {
+  console.log(params)
   return async dispatch => { 
-    await axios.get(`${process.env.REACT_APP_API}/api/projects`, params
+    await axios.get(`${process.env.REACT_APP_API}/api/projects`, {params}
     ).then(response => {
       dispatch({
         type: 'GET_DATA_PROJECTS', 
-        allData: response.data.allData,
+        allData: response.data.data,
         // dataProjects: response.data.invoices,
-        totalPages: response.data.total, 
+        totalPages: response.data.recordsTotal, 
         params: response.data.params
       })
     })