{% extends 'partials/backend.html' %} {% load static %} {% load humanize %} {% block content %}

<main class="app-content">
  <div class="page-title m-b-20">
    <div class="row justify-content-between">
      <div class="col-md-6">
        <h1 class="page-title">
          <span class="fe fe-file-text-o"></span> Logs
        </h1>
      </div>
      <div class="col-md-6"></div>
    </div>
  </div>
  <div class="row">
    <div class="col-md-12">
      <div class="card">
        <div class="card-header">
          <h3 class="card-title">Filter</h3>
          <div class="card-options">
            <a
              href="#"
              class="card-options-collapse"
              data-toggle="card-collapse"
              ><i class="fe fe-chevron-up"></i
            ></a>
            <a href="#" class="card-options-remove" data-toggle="card-remove"
              ><i class="fe fe-x"></i
            ></a>
          </div>
        </div>
        <div class="card-body">
          <div class="row">
            <div class="col-md-8">
              <div class="btn-group w-30 m-b-10">
                <a href="/admin/transactions?status=3" class="btn"
                  >All <span class="badge badge-pill bg-azure">{{ his.count }}</span></a
                >
                <!-- <a href="/admin/transactions?status=1" class="btn"
                  >Paid <span class="badge badge-pill bg-indigo">141</span></a
                >
                <a href="/admin/transactions?status=0" class="btn"
                  >Waiting
                  <span class="badge badge-pill bg-orange">113</span></a
                > -->
              </div>
            </div>
            <div class="col-md-4 search-area">
              <div class="form-group">
                <div class="input-group">
                  <input
                    type="text"
                    name="query"
                    class="form-control"
                    placeholder="Search for…"
                    value=""
                  />
                  <select name="field" class="form-control" id="">
                    <option value="name">Name</option>
                  </select>
                  <button
                    class="btn btn-primary btn-square btn-search"
                    type="button"
                  >
                    <span class="fe fe-search"></span>
                  </button>
                  <button
                    class="btn btn-outline-danger btn-square btn-clear d-none"
                    data-toggle="tooltip"
                    data-placement="bottom"
                    title=""
                    data-original-title="Clear"
                    type="button"
                  >
                    <span class="fe fe-x"></span>
                  </button>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="row">
    <div class="col-md-12 col-xl-12">
      <div class="card">
        <div class="card-header">
          <h3 class="card-title">Lists</h3>
        </div>
        <div class="table-responsive">
          <table
            class="table table-hover table-bordered table-vcenter card-table"
          >
            <thead>
              <tr>
                <th class="text-center w-1">No.</th>
                <th class="">Name</th>
                <th class="text-center">Category</th>
                <th class="text-center">Amount</th>
                <th class="text-center">Qty</th>
                <th class="text-center">Action</th>
                <!--<th class="text-center">Transaction id</th>-->
                <!--<th class="text-center">Transaction fee</th>-->
                <!--<th class="text-center">Note</th>-->
                <!--<th class="text-center">Created</th>-->
                <!--<th class="text-center">Status</th>-->
              </tr>
            </thead>
            <tbody>
                {% for h in his %}
              <tr class="tr_21f06812c9fb83ed9eadfe19b0e30ca5">
                <td class="text-center text-muted">{{ h.id }}</td>
                <td>{{ h.name }}
                </td>
                <td class="text-center w-10p">{{ h.cat.name }}</td>
                <td class="text-center w-10p">{{ h.price|floatformat:2|intcomma }}</td>
                <td class="text-center w-10p">
                  <!-- <img
                    class="payment"
                    src="{% static '/assets/images/payments/manual.png' %}"
                    alt="manual"
                  /> -->
                  {{ h.qty }}
                </td>
                <!--<td class="text-center w-15p">{{ h.id }}</td>-->
                <!--<td class="text-center w-5p text-muted">{{ h.fee|floatformat:2|intcomma }}</td>-->
                <!--<td class="text-center w-10p">0</td>-->
                <!--<td class="text-center w-10p text-muted">-->
                <!--  {{ h.date }}-->
                <!--</td>-->
                <!--<td class="text-center w-5p">-->
                <!--  <span class="badge bg-indigo-lt">{{ h.status }}</span>-->
                <!--</td>-->
                <td class="text-center w-5p">
                  <div class="item-action dropdown">
                    <a
                      href="javascript:void(0)"
                      data-toggle="dropdown"
                      class="icon"
                      aria-expanded="false"
                      ><i class="fe fe-more-vertical"></i
                    ></a>
                    <div
                      class="dropdown-menu"
                      x-placement="bottom-start"
                      style="
                        position: absolute;
                        transform: translate3d(-55px, 16px, 0px);
                        top: 0px;
                        left: 0px;
                        will-change: transform;
                      "
                    >
                      <a
                        href="/admin/log/edit/{{ h.id }}"
                        class="dropdown-item ajaxModal"
                        data-confirm_ms=""
                        ><i class="dropdown-icon fe fe-edit"></i> Edit</a
                      >
                      <a
                        href="/admin/log/delete/{{ h.id }}"
                        class="dropdown-item ajaxDeleteItem"
                        data-confirm_ms="Are you sure you want to delete this item"
                        ><i class="dropdown-icon fe fe-trash-2"></i> Delete</a
                      >
                    </div>
                  </div>
                </td>
              </tr>  
              {% endfor %}            
            </tbody>
          </table>
        </div>
      </div>
    </div>
    <div class="col-md-12">
      <div class="float-right">
        <nav class="page-navigation" aria-label="navigation">
          <ul class="pagination">
  {# Previous Page Link #}
  {% if page_obj.has_previous %}
    <li class="page-item">
      <a class="page-link" href="?{% if status %}status={{ status }}&amp;{% endif %}{% if query %}query={{ query }}&amp;field={{ field }}&amp;{% endif %}page=1">
        <i class="fe fe-chevrons-left"></i>
      </a>
    </li>
    <li class="page-item">
      <a class="page-link" href="?{% if status %}status={{ status }}&amp;{% endif %}{% if query %}query={{ query }}&amp;field={{ field }}&amp;{% endif %}page={{ page_obj.previous_page_number }}">
        <i class="fe fe-chevron-left"></i>
      </a>
    </li>
  {% endif %}

  {# Page Numbers #}
  {% for num in page_obj.paginator.page_range %}
    {% if num >= page_obj.number|add:'-2' and num <= page_obj.number|add:'2' %}
      <li class="page-item {% if page_obj.number == num %}active{% endif %}">
        <a class="page-link" href="?{% if status %}status={{ status }}&amp;{% endif %}{% if query %}query={{ query }}&amp;field={{ field }}&amp;{% endif %}page={{ num }}">
          {{ num }}
        </a>
      </li>
    {% endif %}
  {% endfor %}

  {# Next Page Link #}
  {% if page_obj.has_next %}
    <li class="page-item">
      <a class="page-link" href="?{% if status %}status={{ status }}&amp;{% endif %}{% if query %}query={{ query }}&amp;field={{ field }}&amp;{% endif %}page={{ page_obj.next_page_number }}">
        <i class="fe fe-chevron-right"></i>
      </a>
    </li>
    <li class="page-item">
      <a class="page-link" href="?{% if status %}status={{ status }}&amp;{% endif %}{% if query %}query={{ query }}&amp;field={{ field }}&amp;{% endif %}page={{ page_obj.paginator.num_pages }}">
        <i class="fe fe-chevrons-right"></i>
      </a>
    </li>
  {% endif %}
</ul>
        </nav>
      </div>
    </div>
  </div>
</main>

{% endblock content %}