@using Syncfusion.Blazor.Schedule
<SfSchedule TValue="AppointmentData" Width="100%" Height="650px" @bind-SelectedDate="@CurrentDate">
<ScheduleEventSettings DataSource="@dataSource">
<Template>
@foreach (string location in (context as AppointmentData)?.Subject)
{
<div class="@location">@location</div>
}
<div>@((context as AppointmentData)?.StartTime)</div>
<div>@((context as AppointmentData)?.EndTime)</div>
</Template>
</ScheduleEventSettings>
</SfSchedule>
@code {
private List<AppointmentData>
dataSource = new List<AppointmentData>{
new AppointmentData
{
Id = 1,
Subject = new string[] { "NewYork", "London", "Mumbai", "Chicago" },
StartTime = new DateTime(2022, 1, 7, 15, 0, 0),
EndTime = new DateTime(2022, 1, 7, 17, 0, 0),
ConferenceId = new int[] { 1, 2, 3 }
}
};
}
<style>
.NewYork, .London, .Mumbai,
.Chicago {
display: none;
}
[data-group-index="0"]
.NewYork,
[data-group-index="1"]
.London,
[data-group-index="2"]
.Mumbai {
display: block !important;
}
</style>
|