<!DOCTYPE html>
<html lang="en">
                         
<?php $this->load->view("template/header"); ?>
<?php $this->load->view("template/nav"); ?>
			
<div class="content-wrapper">
	<div class="content-header">
		<div class="container-fluid">
			<div class="row mb-2">
				<div class="col-sm-6">
					<h1 class="m-0">Perfiles</h1>
				</div>
				<div class="col-sm-6">
					<ol class="breadcrumb float-sm-right">
						<!-- <li class="breadcrumb-item"><a href="#" onclick="mySession()" class="nav-link">Cerrar Sesión</a></li> -->
					</ol>
				</div>
			</div>
		</div>
	</div>

	<section class="content">
		<div class="container-fluid">
			<div class="row">
				<div class="col-md-12">
					<div class="card card-secondary">
						<div class="card-header">
							<h3 class="card-title">Datos de busqueda</h3>
						</div>
		
						<form id="quickForm"  autocomplete="off">
							<div class="card-body">
								<div class="row">
									<div class="col-sm-4">
										<div class="form-group">
											<label for="exampleInputEmail1">Buscar Nombre</label>
											<input type="text" name="txt_nombre_perfiles" class="form-control" id="txt_nombre_perfiles" placeholder="Nombre de perfil" aria-describedby="exampleInputPassword1-error" aria-invalid="true">
										</div>
									</div> 
				
									<div class="col-sm-3">
										</br>
										<div class="form-group">
										<button type="button" id="btn_buscar_perfiles" class="btn btn-primary col-md-4">Buscar</button>
									</div>
								</div> 
							</div>  

							<div class="card-body">
								<div id="table_perfiles_wrapper" class="dataTables_wrapper dt-bootstrap4">
									<div class="row">
										<div class="col-sm-12">
											<table id="table_perfiles" class="table table-bordered table-striped dataTable dtr-inline" role="grid" aria-describedby="">
												<thead>
													<tr role="row">
														<th class="sorting" tabindex="0" aria-controls="table_perfiles" rowspan="1" colspan="1" aria-label="Browser: activate to sort column ascending" style="">IdPerfil</th>
														<th class="sorting" tabindex="0" aria-controls="table_perfiles" rowspan="1" colspan="1" aria-label="Browser: activate to sort column ascending" style="">Nombre</th>
														<th class="sorting" tabindex="0" aria-controls="table_perfiles" rowspan="1" colspan="1" aria-label="CSS grade: activate to sort column ascending" style="">Estado</th>
                                            			<th class="sorting" tabindex="0" aria-controls="table_perfiles" rowspan="1" colspan="1" aria-label="Browser: activate to sort column ascending" style="">Clase</th>
														<th class="sorting" tabindex="0" aria-controls="table_perfiles"  aria-label="CSS grade: activate to sort column ascending" style="">Acciones</th>
												</thead>
												<tbody>
												</tbody>
												<tfoot>
													<tr>
														<th rowspan="1" colspan="1" style="">IdPerfil</th>
														<th rowspan="1" colspan="1" style="">Nombre</th>
														<th rowspan="1" colspan="1" style="">Estado</th>
                                            			<th rowspan="1" colspan="1" style="">Clase</th>
														<th rowspan="1" colspan="1" style="">Acciones</th>
													</tr>
												</tfoot>
											</table>
										</div>
									</div>
								</div> 
							</div>

							<div class="card-footer">
								<button type="button" id="btn_nuevo_perfil" class="btn btn-secondary col-md-1 ">Nuevo</button>
							</div>
						</form>
					</div>

            		<div class="row">
                		<section class="col-lg-7 connectedSortable"></section>
                		<section class="col-lg-5 connectedSortable"></section>
            		</div>
        		</div>
			</div>
    	</div>
    </section>
</div>

<?php $this->load->view("template/footer"); ?>        
<aside class="control-sidebar control-sidebar-dark"></aside>

<!-- ======================================================================================================================================================================================================= -->
<!-- Modal Crear Perfil -->
<div class="modal fade show" id="modal-perfil-nuevo" aria-modal="true" role="dialog">
	<div class="modal-dialog modal-lg modal-perfil-nuevo">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Perfil Nuevo</h4>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>

			<div class="modal-body">
                <div class="card-body">
					<dl class="row">
                        <dt class="col-sm-4">Nombre Perfil </dt>
                        <dd class="col-sm-8"><input type="text" class="form-control" name="opt_nombre_huespedes" id="opt_nombre_huespedes" onkeyup="mayus(this);"></dd>
  
						<dt class="col-sm-4">Descripción</dt>
                        <dd class="col-sm-8"><input type="text" class="form-control" name="opt_email_huespedes" id="opt_email_huespedes"></dd>
                        
						<dt class="col-sm-4">Tipo Documento</dt>
						<dd class="col-sm-8">
							<select class="custom-select" id="opt_tipodoc_actualizar">
								<option value="0">-- Seleccionar --</option>
								<?php foreach($tipodoc as $k5) { ?>
									<option value="<?=$k5['IdTipoDocumento']?>"> <?=$k5['TipoDocumento']?></option>
								<?php } ?>                                    
                            </select>    
						</dd>			
                    </dl>
                </div>
            </div>

            <div class="modal-footer justify-content-between">
				<button style="float: left" type="button" class="btn btn-secondary col-md-3" id="btn_cancelar_perfil" data-dismiss="modal">Cancelar </button>  
				<button style="float: right" type="button" class="btn btn-primary col-md-3" id="btn_guardar_perfil" data-dismiss="modal">Guardar </button>   
            </div>
        </div>
    </div>
</div>

<!-- ======================================================================================================================================================================================================= -->
<!-- Modal Editar Huesped -->
<div class="modal fade show" id="modal-huesped-editar" aria-modal="true" role="dialog">
	<div class="modal-dialog modal-lg modal-huesped-editar">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">Editar Huesped</h4>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>

			<div class="modal-body">
                <div class="card-body">
					<dl class="row">
                        <dt class="col-sm-4">Id Huesped </dt>
                        <dd class="col-sm-8"><input type="text" class="form-control" name="opt_id_actualizar" id="opt_id_actualizar" readonly="true"></dd>

                        <dt class="col-sm-4">Nombres </dt>
                        <dd class="col-sm-8"><input type="text" class="form-control" name="opt_nombre_actualizar" id="opt_nombre_actualizar" onkeyup="mayus(this);"></dd>
                        
						<dt class="col-sm-4">Apellidos</dt>
                        <dd class="col-sm-8"><input type="text" class="form-control" name="opt_apellido_actualizar" id="opt_apellido_actualizar" onkeyup="mayus(this);"></dd>

						<dt class="col-sm-4">Tipo Documento</dt>
						<dd class="col-sm-8">
							<select class="custom-select" id="opt_tipodoc_actualizar">
								<option value="0">-- Seleccionar --</option>
								<?php foreach($tipodoc as $k5) { ?>
									<option value="<?=$k5['IdTipoDocumento']?>"> <?=$k5['TipoDocumento']?></option>
								<?php } ?>                                    
                            </select>    
						</dd>	

                        <dt class="col-sm-4">Identificación</dt>
                        <dd class="col-sm-8"><input type="text" class="form-control" name="opt_identificacion_actualizar" id="opt_identificacion_actualizar"></dd>

						<dt class="col-sm-4">Fecha Nacimiento</dt>
                        <dd class="col-sm-8"><input type="date" class="form-control" name="opt_fecnac_actualizar" id="opt_fecnac_actualizar"></dd>
						
						<dt class="col-sm-4">Lugar Nacimiento</dt>
                        <dd class="col-sm-8">
							<select class="custom-select" id="opt_lugnac_actualizar">
								<option value="0">-- Seleccionar --</option>
								<?php foreach($ciudades as $k6) { ?>
									<option value="<?=$k6['IdCiudad']?>"><?=$k6['Ciudad']?></option>
								<?php } ?>                                        
							</select>  
						</dd>

						<dt class="col-sm-4">Género</dt>
                        <dd class="col-sm-8">
							<select class="custom-select" id="opt_genero_actualizar">
								<option value="0">--Seleccionar-- </option>
								<option value="1">MASCULINO</option>
								<option value="2">FEMENINO</option>                                                         
							</select>
						</dd>

						<dt class="col-sm-4">Teléfono</dt>
                        <dd class="col-sm-8"><input type="text" class="form-control" name="opt_telefono_actualizar" id="opt_telefono_actualizar"></dd>

						<dt class="col-sm-4">Móvil</dt>
                        <dd class="col-sm-8"><input type="text" class="form-control" name="opt_movil_actualizar" id="opt_movil_actualizar"></dd>

						<dt class="col-sm-4">Nacionalidad</dt>
						<dd class="col-sm-8">
							<select class="custom-select" id="opt_nacionalidad_actualizar">
								<option value="0">-- Seleccionar --</option>
								<?php foreach($paises as $k7) { ?>
									<option value="<?=$k7['IdPais']?>"> <?=$k7['Pais']?></option>
								<?php } ?>                                      
                            </select>    
						</dd>

						<dt class="col-sm-4">Ocupación</dt>
                        <dd class="col-sm-8">
							<select class="custom-select" id="opt_ocupacion_actualizar">
								<option value="0">-- Seleccionar --</option>
								<?php foreach($ocupaciones as $k8) { ?>
									<option value="<?=$k8['IdOcupacion']?>"> <?=$k8['Ocupacion']?></option>
								<?php } ?>                                      
                            </select>    	
						</dd>

						<dt class="col-sm-4">Email</dt>
                        <dd class="col-sm-8"><input type="text" class="form-control" name="opt_email_actualizar" id="opt_email_actualizar"></dd>
                        
						<dt class="col-sm-4">Dirección</dt>
                        <dd class="col-sm-8"><input type="text" class="form-control" name="opt_direccion_actualizar" id="opt_direccion_actualizar" onkeyup="mayus(this);"></dd>

						<dt class="col-sm-4">Ciudad Residencia</dt>
                        <dd class="col-sm-8">
							<select class="custom-select" id="opt_residencia_actualizar">
								<option value="0">-- Seleccionar --</option>
								<?php foreach($ciudades as $k9) { ?>
									<option value="<?=$k9['IdCiudad']?>"><?=$k9['Ciudad']?></option>
								<?php } ?>                                        
							</select>  
						</dd>

						<dt class="col-sm-4">Ciudad Procedencia</dt>
                        <dd class="col-sm-8">
							<select class="custom-select" id="opt_procedencia_actualizar">
								<option value="0">-- Seleccionar --</option>
								<?php foreach($ciudades as $k10) { ?>
									<option value="<?=$k10['IdCiudad']?>"><?=$k10['Ciudad']?></option>
								<?php } ?>                                        
							</select>  
						</dd>
                    </dl>
                </div>
            </div>

            <div class="modal-footer justify-content-between">
				<button style="float: left" type="button" class="btn btn-secondary col-md-3" id="btn_cancelar_huespedes" data-dismiss="modal">Cancelar </button>  
				<button style="float: right" type="button" class="btn btn-primary col-md-3" id="btn_actualizar_huespedes" data-dismiss="modal">Actualizar </button>   
            </div>
        </div>
    </div>
</div>

<!-- ======================================================================================================================================================================================================= -->
     <!-- jQuery -->
    <script src="<?php echo base_url() ?>assets/plugins/jquery/jquery.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/jquery/jquery.min.js"></script>
    <!-- jQuery UI 1.11.4 -->
    <script src="<?php echo base_url() ?>assets/plugins/jquery-ui/jquery-ui.min.js"></script>
    <!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
    <script src="<?php echo base_url() ?>assets/plugins/jquery-Mask/jquery.mask.min.js"></script>
    <!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
    <script>
        $.widget.bridge('uibutton', $.ui.button)
    </script>
    <!-- Bootstrap 4 -->
    <script src="<?php echo base_url() ?>assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
    <!-- ChartJS -->
    <script src="<?php echo base_url() ?>assets/plugins/chart.js/Chart.min.js"></script>
    <!-- Sparkline -->
    <!-- <script src="<?php echo base_url() ?>assets/plugins/sparklines/sparkline.js"></script> -->
    <!-- JQVMap  -->
    <script src="<?php echo base_url() ?>assets/plugins/jqvmap/jquery.vmap.min.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/jqvmap/maps/jquery.vmap.usa.js"></script>
    <!-- jQuery Knob Chart -->
    <script src="<?php echo base_url() ?>assets/plugins/jquery-knob/jquery.knob.min.js"></script>
    <!-- daterangepicker -->
    <script src="<?php echo base_url() ?>assets/plugins/moment/moment.min.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/daterangepicker/daterangepicker.js"></script>
    <!-- Tempusdominus Bootstrap 4 -->
    <script src="<?php echo base_url() ?>assets/plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js"></script>
    <!-- Summernote -->
    <script src="<?php echo base_url() ?>assets/plugins/summernote/summernote-bs4.min.js"></script>
    <!-- overlayScrollbars -->
    <script src="<?php echo base_url() ?>assets/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>
    <!-- AdminLTE App -->
    <script src="<?php echo base_url() ?>assets/dist/js/adminlte.js"></script>
    <!-- AdminLTE for demo purposes -->
    <script src="<?php echo base_url() ?>assets/dist/js/demo.js"></script>
    <!-- AdminLTE dashboard demo (This is only for demo purposes) -->
     <!-- <script src="<?php echo base_url() ?>assets/dist/js/pages/dashboard.js"></script> -->
    <!-- SweetAlert -->
    <script src="<?php echo base_url() ?>assets/plugins/sweetalert2/sweetalert2.all.min.js"></script>
    <!-- AdminLTE Datatable components -->
    <script src="<?php echo base_url() ?>assets/plugins/datatables/jquery.dataTables.min.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/datatables-bs4/js/dataTables.bootstrap4.min.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/datatables-responsive/js/dataTables.responsive.min.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/datatables-responsive/js/responsive.bootstrap4.min.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/datatables-buttons/js/dataTables.buttons.min.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/datatables-buttons/js/buttons.bootstrap4.min.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/jszip/jszip.min.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/pdfmake/pdfmake.min.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/pdfmake/vfs_fonts.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/datatables-buttons/js/buttons.html5.min.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/datatables-buttons/js/buttons.print.min.js"></script>
    <script src="<?php echo base_url() ?>assets/plugins/datatables-buttons/js/buttons.colVis.min.js"></script>
<!-- ======================================================================================================================================================================================================= -->
<script>
	//aca ya carga la data no necesito enviar nuevamente     
	var permisos  = <?php echo json_encode($permisos) ?>;
	var perfiles=<?php echo json_encode($perfiles) ?>;
		
	$(document).ready (function()
	{	
		$("#table_perfiles").DataTable ({
			data: perfiles,
			destroy: true,
			searching: false,
			columns: 
			[
				{data : 'IdPerfil'},
				{data : 'Nombre'}, 
				{ mRender : function (data, type, row)
				{
					if  (row[2]=='A') {return'Activo'; } else {return'Inactivo';}    

					}},
					{mRender: function(data, type, row)
					{
						return '<a href="<?php echo base_url() ?>perfiles/editperfil/'+ row[0] + '" class="table-edit" data-id"'+ row[0] + '"><i class="fas fa-pen" title="Editar"></i></a>'
					}}
			],
			responsive: true, 
            "lengthChange": false, 
            "autoWidth": false,
            lengthChange: true, // Habilitar la opción de longitud
            lengthMenu: [ [10, 25, 50, -1], [10, 25, 50, "All"] ], // Opciones para seleccionar la cantidad de registros por página
            autoWidth: false,
            language: {
                "sProcessing": "Procesando...",
                "sLengthMenu": "Mostrar _MENU_ entradas",
                "sZeroRecords": "No se encontraron resultados",
                "sInfo": "Mostrando de _START_ a _END_ de _TOTAL_ entradas",
                "sInfoEmpty": "Mostrando 0 a 0 de 0 entradas",
                "sInfoFiltered": "(filtrado de _MAX_ entradas totales)",
                "sInfoPostFix": "",
                "sSearch": "Buscar:",
                "sUrl": "",
                "sInfoThousands": ",",
                "sLoadingRecords": "Cargando...",
                "oPaginate": {
                    "sFirst": "Primero",
                    "sPrevious": "Anterior",
                    "sNext": "Siguiente",
                    "sLast": "Último"
                },
                "oAria": {
                    "sSortAscending": ": activar para ordenar la columna de manera ascendente",
                    "sSortDescending": ": activar para ordenar la columna de manera descendente"
                }
            },
			buttons: ["copy", "csv", "excel", "pdf", "print"]           
		}).buttons().container().appendTo('#table_perfiles_wrapper .col-md-6:eq(1)').css('float','right');
	});

	//Validar Caracteres.
	$("#txt_nombre_perfil").bind('keypress', function(event) 
	{
		var regex = new RegExp("^[a-zA-Z0-9 ]+$");
		var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
		if (!regex.test(key)) {
			event.preventDefault();
			return false;
		}
	});
			
	//Boton de busqueda por los parametros.
	$("#btn_buscar_perfiles").click(function () 
	{             
		//Captura de valores 
		var nombre_perfil=$("#txt_nombre_perfiles").val();
		
			//llamada a micro servicio de validacion
		$.ajax({
			url: '<?php echo base_url() ?>perfiles/searchperfiles',//controlador
			type: "POST",//tipo de peticion POST o GET
			headers: {'X-Requested-With': 'XMLHttpRequest'},//Encabezados
			data: {'nombre_perfil': nombre_perfil }//formato json Data						
		}).done(function(dato) {			
			//convierto la respuesta json
			var perfiles=JSON.parse(dato);

			$("#table_perfiles").DataTable({
				data: perfiles,
				destroy: true,
				searching: false,
				columns:
				[
					{data : 'IdPerfil'},
					{data : 'Nombre'},
					{mRender: function (data, type, row){ if(row[2]=='A'){return 'Activo';   }else{return 'Inactivo'; }}},
					{mRender: function (data, type, row) {
						return '<a href="<?php echo base_url() ?>perfiles/editperfil/" class="table-edit" data-id="'+ row[0] +'" class="table-edit" data-id="' + row[0] + '"><i class="fas fa-pen" title="Editar"></i></a>&nbsp;&nbsp;<a  href="#" onclick="btn_inactivar_perfil('+ $row[0] +')" data-id="' + row[0] + '"><i class="fa fa-user-lock" title="Inactivar"></a>'
					}}
				],
				responsive: true, "lengthChange": false, "autoWidth": false,
				buttons: ["copy", "csv", "excel", "pdf", "print"]
			}).buttons().container().appendTo('#table_perfiles_wrapper .col-md-6:eq(0)');
		});
	});

	//Boton Nuevo Perfil
	$("#btn_nuevo_perfil").click(function () 
	{ 
		for(i=0; i<permisos.length; i++){
			if (permisos[i].Nombre == Modulo){ 
                if(permisos[i].Registrar == 'A'){
					$("#modal-perfil-nuevo").modal("show");
					break;
				}else{
					MsgAlerta(); 
				}
			}
		}
	});

	//Boton Inactivar Perfil
	function btn_inactivar_perfil(valor)
	{		
		Swal.fire({
			title: "¿Está seguro de inactivar el perfil?",
			text: "Esta opción inactivara el perfil seleccionado",
			icon: "warning",
			showCancelButton: true,
			confirmButtonColor: '#3085d6',
			cancelButtonColor: '#d33',
			confirmButtonText: 'Aceptar',
			cancelButtonText: 'Cancelar'
		}).then((result) => {
			if (result.isConfirmed){
				$.ajax({
					url: '<?php echo base_url() ?>perfiles/updateperfiles/'+valor,//controlador
					type: "POST",//tipo de peticion POST o GET
					headers: {'X-Requested-With': 'XMLHttpRequest'},//Encabezados	
				}).done(function(dato){
					var obj = JSON.parse(dato); 
					if (obj.res == 'ok'){
						window.location.href="<?php echo base_url() ?>perfiles/listperfiles";
					}else{       
						Swal.fire("error",obj.msg, "error");           
					}
				});		
			} 
		});
	};

	//Funcion para mensajes
	function MsgAlerta()
	{
		Swal.fire({
            title: "Información",
            html:" <p>No tiene permisos para esta acción. <br> Comunicate con el administrador.</p>",
            icon: "info"
		})
	};

</script>
</body>
</html>
