43

 

Explicación del Código de Validación de Reservas

Voy a explicarte este código paso a paso, como si fueras un principiante en programación. Es un código que verifica la disponibilidad de una habitación en un hotel (o similar) para unas fechas específicas.

1. Comprobación inicial

javascript

if($(".infoReservas").html() != undefined){

Esto verifica si existe un elemento HTML con la clase "infoReservas" que tenga contenido. Si no existe, todo el código dentro del if no se ejecuta.

2. Obtención de datos

javascript

var idHabitacion = $(".infoReservas").attr("idHabitacion");
var fechaIngreso = $(".infoReservas").attr("fechaIngreso");
var fechaSalida = $(".infoReservas").attr("fechaSalida");
var dias = $(".infoReservas").attr("dias");

Aquí obtenemos 4 datos importantes del elemento HTML:

• ID de la habitación

• Fecha de ingreso (check-in)

• Fecha de salida (check-out)

• Cantidad de días

3. Preparación para la solicitud AJAX

javascript

var datos = new FormData();
datos.append("idHabitacion", idHabitacion);

Creamos un objeto FormData (para enviar datos al servidor) y le añadimos el ID de la habitación.

4. Solicitud AJAX

javascript

$.ajax({
  url:urlPrincipal+"ajax/reservas.ajax.php",
  method: "POST",
  data: datos,
  cache: false,
  contentType: false,
  processData: false,
  dataType:"json",
  success:function(respuesta){

Hacemos una petición al servidor para obtener información sobre las reservas existentes para esa habitación.

5. Procesamiento de la respuesta

Caso 1: No hay reservas existentes

javascript

if(respuesta.length == 0){
  $('#calendar').fullCalendar({
    // Configuración del calendario
    events: [{
      start: fechaIngreso,
      end: fechaSalida,
      rendering: 'background',
      color: '#FFCC29'
    }]
  });
  colDerReservas(); 
}

Si no hay reservas (respuesta vacía), mostramos el calendario con las fechas seleccionadas marcadas en amarillo (#FFCC29) y llamamos a la función colDerReservas().

Caso 2: Hay reservas existentes

javascript

else {
  // Recorremos todas las reservas existentes
  for(var i = 0; i < respuesta.length; i++){

Aquí verificamos si las fechas seleccionadas chocan con alguna reserva existente, usando 3 métodos diferentes:

Opción 1: Fecha de ingreso coincide exactamente

javascript

if(fechaIngreso == respuesta[i]["fecha_ingreso"]){
  opcion1[i] = false; // Hay conflicto
}else{
  opcion1[i] = true; // No hay conflicto
}

Opción 2: Fecha de ingreso está dentro de una reserva existente

javascript

if(fechaIngreso > respuesta[i]["fecha_ingreso"] && fechaIngreso < respuesta[i]["fecha_salida"]){
  opcion2[i] = false;
}else{
  opcion2[i] = true;
}

Opción 3: La reserva existente comienza durante la estancia seleccionada

javascript

if(fechaIngreso < respuesta[i]["fecha_ingreso"] && fechaSalida > respuesta[i]["fecha_ingreso"]){
  opcion3[i] = false;
}else{
  opcion3[i] = true;
}

6. Validación final de disponibilidad

javascript

if(opcion1[i] == false || opcion2[i] == false || opcion3[i] == false){
  validarDisponibilidad = false;
}else{
  validarDisponibilidad = true;
}

Si alguna de las 3 opciones indica conflicto, la habitación no está disponible.

7. Mostrar resultados

Si no está disponible:

javascript

totalEventos.push({
  "start": respuesta[i]["fecha_ingreso"],
  "end": respuesta[i]["fecha_salida"],
  "rendering": 'background',
  "color": '#847059' // Color gris para reservas existentes
})

$(".infoDisponibilidad").html('<h5 class="pb-5 float-left">¡Lo sentimos, no hay disponibilidad para esa fecha!<br><br><strong>¡Vuelve a intentarlo!</strong></h5>');

break; // Salimos del bucle

Si está disponible:

javascript

totalEventos.push({
  "start": respuesta[i]["fecha_ingreso"],
  "end": respuesta[i]["fecha_salida"],
  "rendering": 'background',
  "color": '#847059'
})

$(".infoDisponibilidad").html('<h1 class="pb-5 float-left">¡Está Disponible!</h1>'); 

colDerReservas();

8. Finalización

Si después de todas las validaciones la habitación está disponible, añadimos las fechas seleccionadas al calendario en amarillo:

javascript

if(validarDisponibilidad){
  totalEventos.push({
    "start": fechaIngreso,
    "end": fechaSalida,
    "rendering": 'background',
    "color": '#FFCC29'
  })
}

Finalmente, mostramos el calendario con todos los eventos (reservas existentes en gris y la nueva en amarillo si está disponible).

Resumen

Este código:

1. Obtiene fechas seleccionadas y ID de habitación

2. Pregunta al servidor por reservas existentes

3. Verifica 3 tipos posibles de conflictos de fechas

4. Muestra en un calendario las reservas existentes y la nueva

5. Informa al usuario si la habitación está disponible o no