{% extends 'base.html' %}

{% load static %}
{% load render_table from django_tables2%}
{% load export_url from django_tables2%}
{% block contenido %}

<div class="container-fluid content-bg" style="padding: 0px 30px; background-color: rgba(242,242,242,0.5);">
  <div class="row">
<nav class="bcrumbs">
  <div class="nav-wrapper">
    <div class="col s12">
      <a href="https://remate.continua.com.mx/" class="breadcrumb">Inicio</a>
      <a href="{% url 'Manager' %}" class="breadcrumb">Contactos</a>
      <a href="{% url 'Lista_Create' %}" class="breadcrumb">Listas de Envío</a>
      <a href="#" class="breadcrumb">Ver Contactos</a>
    </div>
  </div>
</nav>
</div>
</div>

    <div class="container">

 <div class="row s12 center">
            <h5><br>Lista: {{ titulo}}</h5>
        </div>

<div class="row col s12 center">
<form id="form2" name="form2" method="POST">
             {% csrf_token %}
  <div class="row col s12">
        <div class="input-field col s10"> 
        <select id="add_contacto" searchable="Buscar"  name="add_contacto">
        <option value='' selected disable>Seleccione un contacto</option>
        {% for x in faltantes  %}
        <option value={{x.perfil_id}} >{{x.perfil}} </option>
        {% endfor %}
        </select>
          <label for="add_contacto">Agregar contacto a la lista</label>

        </div>
        <div class="input-field col s2">
        <button class="btn waves-effect waves-light" type="submit" name="action">Guardar
              <i class="material-icons right">save</i>
                </button>
        </div>
  </div>
</form>
</div>

    <div class="row s12 center">
                   {% render_table lista%}


    </div>
    
<div class="row s12 center">
    {% for format in export_formats %}
    <a class="col s3 link-xport" href="{% export_url format %}">
      <i class="material-icons icon-gray">description</i> Exportar a <code>{{ format }} </code>
    </a>
    {% endfor %}
  </div>
    <div id="modal1" class="modal">
        <div class="modal-content">
          <h4>Eliminar Usuario de Lista</h4>
          <p>Se va a quitar de la lista al usuario <b><span id="user_name"></span></b></p>
        </div>
        <div class="modal-footer">
          <a href="#!" class="modal-close waves-effect waves-green btn-flat">Cancelar</a>
          <a href="#!"  onclick="submitform()"  class="modal-close waves-effect waves-green btn-flat">Aceptar</a>
        </div>
      </div>
    <form id="form1" name="form1"  method="POST" >
             {% csrf_token %}
             <input id="perfil_id" type="hidden" name="perfil_id" value=""/>

         </form>

    </div>


{% endblock %}

{% block jscripts %}
<script src="{% static 'js/select_search.js' %}"></script>

<script>

    function delete_empleado(id,name) {
        $("#user_name").text(name);
        $('input[name="perfil_id"]:hidden').val(id);
        $("#modal1").modal('open');
        console.log('delete');

    }
    function closemodal() {
    $('#modal1').close();
}
function submitform() {
      document.form1.submit();
}
</script>
{% endblock %}