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

{% block title %}{% endblock %}

{% block body %}
    <!-- breadcrumb area start -->
    <div class="breadcrumb-area">
        <div class="container-fluid">
            <div class="row">
                <div class="col-12">
                    <div class="breadcrumb-wrap text-center">
                        <h2 class="breadcrumb-title">{% trans %}SPRINT & SPORTS | Panier {% endtrans %}</h2>
                        <nav aria-label="breadcrumb">
                            <ul class="breadcrumb">
                                <li class="breadcrumb-item"><a href="{{ path("index") }}">{% trans %}Accueil{% endtrans %}</a></li>
                                <li class="breadcrumb-item active" aria-current="page">{% trans %}Panier{% endtrans %}</li>
                            </ul>
                        </nav>
                    </div>
                </div>
            </div>
            <br>
            <br>
        </div>
    </div>
    <!-- breadcrumb area end -->
    <!-- cart main wrapper start -->
    <div class="page-padding pt-100 pb-100 pt-sm-60 pb-sm-60">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <!-- Cart Table Area -->
                    <div class="cart-table table-responsive">
                        <table class="table table-bordered">
                            <thead>
                            <tr>
                                <th class="pro-thumbnail"></th>
                                <th class="pro-title">{% trans %}Article{% endtrans %}</th>
                                <th class="pro-price">{% trans %}Prix{% endtrans %}</th>
                                <th class="pro-quantity">{% trans %}Quantité{% endtrans %}</th>
                                <th class="pro-subtotal">{% trans %}Total{% endtrans %}</th>
                                <th class="pro-remove">{% trans %}Retirer{% endtrans %}</th>
                            </tr>
                            </thead>
                            <tbody>
                            {% for item in cart.items %}
                                <tr>
                                    <td class="pro-thumbnail"><a href="{{ path('product_details', { id: item.productId.id }) }}"><img class="img-fluid"
                                                                               src="{{ item.productId.image }}"
                                                                               alt="{{ item.productId.id }}"/></a></td>
                                    <td class="pro-title"><a href="{{ path('product_details', { id: item.productId.id }) }}">{{ item.productId.label }}</a></td>
                                    <td class="pro-price"><span>{{ item.productId.discountPrice != null ?  item.productId.discountPrice|number_format(0, '', ' ') : item.productId.price|number_format(0, '', ' ') }}<span class="currency">{% trans %}DZD{% endtrans %}</span></span></td>
                                    <td class="pro-qte">x <span>{{ item.qte }}</span></td>
                                    <td class="pro-subtotal"><span> {{ item.productId.discountPrice != null ?  (item.productId.discountPrice* item.qte)|number_format(0, '', ' ') : (item.productId.price* item.qte)|number_format(0, '', ' ') }} <span class="currency">{% trans %}DZD{% endtrans %}</span></span></td>
                                    <td class="pro-remove"><a class="del-icon-cart" data-product="{{ item.id }}" data-price="{{ item.productId.discountPrice != null ? item.productId.discountPrice * item.qte : item.productId.price * item.qte}}" href="javascript:void(0);"><i class="fa fa-trash-o"></i></a></td>
                                </tr>
                            {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-lg-5 ml-auto">
                    <!-- Cart Calculation Area -->
                    <div class="cart-calculator-wrapper">
                        <div class="cart-calculate-items">
                            <h3>{% trans %}Total du panier{% endtrans %}</h3>
                            <div class="table-responsive">
                                <table class="table">
                                    <tr>
                                        <td>{% trans %}Prix HT{% endtrans %}</td>
                                        <td class="sub-total">{{ cart.price|number_format(0, '', ' ') }} <span class="currency">{% trans %}DZD{% endtrans %}</span></td>
                                    </tr>
                                    <tr>
                                        <td>{% trans %}TVA (20%){% endtrans %}</td>
                                        <td class="sub-total">{{ (cart.price * 0.2)|number_format(0, '', ' ') }} <span class="currency">{% trans %}DZD{% endtrans %}</span></td>
                                    </tr>
                                    <tr class="total">
                                        <td>{% trans %}Total{% endtrans %}</td>
                                        <td class="total-amount">{{ (cart.price * 1.2)|number_format(0, '', ' ') }} <span class="currency">{% trans %}DZD{% endtrans %}</span></td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                        <a href="{{ cart.items is not empty ?  path("cart_checkout") : path('index') }}" class="check-btn d-block">{% trans %}Aller au paiement{% endtrans %}</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- cart main wrapper end -->
{% endblock %}