<?php

include "../../root.class.php";
$html = new html();
$html->add_styles_page();

$transaction_id = $_GET['transaction_number'];
$order_id = $_GET['order_id'];

?>

<div class="form_down">
    <h1>DIESEL TRANSACTION</h1>
    <h2><?php echo $order_id; ?></h2>
    <br>
    <h3>STATUS</h3>
    <div id="status_div" style="border: 1px solid #000;width:90%;height:5vh;border-radius:1vw;font-size:2em;padding:1em;"></div>
    <br>
    <h3>AMOUNT</h3>
    <div id="amount_div" style="border: 1px solid #000;width:90%;height:5vh;border-radius:1vw;font-size:2em;padding:1em;"></div>
    <br>
    <button class="submit_btn" onclick="window.location.href='../home.php';">CONTINUE</button>
</div>


<script>
    check_details();
    function check_details() {
        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                var response = JSON.parse(this.responseText);
                document.getElementById("status_div").innerHTML = response['status'];
                document.getElementById("amount_div").innerHTML = (response['amount'] / 1000).toFixed(3) + " L";
              
            }
        };
        xhttp.open("GET", "get_tran_details.ajax.php?transaction_number=<?php echo $transaction_id; ?>", true);
        xhttp.send();
    }

    setInterval(function(){check_details()}, 1000);
</script>
