Compare commits
No commits in common. "5427fda41ef1b1c4d71f7e16bf456dd5b5b376fb" and "9e3101ebf43238f33b56f4a8a5be97ff4a4219ed" have entirely different histories.
5427fda41e
...
9e3101ebf4
@ -84,7 +84,7 @@ const AttendLogs = ({ Id }) => {
|
||||
document.querySelectorAll('[data-bs-toggle="tooltip"]')
|
||||
);
|
||||
tooltipTriggerList.forEach((el) => new bootstrap.Tooltip(el));
|
||||
}, []);
|
||||
}, [] );
|
||||
return (
|
||||
<div className="table-responsive">
|
||||
<div className="text-start">
|
||||
@ -106,12 +106,13 @@ const AttendLogs = ({ Id }) => {
|
||||
<table className="table table-sm mb-0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Date</th>
|
||||
<th>Time</th>
|
||||
<th>Activity</th>
|
||||
<th>Location</th>
|
||||
<th>Recored By</th>
|
||||
<th>Description</th>
|
||||
<th >Date</th>
|
||||
<th >Time</th>
|
||||
<th >Activity</th>
|
||||
<th >Location</th>
|
||||
<th >Recored By</th>
|
||||
<th >Description</th>
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@ -126,7 +127,7 @@ const AttendLogs = ({ Id }) => {
|
||||
<td>
|
||||
{log?.latitude != 0 ? (
|
||||
<i
|
||||
className="bx bx-location-plus text-danger cursor-pointer"
|
||||
class="bx bx-location-plus text-danger cursor-pointer"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-offset="0,8"
|
||||
data-bs-placement="top"
|
||||
@ -140,14 +141,13 @@ const AttendLogs = ({ Id }) => {
|
||||
"--"
|
||||
)}
|
||||
</td>
|
||||
<td className="text-wrap">
|
||||
{`${log?.updatedByEmployee?.firstName ?? ""} ${
|
||||
log?.updatedByEmployee?.lastName ?? ""
|
||||
}`}
|
||||
<td className="text-wrap" >
|
||||
{`${logs[0]?.updatedByEmployee?.firstName ?? ''} ${logs[0]?.updatedByEmployee?.lastName ?? ''}`}
|
||||
</td>
|
||||
<td className="text-wrap" colSpan={3}>
|
||||
<td className="text-wrap" colSpan={3} >
|
||||
{log?.comment || "--"}
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
import React, { useState,useEffect } from "react";
|
||||
import moment from "moment";
|
||||
import Avatar from "../common/Avatar";
|
||||
import { convertShortTime } from "../../utils/dateUtils";
|
||||
@ -32,7 +32,7 @@ const Attendance = ({ attendance, getRole, handleModalData }) => {
|
||||
|
||||
const { currentPage, totalPages, currentItems, paginate } = usePagination(
|
||||
filteredData,
|
||||
10
|
||||
5
|
||||
);
|
||||
return (
|
||||
<>
|
||||
@ -116,7 +116,7 @@ const Attendance = ({ attendance, getRole, handleModalData }) => {
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
{!attendance && (
|
||||
{!attendance && (
|
||||
<span>No employees assigned to the project</span>
|
||||
)}
|
||||
</tbody>
|
||||
|
||||
@ -16,7 +16,6 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
|
||||
const dispatch = useDispatch();
|
||||
const { data, loading, error } = useSelector((store) => store.attendanceLogs);
|
||||
const [isRefreshing, setIsRefreshing] = useState(true);
|
||||
const [dates, setDates] = useState([]);
|
||||
|
||||
const today = new Date();
|
||||
today.setHours(0, 0, 0, 0); // Strip time to compare dates only
|
||||
@ -41,32 +40,18 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
|
||||
return nameA.localeCompare(nameB);
|
||||
};
|
||||
|
||||
const group1 = data
|
||||
.filter((d) => d.activity === 1 && isSameDay(d.checkInTime))
|
||||
.sort(sortByName);
|
||||
const group2 = data
|
||||
.filter((d) => d.activity === 4 && isSameDay(d.checkOutTime))
|
||||
.sort(sortByName);
|
||||
const group3 = data
|
||||
.filter((d) => d.activity === 1 && isBeforeToday(d.checkInTime))
|
||||
.sort(sortByName);
|
||||
const group4 = data
|
||||
.filter((d) => d.activity === 4 && isBeforeToday(d.checkOutTime))
|
||||
.sort(sortByName);
|
||||
const group5 = data.filter((d) => d.activity === 5).sort(sortByName);
|
||||
const group1 = data.filter(d => d.activity === 1 && isSameDay(d.checkInTime)).sort(sortByName);
|
||||
const group2 = data.filter(d => d.activity === 4 && isSameDay(d.checkOutTime)).sort(sortByName);
|
||||
const group3 = data.filter(d => d.activity === 1 && isBeforeToday(d.checkInTime)).sort(sortByName);
|
||||
const group4 = data.filter(d => d.activity === 4 && isBeforeToday(d.checkOutTime)).sort(sortByName);
|
||||
const group5 = data.filter(d => d.activity === 5).sort(sortByName);
|
||||
|
||||
const sortedFinalList = [
|
||||
...group1,
|
||||
...group2,
|
||||
...group3,
|
||||
...group4,
|
||||
...group5,
|
||||
];
|
||||
const sortedFinalList = [...group1, ...group2, ...group3, ...group4, ...group5];
|
||||
|
||||
const currentDate = new Date().toLocaleDateString("en-CA");
|
||||
const currentDate = new Date().toLocaleDateString( "en-CA" );
|
||||
const { currentPage, totalPages, currentItems, paginate } = usePagination(
|
||||
sortedFinalList,
|
||||
10
|
||||
5
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
@ -80,16 +65,8 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
|
||||
})
|
||||
);
|
||||
}
|
||||
}, [dateRange, projectId, isRefreshing]);
|
||||
}, [ dateRange, projectId, isRefreshing ] );
|
||||
|
||||
useEffect(() => {
|
||||
const attendanceDate = [
|
||||
...new Set(sortedFinalList.map((item) => item.checkInTime.split("T")[0])),
|
||||
].sort((a, b) => new Date(b) - new Date(a));
|
||||
if (attendanceDate != dates) {
|
||||
setDates(attendanceDate);
|
||||
}
|
||||
}, [data]);
|
||||
|
||||
return (
|
||||
<>
|
||||
@ -103,15 +80,16 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
|
||||
<div className="col-md-2 m-0 text-end">
|
||||
<i
|
||||
className={`bx bx-refresh cursor-pointer fs-4 ${
|
||||
loading ? "spin" : ""
|
||||
loading ? "spin":""
|
||||
}`}
|
||||
title="Refresh"
|
||||
onClick={() => setIsRefreshing(!isRefreshing)}
|
||||
onClick={() => setIsRefreshing( !isRefreshing )}
|
||||
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="table-responsive text-nowrap">
|
||||
{data && data.length > 0 && (
|
||||
{(data && data.length > 0 ) && (
|
||||
<table className="table mb-0">
|
||||
<thead>
|
||||
<tr>
|
||||
@ -131,111 +109,95 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
|
||||
</thead>
|
||||
<tbody>
|
||||
{loading && <td colSpan={5}>Loading...</td>}
|
||||
{dates.map((date, i) => {
|
||||
return (
|
||||
<React.Fragment key={i}>
|
||||
{currentItems.some(
|
||||
(item) => item.checkInTime.split("T")[0] === date
|
||||
) && (
|
||||
<tr className="table-row-header">
|
||||
<td colSpan={7} className="text-start">
|
||||
<strong>{date}</strong>
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
{currentItems
|
||||
?.filter((item) => item.checkInTime.includes(date))
|
||||
.map((attendance, index) => (
|
||||
<tr key={index}>
|
||||
<td colSpan={2}>
|
||||
<div className="d-flex justify-content-start align-items-center">
|
||||
<Avatar
|
||||
firstName={attendance.firstName}
|
||||
lastName={attendance.lastName}
|
||||
/>
|
||||
<div className="d-flex flex-column">
|
||||
<a
|
||||
href="#"
|
||||
className="text-heading text-truncate"
|
||||
>
|
||||
<span className="fw-normal">
|
||||
{attendance.firstName} {attendance.lastName}
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
{" "}
|
||||
{moment(attendance.checkInTime).format(
|
||||
"DD-MMM-YYYY"
|
||||
)}
|
||||
</td>
|
||||
<td>{convertShortTime(attendance.checkInTime)}</td>
|
||||
<td>
|
||||
{attendance.checkOutTime
|
||||
? convertShortTime(attendance.checkOutTime)
|
||||
: "--"}
|
||||
</td>
|
||||
<td className="text-center">
|
||||
<RenderAttendanceStatus
|
||||
attendanceData={attendance}
|
||||
handleModalData={handleModalData}
|
||||
Tab={2}
|
||||
currentDate={currentDate}
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</React.Fragment>
|
||||
);
|
||||
})}
|
||||
{currentItems?.map( ( attendance, index ) => (
|
||||
<tr key={index}>
|
||||
<td colSpan={2}>
|
||||
<div className="d-flex justify-content-start align-items-center">
|
||||
<Avatar
|
||||
firstName={attendance.firstName}
|
||||
lastName={attendance.lastName}
|
||||
/>
|
||||
<div className="d-flex flex-column">
|
||||
<a href="#" className="text-heading text-truncate">
|
||||
<span className="fw-normal">
|
||||
{attendance.firstName} {attendance.lastName}
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
{" "}
|
||||
{moment( attendance.checkInTime ).format( "DD-MMM-YYYY" )}
|
||||
</td>
|
||||
<td>{convertShortTime( attendance.checkInTime )}</td>
|
||||
<td>
|
||||
{attendance.checkOutTime
|
||||
? convertShortTime( attendance.checkOutTime )
|
||||
: "--"}
|
||||
</td>
|
||||
<td className="text-center">
|
||||
<RenderAttendanceStatus
|
||||
attendanceData={attendance}
|
||||
handleModalData={handleModalData}
|
||||
Tab={2}
|
||||
currentDate={currentDate}
|
||||
/>
|
||||
</td>
|
||||
</tr>
|
||||
) )}
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
{!loading && data.length === 0 && <span>No employee logs</span>}
|
||||
{error && <td colSpan={5}>{error}</td>}
|
||||
) }
|
||||
{(!loading && data.length === 0) &&
|
||||
<span>No employee logs</span>
|
||||
}
|
||||
{error && <td colSpan={5}>{error}</td>}
|
||||
</div>
|
||||
{!loading && (
|
||||
<nav aria-label="Page ">
|
||||
<ul className="pagination pagination-sm justify-content-end py-1">
|
||||
<li className={`page-item ${currentPage === 1 ? "disabled" : ""}`}>
|
||||
<button
|
||||
className="page-link btn-xs"
|
||||
onClick={() => paginate(currentPage - 1)}
|
||||
>
|
||||
«
|
||||
</button>
|
||||
</li>
|
||||
{[...Array(totalPages)].map((_, index) => (
|
||||
<li
|
||||
key={index}
|
||||
className={`page-item ${
|
||||
currentPage === index + 1 ? "active" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link "
|
||||
onClick={() => paginate(index + 1)}
|
||||
>
|
||||
{index + 1}
|
||||
</button>
|
||||
</li>
|
||||
))}
|
||||
<li
|
||||
className={`page-item ${
|
||||
currentPage === totalPages ? "disabled" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link "
|
||||
onClick={() => paginate(currentPage + 1)}
|
||||
>
|
||||
»
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<nav aria-label="Page ">
|
||||
<ul className="pagination pagination-sm justify-content-end py-1">
|
||||
<li
|
||||
className={`page-item ${
|
||||
currentPage === 1 ? "disabled" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link btn-xs"
|
||||
onClick={() => paginate(currentPage - 1)}
|
||||
>
|
||||
«
|
||||
</button>
|
||||
</li>
|
||||
{[...Array(totalPages)].map((_, index) => (
|
||||
<li
|
||||
key={index}
|
||||
className={`page-item ${
|
||||
currentPage === index + 1 ? "active" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link "
|
||||
onClick={() => paginate(index + 1)}
|
||||
>
|
||||
{index + 1}
|
||||
</button>
|
||||
</li>
|
||||
))}
|
||||
<li
|
||||
className={`page-item ${
|
||||
currentPage === totalPages ? "disabled" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link "
|
||||
onClick={() => paginate(currentPage + 1)}
|
||||
>
|
||||
»
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
|
||||
@ -52,7 +52,49 @@ const InfraPlanning = () =>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
{/* <div className={`col-12 text-end mb-1 ${!ManageInfra && 'd-none'} `} >
|
||||
<button
|
||||
type="button"
|
||||
className="link-button link-button-sm m-1 "
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#building-model"
|
||||
// onClick={() => openBuildingModel()}
|
||||
>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
Manage Building
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
data-bs-toggle="modal"
|
||||
className="link-button m-1"
|
||||
data-bs-target="#floor-model"
|
||||
// onClick={() => openFloorModel()}
|
||||
>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
Manage Floors
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
data-bs-toggle="modal"
|
||||
className="link-button m-1"
|
||||
data-bs-target="#work-area-model"
|
||||
// onClick={() => openWorkAreaModel()}
|
||||
>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
Manage Work Areas
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
data-bs-toggle="modal"
|
||||
className="link-button m-1"
|
||||
data-bs-target="#task-model"
|
||||
// onClick={() => openTaskModel()}
|
||||
>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
Manage Tasks
|
||||
</button>
|
||||
</div> */}
|
||||
</div>
|
||||
<div className="row ">
|
||||
{project_deatilsLoader && ( <p>Loading...</p> )}
|
||||
|
||||
@ -23,11 +23,11 @@ const Regularization = ({ handleRequest }) => {
|
||||
return nameA.localeCompare(nameB);
|
||||
};
|
||||
|
||||
const filteredData = regularizesList.sort(sortByName);
|
||||
const filteredData = regularizesList.sort(sortByName)
|
||||
|
||||
const { currentPage, totalPages, currentItems, paginate } = usePagination(
|
||||
filteredData,
|
||||
10
|
||||
5
|
||||
);
|
||||
|
||||
return (
|
||||
@ -94,46 +94,50 @@ const Regularization = ({ handleRequest }) => {
|
||||
</tbody>
|
||||
</table>
|
||||
{!loading && (
|
||||
<nav aria-label="Page ">
|
||||
<ul className="pagination pagination-sm justify-content-end py-1">
|
||||
<li className={`page-item ${currentPage === 1 ? "disabled" : ""}`}>
|
||||
<button
|
||||
className="page-link btn-xs"
|
||||
onClick={() => paginate(currentPage - 1)}
|
||||
>
|
||||
«
|
||||
</button>
|
||||
</li>
|
||||
{[...Array(totalPages)].map((_, index) => (
|
||||
<li
|
||||
key={index}
|
||||
className={`page-item ${
|
||||
currentPage === index + 1 ? "active" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link "
|
||||
onClick={() => paginate(index + 1)}
|
||||
>
|
||||
{index + 1}
|
||||
</button>
|
||||
</li>
|
||||
))}
|
||||
<li
|
||||
className={`page-item ${
|
||||
currentPage === totalPages ? "disabled" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link "
|
||||
onClick={() => paginate(currentPage + 1)}
|
||||
>
|
||||
»
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
)}
|
||||
<nav aria-label="Page ">
|
||||
<ul className="pagination pagination-sm justify-content-end py-1">
|
||||
<li
|
||||
className={`page-item ${
|
||||
currentPage === 1 ? "disabled" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link btn-xs"
|
||||
onClick={() => paginate(currentPage - 1)}
|
||||
>
|
||||
«
|
||||
</button>
|
||||
</li>
|
||||
{[...Array(totalPages)].map((_, index) => (
|
||||
<li
|
||||
key={index}
|
||||
className={`page-item ${
|
||||
currentPage === index + 1 ? "active" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link "
|
||||
onClick={() => paginate(index + 1)}
|
||||
>
|
||||
{index + 1}
|
||||
</button>
|
||||
</li>
|
||||
))}
|
||||
<li
|
||||
className={`page-item ${
|
||||
currentPage === totalPages ? "disabled" : ""
|
||||
}`}
|
||||
>
|
||||
<button
|
||||
className="page-link "
|
||||
onClick={() => paginate(currentPage + 1)}
|
||||
>
|
||||
»
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@ -5,7 +5,8 @@ const EmployeeNav = ({ onPillClick, activePill }) => {
|
||||
<div className="col-md-12">
|
||||
<div className="nav-align-top ">
|
||||
<ul className="nav nav-tabs">
|
||||
<li className="nav-item" style={{ padding: "10px 10px 0 10px" }}>
|
||||
|
||||
<li className="nav-item">
|
||||
<a
|
||||
className={`nav-link py-1 px-2 small ${
|
||||
activePill === "attendance" ? "active" : ""
|
||||
@ -19,7 +20,7 @@ const EmployeeNav = ({ onPillClick, activePill }) => {
|
||||
<i className="bx bx-group bx-sm me-1_5"></i> Attendances
|
||||
</a>
|
||||
</li>
|
||||
<li className="nav-item" style={{ padding: "10px 10px 0 10px" }}>
|
||||
<li className="nav-item">
|
||||
<a
|
||||
className={`nav-link py-1 px-2 small ${
|
||||
activePill === "account" ? "active" : ""
|
||||
@ -34,7 +35,7 @@ const EmployeeNav = ({ onPillClick, activePill }) => {
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li className="nav-item" style={{ padding: "10px 10px 0 10px" }}>
|
||||
<li className="nav-item">
|
||||
<a
|
||||
className={`nav-link py-1 px-2 small ${
|
||||
activePill === "activities" ? "active" : ""
|
||||
|
||||
@ -54,7 +54,7 @@ const Header = () => {
|
||||
};
|
||||
|
||||
const handleProfilePage = () => {
|
||||
navigate(`/employee/${profile?.employeeInfo?.id}?for=attendance`);
|
||||
navigate(`/employee/${profile?.employeeInfo?.id}?for=account`);
|
||||
};
|
||||
return (
|
||||
<nav
|
||||
@ -120,7 +120,7 @@ const Header = () => {
|
||||
className="nav-link dropdown-toggle hide-arrow"
|
||||
href="#;"
|
||||
data-bs-toggle="dropdown"
|
||||
data-bs-auto-close="true"
|
||||
data-bs-auto-close="outside"
|
||||
aria-expanded="false"
|
||||
>
|
||||
<i className="icon-base bx bx-grid-alt icon-md"></i>
|
||||
@ -143,53 +143,39 @@ const Header = () => {
|
||||
<div className="dropdown-shortcuts-list scrollable-container ps">
|
||||
<div className="row row-bordered overflow-visible g-0">
|
||||
<div className="dropdown-shortcuts-item col">
|
||||
<a
|
||||
onClick={() => navigate(`/dashboard`)}
|
||||
className="text-heading text-truncate cursor-pointer"
|
||||
>
|
||||
<span className="dropdown-shortcuts-icon rounded-circle mb-3">
|
||||
<i className="icon-base bx bx-home icon-26px text-heading"></i>
|
||||
</span>
|
||||
<span className="dropdown-shortcuts-icon rounded-circle mb-3">
|
||||
<i className="icon-base bx bx-home icon-26px text-heading"></i>
|
||||
</span>
|
||||
<a href="/dashboard" className="stretched-link">
|
||||
Dashboard
|
||||
</a>
|
||||
|
||||
<small>User Dashboard</small>
|
||||
</div>
|
||||
<div className="dropdown-shortcuts-item col">
|
||||
<a
|
||||
onClick={() => navigate(`/projects`)}
|
||||
className="text-heading text-truncate cursor-pointer"
|
||||
>
|
||||
<span className="dropdown-shortcuts-icon rounded-circle mb-3">
|
||||
<i className="icon-base bx bx-building-house icon-26px text-heading"></i>
|
||||
</span>
|
||||
<span className="dropdown-shortcuts-icon rounded-circle mb-3">
|
||||
<i className="icon-base bx bx-building-house icon-26px text-heading"></i>
|
||||
</span>
|
||||
<a href="/projects" className="stretched-link">
|
||||
Projects
|
||||
</a>
|
||||
|
||||
<small>Projects List</small>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row row-bordered overflow-visible g-0">
|
||||
<div className="dropdown-shortcuts-item col">
|
||||
<a
|
||||
onClick={() => navigate(`/employees`)}
|
||||
className="text-heading text-truncate cursor-pointer"
|
||||
>
|
||||
<span className="dropdown-shortcuts-icon rounded-circle mb-3">
|
||||
<i className="icon-base bx bxs-user-account icon-26px text-heading"></i>
|
||||
</span>
|
||||
<span className="dropdown-shortcuts-icon rounded-circle mb-3">
|
||||
<i className="icon-base bx bxs-user-account icon-26px text-heading"></i>
|
||||
</span>
|
||||
<a href="/employees" className="stretched-link">
|
||||
Employees
|
||||
</a>
|
||||
<small>Manage Employees</small>
|
||||
</div>
|
||||
<div className="dropdown-shortcuts-item col">
|
||||
<a
|
||||
onClick={() => navigate(`/activities/attendance`)}
|
||||
className="text-heading text-truncate cursor-pointer"
|
||||
>
|
||||
<span className="dropdown-shortcuts-icon rounded-circle mb-3">
|
||||
<i className="icon-base bx bx-user-check icon-26px text-heading"></i>
|
||||
</span>
|
||||
<span className="dropdown-shortcuts-icon rounded-circle mb-3">
|
||||
<i className="icon-base bx bx-user-check icon-26px text-heading"></i>
|
||||
</span>
|
||||
<a href="/activities/attendance" className="stretched-link">
|
||||
Attendance
|
||||
</a>
|
||||
<small>Manage Attendance</small>
|
||||
@ -197,29 +183,21 @@ const Header = () => {
|
||||
</div>
|
||||
<div className="row row-bordered overflow-visible g-0">
|
||||
<div className="dropdown-shortcuts-item col">
|
||||
<a
|
||||
onClick={() => navigate(`/activities/task`)}
|
||||
className="text-heading text-truncate cursor-pointer"
|
||||
>
|
||||
<span className="dropdown-shortcuts-icon rounded-circle mb-3">
|
||||
<i className="icon-base bx bxs-wrench icon-26px text-heading"></i>
|
||||
</span>
|
||||
<span className="dropdown-shortcuts-icon rounded-circle mb-3">
|
||||
<i className="icon-base bx bxs-wrench icon-26px text-heading"></i>
|
||||
</span>
|
||||
<a href="/activities/task" className="stretched-link">
|
||||
Allocate Work
|
||||
</a>
|
||||
|
||||
<small>Work Allocations</small>
|
||||
</div>
|
||||
<div className="dropdown-shortcuts-item col">
|
||||
<a
|
||||
onClick={() => navigate(`/activities/records`)}
|
||||
className="text-heading text-truncate cursor-pointer"
|
||||
>
|
||||
<span className="dropdown-shortcuts-icon rounded-circle mb-3">
|
||||
<i className="icon-base bx bx-list-ul icon-26px text-heading"></i>
|
||||
</span>
|
||||
<span className="dropdown-shortcuts-icon rounded-circle mb-3">
|
||||
<i className="icon-base bx bx-list-ul icon-26px text-heading"></i>
|
||||
</span>
|
||||
<a href="/activities/records" className="stretched-link">
|
||||
Daily Work Log
|
||||
</a>
|
||||
|
||||
<small>Daily Work Allocations</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
104
src/components/Project/Infrastructure/DleleteActivity.jsx
Normal file
104
src/components/Project/Infrastructure/DleleteActivity.jsx
Normal file
@ -0,0 +1,104 @@
|
||||
import React, {useState} from 'react'
|
||||
import ProjectRepository from '../../../repositories/ProjectRepository'
|
||||
import {useProjectDetails} from '../../../hooks/useProjects'
|
||||
|
||||
const DleleteActivity = ( {workItem, workArea, building, floor, onClose} ) =>
|
||||
{
|
||||
const {projects_Details, refetch} = useProjectDetails()
|
||||
const [loading,setLoading] = useState(false)
|
||||
|
||||
|
||||
const handleDeleteActivity =async () =>
|
||||
{
|
||||
try
|
||||
{
|
||||
setLoading(false)
|
||||
const updatedProject = { ...projects_Details };
|
||||
const response = await ProjectRepository.deleteProjectTask( workItem.workItemId );
|
||||
const newProject = {
|
||||
...updatedProject,
|
||||
buildings: updatedProject.buildings.map((building) =>
|
||||
building.id === building.buildingID
|
||||
? {
|
||||
...building,
|
||||
floors: building.floors.map((floor) =>
|
||||
floor.id === building.floorId
|
||||
? {
|
||||
...floor,
|
||||
workAreas: floor.workAreas.map((workArea) =>
|
||||
workArea.id === workItem?.workAreaId
|
||||
? {
|
||||
...workArea,
|
||||
workItems: (() => {
|
||||
const exists = workArea.workItems.some(
|
||||
(item) =>
|
||||
String(
|
||||
item?.workItem?.id ?? item?.id
|
||||
) === String(finalData.id)
|
||||
);
|
||||
|
||||
finalUpdatedWorkItem = workItem;
|
||||
|
||||
return exists
|
||||
? workArea.workItems.map((item) =>
|
||||
String(
|
||||
item?.workItem?.id ?? item?.id
|
||||
) === String(finalData.id)
|
||||
? workItem
|
||||
: item
|
||||
)
|
||||
: [...workArea.workItems, workItem];
|
||||
})(),
|
||||
}
|
||||
: workArea
|
||||
),
|
||||
}
|
||||
: floor
|
||||
),
|
||||
}
|
||||
: building
|
||||
),
|
||||
};
|
||||
cacheData("projectInfo", {
|
||||
projectId: newProject.id,
|
||||
data: newProject,
|
||||
});
|
||||
resetForm();
|
||||
dispatch( refreshData( true ) );
|
||||
setLoading(false)
|
||||
showToast("Activity Updated Successfully","success")
|
||||
|
||||
onClose();
|
||||
} catch ( error )
|
||||
{
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
return (
|
||||
<div className="modal-dialog modal-md modal-simple modal-edit-user">
|
||||
<div className='modal-dialog modal-dialog-centered'>
|
||||
<div className="modal-content">
|
||||
<div className="modal-body">
|
||||
<div className="row">
|
||||
<button
|
||||
type="button"
|
||||
className="btn-close"
|
||||
aria-label="Close"
|
||||
onClick={()=>onClose}
|
||||
/>
|
||||
<div className="text-center mb-1">
|
||||
<h5>Are you sure you want delete this Activity { workItem.id}</h5>
|
||||
<div className='d-flex justify-content-evenly'>
|
||||
<button className='btn btn-primary btn-xs' onClick={handleDeleteActivity}>{ loading ? "Please Wait ":"Yes"}</button>
|
||||
<button className='btn btn-secondary btn-xs' onClick={()=>onClose}>Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default DleleteActivity
|
||||
@ -19,7 +19,7 @@ const taskSchema = z
|
||||
.object({
|
||||
activityID: z.string().min(1, "Activity is required"),
|
||||
plannedWork: z.number().min(1, "Planned Work must be greater than 0"),
|
||||
completedWork: z.number().min(0, "Completed Work must be greater than 0"),
|
||||
completedWork: z.number().optional(),
|
||||
})
|
||||
.refine(
|
||||
(data) =>
|
||||
|
||||
@ -205,7 +205,7 @@ const FloorModel = ({
|
||||
|
||||
{formData.buildingId !== "0" && (
|
||||
<div className="col-12 col-md-12">
|
||||
<label className="form-label" >
|
||||
<label className="form-label" htmlFor="floorName">
|
||||
{formData.id !== "0" ? "Modify " : "Enter "} Floor Name
|
||||
</label>
|
||||
<input
|
||||
|
||||
@ -68,7 +68,7 @@ const InfraTable = ({ buildings }) => {
|
||||
showToast("Failed to save floor", "error");
|
||||
}
|
||||
} catch (err) {
|
||||
|
||||
console.error("Error adding floor", err);
|
||||
showToast("Error occurred while saving floor", "error");
|
||||
}
|
||||
};
|
||||
|
||||
@ -10,7 +10,7 @@ const taskSchema = z.object({
|
||||
workAreaId: z.string().min(1, "Work Area is required"),
|
||||
activityID: z.string().min(1, "Activity is required"),
|
||||
plannedWork: z.number().min(1, "Planned Work must be greater than 0"),
|
||||
completedWork: z.number().min(0, "Completed Work must be greater than 0"),
|
||||
completedWork: z.number().optional(),
|
||||
});
|
||||
|
||||
const defaultModel = {
|
||||
|
||||
@ -29,7 +29,7 @@ const WorkArea = ({ workArea, floor, forBuilding }) => {
|
||||
<span className="fw-semibold text-primary">
|
||||
Floor:
|
||||
</span>{" "}
|
||||
<span className="fw-normal text-darkgreen">
|
||||
<span class="fw-normal text-darkgreen">
|
||||
{floor.floorName}
|
||||
</span>
|
||||
</div>
|
||||
@ -37,7 +37,7 @@ const WorkArea = ({ workArea, floor, forBuilding }) => {
|
||||
<span className="ms-10 fw-semibold text-primary">
|
||||
Work Area:
|
||||
</span>{" "}
|
||||
<span className=" fw-normal text-darkgreen">
|
||||
<span class=" fw-normal text-darkgreen">
|
||||
{workArea.areaName}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@ -4,12 +4,12 @@ import { useParams } from "react-router-dom";
|
||||
import EditActivityModal from "./EditActivityModal";
|
||||
import { useHasUserPermission } from "../../../hooks/useHasUserPermission";
|
||||
import { MANAGE_PROJECT_INFRA, MANAGE_TASK } from "../../../utils/constants";
|
||||
|
||||
import DleleteActivity from "./DleleteActivity";
|
||||
import ConfirmModal from "../../common/ConfirmModal";
|
||||
import ProjectRepository from '../../../repositories/ProjectRepository'
|
||||
import {useProjectDetails} from '../../../hooks/useProjects'
|
||||
import showToast from "../../../services/toastService";
|
||||
import {cacheData, getCachedData} from "../../../slices/apiDataManager";
|
||||
import {cacheData} from "../../../slices/apiDataManager";
|
||||
import {useDispatch} from "react-redux";
|
||||
import {refreshData} from "../../../slices/localVariablesSlice";
|
||||
|
||||
@ -23,10 +23,9 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
|
||||
const ManageTasks = useHasUserPermission(MANAGE_TASK);
|
||||
const ManageInfra = useHasUserPermission( MANAGE_PROJECT_INFRA );
|
||||
const [ loadingDelete, setLoadingDelete ] = useState( false )
|
||||
const project = getCachedData("projectInfo");
|
||||
const dispatch = useDispatch()
|
||||
|
||||
const {projects_Details} = useProjectDetails(projectId || project?.projectId)
|
||||
const {projects_Details} = useProjectDetails(projectId)
|
||||
|
||||
const openModal = () => setIsModalOpen(true);
|
||||
const closeModal = () => setIsModalOpen(false);
|
||||
@ -64,6 +63,7 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
|
||||
const showModalDelete = () => setShowModal2(true);
|
||||
const closeModalDelete = () => setShowModal2( false );
|
||||
|
||||
console.log(workItem)
|
||||
|
||||
const handleSubmit = async() => {
|
||||
setLoadingDelete(true);
|
||||
@ -103,25 +103,27 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
|
||||
),
|
||||
};
|
||||
|
||||
console.log(newProject)
|
||||
cacheData("projectInfo", {
|
||||
projectId: newProject.id,
|
||||
data: newProject,
|
||||
});
|
||||
|
||||
dispatch( refreshData( true ) );
|
||||
closeModalDelete()
|
||||
|
||||
setLoadingDelete(false)
|
||||
showToast("Activity Deleted Successfully","success")
|
||||
showToast("Activity Updated Successfully","success")
|
||||
|
||||
|
||||
} catch ( error )
|
||||
{
|
||||
setLoadingDelete( false )
|
||||
closeModalDelete()
|
||||
setLoadingDelete(false)
|
||||
const message =
|
||||
error.response?.data?.message ||
|
||||
error.message ||
|
||||
"An unexpected error occurred";
|
||||
showToast( message, "error" );
|
||||
|
||||
console.log(error)
|
||||
}
|
||||
};
|
||||
return (
|
||||
@ -154,7 +156,6 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
|
||||
/>
|
||||
</div>}
|
||||
|
||||
|
||||
{showModal2 && <div
|
||||
className={`modal fade ${showModal2 ? "show" : ""}`}
|
||||
tabIndex="-1"
|
||||
@ -162,7 +163,14 @@ const WorkItem = ({ workItem, forBuilding, forFloor, forWorkArea }) => {
|
||||
style={{ display: showModal2 ? "block" : "none" }}
|
||||
aria-hidden='false'
|
||||
>
|
||||
<ConfirmModal type={"delete"} header={"Delete Activity"} message={"Are you sure you want delete"} onSubmit={ handleSubmit} onClose={closeModalDelete} loading={loadingDelete}/>
|
||||
{/* <DleleteActivity
|
||||
workItem={workItem}
|
||||
workArea={forWorkArea}
|
||||
building={forBuilding}
|
||||
floor={forFloor}
|
||||
onClose={closeModalDelete}
|
||||
/> */}
|
||||
<ConfirmModal type={"delete"} message={"Are you sure you want delete"} onSubmit={ handleSubmit} onClose={closeModalDelete} loading={loadingDelete}/>
|
||||
</div> }
|
||||
|
||||
<tr>
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
import React, { useState } from 'react';
|
||||
|
||||
const ConfirmModal = ({ type, onSubmit, onClose, message, loading ,header}) => {
|
||||
const ConfirmModal = ({ type, onSubmit, onClose, message, loading }) => {
|
||||
|
||||
const TypeofIcon = (type) => {
|
||||
switch (type) {
|
||||
case "delete":
|
||||
return <i className='bx bx-x-circle text-danger ' style={{fontSize:"60px"}} ></i>;
|
||||
return <i className='bx bx-x-circle text-danger bx-lg'></i>;
|
||||
default:
|
||||
return null;
|
||||
}
|
||||
@ -34,15 +34,9 @@ const ConfirmModal = ({ type, onSubmit, onClose, message, loading ,header}) => {
|
||||
aria-label="Close"
|
||||
onClick={onClose}
|
||||
/>
|
||||
<div className="text-start mb-1">
|
||||
|
||||
|
||||
{header && < strong className='mb-0 font-weight-bold'>{header }</strong>}
|
||||
<div className='row'>
|
||||
<div className='col-4 col-sm-2'> {TypeofIcon(type)}</div>
|
||||
<div className='col-8 col-sm-10 py-sm-2 py-1 text-sm-end'>
|
||||
<span className='fs-6 text'>{message}</span>
|
||||
<div className='d-flex justify-content-center mt-4'>
|
||||
<div className="text-center mb-1">
|
||||
<p className='fs-6'>{TypeofIcon(type)} <span className='fs-6'>{message}</span></p>
|
||||
<div className='d-flex justify-content-evenly'>
|
||||
<button
|
||||
className='btn btn-primary btn-sm'
|
||||
onClick={onSubmit}
|
||||
@ -51,17 +45,13 @@ const ConfirmModal = ({ type, onSubmit, onClose, message, loading ,header}) => {
|
||||
{loading ? "Please Wait..." : "Yes"}
|
||||
</button>
|
||||
<button
|
||||
className='btn btn-secondary ms-4 btn-sm'
|
||||
className='btn btn-secondary btn-sm'
|
||||
onClick={onClose}
|
||||
disabled={loading}
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -204,7 +204,7 @@ const CreateActivity = ({ onClose }) => {
|
||||
onClick={() => removeChecklistItem(index)}
|
||||
className="btn btn-xs btn-icon btn-text-secondary"
|
||||
>
|
||||
<i className="bx bxs-minus-circle text-danger" data-bs-toggle="tooltip"
|
||||
<i class="bx bxs-minus-circle text-danger" data-bs-toggle="tooltip"
|
||||
title="Remove Check"
|
||||
data-bs-original-title="Remove check"></i>
|
||||
</button>
|
||||
@ -219,7 +219,7 @@ const CreateActivity = ({ onClose }) => {
|
||||
className="btn btn-xs btn-primary mt-2"
|
||||
onClick={addChecklistItem}
|
||||
>
|
||||
<i className="bx bx-plus-circle" data-bs-toggle="tooltip"
|
||||
<i class="bx bx-plus-circle" data-bs-toggle="tooltip"
|
||||
title="Add Check"
|
||||
data-bs-original-title="Add check" ></i>
|
||||
</button>
|
||||
|
||||
@ -62,7 +62,7 @@ const AttendancePage = () => {
|
||||
modalElement.classList.remove("show");
|
||||
modalElement.style.display = "none";
|
||||
document.body.classList.remove("modal-open");
|
||||
document.querySelector(".modal-backdrop")?.remove();
|
||||
document.querySelector(".modal-backdrop").remove();
|
||||
}
|
||||
};
|
||||
|
||||
@ -93,10 +93,11 @@ const AttendancePage = () => {
|
||||
}, [modelConfig, isCreateModalOpen]);
|
||||
useEffect(() => {
|
||||
setAttendances(attendance);
|
||||
}, [attendance]);
|
||||
}, [ attendance ] );
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
if (selectedProject === 1 || selectedProject === undefined) {
|
||||
if (selectedProject === 1 || selectedProject === undefined ) {
|
||||
dispatch(setProjectId(loginUser?.projects[0]));
|
||||
}
|
||||
}, [selectedProject, loginUser?.projects]);
|
||||
@ -107,7 +108,7 @@ const AttendancePage = () => {
|
||||
className="modal fade show"
|
||||
style={{ display: "block" }}
|
||||
id="check-Out-modal"
|
||||
tabIndex="-1"
|
||||
tabindex="-1"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<AttendanceModel
|
||||
|
||||
@ -87,6 +87,7 @@ const DailyTask = () => {
|
||||
|
||||
useEffect(() => {
|
||||
popoverRefs.current.forEach((el) => {
|
||||
console.log(el);
|
||||
if (el) {
|
||||
new bootstrap.Popover(el, {
|
||||
trigger: "focus",
|
||||
@ -199,6 +200,7 @@ const DailyTask = () => {
|
||||
task.assignmentDate.includes(date)
|
||||
).map((task, index) => {
|
||||
const refIndex = index * 10 + i;
|
||||
console.log(refIndex);
|
||||
return (
|
||||
<React.Fragment key={index}>
|
||||
<tr>
|
||||
|
||||
@ -9,7 +9,6 @@ import { useProfile } from "../../hooks/useProfile";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
import { useProjectDetails, useProjects } from "../../hooks/useProjects";
|
||||
import { setProjectId } from "../../slices/localVariablesSlice";
|
||||
import showToast from "../../services/toastService";
|
||||
|
||||
const TaskPlannng = () => {
|
||||
const { profile } = useProfile();
|
||||
@ -23,7 +22,6 @@ const TaskPlannng = () => {
|
||||
(store) => store.localVariables.projectId
|
||||
);
|
||||
|
||||
|
||||
const [project, setProject] = useState(null);
|
||||
const [projectDetails, setProjectDetails] = useState(null);
|
||||
const [activities, setActivities] = useState(null);
|
||||
@ -68,22 +66,14 @@ const TaskPlannng = () => {
|
||||
});
|
||||
})
|
||||
.catch((error) => {
|
||||
const message =
|
||||
error.response?.data?.message ||
|
||||
error.message ||
|
||||
"An unexpected error occurred";
|
||||
showToast( message, "error" );
|
||||
console.error(error);
|
||||
setError("Failed to fetch data.");
|
||||
});
|
||||
} else {
|
||||
setProjectDetails(project_cache);
|
||||
}
|
||||
} catch (err) {
|
||||
setError( "Failed to fetch data." );
|
||||
const message =
|
||||
error.response?.data?.message ||
|
||||
error.message ||
|
||||
"An unexpected error occurred";
|
||||
showToast( message, "error" );
|
||||
setError("Failed to fetch data.");
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
|
||||
@ -70,7 +70,7 @@ const AttendancesEmployeeRecords = ({ employee }) => {
|
||||
const currentDate = new Date().toLocaleDateString("en-CA");
|
||||
const { currentPage, totalPages, currentItems, paginate } = usePagination(
|
||||
sortedFinalList,
|
||||
10
|
||||
5
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
@ -84,7 +84,7 @@ const AttendancesEmployeeRecords = ({ employee }) => {
|
||||
})
|
||||
);
|
||||
}
|
||||
}, [dateRange, employee, isRefreshing]);
|
||||
}, [dateRange, employee,isRefreshing]);
|
||||
|
||||
const openModal = (id) => {
|
||||
setAttendanecId(id);
|
||||
@ -132,7 +132,7 @@ const AttendancesEmployeeRecords = ({ employee }) => {
|
||||
<i
|
||||
className={`bx bx-refresh cursor-pointer fs-4 ${
|
||||
loading ? "spin" : ""
|
||||
}`}
|
||||
}`}
|
||||
data-toggle="tooltip"
|
||||
title="Refresh"
|
||||
onClick={() => setIsRefreshing(!isRefreshing)}
|
||||
@ -140,10 +140,12 @@ const AttendancesEmployeeRecords = ({ employee }) => {
|
||||
</div>
|
||||
</div>
|
||||
<div className="table-responsive text-nowrap">
|
||||
{!loading && data.length === 0 && <span>No employee logs</span>}
|
||||
{error && <div className="text-center">{error}</div>}
|
||||
{loading && !data && <div className="text-center">Loading...</div>}
|
||||
{data && data.length > 0 && (
|
||||
{(!loading && data.length === 0) &&
|
||||
<span>No employee logs</span>
|
||||
}
|
||||
{error && <div className="text-center">{error }</div>}
|
||||
{(loading && !data ) && <div className="text-center">Loading...</div>}
|
||||
{(data && data.length > 0 ) && (
|
||||
<table className="table mb-0">
|
||||
<thead>
|
||||
<tr>
|
||||
@ -163,7 +165,7 @@ const AttendancesEmployeeRecords = ({ employee }) => {
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{currentItems?.map((attendance, index) => (
|
||||
{currentItems?.map( ( attendance, index ) => (
|
||||
<tr key={index}>
|
||||
<td colSpan={2}>
|
||||
<div className="d-flex justify-content-start align-items-center">
|
||||
@ -182,12 +184,12 @@ const AttendancesEmployeeRecords = ({ employee }) => {
|
||||
</td>
|
||||
<td>
|
||||
{" "}
|
||||
{moment(attendance.checkInTime).format("DD-MMM-YYYY")}
|
||||
{moment( attendance.checkInTime ).format( "DD-MMM-YYYY" )}
|
||||
</td>
|
||||
<td>{convertShortTime(attendance.checkInTime)}</td>
|
||||
<td>{convertShortTime( attendance.checkInTime )}</td>
|
||||
<td>
|
||||
{attendance.checkOutTime
|
||||
? convertShortTime(attendance.checkOutTime)
|
||||
? convertShortTime( attendance.checkOutTime )
|
||||
: "--"}
|
||||
</td>
|
||||
|
||||
@ -198,18 +200,18 @@ const AttendancesEmployeeRecords = ({ employee }) => {
|
||||
tabIndex="0"
|
||||
aria-controls="DataTables_Table_0"
|
||||
data-bs-toggle="modal"
|
||||
onClick={() => openModal(attendance.id)}
|
||||
onClick={() => openModal( attendance.id )}
|
||||
>
|
||||
View
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
) )}
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
) }
|
||||
</div>
|
||||
{!loading && data.length > 5 && (
|
||||
{(!loading && data.length > 5) && (
|
||||
<nav aria-label="Page ">
|
||||
<ul className="pagination pagination-sm justify-content-end py-1">
|
||||
<li
|
||||
|
||||
@ -3,13 +3,9 @@ import EmpProfile from "../../components/Employee/EmpProfile";
|
||||
import axios from "axios";
|
||||
import Breadcrumb from "../../components/common/Breadcrumb";
|
||||
import EmployeeNav from "../../components/Employee/EmployeeNav";
|
||||
import { useSearchParams, useParams } from "react-router-dom";
|
||||
import { useSearchParams,useParams } from "react-router-dom";
|
||||
import { getCachedData } from "../../slices/apiDataManager";
|
||||
import {
|
||||
useEmployeeProfile,
|
||||
useEmployees,
|
||||
useEmployeesByProject,
|
||||
} from "../../hooks/useEmployees";
|
||||
import { useEmployeeProfile, useEmployees, useEmployeesByProject } from "../../hooks/useEmployees";
|
||||
import { useSelector } from "react-redux";
|
||||
import EmployeeRepository from "../../repositories/EmployeeRepository";
|
||||
import { ComingSoonPage } from "../Misc/ComingSoonPage";
|
||||
@ -17,33 +13,41 @@ import { useNavigate } from "react-router-dom";
|
||||
import Avatar from "../../components/common/Avatar";
|
||||
import AttendancesEmployeeRecords from "./AttendancesEmployeeRecords";
|
||||
const EmployeeProfile = () => {
|
||||
const projectID = useSelector((store) => store.localVariables.projectId);
|
||||
const { employeeId } = useParams();
|
||||
// const {employee,loading} = useEmployeeProfile(employeeId)
|
||||
const [loading, setLoading] = useState(true);
|
||||
|
||||
const [SearchParams] = useSearchParams();
|
||||
const tab = SearchParams.get("for");
|
||||
const projectID = useSelector((store)=>store.localVariables.projectId)
|
||||
const {employeeId} = useParams();
|
||||
// const {employee,loading} = useEmployeeProfile(employeeId)
|
||||
const [loading,setLoading] = useState(true)
|
||||
|
||||
const [SearchParams] = useSearchParams()
|
||||
const tab = SearchParams.get( "for" )
|
||||
const [activePill, setActivePill] = useState(tab);
|
||||
const [currentEmployee, setCurrentEmployee] = useState();
|
||||
const[currentEmployee,setCurrentEmployee] = useState()
|
||||
|
||||
|
||||
const handlePillClick = (pillKey) => {
|
||||
setActivePill(pillKey);
|
||||
};
|
||||
|
||||
const fetchEmployeeProfile = async (employeeID) => {
|
||||
try {
|
||||
const resp = await EmployeeRepository.getEmployeeProfile(employeeID);
|
||||
setCurrentEmployee(resp.data);
|
||||
setLoading(false);
|
||||
} catch (err) {
|
||||
setLoading(false);
|
||||
const fetchEmployeeProfile = async( employeeID ) =>
|
||||
{
|
||||
try
|
||||
{
|
||||
const resp = await EmployeeRepository.getEmployeeProfile( employeeID )
|
||||
setCurrentEmployee( resp.data )
|
||||
setLoading(false)
|
||||
|
||||
} catch ( err )
|
||||
{
|
||||
setLoading(false)
|
||||
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (employeeId) {
|
||||
fetchEmployeeProfile(employeeId);
|
||||
if ( employeeId )
|
||||
{
|
||||
fetchEmployeeProfile(employeeId)
|
||||
}
|
||||
}, [employeeId]);
|
||||
|
||||
@ -54,40 +58,42 @@ const EmployeeProfile = () => {
|
||||
case "attendance": {
|
||||
return (
|
||||
<>
|
||||
<AttendancesEmployeeRecords employee={employeeId} />
|
||||
<AttendancesEmployeeRecords employee={employeeId } />
|
||||
|
||||
</>
|
||||
);
|
||||
}
|
||||
case "dcoument": {
|
||||
return (
|
||||
<>
|
||||
<ComingSoonPage />
|
||||
</>
|
||||
<ComingSoonPage/>
|
||||
</>
|
||||
);
|
||||
break;
|
||||
}
|
||||
case "activities": {
|
||||
return (
|
||||
<>
|
||||
<ComingSoonPage />
|
||||
</>
|
||||
<ComingSoonPage/>
|
||||
</>
|
||||
);
|
||||
break;
|
||||
}
|
||||
|
||||
default:
|
||||
return (
|
||||
<>
|
||||
<ComingSoonPage />
|
||||
</>
|
||||
);
|
||||
return <>
|
||||
<ComingSoonPage/>
|
||||
</>;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
|
||||
if (loading) {
|
||||
return <div>Loading...</div>;
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<div className="container-xxl flex-grow-1 container-p-y">
|
||||
<Breadcrumb
|
||||
@ -117,127 +123,75 @@ const EmployeeProfile = () => {
|
||||
</div>
|
||||
<div className="w-100 d-flex flex-column justify-content-start">
|
||||
<div className="mt-3 w-100">
|
||||
<h6 className="mb-2 text-muted text-start">
|
||||
Employee Info
|
||||
</h6>
|
||||
<h6 className="mb-2 text-muted text-start">Employee Info</h6>
|
||||
<table className="table table-borderless mb-3">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td className="fw-medium text-start">Email:</td>
|
||||
<td className="text-start">
|
||||
{currentEmployee?.email || <em>NA</em>}
|
||||
</td>
|
||||
<td className="text-start">{currentEmployee?.email || <em>NA</em>}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="fw-medium text-start">
|
||||
Phone Number:
|
||||
</td>
|
||||
<td className="text-start">
|
||||
{currentEmployee?.phoneNumber || <em>NA</em>}
|
||||
</td>
|
||||
<td className="fw-medium text-start">Phone Number:</td>
|
||||
<td className="text-start">{currentEmployee?.phoneNumber || <em>NA</em>}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="fw-medium text-start">
|
||||
Emergency Contact Person:
|
||||
</td>
|
||||
<td className="text-start">
|
||||
{currentEmployee?.emergencyContactPerson || (
|
||||
<em>NA</em>
|
||||
)}
|
||||
</td>
|
||||
<td className="fw-medium text-start">Emergency Contact Person:</td>
|
||||
<td className="text-start">{currentEmployee?.emergencyContactPerson || <em>NA</em>}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="fw-medium text-start">
|
||||
Emergency Contact Number:
|
||||
</td>
|
||||
<td className="text-start">
|
||||
{currentEmployee?.emergencyPhoneNumber || (
|
||||
<em>NA</em>
|
||||
)}
|
||||
</td>
|
||||
<td className="fw-medium text-start">Emergency Contact Number:</td>
|
||||
<td className="text-start">{currentEmployee?.emergencyPhoneNumber || <em>NA</em>}</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td className="fw-medium text-start">Gender:</td>
|
||||
<td className="text-start">
|
||||
{currentEmployee?.gender || <em>NA</em>}
|
||||
</td>
|
||||
<td className="text-start">{currentEmployee?.gender || <em>NA</em>}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="fw-medium text-start">
|
||||
Birth Date:
|
||||
</td>
|
||||
<td className="text-start">
|
||||
{currentEmployee?.birthDate ? (
|
||||
new Date(
|
||||
currentEmployee.birthDate
|
||||
).toLocaleDateString()
|
||||
) : (
|
||||
<em>NA</em>
|
||||
)}
|
||||
</td>
|
||||
<td className="fw-medium text-start">Birth Date:</td>
|
||||
<td className="text-start">{currentEmployee?.birthDate ? new Date(currentEmployee.birthDate).toLocaleDateString() : <em>NA</em>}</td>
|
||||
</tr>
|
||||
|
||||
|
||||
<tr>
|
||||
<td className="fw-medium text-start">
|
||||
Joining Date:
|
||||
</td>
|
||||
<td className="text-start">
|
||||
{currentEmployee?.joiningDate ? (
|
||||
new Date(
|
||||
currentEmployee.joiningDate
|
||||
).toLocaleDateString()
|
||||
) : (
|
||||
<em>NA</em>
|
||||
)}
|
||||
</td>
|
||||
<td className="fw-medium text-start">Joining Date:</td>
|
||||
<td className="text-start">{currentEmployee?.joiningDate ? new Date(currentEmployee.joiningDate).toLocaleDateString() : <em>NA</em>}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="fw-medium text-start">
|
||||
Job Role:
|
||||
</td>
|
||||
<td className="text-start">
|
||||
{currentEmployee?.jobRole || <em>NA</em>}
|
||||
</td>
|
||||
<td className="fw-medium text-start">Job Role:</td>
|
||||
<td className="text-start">{currentEmployee?.jobRole || <em>NA</em>}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="fw-medium text-start">Address:</td>
|
||||
<td className="text-start">
|
||||
{currentEmployee?.currentAddress || <em>NA</em>}
|
||||
</td>
|
||||
<td className="text-start">{currentEmployee?.currentAddress || <em>NA</em>}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<button
|
||||
className="btn btn-primary btn-block"
|
||||
onClick={() =>
|
||||
navigate(`/employee/manage/${currentEmployee?.id}`)
|
||||
}
|
||||
>
|
||||
<button className="btn btn-primary btn-block" onClick={() => navigate(`/employee/manage/${currentEmployee?.id}`)}>
|
||||
Edit Profile
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-12 col-lg-8 order-2 order-lg-2 mb-4">
|
||||
<div className="row">
|
||||
<EmployeeNav
|
||||
onPillClick={handlePillClick}
|
||||
activePill={activePill}
|
||||
/>
|
||||
</div>
|
||||
<div className="card">
|
||||
<div className="row row-bordered g-0">{renderContent()}</div>
|
||||
<div className="col-12 col-lg-8 order-2 order-lg-2 mb-4">
|
||||
<div className="row">
|
||||
<EmployeeNav onPillClick={handlePillClick} activePill={activePill} />
|
||||
</div>
|
||||
<div className="card">
|
||||
<div className="row row-bordered g-0">
|
||||
{renderContent()}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@ -83,7 +83,7 @@ const MasterTable = ({ data, columns, loading, handleModalData }) => {
|
||||
currentItems.map((item, index) => (
|
||||
<tr key={index}>
|
||||
<td style={{ width: "20px" }}>
|
||||
<i className="bx bx-right-arrow-alt"></i>
|
||||
<i class="bx bx-right-arrow-alt"></i>
|
||||
</td>
|
||||
{updatedColumns.map((col) => (
|
||||
<td className="text-start mx-2" key={col.key}>
|
||||
|
||||
@ -21,7 +21,8 @@ axiosClient.interceptors.request.use(
|
||||
if (token) {
|
||||
config.headers["Authorization"] = `Bearer ${token}`;
|
||||
config._retry = true;
|
||||
} else {
|
||||
}
|
||||
else{
|
||||
config._retry = false;
|
||||
}
|
||||
}
|
||||
@ -36,6 +37,7 @@ axiosClient.interceptors.response.use(
|
||||
(response) => response,
|
||||
|
||||
async (error) => {
|
||||
|
||||
const originalRequest = error.config;
|
||||
|
||||
if (!originalRequest) {
|
||||
@ -83,13 +85,13 @@ axiosClient.interceptors.response.use(
|
||||
// else {
|
||||
// // showToast(error.response.data.message, "error"); // repeted toast
|
||||
// }
|
||||
if (error.response.status === 401) {
|
||||
if (error.response.status === 401 && !originalRequest._retry) {
|
||||
originalRequest._retry = true;
|
||||
try {
|
||||
// Get the refresh token from secure storage
|
||||
const refreshToken = localStorage.getItem("refreshToken");
|
||||
|
||||
if (!refreshToken || error.response.data.errors === "Invalid or expired refresh token.") {
|
||||
if (!refreshToken) {
|
||||
// Redirect to login if refresh token is not available
|
||||
redirectToLogin();
|
||||
return Promise.reject(error);
|
||||
@ -114,6 +116,7 @@ axiosClient.interceptors.response.use(
|
||||
// Retry the original request
|
||||
return axiosClient(originalRequest);
|
||||
} catch (err) {
|
||||
|
||||
// Redirect to login if token refresh fails
|
||||
redirectToLogin();
|
||||
return Promise.reject(err);
|
||||
@ -189,5 +192,5 @@ export const api = {
|
||||
};
|
||||
//export default axiosClient;
|
||||
function redirectToLogin() {
|
||||
window.location.href = "/auth/login";
|
||||
// window.location.href = "/auth/login";
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user