Add list of upcoming classes on same day

This commit is contained in:
Tanner Collin 2020-03-16 04:45:00 +00:00
parent 84199b7e92
commit 5da382ee35

View File

@ -202,7 +202,7 @@ export function InstructorClassAttendance(props) {
</div> </div>
: :
<Button onClick={() => setOpen(true)}> <Button onClick={() => setOpen(true)}>
Edit Class Edit Attendance
</Button> </Button>
} }
</div> </div>
@ -325,6 +325,8 @@ export function InstructorClassList(props) {
const [error, setError] = useState(false); const [error, setError] = useState(false);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [success, setSuccess] = useState(false); const [success, setSuccess] = useState(false);
const [classes, setClasses] = useState([]);
const [sameClasses, setSameClasses] = useState(false);
const handleSubmit = (e) => { const handleSubmit = (e) => {
if (loading) return; if (loading) return;
@ -347,6 +349,22 @@ export function InstructorClassList(props) {
}); });
}; };
useEffect(() => {
requester('/sessions/', 'GET', token)
.then(res => {
setClasses(res.results.filter(x => !x.is_cancelled));
})
.catch(err => {
console.log(err);
});
}, []);
useEffect(() => {
setSameClasses(classes.filter(x =>
moment.utc(x.datetime).tz('America/Edmonton').isSame(input.datetime, 'day')
));
}, [input.datetime]);
return ( return (
<div> <div>
<Header size='medium'>Instructor Panel</Header> <Header size='medium'>Instructor Panel</Header>
@ -354,15 +372,36 @@ export function InstructorClassList(props) {
{!open && success && <p>Added! <Link to={'/classes/'+success}>View the class.</Link></p>} {!open && success && <p>Added! <Link to={'/classes/'+success}>View the class.</Link></p>}
{open ? {open ?
<Form onSubmit={handleSubmit}> <Grid stackable padded columns={2}>
<Header size='small'>Add a Class</Header> <Grid.Column>
<Form onSubmit={handleSubmit}>
<Header size='small'>Add a Class</Header>
<InstructorClassEditor input={input} setInput={setInput} error={error} /> <InstructorClassEditor input={input} setInput={setInput} error={error} />
<Form.Button loading={loading} error={error.non_field_errors}> <Form.Button loading={loading} error={error.non_field_errors}>
Submit Submit
</Form.Button> </Form.Button>
</Form> </Form>
</Grid.Column>
<Grid.Column>
{!!input.datetime &&
<div>
<Header size='small'>Upcoming Classes That Day</Header>
{sameClasses.length ?
sameClasses.map(x =>
<p>
{moment.utc(x.datetime).tz('America/Edmonton').format('LT')} {x.course_name}
</p>
)
:
<p>None</p>
}
</div>
}
</Grid.Column>
</Grid>
: :
<Button onClick={() => setOpen(true)}> <Button onClick={() => setOpen(true)}>
Add a Class Add a Class