Commit e82bca29 authored by janithgamage1.ed's avatar janithgamage1.ed

fix: update

Desc : update project
parent b9bcfc51
// material-ui // material-ui
import { import {
Box,
Grid, Grid,
LinearProgress,
Stack, Stack,
Typography Typography
} from '@mui/material'; } from '@mui/material';
import { useTheme } from '@mui/material/styles';
// project import // project import
import TutorialSection from './TutorialSection'; import TutorialSection from './TutorialSection';
// types // types
import MainCard from 'components/MainCard';
import { ThemeDirection } from 'types/config';
import { curriculumTypeUserProgress } from "types/userProgress"; import { curriculumTypeUserProgress } from "types/userProgress";
// assets // assets
import { CheckCircleOutlined, UnorderedListOutlined } from '@ant-design/icons';
import Reader from 'assets/images/analytics/reader.svg';
import ReportCard from 'components/cards/statistics/ReportCard';
// ==============================|| Curriculum - Section ||============================== // // ==============================|| Curriculum - Section ||============================== //
const CurriculumSection = ({ curriculum }: { curriculum: curriculumTypeUserProgress }) => { const CurriculumSection = ({ curriculum }: { curriculum: curriculumTypeUserProgress }) => {
const theme = useTheme();
return ( return (
<> <>
<Stack spacing={2} sx={{ padding: 2 }}> <Stack spacing={2} sx={{ padding: 2 }}>
<Typography variant="h5">{curriculum.curriculumDescription}</Typography> <MainCard title="Overview">
<Grid container spacing={2}> <Grid container spacing={2}>
{curriculum.tutorials.map((tutorial, index) => { <Grid
return (<TutorialSection tutorial={tutorial!} />) item
})} xs={7}
</Grid> sm={7}
sx={{
bgcolor: `${theme.palette.primary.main}`,
position: 'relative',
p: 2.75,
borderRadius: { xs: 2, sm: '8px 0px 0px 8px' },
overflow: 'hidden'
}}
>
<Stack>
<Typography variant="h5" color="white">
{curriculum.curriculumDescription}
</Typography>
<Typography color={theme.palette.grey[0]} variant="caption" sx={{ maxWidth: '55%', pt: 1 }}>
Your learning capacity is 80% as daily analytics
</Typography>
<Typography variant="h4" color="white" sx={{ pt: 8, pb: 1, zIndex: 1 }}>
{(curriculum.curriculumMarkUser / curriculum.curriculumMark) * 100}% Completed
</Typography>
<Box sx={{ maxWidth: '60%' }}>
<LinearProgress variant="determinate" color="success" value={(curriculum.curriculumMarkUser / curriculum.curriculumMark) * 100} />
</Box>
<Box
sx={{
position: 'absolute',
bottom: -7,
right: 0,
...(theme.direction === ThemeDirection.RTL && { transform: { xs: 'rotateY(180deg)', sm: 'inherit' } })
}}
>
<img alt="reder" src={Reader} />
</Box>
</Stack>
</Grid>
<Grid md={5} item>
<Grid container spacing={2}>
<Grid md={12} item>
<ReportCard primary={`LEVEL - ${curriculum.curriculumLevel}`} secondary="Curriculum Level" color={theme.palette.error.main} iconPrimary={UnorderedListOutlined} />
</Grid>
<Grid md={12} item>
<ReportCard primary={`Pass Mark - ${curriculum.curriculumMark}`} secondary="Curriculum Pass Mark" color={theme.palette.success.dark} iconPrimary={CheckCircleOutlined} />
</Grid>
</Grid>
</Grid>
</Grid>
</MainCard>
<MainCard title="Tutorials">
<Grid container spacing={2}>
{curriculum.tutorials.map((tutorial, index) => {
return (<TutorialSection tutorial={tutorial!} />)
})}
</Grid>
</MainCard>
</Stack> </Stack>
</> </>
); );
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment