EventCalendar

Une vue mensuelle avec des événements lisibles d’un coup d’œil. Les événements sur plusieurs jours apparaissent chaque jour concerné, et une journée chargée affiche un lien +n de plus.

Pourquoi c’est utile

• Événements sur une grille mensuelle
• Événements sur plusieurs jours
• Débordement géré

Où il trouve sa place

• Calendriers d’équipe
• Jours fériés
• Listes d’événements

Exemple

<EventCalendar Events="_events" @bind-Month="_month" OnEventClick="@(e => _last = e.Title)" OnDayClick="DayClicked" />
<span>Last click: @_last</span>

@code {
    private DateTime _month = new(DateTime.Today.Year, DateTime.Today.Month, 1);
    private string _last = "none";

    private readonly List<CalendarEvent> _events = Build();

    private void DayClicked(DateTime day) => _last = day.ToString("D");

    private static List<CalendarEvent> Build()
    {
        var first = new DateTime(DateTime.Today.Year, DateTime.Today.Month, 1);
        return
        [
            new("Planning", first.AddDays(2).AddHours(9)),
            new("Release", first.AddDays(9), null, Severity.Success),
            new("Conference", first.AddDays(11), first.AddDays(13), Severity.Warning),
            new("Incident review", first.AddDays(11).AddHours(14), null, Severity.Error),
            new("Team lunch", first.AddDays(11).AddHours(12), null, Severity.Neutral),
            new("Demo", first.AddDays(11).AddHours(16)),
            new("Retro", first.AddDays(20))
        ];
    }
}

Un court fragment. Ajoutez @using RayCraft.Blazor.Components à votre page et utilisez un mode de rendu interactif.

Inclus dans RayCraft Free. Des exemples fonctionnels se trouvent dans le dépôt GitHub (MIT); il contient du code d’exemple et de démonstration, pas le code de la bibliothèque.

Tous les contrôles · Documentation