MasterClass/resources/app/frontoffice/payment.js

var payment = (function($, window) {
  return {
    payButton: null,
    formData: null,

    /**
     * API à appeler après un paiement réussi
     */
    paymentSuccessfulPage: 'payment/success',
    videoPage: 'cours-en-ligne-achat/',
    distancePage: 'atelier-a-distance/',

    /**
     * Initialisation des fonctionnalités de paiement
     */
    init: function()  {
      this.payButton = $('#payButton'); // Adaptez le sélecteur au bouton correct

      // Gestion de l'événement du checkbox d'accord
      $('#checkCondition').on('click', (e) => this.handleOnClickAgreementCheckboxEvent(e));
      this.handleOnClickAgreementCheckboxEvent(); // Lancer à l'initialisation

      // Validation champ par champ avec regex
      $('#civilite').on('input', (e) => this.validateField(e, /^[a-zA-Zéèêàç\s]+$/, 'Veuillez sélectionner une civilité.'));
      $('#name').on('input', (e) => this.validateField(e, /^[A-Za-z\s\-]{2,50}$/, 'Nom invalide (2-50 caractères).'));
      $('#fname').on('input', (e) => this.validateField(e, /^[A-Za-z\s\-]{2,50}$/, 'Prénom invalide (2-50 caractères).'));
      $('#email').on('input', (e) => this.validateField(e, /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/, 'Email invalide.'));
      $('#address').on('input', (e) => this.validateField(e, /^.{5,100}$/, 'Adresse invalide (5-100 caractères).'));
      $('#postal').on('input', (e) => this.validateField(e, /^\d{5}$/, 'Code postal invalide (5 chiffres).'));
      $('#ville').on('input', (e) => this.validateField(e, /^[A-Za-z\s\-]{2,50}$/, 'Ville invalide (2-50 caractères).'));
      $('#telephone').on('input', (e) => this.validateField(e, /^\+?\d{7,15}$/, 'Numéro de téléphone invalide.'));

      // Gestion du bouton "PAYER"
      this.payButton.on('click', (e) => this.handleOnClickPayButtonEvent(e));
    },

    /**
     * Gestion de l'événement du checkbox d'accord
     */
    handleOnClickAgreementCheckboxEvent: function(e) {
      const isChecked = $('#checkCondition').is(':checked');
      const formSection = $('.cpay-section'); // Mise à jour de la section
    
      // if (isChecked) {
      //   this.payButton.prop('disabled', false); // Réactiver avec l'attribut
      //   this.payButton.removeClass('disabled'); // Supprimer la classe CSS
      //   formSection.removeClass('disabled'); // Réactiver la section
      // } else {
      //   // this.payButton.prop('disabled', true); // Désactiver avec l'attribut
      //   // this.payButton.addClass('disabled'); // Ajouter la classe CSS
      //   formSection.addClass('disabled'); // Désactiver la section
      // }
    },
    

    /**
     * Validation champ par champ avec regex
     */
    validateField: function(e, regex, errorMessage) {
      const field = $(e.target);
      const value = field.val().trim();
      const errorSpan = field.closest('.form-row').find('error');

      if (!regex.test(value)) {
        errorSpan.text(errorMessage);
        field.addClass('has-error');
      } else {
        errorSpan.text('');
        field.removeClass('has-error');
      }
    },

    /**
     * Gestion de l'événement du bouton "PAYER"
     */
    handleOnClickPayButtonEvent: async function(e) {
      
      // this.payButton.prop('disabled', true);
      
      // Préparer formData
      this.formData = [...new FormData($('#beneficiaryForm')[0])].reduce((obj, [key, val]) => {
        obj[key] = val.trim() || null;
        return obj;
      }, {});

      // Validation finale avant soumission
      // if (!this.preValidation()) return this.payButton.prop('disabled', false);

      // Soumission
      try {
        const response = await $.ajax({
          url: 'payment/send_payment',
          type: 'POST',
          data: this.formData,
          dataType: 'json', // Ajout pour assurer le format JSON de la réponse
          success: function (data) { 
            if (data.status === 'success') {
              // Deuxième appel AJAX pour l'authentification
              window.location.href = data.redirect;
            } else {
              console.error("Erreur lors de la récupération des informations :", data.message);
            }
          },
          error: function (xhr, status, error) {
            console.error("Erreur lors de la requête AJAX :", error);
            
          }
        });
      } catch (error) {
        console.error('Erreur AJAX:', error);
      }
      
    },

    /**
     * Validation finale avant soumission
     */
    preValidation: function() {
      let isValid = true;

      $('#beneficiaryForm input, #beneficiaryForm select').each((index, element) => {
        const field = $(element);
        if (field.hasClass('has-error') || !field.val().trim()) {
          field.closest('.form-group').find('.error').text('Ce champ est obligatoire.');
          isValid = false;
        }
      });

      return isValid;
    },
  };
})(jQuery, window);

$(document).ready(() => {
  payment.init();
});