Importación
import { NuiScheduler, type NuiSchedulerEvent } from '@needless-ui/angular/scheduler';NuiScheduler
Eventos en un mes, una semana, un día o una agenda.
| Nombre | Tipo | Predeterminado | Descripción |
|---|---|---|---|
eventsInput | NuiSchedulerEvent<T>[] | [] | Los eventos que se muestran. |
viewBidireccional | 'month' | 'week' | 'day' | 'agenda' | 'week' | La vista que se muestra. |
viewsInput | NuiSchedulerView[] | all four | Las vistas entre las que se puede cambiar. |
dateBidireccional | NuiDate | today | El día que se muestra, donde también está el foco del teclado. |
slotMinutesInput | number | 30 | Minutos por fila de la cuadrícula horaria, y el paso con el que se mueven los eventos. |
scrollHourInput | number | 8 | La hora en la que se abre la cuadrícula horaria. |
agendaDaysInput | number | 30 | Cuántos días por delante muestra la agenda. |
editableInput | boolean | false | Los eventos se pueden mover y redimensionar, con el puntero y con el teclado. |
selectableInput | boolean | false | Se puede elegir un intervalo en la cuadrícula, para crear eventos. |
firstDayInput | 1 … 7 | El primer día de la semana, 1 para el lunes. Por defecto, el de la configuración regional. | |
headingLevelInput | number | 2 | El nivel de encabezado del título; los días de la agenda bajan un nivel más. |
localeInput | string | LOCALE_ID | Da formato a los días y las horas. |
labelsInput | Partial<NuiSchedulerLabels> | Todos los textos que el planificador muestra o anuncia, para traducirlos. | |
cornersInput | NuiCorners | La forma de sus esquinas: round, squircle, bevel, scoop, notch o square. | |
radiusInput | NuiRadius | El tamaño de sus esquinas: none, small, medium, large o full. | |
densityInput | NuiDensity | Cuánto espacio ocupa: compact, regular o roomy. | |
eventClickOutput | NuiSchedulerEvent<T> | Emite el evento en el que se hace clic, o que se abre con Intro. | |
eventChangeOutput | { event, start, end } | Emite las horas nuevas de un evento tras moverlo o redimensionarlo. | |
slotSelectOutput | { start, end, allDay } | Emite el intervalo elegido en la cuadrícula. | |
rangeChangeOutput | { start, end } | Emite el primer y el último día que se muestran cuando cambian. |
Los inputs de personalización que no definas siguen el atributo data-nui-* más cercano. Consulta la guía de personalización.
NuiSchedulerEvent
Un evento. El final de un evento con hora no se incluye; el de un evento de todo el día es su último día.
| Nombre | Tipo | Predeterminado | Descripción |
|---|---|---|---|
id, titlePropiedad | string | Su clave, y lo que muestra. | |
start, endPropiedad | NuiDateTime | NuiDate | Fechas y horas, o solo fechas para los eventos de todo el día. | |
allDayPropiedad | boolean | Por defecto, si start no tiene hora. | |
tonePropiedad | 'accent' | 'neutral' | 'success' | 'warning' | 'danger' | 'accent' | Su color. |
editablePropiedad | boolean | Si se puede mover, diga lo que diga el planificador. | |
dataPropiedad | T | Cualquier otra cosa que quieras guardar con él. |
NuiSchedulerEventTemplate
Dibuja los eventos. El contexto contiene el evento y su horario como texto.