<?php include('include/headscript.php'); ?>
<?php include('../../languages/it/generaluserdashboard.php'); ?>
<!doctype html>
<html lang="en">

<head>
    <!-- Required meta tags -->
    <?php include('include/seodashboard.php'); ?>
    <!-- App favicon -->
    <link rel="shortcut icon" href="assets/dist/img/favicon.png">
    <!-- Global Styles(used by all pages) -->
    <link href="assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="assets/plugins/metisMenu/metisMenu.min.css" rel="stylesheet">
    <link href="assets/plugins/fontawesome/css/all.min.css" rel="stylesheet">
    <!-- Third party Styles(used by this page) -->
    <link rel="stylesheet" href="assets/plugins/jquery-fancyfileuploader/fancy-file-uploader/fancy_fileupload.css">
    <!-- App css -->
    <link href="assets/dist/css/app.min.css" rel="stylesheet">
    <!-- Start Your Custom Style Now -->
    <link href="assets/dist/css/style.css" rel="stylesheet">
</head>
<style>
    /* Stile per la modale */
    .qr-modal {
        display: none;
        /* Nascosto per impostazione predefinita */
        position: fixed;
        z-index: 1000;
        /* In primo piano */
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.5);
        /* Sfondo scuro semi-trasparente */
        justify-content: center;
        align-items: center;
    }

    .qr-modal-content {
        background-color: #fff;
        padding: 20px;
        border-radius: 8px;
        text-align: center;
        width: 300px;
    }

    .qr-close {
        position: absolute;
        top: 10px;
        right: 20px;
        font-size: 24px;
        cursor: pointer;
    }

    #qrCodeContainer {
        margin: 20px auto;
    }
</style>

<body class="fixed sidebar-mini">
    <div class="wrapper">
        <!-- Sidebar  -->
        <?php include('include/leftnavbar.php'); ?>
        <!-- Page Content  -->
        <div class="content-wrapper">
            <div class="main-content">
                <!-- Star navbar -->

                <!-- End /. search -->
                <?php include('include/topbar.php'); ?>


                <!-- End /. navbar -->
                <div class="body-content">
                    <div class="decoration blur-2"></div>
                    <div class="decoration blur-3"></div>
                    <div class="container-xxl">
                        <div class="card">
                            <div class="card-header position-relative">
                                <div class="d-flex justify-content-between align-items-center flex-wrap">
                                    <div>
                                        <h6 class="fs-17 fw-semi-bold my-1"><?php echo $orderstitle; ?></h6>
                                        <p class="mb-0"><?php echo $ordersexplain; ?></p>
                                    </div>
                                    <div class="text-end">
                                        <a href="../index.php" class="btn btn-primary fw-medium"><i class="fa-solid fa-plus me-1"></i><?php echo $bookanotherlesson; ?></a>
                                    </div>
                                </div>
                            </div>
                            <div class="card-body">
                                <div class="table-responsive">
                                    <table class="table table-striped table-borderless category-list">
                                        <thead>
                                            <tr>
                                                <th>Order No.</th>
                                                <th>Product</th>
                                                <th>School</th>
                                                <th>Date</th>
                                                <th>Quantity</th>
                                                <th>Unit Price</th>
                                                <th>Total Price</th>
                                                <th>Status</th>
                                                <th>QR Code</th> <!-- Colonna per il QR Code -->
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <?php
                                            $conn = new mysqli($servername, $username, $password, $database);
                                            // Query per ottenere gli ordini dell'utente
                                            $query = "
        SELECT 
            o.order_id,
            o.order_number, 
            o.order_date, 
            oi.quantity, 
            oi.unit_price, 
            p.product_name, 
            p.product_id,  /* Aggiunto l'ID del prodotto */
            ys.nameschool, 
            o.stripe_status,  /* Lo stato del pagamento su Stripe */
            o.stripe_payment_id,  /* Aggiunto lo stripe_payment_id */
            o.total_amount, 
            o.currency,
            oi.presence_date  /* Aggiunta la presence_date */
        FROM 
            orders o
        JOIN 
            order_items oi ON o.order_id = oi.order_id
        JOIN 
            products p ON oi.product_id = p.product_id
        JOIN 
            yogaschool ys ON oi.idyogaschool = ys.idyogaschool
        WHERE 
            o.iduser = $iduserlogin
        ORDER BY 
            o.order_date DESC";

                                            $result = $conn->query($query);

                                            if ($result->num_rows > 0) {
                                                while ($row = $result->fetch_assoc()) {
                                                    // Creazione di un ID unico per il QR code per ciascuna riga
                                                    $qrId = 'qrcode_' . $row['order_id'];
                                                    echo "<tr>";
                                                    echo "<td>{$row['order_number']}</td>";
                                                    echo "<td>{$row['product_name']}</td>";
                                                    echo "<td>{$row['nameschool']}</td>";
                                                    echo "<td>" . date('d-m-Y', strtotime($row['order_date'])) . "</td>";
                                                    echo "<td>{$row['quantity']}</td>";
                                                    echo "<td>{$row['unit_price']} {$row['currency']}</td>";
                                                    echo "<td>" . number_format($row['quantity'] * $row['unit_price'], 2) . " {$row['currency']}</td>";
                                                    echo "<td>{$row['stripe_status']}</td>";
                                                    echo "<td>";

                                                    // Mostra il pulsante "Mostra QR Code" solo per gli ordini con stato "succeeded"
                                                    if ($row['stripe_status'] == 'succeeded') {
                                                        echo "<button class='btn btn-primary btn-sm generate-qr' 
                        data-orderid='{$row['order_id']}' 
                        data-productid='{$row['product_id']}' 
                        data-presencedate='{$row['presence_date']}' 
                        data-stripeid='{$row['stripe_payment_id']}'>
                        Mostra QR Code</button>";
                                                    } else {
                                                        echo "Non disponibile";  // Messaggio per ordini non completati
                                                    }

                                                    echo "<div id='{$qrId}' class='mt-2'></div>";  // Div per il QR code
                                                    echo "</td>";
                                                    echo "</tr>";
                                                }
                                            } else {
                                                echo "<tr><td colspan='9'>No orders found.</td></tr>";
                                            }
                                            ?>
                                        </tbody>
                                    </table>
                                </div>
                            </div>

                            <div id="qrModal" class="qr-modal">
                                <div class="qr-modal-content">
                                    <span class="qr-close">&times;</span>
                                    <div id="qrCodeContainer"></div> <!-- Questo è il contenitore per il QR Code -->
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
                <!--/.body content-->
            </div>
            <!--/.main content-->
            <footer class="footer-content">
                <div class="align-items-center d-flex footer-text gap-3 justify-content-between">
                    <div class="copy">© 2022 ListOn - All Rights Reserved</div>
                    <div class="credit">Developed by: <a href="#">ListOn</a> 🌺💚</div>
                </div>
            </footer>
            <!--/.footer content-->
            <div class="overlay"></div>
        </div>
        <!--/.wrapper-->
    </div>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>



    <script>
        $(document).ready(function() {
            // Aggiungi l'evento click su tutti i pulsanti con la classe generate-qr
            $('.generate-qr').on('click', function() {
                // Recupera i dati dall'attributo data-*
                var productId = $(this).data('productid'); // ID del prodotto
                var presenceDate = $(this).data('presencedate'); // Data e ora della prenotazione
                var stripePaymentId = $(this).data('stripeid'); // ID di Stripe (conferma ordine)
                var idUser = "<?php echo $iduserlogin; ?>"; // ID dell'utente loggato

                // Crea il contenuto del QR code concatenando i codici
                var qrContent = idUser + "-" + productId + "-" + presenceDate + "-" + stripePaymentId;

                // Apri la modale
                var modal = $('#qrModal');
                modal.css('display', 'flex'); // Mostra la modale

                // Rimuove il QR code precedente se esiste
                $('#qrCodeContainer').empty();

                // Genera il QR code nel contenitore della modale
                new QRCode(document.getElementById('qrCodeContainer'), {
                    text: qrContent,
                    width: 200,
                    height: 200
                });
            });

            // Chiusura della modale cliccando sulla "X"
            $('.qr-close').on('click', function() {
                $('#qrModal').css('display', 'none'); // Nasconde la modale
            });

            // Chiusura della modale cliccando fuori dal contenuto
            $(window).on('click', function(event) {
                var modal = $('#qrModal');
                if (event.target == modal[0]) {
                    modal.css('display', 'none'); // Nasconde la modale
                }
            });
        });
    </script>




    <!-- Global script(used by all pages) -->
    <script src="assets/plugins/jQuery/jquery.min.js"></script>
    <script src="assets/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
    <script src="assets/plugins/metisMenu/metisMenu.min.js"></script>
    <script src="assets/plugins/perfect-scrollbar/perfect-scrollbar.min.js"></script>
    <!-- Third Party Scripts(used by this page) -->

    <!-- Page Scripts(used by all page) -->
    <script src="assets/dist/js/app.min.js"></script>
    <!-- Page Active Scripts(used by this page) -->
    <script src="assets/dist/js/dashboard.js"></script>
</body>

</html>