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

Move all the project-related code from the Dashboard component into a new component named 'Projects'. #131

Merged
vikas.nale merged 1 commits from Kartik_Enhancement#334 into Issue_May_4W 2025-05-24 04:49:06 +00:00
Conversation 0 Commits 1 Files Changed 2 +39 -27
2 changed files with 39 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 7cc9181fb9 - Show all commits

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

@ -8,6 +8,7 @@ import {
useDashboardTeamsCardData, useDashboardTeamsCardData,
useDashboardTasksCardData, useDashboardTasksCardData,
} from "../../hooks/useDashboard_Data"; } from "../../hooks/useDashboard_Data";
import Projects from "./Projects";
const Dashboard = () => { const Dashboard = () => {
const { projects, loading } = useProjects(); const { projects, loading } = useProjects();
@ -93,30 +94,9 @@ const Dashboard = () => {
return ( return (
<div className="container-xxl flex-grow-1 container-p-y"> <div className="container-xxl flex-grow-1 container-p-y">
<div className="row gy-4"> <div className="row gy-4">
{/* Projects Card */} {/* Projects Card */}
<div className="col-sm-6 col-lg-4"> <div className="col-sm-6 col-lg-4">
<div className="card p-3 h-100 text-center d-flex justify-content-between"> <Projects projectsCardData={projectsCardData} />
<div className="d-flex justify-content-start align-items-center mb-3">
<h5 className="fw-bold mb-0 ms-2">
<i className="rounded-circle bx bx-building-house text-primary"></i>{" "}
Projects
</h5>
</div>
<div className="d-flex justify-content-around align-items-start mt-n2">
<div>
<h4 className="mb-0 fw-bold">
{projectsCardData.totalProjects?.toLocaleString()}
</h4>
<small className="text-muted">Total</small>
</div>
<div>
<h4 className="mb-0 fw-bold">
{projectsCardData.ongoingProjects?.toLocaleString()}
</h4>
<small className="text-muted">Ongoing</small>
</div>
</div>
</div>
</div> </div>
{/* Teams Card */} {/* Teams Card */}
@ -209,7 +189,7 @@ const Dashboard = () => {
{selectedProjectId === "all" {selectedProjectId === "all"
? "All Projects" ? "All Projects"
: projects?.find((p) => p.id === selectedProjectId) : projects?.find((p) => p.id === selectedProjectId)
?.name || "Select Project"} ?.name || "Select Project"}
</button> </button>
<ul className="dropdown-menu"> <ul className="dropdown-menu">
@ -240,11 +220,10 @@ const Dashboard = () => {
{["1D", "1W", "15D", "1M", "3M", "1Y", "5Y"].map((key) => ( {["1D", "1W", "15D", "1M", "3M", "1Y", "5Y"].map((key) => (
<button <button
key={key} key={key}
className={`border-0 bg-transparent px-2 py-1 text-sm rounded ${ className={`border-0 bg-transparent px-2 py-1 text-sm rounded ${range === key
range === key
? " border-bottom border-primary text-primary" ? " border-bottom border-primary text-primary"
: "text-muted" : "text-muted"
}`} }`}
style={{ cursor: "pointer", transition: "all 0.2s ease" }} style={{ cursor: "pointer", transition: "all 0.2s ease" }}
onClick={() => setRange(key)} onClick={() => setRange(key)}
> >

33
src/components/Dashboard/Projects.jsx Normal file
View File

@ -0,0 +1,33 @@
import React from "react";
import { useDashboardProjectsCardData } from "../../hooks/useDashboard_Data";
const Projects = () => {
const { projectsCardData } = useDashboardProjectsCardData();
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="rounded-circle bx bx-building-house text-primary"></i>{" "}
Projects
</h5>
</div>
<div className="d-flex justify-content-around align-items-start mt-n2">
<div>
<h4 className="mb-0 fw-bold">
{projectsCardData.totalProjects?.toLocaleString()}
</h4>
<small className="text-muted">Total</small>
</div>
<div>
<h4 className="mb-0 fw-bold">
{projectsCardData.ongoingProjects?.toLocaleString()}
</h4>
<small className="text-muted">Ongoing</small>
</div>
</div>
</div>
);
};
export default Projects;