enhanc: keep calendar always open

[GretaD]

fixes #6321
requires: nextcloud-libraries/nextcloud-vue#6095

[codecov]

Codecov Report

Attention: Patch coverage is 0% with 10 lines in your changes missing coverage. Please review.

Project coverage is 23.54%. Comparing base (bd73f27) to head (b373d5b).
Report is 2 commits behind head on main.

Files with missing lines	Patch %	Lines
src/views/Appointments/Booking.vue	0.00%	10 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff            @@
##               main    #6322   +/-   ##
=========================================
  Coverage     23.54%   23.54%           
  Complexity      454      454           
=========================================
  Files           247      247           
  Lines         11700    11700           
  Branches       2203     2203           
=========================================
  Hits           2755     2755           
  Misses         8625     8625           
  Partials        320      320           

Flag	Coverage Δ
javascript	15.07% <0.00%> (ø)
php	59.53% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[nimishavijay]

Nice! :) Also see #6324 for how we can improve the design for this as it looks a bit outdated atm

[GretaD]

@nimishavijay please have another look at the screenshot. In the appointment case, we cannot use the native datetimepicker, because the native one doesnt allow for the dropdown to be always open, because that is browser defined behavior.

I tried to adopt the normal one, as much as i could, to your mockup in the other ticket.

[jancborchardt]

Looks quite good! :)

• One of the most important improvements UX-wise is: "disable dates for which no slots are available", is that possible to grey out the dates with no slots? added them to the general list, not to be delivered with this pr
• The time zone picker doesn’t need a full heading, or just "Time zone", not "Select a time zone"
• The "Select a date and time slot" would be good to split, or if the time slots are shifted a bit down so it fits with the layout in @nimishavijay’s mockup
• Regarding the third column: Currently the vertical gap seems rather large, it could be reduced a little bit
• There can be a larger gap for every hour as a little divider. In many cases like here, there would then be slots of 4 grouped together to get a better feeling for the time rather than a long list. added them to the general list, not to be delivered with this pr