<?php $__env->startSection('navbar'); ?>

<!-- [ Main Content ] start -->
<div class="pcoded-main-container">
    <div class="pcoded-content">
        <!-- [ breadcrumb ] start -->
        <div class="page-header">
            <div class="page-block">
                <div class="row align-items-center">
                    <div class="col-md-12">
                        <div class="page-header-title">
                            <h5 class="m-b-10">Page de Paiement</h5>
                        </div>
                        <ul class="breadcrumb">
                            <li class="breadcrumb-item"><a href="<?php echo e(route('home')); ?>"><i class="feather icon-home"></i></a></li>
                            <li class="breadcrumb-item"><a href="<?php echo e(route('home')); ?>">Tableau de bord</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <!-- [ breadcrumb ] end -->
        <!-- [ Main Content ] start -->
        <div class="row justify-content-center align-items-center">

            <!-- [ sample-page ] start -->
            <div class="col-sm-12">
                <div class="card">

                    <div class="card-header">
                        <h5>Service de paiement waxu</h5>
                        <div class="card-header-right">
                            <div class="btn-group card-option">
                                <button type="button" class="btn dropdown-toggle btn-icon" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                    <i class="feather icon-more-horizontal"></i>
                                </button>
                                <ul class="list-unstyled card-option dropdown-menu dropdown-menu-right">
                                    <li class="dropdown-item full-card"><a href="#!"><span><i class="feather icon-maximize"></i> maximize</span><span style="display:none"><i class="feather icon-minimize"></i> Restore</span></a></li>
                                    <li class="dropdown-item minimize-card"><a href="#!"><span><i class="feather icon-minus"></i> collapse</span><span style="display:none"><i class="feather icon-plus"></i> expand</span></a></li>
                                    <li class="dropdown-item reload-card"><a href="#!"><i class="feather icon-refresh-cw"></i> reload</a></li>
                                    <li class="dropdown-item close-card"><a href="#!"><i class="feather icon-trash"></i> remove</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="card-body text-center">
                    <div class=" fs-1">Demande : <?php echo e($result->billNo); ?></div>
                        <div class="d-flex justify-content-center">
                            <img src="<?php echo e(asset('assets/dist/img/waxu.png')); ?>" width="300" class="img-fluid logo" alt="Logo">
                        </div>
                        <div type="submit" id="submitbtn" class="btn btn-lg w-30 mt-3" style="background-color:#006FAF; color:#ffff;"> Payer les frais de service</div>
                    </div>
                </div>
            </div>
            <!-- [ sample-page ] end -->
            <!-- table card-1 start -->
        </div>
        <!-- [ Main Content ] end -->
    </div>
</div>
<!-- [ Main Content ] end -->
<?php $__env->stopSection(); ?>

<?php $__env->startSection('script'); ?>
<script>
    // Définir des variables globales pour stocker les données
    var globalAmount, globalBillNo, globalCurrency, globalService, globalWaxuApiKey;

    // Fonction pour exécuter l'appel AJAX
function executeAjaxRequest() {
    var csrfToken = $('meta[name="csrf-token"]').attr('content'); // Récupérer le jeton CSRF

    $.ajax({
        url: 'https://api.waxuapp.com',
        method: 'POST',
        data: {
            action: 'getStatus',
            billNo: globalBillNo,
            service: globalService,
            amount: globalAmount,
            currency: globalCurrency,
            waxuapikey: globalWaxuApiKey
        },
        success: function(response) {
            //console.log(response); // Traitement de la réponse réussie

            // Vérifier le statut retourné
            var status = response.status;
            if (status === "PENDING") {
                // Continuer l'exécution toutes les 10 secondes
                //console.log("Le statut est PENDING, continuera à exécuter chaque 10 secondes.");
            } else if (status === "PAID") {
                // Arrêter l'exécution périodique et lancer une nouvelle requête AJAX POST
                //console.log("Le statut est PAID, arrêt de l'exécution périodique.");

                clearInterval(intervalID); // Arrêter l'exécution périodique

                // Lancer une nouvelle requête AJAX POST
                $.ajax({
                    url: '<?php echo e(route('paiement.store')); ?>',
                    method: 'POST',
                    data: {
                        _token: csrfToken, // Ajouter le jeton CSRF dans les données

                    },
                    success: function(response) {
                       // console.log("Requête POST réussie:", response);
                    },
                    error: function(xhr, status, error) {
                        console.error('La requête POST a échoué avec le statut : ' + status);
                    }
                });
                 window.location.href = '<?php echo e(route('Creation+cv+client.index')); ?>';
            } else if (status === "EXPIRED") {
                // Arrêter l'exécution périodique
                console.log("Le statut est EXPIRED, arrêt de l'exécution périodique.");
                clearInterval(intervalID);
            }
        },
        error: function(xhr, status, error) {
            console.error('La requête a échoué avec le statut : ' + status); // Gestion des erreurs
        }
    });
}

    // Fonction pour ouvrir le widget Waxu avec les paramètres nécessaires
    function openWaxuWithParams(billNo, amount, service, currency, waxuapikey) {
        // Appeler openwaxu avec les paramètres nécessaires
        openwaxu(billNo, amount, currency, service, waxuapikey);
    }

    // Fonction pour exécuter l'appel AJAX et ouvrir le widget Waxu
    function executeAjaxAndOpenWaxu() {
        $.ajax({
            url: '<?php echo e(route('paiement.create')); ?>',
            type: 'GET',
            dataType: 'json',
            success: function(response) {
                // Accéder aux données JSON et les stocker dans des variables globales
                globalAmount = response.amount;
                globalBillNo = response.billNo;
                globalCurrency = response.currency;
                globalService = response.service;
                globalWaxuApiKey = response.waxuapikey;

                // Appeler la fonction pour ouvrir le widget Waxu avec les paramètres nécessaires
                openWaxuWithParams(globalBillNo, globalAmount, globalService, globalCurrency, globalWaxuApiKey);

                // Exécuter l'appel AJAX toutes les 10 secondes après avoir obtenu les données
                intervalID = setInterval(executeAjaxRequest, 10000); // 10000 millisecondes = 10 secondes
            },
            error: function(xhr, status, error) {
                console.error(error);
            }
        });
    }

    // Attacher la fonction executeAjaxAndOpenWaxu au clic sur le bouton
    document.getElementById("submitbtn").addEventListener("click", executeAjaxAndOpenWaxu);
</script>



<?php $__env->stopSection(); ?>

<?php echo $__env->make('Client.layouts.navbar', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH C:\Users\damal\Downloads\Takaback\resources\views/Client/paiementPage.blade.php ENDPATH**/ ?>