{% extends 'teamer/layout.html.twig' %}

{% block title %}Einsatzübersicht{% endblock %}

{% block content %}
    <h1 class="text-2xl font-bold pb-4">
        Einsatzübersicht
    </h1>
    {% if errors|length %}
        <div class="border border-red-500 rounded-md p-4 text-red-500 mb-8">
            <ul>
                {% for error in errors %}
                    <li>
                        {{ error.message }}
                    </li>
                {% endfor %}
            </ul>
        </div>
    {% endif %}

    {{ form_start(filterForm) }}
    <div class="border border-gray-200 rounded-md p-2 mb-4">
        <div class="grid grid-cols-2 md:grid-cols-5 gap-x-1 gap-y-2 pb-2">
            {{ form_row(filterForm.dateFrom) }}
            {{ form_row(filterForm.dateTo) }}
            {{ form_row(filterForm.jobProfile) }}
            {{ form_row(filterForm.destination) }}
            {{ form_row(filterForm.duration) }}
        </div>
        <div class="flex items-center space-x-2">
            {{ form_widget(filterForm.apply, { 'attr': { 'class': 'btn btn--small' } }) }}
            {{ form_widget(filterForm.reset, { 'attr': { 'class': 'btn btn--small btn--secondary' } }) }}
        </div>
    </div>
    {{ form_rest(filterForm) }}
    {{ form_end(filterForm) }}


    <div class="grid sm:grid-cols-2 md:grid-cols-3 gap-4 pb-4">
        {% for assignment in pagination %}
            <div class="relative flex flex-col justify-between rounded-md border border-gray-200 bg-gray-100 p-4">
                <div class="flex flex-col space-y-2 pb-2">
                    <div class="flex items-start space-x-2">
                        {{ icon('flag-' ~ assignment.destination.country, 'w-5 h-5 shrink-0') }}
                        <span class="flex-1 font-bold">{{ assignment.destination.product }}</span>
                    </div>
                    <div class="flex items-start space-x-2">
                        {{ icon('calendar', 'w-5 h-5 shrink-0') }}
                        <span class="flex-1">{{ assignment.effectivePeriod.start|date('d.m.Y') }} - {{ assignment.effectivePeriod.end|date('d.m.Y') }}</span>
                    </div>
                    <div class="flex items-start space-x-2">
                        {{ icon('profile', 'w-5 h-5 shrink-0') }}
                        <span class="flex-1">{{ assignment.jobProfile.name }}</span>
                    </div>
                    <div class="flex items-start space-x-2">
                        {{ icon('house', 'w-5 h-5 shrink-0') }}
                        <span class="flex-1">{{ assignment.destination.hotel }}</span>
                    </div>
                    {% if assignment.pickup %}
                        <div class="flex items-start space-x-2">
                            {{ icon('bus', 'w-5 h-5 shrink-0') }}
                            <span>{{ assignment.pickup|bpn_pickup_label|default('-') }} {{ assignment.effectivePickupDate ? assignment.effectivePickupDate|date('d.m.Y') : '' }}</span>
                        </div>
                    {% endif %}
                </div>
                <div>
                    {% if assignment.applications|length %}
                        {% set application = assignment.applications[0] %}
                        {% if application.status == constant('App\\Entity\\Application::STATUS_REJECTED') %}
                            {% set icon = 'close' %}
                            {% set class = 'bg-gray-100 text-gray-800 hover:bg-gray-50' %}
                            {% set url = path('app_teamer_assignment', { 'uuid': assignment.uuid, 'r': return_url() }) %}
                            {% set label = 'Bewerbung abgelehnt' %}
                        {% else %}
                            {% set icon = 'hourglass' %}
                            {% set class = 'bg-yellow-100 text-yellow-800 hover:bg-yellow-50' %}
                            {% set url = path('app_teamer_assignment', { 'uuid': assignment.uuid, 'r': return_url() }) %}
                            {% set label = 'in Bearbeitung' %}
                        {% endif %}
                    {% elseif assignment.dispositions|length %}
                        {% set icon = 'check' %}
                        {% set class = 'bg-green-100 text-green-700 hover:bg-green-50' %}
                        {% set url = path('app_teamer_disposition_detail', { 'uuid': assignment.dispositions[0].uuid }) %}
                        {% set label = 'eingeteilt' %}
                    {% else %}
                        {% set icon = 'hand' %}
                        {% set class = '' %}
                        {% set url = path('app_teamer_assignment', { 'uuid': assignment.uuid, 'r': return_url() }) %}
                        {% set label = 'bewerben' %}
                    {% endif %}
                    <a href="{{ url }}"
                       class="btn btn--small flex items-center space-x-2 {{ class }}">
                        {{ icon(icon, 'w-4 h-4 shrink-0') }}
                        <span>{{ label }}</span>
                    </a>
                </div>
                {% set isBookmarked = teamer.bookmarks.contains(assignment) %}
                <a href="{{ path('app_teamer_bookmark_toggle', { 'uuid': assignment.uuid, 'r': return_url() }) }}"
                   class="absolute top-0 right-0 mt-2 mr-2"
                   title="{{ isBookmarked ? 'Von der Merkliste löschen' : 'Auf die Merkliste setzen' }}">
                    {{ icon('star', html_classes('w-5 h-5', { 'text-yellow-500': isBookmarked, 'text-gray-200': not isBookmarked } )) }}
                </a>
            </div>
        {% endfor %}
    </div>
    {{ knp_pagination_render(pagination, 'paginator/sliding_boxes.html.twig') }}
{% endblock %}