fixing bug

This commit is contained in:
Sibunnayak 2024-10-18 12:54:42 +05:30
parent f758cfe1ba
commit abc4feee63
6 changed files with 1199 additions and 0 deletions

View File

@ -118,6 +118,13 @@ const _nav = [
to: "/leaves/today",
group: "Leaves",
},
{
component: CNavItem,
name: "Tasks",
icon: <CIcon icon={cilAlarm} customClassName="nav-icon" />,
to: "/task/today",
group: "Tasks",
},
{
component: CNavItem,
name: "Inventory Data",

View File

@ -161,6 +161,7 @@ import AddMultipletm from "./views/TerritoryManager/AddMultipleTM";
import AddMultiplesc from "./views/SalesCoOrdinators/AddMultipleSC";
import Announcements from "./views/Announcment/announcement";
import CreateAnnouncement from "./views/Announcment/createAnnouncement";
import TodayTask from "./views/Tasks/TodayTasks";
const routes = [
//dashboard
@ -363,6 +364,13 @@ const routes = [
element: SingleUserleave,
navName: "Leaves",
},
//Tasks
{
path: "/task/today",
name: "Today's Tasks",
element: TodayTask,
navName: "Tasks",
},
// RetailDistributor
{
path: "/retail-distributor",

View File

@ -0,0 +1,256 @@
import React, { useState, useEffect } from "react";
import { useParams, useNavigate } from "react-router-dom";
import axios from "axios";
import Button from "@material-ui/core/Button";
import { isAutheticated } from "src/auth";
import swal from "sweetalert";
const SingleUserleave = () => {
const { id } = useParams();
const token = isAutheticated();
const navigate = useNavigate();
const [loading, setLoading] = useState(false);
const [user, setuser] = useState({});
const [leaveData, setleaveData] = useState([]);
const [currentPage, setCurrentPage] = useState(1);
const [itemPerPage, setItemPerPage] = useState(10);
const [totalData, setTotalData] = useState(0);
const [userType, setUserType] = useState("");
const getSingleuserleave = async () => {
setLoading(true);
try {
const res = await axios.get(`/api/v1/leave/${id}`, {
headers: {
Authorization: `Bearer ${token}`,
},
params: {
page: currentPage,
show: itemPerPage,
},
});
setuser(res.data?.user);
setleaveData(res.data?.leave);
setUserType(res.data?.userType);
// console.log(res.data);
setTotalData(res.data?.total_data);
} catch (err) {
const msg = err?.response?.data?.message || "Something went wrong!";
swal({
title: "Error",
text: msg,
icon: "error",
button: "Retry",
dangerMode: true,
});
} finally {
setLoading(false);
}
};
useEffect(() => {
getSingleuserleave();
}, [itemPerPage, currentPage]);
return (
<div className="main-content">
<div className="page-content">
<div className="container-fluid">
<div className="row">
<div className="col-12">
<div className="page-title-box d-flex align-items-center justify-content-between">
<div style={{ fontSize: "22px" }} className="fw-bold">
{userType === "SalesCoOrdinator"?"Sales Coordinator":"Territory Manager"} Leave
<div style={{ fontSize: "16px", marginTop: "5px" }}>
{user.name} ({user.email})
</div>
</div>
<div className="page-title-right">
<Button
variant="contained"
color="primary"
style={{
fontWeight: "bold",
marginBottom: "1rem",
textTransform: "capitalize",
}}
onClick={() => {
navigate("/leaves/today", {
replace: true,
});
}}
>
Cancel
</Button>
</div>
</div>
</div>
</div>
<div className="row">
<div className="col-lg-12">
<div className="card">
<div className="card-body">
<div className="row ml-0 mr-0 mb-10">
<div className="col-lg-1">
<div className="dataTables_length">
<label className="w-100">
Show
<select
onChange={(e) => {
setItemPerPage(e.target.value);
setCurrentPage(1);
}}
className="form-control"
disabled={loading}
>
<option value="10">10</option>
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
entries
</label>
</div>
</div>
</div>
<div className="table-responsive table-shoot mt-3">
<table className="table table-centered table-nowrap">
<thead
className="thead-light"
style={{ background: "#ecdddd" }}
>
<tr>
<th className="text-start">Date</th>
<th className="text-start">Time</th>
<th className="text-start">Location</th>
<th className="text-start">Note</th>
</tr>
</thead>
<tbody>
{loading ? (
<tr>
<td className="text-center" colSpan="4">
Loading...
</td>
</tr>
) : leaveData?.length > 0 ? (
leaveData?.map((leave, i) => {
return (
<tr key={i}>
<td className="text-start">
{new Date(
leave?.date
).toLocaleDateString("en-IN", {
weekday: "short",
month: "short",
day: "numeric",
year: "numeric",
})}
</td>
<td className="text-start">
{leave?.time || (
<small className="m-0 text-secondary">
No Time Added!
</small>
)}
</td>
<td className="text-start">
{leave?.location || (
<small className="m-0 text-secondary">
No Location Added!
</small>
)}
</td>
<td className="text-start">
{leave?.notes || (
<small className="m-0 text-secondary">
No Note Added!
</small>
)}
</td>
</tr>
);
})
) : (
<tr className="text-center">
<td colSpan="4">
<h5>No leave Records Available...</h5>
</td>
</tr>
)}
</tbody>
</table>
</div>
<div className="row mt-20">
<div className="col-sm-12 col-md-6 mb-20">
<div
className="dataTables_info"
id="datatable_info"
role="status"
aria-live="polite"
>
Showing {currentPage * itemPerPage - itemPerPage + 1} to{" "}
{Math.min(currentPage * itemPerPage, totalData)} of{" "}
{totalData} entries
</div>
</div>
<div className="col-sm-12 col-md-6">
<div className="d-flex">
<ul className="pagination ms-auto">
<li
className={
currentPage === 1
? "paginate_button page-item previous disabled"
: "paginate_button page-item previous"
}
>
<span
className="page-link"
onClick={() =>
setCurrentPage((prev) =>
prev > 1 ? prev - 1 : prev
)
}
>
Previous
</span>
</li>
<li
className={
currentPage * itemPerPage >= totalData
? "paginate_button page-item next disabled"
: "paginate_button page-item next"
}
>
<span
className="page-link"
onClick={() =>
setCurrentPage((prev) =>
prev * itemPerPage < totalData
? prev + 1
: prev
)
}
>
Next
</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
);
};
export default SingleUserleave;

View File

@ -0,0 +1,318 @@
import React, { useState, useEffect, useRef,useCallback } from "react";
import { Link } from "react-router-dom";
import axios from "axios";
import Button from "@material-ui/core/Button";
import { useNavigate } from "react-router-dom";
import { isAutheticated } from "src/auth";
import swal from "sweetalert";
import debounce from 'lodash.debounce';
const LeaveSalesCoordinator = () => {
const token = isAutheticated();
const navigate = useNavigate();
const [loading, setLoading] = useState(false);
const [salescoordinatorsData, setSalesCoOrdinatorsData] = useState([]);
const nameRef = useRef();
const mobileRef = useRef();
const verifyRef = useRef();
const [currentPage, setCurrentPage] = useState(1);
const [itemPerPage, setItemPerPage] = useState(10);
const [totalData, setTotalData] = useState(0);
const getSalesCoOrdinatorsData = async () => {
setLoading(true);
try {
const res = await axios.get(`/api/salescoordinator/getAll/`, {
headers: {
Authorization: `Bearer ${token}`,
},
params: {
page: currentPage,
show: itemPerPage,
name: nameRef.current.value,
mobileNumber: mobileRef.current.value,
isVerified: verifyRef.current.value,
},
});
setSalesCoOrdinatorsData(res.data?.salesCoOrinators);
setTotalData(res.data?.total_data);
} catch (err) {
const msg = err?.response?.data?.message || "Something went wrong!";
swal({
title: "Error",
text: msg,
icon: "error",
button: "Retry",
dangerMode: true,
});
} finally {
setLoading(false);
}
};
useEffect(() => {
getSalesCoOrdinatorsData();
}, [currentPage, itemPerPage]);
const debouncedSearch = useCallback(debounce(() => {
setCurrentPage(1);
getSalesCoOrdinatorsData();
}, 500), []);
const handleSearchChange = () => {
debouncedSearch();
};
return (
<div className="main-content">
<div className="page-content">
<div className="container-fluid">
<div className="row">
<div className="col-12">
<div className="page-title-box d-flex align-items-center justify-content-between">
<div style={{ fontSize: "22px" }} className="fw-bold">
Sales Coordinators Leaves
</div>
<div className="page-title-right">
<Button
variant="contained"
color="secondary"
style={{
fontWeight: "bold",
marginBottom: "1rem",
textTransform: "capitalize",
}}
onClick={() => {
navigate("/leaves/today", { replace: true });
}}
>
Cancel
</Button>
</div>
</div>
</div>
</div>
<div className="row">
<div className="col-lg-12">
<div className="card">
<div className="card-body">
<div className="row ml-0 mr-0 mb-10">
<div className="col-lg-1">
<div className="dataTables_length">
<label className="w-100">
Show
<select
onChange={(e) => {
setItemPerPage(Number(e.target.value));
setCurrentPage(1);
}}
className="form-control"
disabled={loading}
>
<option value="10">10</option>
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
entries
</label>
</div>
</div>
<div className="col-lg-3">
<label>Sales Coordinator Name:</label>
<input
type="text"
placeholder="Sales Coordinator name"
className="form-control"
ref={nameRef}
onChange={handleSearchChange}
disabled={loading}
/>
</div>
<div className="col-lg-3">
<label>Mobile Number:</label>
<input
type="text"
placeholder="Mobile Number"
className="form-control"
ref={mobileRef}
onChange={handleSearchChange}
disabled={loading}
/>
</div>
<div className="col-lg-3">
<label>Filter by Verify:</label>
<select
className="form-control"
ref={verifyRef}
onChange={handleSearchChange}
disabled={loading}
>
<option value="">----Select----</option>
<option value="true">YES</option>
<option value="false">NO</option>
</select>
</div>
</div>
<div className="table-responsive table-shoot mt-3">
<table className="table table-centered table-nowrap">
<thead
className="thead-light"
style={{ background: "#ecdddd" }}
>
<tr>
<th className="text-start">Name</th>
<th className="text-start">Mobile No.</th>
<th className="text-start">Email</th>
<th className="text-start">Verify</th>
<th className="text-start">Register On</th>
<th className="text-start">Action</th>
</tr>
</thead>
<tbody>
{loading ? (
<tr>
<td className="text-center" colSpan="6">
Loading...
</td>
</tr>
) : salescoordinatorsData.length > 0 ? (
salescoordinatorsData.map((salescoordinator, i) => (
<tr key={i}>
<td className="text-start">
{salescoordinator?.name}
</td>
<td className="text-start">
{salescoordinator?.mobileNumber}
</td>
<td className="text-start">
{salescoordinator?.email || (
<small className="m-0 text-secondary">
No Email Added!
</small>
)}
</td>
<td className="text-start">
<span
className={`badge text-white ${
salescoordinator?.isVerified
? "text-bg-success"
: "text-bg-danger"
}`}
>
{salescoordinator?.isVerified ? "YES" : "NO"}
</span>
</td>
<td className="text-start">
{new Date(
salescoordinator.createdAt
).toLocaleString("en-IN", {
weekday: "short",
month: "short",
day: "numeric",
year: "numeric",
hour: "numeric",
minute: "numeric",
hour12: true,
})}
</td>
<td className="text-start">
<Link to={`/leave/view/${salescoordinator._id}`}>
<button
style={{
color: "white",
marginRight: "1rem",
}}
type="button"
className="btn btn-primary btn-sm waves-effect waves-light btn-table mt-1 mx-1"
>
View Leaves
</button>
</Link>
</td>
</tr>
))
) : (
<tr className="text-center">
<td colSpan="6">
<h5>No Sales Coordinators Available...</h5>
</td>
</tr>
)}
</tbody>
</table>
</div>
<div className="row mt-20">
<div className="col-sm-12 col-md-6 mb-20">
<div
className="dataTables_info"
id="datatable_info"
role="status"
aria-live="polite"
>
Showing {currentPage * itemPerPage - itemPerPage + 1} to{" "}
{Math.min(currentPage * itemPerPage, totalData)} of{" "}
{totalData} entries
</div>
</div>
<div className="col-sm-12 col-md-6">
<div className="d-flex">
<ul className="pagination ms-auto">
<li
className={
currentPage === 1
? "paginate_button page-item previous disabled"
: "paginate_button page-item previous"
}
>
<span
className="page-link"
onClick={() =>
setCurrentPage((prev) =>
prev > 1 ? prev - 1 : prev
)
}
>
Previous
</span>
</li>
<li
className={
currentPage * itemPerPage >= totalData
? "paginate_button page-item next disabled"
: "paginate_button page-item next"
}
>
<span
className="page-link"
onClick={() =>
setCurrentPage((prev) =>
prev * itemPerPage < totalData
? prev + 1
: prev
)
}
>
Next
</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
);
};
export default LeaveSalesCoordinator;

View File

@ -0,0 +1,318 @@
import React, { useState, useEffect, useRef,useCallback } from "react";
import { Link } from "react-router-dom";
import axios from "axios";
import Button from "@material-ui/core/Button";
import { useNavigate } from "react-router-dom";
import { isAutheticated } from "src/auth";
import swal from "sweetalert";
import debounce from 'lodash.debounce';
const LeaveTerritoryManager = () => {
const token = isAutheticated();
const navigate = useNavigate();
const [loading, setLoading] = useState(false);
const [territorymanagersData, setterritorymanagersData] = useState([]);
const nameRef = useRef();
const mobileRef = useRef();
const verifyRef = useRef();
const [currentPage, setCurrentPage] = useState(1);
const [itemPerPage, setItemPerPage] = useState(10);
const [totalData, setTotalData] = useState(0);
const getterritorymanagersData = async () => {
setLoading(true);
try {
const res = await axios.get(`/api/territorymanager/getAll/`, {
headers: {
Authorization: `Bearer ${token}`,
},
params: {
page: currentPage,
show: itemPerPage,
name: nameRef.current.value,
mobileNumber: mobileRef.current.value,
isVerified: verifyRef.current.value,
},
});
setterritorymanagersData(res.data?.territoryManager);
setTotalData(res.data?.total_data);
} catch (err) {
const msg = err?.response?.data?.message || "Something went wrong!";
swal({
title: "Error",
text: msg,
icon: "error",
button: "Retry",
dangerMode: true,
});
} finally {
setLoading(false);
}
};
useEffect(() => {
getterritorymanagersData();
}, [currentPage, itemPerPage]);
const debouncedSearch = useCallback(debounce(() => {
setCurrentPage(1);
getterritorymanagersData();
}, 500), []);
const handleSearchChange = () => {
debouncedSearch();
};
return (
<div className="main-content">
<div className="page-content">
<div className="container-fluid">
<div className="row">
<div className="col-12">
<div className="page-title-box d-flex align-items-center justify-content-between">
<div style={{ fontSize: "22px" }} className="fw-bold">
Territory Managers Leaves
</div>
<div className="page-title-right">
<Button
variant="contained"
color="secondary"
style={{
fontWeight: "bold",
marginBottom: "1rem",
textTransform: "capitalize",
}}
onClick={() => {
navigate("/leaves/today", { replace: true });
}}
>
Cancel
</Button>
</div>
</div>
</div>
</div>
<div className="row">
<div className="col-lg-12">
<div className="card">
<div className="card-body">
<div className="row ml-0 mr-0 mb-10">
<div className="col-lg-1">
<div className="dataTables_length">
<label className="w-100">
Show
<select
onChange={(e) => {
setItemPerPage(Number(e.target.value));
setCurrentPage(1);
}}
className="form-control"
disabled={loading}
>
<option value="10">10</option>
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
entries
</label>
</div>
</div>
<div className="col-lg-3">
<label>Territory Manager Name:</label>
<input
type="text"
placeholder="Territory Manager name"
className="form-control"
ref={nameRef}
onChange={handleSearchChange}
disabled={loading}
/>
</div>
<div className="col-lg-3">
<label>Mobile Number:</label>
<input
type="text"
placeholder="Mobile Number"
className="form-control"
ref={mobileRef}
onChange={handleSearchChange}
disabled={loading}
/>
</div>
<div className="col-lg-3">
<label>Filter by Verify:</label>
<select
className="form-control"
ref={verifyRef}
onChange={handleSearchChange}
disabled={loading}
>
<option value="">----Select----</option>
<option value="true">YES</option>
<option value="false">NO</option>
</select>
</div>
</div>
<div className="table-responsive table-shoot mt-3">
<table className="table table-centered table-nowrap">
<thead
className="thead-light"
style={{ background: "#ecdddd" }}
>
<tr>
<th className="text-start">Name</th>
<th className="text-start">Mobile No.</th>
<th className="text-start">Email</th>
<th className="text-start">Verify</th>
<th className="text-start">Register On</th>
<th className="text-start">Action</th>
</tr>
</thead>
<tbody>
{loading ? (
<tr>
<td className="text-center" colSpan="6">
Loading...
</td>
</tr>
) : territorymanagersData.length > 0 ? (
territorymanagersData.map((territorymanager, i) => (
<tr key={i}>
<td className="text-start">
{territorymanager?.name}
</td>
<td className="text-start">
{territorymanager?.mobileNumber}
</td>
<td className="text-start">
{territorymanager?.email || (
<small className="m-0 text-secondary">
No Email Added!
</small>
)}
</td>
<td className="text-start">
<span
className={`badge text-white ${
territorymanager?.isVerified
? "text-bg-success"
: "text-bg-danger"
}`}
>
{territorymanager?.isVerified ? "YES" : "NO"}
</span>
</td>
<td className="text-start">
{new Date(
territorymanager.createdAt
).toLocaleString("en-IN", {
weekday: "short",
month: "short",
day: "numeric",
year: "numeric",
hour: "numeric",
minute: "numeric",
hour12: true,
})}
</td>
<td className="text-start">
<Link to={`/leave/view/${territorymanager._id}`}>
<button
style={{
color: "white",
marginRight: "1rem",
}}
type="button"
className="btn btn-primary btn-sm waves-effect waves-light btn-table mt-1 mx-1"
>
View Leaves
</button>
</Link>
</td>
</tr>
))
) : (
<tr className="text-center">
<td colSpan="6">
<h5>No Territory Managers Available...</h5>
</td>
</tr>
)}
</tbody>
</table>
</div>
<div className="row mt-20">
<div className="col-sm-12 col-md-6 mb-20">
<div
className="dataTables_info"
id="datatable_info"
role="status"
aria-live="polite"
>
Showing {currentPage * itemPerPage - itemPerPage + 1} to{" "}
{Math.min(currentPage * itemPerPage, totalData)} of{" "}
{totalData} entries
</div>
</div>
<div className="col-sm-12 col-md-6">
<div className="d-flex">
<ul className="pagination ms-auto">
<li
className={
currentPage === 1
? "paginate_button page-item previous disabled"
: "paginate_button page-item previous"
}
>
<span
className="page-link"
onClick={() =>
setCurrentPage((prev) =>
prev > 1 ? prev - 1 : prev
)
}
>
Previous
</span>
</li>
<li
className={
currentPage * itemPerPage >= totalData
? "paginate_button page-item next disabled"
: "paginate_button page-item next"
}
>
<span
className="page-link"
onClick={() =>
setCurrentPage((prev) =>
prev * itemPerPage < totalData
? prev + 1
: prev
)
}
>
Next
</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
);
};
export default LeaveTerritoryManager;

View File

@ -0,0 +1,292 @@
import React, { useState, useEffect } from "react";
import { Link } from "react-router-dom";
import axios from "axios";
import Button from "@material-ui/core/Button";
import { useNavigate } from "react-router-dom";
import { isAutheticated } from "src/auth";
import swal from "sweetalert";
const TodayTask = () => {
const token = isAutheticated();
const navigate = useNavigate();
const [loading, setLoading] = useState(false);
const [userData, setuserData] = useState([]);
const [currentPage, setCurrentPage] = useState(1);
const [itemPerPage, setItemPerPage] = useState(10);
const [totalData, setTotalData] = useState(0);
const getTodayTaskData = async () => {
setLoading(true);
try {
const res = await axios.get(`/api/task/today`, {
headers: {
Authorization: `Bearer ${token}`,
},
params: {
page: currentPage,
show: itemPerPage,
},
});
// console.log(res.data);
setuserData(res.data?.tasks);
setTotalData(res.data?.totalTasks);
} catch (err) {
const msg = err?.response?.data?.message || "Something went wrong!";
swal({
title: "Error",
text: msg,
icon: "error",
button: "Retry",
dangerMode: true,
});
} finally {
setLoading(false);
}
};
useEffect(() => {
getTodayTaskData();
}, [itemPerPage, currentPage]);
const today = new Date().toLocaleDateString("en-IN", {
weekday: "short",
month: "short",
day: "numeric",
year: "numeric",
});
return (
<div className="main-content">
<div className="page-content">
<div className="container-fluid">
<div className="row">
<div className="col-12">
<div className="page-title-box d-flex align-items-center justify-content-between">
<div style={{ fontSize: "22px" }} className="fw-bold">
Today's Task Report
<div
style={{
fontSize: "20px",
marginTop: "5px",
marginBottom: "3px",
}}
>
Date : {today}
</div>
</div>
<div className="d-flex">
<Button
variant="contained"
color="primary"
style={{
fontWeight: "bold",
marginRight: "1rem",
textTransform: "capitalize",
}}
// onClick={() => {
// navigate("/salescoordinator/task", {
// replace: true,
// });
// }}
>
Show Sales Coordinator Task
</Button>
<Button
variant="contained"
color="primary"
style={{
fontWeight: "bold",
textTransform: "capitalize",
}}
// onClick={() => {
// navigate("/territorymanager/task", {
// replace: true,
// });
// }}
>
Show Territory Manager Task
</Button>
</div>
</div>
</div>
</div>
<div className="row">
<div className="col-lg-12">
<div className="card">
<div className="card-body">
<div className="row ml-0 mr-0 mb-10">
<div className="col-lg-1">
<div className="dataTables_length">
<label className="w-100">
Show
<select
onChange={(e) => {
setItemPerPage(e.target.value);
setCurrentPage(1);
}}
className="form-control"
disabled={loading}
>
<option value="10">10</option>
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
entries
</label>
</div>
</div>
</div>
<div className="table-responsive table-shoot mt-3">
<table className="table table-centered table-nowrap">
<thead
className="thead-light"
style={{ background: "#ecdddd" }}
>
<tr>
<th className="text-start" style={{ width: "15%" }}>
Employee ID
</th>
<th className="text-start" style={{ width: "20%" }}>
Name
</th>
<th className="text-start" style={{ width: "20%" }}>
Email
</th>
<th className="text-start" style={{ width: "15%" }}>
Designation
</th>
<th className="text-start" style={{ width: "20%" }}>
Task
</th>
<th className="text-start" style={{ width: "10%" }}>
Task Status
</th>
</tr>
</thead>
<tbody>
{loading ? (
<tr>
<td className="text-center" colSpan="7">
Loading...
</td>
</tr>
) : userData?.length > 0 ? (
userData?.map((task, i) => {
return (
<tr key={i}>
<td className="text-start">
{task?.taskAssignedTo?.uniqueId}
</td>
<td className="text-start">
{task?.taskAssignedTo?.name}
</td>
<td className="text-start">
{task?.taskAssignedTo?.email ? (
task?.taskAssignedTo?.email
) : (
<small className="m-0 text-secondary">
No Email Added!
</small>
)}
</td>
<td className="text-start">
{task?.taskAssignedTo?.designation}
</td>
<td className="text-start">
{task?.task || (
<small className="m-0 text-secondary">
No Task Added!
</small>
)}
</td>
<td className="text-start">
{task?.taskStatus}
</td>
</tr>
);
})
) : (
<tr className="text-center">
<td colSpan="6">
<h5>No Task Records Available...</h5>
</td>
</tr>
)}
</tbody>
</table>
</div>
<div className="row mt-20">
<div className="col-sm-12 col-md-6 mb-20">
<div
className="dataTables_info"
id="datatable_info"
role="status"
aria-live="polite"
>
Showing {currentPage * itemPerPage - itemPerPage + 1} to{" "}
{Math.min(currentPage * itemPerPage, totalData)} of{" "}
{totalData} entries
</div>
</div>
<div className="col-sm-12 col-md-6">
<div className="d-flex">
<ul className="pagination ms-auto">
<li
className={
currentPage === 1
? "paginate_button page-item previous disabled"
: "paginate_button page-item previous"
}
>
<span
className="page-link"
onClick={() =>
setCurrentPage((prev) =>
prev > 1 ? prev - 1 : prev
)
}
>
Previous
</span>
</li>
<li
className={
currentPage * itemPerPage >= totalData
? "paginate_button page-item next disabled"
: "paginate_button page-item next"
}
>
<span
className="page-link"
onClick={() =>
setCurrentPage((prev) =>
prev * itemPerPage < totalData
? prev + 1
: prev
)
}
>
Next
</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
);
};
export default TodayTask;