{% extends "@FerienpassAdmin/layout/base.html.twig" %}
{% trans_default_domain 'admin' %}

{% block main %}

    <div class="mb-4 @lg:mb-8 md:flex md:items-center md:justify-between">
            <twig:Admin:Offer:Header offer="{{ offer }}" detailed="{{ true }}"/>
    </div>

    <div
            data-controller="ferienpass--admin-tabs"
            data-ferienpass--admin-tabs-current-class="bg-gray-200 text-gray-800"
            data-ferienpass--admin-tabs-default-class="text-gray-600 hover:text-gray-800"
            class="mt-6 space-y-6"
    >

        <div>
            <nav class="-ml-3 flex space-x-4" aria-label="Tabs">
                <a
                        href="#"
                        data-action="ferienpass--admin-tabs#select:prevent"
                        data-ferienpass--admin-tabs-target="button"
                        data-ferienpass--admin-tabs-tab-param="web-1"
                        class="rounded-md px-3 py-2 text-sm font-medium">
                    Detailansicht (Web)</a>
                <a
                        href="#"
                        data-action="ferienpass--admin-tabs#select:prevent"
                        data-ferienpass--admin-tabs-target="button"
                        data-ferienpass--admin-tabs-tab-param="web-2"
                        class="rounded-md px-3 py-2 text-sm font-medium">
                    Listenansicht (Web)</a>
                {% for pdf in pdfs %}
                    <a
                            href="#"
                            data-action="ferienpass--admin-tabs#select:prevent"
                            data-ferienpass--admin-tabs-target="button"
                            data-ferienpass--admin-tabs-tab-param="pdf-{{ pdf }}"
                            class="rounded-md px-3 py-2 text-sm font-medium">
                        {{ "#{pdf}.pdf.0"|trans([], 'export') }}</a>
                {% endfor %}
            </nav>
        </div>

        <div class="bg-white overflow-hidden shadow rounded-lg">

            <div
                    data-ferienpass--admin-tabs-target="tab"
                    data-tab="web-1"
                    style="height: 500px"
                    class="hidden overflow-y-scroll">
                {{ include('@FerienpassAdmin/page/offers/proof/web-details.html.twig') }}
            </div>

            <div style="height: 500px"
                 class="hidden overflow-y-scroll"
                 data-ferienpass--admin-tabs-target="tab"
                 data-tab="web-2"
            >
                {{ include('@FerienpassAdmin/page/offers/proof/web-list.html.twig') }}
            </div>

            {% for pdf in pdfs %}
                <div
                        data-ferienpass--admin-tabs-target="tab"
                        data-tab="pdf-{{ pdf }}"
                        class="hidden"
                >

                    {{ include('@FerienpassAdmin/page/offers/proof/pdf.html.twig') }}

                    <div class="px-4 py-5 sm:p-6">
                        <twig:Admin:Button href="{{ path('admin_print_proof', { edition: offer.edition.alias, id: offer.id, name: pdf, '_format': 'pdf', dl: '1' }) }}">
                            Korrekturabzug (PDF) herunterladen
                        </twig:Admin:Button>
                    </div>

                </div>
            {% endfor %}

        </div>

    </div>

{% endblock %}
