Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 7289 | Rev 7292 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |

import React, { useState } from 'react'
import { Container, Grid } from '@mui/material'
import { Calendar, momentLocalizer } from 'react-big-calendar'
import moment from 'moment'
import EventsList from '../../components/calendar/EventsList'
import ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos'
import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos'
import 'react-big-calendar/lib/sass/styles.scss'

moment.locale('es-ES')
const localizer = momentLocalizer(moment)

const CalendarPage = () => {
  const [events, setEvents] = useState([
    {
      id: 0,
      title: 'All Day Event very long title',
      allDay: true,
      start: new Date('2023/08/30'),
    },
  ])

  return (
    <Container as="main" className="px-0">
      <Grid container spacing={2}>
        <Grid item xs={12} md={8} spacing={3}>
          <Calendar
            views={['day', 'week', 'month']}
            selectable
            localizer={localizer}
            defaultDate={new Date()}
            defaultView="month"
            onSelectEvent={(event) => alert(event.title)}
            events={events}
            messages={{
              next: <ArrowForwardIosIcon />,
              previous: <ArrowBackIosIcon />,
              today: 'Hoy',
              month: 'Mes',
              week: 'Semana',
              day: 'Día',
            }}
          />
        </Grid>
        <Grid item xs={12} md={4}>
          <EventsList />
        </Grid>
      </Grid>
    </Container>
  )
}

export default CalendarPage