Éditer test/index.php

Page non trouvée

<?= $this->extend('dashboard/layout') ?>

<?= $this->section('content') ?>

<h1 class="mb-4">TestController - Flow de Paiement</h1>

<form id="paymentForm" onsubmit="return false;" class="mb-3 row g-3">
  <div class="col-md-3">
    <label class="form-label">Montant</label>
    <input type="text" name="amount" value="10" class="form-control">
  </div>

<div class="col-md-3">
    <label class="form-label">Devise</label>
    <select name="currency" class="form-select">
      <option value="USD">USD</option>
      <option value="CDF">CDF</option>
    </select>
  </div>

<div class="col-md-3">
    <label class="form-label">Numéro (Mobile/Illico)</label>
    <input type="text" name="phone_number" placeholder="+243 97..." class="form-control">
  </div>

<div class="col-md-3">
    <label class="form-label">Mode de paiement</label>
    <select name="mode" class="form-select">
      <option value="flexpay">FlexPay (Mobile)</option>
      <option value="illico">Illico Cash</option>
      <option value="card">Carte Bancaire (3DS)</option>
    </select>
  </div>

<div class="col-12">
    <button id="btnPay" class="btn btn-primary">Payer</button>
  </div>
</form>

<pre id="logOutput"></pre>

<div class="modal fade" id="otpModal" tabindex="-1" aria-labelledby="otpModalLabel">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="otpModalLabel">Saisir votre code OTP</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Fermer"></button>
      </div>
      <div class="modal-body">
        <div class="mb-3">
          <label for="otpCode" class="form-label">Code OTP</label>
          <input type="text" class="form-control" id="otpCode" placeholder="Ex: 123456">
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>
        <button type="button" class="btn btn-primary" id="btnConfirmOTP">Confirmer OTP</button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="cardModal" tabindex="-1" aria-labelledby="cardModalLabel">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="cardModalLabel">Payer par Carte</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Fermer"></button>
      </div>
      <div class="modal-body">
        <div class="mb-2">
          <label for="card_number" class="form-label">Numéro de carte</label>
          <input type="text" class="form-control" id="card_number" placeholder="xxxx xxxx xxxx xxxx">
        </div>
        <div class="mb-2 row g-2">
          <div class="col">
            <label for="exp_month" class="form-label">Exp. Mois (MM)</label>
            <input type="text" class="form-control" id="exp_month" placeholder="12">
          </div>
          <div class="col">
            <label for="exp_year" class="form-label">Exp. Année (YY)</label>
            <input type="text" class="form-control" id="exp_year" placeholder="25">
          </div>
        </div>
        <div class="mb-2">
          <label for="cvv" class="form-label">CVV</label>
          <input type="text" class="form-control" id="cvv" placeholder="123">
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>
        <button type="button" class="btn btn-primary" id="btnPayCard">Payer la carte</button>
      </div>
    </div>
  </div>
</div>

// Get form values
        var amount = $('input[name="amount"]').val();
        var phone_number = $('input[name="phone_number"]').val();
        var mode = $('select[name="mode"]').val();
        var currency = $('select[name="currency"]').val();

if (!amount || !phone_number || !mode) {
            alert('Veuillez remplir tous les champs');
            return;
        }

// Disable button and show loading state
        $(this).prop('disabled', true).html('Traitement...');

// Submit payment request.  Placeholder URL - needs to be adjusted based on your CodeIgniter routing.
        $.ajax({
            url: "<?= site_url('Payment/processPayment') ?>", // Adjust this URL
            method: 'POST',
            data: {
                amount: amount,
                phone_number: phone_number,
                mode: mode,
                currency: currency
            },
            success: function(response) {
                //Handle the response - this is a placeholder.  You'll need to parse the response
                //and display appropriate messages based on success or failure.  Consider using
                //JSON responses for better error handling
                $('#logOutput').text(response);
                $('#btnPay').prop('disabled', false).html('Payer');

},
            error: function(xhr, status, error) {
                alert('Une erreur est survenue. Veuillez réessayer. ' + error);
                $('#btnPay').prop('disabled', false).html('Payer');
            }
        });
    });
});
</script>

<?= $this->endSection() ?>

Annuler

Dashboard

Éditer test/index.php

Switcher