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

feat(Dashboard): integrate loading state for line chart and fix data mapping

Browse Source
This commit is contained in:
Vaibhav Surve 2025-04-11 17:22:56 +05:30
parent a30350916e
commit 99a4cb0553
1 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -10,7 +10,7 @@ import {
} from "../../hooks/useDashboard_Data"; } from "../../hooks/useDashboard_Data";
const Dashboard = () => { const Dashboard = () => {
const { projects } = useProjects(); const { projects,loading } = useProjects();
const [selectedProjectId, setSelectedProjectId] = useState('all'); const [selectedProjectId, setSelectedProjectId] = useState('all');
const [FromDate, setFromDate] = useState(() => { const [FromDate, setFromDate] = useState(() => {
const today = new Date(); const today = new Date();
@ -21,7 +21,7 @@ const { projectsCardData, } = useDashboardProjectsCardData();
const { teamsCardData,} = useDashboardTeamsCardData(); const { teamsCardData,} = useDashboardTeamsCardData();
const { tasksCardData, } = useDashboardTasksCardData(); const { tasksCardData, } = useDashboardTasksCardData();
const { dashboard_data, loading: lineLoading } = useDashboard_Data({ const { dashboard_data, loading: isLineChartLoading } = useDashboard_Data({
days, days,
FromDate, FromDate,
projectId: selectedProjectId === 'all' ? 0 : selectedProjectId, projectId: selectedProjectId === 'all' ? 0 : selectedProjectId,
@ -40,11 +40,11 @@ const { tasksCardData, } = useDashboardTasksCardData();
const lineChartSeries = [ const lineChartSeries = [
{ {
name: 'Planned Work', name: 'Planned Work',
data: dashboard_data.map(d => d.plannedWork || 0), data: dashboard_data.map(d => d.plannedTask || 0),
}, },
{ {
name: 'Completed Work', name: 'Completed Work',
data: dashboard_data.map(d => d.completedWork || 0), data: dashboard_data.map(d => d.completedTask || 0),
}, },
]; ];
@ -126,6 +126,7 @@ const { tasksCardData, } = useDashboardTasksCardData();
<HorizontalBarChart <HorizontalBarChart
categories={projectNames} categories={projectNames}
seriesData={projectProgress} seriesData={projectProgress}
loading={loading}
/> />
</div> </div>
</div> </div>
@ -192,8 +193,7 @@ const { tasksCardData, } = useDashboardTasksCardData();
</div> </div>
</div> </div>
<div className="card-body "> <div className="card-body ">
<LineChart seriesData={lineChartSeries} categories={lineChartCategories} /> <LineChart seriesData={lineChartSeries} categories={lineChartCategories} loading={isLineChartLoading} />
{lineLoading && <p className="text-center mt-3">Loading...</p>}
</div> </div>
</div> </div>
</div> </div>