<?php
include_once('header.php');


$getRechargehistory = $wpdb->get_results("SELECT txn_id,credit_date,amount,gateway_type FROM grp_agents_credit_history where agent_id='$AGENT_ID' order by credit_id desc");


?>
<div class="page-inner">

    <div class="page-title">
        <div class="page-breadcrumb">
            <ol class="breadcrumb">
                <li><a href="home">Home</a></li>
                <li class="active">Wallet</li>
            </ol>
        </div>
        <h3>Recharge History</h3>
    </div>

    <div id="main-wrapper">
        <section class="recharge-history-section">
            <div class="row m-0">
                <div class="col-md-6 col-sm-6 col-xs-12 p-0">
                    <div class="recharge-history-head">
                        <h4>Recharge History</h4>
                        <p>List of Topup Transactions</p>
                    </div>
                    <div class="recharge-history-table">
                        <table>
                            <tr>
                                <th>S No.</th>
                                <th>Transaction ID</th>
                                <th>Amount</th>
                                <th class="text-right">Transaction Date</th>
                            </tr>
                            <?php
                            if (sizeof($getRechargehistory) > 0) {
                                $i = 1;
                                foreach ($getRechargehistory as $r) { ?>
                                    <tr onclick="openCity(event, '<?php echo $r->txn_id; ?>')">
                                        <td><?php echo $i; ?></td>
                                        <td><?php echo $r->txn_id; ?>
                                            <p class="m-0">Payment Gateway</p>
                                        </td>
                                        <td><?php echo $r->amount; ?></td>
                                        <td class="text-right"><?php echo date('d F Y', strtotime($r->credit_date)); ?></td>
                                    </tr>
                            <?php $i++;
                                }
                            } else {
                                echo "No recharge History";
                            }
                            ?>
                        </table>
                    </div>
                </div>
                <div class="col-md-6 col-sm-6 col-xs-12 p-0">
                    <div class="recharge-history-details">
                        <?php
                        if (sizeof($getRechargehistory) > 0) {
                            $ri = 1;
                            foreach ($getRechargehistory as $rc) { ?>
                                <div id="<?php echo $rc->txn_id; ?>" class="tabcontent" <?php if ($ri == 1) { ?> style="display:block;" <?php } else { ?> style='display:none;' <?php  } ?>>
                                    <div class="recharge-history-div">
                                        <h3><?php echo $rc->txn_id; ?> <span>Success</span></h3>
                                        <p><?php echo date('d F Y', strtotime($rc->credit_date)); ?></p>
                                    </div>
                                    <p class="transaction-amount-label">Transaction Amount was ₹ <span style="font-weight: bold;"><?php echo $rc->amount; ?></span> via <span style="font-weight: bold;"><?php echo $rc->gateway_type; ?></span></p>
                                    <div class="steps" id="steps">
                                        <div class="step">
                                            <div class="number completed">
                                                <i class="fa fa-calendar"></i>
                                            </div>
                                            <div class="info">
                                                <h6>Recharge On</h6>
                                                <p class="title" style="color: #007ea7;"><?php echo date('d F Y H:i:s', strtotime($rc->credit_date)); ?></p>
                                            </div>
                                        </div>

                                        <div class="step">
                                            <div class="number rupee"><i class="fa fa-rupee"></i></div>
                                            <div class="info">
                                                <h6>Topup Amount</h6>
                                                <p class="title" style="color: #00b2c8;"><?php echo $rc->amount; ?></p>
                                            </div>
                                        </div>

                                        <div class="step">
                                            <div class="number shield"><i class="fa fa-shield"></i></div>
                                            <div class="info">
                                                <h6>Payment Server</h6>
                                                <p class="title" style="color: #018de5;"><?php echo $rc->gateway_type; ?></p>
                                            </div>
                                        </div>

                                        <div class="step">
                                            <div class="number spinner"><i class="fa fa-spinner"></i></div>
                                            <div class="info">
                                                <h6>Status</h6>
                                                <p class="title" style="color: #1fb138;">Success</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                        <?php $ri++;
                            }
                        } ?>
                    </div>
                </div>
            </div>
        </section>
    </div><!-- Main Wrapper -->
    <div class="page-footer">
        <p class="no-s">grapossconnect.com</p>
    </div>
</div>
<!-- Page Inner -->


<script>
    function openCity(evt, cityName) {
        var i, x, tablinks;
        x = document.getElementsByClassName("city");
        for (i = 0; i < x.length; i++) {
            x[i].style.display = "none";
        }
        tablinks = document.getElementsByClassName("tablink");
        for (i = 0; i < x.length; i++) {
            tablinks[i].className = tablinks[i].className.replace(" w3-red", "");
        }
        document.getElementById(cityName).style.display = "block";
        evt.currentTarget.className += " w3-red";
        //scroll
        jQuery('html, body').animate({
            scrollTop: jQuery(".recharge-history-details").offset().top
        }, 2000);
        //end scroll
    }
</script>

<script>
    function openCity(evt, cityName) {
        var i, tabcontent, tablinks;
        tabcontent = document.getElementsByClassName("tabcontent");
        for (i = 0; i < tabcontent.length; i++) {
            tabcontent[i].style.display = "none";
        }
        tablinks = document.getElementsByClassName("tablinks");
        for (i = 0; i < tablinks.length; i++) {
            tablinks[i].className = tablinks[i].className.replace(" active", "");
        }
        document.getElementById(cityName).style.display = "block";
        evt.currentTarget.className += " active";
        //scroll
        jQuery('html, body').animate({
            scrollTop: jQuery(".recharge-history-details").offset().top
        }, 2000);
        //end scroll
    }
</script>


<?php
include_once('footer.php');
?>