Index in Vue Schedule component

16 Mar 20233 minutes to read

The Scheduler component is an event calendar which facilitates user with the common Outlook and Google calendar features,
thus allowing the users to plan and manage their events or appointments and its time in an efficient way.

Key Features

  • Views - Scheduler is now available with 10 different view modes – day, week, work week, month, timeline day, timeline week, timeline work week, timeline month, agenda and month agenda.
    It is possible to configure view-based settings on each view mode. The Week view is set as active view by default.
  • Data binding - Seamless data binding with various client-
    side and remote data sources thus allowing the data to load on demand by default to reduce the data transfer and loading time.
  • Recurrence options - Allows the user to repeat a set of events on a daily, weekly, monthly, or yearly basis.
  • Drag and Drop - Events can be easily rescheduled by simply dragging and dropping them onto a new desired location.
  • Resizing - Allows to change the event timing by resizing them to the desired time interval using its handlers.
  • Custom editor template - Template option is available for event editor,
    thus allowing the users to add their own custom modal design and also provides option to add additional fields onto the default event editor.
  • Adaptive rendering - Adapts with optimal user interface on mobile and desktop,
    thus helping the user’s application to scale elegantly across all the form-factors without any additional effort.
  • Multiple resources - Allows the Scheduler to be shared by multiple resources and the events of each resource are displayed relevantly either in expandable groups (Timeline views) or
    vertical hierarchy one after the other (Calendar views).
  • Virtual scrolling - Allows to load a large set of resources and events on Scheduler instantly as you scroll, to experience better performance.
  • Time zone - Regardless of whatever time zone your system follows,
    Scheduler supports setting your own required time zone value to it as well as to each event –
    thus allowing the events to display on its exact local time.
  • Block time intervals - The specific range of date and time on Scheduler can be blocked, thus preventing it from user interactions.
  • Template - The key elements like events, date header, resource header, time cells,
    work cells and event tooltip comes with the default template support which allows the flexible end-user customization to embed any kind of text,
    images, or styles to it.
  • Customizable working days and hours - Users can set specific work hour range which is visually differentiated with active colour.
    Also, the working days collection can be customized with specific days, so that the remaining days will be considered as weekend. There is also an option to set different working hours for each resource.
  • Export/Import - Supports exporting and importing of appointment(s) to and from an ICS file and also appointment(s) data can be exported as excel file format.
  • Localization - All the static text and date content on Scheduler can be localized to any desired language.
    Also, it can be displayed with appropriate time mode and date-format as per the locale culture.
  • Keyboard interaction - All the common actions such as traversing through the events, multiple cell selection,
    add/edit/delete the appointments, navigate to other views or dates and much more can be performed through keyboard inputs.
  • RTL - Supports to display the Scheduler component in the direction from right to left.

You can refer to our Vue Scheduler feature tour page for its groundbreaking feature representations. You can also explore our Vue Scheduler example to knows how to present and manipulate data.