{% extends './stocks.html' %}
{% load static %}

{% block navbar_content %}
<div class="row">
	<div class="px-2"> <a href="/solds/add/" class="badge text-primary2"><i class="material-icons">add</i> Ajouter</a></div>
	<div class="px-2"> <a href="#" class="badge text-secondary"><i class="material-icons">keyboard_arrow_down</i>Instantannee</a></div>
	<div class="px-2"> <a href="#" class="badge text-secondary"><i class="material-icons">build</i> Options</a></div>
</div>
{% endblock %}


{% block main_content %}
<div class="row">
	<div class="col-md-12">
		<div class="card">
			<div class="card-header"> 
				<h4 class="card-title ">Ventes realisees par <b> {{actual_institution}} </b></h4>
				{% if search != None %} <span class="badge btn-primary2">{{search}}</span> {% else %}  {% endif %}
				<form method="POST" action="/stock/search/" class="navbar-form">{% csrf_token %}
					<div class="input-group no-border"> 
						<input type="text" name="search" class="form-control"  placeholder="Rechercher un Produit" >
						<button type="submit" class="btn btn-white btn-round btn-just-icon">
							<i class="material-icons">search</i>
							<div class="ripple-container"></div>
						</button>
					</div>
				</form>
                <!-- <div style="display:flex;justify-content: space-between;">
                  <p class="card-category"> <span class="btn text-primary2" style="background-color:#fff;">Tris Avancés</span> <span class="btn text-primary2" style="background-color:#fff;">Filtres</span> </p>
              </div> -->
          </div>
          <div class="card-body">
          	<div class="table-responsive">
          		<table id="actu-table" class="table ">
          			<thead class=" text-primary2">
          				<th></th>
          				<th>
          					Facture
          				</th>
          				<th>
          					Date
          				</th>
          				<th>
          					Clients
          				</th>
          				<th>
          					Benefice
          				</th>
          				<th>
          					Commercial
          				</th>
          				<th class="text-success">
          				</th>
                              <th> </th>
          			</thead>
          			<tbody>
          				{% for transaction in pages %}
          				<tr>
          					<td><a href="/stock/edit/{{product.id}}/"> <i class="fa fa-pencil"></i> </a></td>
          					<td>
          						<a class="text-primary2" href="/infos/prd/{{product.id}}/">{{transaction.m_code}}</a>
          					</td>
          					<td>
          						{{transaction.m_date}}
          					</td>
          					<td>
          						Client non identifié
          					</td>
          					<td>
          						{{transaction.montant}} XAF
          					</td>
          					<td>
                                        
          					</td>
                                   <td>
                                        <span class="btn-primary badge">Articles</span>
                                   </td>
          				</tr>
          				{% endfor %}
          			</tbody>
          		</table>
          	</div>
          	<div id="list-table">

          	</div>
          </div>
          <div>
          	<nav class="px-2">
          		<small> Page {{pages.number}} sur {{num_pages}} </small>
          		<ul class='pagination' style='display:flex;overflow-x: auto;'>
          			<li>
          				{% if pages.number > 1 %}
          				<a style='color:#333;' class="btn btn-white" href="?page={{pages.previous_page_number}}" aria-label="Previous"><span aria-hidden="true">&laquo;</span>
          				</a>
          				{% endif %}
          			</li>
          			{% for num in page_range %}
          			<li><a class="btn {% if pages.number == num %} btn-success {% else %} btn btn-white text-dark {% endif %}" href="?page={{num}}">{{num}}</a></li>
          			{% endfor %}
          			<li>
          				{% if pages.number < num_pages %}
          				<a style='color:#333;' class="btn btn-white" href="?page={{pages.next_page_number}}" aria-label="Next">
          					<span aria-hidden="true">&raquo;</span>
          				</a>
          				{% endif %}
          			</li>
          		</ul>
          	</nav>
          </div>
      </div>
  </div>
</div>
{% endblock %}
