<!-- Cabecera modal -->
    <div class="modal-header">
        <h5 class="modal-title h4 text-center text-uppercase">Insertar un nuevo usuario</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                 <span aria-hidden="true">&times;</span>
         </button>
    </div>
    <!-- Fin cabecera modal -->


<!-- Cuerpo  modal -->
    <div class="modal-body">
    <!-- Gif "Cargando" -->
    <div class="form-group d-none" id="gif">
        <label><img src="images/ajax-loader.gif"> Procesando...</label>
    </div>
    <!-- Campos ocultos -->
    <div class="form-group">
        <input type="hidden" id="opcion">
        <input type="hidden" id="id">
    </div>


    <!-- Campo nacionalidad -->
    <div class="form-group">
        <label for="">Nacionalidad: </label>
        <input type="text" id="txt_nacionalidad" class="form-control" placeholder="Ingrese su nombre">
    </div>

    <!-- Campo cedula -->
    <div class="form-group">
        <label for="">Cédula: </label>
        <input type="text" id="txt_cedula" class="form-control" placeholder="Ingrese su nombre">
    </div>

    <!-- Campo nombre -->
    <div class="form-group">
        <label for="">Nombres: </label>
        <input type="text" id="txt_nombres" class="form-control" placeholder="Ingrese su nombre">
    </div>
    <!-- Campo país -->
    <div class="form-group">
        <label for="">apellidos: </label>
        <input type="text" id="txt_apellidos" class="form-control" placeholder="Ingrese su país">
    </div>
    <!-- Campo profesion -->
    <div class="form-group">
        <label for="">profesion: </label>
        <input type="text" id="txt_id_profesion" class="form-control" placeholder="Ingrese su edad">
    </div>
     </div>
     <!-- Fin cuerpo modal -->

<!-- Pie del modal -->
<div class="modal-footer">
    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
    <button type="button" class="btn btn-primary" id="btn_guardar_cambios">Guardar cambios</button>
</div>
<!-- Fin pie modal -->

(function() {
var input_busqueda = $('#txt_busqueda');
listar('');
tipoListado(input_busqueda);
crearPaginacion();
ejecutarAccion();
});

// Quitar la alerta del Modal
var quitarAlerta = () => {
$('#alerta').html('');
}

// Limpiar el cuadro de búsqueda
var limpiarBusqueda = () => {
$('#txt_busqueda').val('');
}

// Desbloquear el botón 'Guardar Cambios'
var desbloquearBoton = () => {
$('#btn_guardar_cambios').removeAttr('disabled');
}

// Mostrar una alerta de acuerdo a la respuesta del servidor
var alerta = (opcion, respuesta) => {
let mensaje = '';
switch (opcion) {
    case 'insertar':
        mensaje = 'Usuario insertado correctamente.';
        break;
    case 'editar':
        mensaje = 'Información de usuario modificada con exito.';
        break;
    case 'eliminar':
        mensaje = 'Usuario eliminado exitosamente.';
        break;
}
switch (respuesta) {
    case 'BIEN':
        $('#alerta').html('<div class="alert alert-success text-center">
<strong>¡BIEN! </strong>' + mensaje + '</div>');
        break;
    case 'ERROR':
        $('#alerta').html('<div class="alert alert-danger text-center">
<strong>¡ERROR! </strong>Solicitud no procesada.</div>');
        break;
    case 'IGUAL':
        $('#alerta').html('<div class="alert alert-info text-center">
<strong>¡ADVERTENCIA! </strong>Ha enviado los mismos datos.</div>');
        break;
    case 'VACIO':
        $('#alerta').html('<div class="alert alert-danger text-center">
<strong>¡ERROR! </strong>No puede enviar datos vacíos.</div>');
        break;
      }
   }



    // ----------------------------------------------------Ejecutar la acción seleccionada por el usuario----------------------------------------------------
   var ejecutarAccion = () => {
   $('#btn_guardar_cambios').on('click', function() {
    let opcion = $('#opcion').val();
    let id = $('#id').val();
    let nacionalidad = $('#txt_nacionalidad').val();
    let cedula = $('#txt_cedula').val();
    let nombres = $('#txt_nombres').val();
    let apellidos = $('#txt_apellidos').val();
    let id_profesion = $('#txt_id_profesion').val();
    $.ajax({
        beforeSend: function() {
            $('#gif').toggleClass('d-none');
        },
        url: 'controllers/controllerActions.php',
        method: 'POST',
        data: {
            opcion: opcion,
            id: id,
            nacionalidad: nacionalidad,
            cedula: cedula,
            nombres: nombres,
            apellidos: apellidos,
            id_profesion: id_profesion
        },
    }).done(function(data) {
        $('#gif').toggleClass('d-none');
        alerta(opcion, data);
        listar('');
        crearPaginacion();
        if (opcion == 'eliminar' && data == 'BIEN') {
            $('#btn_guardar_cambios').attr('disabled', true);
        }
        if (opcion == 'insertar' && data == 'BIEN') {
            $('#id').val('');
            $('#txt_nacionalidad').val('');
            $('#txt_cedula').val('');
            $('#txt_nombres').val('');
            $('#txt_apellidos').val('');
            $('#txt_id_profesion').val('');
        }
    });
    });
    }



    // -------------------------------------------------------------------Preparar datos-------------------------------------------------------------------
    var prepararDatos = () => {
    let values = [];
    // Evento botón editar
    $('#table .editar').on('click', function() {
    values = ciclo($(this));
    $('#opcion').val('editar');
    $('#id').val(values[0]);
    $('#txt_nacionalidad').val(values[1]).removeAttr('disabled');
    $('#txt_cedula').val(values[2]).removeAttr('disabled');
    $('#txt_nombres').val(values[3]).removeAttr('disabled');
    $('#txt_apellidos').val(values[4]).removeAttr('disabled');
    $('#txt_id_profesion').val(values[5]).removeAttr('disabled');
    cambiarTitulo('Editar información');
    quitarAlerta();
    limpiarBusqueda();
    desbloquearBoton();
    });
    // Evento botón eliminar
    $('#table .eliminar').on('click', function() {
    values = ciclo($(this));
    $('#opcion').val('eliminar');
    $('#id').val(values[0]);
    $('#txt_nacionalidad').val(values[1]).attr('disabled', true);
    $('#txt_cedula').val(values[2]).attr('disabled', true);
    $('#txt_nombres').val(values[3]).attr('disabled', true);
    $('#txt_apellidos').val(values[4]).attr('disabled', true);
    $('#txt_id_profesion').val(values[5]).attr('disabled', true);
    cambiarTitulo('Eliminar usuario');
    quitarAlerta();
    limpiarBusqueda();
    desbloquearBoton();
    });
    // Evento btotón insertar
    $('#btn_insertar').on('click', function() {
    $('#opcion').val('insertar');
    $('#id').val('');
    $('#txt_nacionalidad').val('').removeAttr('disabled');
    $('#txt_cedula').val('').removeAttr('disabled');
    $('#txt_nombres').val('').removeAttr('disabled');
    $('#txt_apellidos').val('').removeAttr('disabled');
    $('#txt_id_profesion').val('').removeAttr('disabled');
    cambiarTitulo('Insertar usuario');
    quitarAlerta();
    limpiarBusqueda();
    desbloquearBoton();
    });
     }
    var ciclo = (selector) => {
    let datos = [];
    $(selector).parents('tr').find('td').each(function(i) {
    if (i < 6) {
        datos[i] = $(this).text();
    } else {
        return false;
    }
    });
    return datos;
    }
    var cambiarTitulo = (titulo) => {
    $('.modal-header .modal-title').text(titulo);
    }
    // --------------------------------------------------------------------------Paginación--------------------------------------------------------------------------
     var cambiarPagina = () => {
     $('.page-item>.page-link').on('click', function() {
     $.ajax({
        url: 'controllers/controllerList.php',
        method: 'POST',
        data: {
            pagina: $(this).text()
        },
    }).done(function(data) {
        $('#div_tabla').html(data);
        prepararDatos();
      });
      });
      }
      var crearPaginacion = () => {
      $.ajax({
      url: 'controllers/controllerPagination.php',
      method: 'POST'
      }).done(function(data) {
      $('#pagination li').remove();
      for (var i = 1; i <= data; i++) {
        $('#pagination').append('<li class="page-item"><a class="page-link
      text-muted" href="#">' + i + '</a></li>');
      }
      cambiarPagina();
      });
      }
      // ---------------------------------------------------Listar personas---------------------------------------------------
       var listar = (param) => {
       $.ajax({
       url: 'controllers/controllerList.php',
       method: 'POST',
       data: {
        termino: param
        }
       }).done(function(data) {
       $('#div_tabla').html(data);
       prepararDatos();
       });
       }
       var tipoListado = (input) => {
       $(input).on('keyup', function() {
       let termino = '';
       if ($(this).val() != '') {
        termino = $(this).val();
         }
        listar(termino);
        });
        }

class Personas extends Conexion
          {
          public function __construct()
           {
           parent::__construct();
             }
           public function insert(
           string $nacionalidad,
           string $cedula,
           string $nombres,
           string $apellidos,
           string $id_profesion)
           {

           error_reporting(0);

           try {
            $query  = "INSERT INTO clientes VALUES (
             null,
             :nacionalidad,
             :cedula,
             :nombres,
             :apellidos,
             :id_profesion);";
             $result = $this->db->prepare($query);
             $result->execute(array(
            ':nacionalidad' => $nacionalidad,
            ':cedula' => $cedula,
            ':nombres' => $nombres,
            ':apellidos' => $apellidos,
            ':id_profesion' => $id_profesion));

             echo 'BIEN';

             } catch (PDOException $e) {

             echo 'ERROR';
             }
             }






    public function delete(int $id_clientes)
      {
    error_reporting(0);
    try {
        $query  = "DELETE FROM clientes WHERE id_clientes=:id_clientes;";
        $result = $this->db->prepare($query);
        $result->execute(array(':id_clientes' => $id_clientes));


        echo 'BIEN';


    } catch (PDOException $e) {

        echo 'ERROR';
    }
    }









public function edit(string $nacionalidad, string $cedula, string $nombres, string $apellidos, string $id_profesion)
{
    error_reporting(0);
    try {
        $query  = "UPDATE clientes SET nacionalidad=:nacionalidad, cedula=:cedula, nombres=:nombres, apellidos=:apellidos, id_profesion=:id_profesion,  WHERE id_clientes=:id_clientes;";
        $result = $this->db->prepare($query);
        $result->execute(array(
            ':id_clientes' => $id_clientes,
            ':nacionalidad' => $nacionalidad,
            ':cedula' => $cedula,
            ':nombres' => $nombres,
            ':apellidos' => $apellidos,
            ':id_profesion' => $id_profesion));
        if ($result->rowCount()) {
            echo 'BIEN';
        } else {
            echo 'IGUAL';
        }
    } catch (PDOException $e) {
        echo 'ERROR';
    }

   }

   public function getAll(int $desde, int $filas): array
   {
    $query = "SELECT * FROM clientes ORDER BY cedula LIMIT {$desde},
    {$filas}";
    return $this->ConsultaSimple($query);
     }

    public function getSearch(string $termino): array
    {
    $where = "WHERE cedula LIKE :cedula";
    $array = array(':cedula' => '%' . $termino . '%');
    return $this->ConsultaCompleja($where, $array);
     }

      public function getPagination(): array
      {
        $query = "SELECT COUNT(*) FROM clientes;";
        return array(
        'filasTotal'  => intval($this->db->query($query)->fetch(PDO::FETCH_BOTH)[0]),
        'filasPagina' => 3,
       );
      }

       public function showTable(array $array): string
       {
       $html = '';
       if (count($array)) {
        $html = '





       <table  class="striped responsive-table">
       <thead>
       <tr>
       <th data-field="n°" class="black-text">N°</th>
       <th data-field="n°" class="black-text">Nac.</th>
       <th data-field="n°" class="black-text">Cédula</th>
       <th data-field="n°" class="black-text">Nombres y Apellidos</th>
       <th data-field="cedula" class="black-text">Profesión</th>
       <th data-field="operaciones" class="black-text center-align"
          colspan="2">Operaciones</th>
        </tr>
      </thead>


                    <tbody>
                 ';
        foreach ($array as $value) {
            $html .= '  <tr>
                    <td class="d-none">' . $value['id_clientes'] . '</td>
                    <td>' . $value['nacionalidad'] . '</td>
                    <td>' . $value['cedula'] . '</td>
                <td>' . $value['nombres'] .' '. $value['apellidos'] . '</td>
                    <td>' . $value['id_profesion'] . '</td>



                    <td class="text-center">


                  <button title="Editar este usuario" class="editar btn btn-
       secondary" data-toggle="modal" data-target="#ventanaModal">
                             <i class="fa fa-pencil-square-o"></i>
                        </button>


                        <button title="Eliminar este usuario" type="button"
       class="eliminar btn btn-danger" data-toggle="modal" data-
       target="#ventanaModal">
                            <i class="fa fa-trash-o"></i>
                        </button>


                    </td>
                    </tr>
                     ';
        }
        $html .= '  </tbody>
                </table>';
     } else {


        $html = '
         <h6 class="black-text text-darken-2 center CONDENSED LIGHT5">¡
         Advertencia: No se ha encontrado ningún registro, debe registrar el
        nuevo cliente ! </h6>';
         }
       return $html;
      }
     }