{% extends "base.html" %}
{% load i18n %}
{% load static %}
{% load custom_tags %}

{% block content %}
    <div class="btn-group btn-group-lg stock-button-group" role="group" aria-label="Basic mixed styles example">
      {% if 'btn_add_good' in config %}
        <a id="btn_add_good" href="{% url 'tmc' %}"><button type="button" class="btn btn-outline-success">Новий ТМЦ</button></a>
      {% endif %}
      {% if 'btn_new_receipt' in config %}
        <a id="btn_new_receipt" href="{% url 'receipt' %}"><button type="button" class="btn btn-outline-success">Прийняти ТМЦ</button></a>
      {% endif %}
      {% if 'btn_manual_write_off_tmc' in config %}
        <a id="btn_manual_write_off_tmc" href="{% url 'manual_write_off_tmc' %}"><button type="button" class="btn btn-outline-success">Списати ТМЦ</button></a>
      {% endif %}
      <a href="{% url 'movement_between_stocks' %} "><button type="button" class="btn btn-outline-success">Переміщення ТМЦ</button></a>
        <!-- <a href="#"><button type="button" class="btn btn-outline-success">Інвентаризація ТМЦ</button></a> -->
    </div>


<div class="row">
  <!-- <div class="col s12 m3">
    <div class="card horizontal">
      <div class="card-stacked">
        <div class="card-content">
            <div class="card-content-title">Усього ТМЦ в базі</div>
            <div class="card-content-title-icon"><i class="lni lni-dropbox"></i>
          <div class="card-content-text"> 231</div>
        </div>
      </div>
    </div>
  </div>
  </div>
  <div class="col s12 m3">
    <div class="card horizontal">
      <div class="card-stacked">
        <div class="card-content">
          <div class="card-content-title">У сервісі</div>
          <div class="card-content-title-icon"><i class="lni lni-list"></i>
          <div class="card-content-text"> 231</div>
        </div>
      </div>
    </div>
  </div>
  </div> -->

  <div class="col s12 m2">
    <div class="card">
        <div class="title">
            <span class="circle">
                <i class="material-icons">info_outline</i>
            </span>
            <p class="titleText">
                Найменувань ТМЦ
            </p>
        </div>
        <div class="dataText">
            <p>
                {{unique_goods_count}} одиниць
            </p>            
            <div class="range">
                <div class="fill">
                </div>
            </div>
        </div>
    </div>
  </div>

  <div class="col s12 m2">
    <div class="card">
        <div class="title">
            <span class="circle">
                <i class="material-icons">info_outline</i>
            </span>
            <p class="titleText">
                Зарезервовано ТМЦ
            </p>
        </div>
        <div class="dataText">
            <p>
                {{reservation_unique_goods_count}} одиниць
            </p>            
            <div class="range">
                <div class="fill">
                </div>
            </div>
        </div>
    </div>
  </div>
</div>
<div class="row">
  <form id="stock_search_form">
    {% csrf_token %}
        <!-- {% csrf_token %} {{goods_filter.form}} 
        <button type="submit">Поиск</button> -->
    <div class="row">
      {% get_all_goods_name_with_unit_of_measurement as goods_list %}
      <div class="input-field col m5 s12">
          <input type=text name="good__name" id="good__name" list="goods-list" class="validate" >
          <label for="good__name">Найменування товару</label>
          <datalist id="goods-list">
              {% for good in goods_list  %}
                  <option>{{good.name}}>>{{good.unit_of_measurement}}</option>
              {% endfor %}
          </datalist>
      </div>
<!-- 

      <div class="input-field col m5 s12">
        <input type=text name="good__name" id="good__name" list="goods-list" class="validate" >
        <label for="good__name">Найменування товару</label>
        <datalist id="goods-list">
            {% for good in goods %}
                <option>{{good.name|safe}}</option>
            {% endfor %}
        </datalist>
    </div> -->

  </div>
    <button class="btn waves-effect waves-light" type="submit" name="action">Пошук
      <i class="material-icons right">send</i>
      </button>
      <!-- <a href="{{ request.get_full_path }}"><button type="button" class="btn btn-outline-success">Очистити</button></a> -->

  </form>
</div>
<div class="row">
  <p>Останні закуплені товари</p>
</div>
<div class="row">
  <div class="col-sm-12">
      <div class="panel panel-success">
        <div class="table-responsive">
          <table class="table table-striped" id="example">
            <thead>
              <tr>
                <th>Назва ТМЦ</th>
                <th>Локація</th>
                <th>Кількість</th>
                <th>Остання ціна</th>
                <th>Дата</th>
                <th>Інформація</th>
              </tr>

            </thead>
            <tbody id="receipt_items_body">
              {% if receipt_items %}
                {% for receipt_item in receipt_items %}
                <tr>
                  <td>{{receipt_item.good.name}}</td>
                  <td>{{receipt_item.receipt.storage_facility}}</td>
                  <td>{{receipt_item.quantity|stringformat:".2f"}}</td>
                  <td>{{receipt_item.price|stringformat:".2f"}}</td>
                  <td>{{receipt_item.receipt.date|date:"SHORT_DATE_FORMAT"}}</td>
                  <td>
                    <a href="{% url 'tmc_detail' id=receipt_item.good.id %}" id="{{receipt_item.good.id}}" class="btn-floating btn-smal waves-effect waves-light green"><i class="material-icons">info_outline</i></a>
                  </a>
                  </td>
                  
                </tr>
                  {% endfor %}
              {% endif %}
          </tbody>
          </table>
        </div>
      </div>
    </div>
</div>
{% endblock %}


{% block scripts %}
<script type="module" src="{% static 'js/stock.js' %}"></script>
{% endblock %}