diff --git a/src/components/Project/ProjectCardView.jsx b/src/components/Project/ProjectCardView.jsx index cb44fd2a..3c439fbc 100644 --- a/src/components/Project/ProjectCardView.jsx +++ b/src/components/Project/ProjectCardView.jsx @@ -8,7 +8,12 @@ const ProjectCardView = ({ data, currentPage, totalPages, paginate }) => { return (
{data?.length === 0 && ( -

No projects found.

+
+

No Infra projects found.

+
)} {data?.map((project) => ( diff --git a/src/components/Project/ProjectListView.jsx b/src/components/Project/ProjectListView.jsx index 2741801e..9d0c6acb 100644 --- a/src/components/Project/ProjectListView.jsx +++ b/src/components/Project/ProjectListView.jsx @@ -126,8 +126,8 @@ const ProjectListView = ({ data, currentPage, totalPages, paginate }) => { return (
-
- +
+
{projectColumns.map((col) => ( @@ -143,77 +143,94 @@ const ProjectListView = ({ data, currentPage, totalPages, paginate }) => { - {data?.map((project) => ( - - {projectColumns.map((col) => ( - - ))} - + {projectColumns.map((col) => ( + + ))} + + + )) + ) : ( + + - ))} + )}
- {col.getValue - ? col.getValue(project) - : project[col.key] || "N/A"} - -
-
- - -
    -
  • - - - View details - -
    • + {col.getValue + ? col.getValue(project) + : project[col.key] || "N/A"} +
+ +
  • + + setMangeProject({ + isOpen: true, + Project: project.id, + }) + } + > + + Modify + +
    • +
  • handleViewActivities(project.id)}> + + + Activities + +
    • + + +
    + No Infra projects available
    diff --git a/src/components/ServiceProject/ServiceProjectTeam/ServiceProjectCard.jsx b/src/components/ServiceProject/ServiceProjectTeam/ServiceProjectCard.jsx index e6f39b36..21f77a4a 100644 --- a/src/components/ServiceProject/ServiceProjectTeam/ServiceProjectCard.jsx +++ b/src/components/ServiceProject/ServiceProjectTeam/ServiceProjectCard.jsx @@ -26,13 +26,6 @@ const ServiceProjectCard = ({ project, isCore = true }) => { const ManageProject = useHasUserPermission(MANAGE_PROJECT); const { setMangeProject, setManageServiceProject } = useProjectContext(); - const getProgress = (planned, completed) => { - return (completed * 100) / planned + "%"; - }; - const getProgressInNumber = (planned, completed) => { - return (completed * 100) / planned; - }; - const handleClose = () => setShowModal(false); const handleViewProject = () => { @@ -43,10 +36,6 @@ const ServiceProjectCard = ({ project, isCore = true }) => { navigate(`/service-projects/${project.id}`); } }; - const handleViewActivities = () => { - dispatch(setProjectId(project.id)); - navigate(`/activities/records?project=${project.id}`); - }; const handleManage = () => { if (isCore) { setMangeProject({ @@ -68,6 +57,8 @@ const ServiceProjectCard = ({ project, isCore = true }) => { DeleteProject(projectId, false); }; + + return ( <> { Modify - {isCore && ( -
  • - - - Activities - -
    • - )} {!isCore && (
  • diff --git a/src/components/ServiceProject/ServiceProjectTeam/ServiceProjectList.jsx b/src/components/ServiceProject/ServiceProjectTeam/ServiceProjectList.jsx new file mode 100644 index 00000000..b86d4939 --- /dev/null +++ b/src/components/ServiceProject/ServiceProjectTeam/ServiceProjectList.jsx @@ -0,0 +1,209 @@ +import React, { useState } from "react"; +import { MANAGE_PROJECT, PROJECT_STATUS } from "../../../utils/constants"; +import { useProjects } from "../../../hooks/useProjects"; +import { formatNumber, formatUTCToLocalTime } from "../../../utils/dateUtils"; +import ProgressBar from "../../common/ProgressBar"; +import { + getProjectStatusColor, + getProjectStatusName, +} from "../../../utils/projectStatus"; +import { useDispatch } from "react-redux"; +import { setProjectId } from "../../../slices/localVariablesSlice"; +import { useNavigate } from "react-router-dom"; +import { useHasUserPermission } from "../../../hooks/useHasUserPermission"; +import { useProjectContext } from "../../../pages/project/ProjectPage"; +import usePagination from "../../../hooks/usePagination"; +import Pagination from "../../common/Pagination"; + +const ServiceProjectList = ({ + data, + currentPage, + totalPages, + paginate, + isCore = true, +}) => { + const dispatch = useDispatch(); + const navigate = useNavigate(); + const { setMangeProject, setManageServiceProject } = useProjectContext(); + const handleClose = () => setShowModal(false); + + // check Permissions + const canManageProject = useHasUserPermission(MANAGE_PROJECT); + + const projectColumns = [ + { + key: "projectName", + label: "Project Name", + className: "text-start py-3", + getValue: (p) => ( +
    { + dispatch(setProjectId(p.id)); + navigate(`/service-projects/${p.id}`); + }} + > + {p.shortName ? `${p.name} (${p.shortName})` : p.name} +
    + ), + }, + { + key: "client.contactPerson", + label: "Contact Person", + className: "text-start small", + getValue: (p) => p.client?.contactPerson || "N/A", + }, + { + key: "assignedDate", + label: "Assign Date", + className: "text-center small", + getValue: (p) => formatUTCToLocalTime(p.assignedDate), + }, + { + key: "status", + label: "Status", + className: "text-center small", + getValue: (p) => ( + + {p.status?.status} + + ), + }, + ]; + + const handleViewProject = (p) => { + if (isCore) { + dispatch(setProjectId(p.id)); + navigate(`/projects/details`); + } else { + navigate(`/service-projects/${p.id}`); + } + }; + + const handleManage = (p) => { + if (isCore) { + setMangeProject({ + isOpen: true, + Project: p.id, + }); + } else { + setManageServiceProject({ + isOpen: true, + project: p.id, + }); + } + }; + + return ( +
    +
    +
    + + + + {projectColumns.map((col) => ( + + ))} + + + + + {data?.length > 0 ? ( + data.map((project) => ( + + {projectColumns.map((col) => ( + + ))} + + + )) + ) : ( + + + + )} + +
    + {col.label} + Action
    + {col.getValue + ? col.getValue(project) + : project[col.key] || "N/A"} + + +
    + No Service projects available +
    +
    + + +
    +
    + ); +}; + +export default ServiceProjectList; diff --git a/src/hooks/useProjects.js b/src/hooks/useProjects.js index 75467399..973d8b94 100644 --- a/src/hooks/useProjects.js +++ b/src/hooks/useProjects.js @@ -20,14 +20,15 @@ export const useCurrentService = () => { // ------------------------------Query------------------- -export const useProjects = (pageSize, pageNumber) => { +export const useProjects = (pageSize, pageNumber,searchString) => { const loggedUser = useSelector((store) => store.globalVariables.loginUser); return useQuery({ - queryKey: ["ProjectsList", pageSize, pageNumber], + queryKey: ["ProjectsList", pageSize, pageNumber,searchString], queryFn: async () => { const response = await ProjectRepository.getProjectList( pageSize, - pageNumber + pageNumber, + searchString, ); return response?.data; }, diff --git a/src/hooks/useServiceProject.jsx b/src/hooks/useServiceProject.jsx index 82bc5713..9319181a 100644 --- a/src/hooks/useServiceProject.jsx +++ b/src/hooks/useServiceProject.jsx @@ -8,13 +8,14 @@ import { ServiceProjectRepository } from "../repositories/ServiceProjectReposito import showToast from "../services/toastService"; //#region Service Project -export const useServiceProjects = (pageSize, pageNumber) => { +export const useServiceProjects = (pageSize, pageNumber, searchString) => { return useQuery({ - queryKey: ["serviceProjects", pageSize, pageNumber], + queryKey: ["serviceProjects", pageSize, pageNumber, searchString], queryFn: async () => { const response = await ServiceProjectRepository.GetServiceProjects( pageSize, - pageNumber + pageNumber, + searchString ); return response.data; }, diff --git a/src/pages/ServiceProject/ServiceProjectDisplay.jsx b/src/pages/ServiceProject/ServiceProjectDisplay.jsx index 1d59f1f2..6bb9299d 100644 --- a/src/pages/ServiceProject/ServiceProjectDisplay.jsx +++ b/src/pages/ServiceProject/ServiceProjectDisplay.jsx @@ -11,14 +11,18 @@ import GlobalModel from "../../components/common/GlobalModel"; import ManageServiceProject from "../../components/ServiceProject/ManageServiceProject"; import { SpinnerLoader } from "../../components/common/Loader"; import ServiceProjectCard from "../../components/ServiceProject/ServiceProjectTeam/ServiceProjectCard"; +import ServiceProjectList from "../../components/ServiceProject/ServiceProjectTeam/ServiceProjectList"; +import { useDebounce } from "../../utils/appUtils"; -const ServiceProjectDisplay = ({ listView ,selectedStatuses }) => { +const ServiceProjectDisplay = ({ listView, selectedStatuses, searchTerm }) => { const [currentPage, setCurrentPage] = useState(1); const { manageServiceProject, setManageServiceProject } = useProjectContext(); + const debouncedSearch = useDebounce(searchTerm, 500); const { data, isLoading, isError, error } = useServiceProjects( ITEMS_PER_PAGE, - currentPage + currentPage, + debouncedSearch ); const paginate = (page) => { if (page >= 1 && page <= (data?.totalPages ?? 1)) { @@ -47,15 +51,20 @@ const ServiceProjectDisplay = ({ listView ,selectedStatuses }) => {
    • ); return ( -
    +
    +
    {listView ? ( -

    List

    - ) : ( + + ) : filteredProjects?.length > 0 ? ( filteredProjects?.map((project) => ( )) - - )} + + ):(

    No Service projects available

    )}
    { )}
    +
    ); }; diff --git a/src/pages/project/ProjectPage.jsx b/src/pages/project/ProjectPage.jsx index d9557f48..f72b995c 100644 --- a/src/pages/project/ProjectPage.jsx +++ b/src/pages/project/ProjectPage.jsx @@ -41,10 +41,11 @@ const ProjectPage = () => { const [listView, setListView] = useState(false); const [searchTerm, setSearchTerm] = useState(""); const [coreProjects, setCoreProjects] = useState(() => { - const storedValue = sessionStorage.getItem('whichProjectDisplay'); - return storedValue === 'true'; + const storedValue = sessionStorage.getItem("whichProjectDisplay"); + return storedValue === "true"; }); const HasManageProject = useHasUserPermission(MANAGE_PROJECT); + const [currentPage, setCurrentPage] = useState(1); const [selectedStatuses, setSelectedStatuses] = useState( PROJECT_STATUS.map((s) => s.id) @@ -64,13 +65,11 @@ const ProjectPage = () => { manageServiceProject, }; - const handleToggleProject = (value) => { setCoreProjects(value); sessionStorage.setItem("whichProjectDisplay", String(value)); }; - return (
    @@ -90,8 +89,9 @@ const ProjectPage = () => { {/* Service Project Button */} -
    - {/* RIGHT SIDE — SEARCH + CARD/LIST + DROPDOWN */}
    - {/* Search */}
    {
    - {coreProjects ? : } + {coreProjects ? ( + + ) : ( + + )}
    ); diff --git a/src/pages/project/ProjectsDisplay.jsx b/src/pages/project/ProjectsDisplay.jsx index db3deaec..d01228c8 100644 --- a/src/pages/project/ProjectsDisplay.jsx +++ b/src/pages/project/ProjectsDisplay.jsx @@ -10,6 +10,7 @@ import { useServiceProjects } from "../../hooks/useServiceProject"; import { ITEMS_PER_PAGE, PROJECT_STATUS } from "../../utils/constants"; import usePagination from "../../hooks/usePagination"; import ManageProjectInfo from "../../components/Project/ManageProjectInfo"; +import { useDebounce } from "../../utils/appUtils"; const ProjectsDisplay = ({ listView, @@ -26,8 +27,8 @@ const ProjectsDisplay = ({ } = useProjectContext(); const [projectList, setProjectList] = useState([]); - - const { data, isLoading, isError, error } = useProjects(ITEMS_PER_PAGE, 1); + const debouncedSearch = useDebounce(searchTerm, 500); + const { data, isLoading, isError, error } = useProjects(ITEMS_PER_PAGE, 1, debouncedSearch); const filteredProjects = data?.data?.filter((project) => { @@ -98,7 +99,7 @@ const ProjectsDisplay = ({ ); return ( -
    +
    {listView ? ( - api.get(`/api/project/list?pageSize=${pageSize}&pageNumber=${pageNumber}`), + getProjectList: (pageSize, pageNumber,searchString) => + api.get(`/api/project/list?pageSize=${pageSize}&pageNumber=${pageNumber}&searchString=${searchString}`), getProjectByprojectId: (projetid) => api.get(`/api/project/details/${projetid}`), diff --git a/src/repositories/ServiceProjectRepository.jsx b/src/repositories/ServiceProjectRepository.jsx index f043bcc0..ff3b9d3b 100644 --- a/src/repositories/ServiceProjectRepository.jsx +++ b/src/repositories/ServiceProjectRepository.jsx @@ -4,9 +4,9 @@ import { api } from "../utils/axiosClient"; export const ServiceProjectRepository = { //#region Service Project CreateServiceProject: (data) => api.post("/api/ServiceProject/create", data), - GetServiceProjects: (pageSize, pageNumber) => + GetServiceProjects: (pageSize, pageNumber,searchString) => api.get( - `/api/ServiceProject/list?pageSize=${pageSize}&pageNumber=${pageNumber}` + `/api/ServiceProject/list?pageSize=${pageSize}&pageNumber=${pageNumber}&searchString=${searchString}` ), GetServiceProject: (id) => api.get(`/api/ServiceProject/details/${id}`), UpdateServiceProject: (id, data) =>