Split Entry into parts visually

[Michael Salzlechner]

We have entries in the scheduler and the entries consist of 3 parts

Rampup

Visit

Cleaning

We would like to display this information using different background colors in the schedule entry 
each visit could have different rampup and cleaning times

i could create custom CSS but how do i pass the sizes of the parts to the CSS as they could be different?

Attachment: schedcol_21c069e1.png

[Vijayakumar Rajasekar]

Hi Michael Salzlechner,

 

Thank you for reaching out to syncfusion support.

 

We validated your query regarding displaying different background colors in the schedule entry. This can be achieved by customizing the schedule entries using EventTemplate. Like below,

 

    <ScheduleEventSettings TValue="ServiceAppointment" DataSource="@Appointments">

        <Template>

            @{

// … custom height or width calculations as per your need

            }

            <div class="custom-appointment">

                <div class="Ramp-up" style="width: @(rampupPercent)%">

                    Ramp-up (@appointment.RampupMinutes min)

                </div>

// … Apply the dimensions in the div

            </div>

        </Template>

    </ScheduleEventSettings>

 

Please find the attached sample that we prepared based on your scenario.

Documentaion: Appointment customization in Blazor Scheduler Component | Syncfusion

 

Kindly get back us if need any further assistance.

Regards,

Vijayakumar R

Attachment: EventTemplate_f92e9439.zip