Work Week

The work week layout shows Monday to Friday by the hour: the week layout without its weekend, for a calendar of working days, where Saturday and Sunday would only take room from the days that have appointments. A calendar opens in it with DefaultLayout (React: defaultLayout), and the toolbar's layout picker switches to it.

React Blazor

A work week of appointments

Every sample appointment the demo holds, five days of them. The arrows move a week at a time.

React example Blazor example React TypeScript Razor

Days and hours

Each day is a column of half-hour rows, as in the day layout: it opens scrolled to 8:00, marks the current time in today's column, sets appointments at the same time side by side, and keeps all-day appointments in the row above the hours. A day's name at the top of its column opens that day in the day layout, when the calendar offers it.

Moving and creating

In an Editable calendar, an appointment can be dragged to another day as well as another time, and its bottom edge to change when it ends; selecting a stretch of a day starts a new appointment over it.

The calendar's other layouts: Day, Week, Month and Agenda.