{% extends '@Contao/fragment/_container.html.twig' %}

{% block container %}

    <div class="pb-12">


        <h2 class="mb-6 text-lg font-bold leading-6 text-gray-900 dark:text-gray-50">
            {{ 'applicationList.header.anmeldungen'|trans({}, 'cms') }}
        </h2>

        <twig:Cms:Tabs :items="items" :title="'applicationList.header.anmeldungen'|trans({}, 'cms')"/>

        <div class="pt-4 space-y-12">
            <div>
                {% if attendances is not empty %}
                    <table class="min-w-full divide-y divide-gray-300 dark:divide-gray-700">
                        <thead>
                        <tr>
                            <th scope="col"
                                class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 dark:text-gray-50 sm:pl-0">
                                {{ 'applicationList.header.offer'|trans({}, 'cms') }}
                            </th>
                            <th scope="col"
                                class="px-3 py-3.5 text-left text-sm font-semibold text-gray-900 dark:text-gray-50">
                                {{ 'applicationList.header.participant'|trans({}, 'cms') }}
                            </th>
                            <th scope="col"
                                class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-900 dark:text-gray-50 md:table-cell">
                                {{ 'applicationList.header.application'|trans({}, 'cms') }}
                            </th>
                            <th scope="col"
                                class="hidden px-3 py-3.5 text-left text-sm font-semibold text-gray-900 dark:text-gray-50 sm:table-cell">
                                {{ 'applicationList.header.priority'|trans({}, 'cms') }}
                            </th>
                            <th scope="col" class="relative py-3.5 pl-3 pr-4 sm:pr-0">
                                <span class="sr-only">{{ 'applicationList.header.edit'|trans({}, 'cms') }}</span>
                            </th>
                        </tr>
                        </thead>
                        <tbody class="divide-y divide-gray-200 dark:divide-gray-700">
                        {% for attendance in attendances %}
                            {% set applicationSystem = attribute(applicationSystems, attendance.id) %}
                            <tr id="{{ 'al'~attendance.id~'_tr' }}"
                                class="{{ attendance.offer.isPast ? 'opacity-60' : '' }}">
                                <td class="w-full max-w-0 py-4 pl-4 pr-3 text-sm font-medium text-gray-900 dark:text-gray-50 sm:w-auto sm:max-w-none sm:pl-0">
                                    {% if not attendance.offer.published or not attendance.offer.edition.findCurrentTask('show_offers') %}
                                        <strong class="block font-medium">{{ attendance.offer.name }}</strong>
                                    {% else %}
                                        <a class="block hover:underline font-medium"
                                           data-turbo-frame="modal"
                                           href="{{ path('cms', { to: 'offer_list', edition: attendance.offer.edition, auto_item: offer_auto_item(attendance.offer) }) }}">{{ attendance.offer.name }}</a>
                                    {% endif %}
                                    <span class="block"><twig:Cms:OfferDate :dates="attendance.offer.dates" short /></span>

                                    <dl class="font-normal lg:hidden">
                                        <dt class="sr-only md:hidden">{{ 'applicationList.header.application'|trans({}, 'cms') }}</dt>
                                        <dd class="mt-1 truncate text-gray-500 dark:text-gray-200 md:hidden"
                                            id="{{ 'al'~attendance.id~'_dd_status' }}">
                                            <twig:Cms:ApplicationStatusBadge :attendance="attendance" size="sm"
                                                                             :emoji="true"/>

                                            {% if attendance.isWaiting %}
                                                {% set chance = not attendance.offer.maxParticipants ? 1 : min(1, max(0, attendance.offer.maxParticipants / max(1, attendance.offer.attendancesNotHidden|length))) %}
                                                <span class="block mt-1 {{ chance < 1 ? 'text-orange-600' : 'text-blue-600' }} font-medium text-sm">
                                                {{ 'applicationList.chance'|trans({'chance': chance}, 'cms') }}
                                            </span>
                                            {% endif %}

                                            {% if paymentsEnabled and attendance.payable and not attendance.paid %}
                                                <span class="mt-1 flex items-center text-red-700 text-sm">
                                                <twig:ux:icon name="lucide:triangle-alert" class="size-4 mr-1" />

                                                {{ 'applicationList.paymentPending'|trans({}, 'cms') }}
                                            </span>
                                            {% endif %}
                                        </dd>
                                        <dt class="sr-only sm:hidden">{{ 'applicationList.header.priority'|trans({}, 'cms') }}</dt>
                                        <dd class="mt-1 truncate text-gray-500 dark:text-gray-200 sm:hidden">

                                            {% if applicationSystem and applicationSystem.type == 'lot' and attendance.task and attendance.task.maxApplications %}
                                                <div>
                                                    <p class="mt-0.5">
                                                        <span class="sr-only">{{ 'applicationList.header.priority'|trans({}, 'cms') }} {{ attendance.userPriority }}</span>
                                                        <span aria-hidden="true" class="flex items-center -ml-1">
                                                        {% for i in attendance.task.maxApplications..1 %}
                                                            {% if attendance.userPriority > i %}
                                                                <twig:ux:icon name="lucide:star" class="block h-4 w-4 text-gray-300" />
                                                            {% else %}
                                                                <twig:ux:icon name="lucide:star" class="block h-4 w-4 text-yellow-500" />
                                                            {% endif %}
                                                        {% endfor %}
                                                    </span>
                                                    </p>

                                                    <p>
                                                        <a class="underline hover:no-underline text-blue-700 font-medium text-sm"
                                                           data-turbo-frame="modal"
                                                           href="{{ path('cms', { to: 'applications', action: 'prioritize', id: attendance.participant.id, edition: attendance.offer.edition.id }) }}">
                                                            {{ 'applicationList.changePriority'|trans({}, 'cms') }}
                                                        </a>
                                                    </p>
                                                </div>
                                            {% endif %}
                                        </dd>
                                    </dl>
                                </td>
                                <td class="px-3 py-4 text-sm text-gray-700 dark:text-gray-200">
                                    <span class="block text-gray-900 dark:text-white font-medium">{{ attendance.participant.firstname }}</span>

                                    {% if applicationSystem and applicationSystem.type == 'lot' %}
                                        {% if attendance.friendedAttendances is not empty %}
                                            <span class="text-xs block">
                                            {{ 'applicationList.onlyTogetherWith'|trans({'participants': attendance.friendedAttendances|map(a => a.participant.firstname)|join(' + ')}, 'cms') }}
                                        </span>
                                        {% elseif attendance.friendCode %}
                                            <span class="text-xs block">
                                            {{ 'applicationList.shareFriendCode'|trans({'code': attendance.friendCode.code}, 'cms') }}
                                        </span>
                                        {% endif %}

                                    {% endif %}

                                </td>
                                <td class="hidden px-3 py-4 text-sm text-gray-500 dark:text-gray-200 md:table-cell"
                                    id="{{ 'al'~attendance.id~'_td_status' }}">
                                    <twig:Cms:ApplicationStatusBadge :attendance="attendance" size="sm" :emoji="true"/>

                                    {% if attendance.isWaiting %}
                                        {% set chance = not attendance.offer.maxParticipants ? 1 : min(1, max(0, attendance.offer.maxParticipants / max(1, attendance.offer.attendancesNotHidden|length))) %}
                                        <span class="block mt-1.5 {{ chance < 1 ? 'text-orange-600' : 'text-blue-600' }} font-medium text-sm">
                                        {{ 'applicationList.chance'|trans({'chance': chance}, 'cms') }}
                                    </span>
                                    {% endif %}

                                    {% if paymentsEnabled and attendance.payable and not attendance.paid %}
                                        <span class="mt-1.5 flex items-center text-red-700 text-sm">
                                        <twig:ux:icon name="lucide:triangle-alert" class="size-4 mr-1" />

                                        {{ 'applicationList.paymentPending'|trans({}, 'cms') }}
                                    </span>
                                    {% endif %}
                                </td>
                                <td class="hidden px-3 py-4 text-sm text-gray-500 dark:text-gray-200 sm:table-cell">

                                    {% if applicationSystem and applicationSystem.type == 'lot' and attendance.task and attendance.task.maxApplications %}
                                        <div>
                                            <p class="mt-0.5">
                                                <span class="sr-only">{{ 'applicationList.header.priority'|trans({}, 'cms') }} {{ attendance.userPriority }}</span>
                                                <span aria-hidden="true" class="flex items-center -ml-1">
                                                {% for i in attendance.task.maxApplications..1 %}
                                                    {% if attendance.userPriority > i %}
                                                        <twig:ux:icon name="lucide:star" class="block h-4 w-4 text-gray-300" />
                                                    {% else %}
                                                        <twig:ux:icon name="lucide:star" class="block h-4 w-4 text-yellow-500" />
                                                    {% endif %}
                                                {% endfor %}
                                            </span>
                                            </p>

                                            <p class="mt-1">
                                                <a class="underline hover:no-underline text-blue-700 font-medium text-sm"
                                                   data-turbo-frame="modal"
                                                   href="{{ path('cms', { to: 'applications', action: 'prioritize', id: attendance.participant.id, edition: attendance.offer.edition.id }) }}">
                                                    {{ 'applicationList.changePriority'|trans({}, 'cms') }}
                                                </a>
                                            </p>

                                        </div>
                                    {% endif %}

                                </td>
                                <td class="py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-0"
                                    id="{{ 'al'~attendance.id~'_td_withdraw' }}">
                                    <a href="{{ path('cms_attendance_show', { attendance: attendance.uuid.toBase58 }) }}"
                                       class="inline-flex underline hover:no-underline text-primary-700 dark:text-primary-300">
                                        {{ 'applicationList.view'|trans({}, 'cms') }}
                                    </a>
                                    {% if attendance.stash or (attendance.offer.edition and not attendance.offer.edition.activeTasks('allocation').isEmpty) %}
                                        {# Time-disabled #}
                                    {% elseif workflow_can(attendance, 'withdraw') %}
                                        <a href="{{ path('cms', { to: 'applications', action: 'abmelden', id: attendance.id }) }}"
                                           data-turbo-frame="modal"
                                           class="mt-1 inline-flex underline hover:no-underline text-red-700">
                                            {{ 'applicationList.withdraw'|trans({}, 'cms') }}
                                        </a>
                                    {% elseif attendance.isWithdrawn or (attendance.offer.dates|first and attendance.offer.dates|first.begin <= date()) %}
                                    {% elseif attendance.offer.applicationDeadline and date() >= attendance.offer.applicationDeadline %}
                                        <p class="text-xs">{{ 'applicationList.withdrawalPeriodEnded'|trans({}, 'cms') }}</p>
                                    {% endif %}
                                </td>
                            </tr>
                        {% endfor %}
                        </tbody>
                    </table>
                {% else %}
                    <h3 class="py-3.5 text-sm font-semibold text-gray-900 dark:text-white">{{ 'applicationList.noApplications'|trans({}, 'cms') }}</h3>
                    <p class="mt-1 text-sm text-gray-500 dark:text-gray-400">
                        {{ 'applicationList.noApplicationsText'|trans({}, 'cms') }}
                    </p>

                {% endif %}
            </div>

            {% if isPaymentConfigured %}
                <twig:Cms:Payment/>
            {% endif %}
        </div>
    </div>

{% endblock %}

{% block withdrawn_success_stream %}
    <twig:Turbo:Stream:Update target="{{ 'al'~attendance.id~'_td_withdraw' }}"/>

    <twig:Turbo:Stream:Replace target="#{{ 'al'~attendance.id~'_td_status' }},#{{ 'al'~attendance.id~'_dd_status' }}">
        <twig:Cms:ApplicationStatusBadge :attendance="attendance" size="sm" :emoji="true"/>
    </twig:Turbo:Stream:Replace>

    <twig:Turbo:Stream:Prepend target="#notifications">
        <twig:Cms:Notification title="Die Anmeldung wurde zurückgezogen"/>
    </twig:Turbo:Stream:Prepend>
{% endblock %}

{% block deleted_success_stream %}
    <twig:Turbo:Stream:Remove target="{{ 'al'~attendance.id~'_tr' }}"/>

    <twig:Turbo:Stream:Prepend target="#notifications">
        <twig:Cms:Notification title="Die Anmeldung wurde gelöscht"/>
    </twig:Turbo:Stream:Prepend>
{% endblock %}
