

<?php
include('header.php');
if(isset($_GET['txn_status']) && $_GET['txn_status'] =='SUCCESS'){
    ?>
    <script>
            $(function(){
                Swal.fire(
                 'Success',
                        'Recharge Successfull',
                        'success'
                )
            });
        </script>
    <?php
}
if(isset($_GET['txn_status']) && $_GET['txn_status'] =='FAILED'){
    ?>
    <script>
        alert('Recharge Failed!');
    </script>
    <?php
}
if(isset($_GET['txn_status']) && $_GET['txn_status'] =='TXN_FAILED'){
    ?>
    <script>
        alert('Recharge Failed by bank!');
    </script>
    <?php
}
?>

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <title>Payment Form</title>
    <style>
        .payment-form {
            max-width: 1000px;
            margin: auto;
            background: #fff;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 4px 10px rgb(0 0 0 / 80%);
        }

        .payment-form input {
            width: calc(100% - 20px);
            padding: 10px;
            margin: 10px 0;
            border: 1px solid #ccc;
            border-radius: 5px;
        }

        .payment-form button {
            width: 100%;
            padding: 10px;
            background: #28a745;
            color: #fff;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }

        .payment-form button:hover {
            background: #218838;
        }

        .qr-popup {
            display: none;
            position: fixed;
            top: 70px;
            left: 50%;
            transform: translateX(-50%);
            width: 300px;
            background: rgb(255, 255, 255);
            justify-content: center;
            padding: 20px;
            border-radius: 10px;
            text-align: center;
            color: #181818;
            border: 5px solid #28a745;
            /* Add a 5px border with green color */
            box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
            /* Optional: Add a shadow for better styling */
        }

        .qr-popup img {
            max-width: 200px;
            margin: 10px auto;
        }

        .qr-popup button {
            margin-top: 10px;
            padding: 10px;
            background: #dc3545;
            color: #fff;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }
    </style>
</head>

<body>
	<?php
if(isset($_POST['submit'])){
    $user = $_SESSION['userid'];
    $number = $_SESSION['phone'];
    $gmail = $_SESSION['emailid'];
     date_default_timezone_set('Asia/Kolkata');
   $datetime = date('d/m/Y h:i:s a', time());
   $amount = $_POST['remark'];
   $order_id = "" . rand(10000000,99999999);
    $query ="INSERT INTO `onlinepay`(`or id`, `user id`, `amount`, `date_time`) VALUES ('$order_id','$user','$amount','$datetime')";
   $run = mysqli_query($conn ,$query);
   if ($run == TRUE){
       
 ?><form method="post" action="payment/txnProcess.php" name="f1">
 <input type="hidden" id="ORDER_ID" tabindex="1" maxlength="20" size="20"
name="ORDER_ID" autocomplete="off"
                        value="<?php echo $order_id; ?>">
                        <input type="hidden" name="gateway_type" autocomplete="off" value="Robotics">
                        <input type="hidden" name="txnNote" autocomplete="off" value="<?php echo $user; ?>">
                        <input  type="hidden" name="cust_Mobile" autocomplete="off" value="<?php echo $number; ?>">
                        <input  type="hidden" name="cust_Email" autocomplete="off" value="<?php echo $gmail; ?>">
                        <input type="hidden" name="txnAmount"
                        value="<?php echo $amount; ?>">
                       
                       </form> 
                       <script type="text/javascript">
            document.f1.submit();
        </script>
    <?php	

}
}
?> 

    <div class="payment-form">
        <h1>Recharge</h1>
         <form class="user" action="" method="POST">

				  <div class="form-group row">
                  <div class="col-sm-6 mb-3 mb-sm-0">
                    <input required="required" type="text" class="form-control"  placeholder="Amount" name="remark" value="" onkeyup="this.value = this.value.toUpperCase();" onblur="this.value = this.value.toUpperCase();">
                  </div>
                  <br>
                  <div class="col-sm-6 mb-3 mb-sm-0">       
                    <input required="required" type="submit" name="submit" class="btn btn-primary" value="Submit">
                  </div>
				  </div> 
				  
				  
				 </form>
				 
				  <div class="col-lg-2 col-3 bg-info text-center">Note:-&nbsp;</div>        
        <div class="  col-lg-10 col-9 bg-danger">
          <marquee class="marquee" onmouseover="this.stop();" onmouseout="this.start();">
                   Keep some things in mind while recharging                                </marquee>
        </div>
				     <br>
1.
Now online recharge will be done and after payment success, money will automatically come into your wallet. <br>  <br>
2.If you refresh or close the page while recharging, money will not come into the wallet.
<br> <br>
3. Do not close the QR code page while recharging.
<br> <br>


    </div>


    
    <script src="plugins/chart.js/Chart.min.js"></script>
    <!-- Sparkline -->
    <script src="plugins/sparklines/sparkline.js"></script>
    <!-- JQVMap -->
    <script src="plugins/jqvmap/jquery.vmap.min.js"></script>
    <script src="plugins/jqvmap/maps/jquery.vmap.usa.js"></script>
    <!-- jQuery Knob Chart -->
    <script src="plugins/jquery-knob/jquery.knob.min.js"></script>
    <!-- daterangepicker -->
    <script src="plugins/moment/moment.min.js"></script>
    <script src="plugins/daterangepicker/daterangepicker.js"></script>
    <!-- Tempusdominus Bootstrap 4 -->
    <script src="plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js"></script>
    <!-- Summernote -->
    <script src="plugins/summernote/summernote-bs4.min.js"></script>
    <!-- overlayScrollbars -->
    <script src="plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>
    <!-- AdminLTE App -->
    <script src="dist/js/adminlte.js"></script>
    <!-- AdminLTE for demo purposes -->
    <script src="dist/js/demo.js"></script>
    <!-- AdminLTE dashboard demo (This is only for demo purposes) -->
    <script src="dist/js/pages/dashboard.js"></script>

</body>

</html>