Merge branch 'Issue_Jun_1W' of https://git.marcoaiot.com/admin/marco.pms.web into pramod_Bug-#391

2025-06-02 23:29:52 +05:30 · 2025-06-02 23:29:52 +05:30 · 2b3558174e
commit 2b3558174e
parent 0d649fbc78 8c3b10f1cb
4 changed files with 238 additions and 211 deletions
--- a/src/components/Activities/AttendLogs.jsx
+++ b/src/components/Activities/AttendLogs.jsx
@ -2,12 +2,27 @@ import React, { useEffect, useState } from "react";
 import { useEmployeeAttendacesLog } from "../../hooks/useAttendance";
 import { convertShortTime } from "../../utils/dateUtils";
 import { useNavigate } from "react-router-dom";
+import { THRESH_HOLD } from "../../utils/constants";

 const AttendLogs = ({ Id }) => {
  const { logs, loading } = useEmployeeAttendacesLog(Id);
  const navigate = useNavigate();

-  const whichActivityPerform = (actvity) => {
+  const isCheckoutRegularized = (
+    activityTimeStr,
+    checkoutTimeStr,
+    threshHours
+  ) => {
+    if (!activityTimeStr || !checkoutTimeStr) return false;
+
+    const activityTime = new Date(activityTimeStr);
+    const checkoutTime = new Date(checkoutTimeStr);
+    const threshTimeMs = threshHours * 60 * 60 * 1000;
+
+    return checkoutTime - activityTime > threshTimeMs;
+  };
+
+  const whichActivityPerform = (actvity, checkOutTime) => {
    switch (actvity) {
      case 1:
        return (
@ -24,12 +39,12 @@ const AttendLogs = ({ Id }) => {
      case 2:
        return (
          <i
-            className="bx bx-help-circle text-secondary"
+            className="bx bx-help-circle text-danger"
            data-bs-toggle="tooltip"
            data-bs-offset="0,8"
            data-bs-placement="top"
            data-bs-custom-class="tooltip"
-            title="regularize Requested"
+            title="Regularize Requested"
          ></i>
        );
        break;
@ -41,27 +56,47 @@ const AttendLogs = ({ Id }) => {
            data-bs-offset="0,8"
            data-bs-placement="top"
            data-bs-custom-class="tooltip"
-            title="Regularized"
+            title="Request Deleted!"
          ></i>
        );
        break;
      case 4:
-        return (
-          <i
-            className="bx bx-left-arrow-circle text-danger "
-            data-bs-toggle="tooltip"
-            data-bs-offset="0,8"
-            data-bs-placement="top"
-            data-bs-custom-class="tooltip"
-            title="Check-Out"
-          ></i>
-        );
+        if (
+          checkOutTime &&
+          isCheckoutRegularized(
+            logs[0]?.activityTime,
+            checkOutTime,
+            THRESH_HOLD
+          )
+        ) {
+          return (
+            <i
+              className="bx bx-check-circle text-success"
+              data-bs-toggle="tooltip"
+              data-bs-offset="0,8"
+              data-bs-placement="top"
+              data-bs-custom-class="tooltip"
+              title="Regularized"
+            ></i>
+          );
+        } else {
+          return (
+            <i
+              className="bx bx-left-arrow-circle text-danger"
+              data-bs-toggle="tooltip"
+              data-bs-offset="0,8"
+              data-bs-placement="top"
+              data-bs-custom-class="tooltip"
+              title="Check-Out"
+            ></i>
+          );
+        }

        break;
      case 5:
        return (
          <i
-             className="bx bx-x-circle text-danger"
+            className="bx bx-x-circle text-danger"
            data-bs-toggle="tooltip"
            data-bs-offset="0,8"
            data-bs-placement="top"
@ -79,6 +114,7 @@ const AttendLogs = ({ Id }) => {
    const url = `https://www.google.com/maps?q=${lat},${lng}`;
    window.open(url, "_blank"); // Open in new tab
  };
+
  useEffect(() => {
    const tooltipTriggerList = Array.from(
      document.querySelectorAll('[data-bs-toggle="tooltip"]')
@ -122,11 +158,13 @@ const AttendLogs = ({ Id }) => {
                  <tr key={index}>
                    <td>{log.activityTime.slice(0, 10)}</td>
                    <td>{convertShortTime(log.activityTime)}</td>
-                    <td>{whichActivityPerform(log.activity)}</td>
+                    <td>
+                      {whichActivityPerform(log.activity, log.activityTime)}
+                    </td>
                    <td>
                      {log?.latitude != 0 ? (
                        <i
-                          className="bx bx-location-plus text-danger  cursor-pointer"
+                          className="bx bx-map text-danger  cursor-pointer"
                          data-bs-toggle="tooltip"
                          data-bs-offset="0,8"
                          data-bs-placement="top"
@ -146,7 +184,9 @@ const AttendLogs = ({ Id }) => {
                      }`}
                    </td>
                    <td className="text-wrap" colSpan={3}>
-                      {log?.comment || "--"}
+                      {log?.comment?.length > 50
+                        ? `${log.comment.slice(0, 50)}...`
+                        : log.comment || "--"}
                    </td>
                  </tr>
                ))}
--- a/src/components/Project/Infrastructure/WorkArea.jsx
+++ b/src/components/Project/Infrastructure/WorkArea.jsx
@ -6,11 +6,20 @@ import { useDispatch } from "react-redux";
 import { refreshData } from "../../../slices/localVariablesSlice";
 import ProjectRepository from "../../../repositories/ProjectRepository";
 import showToast from "../../../services/toastService";
+import {useHasUserPermission} from "../../../hooks/useHasUserPermission";
+import {ASSIGN_REPORT_TASK, MANAGE_PROJECT_INFRA, MANAGE_TASK} from "../../../utils/constants";
+import {useParams} from "react-router-dom";

 const WorkArea = ({ workArea, floor, forBuilding }) => {
  const [workItems, setWorkItems] = useState([]);
  const dispatch = useDispatch();
-  const [Project, setProject] = useState();
+  const [ Project, setProject ] = useState();
+  const {projectId} = useParams();
+ 
+    const ManageTasks = useHasUserPermission(MANAGE_TASK);
+    const ManageInfra = useHasUserPermission(MANAGE_PROJECT_INFRA);
+  const ManageAndAssignTak = useHasUserPermission( ASSIGN_REPORT_TASK );
+  

  useEffect(() => {
    const project = getCachedData("projectInfo");
@ -170,7 +179,7 @@ const WorkArea = ({ workArea, floor, forBuilding }) => {
                  className="accordion-collapse collapse"
                  aria-labelledby={`heading-${workArea.id}`}
                >
-                  <div className="accordion-body p-0">
+                  <div className="accordion-body px-1">
                    <table className="table table-sm mx-1">
                      <thead>
                        <tr>
@ -189,9 +198,11 @@ const WorkArea = ({ workArea, floor, forBuilding }) => {
                          <th className="infra-activity-table-header">
                            Progress
                          </th>
-                          <th className="infra-activity-table-header text-end">
-                            <span className="px-2">Actions</span>
-                          </th>
+                          {( ManageInfra || ( !projectId && ManageAndAssignTak  ) ) && (
+                            <th className="infra-activity-table-header text-end">
+                              <span className="px-2">Actions</span>
+                            </th>
+                          )}
                        </tr>
                      </thead>
                      <tbody className="table-border-bottom-0">
--- a/src/components/Project/Infrastructure/WorkItem.jsx
+++ b/src/components/Project/Infrastructure/WorkItem.jsx
@ -148,7 +148,7 @@ const WorkItem = ({
          <span className="fw-light">
            {hasWorkItem
              ? NewWorkItem?.workItem?.activityMaster?.activityName ||
-              workItem.activityMaster?.activityName
+                workItem.activityMaster?.activityName
              : "NA"}
          </span>
        </td>
@ -157,8 +157,8 @@ const WorkItem = ({
        <td className="text-center d-sm-table-cell d-md-none">
          {hasWorkItem
            ? NewWorkItem?.workItem?.completedWork ??
-            workItem?.completedWork ??
-            "NA"
+              workItem?.completedWork ??
+              "NA"
            : "NA"}
          /{" "}
          {hasWorkItem
@ -171,26 +171,28 @@ const WorkItem = ({
          <span className="fw-light">
            {hasWorkItem
              ? NewWorkItem?.workItem?.workCategoryMaster?.name ||
-              workItem.workCategoryMaster?.name ||
-              "NA"
+                workItem.workCategoryMaster?.name ||
+                "NA"
              : "NA"}
          </span>
        </td>

        <td className="text-center d-none d-md-table-cell">
-          {hasWorkItem ? (
-            `${NewWorkItem?.workItem?.completedWork ??
-            workItem?.completedWork ??
-            "0"}/${NewWorkItem?.workItem?.plannedWork ??
-            workItem?.plannedWork ??
-            "0"}`
-          ) : (
-            "NA"
-          )}
+          {hasWorkItem
+            ? `${
+                NewWorkItem?.workItem?.completedWork ??
+                workItem?.completedWork ??
+                "0"
+              }/${
+                NewWorkItem?.workItem?.plannedWork ??
+                workItem?.plannedWork ??
+                "0"
+              }`
+            : "NA"}
        </td>

        {/* Progress Bar - always visible */}
-        <td className="text-center" style={{ width: "15%" }}>
+        <td className="text-center " style={{ width: "15%" }}>
          <div className="progress p-0">
            <div
              className="progress-bar"
@ -199,7 +201,7 @@ const WorkItem = ({
                width: getProgress(
                  NewWorkItem?.workItem?.plannedWork || workItem?.plannedWork,
                  NewWorkItem?.workItem?.completedWork ||
-                  workItem?.completedWork
+                    workItem?.completedWork
                ),
                height: "5px",
              }}
@ -217,82 +219,90 @@ const WorkItem = ({
        </td>

        {/* Actions - always visible */}
-        <td className="text-end align-items-middle ">
-          {/* Desktop (md and up): inline icons */}
-          <div className="d-none d-md-flex justify-content-end gap-1 px-2">
-            {!projectId &&
-              ManageAndAssignTak &&
-              PlannedWork !== CompletedWork && (
-                <i
-                  className="bx bx-user-plus text-primary cursor-pointer"
-                  title="Assign"
-                  onClick={openModal}
-                  role="button"
-                ></i>
-              )}
-
-            {ManageInfra && (
-              <>
-                <i
-                  className="bx bxs-edit text-secondary cursor-pointer"
-                  title="Edit"
-                  onClick={showModal1}
-                  role="button"
-                ></i>
-                <i
-                  className="bx bx-trash text-danger cursor-pointer"
-                  title="Delete"
-                  onClick={showModalDelete}
-                  role="button"
-                ></i>
-              </>
-            )}
-          </div>
-
-          {/* Mobile (sm only): dropdown with icons */}
-          <div className="dropdown d-md-none text-center">
-            <i
-              className="bx bx-dots-vertical-rounded"
-              role="button"
-              data-bs-toggle="dropdown"
-              aria-expanded="false"
-              title="Actions"
-            ></i>
-
-            <ul className="dropdown-menu dropdown-menu-start">
-              {!projectId && ManageAndAssignTak && PlannedWork !== CompletedWork && (
-                <li>
-                  <a
-                    className="dropdown-item d-flex align-items-center"
+        {(ManageInfra ||
+          (!projectId &&
+            ManageAndAssignTak &&
+            PlannedWork !== CompletedWork)) && (
+          <td className="text-end align-items-middle border-top">
+            {/* Desktop (md and up): inline icons */}
+            <div className="d-none d-md-flex justify-content-end gap-1 px-2">
+              {!projectId &&
+                ManageAndAssignTak &&
+                PlannedWork !== CompletedWork && (
+                  <i
+                    className="bx bx-user-plus text-primary cursor-pointer"
+                    title="Assign"
                    onClick={openModal}
-                  >
-                    <i className="bx bx-user-plus text-primary me-2"></i> Assign
-                  </a>
-                </li>
-              )}
+                    role="button"
+                  ></i>
+                )}
+
              {ManageInfra && (
                <>
-                  <li>
-                    <a
-                      className="dropdown-item d-flex align-items-center"
-                      onClick={showModal1}
-                    >
-                      <i className="bx bxs-edit text-secondary me-2"></i> Edit
-                    </a>
-                  </li>
-                  <li>
-                    <a
-                      className="dropdown-item d-flex align-items-center"
-                      onClick={showModalDelete}
-                    >
-                      <i className="bx bx-trash text-danger me-2"></i> Delete
-                    </a>
-                  </li>
+                  <i
+                    className="bx bxs-edit text-secondary cursor-pointer"
+                    title="Edit"
+                    onClick={showModal1}
+                    role="button"
+                  ></i>
+                  <i
+                    className="bx bx-trash text-danger cursor-pointer"
+                    title="Delete"
+                    onClick={showModalDelete}
+                    role="button"
+                  ></i>
                </>
              )}
-            </ul>
-          </div>
-        </td>
+            </div>
+
+            {/* Mobile (sm only): dropdown with icons */}
+            <div className="dropdown d-md-none text-center">
+              <i
+                className="bx bx-dots-vertical-rounded"
+                role="button"
+                data-bs-toggle="dropdown"
+                aria-expanded="false"
+                title="Actions"
+              ></i>
+
+              <ul className="dropdown-menu dropdown-menu-start">
+                {!projectId &&
+                  ManageAndAssignTak &&
+                  PlannedWork !== CompletedWork && (
+                    <li>
+                      <a
+                        className="dropdown-item d-flex align-items-center"
+                        onClick={openModal}
+                      >
+                        <i className="bx bx-user-plus text-primary me-2"></i>{" "}
+                        Assign
+                      </a>
+                    </li>
+                  )}
+                {ManageInfra && (
+                  <>
+                    <li>
+                      <a
+                        className="dropdown-item d-flex align-items-center"
+                        onClick={showModal1}
+                      >
+                        <i className="bx bxs-edit text-secondary me-2"></i> Edit
+                      </a>
+                    </li>
+                    <li>
+                      <a
+                        className="dropdown-item d-flex align-items-center"
+                        onClick={showModalDelete}
+                      >
+                        <i className="bx bx-trash text-danger me-2"></i> Delete
+                      </a>
+                    </li>
+                  </>
+                )}
+              </ul>
+            </div>
+          </td>
+        )}
      </tr>
    </>
  );
--- a/src/hooks/useAttendanceStatus.js
+++ b/src/hooks/useAttendanceStatus.js
@ -1,17 +1,16 @@
-import { useEffect, useState } from "react";
-import { timeElapsed } from "../utils/dateUtils";
-import { useSelector } from "react-redux";
-import { THRESH_HOLD } from "../utils/constants";
+import { useEffect, useState } from 'react';
+import { timeElapsed } from '../utils/dateUtils'; // Make sure it calculates in hours
+import { THRESH_HOLD } from '../utils/constants';

+// THRESH_HOLD in hours (e.g., 12, 48, or 60)
 export const ACTIONS = {
  CHECK_IN: 0,
  CHECK_OUT: 1,
  REGULARIZATION: 2,
  REQUESTED: 3,
  APPROVED: 4,
-  REJECTED: 5,
+  REJECTED: 5
 };
-const now = new Date();

 const useAttendanceStatus = (attendanceData) => {
  const [status, setStatus] = useState({
@ -19,133 +18,100 @@ const useAttendanceStatus = (attendanceData) => {
    action: null,
    disabled: true,
    text: "Unknown",
-    color: "btn-secondary",
+    color: 'btn-secondary',
  });

  useEffect(() => {
    const { checkInTime, checkOutTime, activity } = attendanceData;
+    const now = new Date();

-    if (activity === 0 && checkInTime === null && checkOutTime === null) {
-      setStatus({
+    const isSameDay = (date1, date2) =>
+      new Date(date1).toDateString() === new Date(date2).toDateString();
+
+    // 1. No check-in/check-out yet → Allow Check-In
+    if (activity === 0 && !checkInTime && !checkOutTime) {
+      return setStatus({
        status: "Check-In",
        action: ACTIONS.CHECK_IN,
        disabled: false,
        text: "Check In",
-        color: "btn-primary",
+        color: 'btn-primary',
      });
-    } else if (activity === 4 && new Date(checkOutTime) < now) {
-      setStatus({
-        status: "Approved",
-        action: ACTIONS.APPROVED,
-        disabled: true,
-        text: "Approved",
-        color: "btn-success",
-      });
-    } else if (
-      activity === 0 &&
-      checkInTime === null &&
-      checkOutTime === null &&
-      !timeElapsed(checkInTime, THRESH_HOLD)
-    ) {
-      setStatus({
-        status: "Check-In",
-        action: ACTIONS.CHECK_IN,
-        disabled: false,
-        text: "Check In",
-        color: "btn-primary",
-      });
-    } else if (
-      activity === 0 &&
-      checkInTime !== null &&
-      checkOutTime === null &&
-      timeElapsed(checkInTime, THRESH_HOLD)
-    ) {
-      setStatus({
-        status: "Request Regularize",
-        action: ACTIONS.REGULARIZATION,
-        disabled: false,
-        text: "Regularizes",
-        color: "btn-warning",
-      });
-    } else if (
-      activity === 1 &&
-      checkInTime !== null &&
-      checkOutTime === null &&
-      !timeElapsed(checkInTime, THRESH_HOLD)
-    ) {
-      setStatus({
-        status: "Check-Out",
-        action: ACTIONS.CHECK_OUT,
-        disabled: false,
-        text: "Check Out",
-        color: "btn-primary",
-      });
-    } else if (
-      activity === 1 &&
-      checkInTime !== null &&
-      checkOutTime === null &&
-      timeElapsed(checkInTime, THRESH_HOLD)
-    ) {
-      setStatus({
-        status: "Request Regularize",
-        action: ACTIONS.REGULARIZATION,
-        disabled: false,
-        text: "Regularize",
-        color: "btn-warning",
-      });
-    } else if (
-      activity === 4 &&
-      checkInTime !== null &&
-      checkOutTime !== null &&
-      !timeElapsed(checkInTime, THRESH_HOLD)
-    ) {
-      if (
-        activity === 4 &&
-        checkInTime !== null &&
-        checkOutTime !== null &&
-        new Date(checkOutTime).toDateString() !== new Date().toDateString()
-      ) {
-        setStatus({
+    }
+
+    // 2. Checked in, no checkout yet
+    if (checkInTime && !checkOutTime) {
+      if (timeElapsed(checkInTime, THRESH_HOLD)) {
+        return setStatus({
+          status: "Request Regularize",
+          action: ACTIONS.REGULARIZATION,
+          disabled: false,
+          text: "Regularize",
+          color: 'btn-warning',
+        });
+      } else {
+        return setStatus({
+          status: "Check-Out",
+          action: ACTIONS.CHECK_OUT,
+          disabled: false,
+          text: "Check Out",
+          color: 'btn-primary',
+        });
+      }
+    }
+
+    // 3. Already checked in and out → Handle activity === 4 (Approved)
+    if (checkInTime && checkOutTime && activity === 4) {
+      if (!isSameDay(checkOutTime, now) && !timeElapsed(checkOutTime, THRESH_HOLD)) {
+        return setStatus({
          status: "Approved",
          action: ACTIONS.APPROVED,
          disabled: true,
          text: "Approved",
-          color: "btn-success",
+          color: 'btn-success',
        });
-      } else {
-        setStatus({
+      } else if (isSameDay(checkOutTime, now)) {
+        return setStatus({
          status: "Check-In",
          action: ACTIONS.CHECK_IN,
          disabled: false,
          text: "Check In",
-          color: "btn-primary",
+          color: 'btn-primary',
        });
      }
-    } else if (activity === 2 && checkInTime !== null) {
-      setStatus({
+    }
+
+    // 4. Regularization Requested
+    if (activity === 2) {
+      return setStatus({
        status: "Requested",
        action: ACTIONS.REQUESTED,
        disabled: true,
        text: "Requested",
-        color: "btn-info",
+        color: 'btn-info',
      });
-    } else if (activity === 5 && checkInTime !== null) {
-      setStatus({
+    }
+
+    // 5. Rejected Regularization
+    if (activity === 5) {
+      return setStatus({
        status: "Rejected",
        action: ACTIONS.REJECTED,
        disabled: true,
        text: "Rejected",
-        color: "btn-danger",
-      });
-    } else {
-      setStatus({
-        status: "Approved",
-        action: ACTIONS.APPROVED,
-        disabled: true,
-        text: "Approved",
-        color: "btn-success",
+        color: 'btn-danger',
      });
    }
+
+    // Default to Approved if none of the above apply
+    return setStatus({
+      status: "Approved",
+      action: ACTIONS.APPROVED,
+      disabled: true,
+      text: "Approved",
+      color: 'btn-success',
+    });
+
  }, [attendanceData]);

  return status;