feat: integrate with htmx
This commit is contained in:
Björn Fromme
+4
-7
@@ -1,4 +1,4 @@
|
||||
{% extends 'admin/layout.html.twig' %}
|
||||
{% extends 'layout.html.twig' %}
|
||||
|
||||
{% block title %}Verfügbarkeit {{ teamer }}{% endblock %}
|
||||
|
||||
@@ -29,12 +29,9 @@
|
||||
{% if is_granted('DELETE', availability) %}
|
||||
<button type="button"
|
||||
title="Zeitraum entfernen/löschen"
|
||||
{{ stimulus_controller('modal-button', [], [], {'confirmation-modal': '#confirmation-modal'}) }}
|
||||
{{ stimulus_action('modal-button', 'confirmation', null, {
|
||||
'title': 'Bist du sicher?',
|
||||
'content': 'Möchtest du den Zeitraum wirklich löschen?',
|
||||
'target-url': path('app_admin_teamer_availability_delete', { 'teamer_uuid': teamer.uuid, 'availability_id': availability.id, 'r': return_url() })
|
||||
}) }}>
|
||||
hx-get="{{ path('app_admin_teamer_availability_delete', { 'teamer_uuid': teamer.uuid, 'availability_id': availability.id, 'r': return_url() }) }}"
|
||||
hx-target="body"
|
||||
hx-swap="beforeend">
|
||||
{{ icon('delete', 'w-5 h-5') }}
|
||||
</button>
|
||||
{% endif %}
|
||||
@@ -0,0 +1,7 @@
|
||||
{% extends 'htmx_confirmation_modal.html.twig' %}
|
||||
|
||||
{% block content %}
|
||||
<div>
|
||||
Möchtest du die Verfügbarkeit <em>{{ availability }}</em> wirklich löschen?
|
||||
</div>
|
||||
{% endblock %}
|
||||
@@ -10,19 +10,16 @@
|
||||
<div class="flex flex-col items-end space-y-2 md:flex-row md:items-center md:space-x-2 md:space-y-0">
|
||||
<button type="button"
|
||||
class="{{ html_classes('btn btn--small', { 'btn--secondary': filterDto.active }) }}"
|
||||
{{ stimulus_controller('modal-button', [], [], {'ajax-modal': '#ajax-modal'}) }}
|
||||
{{ stimulus_action('modal-button', 'ajax', null, {
|
||||
'title': 'Team filtern',
|
||||
'url': path('app_common_teamer_filter', { 'r': return_url() })
|
||||
}) }}>
|
||||
<div class="flex items-center space-x-1">
|
||||
{{ icon('filter', 'w-4 h-4 shrink-0') }}
|
||||
{% if filterDto.active %}
|
||||
<span class="whitespace-nowrap">{{ filterDto.activeFiltersCount }} Filter aktiv</span>
|
||||
{% else %}
|
||||
<span>Filter</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
title="Team filtern"
|
||||
hx-get="{{ path('app_common_teamer_filter', { 'r': return_url() }) }}"
|
||||
hx-target="body"
|
||||
hx-swap="beforeend">
|
||||
{{ icon('filter', 'w-4 h-4 shrink-0') }}
|
||||
{% if filterDto.active %}
|
||||
<span class="whitespace-nowrap">{{ filterDto.activeFiltersCount }} Filter aktiv</span>
|
||||
{% else %}
|
||||
<span>Filter</span>
|
||||
{% endif %}
|
||||
</button>
|
||||
{% if filterDto.active %}
|
||||
<a href="{{ path('app_common_teamer_filter_reset', { 'r': return_url() }) }}" class="btn btn--small btn--secondary">
|
||||
|
||||
@@ -1,67 +0,0 @@
|
||||
<div class="flex items-start">
|
||||
<div class="flex-1 pr-8">
|
||||
{% include '_partials/_teamer_training_info.html.twig' %}
|
||||
{% include '_partials/_teamer_license_info.html.twig' %}
|
||||
<h2 class="text-lg font-bold">
|
||||
Zustiege
|
||||
</h2>
|
||||
<ul class="pb-8 divide-y divide-gray-200">
|
||||
{% for pickup in teamer.pickups %}
|
||||
<li class="py-2">
|
||||
{{ pickup|bpn_pickup_label }}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<h2 class="text-lg font-bold">
|
||||
Letzte Einsätze
|
||||
</h2>
|
||||
<ul class="pb-4 divide-y divide-gray-200">
|
||||
{% for disposition in recentDispositions %}
|
||||
{% set destination = disposition.assignment.destination %}
|
||||
<li class="py-1">
|
||||
{{ destination.product }}
|
||||
<br>
|
||||
{{ destination.dateFrom|date('d.m.y') }} - {{ destination.dateTo|date('d.m.y') }}
|
||||
</li>
|
||||
{% else %}
|
||||
<li class="py-2">
|
||||
-
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="flex flex-col space-y-4">
|
||||
{% if teamer.photo %}
|
||||
<img src="{{ asset(teamer.photo.filename | imagine_filter('profile')) }}"
|
||||
class="w-32 h-auto border-2 border-primary"
|
||||
alt="{{ teamer.firstName }}">
|
||||
{% else %}
|
||||
<div class="border-2 border-primary">
|
||||
{{ icon('user', 'w-32 h-32 text-gray-200') }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% include '_partials/_rating_stars.html.twig' with { 'teamer': teamer } %}
|
||||
<ul class="pb-8 divide-y divide-gray-200">
|
||||
{% if teamer.communication.phone %}
|
||||
<li class="py-2">
|
||||
<a href="tel:{{ teamer.communication.phone }}" class="flex items-center space-x-2 hover:text-primary">
|
||||
{{ icon('phone', 'w-4 h-4') }}
|
||||
<span class="flex-shrink-0">{{ teamer.communication.phone }}</span>
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
<li class="py-2">
|
||||
<a href="tel:{{ teamer.communication.mobile }}" class="flex items-center space-x-2 hover:text-primary">
|
||||
{{ icon('mobile', 'w-4 h-4') }}
|
||||
<span class="flex-shrink-0">{{ teamer.communication.mobile }}</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="py-2">
|
||||
<a href="mailto:{{ teamer.communication.email }}" class="flex items-center space-x-2 hover:text-primary">
|
||||
{{ icon('at', 'w-4 h-4') }}
|
||||
<span class="flex-shrink-0">{{ teamer.communication.email }}</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,73 @@
|
||||
{% extends 'htmx_modal.html.twig' %}
|
||||
|
||||
{% block title %}Teamer:inneninfo {{ teamer }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="flex items-start">
|
||||
<div class="flex-1 pr-8">
|
||||
{% include '_partials/_teamer_training_info.html.twig' %}
|
||||
{% include '_partials/_teamer_license_info.html.twig' %}
|
||||
<h2 class="text-lg font-bold">
|
||||
Zustiege
|
||||
</h2>
|
||||
<ul class="pb-8 divide-y divide-gray-200">
|
||||
{% for pickup in teamer.pickups %}
|
||||
<li class="py-2">
|
||||
{{ pickup|bpn_pickup_label }}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<h2 class="text-lg font-bold">
|
||||
Letzte Einsätze
|
||||
</h2>
|
||||
<ul class="pb-4 divide-y divide-gray-200">
|
||||
{% for disposition in recentDispositions %}
|
||||
{% set destination = disposition.assignment.destination %}
|
||||
<li class="py-1">
|
||||
{{ destination.product }}
|
||||
<br>
|
||||
{{ destination.dateFrom|date('d.m.y') }} - {{ destination.dateTo|date('d.m.y') }}
|
||||
</li>
|
||||
{% else %}
|
||||
<li class="py-2">
|
||||
-
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="flex flex-col space-y-4">
|
||||
{% if teamer.photo %}
|
||||
<img src="{{ asset(teamer.photo.filename | imagine_filter('profile')) }}"
|
||||
class="w-32 h-auto border-2 border-primary"
|
||||
alt="{{ teamer.firstName }}">
|
||||
{% else %}
|
||||
<div class="border-2 border-primary">
|
||||
{{ icon('user', 'w-32 h-32 text-gray-200') }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% include '_partials/_rating_stars.html.twig' with { 'teamer': teamer } %}
|
||||
<ul class="pb-8 divide-y divide-gray-200">
|
||||
{% if teamer.communication.phone %}
|
||||
<li class="py-2">
|
||||
<a href="tel:{{ teamer.communication.phone }}" class="flex items-center space-x-2 hover:text-primary">
|
||||
{{ icon('phone', 'w-4 h-4') }}
|
||||
<span class="flex-shrink-0">{{ teamer.communication.phone }}</span>
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
<li class="py-2">
|
||||
<a href="tel:{{ teamer.communication.mobile }}" class="flex items-center space-x-2 hover:text-primary">
|
||||
{{ icon('mobile', 'w-4 h-4') }}
|
||||
<span class="flex-shrink-0">{{ teamer.communication.mobile }}</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="py-2">
|
||||
<a href="mailto:{{ teamer.communication.email }}" class="flex items-center space-x-2 hover:text-primary">
|
||||
{{ icon('at', 'w-4 h-4') }}
|
||||
<span class="flex-shrink-0">{{ teamer.communication.email }}</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
@@ -27,22 +27,18 @@
|
||||
<button type="button"
|
||||
class="text-red-500"
|
||||
title="Ausbildung löschen"
|
||||
{{ stimulus_controller('modal-button', [], [], {'confirmation-modal': '#confirmation-modal'}) }}
|
||||
{{ stimulus_action('modal-button', 'confirmation', null, {
|
||||
'title': 'Bist du sicher?',
|
||||
'content': 'Möchtest du die Teilnahme an dieser Schulung wirklich löschen?',
|
||||
'target-url': path('app_admin_teamer_skills_training_attendance_delete', { 'uuid': attendance.uuid })
|
||||
}) }}>
|
||||
hx-get="{{ path('app_admin_teamer_skills_training_attendance_delete', { 'uuid': attendance.uuid }) }}"
|
||||
hx-target="body"
|
||||
hx-swap="beforeend">
|
||||
{{ icon('delete') }}
|
||||
</button>
|
||||
</div>
|
||||
{% else %}
|
||||
<button type="button"
|
||||
{{ stimulus_controller('modal-button', [], [], {'ajax-modal': '#ajax-modal'}) }}
|
||||
{{ stimulus_action('modal-button', 'ajax', null, {
|
||||
'title': 'Teilnahme hinzufügen',
|
||||
'url': path('app_admin_teamer_skills_training_attendance_create', { 'training_id': training.id, 'teamer_id': teamer.id })
|
||||
}) }}>
|
||||
title="Teilnahme hinzufügen"
|
||||
hx-get="{{ path('app_admin_teamer_skills_training_attendance_create', { 'training_id': training.id, 'teamer_id': teamer.id }) }}"
|
||||
hx-target="body"
|
||||
hx-swap="beforeend">
|
||||
{{ icon('calendar', 'w-4 h-4') }}
|
||||
</button>
|
||||
{% endif %}
|
||||
|
||||
@@ -1,9 +0,0 @@
|
||||
{{ form_start(form) }}
|
||||
<div class="flex flex-col space-y-4 pb-8">
|
||||
{{ form_row(form.date) }}
|
||||
</div>
|
||||
<button type="submit" class="btn">
|
||||
Speichern
|
||||
</button>
|
||||
{{ form_rest(form) }}
|
||||
{{ form_end(form) }}
|
||||
@@ -0,0 +1,15 @@
|
||||
{% extends 'htmx_modal.html.twig' %}
|
||||
|
||||
{% block title %}Teilnahme hinzufügen/bestätigen{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
{{ form_start(form, { 'attr': { 'hx-post': app.request.uri, 'hx-target': '#htmx-modal', 'hx-swap': 'outerHTML' } }) }}
|
||||
<div class="flex flex-col space-y-4 pb-8">
|
||||
{{ form_row(form.date) }}
|
||||
</div>
|
||||
<button type="submit" class="btn">
|
||||
Speichern
|
||||
</button>
|
||||
{{ form_rest(form) }}
|
||||
{{ form_end(form) }}
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,8 @@
|
||||
{% extends 'htmx_confirmation_modal.html.twig' %}
|
||||
|
||||
{% block content %}
|
||||
<div>
|
||||
Möchtest du die Teilnahme von <em>{{ attendance.teamer}}</em> an der Schulung
|
||||
<em>{{ attendance.training.name }}</em> wirklich löschen?
|
||||
</div>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user