{% extends 'store_layout_two.html' %}
{% load static %}
{% block content %}
{%csrf_token%}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/css/intlTelInput.min.css"
crossorigin="anonymous" />
<link rel="stylesheet" href="{% static 'store/build/css/countrySelect.css' %}">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.0/css/all.min.css" integrity="sha512-3PN6gfRNZEX4YFyz+sIyTF6pGlQiryJu9NlGhu9LrLMQ7eDjNgudQoFDK3WSNAayeIKc6B8WXXpo4a7HqxjKwg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <title>Beni | Coupon List</title>
<div class="content-body">
    <div class="container-fluid">
        <div class="row page-titles profile mx-0">
        <div class="col">
            <h2 class="fs-32 mb-0">Coupon List</h2>
        </div>
    </div>
    <div class="top-form-user mt-4">
        <form action="" method="get" class="mb-0 d-flex align-items-end user-listing-form flex-grow-1 justify-content-between">
            <div class="table-search-form mr-3">
            <div class="navbar-nav align-items-center">
                <!-- <div class="nav-item d-flex align-items-center">
                    <input type="text" class="form-control border shadow-none search-input" name="search" value="" placeholder="Search..." aria-label="Search...">
                        <input type="submit" value="Submit">
                    </div> -->
                    <h5>Note: Max. 10 Coupons per Store</h5>
                </div>
            </div>
            <div class="user-card-header-right d-flex gap-2 align-items-baseline"> 
                <div class="add-btn mr-1 text-right"> <a href="/add-coupon-store" class="btn btn-add">Create Coupon</a></div>
            </div>
        </form>
    </div>
    <div class="row prdct-rw mt-4">
        <div class="col-12 col-md-12">
            <div class="card">
                <div class="card-body">
                   
                    <div class="table-responsive">
                        <table class="table header-border table-hover verticle-middle">
                            <thead>
                                <tr>
                                    <th scope="col">Coupon ID</th>
                                    <th scope="col">Coupon Name English</th>
                                    <th scope="col">Coupon Name Arabic</th>
                                    <th scope="col">Start date/time</th>
                                    <th scope="col">End date/time</th>
                                    <th scope="col">Coupon Type</th>
                                    <th scope="col">Coupon On </th>
                                    <th scope="col">Actions</th>
                                </tr>
                            </thead>
                            <tbody> 
                                {% for coupon in coupon_obj %}                                
                                <tr>
                                    <td>#{{ coupon.id }}</td>
                                    <td>{{ coupon.coupon_name_english }}</td>     
                                    <td>{{ coupon.coupon_name_arabic }} </td>     
                                    <td><p class="coupon-bx"><span>{{ coupon.coupon_start_date|date:"d M  Y" }}</span></p></td>     
                                    <td><p class="coupon-bx"><span>{{ coupon.coupon_end_date|date:"d M  Y" }}</span></p></td>
                                    <td>{{ coupon.coupon_type }}</td>
                                    {% if coupon.coupon_on == 'Product' %}
                                    <td><p class="coupon-bx"><span>All Products</span> </p></td>
                                    {% elif coupon.coupon_on == 'Service'%}
                                    <td><p class="coupon-bx"><span>All Services</span></p></td>
                                    {% elif coupon.product %}
                                    <td><p class="coupon-bx"><span>Product Id</span> <span>(#{{ coupon.product.id }})</span> </p></td>
                                    {% elif coupon.service %}
                                    <td><p class="coupon-bx"><span>Service Id</span> <span>(#{{ coupon.service.id  }})</span> </p></td>
                                    {% elif coupon.category_product %}
                                    <td><p class="coupon-bx"><span>Main category Id</span> <span>(#{{ coupon.category_product.id  }})</span> </p></td>
                                    {% elif coupon.product and coupon.service %}
                                    <td><p class="coupon-bx"><span>Product id and Service Id</span> <span>(#{{ coupon.product.id  }} #{{ coupon.service.id  }} )</span> </p></td>
                                    {% elif coupon.product and coupon.category_product %}
                                    <td><p class="coupon-bx"><span>Product id and Maincategory Id</span> <span>(#{{ coupon.product.id  }} #{{ coupon.category_product.id  }} )</span> </p></td>
                                    {% elif coupon.service and coupon.category_product %}
                                    <td><p class="coupon-bx"><span>Service id and Maincategory Id</span> <span>(#{{ coupon.service.id  }} #{{ coupon.category_product.id  }} )</span> </p></td>
                                    {% else %}
                                    <td><p class="coupon-bx"><span>None</span> <span>(#{{ coupon.category_product.id  }})</span> </p></td>
                                   {% endif %}
                                    <td>
                                      <span><a class="edit-btn yellow" href="/edit-coupon-store/{{ coupon.id }}" data-toggle="tooltip" data-placement="top" title="" data-original-title="Edit"><i class="fa fa-pencil color-muted m-r-5" style="font-family: 'FontAwesome';"></i> </a>
                                        <!-- <a class="edit-btn yellow" href="" data-toggle="tooltip" data-placement="top" title="" data-original-title="View"><i class="fa fa-eye color-muted m-r-5"></i> </a> -->
                                      </span>
                                    </td>
                                </tr>
                                {% endfor %}
                            </tbody>
                        
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="demo-inline-spacing">
        <div class="pagination justify-content-center">
                {% if coupon_obj.has_previous %}
                    <li><a href="?page={{ coupon_obj.previous_page_number }}">&laquo;</a></li>
                {% else %}
                <li class="disabled"><a href="#"><span>&laquo;</span></a></li>
                {% endif %}
                {% for i in coupon_obj.paginator.page_range %}
                {% if coupon_obj.number == i %}
                    <li><a class="active" href="?page={{ i }}"><span>{{ i }}</span></a></li>
                {% else %}
                    <li><a href="?page={{ i }}">{{ i }}</a></li>
                {% endif %}
                {% endfor %}
                {% if coupon_obj.has_next %}
                <li><a href="?page={{ coupon_obj.next_page_number }}">&raquo;</a></li>
                {% else %}
                <li class="disabled"><span>&raquo;</span></li>
                {% endif %}
        </div>
        </div>
</div>
</div>


{% endblock %}