templates/vaga.html

{% extends 'base.html' %} {% block head %}
<link rel="stylesheet" href="../static/vaga.css" />

{% endblock %} {% block conteudo %}

<div id="texto_oculto" class="oculto" style="display: none">
  <ul>
    <li><strong>Cargo: </strong>{{ vaga.cargo }}</li>
    <li><strong>Nível: </strong>{{ vaga.nivel }}</li>
    <br />
    <li><strong>Localização: </strong>{{vaga.local}}</li>
    <br />
    <li><strong>Sobre a vaga: </strong>{{vaga.escopo_vaga}}</li>
    <br />
    <li><strong>Requisitos: </strong>{{vaga.requisitos}}</li>
    <br />
    <li><strong>Qualificações: </strong>{{vaga.qualificacoes}}</li>
    <br />
    {% if vaga.info_adicionais %}
    <li><strong>Informações adicionais: </strong>{{vaga.info_adicionais}}</li>
    {% endif %}
  </ul>
</div>
<main>
  <div class="container-vaga-page" data-vaga-id=" {{ vaga.id }}">
    {% if vaga.status == 'inativo' %}
    <div class="vaga-header-inativo">
      <span id="vaga-inativo">Vaga desativada</span>
    </div>
    {% endif %}
    <section class="grid-vaga">
      <div class="grid-vaga-item">
        <div class="item-vaga">
          <div class="vaga-header">
            <span id="cargo-field">{{vaga.cargo}} {{vaga.nivel}}</span>

            <ul class="vaga-info">
              <li>
                <strong>Data de criação:</strong> <br />
                {{vaga.data_abertura.strftime('%d/%m/%Y')}}
              </li>
              <li>
                <strong>Departamento:</strong><br />
                {{vaga.departamento}}
              </li>
              <li>
                <strong>Localização:</strong> <br />
                {{vaga.local}}
              </li>
              <div class="conteudo-desc">
                <li>
                  <strong>Escopo da vaga:</strong><br />
                  {{vaga.escopo_vaga}}
                </li>
                <li>
                  <strong>Requisitos:</strong><br />
                  {{vaga.requisitos}}
                </li>
                <li>
                  <strong>Qualificações e certificados:</strong><br />
                  {{vaga.qualificacoes}}
                </li>
                {% if vaga.info_adicionais %}
                <li>
                  <strong>Informações adicionais:</strong><br />
                  {{vaga.info_adicionais}}
                </li>
                {% endif %}
              </div>
            </ul>
          </div>
          <span class="ver-mais"

            ><span class="material-symbols-outlined">expand_more</span></span
          >

          <div class="copy-share">
            <div class="buttons-interact">
              <button

                id="new-candidate"

                class="buttons-interact-button"

                title="Novo candidato"

              >
                <i class="bi bi-plus-circle"></i>
              </button>
              <button

                id="edit-job"

                class="buttons-interact-button"

                title="Editar"

              >
                <i class="bi bi-pencil-square"></i>
              </button>
              {% if vaga.status == 'ativo' %}
              <button

                id="pause-job"

                class="buttons-interact-button"

                title="Encerrar vaga"

                data-vaga-id="{{ vaga.id }}"

              >
                <i class="bi bi-pause-fill"></i>
              </button>
              {% else %}
              <button

                id="start-job"

                class="buttons-interact-button"

                title="Ativar vaga"

                data-vaga-id="{{ vaga.id }}"

              >
                <i class="bi bi-play-fill"></i>
              </button>
              {% endif %}
            </div>
            <div class="copy-to-clipboard">
              <i id="copiar" class="bi-cp bi-copy" title="Copiar"></i>
              <span id="copiar-text"

                >Copiar <a href="#">template</a> para área de
                transferência</span
              >
            </div>
            <div class="vaga-publish">
              <div class="vaga-publish-text">
                <span class="publish-text">Publique a vaga</span>
              </div>
              <div class="vaga-publish-buttons">
                <button

                  onclick="openTelegram()"

                  id="enviar-telegram"

                  class="btn-share"

                >
                  <i class="bi-publish bi-telegram" title="Telegram"></i>
                </button>

                <button

                  onclick="openWhatsapp()"

                  id="enviar-whatsapp"

                  class="btn-share"

                >
                  <i class="bi-publish bi-whatsapp" title="Whatsapp"></i>
                </button>

                <button id="enviar-email" class="btn-share">
                  <i class="bi-publish bi-envelope" title="Email"></i>
                </button>
              </div>
            </div>
          </div>
        </div>
      </div>

      <div class="grid-vaga-item">
        <div class="bg-funil-contrata">
          <span id="funil-field">Funil de contratação</span>
          <!-- Conteúdo do funil de contratação -->
          <div class="funil-cards">
            <div class="card-candidato">
              <p class="card-text">Currículos enviados</p>
              <p class="card-number">
                {{ count_status(candidatos, 'Currículo enviado') }}
              </p>
            </div>

            <div class="card-candidato">
              <p class="card-text">Background check</p>
              <p class="card-number">
                {{ count_status(candidatos, 'Background check') }}
              </p>
            </div>

            <div class="card-candidato">
              <p class="card-text">Entrevista técnica</p>
              <p class="card-number">
                {{ count_status(candidatos, 'Entrevista técnica') }}
              </p>
            </div>

            <div class="card-candidato">
              <p class="card-text">Aprovados</p>
              <p class="card-number">
                {{ count_status(candidatos, 'Aprovado') }}
              </p>
            </div>
          </div>
        </div>
      </div>
    </section>
  </div>
  {% include 'animation_publish.html' %}
</main>
{% endblock %} {% block finalscript %}
<script>

  $(document).ready(function () {

    var vagaId = $(".container-vaga-page").data("vaga-id");

    vagaId = vagaId.trim();

    $("#pause-job").click(function () {

      window.location.href = "/encerrar_vaga/" + vagaId;

    });



    $("#start-job").click(function () {

      window.location.href = "/reabrir_vaga/" + vagaId;

    });



    $("#edit-job").click(function () {

      window.location.href = "/editar_vaga/" + vagaId;

    });



    $(".card-candidato").click(function () {

      window.location.href = "/candidatos/vaga=" + vagaId;

    });

  });

</script>
<script>

  $(document).ready(function () {

    $(".ver-mais").click(function () {

      var conteudoDesc = $(this).prev(".vaga-header").find(".conteudo-desc");

      var scrollPosition;



      conteudoDesc.toggleClass("expandido");



      if (conteudoDesc.hasClass("expandido")) {

        $(this).html(

          '<span class="material-symbols-outlined">expand_less</span>'

        );

        // Rola a página para baixo um pouco (100 pixels)

        scrollPosition = conteudoDesc.offset().top - 10;

      } else {

        $(this).html(

          '<span class="material-symbols-outlined">expand_more</span>'

        );

        // Rola a página de volta para cima

        scrollPosition = 0;

      }



      $("html, body").animate(

        {

          scrollTop: scrollPosition,

        },

        {

          duration: 100,

          easing: "swing",

          behavior: "smooth",

        }

      ); // Tempo de animação: 500 milissegundos

    });

  });

</script>
<script>

  $(document).ready(function () {

    $("#expandButton").click(function () {

      $("#itemList").animate(

        {

          width: "toggle",

        },

        300

      );

    });

  });

</script>
<script>

  function confirmarExclusao() {

    if (

      confirm(

        "Tem certeza que deseja excluir esta vaga? Essa ação é irreversível!"

      )

    ) {

    } else {

      return false; // Não submeter o formulário se cancelado

    }

  }

</script>
<script>

  $(document).ready(function () {

    $("#enviar-telegram").on("click", function () {

      var url = "https://web.telegram.org/";



      // Calcula as coordenadas para centralizar a nova janela

      var left = (screen.width - 600) / 2;

      var top = (screen.height - 600) / 2;



      window.open(

        url,

        "_blank",

        "width=600,height=600,left=" + left + ",top=" + top

      );

    });

  });

  $(document).ready(function () {

    $("#enviar-whatsapp").on("click", function () {

      var url = "https://web.whatsapp.com/";



      // Calcula as coordenadas para centralizar a nova janela

      var left = (screen.width - 600) / 2;

      var top = (screen.height - 600) / 2;



      window.open(

        url,

        "_blank",

        "width=600,height=600,left=" + left + ",top=" + top

      );

    });

  });

</script>
<script>

  $(document).ready(function () {

    $("#copiar").click(function () {

      // Obtém o texto e o HTML do elemento oculto

      var texto_oculto = $("#texto_oculto").text();

      var html_oculto = $("#texto_oculto").html();

      texto_oculto = texto_oculto.replace(/<br>/g, "\n");



      // Copia o texto e o HTML para a área de transferência

      navigator.clipboard

        .write([

          new ClipboardItem({

            "text/plain": new Blob([texto_oculto], { type: "text/plain" }),

            "text/html": new Blob([html_oculto], { type: "text/html" }),

          }),

        ])

        .then(() => {

          // Mensagem de confirmação (opcional)

          console.log(

            "As informações da vaga foram copiadas para a área de transferência:"

          );

        })

        .catch((err) => {

          console.error("Erro ao copiar para a área de transferência: ", err);

        });

    });

  });

</script>
{% endblock %}