{% extends "base.html" %}

{% load crispy_forms_filters %}
{% load crispy_forms_tags %}
{% load static %}
{% load custom_tags %}


{% block content %}
<div class="row">
    <h3>Управління обєктами</h3>
</div>
<div class="row">
  <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> {{count_all_projects}} шт.</p>            
            <div class="range">
                <div class="fill">
                  
                </div>
            </div>
        </div>
        </div>
  </div>
</div>
{% if 'btn_add_new_project' in config %}
  <div class="row">
    <a href="{% url 'add_new_project' %}"><button type="button" class="btn btn-outline-success">Новий обьєкт <i class="material-icons right">add</i></button></a>
  </div>
{% endif %}

<div class="row">
  <form id="project_search_form" autocomplete="off">
    {% csrf_token %}
    <div class="row">
      {% get_all_projects_names as projects_names %}
      <div class="input-field col m5 s12">
          <input type=text name="project_name" id="project_name" list="project_name-list" class="validate" >
          <label for="project_name">Назва обьєкту</label>
          <datalist id="project_name-list">
              {% for project_name in projects_names  %}
                  <option>{{project_name.name}}</option>
              {% endfor %}
          </datalist>
      </div>
      <!-- <div class="input-field col m3 s12">
        <input type=text name="name" id="name" list="name-list" class="validate" >
        <label for="name">Назва обьєкту</label>
        <datalist id="name-list">
            {% for offer in all_commercial_offers %}
                <option>{{offer.name}}</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">
  <div class="col-sm-12">
      <div class="panel panel-success">
        <div class="table-responsive">
          <table class="table table-striped">
            <thead>
              <tr>
                <th>Назва Проекту</th>
                <th>Замовник</th>
                <th>Дата початку</th>
                <th>Створено</th>
                <th></th>
              </tr>
            </thead>

            <tbody id="project_items_body">
              {% for project in projects %}
              <tr>
                <td>{{project.name}}</td>
                  {% if project.customer %} 
                    <td>{{project.customer}}</td> 
                    {% else %}
                    <td> </td> 
                  {% endif %}
                <td>{{project.date_start|date:"SHORT_DATE_FORMAT"}}</td>
                <td>{{project.user.first_name}} {{project.user.last_name}}</td>
                {% if 'btn_project_detail' in config %}
                <td>
                  <a href="{% url 'project_detail' id=project.id %}" id="{{project.id}}" class="btn-floating btn-smal waves-effect waves-light "><i class="lni lni-pencil"></i></a>
                </td>
                {% endif %}
                {% if 'btn_delete_project' in config %}
                <td>
                    <a href="#" id = "{{project.id}}" class="btn-floating btn-smal waves-effect waves-light red delete_project"><i class="lni lni-cross-circle"></i></a>
                </td>
                {% endif %}
              </tr>
                {% endfor %}
            </tbody>
          </table>
        </div>
      </div>
    </div>
</div>

{% endblock %}


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