{% extends 'base.html' %} {% block head %}
<link rel="stylesheet" href="../static/candidatos_vaga_id.css" />
<link
  rel="stylesheet"
  type="text/css"
  href="https://cdn.datatables.net/2.0.3/css/dataTables.dataTables.min.css"
/>{% endblock %} {% block conteudo %}

<main>
  <div class="container-vaga-page" data-vaga-id=" {{ vaga.id }}">
    <div class="container-vaga-page-header">
      <span id="header-field">Candidatos</span>
      <ul class="vaga-info">
        <li id="vaga-cargo">{{ vaga.cargo }} {{vaga.nivel}}</li>
        <li id="vaga-departamento">{{vaga.departamento}}</li>
        <li id="vaga-data-abertura">
          Vaga aberta em {{vaga.data_abertura.strftime('%d/%m/%Y')}}
        </li>
      </ul>

      <div class="buttons-interact">
        <button
          id="new-candidate"
          class="buttons-interact-button"
          title="Novo candidato"
        >
          <i class="bi bi-plus-circle"></i>
        </button>
      </div>
    </div>

    <div class="grid-candidatos">
      <table id="table-candidatos" style="width: 100%">
        <thead>
          <tr>
            <th>Nome</th>
            <th>Email</th>
            <th>Telefone</th>
            <th>Status</th>
          </tr>
        </thead>
        <tbody>
          {% for candidato in candidatos %} {% if candidato.nome != none %}
          <tr data-candidato-id="{{ candidato.id }}">
            <td>{{candidato.nome}}</td>
            <td>{{candidato.email}}</td>
            <td>{{candidato.telefone}}</td>
            <td>{{candidato.status}}</td>
          </tr>
          {% endif %} {% endfor %}
        </tbody>
      </table>
    </div>
  </div>
  {% include 'animation_publish.html' %}
</main>

{% endblock %} {% block finalscript %}
<script src="https://cdn.datatables.net/2.0.3/js/dataTables.min.js"></script>
<script>
  $(document).ready(function () {
    $("#table-candidatos").DataTable({
      language: {
        search: "Buscar:",
        lengthMenu: "Mostrar _MENU_ registros por página",
        info: "Mostrando _START_ a _END_ de _TOTAL_ registros",
        infoEmpty: "Mostrando 0 a 0 de 0 registros",
        infoFiltered: "(filtrado de _MAX_ registros totais)",
        paginate: {
          first: "Primeiro",
          last: "Último",
          next: "Próximo",
          previous: "Anterior",
        },
      },
    });
  });
</script>

<script>
  $(document).ready(function () {
    $("#header-field").click(function () {
      location.reload(); // Atualiza a página
    });
  });
</script>
<script>
  $(document).ready(function () {
    // Adiciona um evento de clique às linhas da tabela
    $("#table-candidatos").on("click", "tr[data-candidato-id]", function () {
      var candidatoId = $(this).data("candidato-id");
      var url = "/candidatos/" + candidatoId; // ou use url_for para gerar o URL no Flask

      // Redireciona para a página do candidato
      window.location.href = url;
    });
  });
</script>
{% endblock %}