diff --git a/public/locales/en/common.json b/public/locales/en/common.json index 7835b1a0..fde9155c 100644 --- a/public/locales/en/common.json +++ b/public/locales/en/common.json @@ -120,6 +120,7 @@ "CENTER_ATTENDANCE": "Center Attendance", "MY_TIMETABLE": "My Timetable", "MY_TEACHING_CENTERS": "My Teaching Centers", + "TEACHING_CENTERS": "Teaching Centers", "UPCOMING_EXTRA_SESSION": "Upcoming Extra Sessions", "BACK_TO_TOP": "Back to Top", "LAST_SEVEN_DAYS_RANGE": "Last 7 Days {{date_range}}", @@ -254,6 +255,7 @@ "SEARCH_BLOCKS": "Search Blocks" }, "CENTERS": { + "CENTERS": "Centers", "REGULAR_CENTERS": "Regular Centers", "REMOTE_CENTERS": "Remote Center", "REGULAR": "Regular", diff --git a/src/pages/manageUser.tsx b/src/components/ManageUser.tsx similarity index 91% rename from src/pages/manageUser.tsx rename to src/components/ManageUser.tsx index e43c2e10..0ba3a8eb 100644 --- a/src/pages/manageUser.tsx +++ b/src/components/ManageUser.tsx @@ -35,8 +35,10 @@ import LocationOnOutlinedIcon from '@mui/icons-material/LocationOnOutlined'; import { editEditUser } from '@/services/ProfileService'; import ConfirmationModal from '@/components/ConfirmationModal'; import { Status } from '@/utils/app.constant'; +import AddIcon from '@mui/icons-material/Add'; import LearnersList from '@/components/LearnersList'; +import Link from 'next/link'; interface Cohort { cohortId: string; parentId: string; @@ -110,8 +112,8 @@ const learnersList = [ }, ]; interface ManageUsersProps { - reloadState: boolean; - setReloadState: React.Dispatch>; + reloadState?: boolean; + setReloadState?: React.Dispatch>; } const manageUsers: React.FC = ({ @@ -386,20 +388,26 @@ const manageUsers: React.FC = ({ setReassignBlockRequestModalOpen(false); }; + const handleLearnerFullProfile = () => { + // router.push(`/learner/${userId}`); + router.push(`/profile`); + }; + const noop = () => {}; + return ( <> -
- - */} + + {/* {t('COMMON.MANAGE_USERS')} - + */} - + {/* = ({ - + */} {value === 1 && ( <> @@ -483,6 +491,25 @@ const manageUsers: React.FC = ({ + + + {/* + + {t('COMMON.ADD_CENTER')} + */} + @@ -510,14 +537,17 @@ const manageUsers: React.FC = ({ justifyContent={'space-between'} sx={{ cursor: 'pointer' }} > - handleModalToggle(user)}> + handleModalToggle(user)} + onClick={() => handleLearnerFullProfile()} + > - {user.name} + {user.name} @@ -588,15 +618,15 @@ const manageUsers: React.FC = ({ ), name: 'reassign-block-request', }, - { - label: t('COMMON.REASSIGN_CENTERS'), - icon: ( - - ), - name: 'reassign-centers', - }, + // { + // label: t('COMMON.REASSIGN_CENTERS'), + // icon: ( + // + // ), + // name: 'reassign-centers', + // }, { label: t('COMMON.DELETE_USER'), icon: ( @@ -654,7 +684,7 @@ const manageUsers: React.FC = ({ = ({ enrollmentId={data.enrollmentNumber} cohortMembershipId={data.cohortMembershipId} statusReason={data.statusReason} - reloadState={reloadState} - setReloadState={setReloadState} + reloadState={reloadState || false} + setReloadState={setReloadState || noop} block={data.block} center={data.center} userId={data.userId} @@ -734,7 +764,7 @@ const manageUsers: React.FC = ({ ))} = ({ ); }; -export async function getStaticProps({ locale }: any) { - return { - props: { - ...(await serverSideTranslations(locale, ['common'])), - // Will be passed to the page component as props - }, - }; -} +// export async function getStaticProps({ locale }: any) { +// return { +// props: { +// ...(await serverSideTranslations(locale, ['common'])), +// // Will be passed to the page component as props +// }, +// }; +// } export default manageUsers; diff --git a/src/components/MenuDrawer.tsx b/src/components/MenuDrawer.tsx index e323ac92..0834b9c6 100644 --- a/src/components/MenuDrawer.tsx +++ b/src/components/MenuDrawer.tsx @@ -30,6 +30,7 @@ const MenuDrawer: React.FC = ({ }) => { const theme = useTheme(); const [isOpen, setIsOpen] = useState(open); + const [isTeamLeader, setIsTeamLeader] = useState(false); const { t } = useTranslation(); const router = useRouter(); @@ -39,6 +40,10 @@ const MenuDrawer: React.FC = ({ if (typeof window !== 'undefined' && window.localStorage) { const lang = localStorage.getItem('preferredLanguage') || 'en'; setLanguage(lang); + const role = localStorage.getItem('role'); + if (role === 'Team Leader') { + setIsTeamLeader(true); + } } }, [setLanguage]); @@ -63,7 +68,7 @@ const MenuDrawer: React.FC = ({ const isDashboard = router.pathname === '/dashboard'; const isTeacherCenter = router.pathname === '/centers'; - const isManageUser = router.pathname === '/manageUser'; + // const isManageUser = router.pathname === '/manageUser'; return ( = ({ router.push(`/centers`); // Check route }} > - {t('DASHBOARD.MY_TEACHING_CENTERS')} + {isTeamLeader + ? t('DASHBOARD.TEACHING_CENTERS') + : t('DASHBOARD.MY_TEACHING_CENTERS')} @@ -226,7 +233,7 @@ const MenuDrawer: React.FC = ({ {t('COMMON.OBSERVATIONS_FORMS')} - + {/* - + */} ); diff --git a/src/pages/centers/index.tsx b/src/pages/centers/index.tsx index 0be267eb..9fb6e287 100644 --- a/src/pages/centers/index.tsx +++ b/src/pages/centers/index.tsx @@ -1,4 +1,15 @@ -import { Box, Button } from '@mui/material'; +import { + Box, + Button, + FormControl, + Grid, + InputAdornment, + MenuItem, + Select, + Tab, + Tabs, + TextField, +} from '@mui/material'; import React, { useEffect } from 'react'; import { cohort, cohortAttendancePercentParam } from '@/utils/Interfaces'; @@ -9,12 +20,16 @@ import Header from '@/components/Header'; import Image from 'next/image'; import Loader from '@/components/Loader'; import building from '../../assets/images/apartment.png'; -import { cohortList } from '@/services/CohortServices'; +import { cohortList, getCohortList } from '@/services/CohortServices'; import { serverSideTranslations } from 'next-i18next/serverSideTranslations'; import { showToastMessage } from '@/components/Toastify'; import { useRouter } from 'next/router'; import { useTheme } from '@mui/material/styles'; import { useTranslation } from 'next-i18next'; +import SearchIcon from '@mui/icons-material/Search'; +import ManageUser from '@/components/ManageUser'; +import { setTimeout } from 'timers'; +import SmartDisplayOutlinedIcon from '@mui/icons-material/SmartDisplayOutlined'; const TeachingCenters = () => { const [loading, setLoading] = React.useState(false); @@ -22,6 +37,19 @@ const TeachingCenters = () => { const theme = useTheme(); const router = useRouter(); const [cohortsData, setCohortsData] = React.useState>([]); + const [value, setValue] = React.useState(1); + const [blockData, setBlockData] = + React.useState< + { bockName: string; district?: string; blockId: string; state?: string }[] + >(); + const [centerData, setCenterData] = + React.useState< + { cohortName: string; centerType?: string; cohortId: string }[] + >(); + const [isTeamLeader, setIsTeamLeader] = React.useState(false); + const handleChange = (event: React.SyntheticEvent, newValue: number) => { + setValue(newValue); + }; // API call to get center list useEffect(() => { @@ -52,112 +80,438 @@ const TeachingCenters = () => { fetchCohortList(); }, []); + useEffect(() => { + if (typeof window !== 'undefined' && window.localStorage) { + const role = localStorage.getItem('role'); + if (role === 'Team Leader') { + setIsTeamLeader(true); + } else { + setIsTeamLeader(false); + } + } + }, []); + + useEffect(() => { + const getCohortListForTL = async () => { + try { + if (typeof window !== 'undefined' && window.localStorage) { + const userId = localStorage.getItem('userId'); + if (userId && isTeamLeader) { + const response = await getCohortList(userId, { + customField: 'true', + }); + const blockData = response.map((block: any) => { + const blockName = block.cohortName; + const blockId = block.cohortId; + const stateField = block?.customField.find( + (field: any) => field.label === 'State' + ); + const districtField = block?.customField.find( + (field: any) => field.label === 'District' + ); + + const state = stateField ? stateField.value : ''; + const district = districtField ? districtField.value : ''; + return { blockName, blockId, state, district }; + }); + console.log(blockData); + setBlockData(blockData); + + const cohortData = response.map((res: any) => { + const centerData = res?.childData.map((child: any) => { + const cohortName = child.name; + const cohortId = child.cohortId; + const centerTypeField = child?.customField.map((field: any) => { + return field.value; + }); + const centerType = centerTypeField.value; + return { cohortName, cohortId, centerType }; + }); + console.log(centerData); + setCenterData(centerData); + }); + } + if (userId && !isTeamLeader) { + const response = await getCohortList(userId); + const cohortData = response.map((block: any) => { + const cohortName = block.cohortName; + const cohortId = block.cohortId; + return { cohortName, cohortId }; + }); + console.log(cohortData); + setTimeout(() => { + setCohortsData(cohortData); + }); + } + } + } catch (error) { + showToastMessage(t('COMMON.SOMETHING_WENT_WRONG'), 'error'); + } + }; + getCohortListForTL(); + }, [isTeamLeader]); + return ( <>
{loading && } - - {t('DASHBOARD.MY_TEACHING_CENTERS')} - - {/* - - - - {t('COMMON.ADD_CENTER')} - - */} - - {cohortsData?.map((cohort: any, index) => { - return ( - + {isTeamLeader ? ( + <> + {blockData?.length !== 0 && + blockData?.map((block: any) => ( { - router.push(`/centers/${cohort.cohortId}`); - localStorage.setItem('classId', cohort.cohortId); - }} - sx={{ cursor: 'pointer', marginBottom: '20px' }} + key={block.blockId} + textAlign={'left'} + fontSize={'22px'} + p={'18px 0'} + color={theme?.palette?.warning['300']} > - - {cohort?.['customFields']?.address?.value} + {block.blockName} + + {block.district}, {block.state} - - - center - + + ))} + + ) : ( + + {t('DASHBOARD.MY_TEACHING_CENTERS')} + + )} + {isTeamLeader && ( + + + `1px solid ${theme.palette.primary.main}`, - + + + + + )} + + + {value === 1 && ( + <> + + + + + + + ), }} + /> + + + + + - - {cohort?.name} - - - + + {t('COMMON.FILTERS')} + + + - - - ); - })} + + {isTeamLeader && ( + + + {/* + + {t('COMMON.ADD_CENTER')} + */} + + )} + + + + {isTeamLeader && + centerData && + centerData?.map((center: any) => { + return ( + + { + router.push(`/centers/${center.cohortId}`); + localStorage.setItem('classId', center.cohortId); + }} + sx={{ cursor: 'pointer', marginBottom: '20px' }} + > + {center?.centerType === 'regular' || + (center?.centerType === undefined && ( + <> + + {center?.centerType} + + + + center + + + + + {center?.cohortName} + + + + + + ))} + {center?.centerType === 'remote' && ( + <> + + {center?.centerType} + + + + + + + + + {center?.cohortName} + + + + + + )} + + + ); + })} + + {!isTeamLeader && + cohortsData && + cohortsData?.map((cohort: any) => { + return ( + + { + router.push(`/centers/${cohort.cohortId}`); + localStorage.setItem('classId', cohort.cohortId); + }} + sx={{ cursor: 'pointer', marginBottom: '20px' }} + > + + {/* {cohort?.['customFields']?.address?.value} */} + + + + center + + + + + {cohort?.cohortName} + + + + + + + ); + })} + + + )} + {value === 2 && } ); diff --git a/src/services/CohortServices.ts b/src/services/CohortServices.ts index 28b07259..bc2f0fe8 100644 --- a/src/services/CohortServices.ts +++ b/src/services/CohortServices.ts @@ -26,3 +26,23 @@ export const getCohortDetails = async (cohortId: string): Promise => { throw error; } }; + +export const getCohortList = async ( + userId: string, + filters: { [key: string]: string } = {} +): Promise => { + let apiUrl: string = `${process.env.NEXT_PUBLIC_BASE_URL}/cohort/mycohorts/${userId}?children=true`; + + const filterParams = new URLSearchParams(filters).toString(); + if (filterParams) { + apiUrl += `&${filterParams}`; + } + + try { + const response = await get(apiUrl); + return response?.data?.result; + } catch (error) { + console.error('Error in getting cohort details', error); + throw error; + } +};