diff --git a/src/components/Dashboard/AttendanceChart.jsx b/src/components/Dashboard/AttendanceOverview.jsx similarity index 97% rename from src/components/Dashboard/AttendanceChart.jsx rename to src/components/Dashboard/AttendanceOverview.jsx index 71d14e48..77fbee51 100644 --- a/src/components/Dashboard/AttendanceChart.jsx +++ b/src/components/Dashboard/AttendanceOverview.jsx @@ -100,9 +100,9 @@ const AttendanceOverview = () => { }; return ( -
+
{/* Header */} -
+
Attendance Overview

Role-wise present count

diff --git a/src/components/Dashboard/Dashboard.jsx b/src/components/Dashboard/Dashboard.jsx index 3d0f0a66..ad5ead8c 100644 --- a/src/components/Dashboard/Dashboard.jsx +++ b/src/components/Dashboard/Dashboard.jsx @@ -12,11 +12,11 @@ import Teams from "./Teams"; import TasksCard from "./Tasks"; import ProjectCompletionChart from "./ProjectCompletionChart"; import ProjectProgressChart from "./ProjectProgressChart"; -import ProjectOverview from "../Project/ProjectOverview"; -import AttendanceOverview from "./AttendanceChart"; +import AttendanceOverview from "./AttendanceOverview"; import ExpenseAnalysis from "./ExpenseAnalysis"; import ExpenseStatus from "./ExpenseStatus"; import ExpenseByProject from "./ExpenseByProject"; +import ProjectStatistics from "../Project/ProjectStatistics"; const Dashboard = () => { @@ -29,16 +29,16 @@ const Dashboard = () => {
{isAllProjectsSelected && (
- +
)}
- +
- +
{isAllProjectsSelected && ( @@ -46,32 +46,31 @@ const Dashboard = () => {
)} - - {!isAllProjectsSelected && ( -
- -
- )} -
-
-
- -
-
- -
-
- -
-
{!isAllProjectsSelected && (
)} + + {!isAllProjectsSelected && ( +
+ +
+ )} +
+
+ +
+
+ +
+
+ +
+
diff --git a/src/components/Dashboard/ExpenseAnalysis.jsx b/src/components/Dashboard/ExpenseAnalysis.jsx index 1fe27fae..3c6b0d08 100644 --- a/src/components/Dashboard/ExpenseAnalysis.jsx +++ b/src/components/Dashboard/ExpenseAnalysis.jsx @@ -7,11 +7,12 @@ import { FormProvider, useForm } from "react-hook-form"; import { formatCurrency, localToUtc } from "../../utils/appUtils"; import { useProjectName } from "../../hooks/useProjects"; import { SpinnerLoader } from "../common/Loader"; +import flatColors from "../Charts/flatColor"; const ExpenseAnalysis = () => { const projectId = useSelectedProject(); const [projectName, setProjectName] = useState("All Project"); - const { projectNames, loading } = useProjectName(); + const { projectNames } = useProjectName(); const methods = useForm({ defaultValues: { startDate: "", endDate: "" }, @@ -50,7 +51,7 @@ const ExpenseAnalysis = () => { labels, legend: { show: false }, dataLabels: { enabled: true, formatter: (val) => `${val.toFixed(0)}%` }, - colors: ["#7367F0", "#28C76F", "#FF9F43", "#EA5455", "#00CFE8", "#FF78B8"], + colors: flatColors, plotOptions: { pie: { donut: { @@ -79,22 +80,19 @@ const ExpenseAnalysis = () => { return ( <> -
-
+
Expense Breakdown
- {/*

Category Wise Expense Breakdown

*/}

{projectName}

-
+
- {/* Card body */}
{isLoading && (
{
)} - {!isLoading && report.length > 0 && ( <> {isFetching && ( @@ -123,50 +120,59 @@ const ExpenseAnalysis = () => {
)} -
- -
+
+ {/* Chart Column */} +
+ +
-
-
- {report.map((item, idx) => ( -
-
- - - + {/* Data/Legend Column */} +
+
+ {report.map((item, idx) => ( +
+
+ + {item.projectName} + + + {formatCurrency(item.totalApprovedAmount)} + +
-
- {item.projectName} - - {formatCurrency(item.totalApprovedAmount)} - -
-
- ))} + + ))} +
)}
- - {/* Header */} - ); }; diff --git a/src/components/Dashboard/ExpenseByProject.jsx b/src/components/Dashboard/ExpenseByProject.jsx index 9a0e5a95..c589bc45 100644 --- a/src/components/Dashboard/ExpenseByProject.jsx +++ b/src/components/Dashboard/ExpenseByProject.jsx @@ -92,7 +92,7 @@ const ExpenseByProject = () => {
{/* Header */}
-
+
Monthly Expense -

{projectName}

diff --git a/src/components/Dashboard/ExpenseStatus.jsx b/src/components/Dashboard/ExpenseStatus.jsx index d6fefe7d..86a4fd8d 100644 --- a/src/components/Dashboard/ExpenseStatus.jsx +++ b/src/components/Dashboard/ExpenseStatus.jsx @@ -103,7 +103,7 @@ const ExpenseStatus = () => {
= 3 ? "text-xl" : "text-2xl" + className={`text-royalblue ${countDigit(item?.count || 0) >= 3 ? "text-xl" : "text-xl" } text-gray-500`} > {item?.count || 0} @@ -137,7 +137,7 @@ const ExpenseStatus = () => {
3 ? "text-" : "text-3xl" + className={`text-end text-royalblue ${countDigit(data?.totalAmount || 0) > 3 ? "text-xl" : "text-3xl" } text-md`} > {formatCurrency(data?.totalAmount || 0)} diff --git a/src/components/Dashboard/ProjectCompletionChart.jsx b/src/components/Dashboard/ProjectCompletionChart.jsx index 98ee1d3b..7cc4a092 100644 --- a/src/components/Dashboard/ProjectCompletionChart.jsx +++ b/src/components/Dashboard/ProjectCompletionChart.jsx @@ -1,11 +1,14 @@ -import React from "react"; +import React, { useState } from "react"; import HorizontalBarChart from "../Charts/HorizontalBarChart"; import { useProjects } from "../../hooks/useProjects"; +import { ITEMS_PER_PAGE } from "../../utils/constants"; const ProjectCompletionChart = () => { - const { data: projects = [], isLoading: loading, isError, error } = useProjects(); + const [currentPage, setCurrentPage] = useState(1); + const { data: projects, isLoading: loading, isError, error } = useProjects(currentPage, ITEMS_PER_PAGE); + console.log("Kartik", projects) // Bar chart logic const projectNames = projects?.map((p) => p.name) || []; const projectProgress = diff --git a/src/components/Project/ProjectOverview.jsx b/src/components/Project/ProjectStatistics.jsx similarity index 62% rename from src/components/Project/ProjectOverview.jsx rename to src/components/Project/ProjectStatistics.jsx index ee665144..7ec5dbd3 100644 --- a/src/components/Project/ProjectOverview.jsx +++ b/src/components/Project/ProjectStatistics.jsx @@ -9,7 +9,7 @@ import { import ReactApexChart from "react-apexcharts"; import Chart from "react-apexcharts"; -const ProjectOverview = ({ project }) => { +const ProjectStatistics = ({ project }) => { const { data } = useProjects(); const [current_project, setCurrentProject] = useState( data?.find((pro) => pro.id == project) @@ -133,10 +133,10 @@ const ProjectOverview = ({ project }) => { }, }, stroke: { - lineCap: "round", + lineCap: "round", }, - labels: ["Progress"], - series: [percentage], + labels: ["Progress"], + series: [percentage], }; }; const [radialPercentage, setRadialPercentage] = useState(75); // Initial percentage @@ -165,7 +165,7 @@ const ProjectOverview = ({ project }) => { }, [selectedProject]); return ( -
+
{" "} @@ -173,78 +173,78 @@ const ProjectOverview = ({ project }) => { Project Statistics
-
-
    -
  • -
    - {/* Centered Chart */} -
    -
    - -
    -
    - - {/* Info Section */} -
    -
    - {/* Tasks Planned */} -
    -
    - - - +
    +
      +
    • +
      + {/* Centered Chart */} +
      +
      + +
      -
      - Tasks Planned -
      - {FormattedNumber(current_project?.plannedWork)} -
      + + {/* Info Section */} +
      +
      + {/* Tasks Planned */} +
      +
      + + + +
      +
      + Tasks Planned +
      + {FormattedNumber(current_project?.plannedWork)} +
      +
      +
      + + {/* Tasks Completed */} +
      +
      + + + +
      +
      + Tasks Completed +
      + {FormattedNumber(current_project?.completedWork)} +
      +
      +
      + + {/* Team Size */} +
      +
      + + + +
      +
      + Current Team Size +
      + {FormattedNumber(current_project?.teamSize)} +
      +
      +
      +
      - - {/* Tasks Completed */} -
      -
      - - - -
      -
      - Tasks Completed -
      - {FormattedNumber(current_project?.completedWork)} -
      -
      -
      - - {/* Team Size */} -
      -
      - - - -
      -
      - Current Team Size -
      - {FormattedNumber(current_project?.teamSize)} -
      -
      -
      -
      -
    +
    • +
- - -
); }; -export default ProjectOverview; \ No newline at end of file +export default ProjectStatistics; \ No newline at end of file diff --git a/src/components/collections/AddPayment.jsx b/src/components/collections/AddPayment.jsx index a47200ee..1ad641b8 100644 --- a/src/components/collections/AddPayment.jsx +++ b/src/components/collections/AddPayment.jsx @@ -72,7 +72,7 @@ const AddPayment = ({ onClose }) => {
- { // ------------------------------Query------------------- -export const useProjects = (pageSize,pageNumber) => { +export const useProjects = (pageNumber,pageSize) => { const loggedUser = useSelector((store) => store.globalVariables.loginUser); return useQuery({ - queryKey: ["ProjectsList",pageSize,pageNumber], + queryKey: ["ProjectsList",pageNumber,pageSize], queryFn: async () => { - const response = await ProjectRepository.getProjectList(pageSize,pageNumber); - return response.data; + const response = await ProjectRepository.getProjectList(pageNumber,pageSize); + return response?.data?.data; }, enabled: !!loggedUser, }); diff --git a/src/pages/project/ProjectDetails.jsx b/src/pages/project/ProjectDetails.jsx index 011d1e9b..298e95fb 100644 --- a/src/pages/project/ProjectDetails.jsx +++ b/src/pages/project/ProjectDetails.jsx @@ -2,7 +2,7 @@ import React, { useState, useEffect, useCallback } from "react"; import { useDispatch } from "react-redux"; import { useNavigate } from "react-router-dom"; -import ProjectOverview from "../../components/Project/ProjectOverview"; +import ProjectOverview from "../../components/Project/ProjectStatistics"; import AboutProject from "../../components/Project/AboutProject"; import ProjectNav from "../../components/Project/ProjectNav"; import Teams from "../../components/Project/Team/Teams"; @@ -15,7 +15,7 @@ import { useProjectDetails, useProjectName } from "../../hooks/useProjects"; import { ComingSoonPage } from "../Misc/ComingSoonPage"; import eventBus from "../../services/eventBus"; import ProjectProgressChart from "../../components/Dashboard/ProjectProgressChart"; -import AttendanceOverview from "../../components/Dashboard/AttendanceChart"; +import AttendanceOverview from "../../components/Dashboard/AttendanceOverview"; import { setProjectId } from "../../slices/localVariablesSlice"; import ProjectDocuments from "../../components/Project/ProjectDocuments"; import ProjectSetting from "../../components/Project/ProjectSetting"; diff --git a/src/repositories/ProjectRepository.jsx b/src/repositories/ProjectRepository.jsx index 1220d085..1de7d87e 100644 --- a/src/repositories/ProjectRepository.jsx +++ b/src/repositories/ProjectRepository.jsx @@ -1,7 +1,7 @@ import { api } from "../utils/axiosClient"; const ProjectRepository = { - getProjectList: (pageSize,pageNumber) => api.get(`/api/project/list?pageSize=${pageSize}&pageNumber=${pageNumber}`), + getProjectList: (pageNumber,pageSize) => api.get(`/api/project/list?&pageNumber=${pageNumber}&pageSize=${pageSize}`), getProjectByprojectId: (projetid) => api.get(`/api/project/details/${projetid}`),