{% extends 'shared/base.html' %} 
{% load custom_filters %} 
{% load static %} 
{% block content %} 

<script>
  setTimeout(function () {
    $("#messages").fadeOut("fast");
  }, 5000);

  function voltar() {
    window.history.back();
  }
</script>

<style>
  .linha-entrada-zero {
        background-color: #ffcccc; /* Cor de fundo vermelho claro (pode ajustar conforme necessário) */
    }
</style>

<script>
  $(document).ready(function() {
      $('#example').DataTable({
      });
  });
</script>

<div id="messages" class="col-md-12">
  {% for message in messages %}
  <div
    class="alert alert-dismissible fade show {% if message.tags == 'success' %}alert-success {% elif message.tags == 'error' %}alert-danger {% endif %}">
    {{ message|safe }}
  </div>
  {% endfor %}
</div>

<div class="content">
  <div class="card my-2">
    <div class="card-body bg-success bg-gradient text-white rounded-2">
      <div class="row flex-between-center">
        <div class="col-md d-flex align-items-center">
          <h5 class="mb-2 mb-md-0">Metas Finalizadas</h5>
        </div>
      </div>
    </div>
  </div>

  <div class="card py-3">
    <div class="content-fluid table-responsive">
      <div class="container">
        <div class="row"></div>
      </div>
      <table id="example" class="table table-striped table-bordered nowrap" cellspacing="0" width="100%">
        <thead class="bg-success bg-gradient text-white">
          <tr>
            <th>Espécie</th>
            <th>Tipo</th>
            <th>Data Inicial</th>
            <th>Data Final</th>
            <th>Meta (Qtde)</th>
            <th>Quantidade Feita</th>
            <th>Status</th>
            <th>% Cumprido</th>
          </tr>
        </thead>
        <tbody>
          {% for meta in metas_info %}
            <tr>
              <td>{{ meta.especie }}</td>
              <td>{{ meta.tipo_meta }}</td>
              <td>{{ meta.data_inicial|date:"d/m/Y" }}</td>
              <td>{{ meta.data_final|date:"d/m/Y" }}</td>
              <td>{{ meta.quantidade_meta|floatformat:0 }}</td>
              <td>
                {% if meta.tipo_meta == "semeadura" %}
                  {{ meta.quantidade_feita|floatformat:3 }}
                {% else %}
                  {{ meta.quantidade_feita|floatformat:0 }}
                {% endif %}
              </td>
              <td>
                {% if meta.status == "finalizada_completa" %}
                  <span class="badge bg-success">Finalizada completa</span>
                {% elif meta.status == "finalizada_incompleta" %}
                  <span class="badge bg-danger">Finalizada incompleta</span>
                {% else %}
                  <span class="badge bg-secondary">{{ meta.status|capfirst }}</span>
                {% endif %}
              </td>
              <td>{{ meta.percentual }}%</td>
            </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>
</div>

{% endblock %}