Skip to content

Commit

Permalink
Merge pull request #189 from Rushikesh-Sonawane99/shiksha-2.0
Browse files Browse the repository at this point in the history 
Issue #PS-388 chore: Modified code to get cohortAttendancePercent for selectedDate Range and added back button on attendance overview page
  • Loading branch information
@itsvick
itsvick authored May 30, 2024
2 parents 2a86b59 + d123607 commit a559c56
Show file tree
Hide file tree
Showing 6 changed files with 137 additions and 100 deletions.
1 change: 1 addition & 0 deletions src/components/AttendanceStatus.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ interface AttendanceStatusProps {
}

type AttendanceData = {
totalcount: any;
present_percentage: number;
present_students: number;
total_students: number;
Expand Down
2 changes: 1 addition & 1 deletion src/components/DateRangePopup.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,7 +77,7 @@ const DateRangePopup: React.FC<CustomSelectModalProps> = ({
switch (index) {
case 0:
fromDate = new Date(today);
fromDate.setDate(today.getDate() - 7);
fromDate.setDate(today.getDate() - 6);
break;
case 1:
fromDate = new Date(today);
Expand Down
14 changes: 7 additions & 7 deletions src/components/MarkBulkAttendance.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -147,13 +147,13 @@ const MarkBulkAttendance: React.FC<MarkBulkAttendanceProps> = ({
const attendance = response.find(
(status) => status.userId === userId
);
if (attendance) {
userAttendanceArray.push({
userId,
attendance: attendance.attendance,
userAttendanceArray.push({
userId,
attendance: attendance?.attendance
? attendance.attendance
: '',
});
});
}
});
return userAttendanceArray;
};
const userAttendanceArray = getUserAttendanceStatus(
Expand Down Expand Up @@ -231,7 +231,7 @@ const MarkBulkAttendance: React.FC<MarkBulkAttendanceProps> = ({
if (classId !== '') {
getCohortMemberList();
}
}, [classId, selectedDate]);
}, [classId, selectedDate, showUpdateButton]);

const handleSave = () => {
onClose();
Expand Down
15 changes: 7 additions & 8 deletions src/pages/attendance-history.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -142,7 +142,6 @@ const UserAttendanceHistory = () => {
const filteredData = extractedNames
?.map((item: any) => ({
cohortId: item?.cohortData?.cohortId,
parentId: item?.cohortData?.parentId,
name: item?.cohortData?.name,
}))
?.filter(Boolean);
Expand Down Expand Up @@ -219,7 +218,7 @@ const UserAttendanceHistory = () => {
page,
filters,
});
const resp = response?.data?.userDetails;
const resp = response?.result?.results?.userDetails;

if (resp) {
const nameUserIdArray = resp?.map((entry: any) => ({
Expand Down Expand Up @@ -253,13 +252,13 @@ const UserAttendanceHistory = () => {
const attendance = response.find(
(status) => status.userId === userId
);
if (attendance) {
userAttendanceArray.push({
userId,
attendance: attendance.attendance,
userAttendanceArray.push({
userId,
attendance: attendance?.attendance
? attendance.attendance
: '',
});
});
}
});
return userAttendanceArray;
};
const userAttendanceArray = getUserAttendanceStatus(
Expand Down
128 changes: 80 additions & 48 deletions src/pages/attendance-overview.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import {
} from '@mui/material';
import React, { useEffect, useState } from 'react';
import { debounce, getTodayDate, toPascalCase } from '@/utils/Helper';

import KeyboardBackspaceOutlinedIcon from '@mui/icons-material/KeyboardBackspaceOutlined';
import ArrowDropDownSharpIcon from '@mui/icons-material/ArrowDropDownSharp';
import ClearIcon from '@mui/icons-material/Clear';
import DateRangePopup from '@/components/DateRangePopup';
Expand All @@ -28,7 +28,10 @@ import SearchIcon from '@mui/icons-material/Search';
import SortingModal from '@/components/SortingModal';
import StudentsStatsList from '@/components/LearnerAttendanceStatsListView';
import UpDownButton from '@/components/UpDownButton';
import { classesMissedAttendancePercentList, getCohortAttendance,} from '@/services/AttendanceService';
import {
classesMissedAttendancePercentList,
getCohortAttendance,
} from '@/services/AttendanceService';
import { cohort, cohortAttendancePercentParam } from '@/utils/Interfaces';
import { cohortList } from '@/services/CohortServices';
import { getMyCohortMemberList } from '@/services/MyClassDetailsService';
Expand Down Expand Up @@ -59,8 +62,11 @@ const AttendanceOverview: React.FC<AttendanceOverviewProps> = () => {
const [selectedValue, setSelectedValue] = React.useState<string>(
t('COMMON.AS_OF_TODAY')
);
const [presentPercentage, setPresentPercentage] = React.useState<string | number>('');
const [lowAttendanceLearnerList,setLowAttendanceLearnerList] = React.useState<any>([]);
const [presentPercentage, setPresentPercentage] = React.useState<
string | number
>('');
const [lowAttendanceLearnerList, setLowAttendanceLearnerList] =
React.useState<any>([]);

const theme = useTheme<any>();
const pathname = usePathname();
Expand All @@ -85,18 +91,20 @@ const AttendanceOverview: React.FC<AttendanceOverviewProps> = () => {
let page = 0;
let filters = { userId: userId };
const resp = await cohortList({ limit, page, filters });
const extractedNames = resp?.data?.cohortDetails;
const filteredData = extractedNames
?.map((item: any) => ({
cohortId: item?.cohortData?.cohortId,
parentId: item?.cohortData?.parentId,
name: item?.cohortData?.name,
}))
?.filter(Boolean);
const response = resp?.results;
const cohortDetails = response?.cohortDetails || [];

const filteredData = cohortDetails.map((item: any) => ({
cohortId: item?.cohortData?.cohortId,
name: item?.cohortData?.name,
}));
setCohortsData(filteredData);
setClassId(filteredData?.[0]?.cohortId);
setLoading(false);

if (filteredData.length > 0) {
setClassId(filteredData[0].cohortId);
}
}
setLoading(false);
} catch (error) {
console.error('Error fetching cohort list:', error);
setLoading(false);
Expand Down Expand Up @@ -124,8 +132,7 @@ const AttendanceOverview: React.FC<AttendanceOverviewProps> = () => {
page,
filters,
});
const resp = response?.data?.userDetails;

const resp = response?.result?.results?.userDetails;
if (resp) {
const nameUserIdArray = resp?.map((entry: any) => ({
userId: entry.userId,
Expand Down Expand Up @@ -184,8 +191,8 @@ const AttendanceOverview: React.FC<AttendanceOverviewProps> = () => {
// Extract names of these students
const namesOfLowestAttendance: any[] =
studentsWithLowestAttendance.map((student) => student.name);
setLowAttendanceLearnerList(namesOfLowestAttendance)
}
setLowAttendanceLearnerList(namesOfLowestAttendance);
}
}
}
}
Expand Down Expand Up @@ -340,22 +347,39 @@ const AttendanceOverview: React.FC<AttendanceOverviewProps> = () => {

setDisplayStudentList(sortedData);
};
const handleBackEvent = () => {
window.history.back();
};

return (
<Box>
<UpDownButton />
<Header />
{loading && (
<Loader showBackdrop={true} loadingText={t('COMMON.LOADING')} />
)}
<Box sx={{ display: 'flex', justifyContent: 'center' }}>
<Box width={'100%'}>
<Typography textAlign={'left'} fontSize={'22px'} m={'1rem'}>
{t('ATTENDANCE.ATTENDANCE_OVERVIEW')}
</Typography>
<Loader showBackdrop={true} loadingText={t('COMMON.LOADING')} />
)}

<Box
sx={{
display: 'flex',
justifyContent: 'left',
alignItems: 'center',
color: '#4D4639',
}}
width={'100%'}
onClick={handleBackEvent}
>
<Box>
<KeyboardBackspaceOutlinedIcon
cursor={'pointer'}
sx={{ color: theme.palette.warning['A200'] }}
/>
</Box>
<Typography textAlign={'left'} fontSize={'22px'} m={'1rem'}>
{t('ATTENDANCE.ATTENDANCE_OVERVIEW')}
</Typography>
</Box>

<Box sx={{ mt: 0.6 }}>
<Box sx={{ minWidth: 120, gap: '15px' }} display={'flex'}>
<FormControl className="drawer-select" sx={{ m: 1, width: '100%' }}>
Expand All @@ -374,17 +398,19 @@ const AttendanceOverview: React.FC<AttendanceOverviewProps> = () => {
}}
>
{cohortsData?.length !== 0 ? (
<>
{cohortsData?.map((cohort) => (
// <>
// {
cohortsData?.map((cohort) => (
<MenuItem key={cohort.cohortId} value={cohort.cohortId}>
{cohort.name}
</MenuItem>
))}
<MenuItem key="all-cohorts" value="all">
{ t('ATTENDANCE.ALL_CENTERS')}
</MenuItem>
</>
))
) : (
// }
// <MenuItem key="all-cohorts" value="all">
// { t('ATTENDANCE.ALL_CENTERS')}
// </MenuItem>
// </>
<Typography style={{ fontWeight: 'bold' }}>
{t('COMMON.NO_DATA_FOUND')}
</Typography>
Expand All @@ -402,11 +428,15 @@ const AttendanceOverview: React.FC<AttendanceOverviewProps> = () => {
/>

<Box display={'flex'} className="card_overview">
<Grid container spacing={2} >
<Grid container spacing={2}>
<Grid item xs={5}>
<OverviewCard
label={t('ATTENDANCE.CENTER_ATTENDANCE')}
value={learnerData.length? (presentPercentage + " %") : presentPercentage}
value={
learnerData.length
? presentPercentage + ' %'
: presentPercentage
}
/>
</Grid>
<Grid item xs={7}>
Expand All @@ -418,9 +448,9 @@ const AttendanceOverview: React.FC<AttendanceOverviewProps> = () => {
value= { learnerData.length ? lowAttendanceLearnerList: {t('ATTENDANCE.N/A')}}
/> */}
<OverviewCard
label="Low Attendance Learners"
value="Bharat Kumar, Ankita Kulkarni and 3 more"
/>
label="Low Attendance Learners"
value="Bharat Kumar, Ankita Kulkarni and 3 more"
/>
</Grid>
</Grid>
</Box>
Expand Down Expand Up @@ -499,17 +529,19 @@ const AttendanceOverview: React.FC<AttendanceOverviewProps> = () => {
routeName={pathname}
/>
</Stack>
{classId !== "all"?
{classId !== 'all' ? (
<LearnerListHeader
numberOfColumns={3}
firstColumnName={t('COMMON.ATTENDANCE')}
secondColumnName={t('COMMON.CLASS_MISSED')}
/>: <LearnerListHeader
numberOfColumns={2}
firstColumnName={t('COMMON.ATTENDANCE')}
/>
}

numberOfColumns={3}
firstColumnName={t('COMMON.ATTENDANCE')}
secondColumnName={t('COMMON.CLASS_MISSED')}
/>
) : (
<LearnerListHeader
numberOfColumns={2}
firstColumnName={t('COMMON.ATTENDANCE')}
/>
)}

{loading && (
<Loader showBackdrop={true} loadingText={t('COMMON.LOADING')} />
)}
Expand Down
Loading

0 comments on commit a559c56

Please sign in to comment.