Aplicar una verificación extra en el proceso de checkout

El motor de reservas de Mybooking permite extender su comportamiento para implementar ciertas reglas de negocio que son necesarias para tu empresa. Uno de los casos es poder intervenir en el proceso de checkout y hacer una validación extra, que no quieras implementar como una validación en los campos del formulario.

A continuación te explicamos un ejemplo. Un cliente que alquila embarcaciones quiere evitar que se pueda hacer una reserva con patrón. Es decir, debe avisar al cliente que se ponga en contacto por correo o telefónicamente. Para conseguir que el formulario de checkout funcione así, podemos configurar el Mediador para intervenir en el proceso de checkout, hacer la comprobación y evitar que el proceso pueda continuar si no se cumple el requisito.

Configuración del mediador

El plugin de Mybooking configura una variable global de JavaScript, mybookingJSEngine.

Lo primero que haremos es comprobar que está definida. A continuación, si queremos intervenir en el proceso de checkout, lo que haremos es comprobar que el elemento body contiene la clase "complete" que es la que se inserta en el componente de checkout. Por último estableceremos el delegate checkout en el mediador.

if (typeof mybookingJsEngine !== 'undefined') {
      // Complete
      if (jQuery('body').hasClass('complete')) {
        var rentEngineMediator = mybookingJsEngine.default.rent.rentEngineMediator;
        rentEngineMediator.setupDelegate({checkout: this.checkout});
      }
}

Con esto habremos configurado un método que se llamará cuando el cliente pulse el botón [Solicitar reserva] o [Pagar ahora] en el proceso de checkout y haya pasado la validación del formulario. Lo que nos quedará es implementar este método para aplicar la validación correspondiente.

Código completo

<script>
var mybookingClient = mybookingClient || {};

mybookingClient.rentEngineDelegate = {

  alertText: {
    'es' : "Por favor, póngase en contacto por teléfono o email para hacer una reserva con patrón",
    'fr' : "Veuillez contacter par téléphone ou par email pour faire une réservation avec skipper",
    'en' : "Please contact by phone or email to make a reservation with skipper"
  },
  
  init: function() {
    this.setupDelegate();
  },

  setupDelegate: function() {
    if (typeof mybookingJsEngine !== 'undefined') {
      // Complete
      if (jQuery('body').hasClass('complete')) {
        var rentEngineMediator = mybookingJsEngine.default.rent.rentEngineMediator;
        rentEngineMediator.setupDelegate({checkout: this.checkout});
      }
    }
  },

  checkout: function(data, mediator) {
    let lang = 'es';
    if (typeof data.shoppingCart !== 'undefined' && typeof data.shoppingCart.customer_language !== 'undefined') {
      lang = data.shoppingCart.customer_language;
    }
    if (typeof data.reservationForm !== 'undefined') {
      if (typeof data.reservationForm.with_optional_external_driver !== 'undefined') {
        if (data.reservationForm.with_optional_external_driver == 'true') {
          alert(mybookingClient.rentEngineDelegate.alertText[lang]);
          mediator.stopCheckout();
          return;
        }
      }
    }
    mediator.continueCheckout();
  }

}


jQuery(document).on('ready', function(){
  mybookingClient.rentEngineDelegate.init();
});
</script>