admin/marco.pms.web
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Merge branch 'Kartik_Enhancement#336' into Issue_May_4W

Browse Source 
# Conflicts:
#	src/components/Dashboard/Dashboard.jsx
This commit is contained in:
Vikas Nale 2025-05-24 10:26:01 +05:30
commit 78d7b9b521
2 changed files with 60 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
src/components/Dashboard/Dashboard.jsx
View File

@ -8,7 +8,7 @@ import {
useDashboardTeamsCardData,
useDashboardTasksCardData,
} from "../../hooks/useDashboard_Data";
import ProjectCompletionChart from "./ProjectCompletionChart";
import TasksCard from "./Tasks";
const Dashboard = () => {
const { projects, loading } = useProjects();
@ -56,6 +56,15 @@ const Dashboard = () => {
(a, b) => new Date(a.date) - new Date(b.date)
);
// Bar chart logic
const projectNames = projects?.map((p) => p.name) || [];
const projectProgress =
projects?.map((p) => {
const completed = p.completedWork || 0;
const planned = p.plannedWork || 1;
const percent = (completed / planned) * 100;
return Math.min(Math.round(percent), 100);
}) || [];
// Line chart data
const lineChartSeries = [
@ -137,33 +146,27 @@ const Dashboard = () => {
</div>
{/* Tasks Card */}
<div className="col-sm-6 col-lg-4">
<div className="card p-3 h-100 text-center d-flex justify-content-between">
<div className="d-flex justify-content-start align-items-center mb-3">
<h5 className="fw-bold mb-0 ms-2">
<i className="bx bx-task text-success"></i> Tasks
</h5>
</div>
<div className="d-flex justify-content-around align-items-start mt-n2">
<div>
<h4 className="mb-0 fw-bold">
{tasksCardData.totalTasks?.toLocaleString()}
</h4>
<small className="text-muted">Total</small>
</div>
<div>
<h4 className="mb-0 fw-bold">
{tasksCardData.completedTasks?.toLocaleString()}
</h4>
<small className="text-muted">Completed</small>
</div>
</div>
</div>
<div className="col-sm-6 col-lg-4">
<TasksCard tasksCardData={tasksCardData} /> {/* Use the TasksCard component */}
</div>
{/* Bar Chart */}
<div className="col-xxl-6 col-lg-6">
<ProjectCompletionChart />
<div className="col-xxl-6 col-lg-6">
<div className="card h-100">
<div className="card-header d-flex align-items-start justify-content-between">
<div className="card-title mb-0 text-start">
<h5 className="mb-1">Projects</h5>
<p className="card-subtitle">Projects Completion Status</p>
</div>
</div>
<div className="card-body">
<HorizontalBarChart
categories={projectNames}
seriesData={projectProgress}
loading={loading}
/>
</div>
</div>
</div>
{/* Line Chart */}

32
src/components/Dashboard/Tasks.jsx Normal file
View File

@ -0,0 +1,32 @@
import React from "react";
import { useDashboardTasksCardData } from "../../hooks/useDashboard_Data";
const TasksCard = () => {
const { tasksCardData } = useDashboardTasksCardData();
return (
<div className="card p-3 h-100 text-center d-flex justify-content-between">
<div className="d-flex justify-content-start align-items-center mb-3">
<h5 className="fw-bold mb-0 ms-2">
<i className="bx bx-task text-success"></i> Tasks
</h5>
</div>
<div className="d-flex justify-content-around align-items-start mt-n2">
<div>
<h4 className="mb-0 fw-bold">
{tasksCardData.totalTasks?.toLocaleString()}
</h4>
<small className="text-muted">Total</small>
</div>
<div>
<h4 className="mb-0 fw-bold">
{tasksCardData.completedTasks?.toLocaleString()}
</h4>
<small className="text-muted">Completed</small>
</div>
</div>
</div>
);
};
export default TasksCard;