added activity icons, location coulms. if click on location it move on google map

handled loading properly
only display pagination if have data greather than 5
2025-05-06 23:13:55 +05:30 · 2025-05-06 23:12:08 +05:30 · 2025-05-06 22:58:27 +05:30 · 2025-05-06 22:53:53 +05:30 · 2025-05-06 22:52:59 +05:30 · 2025-05-06 22:31:42 +05:30
8 changed files with 193 additions and 114 deletions
--- a/src/components/Activities/AttendLogs.jsx
+++ b/src/components/Activities/AttendLogs.jsx
@ -1,80 +1,155 @@
-import React, { useEffect, useState } from 'react'
-import { useEmployeeAttendacesLog } from '../../hooks/useAttendance';
-import { convertShortTime } from '../../utils/dateUtils';
-
+import React, { useEffect, useState } from "react";
+import { useEmployeeAttendacesLog } from "../../hooks/useAttendance";
+import { convertShortTime } from "../../utils/dateUtils";
+import { useNavigate } from "react-router-dom";

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

-  const {logs, loading} = useEmployeeAttendacesLog( Id )
-
-  const whichActivityPerform = ( actvity ) =>
-  {
+  const whichActivityPerform = (actvity) => {
    switch (actvity) {
      case 1:
-        return "IN"
+        return (
+          <i
+            className="bx bx-right-arrow-circle text-success"
+            data-bs-toggle="tooltip"
+            data-bs-offset="0,8"
+            data-bs-placement="top"
+            data-bs-custom-class="tooltip"
+            title="Check-In"
+          ></i>
+        );
        break;
-        case 2:
-          return "Requested"
+      case 2:
+        return (
+          <i
+            className="bx bx-help-circle text-secondary"
+            data-bs-toggle="tooltip"
+            data-bs-offset="0,8"
+            data-bs-placement="top"
+            data-bs-custom-class="tooltip"
+            title="regularize Requested"
+          ></i>
+        );
        break;
-        case 3:
-          return "Deleted"
+      case 3:
+        return (
+          <i
+            className="bx bx-x-circle text-danger"
+            data-bs-toggle="tooltip"
+            data-bs-offset="0,8"
+            data-bs-placement="top"
+            data-bs-custom-class="tooltip"
+            title="Request Rejected"
+          ></i>
+        );
        break;
-        case 4:
-          return "OUT"
+      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>
+        );
+
+        break;
+      case 5:
+        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>
+        );
        break;
-        case 5:
-          return "Regularized"
-          break;

      default:
        break;
    }
-  }
-
+  };
+  const LocationLink = (lat, lng) => {
+    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"]')
+    );
+    tooltipTriggerList.forEach((el) => new bootstrap.Tooltip(el));
+  }, []);
  return (
    <div className="table-responsive">
-    {loading && <p>Loading..</p>}
-      { logs && logs.length > 0 && (
-        <>
-        <div className="d-flex justify-content-start align-items-center gap-2 my-1">
-        <div className="align-item-center">
-          <p className="p-0 m-0">Date : {logs[0].activityTime.slice(0,10)} </p>
-        </div>
+      <div className="text-start">
+        {logs && !loading && (
+          <p>
+            Attendance for{" "}
+            {logs[0]?.employee?.firstName + " " + logs[0]?.employee?.lastName}{" "}
+            on {logs[0]?.activityTime.slice(0, 10)}{" "}
+          </p>
+        )}
      </div>
+      {loading && <p>Loading..</p>}
+      {logs && logs.length > 0 && (
+        <>
+          <div className="d-flex justify-content-start align-items-center gap-2 my-1">
+            <div className="align-item-center"></div>
+          </div>

-      <table className="table table-sm mb-0">
-        <thead>
-          <tr>
-                <th style={{width: '15%'}}>Time</th>
-                <th style={{ width: '20%' }}>Activity</th>
-            <th style={{ width: '20%' }}>Date</th>
-            <th style={{ width: '45%' }}>Description</th>
-          </tr>
-        </thead>
-        <tbody>
+          <table className="table table-sm mb-0">
+            <thead>
+              <tr>
+                <th style={{ width: "20%" }}>Date</th>
+                <th style={{ width: "15%" }}>Time</th>
+                <th style={{ width: "20%" }}>Activity</th>
+                <th style={{ width: "20%" }}>Location</th>
+                <th style={{ width: "45%" }}>Description</th>
+              </tr>
+            </thead>
+            <tbody>
              {logs
                .slice()
                .sort((a, b) => b.id - a.id)
                .map((log, index) => (
                  <tr key={index}>
-                    <td>{convertShortTime( log.activityTime )}</td>
-                    <td>{whichActivityPerform(log.activity)}</td>
                    <td>{log.activityTime.slice(0, 10)}</td>
+                    <td>{convertShortTime(log.activityTime)}</td>
+                    <td>{whichActivityPerform(log.activity)}</td>
+                    <td>
+                      {log?.latitude != 0 ? (
+                        <i
+                          class="bx bx-location-plus text-warning  cursor-pointer"
+                          data-bs-toggle="tooltip"
+                          data-bs-offset="0,8"
+                          data-bs-placement="top"
+                          data-bs-custom-class="tooltip"
+                          title="Location"
+                          onClick={() =>
+                            LocationLink(log?.latitude, log?.longitude)
+                          }
+                        ></i>
+                      ) : (
+                        "--"
+                      )}
+                    </td>
                    <td className="text-wrap" colSpan={3}>
                      {log?.comment}
                    </td>
                  </tr>
                ))}
            </tbody>
-      </table>
+          </table>
        </>
-      )
-    }
-
+      )}
    </div>
  );
 };

 export default AttendLogs;
-
-
--- a/src/components/Activities/AttendcesLogs.jsx
+++ b/src/components/Activities/AttendcesLogs.jsx
@ -65,7 +65,8 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
        })
      );
    }
-  }, [dateRange, projectId, isRefreshing]);
+  }, [ dateRange, projectId, isRefreshing ] );
+  
  
  return (
    <>
@ -82,12 +83,13 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
              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>
@ -107,14 +109,7 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
            </thead>
            <tbody>
              {loading && <td colSpan={5}>Loading...</td>}
-              {error && <td colSpan={5}>{error}</td>}
-              {data && data.length === 0 && (
-                <tr>
-                  <td colSpan={5}>No Data Found</td>
-                </tr>
-              )}
-
-              {currentItems?.map((attendance, index) => (
+              {currentItems?.map( ( attendance, index ) => (
                <tr key={index}>
                  <td colSpan={2}>
                    <div className="d-flex justify-content-start align-items-center">
@ -133,12 +128,12 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
                  </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>
                  <td className="text-center">
@ -150,12 +145,14 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
                    />
                  </td>
                </tr>
-              ))}
+              ) )}
            </tbody>
          </table>
-        ) : (
+        ) }
+        {(!loading && data.length === 0) &&
          <span>No employee logs</span>
-        )}
+        }
+       {error && <td colSpan={5}>{error}</td>}           
      </div>
      {!loading && (
              <nav aria-label="Page ">
@ -201,7 +198,7 @@ const AttendanceLog = ({ handleModalData, projectId }) => {
                  </li>
                </ul>
              </nav>
-            )}
+      )}
    </>
  );
 };
--- a/src/components/Project/Infrastructure/EditActivityModal.jsx
+++ b/src/components/Project/Infrastructure/EditActivityModal.jsx
@ -141,7 +141,9 @@ const EditActivityModal = ({
            data: newProject,
          });
          resetForm();
-          dispatch(refreshData(true));
+          dispatch( refreshData( true ) );
+          showToast("Activity Updated Successfully","success")
+
          onClose();
        }
      })
--- a/src/hooks/useEmployees.js
+++ b/src/hooks/useEmployees.js
@ -16,7 +16,8 @@ export const useAllEmployees = () => {
        setLoading(true);
        const response = await EmployeeRepository.getAllEmployeeList();
        cacheData("AllEmployees", response.data);
-        setEmployeeList(response.data);
+        setEmployeeList( response.data );
+        setLoading(false);
      } else {
        setEmployeeList(EmployeeList_cached);
        setLoading(false);
--- a/src/pages/Activities/AttendancePage.jsx
+++ b/src/pages/Activities/AttendancePage.jsx
@ -93,12 +93,14 @@ const AttendancePage = () => {
  }, [modelConfig, isCreateModalOpen]);
  useEffect(() => {
    setAttendances(attendance);
-  }, [attendance]);
-useEffect(()=>{
-  if(selectedProject == 1){
-    dispatch(setProjectId(loginUser?.projects[0]))
-  }
-},[selectedProject,loginUser?.projects])
+  }, [ attendance ] );
+  
+
+  useEffect(() => {
+    if (selectedProject === 1 || selectedProject === undefined ) {
+      dispatch(setProjectId(loginUser?.projects[0]));
+    }
+  }, [selectedProject, loginUser?.projects]);
  return (
    <>
      {isCreateModalOpen && modelConfig && (
@ -158,7 +160,6 @@ useEffect(()=>{
                  </select>
                </label>
              )}
-            
            </div>
          </ul>
          <ul className="nav nav-tabs" role="tablist">
@ -203,13 +204,18 @@ useEffect(()=>{
            {!projectLoading && !attendances && <span>Not Found</span>}

            {activeTab === "all" && (
-              <div className="tab-pane fade show active py-0">
-                <Attendance
-                  attendance={attendances}
-                  handleModalData={handleModalData}
-                  getRole={getRole}
-                />
-              </div>
+              <>
+                {!projectLoading && attendances.length === 0 && (
+                  <p>No Employee assigned yet.</p>
+                )}
+                <div className="tab-pane fade show active py-0">
+                  <Attendance
+                    attendance={attendances}
+                    handleModalData={handleModalData}
+                    getRole={getRole}
+                  />
+                </div>
+              </>
            )}

            {activeTab === "logs" && (
--- a/src/pages/Activities/DailyTask.jsx
+++ b/src/pages/Activities/DailyTask.jsx
@ -32,9 +32,7 @@ const DailyTask = () => {
  // Sync projectId (either from URL or pick first accessible one)
  useEffect(() => {
    if (!project_lodaing && projects.length > 0 && !initialized) {
-      if (projectId) {
-        dispatch(setProjectId(projectId));
-      } else if (!selectedProject) {
+     if (selectedProject === 1 || selectedProject === undefined) {
        dispatch(setProjectId(projects[0].id));
      }

@ -77,7 +75,6 @@ const DailyTask = () => {
    selectTask(task);
    openModal();
  };
-
  return (
    <>
      <div
@ -160,21 +157,26 @@ const DailyTask = () => {
                  </tr>
                </thead>
                <tbody className="table-border-bottom-0">
-                  {TaskLists?.length === 0 && !task_loading && (
-                    <tr>
-                      <td colSpan={7} className="text-center">
-                        No Task Found
-                      </td>
-                    </tr>
-                  )}

-                  {task_loading && (
+                {task_loading && (
                    <tr>
                      <td colSpan={7} className="text-center">
                        <p>Loading..</p>
                      </td>
                    </tr>
                  )}
+                  {project_lodaing &&  <tr>
+                      <td colSpan={7} className="text-center">
+                        Loading...
+                      </td>
+                    </tr>}
+                  {TaskLists?.length === 0 && !task_loading && !project_lodaing &&(
+                    <tr>
+                      <td colSpan={7} className="text-center">
+                        No Task Found
+                      </td>
+                    </tr>
+                  )}

                  {TaskLists.map((task, index) => {
                    return (
--- a/src/pages/employee/AttendancesEmployeeRecords.jsx
+++ b/src/pages/employee/AttendancesEmployeeRecords.jsx
@ -84,7 +84,7 @@ const AttendancesEmployeeRecords = ({ employee }) => {
        })
      );
    }
-  }, [dateRange, employee]);
+  }, [dateRange, employee,isRefreshing]);

  const openModal = (id) => {
    setAttendanecId(id);
@ -132,14 +132,20 @@ const AttendancesEmployeeRecords = ({ employee }) => {
            <i
              className={`bx bx-refresh cursor-pointer fs-4 ${
                loading ? "spin" : ""
-              }`}
+                }`}
+              data-toggle="tooltip" 
              title="Refresh"
              onClick={() => setIsRefreshing(!isRefreshing)}
            />
          </div>
        </div>
        <div className="table-responsive text-nowrap">
-          {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>
@ -159,15 +165,7 @@ const AttendancesEmployeeRecords = ({ employee }) => {
                </tr>
              </thead>
              <tbody>
-                {loading && <td colSpan={5}>Loading...</td>}
-                {error && <td colSpan={5}>{error}</td>}
-                {data && data.length === 0 && (
-                  <tr>
-                    <td colSpan={5}>No Data Found</td>
-                  </tr>
-                )}
-
-                {currentItems?.map((attendance, index) => (
+                {currentItems?.map( ( attendance, index ) => (
                  <tr key={index}>
                    <td colSpan={2}>
                      <div className="d-flex justify-content-start align-items-center">
@ -186,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>

@ -202,20 +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>
-          ) : (
-            <span>No employee logs</span>
-          )}
+          ) } 
        </div>
-        {!loading && (
+        {(!loading && data.length  > 5) && (
          <nav aria-label="Page ">
            <ul className="pagination pagination-sm justify-content-end py-1">
              <li
--- a/src/pages/master/MasterTable.jsx
+++ b/src/pages/master/MasterTable.jsx
@ -143,7 +143,7 @@ const MasterTable = ({ data, columns, loading, handleModalData }) => {
      )}

      {/* Pagination */}
-      {!loading && (
+      {!loading && safeData.length  > 20 && (
        <nav aria-label="Page ">
          <ul className="pagination pagination-sm justify-content-end py-1">
            <li className={`page-item ${currentPage === 1 ? "disabled" : ""}`}>
Author	SHA1	Message	Date
Pramod Mahajan	d48c6fd7e3	added activity icons, location coulms. if click on location it move on google map	2025-05-06 23:13:55 +05:30
Pramod Mahajan	9802746267	handled loading properly	2025-05-06 23:12:08 +05:30
Pramod Mahajan	7ef148ac32	only display pagination if have data greather than 5	2025-05-06 22:58:27 +05:30
Pramod Mahajan	8696070249	pagination only display if have records greather than 20	2025-05-06 22:53:53 +05:30
Pramod Mahajan	099a3bcc36	handled proper loading, pagination only display if record have greather than 5 and added refresh button	2025-05-06 22:52:59 +05:30
Pramod Mahajan	6f81b99dcd	Merge branch 'Issue_May_2W' of https://git.marcoaiot.com/admin/marco.pms.web into pramod_Task#185	2025-05-06 22:31:42 +05:30
Vikas Nale	2482a79f9c	Merge pull request 'Trigger the message after a successfully updated Activity' (#67 ) from pramod_enhance#168 into Issue_May_2W Reviewed-on: #67	2025-05-06 12:52:13 +00:00
Pramod Mahajan	1bcc534308	added toast for success msg	2025-05-06 12:52:13 +00:00
Vikas Nale	321b73e2c0	Merge pull request 'show correct message after all employees are assigned to a project' (#65 ) from pramod_Bug#177 into Issue_May_2W Reviewed-on: #65	2025-05-06 12:47:27 +00:00
Pramod Mahajan	f45febb82c	show correct message after all employees are assigned to a project - fixed issue where loader spinner stayed active after API call - added setLoading(false) in useAllEmployee hook after API call - now message All employee assigned to Project." shows properly	2025-05-06 12:47:27 +00:00
Vikas Nale	ff9818fb3c	Merge pull request 'after refresh attednace page, now it able get employee default selectedproject.' (#63 ) from pramod_Bug#178 into Issue_May_2W Reviewed-on: #63	2025-05-06 12:45:19 +00:00
Pramod Mahajan	174b3f3bee	removed console	2025-05-06 12:45:19 +00:00
Pramod Mahajan	1a651ac5bc	after refresh attednace page, now it able get employee default selectedproject.	2025-05-06 12:45:19 +00:00
Vikas Nale	7bb7b37b60	Merge pull request 'Resolve data loading issue in DailyTask by defaulting to first project' (#64 ) from pramod_Bug#184 into Issue_May_2W Reviewed-on: #64	2025-05-06 12:19:42 +00:00
Pramod Mahajan	8483114f4d	set selectedProject on page refresh in DailyTask.jsx - added fallback logic to select first project if selectedProject is undefined or 1 - used initialized flag to prevent multiple dispatches	2025-05-06 11:00:13 +05:30