|
@using Syncfusion.EJ2.Blazor.Schedule
<EjsSchedule TValue="AppointmentData" Height="550px" ModelType="@Model" SelectedDate="@(new DateTime(2019, 1, 31))">
<ScheduleQuickInfoTemplates TemplateType="TemplateType.Event">
<HeaderTemplate>
<div class="e-subject-wrap">
<div class="e-subject e-text-ellipsis" title="">@((context as TemplateArgs).Subject)</div>
</div>
</HeaderTemplate>
<ContentTemplate>
<div class="e-cell-content" style="width:inherit">
<form class="e-schedule-form">
<div style="padding:10px">
<label>Time </label>:
<span>@($"{(context as TemplateArgs).StartTime.ToUniversalTime().ToString("hh:mm tt")} - {(context as TemplateArgs).EndTime.ToUniversalTime().ToString("hh:mm tt")}")</span>
</div>
<div style="padding:10px">
<label>Description </label>:
<span>@((context as TemplateArgs).Description)</span>
</div>
</form>
</div>
</ContentTemplate>
</ScheduleQuickInfoTemplates>
<ScheduleEventSettings DataSource="@DataSource"></ScheduleEventSettings>
</EjsSchedule>
@code{
public class TemplateArgs
{
public string Subject { get; set; }
public DateTime StartTime { get; set; }
public DateTime EndTime { get; set; }
public string Description { get; set; }
}
public TemplateArgs Model = new TemplateArgs();
List<AppointmentData> DataSource = new List<AppointmentData> {
new AppointmentData { Id = 1, Subject = "Meeting", StartTime = new DateTime(2019, 1, 31, 9, 30, 0) , EndTime = new DateTime(2019, 1, 31, 11, 0, 0), Description = "Discussion"}
};
public class AppointmentData
{
public int Id { get; set; }
public string Subject { get; set; }
public string Location { get; set; }
public DateTime StartTime { get; set; }
public DateTime EndTime { get; set; }
public string Description { get; set; }
public bool IsAllDay { get; set; }
public string RecurrenceRule { get; set; }
public string RecurrenceException { get; set; }
public Nullable<int> RecurrenceID { get; set; }
}
} | 
