add check if there are no specialists with time blocks
This commit is contained in:
parent
6c3555e974
commit
90c3733d33
@ -1,6 +1,6 @@
|
|||||||
import React, { useState, useEffect } from 'react';
|
import React, { useState, useEffect } from 'react';
|
||||||
import { useNavigate, useLocation } from 'react-router-dom';
|
import { useNavigate, useLocation } from 'react-router-dom';
|
||||||
import { Container, makeStyles, Grid, Button, Card, CardContent, Box } from '@material-ui/core';
|
import { Container, makeStyles, Grid, Button, Card, CardContent, Box, Typography } from '@material-ui/core';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
||||||
const useStyles = makeStyles((theme) => ({
|
const useStyles = makeStyles((theme) => ({
|
||||||
@ -22,6 +22,12 @@ const useStyles = makeStyles((theme) => ({
|
|||||||
},
|
},
|
||||||
gridButton: {
|
gridButton: {
|
||||||
textAlign: 'right'
|
textAlign: 'right'
|
||||||
|
},
|
||||||
|
gridTitle: {
|
||||||
|
textAlign: 'center'
|
||||||
|
},
|
||||||
|
boldFont: {
|
||||||
|
fontWeight: 'bold'
|
||||||
}
|
}
|
||||||
}));
|
}));
|
||||||
|
|
||||||
@ -90,41 +96,62 @@ export default function AgendarHorarioComponent() {
|
|||||||
|
|
||||||
const classes = useStyles();
|
const classes = useStyles();
|
||||||
|
|
||||||
return (
|
if (disponibilidades.length > 0) {
|
||||||
<Container component="main" maxWidth="sm">
|
return (
|
||||||
<div className={classes.paper}>
|
<Container component="main" maxWidth="sm">
|
||||||
<Grid className={classes.cardGrid} container spacing={2}>
|
<div className={classes.paper}>
|
||||||
{disponibilidades.map((disponibilidad) => (
|
<Grid className={classes.cardGrid} container spacing={2}>
|
||||||
<Box key={disponibilidad._id} mt={2}>
|
{disponibilidades.map((disponibilidad) => (
|
||||||
<Card className={classes.card} variant="outlined">
|
<Box key={disponibilidad._id} mt={2}>
|
||||||
<CardContent>
|
<Card className={classes.card} variant="outlined">
|
||||||
<Grid container spacing={2}>
|
<CardContent>
|
||||||
<Grid item xs={8}>
|
<Grid container spacing={2}>
|
||||||
{new Date(disponibilidad.fecha).toLocaleDateString("es-CL",
|
<Grid item xs={8}>
|
||||||
{
|
{new Date(disponibilidad.fecha).toLocaleDateString("es-CL",
|
||||||
weekday: 'long',
|
{
|
||||||
year: 'numeric',
|
weekday: 'long',
|
||||||
month: 'long',
|
year: 'numeric',
|
||||||
day: 'numeric'
|
month: 'long',
|
||||||
})} {disponibilidad.horario} horas
|
day: 'numeric'
|
||||||
|
})} {disponibilidad.horario} horas
|
||||||
|
</Grid>
|
||||||
|
<Grid className={classes.gridButton} item xs={4}>
|
||||||
|
<Button
|
||||||
|
fullWidth
|
||||||
|
variant="contained"
|
||||||
|
color="primary"
|
||||||
|
onClick={() => confirmar(disponibilidad._id)}
|
||||||
|
>
|
||||||
|
Confirmar
|
||||||
|
</Button>
|
||||||
|
</Grid>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid className={classes.gridButton} item xs={4}>
|
</CardContent>
|
||||||
<Button
|
</Card>
|
||||||
fullWidth
|
</Box>
|
||||||
variant="contained"
|
))}
|
||||||
color="primary"
|
</Grid>
|
||||||
onClick={() => confirmar(disponibilidad._id)}
|
</div>
|
||||||
>
|
</Container>
|
||||||
Confirmar
|
);
|
||||||
</Button>
|
}
|
||||||
</Grid>
|
else {
|
||||||
</Grid>
|
return (
|
||||||
</CardContent>
|
<Container component="main" maxWidth="md">
|
||||||
</Card>
|
<div className={classes.paper}>
|
||||||
|
<Grid className={classes.cardGrid} container spacing={2}>
|
||||||
|
<Box mt={2}>
|
||||||
|
<Grid container spacing={2}>
|
||||||
|
<Grid item xs={12}>
|
||||||
|
<Typography variant="h4" className={classes.boldFont} gutterBottom>
|
||||||
|
La especialista elegida no tiene horarios disponibles.
|
||||||
|
</Typography>
|
||||||
|
</Grid>
|
||||||
|
</Grid>
|
||||||
</Box>
|
</Box>
|
||||||
))}
|
</Grid>
|
||||||
</Grid>
|
</div>
|
||||||
</div>
|
</Container>
|
||||||
</Container>
|
);
|
||||||
);
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user