{% extends 'shop/base.html' %}

{% block title %} 
    My Cart
{% endblock title %}

{% block content %}
<div class="container">
    <div class="row">
        <div class="col-md-8">
            <h4>Items in my cart</h4>
            <table class="table">
                <thead>
                    <tr>
                        <th>SN</th>
                        <th>Product</th>
                        <th>Rate</th>
                        <th>Quantity</th>
                        <th>Subtotal</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody>
                    {% for cp in cart.cartproduct_set.all %}
                    <tr>
                        <td>{{forloop.counter}}</td>
                        <td>{{cp.product.title}}</td>
                        <td>{{cp.rate}}</td>
                        <td>{{cp.quantity}}</td>
                        <td>{{cp.subtotal}}</td>
                        <td>
                            <a href="{% url 'managecart' cp.id %}?action=inc" class="btn btn-primary"> + </a>
                            <a href="{% url 'managecart' cp.id %}?action=dcr" class="btn btn-warning"> - </a>
                            <a href="{% url 'managecart' cp.id %}?action=rmv" class="btn btn-danger"> x </a>
                        </td>
                    </tr>
                    {% endfor %}
                    <tr>
                        <th colspan="4" class="text-right">Total</th>
                        <th> Rs. {{ cart.total }}</th>
                        {% if cart.cartproduct_set.all %}
                        <th><a href="{% url 'emptycart' %}">Empty Cart</a></th>
                        {% endif %}
                    </tr>
                    <tr>
                        <th>
                            {% if cart.cartproduct_set.all %}
                            <a class="btn btn-info" href="{% url 'checkout' %}">Checkout</a>
                            {% endif %}
                        </th>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
{%endblock content%}