<!DOCTYPE html>
<html lang="en">

                            
<?php $this->load->view("template/header"); ?>
<?php $this->load->view("template/nav"); ?>

<style>
    .modal-dialog {
        align-items: center;
        justify-content: center;
    }

    .form-control, #btn_buscar_habitaciones , #btn_nueva_habitacion {
        height: calc(1.5em + 0.75rem + 2px); /* Altura uniforme */
        padding: 0.375rem 0.75rem; /* Padding uniforme */
        font-size: 16px;
        line-height: 1.5;
    }

    #btn_buscar_habitaciones {
        width: 150px;
    }

    #btn_nueva_habitacion {
        min-width: 150px; /* Ancho mínimo para el botón */
        width: auto; /* Ajusta el ancho según el contenido */
        max-width: 200px; /* Ancho máximo */
        margin-left: 10px; /* Elimina el margen izquierdo */
        margin-top: 10px; /* Margen superior para separación */
        display: inline-block; /* Asegura que el botón no se expanda más allá de su contenido */
    }

    .form-group {
        margin-bottom: 0; /* Ajusta el espacio entre los campos */
    }

    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .table {
        width: 100%;
        margin-bottom: 1rem;
        background-color: transparent;
    }

    .card-footer {
        padding: 10px; /* Elimina padding para evitar el desalineamiento */
        display: flex; /* Usa flex para alinear el contenido */
        align-items: center; /* Centra verticalmente los elementos en el contenedor */    
    }

    .card-footer2 {
        display: flex;
        justify-content: space-between; /* Espacia los botones */
        padding: 10px; /* Ajusta el padding según sea necesario */
    }

    .card-footer3 {
        display: flex;
        justify-content: space-between; /* Espacia los botones */
        padding: 10px; /* Ajusta el padding según sea necesario */
    }

    .required {
		color: red;
		margin-left: 5px;
	}

    .dataTables_length select {
        min-width: 60px; /* Ajusta el tamaño según sea necesario */
        padding-right: 20px; /* Agrega espacio adicional para las flechas */
    }

    /* Responsive design */
    @media (max-width: 768px) {
        .card-body .row {
            flex-direction: column; /* Cambia la dirección del flex para pantallas pequeñas */
        }

        #btn_buscar_habitaciones,
        #btn_nueva_habitacion {
            width: 100%; /* Hace que los botones ocupen todo el ancho en pantallas pequeñas */
        }
    }
</style>

<!-- Content Wrapper. Contains page content -->
<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">Habitaciones</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="card card-secondary">
				<div class="card-header">
					<h3 class="card-title">Datos de  búsqueda </h3>
				</div>
              
                <form id="quickForm"  autocomplete="off">
                    <div class="card-body">
						<div class="row ">
							<div class="col-12 col-sm-4 col-md-3 col-lg-2 mt-1 mb-1">
								<div class="form-group">
									<label>Establecimiento</label>
									<select class="form-control" id="cmb_establecimiento">
										<option value="">--Seleccionar-- </option>
										<?php foreach($establecimiento as $k1) { ?>
					                		<option value="<?=$k1['IdEstablecimiento']?>"><?=$k1['Nombre']?></option>
					            		<?php } ?>                                      
                                	</select>    
								</div>
							</div>  
						
							<div class="col-12 col-sm-4 col-md-3 col-lg-2 mt-1 mb-1">
								<div class="form-group">
									<label>Número Habitación</label>
									<input type="text" name="txt_numHabitacion" class="form-control" id="txt_numHabitacion"> </input>
								</div>
							</div>  
								
							<div class="col-12 col-sm-4 col-md-3 col-lg-2 mt-1 mb-1">
								<div class="form-group">
									<label>Disponibilidad</label>
									<select class="form-control" id="cmb_disponibilidad">
										<option value="">--Seleccionar-- </option>
										<?php foreach($disponibilidad as $k2) { ?>
					                		<option value="<?=$k2['IdEstado']?>"><?=$k2['Descripcion']?></option>
					            		<?php } ?>                                 
                                	</select>    
								</div>
							</div>  

							<div class="col-12 col-sm-4 col-md-3 col-lg-2 mt-1 mb-1 d-flex align-items-end">
									<button type="button" id="btn_buscar_habitaciones" class="btn btn-primary">Buscar</button>
							</div> 
						</div> 
					</div>
				

                    <div class="card-body">
                        <div id="example1_wrapper" class="dataTables_wrapper dt-bootstrap4">
                            <div class="table-responsive">
                                <table id="example1" class="table table-bordered table-striped dataTable dtr-inline" role="grid" aria-describedby="example1_info">
                                    <thead>
							    		<tr role="row">
								    		<th class="sorting" tabindex="0" aria-controls="example1" style="">Item</th>
											<th class="sorting" tabindex="0" aria-controls="example1" style="">Establecimientos</th>
											<th class="sorting" tabindex="0" aria-controls="example1" style="">Número de habitación</th>
											<th class="sorting" tabindex="0" aria-controls="example1" style="">Tipo de habitación</th>
											<th class="sorting" tabindex="0" aria-controls="example1" style="">Capacidad</th>
											<th class="sorting" tabindex="0" aria-controls="example1" style="">Disponibilidad</th>
											<th class="sorting" tabindex="0" aria-controls="example1" style="">Descripción</th>
											<th class="sorting" tabindex="0" aria-controls="example1" style="">Acciones</th>
										</tr>
                                    </thead>
                                    <tbody>            
                                    </tbody>
                                   	<tfoot>
									    <tr>
											<th style="">Item</th>
											<th style="">Establecimientos</th>
											<th style="">Número de habitación</th>
											<th style="">Tipo de habitación</th>
											<th style="">Capacidad</th>
											<th style="">Disponibilidad</th>
											<th style="">Descripción</th>
											<th style="">Acciones</th>
										</tr>
                                    </tfoot>
                                </table>
                            </div> 
                        </div>
                    </div>

                    <div class="card-footer">
                    	<button type="button" id="btn_nueva_habitacion" class="btn btn-primary col-md-1 ">Nuevo</button>
                    </div>
                </form>   
            </div>
        </div>
	</section>
                    
	<div class="row">
		<section class="col-lg-7 connectedSortable">
		</section>
		<section class="col-lg-5 connectedSortable">
		</section>
	</div>
</div>

<?php $this->load->view("template/footer"); ?>

<aside class="control-sidebar control-sidebar-dark">
</aside>

<!-- ======================================================================================================================================================================================================= -->
<div class="modal fade show" id="modal_habitacion_nueva" aria-modal="true" role="dialog">
	<div class="modal-dialog modal-dialog-centered modal-xl modal_habitacion_nueva">
		<div class="modal-content">
			<div class="modal-header">
				<h4 class="modal-title">Nueva Habitación</h4>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">×</span>
                </button>
			</div>

            <form id="quickForm" autocomplete="off">
                <div class="card-body">
                    <div class="row" >
                        <div class="col-sm-3 mt-1 mb-1">
                            <div class="form-group">
								<label>Establecimiento<span class="required">*</span></label> 
								<select class="custom-select" id="opt_establecimiento">
				                	<option value="0">--Seleccionar-- </option>
				                	<?php foreach($establecimiento as $k3) { ?>
					                	<option value="<?=$k3['IdEstablecimiento']?>"><?=$k3['Nombre']?></option>
					            	<?php } ?>                                    
				            	</select>    
                            </div>
                        </div>

                        <div class="col-sm-2 mt-1 mb-1">
                            <div class="form-group">
                                <label>Número Habitación<span class="required">*</span></label> 
                                <input type="text" name="opt_num_habitacion" class="form-control" id="opt_num_habitacion" maxlength="125" onkeyup="mayus(this);"></input>
                            </div>
                        </div>

                        <div class="col-sm-3 mt-1 mb-1">
							<div class="form-group">
                                <label>Tipo Habitación<span class="required">*</span></label> 
                                <select class="custom-select" id="opt_tipo_habitacion">
				                	<option value="0">--Seleccionar-- </option>
				                	<?php foreach($tipohabitacion as $k4) { ?>
					                	<option value="<?=$k4['IdTipoHabitacion']?>"><?=$k4['TipoHabitacion']?></option>
					            	<?php } ?>                                    
				            	</select>  
                            </div>
                        </div> 

						<div class="col-sm-2 mt-1 mb-1">
                            <div class="form-group">
                                <label>Estado<span class="required">*</span></label> 
								<select class="custom-select" id="opt_estado_habitacion">
				                	<option value="0">--Seleccionar-- </option>
				                	<?php foreach($estado as $k5) { ?>
					                	<option value="<?=$k5['IdEstado']?>"><?=$k5['Descripcion']?></option>
					            	<?php } ?>                                    
				            	</select>  
                            </div>
                        </div>

						<div class="col-sm-2 mt-1 mb-1">
							<div class="form-group">
                                <label>Disponibilidad<span class="required">*</span></label> 
								<select class="custom-select" id="opt_disponibilidad_habitacion">
				                	<option value="0">--Seleccionar-- </option>
				                	<?php foreach($disponibilidad as $k6) { ?>
					                	<option value="<?=$k6['IdEstado']?>"><?=$k6['Descripcion']?></option>
					            	<?php } ?>                                    
				            	</select>  
                            </div>
                        </div> 
					</div> 
					
					<div class="row" >
						<div class="col-sm-2 mt-1 mb-1">
							<div class="form-group">
                                <label>Capacidad</label> 
                                <input type="text" name="opt_capacidad_habitacion" class="form-control" id="opt_capacidad_habitacion" readonly></input>
                            </div>
                        </div> 

                        <div class="col-sm-10 mt-1 mb-1">
                            <div class="form-group">
                                <label>Descripción</label> 
                                <input type="text" name="opt_des_habitacion" class="form-control" id="opt_des_habitacion" readonly></input>
                            </div>
                        </div>
					</div> 

          			<legend class="w-auto">Información Valor Habitación</legend>
					<table id="example2" class="table table-bordered table-striped dataTable dtr-inline" role="grid" aria-describedby="example2_info">
                        <thead>
							<tr role="row">
								<th class="sorting" tabindex="0" aria-controls="example2" style="">Clase Ocupación</th>
								<th class="sorting" tabindex="0" aria-controls="example2" style="">Individual</th>
								<th class="sorting" tabindex="0" aria-controls="example2" style="">Pareja</th>
								<th class="sorting" tabindex="0" aria-controls="example2" style="">Dos Personas</th>
								<th class="sorting" tabindex="0" aria-controls="example2" style="">Adicional</th>
							</tr>
                        </thead>
                        <tbody>                  
                        </tbody>
                        <tfoot>
                        </tfoot>
                    </table>
                </div>  
            </form>

			<div class="card-footer2">
                <button  type="button" class="btn btn-secondary col-md-2" data-dismiss="modal" id="btn_cancelar_habitacion" style="margin-left: 10px;">Cancelar </button>
                <button  type="button" class="btn btn-primary col-md-2" id="btn_guardar_habitacion" style="margin-right: 10px;">Guardar </button>   
                <!-- data-dismiss="modal"  Esto es para cerrar el modal automaticamente sin tener en cuenta ninguna validación -->
            </div>
		</div>
	</div>
</div>

<!-- ======================================================================================================================================================================================================= -->
<div class="modal fade show" id="modal_habitacion_editar" aria-modal="true" role="dialog">
	<div class="modal-dialog modal-dialog-centered modal-xl modal_habitacion_editar">
		<div class="modal-content">
			<div class="modal-header">
				<h4 class="modal-title">Nueva Habitación</h4>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">×</span>
                </button>
			</div>

            <form id="quickForm" autocomplete="off">
                <div class="card-body">
                    <div class="row" >
                        <div class="col-sm-3 mt-1 mb-1">
                            <div class="form-group">
								<label>Establecimiento</label> 
								<select class="custom-select" id="opt_establecimiento_edit">
				                	<option value="0">--Seleccionar-- </option>
				                	<?php foreach($establecimiento as $k7) { ?>
					                	<option value="<?=$k7['IdEstablecimiento']?>"><?=$k7['Nombre']?></option>
					            	<?php } ?>                                    
				            	</select>    
                            </div>
                        </div>

                        <div class="col-sm-2 mt-1 mb-1">
                            <div class="form-group">
                                <label>Número Habitación</label> 
                                <input type="text" name="opt_num_habitacion_edit" class="form-control" id="opt_num_habitacion_edit" maxlength="125" onkeyup="mayus(this);"></input>
                            </div>
                        </div>

                        <div class="col-sm-3 mt-1 mb-1">
							<div class="form-group">
                                <label>Tipo Habitación</label> 
                                <select class="custom-select" id="opt_tipo_habitacion_edit">
				                	<option value="0">--Seleccionar-- </option>
				                	<?php foreach($tipohabitacion as $k8) { ?>
					                	<option value="<?=$k8['IdTipoHabitacion']?>"><?=$k8['TipoHabitacion']?></option>
					            	<?php } ?>                                    
				            	</select>  
                            </div>
                        </div> 

						<div class="col-sm-2 mt-1 mb-1">
                            <div class="form-group">
                                <label>Estado</label> 
								<select class="custom-select" id="opt_estado_habitacion_edit">
				                	<option value="0">--Seleccionar-- </option>
				                	<?php foreach($estado as $k9) { ?>
					                	<option value="<?=$k9['IdEstado']?>"><?=$k9['Descripcion']?></option>
					            	<?php } ?>                                    
				            	</select>  
                            </div>
                        </div>

						<div class="col-sm-2 mt-1 mb-1">
							<div class="form-group">
                                <label>Disponibilidad</label> 
								<select class="custom-select" id="opt_disponibilidad_habitacion_edit">
				                	<option value="0">--Seleccionar-- </option>
				                	<?php foreach($disponibilidad as $k10) { ?>
					                	<option value="<?=$k10['IdEstado']?>"><?=$k10['Descripcion']?></option>
					            	<?php } ?>                                    
				            	</select>  
                            </div>
                        </div> 
					</div> 
					
					<div class="row" >
						<div class="col-sm-2 mt-1 mb-1">
							<div class="form-group">
                                <label>Capacidad</label> 
                                <input type="text" name="opt_capacidad_habitacion_edit" class="form-control" id="opt_capacidad_habitacion_edit" readonly></input>
                            </div>
                        </div> 

                        <div class="col-sm-10 mt-1 mb-1">
                            <div class="form-group">
                                <label>Descripción</label> 
                                <input type="text" name="opt_des_habitacion_edit" class="form-control" id="opt_des_habitacion_edit" readonly></input>
                            </div>
                        </div>
					</div> 
						
					<legend class="w-auto">Información Valor Habitación</legend>
					<table id="example3" class="table table-bordered table-striped dataTable dtr-inline" role="grid" aria-describedby="example3_info">
                        <thead>
							<tr role="row">
								<th class="sorting" tabindex="0" aria-controls="example3" style="">Clase Ocupación</th>
								<th class="sorting" tabindex="0" aria-controls="example3" style="">Individual</th>
								<th class="sorting" tabindex="0" aria-controls="example3" style="">Pareja</th>
								<th class="sorting" tabindex="0" aria-controls="example3" style="">Dos Personas</th>
								<th class="sorting" tabindex="0" aria-controls="example3" style="">Adicional</th>
							</tr>
                        </thead>
                        <tbody>                  
                        </tbody>
                        <tfoot>
                        </tfoot>
                    </table>
                </div>  
            </form>

			<div class="card-footer3">
                <button type="button" class="btn btn-secondary col-md-2" data-dismiss="modal" id="btn_cancelar_habitacion" style="margin-left: 10px;">Cancelar </button>
                <button type="button" class="btn btn-primary col-md-2" id="btn_actualizar_habitacion" style="margin-right: 10px;">Guardar </button>   
            </div>
		</div>
	</div>
</div>

<!-- ======================================================================================================================================================================================================= -->
	<!-- jQuery -->
	<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>
		$.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>
    //Definir Variables
    var Modulo = 'HABITACIONES';
	var ControlVal   = 0;
	var HabitacionId = '';

	//aca ya carga la data no necesito enviar nuevamente     
	var permisos        = <?php echo json_encode($permisos) ?>;
	var habitacion      = <?php echo json_encode($habitacion) ?>;
	var estado          = <?php echo json_encode($estado) ?>;
	var disponibilidad  = <?php echo json_encode($disponibilidad) ?>;
	var establecimiento = <?php echo json_encode($establecimiento) ?>;
	var tipohabitacion  = <?php echo json_encode($tipohabitacion) ?>;
	
		
	//Inicio de lectura del cargue	
	$(document).ready (function() 
	{
		$("#example1").DataTable(
		{
			data: habitacion,
			destroy: true,
			searching: false,
			columns:
			[
				{data : 'IdHabitacion'},
				{data : 'NomEstablecimiento'},
				{data : 'NumeroHabitacion'},
				{data : 'TipoHabitacion'},
				{data : 'Capacidad'},
				{data : 'Disponibilidad'},
				{data : 'Descripcion'},
				{"data" : function (row, type,val, meta) {
					var Idhabitacion = row.IdHabitacion;
					var IdEstablecimiento = row.IdEstablecimiento;
					if(type==='display'){
						return '<a href="#" onclick="btn_editar_habitacion('+ Idhabitacion +')" data-id="' + Idhabitacion + '" class="table-edit" >Editar</a>'; 
					}else{
						return null;
					}
				}}
			],
			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('#example1_wrapper .col-md-6:eq(1)').css('float','right');
	});
	
	//Validar existencia de Habitacion por Establecimiento
	$('#opt_num_habitacion').change(function() 
	{
		//definir Variables
		var Opcion = '6';
		var IdEstablecimiento = $('#opt_establecimiento').val();
		var NumHabitacion = $('#opt_num_habitacion').val();

		$.ajax({
			url: '<?php echo base_url() ?>Habitaciones/searchHabitacion',//controlador
			type: "POST",//tipo de peticion POST o GET
			headers: {'X-Requested-With': 'XMLHttpRequest'},//Encabezados
			data: { 'Opcion'            : Opcion,
					'IdEstablecimiento' : IdEstablecimiento,
					'NumHabitacion'     : NumHabitacion}//formato json Data     
		}).done(function(dato){
			var Habitacion = JSON.parse(dato);
			if(Habitacion.length != 0){
				Swal.fire("error","El número de habitación ya existe para ese establecimiento, por favor escoger otro número de habitación", "error"); 
				$('#opt_num_habitacion').val('');	
				$('#opt_num_habitacion').focus();	
			}else{
				$("#btn_guardar_habitacion").attr("disabled",false);
			}			
		});
	});

	//Colaocar la capacidad y descripción segun el tipo de habitación 
	$('#opt_tipo_habitacion').change(function() 
	{
		//definir Variables
		var Opcion = '1';
		var IdTipoHabitacion = $('#opt_tipo_habitacion').val();

		$.ajax({
			url: '<?php echo base_url() ?>Tipos/searchTipoHabitacion',//controlador
			type: "POST",//tipo de peticion POST o GET
			headers: {'X-Requested-With': 'XMLHttpRequest'},//Encabezados
			data: { 'Opcion'           : Opcion,
					'IdTipoHabitacion' : IdTipoHabitacion}//formato json Data     
		}).done(function(dato){
			var tipo = JSON.parse(dato);
			$('#opt_capacidad_habitacion').val(tipo[0].Capacidad)			
			$('#opt_des_habitacion').val(tipo[0].Descripcion)	
			ValorHabitacion();		
		});
	});

	//Botón de busqueda por los parametros.
	$("#btn_buscar_habitaciones").click(function () 
	{             
		//Captura de valores 
		var Opcion          = '9';
		var establecimiento = $("#cmb_establecimiento").val();
		var habitacion 	    = $('#txt_numHabitacion').val();
		var disponibilidad  = $("#cmb_disponibilidad").val();	
		
		//llamada a micro servicio de validacion
		$.ajax({
			url: '<?php echo base_url() ?>Habitaciones/searchHabitacion',//controlador
			type: "POST",//tipo de peticion POST o GET
			headers: {'X-Requested-With': 'XMLHttpRequest'},//Encabezados
			data: {	'Opcion'            : Opcion,	
					'IdEstablecimiento' : establecimiento, 
					'NumHabitacion'     : habitacion,
					'Disponibilidad'    : disponibilidad}//formato json Data			
		}).done(function(dato) {				
			//convierto la respuesta json
			var habitacion_bus=JSON.parse(dato);
			
			$("#example1").DataTable(
			{
				data: habitacion_bus,
				destroy: true,
				searching: false,
				columns:
				[
					{data : 'IdHabitacion'},
					{data : 'NomEstablecimiento'},
					{data : 'NumeroHabitacion'},
					{data : 'TipoHabitacion'},
					{data : 'Capacidad'},
					{data : 'DisponibilidadHab'},  
					{data : 'DescripcionHab'},
					{"data" : function (row, type,val, meta) {
						var Codigo_habitacion=row.IdHabitacion;
						if(type==='display'){
							return '<a href="#" onclick="btn_editar_habitacion('+ Codigo_habitacion +')" data-id="' + Codigo_habitacion + '" class="table-edit" >Editar</a>';
						}else{
							return null;
						}
					}}
				],
				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('#example1_wrapper .col-md-6:eq(1)').css('float','right');
		});
	});

	//Crear Habitacion
	$("#btn_nueva_habitacion").click(function () 
	{ 
		//validar permisos de acceso
		for(i=0; i<permisos.length; i++){
			if (permisos[i].Nombre == Modulo){ 
                if(permisos[i].Registrar == 'A'){
                    $("#modal_habitacion_nueva").modal({
                                backdrop: 'static',
                                keyboard: false
                    });
					$("#modal_habitacion_nueva").modal("show"); 
					break;
				}else{
					MsgAlerta(); 
				}
			}
		}
	});

	//Boton para habitacion         
	$("#btn_guardar_habitacion").click(function ()
	{
		//capturar los valores
		var IdEstablecimiento = $('#opt_establecimiento').val();
		var NumeroHabitacion  = $('#opt_num_habitacion').val();
		var IdTipoHabitacion  = $("#opt_tipo_habitacion").val();
		var Descripcion       = $('#opt_des_habitacion').val();
		var IdEstado      	  = $('#opt_estado_habitacion').val();
		var IdDisponibilidad  = $('#opt_disponibilidad_habitacion').val();

		//Validaciones del front end.
		if(IdEstablecimiento == 0){
            Swal.fire({
                title: 'Error',
                text: 'Debe ingresar el establecimiento correspondiente',
                icon: 'error',
                confirmButtonText: 'OK',
                allowOutsideClick: false, // Deshabilita el cierre al hacer clic fuera del modal
                allowEscapeKey: false // Deshabilita el cierre al presionar la tecla "Escape"
            });
            return;
        }

		if(NumeroHabitacion == ''){
            Swal.fire({
                title: 'Error',
                text: 'Debe ingresar el número de la habitación correspondiente',
                icon: 'error',
                confirmButtonText: 'OK',
                allowOutsideClick: false, // Deshabilita el cierre al hacer clic fuera del modal
                allowEscapeKey: false // Deshabilita el cierre al presionar la tecla "Escape"
            });
            return;
        }

        if(IdTipoHabitacion == 0){
            Swal.fire({
                title: 'Error',
                text: 'Debe ingresar el tipo de habitación',
                icon: 'error',
                confirmButtonText: 'OK',
                allowOutsideClick: false, // Deshabilita el cierre al hacer clic fuera del modal
                allowEscapeKey: false // Deshabilita el cierre al presionar la tecla "Escape"
            });
            return;
        }

        if(IdEstado == 0){
            Swal.fire({
                title: 'Error',
                text: 'Debe seleccionar el estado de la habitación',
                icon: 'error',
                confirmButtonText: 'OK',
                allowOutsideClick: false, // Deshabilita el cierre al hacer clic fuera del modal
                allowEscapeKey: false // Deshabilita el cierre al presionar la tecla "Escape"
            });
            return;
        }  

		if(IdDisponibilidad == 0){
            Swal.fire({
                title: 'Error',
                text: 'Debe seleccionar la disponibilidad de la habitación',
                icon: 'error',
                confirmButtonText: 'OK',
                allowOutsideClick: false, // Deshabilita el cierre al hacer clic fuera del modal
                allowEscapeKey: false // Deshabilita el cierre al presionar la tecla "Escape"
            });
            return;
        }

		//llamada a micro servicio de validacion
		$.ajax({
			url: '<?php echo base_url() ?>Habitaciones/insertHabitacion',//controlador
			type: "POST",//tipo de peticion POST o GET
			headers: {'X-Requested-With': 'XMLHttpRequest'},//Encabezados
			data: { 'IdEstablecimiento' : IdEstablecimiento,
					'NumeroHabitacion'  : NumeroHabitacion,
					'IdTipoHabitacion'  : IdTipoHabitacion,
					'Descripcion'       : Descripcion,
					'IdEstado'          : IdEstado, 
					'IdDisponibilidad'  : IdDisponibilidad}//formato json Data   
		}).done(function(dato){
			//convierto la respuesta json
			var obj = JSON.parse(dato);	
								
			if (obj.res == 'ok'){
				HabitacionId = obj.id;
                Swal.fire("Información",obj.msg, "success").then(() => {    
                    // Redirigir a otra página después de mostrar el mensaje
                    window.location.href="<?php echo base_url() ?>Habitaciones/listHabitaciones";
                });
			}else{
				Swal.fire("error",obj.msg, "error");  
			}
		});
	});   

	//Colaocar la capacidad y descripción segun el tipo de habitación cuando se edita
	$('#opt_tipo_habitacion_edit').change(function() 
	{
		//definir Variables
		var Opcion = '1';
		var IdTipoHabitacion = $('#opt_tipo_habitacion_edit').val();

		$.ajax({
			url: '<?php echo base_url() ?>Tipos/searchTipoHabitacion',//controlador
			type: "POST",//tipo de peticion POST o GET
			headers: {'X-Requested-With': 'XMLHttpRequest'},//Encabezados
			data: { 'Opcion'           : Opcion,
					'IdTipoHabitacion' : IdTipoHabitacion}//formato json Data     
		}).done(function(dato){
			var tipo = JSON.parse(dato);
			$('#opt_capacidad_habitacion_edit').val(tipo[0].Capacidad)			
			$('#opt_des_habitacion_edit').val(tipo[0].Descripcion)	
			ValorHabitacionEdit();			
		});
	});

	//Ejecutar el modal - Cargar habitación
    $("#btn_actualizar_habitacion").click(function () 
	{ 
		var Opcion = '1';
        var IdEstablecimiento = $('#opt_establecimiento_edit').val();
        var NumeroHabitacion  = $('#opt_num_habitacion_edit').val();
        var IdTipoHabitacion  = $('#opt_tipo_habitacion_edit').val();
        var IdEstado          = $('#opt_estado_habitacion_edit').val();
        var Disponibilidad    = $('#opt_disponibilidad_habitacion_edit').val();
        
        //Validaciones del front end.
		if(NumeroHabitacion==''){ 
            Swal.fire({
                title: 'Error',
                text: 'Debe ingresar el número de la habitación correspondiente',
                icon: 'error',
                confirmButtonText: 'OK',
                allowOutsideClick: false, // Deshabilita el cierre al hacer clic fuera del modal
                allowEscapeKey: false // Deshabilita el cierre al presionar la tecla "Escape"
            });
			return; 
		}

		if(IdTipoHabitacion==''){
            Swal.fire({
                title: 'Error',
                text: 'Debe ingresar el nombre de la habitación',
                icon: 'error',
                confirmButtonText: 'OK',
                allowOutsideClick: false, // Deshabilita el cierre al hacer clic fuera del modal
                allowEscapeKey: false // Deshabilita el cierre al presionar la tecla "Escape"
            });
			return;
	 	}

		if(IdEstado == 0){ 
            Swal.fire({
                title: 'Error',
                text: 'Debe seleccionar el estado de la habitación',
                icon: 'error',
                confirmButtonText: 'OK',
                allowOutsideClick: false, // Deshabilita el cierre al hacer clic fuera del modal
                allowEscapeKey: false // Deshabilita el cierre al presionar la tecla "Escape"
            });
			return;
		}  

		if(Disponibilidad == 0){ 
            Swal.fire({
                title: 'Error',
                text: 'Debe seleccionar la disponibilidad de la habitación',
                icon: 'error',
                confirmButtonText: 'OK',
                allowOutsideClick: false, // Deshabilita el cierre al hacer clic fuera del modal
                allowEscapeKey: false // Deshabilita el cierre al presionar la tecla "Escape"
            });
			return;
		}

		//llamada a micro servicio de validacion
        $.ajax({
            url: '<?php echo base_url() ?>Habitaciones/updateHabitaciones',//controlador
            type: "POST",//tipo de peticion POST o GET
            headers: {'X-Requested-With': 'XMLHttpRequest'},//Encabezados
            data: {	'Opcion' 			: Opcion, 
					'IdHabitacion' 		: HabitacionId, 
				    'IdEstablecimiento' : IdEstablecimiento, 
					'NumeroHabitacion'  : NumeroHabitacion, 
					'IdTipoHabitacion'  : IdTipoHabitacion, 
					'IdEstado'          : IdEstado, 
					'Disponibilidad'    : Disponibilidad}//formato json Data              
        }).done(function(dato){
            //convierto la respuesta json
            var obj = JSON.parse(dato); 
            if (obj.res == 'ok'){
				Swal.fire("Información",obj.msg, "success").then(() => {    
                    // Redirigir a otra página después de mostrar el mensaje
                    window.location.href="<?php echo base_url() ?>Habitaciones/listHabitaciones";
                });
            }else{
                Swal.fire("error",obj.msg, "error");  
            }
        });
      
    });

	function ValorHabitacion()
	{
		var Opcion = '7';
		var IdTipoHabitacion = $('#opt_tipo_habitacion').val();

		$.ajax({
			url: '<?php echo base_url() ?>ValorHabitacion/searchValorHabitacion',//controlador
			type: "POST",//tipo de peticion POST o GET
			headers: {'X-Requested-With': 'XMLHttpRequest'},//Encabezados
			data: { 'Opcion'           : Opcion,
					'IdTipoHabitacion' : IdTipoHabitacion}//formato json Data     
		}).done(function(dato){
			var tipo = JSON.parse(dato);
			$("#example2").DataTable({
				data: tipo,
				destroy: true,
				searching: false,
				paging: false,
				info: false,
				columns:
				[
					{data : 'NombreClase'},
					{data : 'Individual' , render: $.fn.dataTable.render.number('.', ',', 0, '$ ')},
					{data : 'Pareja' , render: $.fn.dataTable.render.number('.', ',', 0, '$ ')},
					{data : 'DosPersonas' , render: $.fn.dataTable.render.number('.', ',', 0, '$ ')},
					{data : 'Adicional' , render: $.fn.dataTable.render.number('.', ',', 0, '$ ')}
				],
				responsive: true, "lengthChange": false, "autoWidth": false,
			}).buttons().container().appendTo('#example2_wrapper .col-md-6:eq(0)');			
		});
	}

	function ValorHabitacionEdit()
	{
		var Opcion = '7';
		var IdTipoHabitacion = $('#opt_tipo_habitacion_edit').val();

		$.ajax({
			url: '<?php echo base_url() ?>ValorHabitacion/searchValorHabitacion',//controlador
			type: "POST",//tipo de peticion POST o GET
			headers: {'X-Requested-With': 'XMLHttpRequest'},//Encabezados
			data: { 'Opcion'           : Opcion,
					'IdTipoHabitacion' : IdTipoHabitacion}//formato json Data     
		}).done(function(dato){
			var tipo = JSON.parse(dato);
			$("#example3").DataTable({
				data: tipo,
				destroy: true,
				searching: false,
				paging: false,
				info: false,
				columns:
				[
					{data : 'NombreClase'},
					{data : 'Individual' , render: $.fn.dataTable.render.number('.', ',', 0, '$ ')},
					{data : 'Pareja' , render: $.fn.dataTable.render.number('.', ',', 0, '$ ')},
					{data : 'DosPersonas' , render: $.fn.dataTable.render.number('.', ',', 0, '$ ')},
					{data : 'Adicional' , render: $.fn.dataTable.render.number('.', ',', 0, '$ ')}
				],
				responsive: true, "lengthChange": false, "autoWidth": false,
			}).buttons().container().appendTo('#example3_wrapper .col-md-6:eq(0)');			
		});
	}

	//Editar Habitacion
	function btn_editar_habitacion(Valor) 
	{ 
		//validar permisos de acceso
		for(i=0; i<permisos.length; i++){
			if (permisos[i].Nombre == Modulo){ 
                if(permisos[i].Actualizar == 'A'){
                    $("#modal_habitacion_editar").modal({
                                backdrop: 'static',
                                keyboard: false
                    });
					$("#modal_habitacion_editar").modal("show"); 
					//definir Variables
					var Opcion = '8';
					var IdHabitacion = Valor;
					HabitacionId = IdHabitacion;

					$.ajax({
						url: '<?php echo base_url() ?>Habitaciones/searchHabitacion',//controlador
						type: "POST",//tipo de peticion POST o GET
						headers: {'X-Requested-With': 'XMLHttpRequest'},//Encabezados
						data: { 'Opcion'       : Opcion,
								'IdHabitacion' : IdHabitacion}//formato json Data     
					}).done(function(dato){
						var Habitacion = JSON.parse(dato);
						$('#opt_establecimiento_edit').val(Habitacion[0].IdEstablecimiento)			
						$('#opt_num_habitacion_edit').val(Habitacion[0].NumeroHabitacion)
						$('#opt_tipo_habitacion_edit').val(Habitacion[0].IdTipoHabitacion)
						$('#opt_estado_habitacion_edit').val(Habitacion[0].IdEstadoHab)
						$('#opt_disponibilidad_habitacion_edit').val(Habitacion[0].DisponibilidadHab)
						$('#opt_capacidad_habitacion_edit').val(Habitacion[0].Capacidad)
						$('#opt_des_habitacion_edit').val(Habitacion[0].DescripcionHab)
						ValorHabitacionEdit();
					});
					break;
				}else{
					MsgAlerta(); 
				}
			}
		}
	};

	//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",
            confirmButtonText: 'OK',
            allowOutsideClick: false, // Deshabilita el cierre al hacer clic fuera del modal
            allowEscapeKey: false // Deshabilita el cierre al presionar la tecla "Escape"
		})
	};

	//funcion pasar a mayusculas
	function mayus(e) 
	{
		e.value = e.value.toUpperCase();
	};
			
</script>

</body>

</html>
