# Booking

You can book your assets directly in the dashboard or smart view via the **Booking Widget**.

<figure><img src="https://3489494878-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9GvUpaatBiReR43XFSMg%2Fuploads%2FdHfh1VdboF6fV0Ht9X3c%2Fimage.png?alt=media&#x26;token=8960c9ce-05ff-4e5c-9417-711acdb05bbf" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
The Booking Widget is not a predefined widget and must first be created as a custom widget.
{% endhint %}

## Operation

The widget offers a clear display of current bookings and enables simple management of bookings directly in the view.

### Booking Overview

<figure><img src="https://3489494878-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9GvUpaatBiReR43XFSMg%2Fuploads%2FMqj8daWhwkZPufh0OT1G%2FBuchung.png?alt=media&#x26;token=4fe6573e-3bbe-4407-9e45-19c0dd0a7c5c" alt=""><figcaption></figcaption></figure>

In the widget, you see an overview of all active bookings.

1. Click on **\[A]** to display the detailed booking list.&#x20;

   ▷ The booking list **\[1]** is expanded and shows all current bookings with times.
2. In the list, the **title** and asset are displayed for each booking **\[2]**.
3. Click on **\[3]** to edit a booking.&#x20;

   ▷ The editing window is opened.
4. Click on **\[4]** to delete a booking.&#x20;

   ▷ The booking is immediately removed.
5. Click on **\[5]** to collapse the window again.

### Start a Booking

<div data-full-width="true"><figure><img src="https://3489494878-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9GvUpaatBiReR43XFSMg%2Fuploads%2FZT973cpQSht1RKmyogLU%2Fbooking%20bedienung%201%20(2).png?alt=media&#x26;token=e864abe6-0d5e-4235-82e9-086210fef323" alt=""><figcaption></figcaption></figure></div>

To switch to the booking view:

1. Click on **\[A1]** to search for an asset.
2. Alternatively: Click directly on the asset **\[A2]** in the floor image.

<table data-full-width="true"><thead><tr><th width="87">Element</th><th width="190.20001220703125">Title</th><th>Details</th></tr></thead><tbody><tr><td>[B]</td><td>More options</td><td>Open additional options.</td></tr><tr><td>[C1]</td><td>Zoom in</td><td>Enlarge the display of the floor.</td></tr><tr><td>[C2]</td><td>Zoom out</td><td>Reduce the display of the floor.</td></tr><tr><td>[D]</td><td>Reserved bookings</td><td>Already made bookings are displayed here.</td></tr><tr><td>[D1]</td><td>Edit booking</td><td>Opens the booking for editing.</td></tr><tr><td>[D2]</td><td>Delete booking</td><td>Deletes the booking immediately.</td></tr><tr><td>[E]</td><td>Close</td><td>Closes the asset's detail window.</td></tr><tr><td>[F]</td><td>Book more</td><td>Opens the booking view for further entries.</td></tr></tbody></table>

### Booking Options

After you have selected an asset, several options are available to you to further customize your booking.

<figure><img src="https://3489494878-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9GvUpaatBiReR43XFSMg%2Fuploads%2F6roTUkkpEJx4B5leGXY8%2Fbooking%20bedienung%202.png?alt=media&#x26;token=de967466-7246-4e1d-90a1-3203c2972ea5" alt=""><figcaption></figcaption></figure>

<table data-full-width="true"><thead><tr><th width="90.39999389648438">Element</th><th width="203.60003662109375">Title</th><th>Details</th></tr></thead><tbody><tr><td><strong>[G]</strong></td><td>Close</td><td>End the booking process prematurely.</td></tr><tr><td><strong>[H1]</strong></td><td>Next week</td><td>Jump to the next week.</td></tr><tr><td><strong>[H2]</strong></td><td>Previous week</td><td>Go back one week.</td></tr><tr><td><strong>[I]</strong></td><td>Advanced Booking</td><td>Switch to the view where you can book a detailed time slot</td></tr><tr><td><strong>[J]</strong></td><td>Quick Booking</td><td>Quickly book the entire day, morning, or afternoon. The times can be changed in the <a href="../../../../mandatory-base/platform-core/connect-hub/edge-app-marketplace-for-plug-ins-and-extentions/apps/booking">App</a></td></tr></tbody></table>

### Quick Booking

With the "Quick Booking" function, you can quickly and efficiently select a specific period for your booking.

<figure><img src="https://3489494878-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9GvUpaatBiReR43XFSMg%2Fuploads%2F8wanaJGRwghg3jjltpFL%2Fbooking%20bedienung%203.png?alt=media&#x26;token=18260731-bfc7-49b5-9d5d-35730472c687" alt=""><figcaption></figcaption></figure>

<table data-full-width="true"><thead><tr><th width="74">Element</th><th width="193">Title</th><th>Details</th></tr></thead><tbody><tr><td><strong>[K]</strong></td><td>Title</td><td>Give the booking a title.</td></tr><tr><td><strong>[L]</strong></td><td>Select date</td><td>Select the date you want to book for.</td></tr><tr><td><strong>[M]</strong></td><td>Select time period</td><td>Choose whether you want to book the first half of the day, the second half, or the whole day. The exact periods can be configured in the Booking <a href="../../../../mandatory-base/platform-core/connect-hub/edge-app-marketplace-for-plug-ins-and-extentions/apps/booking">App</a>.</td></tr><tr><td><strong>[N]</strong></td><td>Back</td><td>Return to the booking options.</td></tr><tr><td><strong>[O]</strong></td><td>Confirm</td><td>Complete the booking by clicking "Confirm".</td></tr></tbody></table>

### Advanced Booking

For detailed bookings, you can use the advanced booking option to set specific periods.

<figure><img src="https://3489494878-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9GvUpaatBiReR43XFSMg%2Fuploads%2FkwbZAa4czWkUB9au7OPN%2Fbooking%20bedienung%204.png?alt=media&#x26;token=c0e3ef36-93c5-4584-ba9e-481620782513" alt=""><figcaption></figcaption></figure>

<table data-full-width="true"><thead><tr><th width="85">Element</th><th width="173.39996337890625">Title</th><th>Details</th></tr></thead><tbody><tr><td><strong>[K]</strong></td><td>Title</td><td>Give the booking a title.</td></tr><tr><td><strong>[L]</strong></td><td>Select date</td><td>Select the date you want to book for.</td></tr><tr><td><strong>[M]</strong></td><td>Select time period</td><td>Set the exact period you want to book. Use the sliders to determine the period. Red-marked areas are already booked.</td></tr><tr><td><strong>[N]</strong></td><td>Back</td><td>Return to the booking options.</td></tr><tr><td><strong>[O]</strong></td><td>Confirm</td><td>Complete the booking by clicking "Confirm".</td></tr></tbody></table>

## Configure Widget

<figure><img src="https://3489494878-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9GvUpaatBiReR43XFSMg%2Fuploads%2Fzk2Y02BYMOd60b74j5uv%2Fbooking%20bedienung%205%20(1).png?alt=media&#x26;token=4659a122-9528-4e5c-9ef8-7eebaedd5d65" alt=""><figcaption></figcaption></figure>

Make sure you are in the *Dashboard* menu.

1. Click on **"Add widget"**.
2. Click on **"View"**.
3. Click on **"Booking"**.&#x20;

   ▷ The window **\[A]** appears.
4. Optional: In **\[A1]**, select a *Primary Asset*.&#x20;

   ◈ This is used for the title and possible alarms.
5. In **\[A2]**, select the *floor* that should be displayed in the widget.
6. In **\[A3]**, select how much space the widget should occupy on the dashboard (*1 cell*, *2 cells*, *full width*).
7. Click on **\[A4]** to automatically add *all bookable assets*.
8. Alternatively: In **\[A5]**, manually add individual assets by selecting them via the search field.
9. Click on **\[A6]** to save the widget.&#x20;

   ▷ The widget now appears on the dashboard.

{% hint style="info" %}
For the assets to be visible in **\[A5]**, the option **"**[**Asset can be booked**](https://docs.buildings.ability.abb/collection/platform/map-and-floor/floor/placing-assets-on-a-floor)**"** must have first been activated for the respective asset on the floor.
{% endhint %}