<div class="content-wrapper">
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0">
                        <?php echo $pageTitle; ?></h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item">
                            <a href="<?php echo base_url(); ?>">
                                Dashboard</a>
                        </li>
                        <li class="breadcrumb-item active">
                            <?php echo $pageTitle; ?></li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
    <div class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col">
                    <div class="card card-primary card-outline">
                        <div class="card-header">
                            <h5 class="m-0">
                                <?php echo $pageTitle; ?> <a href="<?php echo site_url("accounts/vouchers/" . $VoucherType->voucher_alias . "/create"); ?>" class="btn btn-sm btn-primary float-right">
                                    Create New <?php echo $pageTitle; ?></a></h5>
                        </div>
                        <div class="card-body">
                            <?php $TableData = $Vouchers ?>
                            <table class="table table-bordered table-striped" id="voucherList">
                                <thead>
                                    <tr>
                                        <th>ID#</th>
                                        <th>Voucher No</th>
                                        <th>Voucher Date</th>
                                        <th>Voucher Type</th>
                                        <th>Voucher State</th>
                                        <th class="table-col col-2">Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <?php $a = 0;
                                    foreach ($TableData as $TableRow) : $a++; ?>
                                        <?php foreach ($TableRow as $cols) : $id = $cols;
                                            break;
                                        endforeach; ?><tr data-id="<?php echo $TableRow->voucher_id; ?>" class="<?php echo ($TableRow->voucher_state == "Reversed") ? "table-danger" : ""; ?>">
                                            <td><?php echo $TableRow->voucher_id; ?></td>
                                            <td><?php echo $TableRow->voucher_no; ?></td>
                                            <td><?php echo $TableRow->voucher_date; ?></td>
                                            <td><?php echo $TableRow->voucher_type; ?></td>
                                            <td><?php echo $TableRow->voucher_state; ?></td>
                                            <td class="col-1">
                                                <a onClick="javascript:showDetails(<?php echo $id; ?>);" class="btn btn-success btn-xs" title="View Details">
                                                    <i class="fa fa-eye">
                                                    </i></a>
                                            </td>
                                        </tr>
                                    <?php endforeach; ?>
                                <tbody>
                            </table>
                            <div class="modal fade" id="voucherdetails_box" tabindex="-1" role="dialog" aria-labelledby="voucherdetails_box" aria-hidden="true">
                                <div class="modal-dialog modal-xl" role="document">
                                    <div class="modal-content">
                                        <div class="modal-header">
                                            <h5 class="modal-title" id="exampleModalLabel">
                                                Voucher Details</h5>
                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                <span aria-hidden="true">
                                                    &times;</span>
                                            </button>
                                        </div>
                                        <div class="modal-body" id="details_container">
                                            Voucher Details Goes Here
                                        </div>
                                        <div class="modal-footer">
                                            <button type="button" onClick='reversalEntry()' id="reversalBtn" class="btn btn-secondary" data-dismiss="modal" data-id="">
                                                Revarsal Entry</button>
                                            <button type="button" class="btn btn-secondary" data-dismiss="modal">
                                                Close</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <script>
                                function showDetails(id) {
                                    $.ajax({
                                        url: "<?php echo site_url("accounts/vouchers/voucherdetails/"); ?>" + id,
                                        success: function(data) {
                                            $("#details_container").html(data);
                                            $("#reversalBtn").data("id", id);
                                            $("#voucherdetails_box").modal('show');
                                        }
                                    });
                                }

                                function reversalEntry() {
                                    var id = $("#reversalBtn").data("id");
                                    if (confirm("Are you sure you want to post reversal for this voucher?")) {
                                        window.location = "<?php echo site_url("accounts/vouchers/reversal/"); ?>" + id;
                                    }
                                }
                            </script>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<?php
function footerfunctions()
{
?>
    <script>
        $(document).ready(function() {
            var table = $('#voucherList').DataTable();
            var tableRows = $('table#voucherList tbody').find('tr');
            tableRows.each(function() {
                async: false;
                var jqueryRow = $(this);
                var row = table.row(jqueryRow);
                var id = $(this).data("id");
                var Transactions = "<table class='table table-resonsive'><tr><th>Account<\/th><th>Narration<\/th><th>Dr<\/th><th>Cr<\/th><\/tr><tr><td>Billable Projects<\/td><td>Website Development<\/td><td>50000<\/td><td>0<\/td><\/tr><tr><td>Larke Himal Jadibuti Udhyog<\/td><td>Website Development<\/td><td>0<\/td><td>50000<\/td><\/tr><\/table>";
                Transactions = getVoucherDetails(id);
                row.child(Transactions).show();
            });
        });

        function getVoucherDetails(id) {
            $.data;
            $.ajax({
                url: "<?php echo site_url("ajax/getVoucherDetailsTable/"); ?>" + id,
                async: false,
                success: function(data) {
                    $.data = data;
                }
            });
            return ($.data);
        }
    </script>
<?php
}
?>