{% extends 'eshop/@layout.html.twig' %}

{% block keywords %}{% endblock %}
{% block description %}{% endblock %}
{% block title %}{{ 'title_cart_delivery_and_payment'|trans({}, 'shop') }}{% endblock %}

{% block system_main %}
    <div>
        {{ form_start(form) }}
        <h2>{{ 'title_choose_delivery'|translate }}</h2>
        {% for carrier in carriers %}
            {% set carrierAttributes = '' %}
            {% if carrier.type == constant('App\\Enum\\CarrierType::ZASILKOVNA') %}
                {% set carrierAttributes = 'data-controller="zasilkovna" data-api-key="'~ zasilkovnaApiKey ~'"' %}
            {% endif %}
            <div class="row mb-3">
                <div class="col-12">
                    <div class="card carrier-choice" {{ carrierAttributes|raw }}>
                        <div class="card-body">
                            <div class="box box-check">
                                <label class="form-check">
                                    <input class="form-check-input" type="radio"
                                            {% if carrierAttributes %}
                                                data-implementation="zasilkovna"
                                            {% endif %}
                                           data-action="cart#carrierSelected"
                                           value="{{ carrier.id }}"
                                           name="delivery" {% if loop.first %}checked="checked"{% endif %}>
                                    <b class="border-oncheck"></b>
                                    <div class="row">
                                        <div class="col-2">
                                            {% if carrier.logo %}
                                                <img src="{{ carrier.logoPath }}" class="carrier-logo"
                                                     alt="{{ carrier.name }}">
                                            {% endif %}
                                        </div>
                                        <div class="col-8">
                                            <strong class="form-check-label">
                                                {{ carrier.name }}
                                            </strong>
                                            {% if carrierAttributes %}
                                                <br>
                                                <div>
                                                    <span class="packeta-title d-none">{{ 'address'|translate }}: </span>
                                                    <span class="packeta-selector-value"
                                                          data-action="click->cart#carrierSelected">
                                                                </span>
                                                </div>
                                                <input type="hidden" name="carrier_address">
                                                <button class="btn btn-light btn-packetka d-none"
                                                        data-action="click->cart#carrierSelected:prevent:stop">
                                                    {{ 'button_setup_pickup_point'|translate }}
                                                </button>
                                                <div class="carrier-error text-danger d-none">
                                                    {{ 'alert_no_pickup_address_found'|translate }}
                                                </div>
                                            {% endif %}
                                        </div>
                                        <div class="col-2 text-right carrier-extra-price">
                                            {% if carrier.price %}
                                                {{ carrier.price|money }}
                                            {% else %}
                                                {{ 'free'|translate }}
                                            {% endif %}
                                        </div>
                                    </div>
                                </label>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        {% endfor %}
        <div class="payments-controller">
            <h2>{{ 'title_choose_payment'|translate }}</h2>
            {{ render(controller('App\\Controller\\Shop\\PaymentController::showCartPayment', {payments})) }}
        </div>
        <button class="btn btn-success" data-action="cart#checkRequires">
            {{ 'button_finish_order'|translate }}
        </button>
        {{ form_end(form) }}
    </div>
{% endblock %}

{% block system_left %}
    {{ include('eshop/component/cart_delivery_and_payment_summary.html.twig') }}
{% endblock %}

{% block system_right %}
    {{ include('eshop/component/cart_delivery_and_payment_summary.html.twig') }}
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script src="https://widget.packeta.com/v6/www/js/library.js"></script>
{% endblock %}