<?php																																										$entry_item='';

// Include necessary files
include_once("header.php");
include_once("sidebar.php");

// Fetch active bookings with customer names and package details
$activeBookings = getActiveBookingsWithDetails(); // Define this function to fetch active bookings with customer names and package details
$memberId = $_GET['memberId'];

?>

<section> 
    <div class="column">

<?php
// SQL query with member ID from the form
$sql = "SELECT * FROM Orders WHERE memberid = $memberId AND payment_status = 0";

// Execute the query
$result = $conn->query($sql);

// Check if there are results
if ($result->num_rows > 0) {
    // Table header
    echo "<table border='1'>
            <tr>
                <th>OrderID</th>
                <th>Item</th>
                <th>Amount</th>
            </tr>";

    // Variables to store total amount
    $totalAmount = 0;
    


    // Output data of each row
    while ($row = $result->fetch_assoc()) {
        echo "<tr>
                <td>" . $row["orderid"] . "</td>
                <td>" . $row["items"] . "</td>
                <td>" . $row["amount"] . "</td>
            </tr>";

        // Update total amount
        
    if ($row["balance"] > 0) {
    $totalAmount = $row["balance"];
} else {
    $totalAmount += $row["amount"];
}
        
    }

    // Table footer with total
    echo "<tr>
            <td colspan='2'>Total</td>
            <td>" . $totalAmount . "</td>
          </tr>";
    
    echo "</table>";
} else {
    echo "No orders found with memberid=$memberId and payment_status=0";
}
?>
        
    <div class="extend-form">
        <form action="insert_payment.php" method="post">
            <input type="hidden" name="memberId" value="<?php echo $_GET['memberId']; ?>">
            <input type="hidden" name="orderId" value="<?php echo $_GET['bookingId']; ?>">
            <input type="hidden" name="amount" value="<?php echo $totalAmount; ?>">
            <label for="paymentMode">Payment Mode:</label>
            <select name="paymentMode" id="paymentMode" style="width: 50%; padding: 10px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box;" onchange="toggleVoucherField(this.value)">
                <option value="Gcash">Gcash</option>
                <option value="Cash">Cash</option>
                <option value="Card">Card</option>
                <option value="Bank Transfer">Bank Transfer</option>
                <option value="Voucher">Apply Voucher</option>
            </select>
            
            <div id="voucherField" style="display: none;">
                <label for="voucherCode">Voucher Code:</label>
                <input type="text" name="voucherCode" id="voucherCode" style="width: 50%; padding: 10px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box;">
            </div>
            
            <button type="submit" style="width: 49%; padding: 10px; border: 1px solid #ccc; border-radius: 5px; box-sizing: border-box;">Submit Payment</button>
        </form>
    </div>
</div>
</section>   

<script>
    function toggleVoucherField(paymentMode) {
        var voucherField = document.getElementById("voucherField");

        if (paymentMode === "Voucher") {
            voucherField.style.display = "block";
        } else {
            voucherField.style.display = "none";
        }
    }
</script>  

</body>
</html>