leomurca/if-salas-web
leomurca/if-salas-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Support multiple classes for a single assignment

Browse source
This commit is contained in:
Leonardo Murça 2022-06-23 14:14:03 -03:00
parent 617eda6872
commit 918f0fa0f3
3 changed files with 83 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
src/components/AssignmentCard.js
View file

@ -12,15 +12,30 @@ import dayjs from 'dayjs';
import { capitalizeFirstLetter } from '../utils/capitalizeFirstLetter';
function AssignmentCard({ title, classrooms, dueDate, scores, layoutType }) {
console.log(classrooms);
switch (layoutType) {
case 'desktop':
return (
<Card
sx={{
position: 'relative',
width: '100%',
borderLeft: `5px solid ${classrooms[0].color}`,
}}
>
{classrooms.length > 1 &&
classrooms
.filter((_, i) => i > 0)
.map(c => (
<div
style={{
position: 'absolute',
height: '100%',
borderLeft: `5px solid ${c.color}`,
left: 0,
}}
></div>
))}
<CardActionArea
sx={{
display: 'flex',
@ -52,7 +67,7 @@ function AssignmentCard({ title, classrooms, dueDate, scores, layoutType }) {
variant="p"
component="div"
>
{classrooms.map(c => c.name).join(',')}
{classrooms.map(c => c.name).join(', ')}
</Typography>
<Divider sx={{ marginTop: '10px' }} />
<Typography
@ -67,7 +82,7 @@ function AssignmentCard({ title, classrooms, dueDate, scores, layoutType }) {
</Typography>
<Typography variant="p" component="div">
<strong>Valor: </strong>
{scores.map(s => s.value).join(',')} pts
{scores.map(s => s.value).join(', ')} pts
</Typography>
</Stack>
</CardContent>
@ -85,10 +100,24 @@ function AssignmentCard({ title, classrooms, dueDate, scores, layoutType }) {
>
<CardActionArea
sx={{
position: 'relative',
display: 'flex',
flexDirection: 'column',
}}
>
{classrooms.length > 1 &&
classrooms
.filter((_, i) => i > 0)
.map(c => (
<div
style={{
position: 'absolute',
width: '100%',
borderTop: `5px solid ${c.color}`,
top: 0,
}}
></div>
))}
<CardContent sx={{ width: '100%' }}>
<Tooltip title={title}>
<Typography
@ -113,7 +142,7 @@ function AssignmentCard({ title, classrooms, dueDate, scores, layoutType }) {
variant="p"
component="div"
>
{classrooms.map(c => c.name).join(',')}
{classrooms.map(c => c.name).join(', ')}
</Typography>
<Divider sx={{ marginTop: '10px' }} />
<Typography
@ -128,7 +157,7 @@ function AssignmentCard({ title, classrooms, dueDate, scores, layoutType }) {
</Typography>
<Typography variant="p" component="div">
<strong>Valor: </strong>
{scores.map(s => s.value).join(',')} pts
{scores.map(s => s.value).join(', ')} pts
</Typography>
</Stack>
</CardContent>

43
src/context/user.js
View file

@ -194,6 +194,49 @@ const getAssignments = userId =>
},
],
},
{
id: '1717',
title: 'Trabalho interdisciplinar',
dueDate: '2022-08-20 23:59',
scores: [
{
classroomId: '666',
value: 20,
},
{
classroomId: '321',
value: 30,
},
],
classrooms: [
{
id: '666',
name: 'Banco de Dados II',
abbreviation: 'BDII',
color: '#FF7A00',
teachers: [
{
name: 'Cristiane Norbiato Targa',
avatar:
'https://lh3.googleusercontent.com/a-/AOh14GhwNeQ0h2eKl2WXGuwyDzvLWtrvyrG2kJtZ7A1EBw=s75-c',
},
],
},
{
id: '321',
name: 'Introdução à Ciência de Dados',
abbreviation: 'ICD',
color: '#006FF2',
teachers: [
{
name: 'Carlos Alexandre Silva',
avatar:
'https://images.unsplash.com/photo-1535713875002-d1d0cf377fde?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=50&q=80',
},
],
},
],
},
],
};
});

8
src/screens/Home/index.js
View file

@ -70,7 +70,13 @@ function Home() {
<Grid sx={{ borderLeft: '4px solid #CFCFCF' }} item xs={4}>
<h1>Atividades</h1>
<h2>Atribuídas</h2>
<Stack alignItems="end" flexWrap="wrap" direction="row" gap="30px">
<Stack
sx={{ paddingBottom: '100px' }}
alignItems="end"
flexWrap="wrap"
direction="row"
gap="30px"
>
{assignments === null ? (
Array(6)
.fill()