{% extends 'base.html.twig' %}

{% block title %}{% trans %}kosik{% endtrans %}{% endblock %}

{% block body %}
<div class="fixed-header-fix fixed-header-fix--cart"></div>

<section class="p-0">
    <div class="container">
        <div class="row">
    <div class="col-12 col-lg-9">
        {{ include('/shop/order/_cart_steps.html.twig',{step:1})}}

        <h4 class="text-center mt-8 mb-6">{% trans %}obsah.kosiku{% endtrans %}</h4>

        <ul class="cart-products">
            {% if order %}
                {% set alreadyPrinted = [] %}
                {% for product_variant in order.productVariants %}
                    {% set productVariant = product_variant.productVariant %}
                    {% if productVariant.id not in alreadyPrinted %}
                        <li class="cart-products__item cart-products__item--cart">
                            {% if productVariant.productVariantUploadGroups|length > 0 and productVariant.productVariantUploadGroups[0].UploadGroup.upload|length > 0 %}
                                <img alt="Foto produktu" src="{{ asset(productVariant.productVariantUploadGroups[0].UploadGroup.upload[0].path) }}" class="cart-products__image">
                            {% else %}
                                <img class="cart-products__image" src="{{ asset('build/img/mua-no-photo.jpg') }}" alt="Foto produktu">
                            {% endif %}
                            <div class="cart-products__info">
                                <a href="{{ path('shop_product', {slug:productVariant.product.slug}) }}">
                                    <div class="cart-products__title">{{ productVariant.name }}</div>
                                </a>
                                <div class="cart-products__author">{{get_product_author(productVariant)}}</div>
                                <div class="product-info__availability-status product-info__availability-status--available">{{ productVariant.availability.name }}</div>
                            </div>
                            <div class="cart-products__count">
                                <div class="count-input">
                                    <button type="button" class="count-input__btn count-input__minus">
                                        <svg width="6" height="2" viewBox="0 0 6 2" fill="none" xmlns="http://www.w3.org/2000/svg">
                                            <rect width="6" height="2" fill="#636363"/>
                                        </svg>
                                    </button>
                                    <input class="count-input__input amountInput" value="{{ product_variant_occurrences[productVariant.id] }}" min="0" type="number" name="productsCount" data-variant_id="{{ productVariant.id }}" id="">
                                    <button type="button" class="count-input__btn count-input__plus">
                                        <svg width="8" height="8" viewBox="0 0 8 8" fill="none" xmlns="http://www.w3.org/2000/svg">
                                            <rect y="3" width="8" height="2" fill="#636363"/>
                                            <rect x="3" y="8" width="8" height="2" transform="rotate(-90 3 8)" fill="#636363"/>
                                        </svg>
                                    </button>
                                </div>
                            </div>
                            <div class="cart-products__price-per-item">
                                {% set price =  calculate_product_variant_price(product_variant, app.session.get("selectedCurrency"), "withVat", "withDiscount", 0) %}
                                {% set price_no_discount =  calculate_product_variant_price(product_variant, app.session.get("selectedCurrency"), "withVat", "withoutDiscount", 0) %}
                                {% set price_without_vat =  calculate_product_variant_price(product_variant, app.session.get("selectedCurrency"), "withoutVat", "withDiscount", 0) %}
                                {{ price|round(0) }} {% trans %}mena.kusy{% endtrans %}
                                {% if price < price_no_discount %}
                                    <div class="cart-products__sale">
                                        <span class="cart-products__old-price">{{ price_no_discount|round(0) }} {% trans %}mena{% endtrans %}</span> <span class="cart-products__sale-percents">-{{ get_discount_amount(product_variant, 'percentage')|round(0, 'ceil') }}%</span>
                                    </div>
                                {% endif %}
                            </div>
                            <div class="cart-products__total-price">
                                {{ (price_without_vat * product_variant_occurrences[productVariant.id])|round(0) }} {% trans %}mena{% endtrans %}

                                <a href="javascript:void(0);" class="cart-products__remove cartRemoveVariantBtn" data-variant_id="{{ productVariant.id }}">
                                    <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg" style="pointer-events: none">
                                        <path style="pointer-events: none" fill-rule="evenodd" clip-rule="evenodd" d="M5.99902 4.58586L1.75638 0.343229L0.342167 1.75744L4.5848 6.00008L0.342247 10.2426L1.75646 11.6569L5.99902 7.41429L10.2417 11.6569L11.6559 10.2427L7.41323 6.00008L11.656 1.75736L10.2417 0.343142L5.99902 4.58586Z" fill="#FF2222"/>
                                    </svg>
                                </a>
                            </div>
                        </li>
                        {% set alreadyPrinted = alreadyPrinted|merge([productVariant.id]) %}
                    {% endif %}
                {% endfor %}
            {% else %}
                <h5 class="text-center mt-8 mb-6">{% trans %}kosik.prazdny{% endtrans %}</h5>
            {% endif %}

        </ul>

        {% if order %}
            <div class="d-none d-lg-flex justify-content-center mt-7">
                <a href="{{ path('shop_order_second') }}" class="btn btn-icon btn-primary">
                    {% trans %}pokracovat{% endtrans %}
                    <svg class="btn-icon__arrow-right">
                        <use href="{{ asset('build/svg/_btn-icons.svg#arrowRight') }}"></use>
                    </svg>
                </a>
            </div>
        {% endif %}

    </div>
    <div class="col-12 col-lg-3">
        {{ include('/shop/order/_cart_summary.html.twig',{order:order})}}

        <div class="d-flex d-lg-none justify-content-center mt-7">
            <a href="{{ path('shop_order_second') }}" class="btn btn-icon btn-primary">
                {% trans %}pokracovat{% endtrans %}
                <svg class="btn-icon__arrow-right">
                    <use href="{{ asset('build/svg/_btn-icons.svg#arrowRight') }}"></use>
                </svg>
            </a>
        </div>
    </div>
        </div>
    </div>
</section>
{% endblock %}