{% extends 'layouts/app.html' %}
{% import 'macros/items.html' as items %}
{% import 'macros/form.html' as f with context %}
{% import 'billing/macros/billing.html' as billing with context %}

{% block title %}Admin - Coupons / List{% endblock %}

{% block body %}
  <div class="container">
    <div class="row">
      <div class="col-md-12">
        <div class="row">
          <div class="col-md-9">
            {{ f.search('admin.coupons') }}
          </div>
          <div class="col-md-3 mt-0 mt-md-4 mb-4 mb-md-0">
            <a href="{{ url_for('admin.coupons_new') }}"
               class="btn btn-primary float-right">
              Create coupon
            </a>
          </div>
        </div>

        {% if coupons.total == 0 %}
          <h3>No results found</h3>

          {% if request.args.get('q') %}
            <p>Try limiting or removing your search terms.</p>
          {% else %}
            <p>
               There are no coupons present,
               you should <a href="{{ url_for('admin.coupons_new') }}">create one</a>.
             </p>
          {% endif %}
        {% else %}
          {% call f.form_tag('admin.coupons_bulk_delete') %}
            <table class="table table-striped">
              <thead>
                <tr>
                  <th>
                    <label for="select_all"></label>
                    <input id="select_all" name="select_all" type="checkbox">
                  </th>
                  <th class="js-col-header">
                    {{ items.sort('created_on', 'Created') }}
                  </th>
                  <th class="js-col-header">
                    {{ items.sort('code') }}
                  </th>
                  <th class="js-col-header">
                    {{ items.sort('duration') }}
                  </th>
                  <th class="js-col-header">
                    {{ items.sort('redeem_by', 'Expires') }}
                  </th>
                  <th class="js-col-header">
                    {{ items.sort('times_redeemed', 'Redeemed') }}
                  </th>
                  <th id="bulk_actions" colspan="5">
                    <div class="form-inline">
                      {{ f.field(bulk_form.scope, inline=True) }}
                      <button type="submit"
                              class="btn btn-primary btn-sm ml-1">
                        Delete items
                      </button>
                    </div>
                  </th>
                </tr>
              </thead>
              <tbody>
              {% for coupon in coupons.items %}
                <tr class="{{ 'half-faded' if not coupon.valid }}">
                  <td>
                    <label for="bulk_ids"></label>
                    <input class="js-checkbox-item" id="bulk_ids"
                            name="bulk_ids" type="checkbox" value="{{ coupon.id }}">
                  </td>
                  <td>
                    <time class="js-from-now"
                          data-datetime="{{ coupon.created_on }}">
                      {{ coupon.created_on }}
                    </time>
                  </td>
                  <td>
                    {{ coupon.code }}

                    <p class="small text-muted">
                      {{ billing.coupon_discount(coupon.amount_off, coupon.percent_off) }}
                      discount
                    </p>
                  </td>
                  <td>{{ billing.coupon_duration_tag_for(coupon) }}</td>
                  <td>{{ billing.coupon_expiration(coupon) }}</td>
                  <td>{{ billing.coupon_redeemed(coupon.times_redeemed, coupon.max_redemptions) }}</td>
                </tr>
              {% endfor %}
              </tbody>
            </table>
          {% endcall %}

          {{ items.paginate(coupons) }}
        {% endif %}
      </div>
    </div>
  </div>
{% endblock %}