Are you looking for an overview of your employees’ vacations and sick leaves? Then we would like to introduce you to our new SharePoint vacation calendar today. With our SPFx Webpart you can display and manage your vacations and sick leaves directly in SharePoint. In addition, we also display the vacation entries of all employees, which gives you a good overview of the attendances and absences. In this article we would like to introduce you to the functionalities of our new tool.

Structure of the application

We implemented the vacation calendar with an SPFx web part. In the background, we store the data in two SharePoint lists. There is a SharePoint list in which we store the vacation entries and sick leaves. We use another SharePoint list to store information per employee (such as hours per day, date of entry into the company).

Our SPFx Web Part consists of a calendar view and a left pane, with the most important information for the current employee. In the calendar, we display the vacation entries and sick leaves for the current employee. In addition, we display the vacation entries of all employees.

SharePoint Urlaubskalender

On the left side, the employee can see his remaining vacation days for the year, which we calculate automatically.

Add entries to the SharePoint vacation calendar

If the employee clicks on the button “Add entry”, we open a dialog for adding a new entry. Different entry types can be added, such as “Vacation”, “Sick leave”, “Nursing leave” or similar. We automatically fill the duration of the entry with the number of hours per day of the employee. The employee can set a start date and an (optional) end date.

SharePoint Urlaubskalender: Dialog zum Eintrag Hinzufügen

When saving the entry, we check for which days we have to create entries in the calendar. “Excluded days” can be defined for which no entries should be created. As a result, for example, the weekend or other days can be excluded. Public holidays are also automatically excluded.

By selecting “date cells” directly in the calendar, the employee has another option to add entries. We automatically set the start and end dates to the selected date values.

SharePoint Urlaubskalender: Eintrag hinzufügen

Edit and delete entries

The employee also has the possibility to edit his own entries. If he clicks directly on an entry in the calendar, we open a dialog for editing. The entry can also be deleted there.

Furthermore, an entry can be moved to another date by drag & drop.

By “resizing” an entry you can easily extend it and we automatically create entries for the new date values.

SharePoint Urlaubskalender: Eintrag verschieben und verlängern
Because the data is stored in SharePoint lists, any workflows regarding the approval of leave requests or forwarding of sick leave to the HR department can be easily implemented using Power Automate.

Have we aroused your interest and would you like more information about our SharePoint vacation calendar? Then feel free to contact us. You can also subscribe to our newsletter – then you will be the first to know about news:


Never miss any offers or innovations?

Sign up for our newsletter and be the first to learn about exciting new products and topics around Microsoft SharePoint, Teams, and Co.

You can unsubscribe at any time. Your data will only be used to send our newsletter and will not be passed on to third parties. Additional information on the protection of your data can be found in our privacy policy.