feat(Dashboard): integrate loading state for line chart and fix data mapping
This commit is contained in:
parent
a30350916e
commit
99a4cb0553
@ -10,7 +10,7 @@ import {
|
||||
} from "../../hooks/useDashboard_Data";
|
||||
|
||||
const Dashboard = () => {
|
||||
const { projects } = useProjects();
|
||||
const { projects,loading } = useProjects();
|
||||
const [selectedProjectId, setSelectedProjectId] = useState('all');
|
||||
const [FromDate, setFromDate] = useState(() => {
|
||||
const today = new Date();
|
||||
@ -21,7 +21,7 @@ const { projectsCardData, } = useDashboardProjectsCardData();
|
||||
const { teamsCardData,} = useDashboardTeamsCardData();
|
||||
const { tasksCardData, } = useDashboardTasksCardData();
|
||||
|
||||
const { dashboard_data, loading: lineLoading } = useDashboard_Data({
|
||||
const { dashboard_data, loading: isLineChartLoading } = useDashboard_Data({
|
||||
days,
|
||||
FromDate,
|
||||
projectId: selectedProjectId === 'all' ? 0 : selectedProjectId,
|
||||
@ -40,11 +40,11 @@ const { tasksCardData, } = useDashboardTasksCardData();
|
||||
const lineChartSeries = [
|
||||
{
|
||||
name: 'Planned Work',
|
||||
data: dashboard_data.map(d => d.plannedWork || 0),
|
||||
data: dashboard_data.map(d => d.plannedTask || 0),
|
||||
},
|
||||
{
|
||||
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
|
||||
categories={projectNames}
|
||||
seriesData={projectProgress}
|
||||
loading={loading}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -192,8 +193,7 @@ const { tasksCardData, } = useDashboardTasksCardData();
|
||||
</div>
|
||||
</div>
|
||||
<div className="card-body ">
|
||||
<LineChart seriesData={lineChartSeries} categories={lineChartCategories} />
|
||||
{lineLoading && <p className="text-center mt-3">Loading...</p>}
|
||||
<LineChart seriesData={lineChartSeries} categories={lineChartCategories} loading={isLineChartLoading} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
Loading…
x
Reference in New Issue
Block a user