60 lines
3.1 KiB
Twig
60 lines
3.1 KiB
Twig
{#
|
|
The plan: heading, legend, span picker, then one section per room with a card per spot.
|
|
Every ResourceType renders the same way, so a new one needs no template of its own.
|
|
|
|
Colouring needs no JavaScript at all: the plan is re-rendered server side for the selected day
|
|
and span, so free/taken/yours is decided in Twig. Note "free" is always relative to the span
|
|
in the header -- a desk booked 09:00-13:00 is free for an afternoon board and taken for an
|
|
all-day one.
|
|
#}
|
|
<div class="rounded-md border border-gray-200 p-4">
|
|
<div class="flex flex-wrap items-baseline justify-between gap-2 pb-2">
|
|
<h2 class="!pb-0">{{ selected_date|format_datetime(pattern: 'EEEE, d. MMMM y') }}</h2>
|
|
<div class="flex items-center gap-4 text-xs text-gray-500">
|
|
<span class="flex items-center gap-1"><span class="w-3 h-3 rounded-sm bg-emerald-50 border-2 border-emerald-500"></span> frei</span>
|
|
<span class="flex items-center gap-1"><span class="w-3 h-3 rounded-sm bg-amber-50 border-2 border-amber-500"></span> teilweise frei</span>
|
|
<span class="flex items-center gap-1"><span class="w-3 h-3 rounded-sm bg-gray-200 border-2 border-gray-400"></span> belegt</span>
|
|
<span class="flex items-center gap-1"><span class="w-3 h-3 rounded-sm bg-primary border-2 border-primary-dark"></span> deine</span>
|
|
</div>
|
|
</div>
|
|
|
|
{% include 'board/_timerange.html.twig' %}
|
|
|
|
{% if is_past %}
|
|
<p class="pb-4 text-sm text-amber-700">Vergangener Tag — hier lässt sich nichts mehr buchen.</p>
|
|
{% endif %}
|
|
|
|
{% if resources is empty %}
|
|
<p class="py-8 text-center text-sm text-gray-500">Für diesen Bereich ist noch nichts eingerichtet.</p>
|
|
{% else %}
|
|
{% import 'board/_spot.html.twig' as plan %}
|
|
{% set time_params = selected_time.allDay ? {} : { from: selected_time.start, to: selected_time.end } %}
|
|
|
|
<div class="space-y-6">
|
|
{#
|
|
Rooms in their configured order, then anything without one. Ungrouped spots get no
|
|
heading: a kind of resource that is not split across rooms (the car park) has
|
|
nothing to say there that the page heading has not already said.
|
|
#}
|
|
{% for spot_group in spot_groups %}
|
|
<section>
|
|
{% if spot_group.group %}
|
|
{% set free = spot_group.freeCount %}
|
|
<h3 class="!mb-0 pb-2 text-sm font-semibold text-gray-500 md:text-sm">
|
|
{{- spot_group.group.label -}}
|
|
{%- if free > 0 %} <span class="text-emerald-600">· {{ free }} frei</span>
|
|
{%- else %} <span>· belegt</span>{% endif -%}
|
|
</h3>
|
|
{% endif %}
|
|
|
|
<div class="grid grid-cols-2 gap-3 sm:grid-cols-3 lg:grid-cols-4">
|
|
{% for spot in spot_group.spots %}
|
|
{{ plan.spot(spot, selected_date, is_past, time_params) }}
|
|
{% endfor %}
|
|
</div>
|
|
</section>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|