... | ... |
@@ -3,15 +3,15 @@ |
3 | 3 |
{% block filter %} |
4 | 4 |
<form hx-get="{{ pageUrl is defined ? pageUrl : '' }}" hx-push-url="true" hx-headers='{"VR-Ajax": "WaSlotsModule"}' hx-trigger="change, submit" hx-target="closest .content-wrapper" class="filter"> |
5 | 5 |
<div class="row"> |
6 |
- <div class="col-md-3 kapazitaet"> |
|
6 |
+ <div class="col-md-2 kapazitaet"> |
|
7 | 7 |
<select name="filter_kapazitaet"> |
8 |
- <option value="">-- Behälterkapazität --</option> |
|
8 |
+ <option value="">-- Kapazität --</option> |
|
9 | 9 |
{% for option in filter.kapazitaet.options %} |
10 | 10 |
<option value="{{ option }}"{% if filter.kapazitaet.selected is defined and filter.kapazitaet.selected == option %} selected{% endif %}>{{ option }}</option> |
11 | 11 |
{% endfor %} |
12 | 12 |
</select> |
13 | 13 |
</div> |
14 |
- <div class="col-md-3 standort"> |
|
14 |
+ <div class="col-md-2 standort"> |
|
15 | 15 |
<select name="filter_standort"> |
16 | 16 |
<option value="">-- Standort --</option> |
17 | 17 |
{% for key, option in filter.standort.options %} |
... | ... |
@@ -19,6 +19,14 @@ |
19 | 19 |
{% endfor %} |
20 | 20 |
</select> |
21 | 21 |
</div> |
22 |
+ <div class="col-md-2 ernteart"> |
|
23 |
+ <select name="filter_ernteart"> |
|
24 |
+ <option value="">-- Ernteart --</option> |
|
25 |
+ {% for key, option in filter.ernteart.options %} |
|
26 |
+ <option value="{{ key }}"{% if filter.ernteart.selected is defined and filter.ernteart.selected == key %} selected{% endif %}>{{ option }}</option> |
|
27 |
+ {% endfor %} |
|
28 |
+ </select> |
|
29 |
+ </div> |
|
22 | 30 |
<div class="col-md-3 sorte"> |
23 | 31 |
<select name="filter_sorte"> |
24 | 32 |
<option value="">-- Sorte --</option> |
... | ... |
@@ -83,15 +83,15 @@ |
83 | 83 |
<div class="grid-c-3 ernteart bg-white p-1"> |
84 | 84 |
<div class="u-flex u-flex-wrap u-gap-1"> |
85 | 85 |
<i class="icon-schere-outline"></i> |
86 |
- <div class="t-label">Ernteart</div> |
|
86 |
+ <div class="t-label">Erntearten</div> |
|
87 | 87 |
{{ slot.ernteart|join(', ') }} |
88 | 88 |
</div> |
89 | 89 |
</div> |
90 | 90 |
<div class="grid-c-6 lage bg-white p-1"> |
91 | 91 |
<div class="u-flex u-flex-wrap u-gap-1"> |
92 | 92 |
<i class="icon-lage-outline"></i> |
93 |
- <span class="t-label">Lage</span> |
|
94 |
- {{ slot.lage }} |
|
93 |
+ <span class="t-label">Lagen</span> |
|
94 |
+ {{ slot.lage|join(', ') }} |
|
95 | 95 |
</div> |
96 | 96 |
</div> |
97 | 97 |
{% if slot.anmerkungen is defined and slot.anmerkungen %} |
... | ... |
@@ -48,44 +48,66 @@ |
48 | 48 |
<div class="accordion-dis"> |
49 | 49 |
<div class="slots"> |
50 | 50 |
{% for slot in slots %} |
51 |
- <div class="row u-items-center{{ not slot.buchbar ? ' error' : '' }}{{ slot.gebucht ? ' booked' : '' }}"> |
|
52 |
- <div class="col-10"> |
|
53 |
- <div class="row"> |
|
54 |
- <div class="col-3 time pl-0"> |
|
55 |
- <div class="icon-uhr-outline u-flex u-items-center u-gap-1"> |
|
51 |
+ <div class="row py-2 u-flex-nowrap-md u-items-center{{ not slot.buchbar ? ' error' : '' }}{{ slot.gebucht ? ' booked' : '' }}"> |
|
52 |
+ <div class="col-12"> |
|
53 |
+ <div class="grid-md u-gap-1"> |
|
54 |
+ <div class="grid-c-3 time bg-white p-1"> |
|
55 |
+ <div class="u-flex u-flex-wrap u-gap-1"> |
|
56 |
+ <i class="icon-uhr-outline"></i> |
|
56 | 57 |
<span class="t-label">Uhrzeit</span> |
57 | 58 |
{{ slot.time|date('H:i') }} |
58 | 59 |
</div> |
59 |
- <div class="icon-uhr-standort u-flex u-items-center u-gap-1"> |
|
60 |
- <span class="t-label">Standort</span> |
|
61 |
- {{ slot.standort }} |
|
62 |
- </div> |
|
63 | 60 |
</div> |
64 |
- <div class="col-3 behaelter"> |
|
65 |
- <div class="icon-behaelter-outline u-flex u-items-center u-gap-1"> |
|
66 |
- <span class="t-label">Verfügbare Behälterkapazität</span> |
|
61 |
+ <div class="grid-c-3 behaelter bg-white p-1"> |
|
62 |
+ <div class="u-flex u-flex-wrap u-gap-1"> |
|
63 |
+ <i class="icon-behaelter-outline"></i> |
|
64 |
+ <span class="t-label">Verfügbare Kapazität</span> |
|
67 | 65 |
{{ slot.behaelterAvailable }} |
68 | 66 |
</div> |
69 | 67 |
</div> |
70 |
- <div class="col-6 rebsorten pr-0"> |
|
71 |
- <div class="icon-reben-outline u-flex u-items-center u-gap-1"> |
|
68 |
+ <div class="grid-c-6 rebsorten bg-white p-1"> |
|
69 |
+ <div class="u-flex u-flex-wrap u-gap-1"> |
|
70 |
+ <i class="icon-reben-outline"></i> |
|
72 | 71 |
<div class="t-label">Verarbeitete Sorten</div> |
72 |
+ |
|
73 | 73 |
</div> |
74 | 74 |
{{ slot.sorte|join(', ') }} |
75 | 75 |
</div> |
76 |
+ <div class="grid-c-3 standort bg-white p-1"> |
|
77 |
+ <div class="u-flex u-flex-wrap u-gap-1"> |
|
78 |
+ <i class="icon-standort-outline"></i> |
|
79 |
+ <span class="t-label">Standort</span> |
|
80 |
+ {{ slot.standort }} |
|
81 |
+ </div> |
|
82 |
+ </div> |
|
83 |
+ <div class="grid-c-3 ernteart bg-white p-1"> |
|
84 |
+ <div class="u-flex u-flex-wrap u-gap-1"> |
|
85 |
+ <i class="icon-schere-outline"></i> |
|
86 |
+ <div class="t-label">Ernteart</div> |
|
87 |
+ {{ slot.ernteart|join(', ') }} |
|
88 |
+ </div> |
|
89 |
+ </div> |
|
90 |
+ <div class="grid-c-6 lage bg-white p-1"> |
|
91 |
+ <div class="u-flex u-flex-wrap u-gap-1"> |
|
92 |
+ <i class="icon-lage-outline"></i> |
|
93 |
+ <span class="t-label">Lage</span> |
|
94 |
+ {{ slot.lage }} |
|
95 |
+ </div> |
|
96 |
+ </div> |
|
76 | 97 |
{% if slot.anmerkungen is defined and slot.anmerkungen %} |
77 |
- <div class="col-12 px-0"> |
|
78 |
- <div class="icon-info-outline u-flex u-items-center u-gap-1"> |
|
98 |
+ <div class="grid-c-12 bg-white p-1"> |
|
99 |
+ <div class="u-flex u-flex-wrap u-gap-1"> |
|
100 |
+ <i class="icon-info-outline"></i> |
|
79 | 101 |
<span class="t-label">Anmerkungen</span> |
102 |
+ {{ slot.anmerkungen|raw }} |
|
103 |
+ <a hx-get="/_ajax/vr_wa/v1/slot?do=annotation&id={{ slot.id }}" hx-target="body" hx-swap="beforeend" href="javascript:;">mehr lesen</a> |
|
80 | 104 |
</div> |
81 |
- {{ slot.anmerkungen|raw }} |
|
82 |
- <a hx-get="/_ajax/vr_wa/v1/slot?do=annotation&id={{ slot.id }}" hx-target="body" hx-swap="beforeend" href="javascript:;">mehr lesen</a> |
|
83 | 105 |
</div> |
84 | 106 |
{% endif %} |
85 | 107 |
</div> |
86 | 108 |
</div> |
87 |
- <div class="col u-text-right action"> |
|
88 |
- <a hx-get="/_ajax/vr_wa/v1/slot?do=details&id={{ slot.id }}" hx-target="body" hx-swap="beforeend" href="javascript:;" class="btn btn--xs m-0">Buchen</a> |
|
109 |
+ <div class="col u-text-right action mt-2 mt-0-md"> |
|
110 |
+ <a hx-get="/_ajax/vr_wa/v1/slot?do=details&id={{ slot.id }}" hx-target="body" hx-swap="beforeend" href="javascript:;" class="btn btn--sm btn-info m-0">Buchen</a> |
|
89 | 111 |
</div> |
90 | 112 |
</div> |
91 | 113 |
{% endfor %} |
... | ... |
@@ -5,15 +5,23 @@ |
5 | 5 |
<div class="row"> |
6 | 6 |
<div class="col-md-3 kapazitaet"> |
7 | 7 |
<select name="filter_kapazitaet"> |
8 |
- <option value="">-</option> |
|
8 |
+ <option value="">-- Behälterkapazität --</option> |
|
9 | 9 |
{% for option in filter.kapazitaet.options %} |
10 | 10 |
<option value="{{ option }}"{% if filter.kapazitaet.selected is defined and filter.kapazitaet.selected == option %} selected{% endif %}>{{ option }}</option> |
11 | 11 |
{% endfor %} |
12 | 12 |
</select> |
13 | 13 |
</div> |
14 |
+ <div class="col-md-3 standort"> |
|
15 |
+ <select name="filter_standort"> |
|
16 |
+ <option value="">-- Standort --</option> |
|
17 |
+ {% for key, option in filter.standort.options %} |
|
18 |
+ <option value="{{ key }}"{% if filter.standort.selected is defined and filter.standort.selected == key %} selected{% endif %}>{{ option }}</option> |
|
19 |
+ {% endfor %} |
|
20 |
+ </select> |
|
21 |
+ </div> |
|
14 | 22 |
<div class="col-md-3 sorte"> |
15 | 23 |
<select name="filter_sorte"> |
16 |
- <option value="">-</option> |
|
24 |
+ <option value="">-- Sorte --</option> |
|
17 | 25 |
{% for key, option in filter.sorte.options %} |
18 | 26 |
<option value="{{ key }}"{% if filter.sorte.selected is defined and filter.sorte.selected == key %} selected{% endif %}>{{ option }}</option> |
19 | 27 |
{% endfor %} |
... | ... |
@@ -21,13 +29,13 @@ |
21 | 29 |
</div> |
22 | 30 |
<div class="col-md-3 leseart"> |
23 | 31 |
<select name="filter_leseart"> |
24 |
- <option value="">-</option> |
|
32 |
+ <option value="">-- Leseart --</option> |
|
25 | 33 |
{% for key, option in filter.leseart.options %} |
26 | 34 |
<option value="{{ key }}"{% if filter.leseart.selected is defined and filter.leseart.selected == key %} selected{% endif %}>{{ option }}</option> |
27 | 35 |
{% endfor %} |
28 | 36 |
</select> |
29 | 37 |
</div> |
30 |
- <div class="col submit"><button class="u-block w-100p">Filter übernehmen</button></div> |
|
38 |
+{# <div class="col submit"><button class="u-block w-100p">Filter übernehmen</button></div>#} |
|
31 | 39 |
</div> |
32 | 40 |
</form> |
33 | 41 |
{% endblock %} |
... | ... |
@@ -41,20 +49,43 @@ |
41 | 49 |
<div class="slots"> |
42 | 50 |
{% for slot in slots %} |
43 | 51 |
<div class="row u-items-center{{ not slot.buchbar ? ' error' : '' }}{{ slot.gebucht ? ' booked' : '' }}"> |
44 |
- <div class="col-2 time icon-uhr-outline"> |
|
45 |
- <span class="t-label">Uhrzeit</span> |
|
46 |
- {{ slot.time|date('H:i') }} |
|
47 |
- </div> |
|
48 |
- <div class="col-3 behaelter icon-behaelter-outline"> |
|
49 |
- <span class="t-label">Verfügbare Behälterkapazität</span> |
|
50 |
- {{ slot.behaelterAvailable }} |
|
51 |
- </div> |
|
52 |
- <div class="col-5 rebsorten icon-reben-outline"> |
|
53 |
- <span class="t-label">Verarbeitete Sorten</span> |
|
54 |
- {{ slot.sorte|join(', ') }} |
|
52 |
+ <div class="col-10"> |
|
53 |
+ <div class="row"> |
|
54 |
+ <div class="col-3 time pl-0"> |
|
55 |
+ <div class="icon-uhr-outline u-flex u-items-center u-gap-1"> |
|
56 |
+ <span class="t-label">Uhrzeit</span> |
|
57 |
+ {{ slot.time|date('H:i') }} |
|
58 |
+ </div> |
|
59 |
+ <div class="icon-uhr-standort u-flex u-items-center u-gap-1"> |
|
60 |
+ <span class="t-label">Standort</span> |
|
61 |
+ {{ slot.standort }} |
|
62 |
+ </div> |
|
63 |
+ </div> |
|
64 |
+ <div class="col-3 behaelter"> |
|
65 |
+ <div class="icon-behaelter-outline u-flex u-items-center u-gap-1"> |
|
66 |
+ <span class="t-label">Verfügbare Behälterkapazität</span> |
|
67 |
+ {{ slot.behaelterAvailable }} |
|
68 |
+ </div> |
|
69 |
+ </div> |
|
70 |
+ <div class="col-6 rebsorten pr-0"> |
|
71 |
+ <div class="icon-reben-outline u-flex u-items-center u-gap-1"> |
|
72 |
+ <div class="t-label">Verarbeitete Sorten</div> |
|
73 |
+ </div> |
|
74 |
+ {{ slot.sorte|join(', ') }} |
|
75 |
+ </div> |
|
76 |
+ {% if slot.anmerkungen is defined and slot.anmerkungen %} |
|
77 |
+ <div class="col-12 px-0"> |
|
78 |
+ <div class="icon-info-outline u-flex u-items-center u-gap-1"> |
|
79 |
+ <span class="t-label">Anmerkungen</span> |
|
80 |
+ </div> |
|
81 |
+ {{ slot.anmerkungen|raw }} |
|
82 |
+ <a hx-get="/_ajax/vr_wa/v1/slot?do=annotation&id={{ slot.id }}" hx-target="body" hx-swap="beforeend" href="javascript:;">mehr lesen</a> |
|
83 |
+ </div> |
|
84 |
+ {% endif %} |
|
85 |
+ </div> |
|
55 | 86 |
</div> |
56 | 87 |
<div class="col u-text-right action"> |
57 |
- <a hx-get="/_ajax/vr_wa/v1/slot?do=details&id={{ slot.id }}" hx-target="body" hx-swap="beforeend" href="javascript:;" class="btn btn--xs m-0">Anzeigen & Buchen</a> |
|
88 |
+ <a hx-get="/_ajax/vr_wa/v1/slot?do=details&id={{ slot.id }}" hx-target="body" hx-swap="beforeend" href="javascript:;" class="btn btn--xs m-0">Buchen</a> |
|
58 | 89 |
</div> |
59 | 90 |
</div> |
60 | 91 |
{% endfor %} |
1 | 1 |
new file mode 100644 |
... | ... |
@@ -0,0 +1,95 @@ |
1 |
+<div hx-get="{{ insert_tag('env::request') }}" hx-headers='{"VR-Ajax": "WaSlotsModule"}' hx-trigger="updateWaList from:body, updateWaBooking from:body" class="{{ class }} content-wrapper block"{{ cssID }}{% if style is defined and style is not empty %} style="{{ style }}"{% endif %}> |
|
2 |
+ |
|
3 |
+ {% block filter %} |
|
4 |
+ <form hx-get="{{ pageUrl is defined ? pageUrl : '' }}" hx-push-url="true" hx-headers='{"VR-Ajax": "WaSlotsModule"}' hx-trigger="change, submit" hx-target="closest .content-wrapper" class="filter"> |
|
5 |
+ <div class="row"> |
|
6 |
+ <div class="col-md-3 kapazitaet"> |
|
7 |
+ <select name="filter_kapazitaet"> |
|
8 |
+ <option value="">-</option> |
|
9 |
+ {% for option in filter.kapazitaet.options %} |
|
10 |
+ <option value="{{ option }}"{% if filter.kapazitaet.selected is defined and filter.kapazitaet.selected == option %} selected{% endif %}>{{ option }}</option> |
|
11 |
+ {% endfor %} |
|
12 |
+ </select> |
|
13 |
+ </div> |
|
14 |
+ <div class="col-md-3 sorte"> |
|
15 |
+ <select name="filter_sorte"> |
|
16 |
+ <option value="">-</option> |
|
17 |
+ {% for key, option in filter.sorte.options %} |
|
18 |
+ <option value="{{ key }}"{% if filter.sorte.selected is defined and filter.sorte.selected == key %} selected{% endif %}>{{ option }}</option> |
|
19 |
+ {% endfor %} |
|
20 |
+ </select> |
|
21 |
+ </div> |
|
22 |
+ <div class="col-md-3 leseart"> |
|
23 |
+ <select name="filter_leseart"> |
|
24 |
+ <option value="">-</option> |
|
25 |
+ {% for key, option in filter.leseart.options %} |
|
26 |
+ <option value="{{ key }}"{% if filter.leseart.selected is defined and filter.leseart.selected == key %} selected{% endif %}>{{ option }}</option> |
|
27 |
+ {% endfor %} |
|
28 |
+ </select> |
|
29 |
+ </div> |
|
30 |
+ <div class="col submit"><button class="u-block w-100p">Filter übernehmen</button></div> |
|
31 |
+ </div> |
|
32 |
+ </form> |
|
33 |
+ {% endblock %} |
|
34 |
+ |
|
35 |
+ {% block content %} |
|
36 |
+ {% if days is defined and days|length %} |
|
37 |
+ <div class="list"> |
|
38 |
+ {% for day,slots in days %} |
|
39 |
+ <h3 class="toggler-dis u-flex u-items-center mt-2">{{ day|date('d.m.Y') }}</h3> |
|
40 |
+ <div class="accordion-dis"> |
|
41 |
+ <div class="slots"> |
|
42 |
+ {% for slot in slots %} |
|
43 |
+ <div class="row u-items-center{{ not slot.buchbar ? ' error' : '' }}{{ slot.gebucht ? ' booked' : '' }}"> |
|
44 |
+ <div class="col-2 time icon-uhr-outline"> |
|
45 |
+ <span class="t-label">Uhrzeit</span> |
|
46 |
+ {{ slot.time|date('H:i') }} |
|
47 |
+ </div> |
|
48 |
+ <div class="col-3 behaelter icon-behaelter-outline"> |
|
49 |
+ <span class="t-label">Verfügbare Behälterkapazität</span> |
|
50 |
+ {{ slot.behaelterAvailable }} |
|
51 |
+ </div> |
|
52 |
+ <div class="col-5 rebsorten icon-reben-outline"> |
|
53 |
+ <span class="t-label">Verarbeitete Sorten</span> |
|
54 |
+ {{ slot.sorte|join(', ') }} |
|
55 |
+ </div> |
|
56 |
+ <div class="col u-text-right action"> |
|
57 |
+ <a hx-get="/_ajax/vr_wa/v1/slot?do=details&id={{ slot.id }}" hx-target="body" hx-swap="beforeend" href="javascript:;" class="btn btn--xs m-0">Anzeigen & Buchen</a> |
|
58 |
+ </div> |
|
59 |
+ </div> |
|
60 |
+ {% endfor %} |
|
61 |
+ </div> |
|
62 |
+ </div> |
|
63 |
+ {% endfor %} |
|
64 |
+ </div> |
|
65 |
+ {% else %} |
|
66 |
+ <div class="placeholder"> |
|
67 |
+ <h6 class="placeholder-title">Derzeit sind keine buchbaren Anlieferungszeiten verfügbar</h6> |
|
68 |
+ <div class="placeholder-subtitle">Sie können uns auch gerne anrufen.</div> |
|
69 |
+ </div> |
|
70 |
+ {% endif %} |
|
71 |
+ {% endblock %} |
|
72 |
+ |
|
73 |
+ {% block script %} |
|
74 |
+ {#<script> |
|
75 |
+ jQuery(function($) { |
|
76 |
+ $(".mod_wa_slots_list").accordion({ |
|
77 |
+ // Put custom options here |
|
78 |
+ heightStyle: 'content', |
|
79 |
+ header: '.toggler', |
|
80 |
+ collapsible: true, |
|
81 |
+ create: function(event, ui) { |
|
82 |
+ ui.header.addClass('active'); |
|
83 |
+ $('.toggler').attr('tabindex', 0); |
|
84 |
+ }, |
|
85 |
+ activate: function(event, ui) { |
|
86 |
+ ui.newHeader.addClass('active'); |
|
87 |
+ ui.oldHeader.removeClass('active'); |
|
88 |
+ $('.toggler').attr('tabindex', 0); |
|
89 |
+ } |
|
90 |
+ }); |
|
91 |
+ }); |
|
92 |
+ </script>#} |
|
93 |
+ {% endblock %} |
|
94 |
+ |
|
95 |
+</div> |