<?php
	session_start();
	if($_SESSION['rid'])
	{
		$userid=$_SESSION['rid'];
		include'connection.php';
		include'time.php';
	}
	else
	{
		header('location:../login.php');
	}
	
	$quUsr="select * from retailer where Userid='$userid'";
	$reUsr=mysqli_query($con,$quUsr);
	$dataUsr=mysqli_fetch_array($reUsr);
	$UsrName=$dataUsr['Name'];
	$UsrMobile=$dataUsr['Mobile'];
	$UsrEmail=$dataUsr['Email'];
	$UsrAddress=$dataUsr['Address'];
	$UsrPincode=$dataUsr['Pincode'];
	$UsrBusinessname=$dataUsr['Businessname'];
	$UsrPan=$dataUsr['Pan'];
	$UsrGst=$dataUsr['Gst'];
	$UsrState=$dataUsr['State'];
	$UsrCity=$dataUsr['City'];
?>
<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Payment Request</title>

    <!-- Bootstrap Core CSS -->
    <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">

    <!-- MetisMenu CSS -->
    <link href="vendor/metisMenu/metisMenu.min.css" rel="stylesheet">

    <!-- Custom CSS -->
    <link href="dist/css/sb-admin-2.css" rel="stylesheet">
    <link href="dist/css/my-css-code.css" rel="stylesheet">

    <!-- Morris Charts CSS -->
    <link href="vendor/morrisjs/morris.css" rel="stylesheet">

    <!-- Custom Fonts -->
    <link href="vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
<style>
    .msg-div{background:#f4f4fd; color:; width:400px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); border-radius:10px; text-align:center; 
    border:solid black 5px; z-index:9999; padding:10px;}
    #okIcon{color:green; font-size:100px;}
    #NotokIcon{color:red; font-size:100px;}
    #usrid{display:none;}
    .btnPopup{background:dodgerblue; color:white; font-size:20px; padding:5px 20px;}

	#tbl{width:100%; text-align:center;}
	#tbl th{padding:5px; background:dodgerblue; color:white; text-align:center;}
	#tbl td{padding:5px; text-align:center;}
	#tbl tr:nth-child(odd){background:#f7f8fe;}
	#tbl tr:nth-child(even){background:white; }
	
	@media (max-width: 768px)
	{
		.content{width:100%;}
		.content2{width:100%;}
	}
	
	.input-container {
  display: -ms-flexbox; /* IE10 */
  display: flex;
  width: 100%;
  margin-bottom: 10px;
  line-height:100%;
}

.icon {
  padding: 10px;
  background: dodgerblue;
  color: white;
  min-width: 50px;
  text-align: center;
  font-size:25px;
}

.input-field {
  width: 100%;
  padding: 10px;
  outline: none;
}

.input-field:focus {
  border: 2px solid dodgerblue;
}

/* Set a style for the submit button */
.btnForm {
  background-color: dodgerblue;
  color: white;
  padding: 10px 20px;
  border: none;
  cursor: pointer;
  width: 100%;
  opacity: 0.9;
  font-size:20px;
}

.btnForm:hover {
  opacity: 1;
}

	.content{background:; width:100%; float:left; height:auto;}
	.content1{background:#f1f2f6; float:right; text-align:center; width:100%; padding:15px; border-radius:3px; display:none;}
	.content2{background:#f1f2f6; float:right; text-align:center; width:100%; padding:15px; border-radius:3px;}
	#closeIcon{font-size:50px;}
	.page-header{background:; float:left;}
	
	#addMoney{background:gray; margin:20px; width:auto;}
	#PayHistory{background:gray; margin:20px; width:auto; float:right;}
</style>
<script>
    function showForm()
    {
        var payForm = document.getElementById("payDiv");
        var payHistory = document.getElementById("payHistory");
        payHistory.style.display = "none";
        payForm.style.display = "block";
    }
    
    function showHistory()
    {
        var payForm = document.getElementById("payDiv");
        var payHistory = document.getElementById("payHistory");
        payHistory.style.display = "block";
        payForm.style.display = "none";
    }
</script>
</head>

<body onload="GetBal()">

    <div id="wrapper">
        <!-- Navigation -->
		<?php
			include'navigation.php';
		?>
        <!-- Navigation -->
        <div id="page-wrapper">
            <div class="row">
                <div class="col-lg-12">
                    <button class="btnForm" onclick="showForm()" id="addMoney">Add Money</button>
                    <button class="btnForm" onclick="showHistory()" id="PayHistory">Payment History</button>
                </div>
                <!-- /.col-lg-12 -->
            </div>
            <!-- /.row -->
            <div class="content">
                <input type="text" id="usrid" value="<?php echo $userid; ?>">
				<script>
                            function makePayment()
                            {
                            
                                var usrid = document.getElementById("usrid").value;
        		                    
        		                var amount = document.getElementById("amount").value;
        		                var date = document.getElementById("date").value;
        		                var PayMode = document.getElementById("PayMode").value;
        		                var bank = document.getElementById("bank").value;
        		                var txnNo = document.getElementById("txnNo").value;
        		                var rmark = document.getElementById("rmark").value;
        		                
                            	if (amount<1000)
                                {
        		                    alert("You Can Make Request Of Rs. 1000 Or Above Only !");
        		                }
        		                else if(PayMode=="--Select Payment Mode--")
                                {
                                    alert("Select Payment Mode Please !");
                                }
        		                else if(bank=="--Select Bank--")
                                {
                                    alert("Select Bank Please !");
                                }
        		                else if(amount=="" || date=="" || txnNo=="" )
                                {
                                    alert("Fill All Fields Please !");
                                }
        		                else
        		                {   
        		                    if(confirm('Do You Want Submit The Request?') == true)
        		                    {
                                        var xmlhttp2 = new XMLHttpRequest();
                                        xmlhttp2.open("GET", "ajax_make_payment.php?usrid="+usrid+"&amount="+amount+"&date="+date+"&PayMode="+PayMode+"&bank="+bank+"&txnNo="+txnNo+"&rmark="+rmark, false);
                                        xmlhttp2.send(null);
                                        var result = xmlhttp2.responseText;
                                        document.getElementById("msgDiv").innerHTML = result;
        		                    }
            
                           		}
                            }
                </script>
                <div id="msgDiv"></div>
                <div class="content1" id="payDiv">
					<h2 style="color:dodgerblue;">Make New Payment Request</h2>
					<i class="fa fa-window-close" aria-hidden="true" id="closeIcon"></i>

					<div class="input-container">
						<i class="fa fa-inr icon"></i>
						<input class="input-field" type="number" placeholder="Minimum Amount 1000" id="amount">
					</div>
					<div class="input-container">
						<i class="fa fa-calendar icon"></i>
						<input class="input-field" type="date" placeholder="Payment Date" id="date" value="<?php echo $date; ?>">
					</div>
					<div class="input-container">
						<i class="fa fa-bars icon"></i>
						<select class="input-field" id="PayMode">
							<option>--Select Payment Mode--</option>
							<option>IMPS</option>
							<option>NEFT</option>
							<option>RTGS</option>
							<option>UPI</option>
						</select>
					</div>
					<div class="input-container">
						<i class="fa fa-bank icon"></i>
						<select class="input-field" id="bank">
							<option>--Select Bank--</option>
							<option>UNION BANK OF INDIA</option>
							<option>SYNDICATE BANK</option>
							<option>PUNJAB NATIONAL BANK</option>
							<option>LLPRECHARGE@UBOI</option>
						</select>
					</div>
					<div class="input-container">
						<i class="fa fa-link icon"></i>
						<input class="input-field" type="text" placeholder="Transaction No." id="txnNo">
					</div>
					<div class="input-container">
						<i class="fa fa-envelope icon"></i>
						<textarea class="input-field" placeholder="Remarks" id="rmark"></textarea>
					</div>

					<button type="submit" class="btnForm" onclick="makePayment()">Make Request</button>
                </div>
				<div class="content2" id="payHistory">
					<h2 style="color:dodgerblue;">Recent Payment History</h2>
					<table border="1" cellpadding="10" id="tbl">
						<tr>
							<th>Req.Id</th>
							<th>Date</th>
							<th>Amount</th>
							<th>Transaction No.</th>
							<th>Bank Name</th>
							<th>Response Msg</th>
							<th>Status</th>
						</tr>
						<?php
						    $quHistory="select * from paymentreq where Userid='$userid' order by Id desc limit 10";
						    $reHistory=mysqli_query($con,$quHistory);
						    while($dataHistory=mysqli_fetch_array($reHistory))
						    {   
						        echo "<tr>
							            <td>".$dataHistory['Id']."</td>
							            <td>".$dataHistory['Date']."</td>
							            <td>".$dataHistory['Amount']."</td>
							            <td>".$dataHistory['Txnnumber']."</td>
							            <td>".$dataHistory['Bankname']."</td>
							            <td>".$dataHistory['Responsemsg']."</td>
							            <td>".$dataHistory['Status']."</td>
						            </tr>";
						    }
						?>
					</table>
				</div>
			</div>
            <!-- /.row -->
            
        <!-- /#page-wrapper -->

    </div>
    <!-- /#wrapper -->

    <!-- jQuery -->
    <script src="vendor/jquery/jquery.min.js"></script>

    <!-- Bootstrap Core JavaScript -->
    <script src="vendor/bootstrap/js/bootstrap.min.js"></script>

    <!-- Metis Menu Plugin JavaScript -->
    <script src="vendor/metisMenu/metisMenu.min.js"></script>

    <!-- Morris Charts JavaScript -->
    <script src="vendor/raphael/raphael.min.js"></script>
    <script src="vendor/morrisjs/morris.min.js"></script>
    <script src="data/morris-data.js"></script>

    <!-- Custom Theme JavaScript -->
    <script src="dist/js/sb-admin-2.js"></script>

</body>

</html>
