@extends('layouts.main')
@section('title')
    Journal Vouchers
@stop
@section('navigation')
    <ul class="breadcrumb">
        <li><a href="{{route('home')}}">Dashboard</a> <span class="divider">/</span></li>
        <li><a href="">Account Managements</a> <span class="divider">/</span></li>
        <li><a href="">Cash Books</a> <span class="divider">/</span></li>
        <li class="active">Journal Vouchers</li>
    </ul>
@stop
@section('msghead_menu')
    <li class="right btn-group"></li>

    <li class="right btn-group">
        <div class="btn-group">
            {{--            <button class="btn" style="margin-right: 2px" onclick="createOrEdit('{{route('journal_vouchers.loan_recovery.create')}}')">--}}
            {{--                <span class="iconsweets-create"></span> &nbsp; LOAN RECOVERY--}}
            {{--            </button>--}}
            <button class="btn" style="margin-right: 2px"
                    onclick="createOrEdit('{{route('journal_vouchers.create')}}')">
                <span class="iconsweets-create"></span> &nbsp; NEW JOURNAL
            </button>
            <button class="btn" style="margin-right: 2px"
                    onclick="createOrEdit('{{route('journal_vouchers.notes.create')}}')">
                <span class="iconsweets-create"></span> &nbsp; NOTES
            </button>
            <button class="btn" style="margin-right: 2px" onclick="openAdvancedSearch('journal_voucher_search')">
                <span class="icon-search"></span> &nbsp; FILTER
            </button>

        </div><!--btn-group-->
    </li>
@stop
@section('contentinner')
    <style>
        table tbody td .number {
            text-align: right;
        }

        td.details-control {
            background: url('{{ URL::asset('img/details_open.png') }}') no-repeat center center;
            cursor: pointer;
        }

        tr.details td.details-control {
            background: url('{{ URL::asset('img/details_close.png') }}') no-repeat center center;
        }
    </style>
    <div id="journal_voucher_search" class="sidenav">
        <a href="javascript:void(0)" class="closebtn"
           onclick="closeAdvancedSearch('journal_voucher_search')">&times;</a>


        <form target="_blank" class="form-inline form-filter" method="get"
              action="#">

            <label class="control-label" for="Category">JV #</label>
            <input name="journal_voucher_id" id="journal_voucher_id" class="span12">

            <label class="control-label" for="Category">Date</label>
            <input name="transaction_date" id="transaction_date" class="span12" autocomplete="off">

            <label class="control-label" for="Category">GRN</label>
            <input name="grn_id" id="grn_id" class="span12" autocomplete="off">


            <label class="control-label" for="Category">Account </label>
            <select name="account_id" width="100%" id="account_id" class="searchable_select">
                <option value="ALL">All</option>
                @foreach($accounts as $account)
                    <option value="{{$account->id}}">{{$account->name}}</option>
                @endforeach
            </select>


            <button class="btn" style="" id="filter_journal_voucher">FILTER</button>
            {{--<input class="btn" id="print_permits" type="submit" value="PRINT">--}}
        </form>


    </div>
    <div class="row-fluid">
        <div class="span12">
            <table class="table table-bordered table-condensed logistics_table" id="journal-vouchers-list-1">
                <thead>
                <tr>
                    <th style="width:3%"><input type="checkbox" class="checkall"/></th>
                    <th style="width: 3%">MORE</th>
                    <th style="width: 4%">JNVNO.</th>

                    <th style="width: 10%">Date</th>
                    <th style="width: 10%">Ref Number</th>
                    <th style="width: 10%">Exchange Rate</th>
                    <th style="width: 15%">Amount</th>
                    <th style="width: 40%">Remarks</th>
                    <th style="width: 5%">Action</th>
                </tr>
                </thead>
            </table>
        </div><!--span12-->
    </div><!--row-fluid-->
    <form method="post" id="attachment_form" enctype="multipart/form-data" style="display:none">
        <input type="file" name="file">
    </form>

    <script type="text/javascript" src="{{asset('js/logistics/logistics-accounts.js')}}"></script>
    <script>
        $('#transaction_date').datepicker();
        $('.searchable_select').select2();
        var attachment_form = $('#attachment_form');
        var file_field = attachment_form.find('input:file');

        function uploadJournalVoucherPrintout(url) {
            attachment_form.attr('action', url);
            file_field.trigger('click');
            file_field.change(function () {
                if (file_field.val()) {
                    $.ajax({
                        url: attachment_form.attr('action'),
                        data: new FormData($("#attachment_form")[0]),
                        dataType: 'json',
                        async: false,
                        type: 'post',
                        processData: false,
                        contentType: false,
                        beforeSend: function () {
                            startSpinner()
                        },
                        success: function (data) {
                            onAjaxSuccess(data);
                            if (data.state == 'Done') mainDataTable.draw();
                        },
                        error: function (xhr, textStatus, error) {
                            onAjaxError(xhr, textStatus, error)
                        },
                        complete: function () {
                            stopSpinner();
                            file_field.val(null)
                        }
                    });
                }
            });
        }


        var mainDataTable = jQuery('#journal-vouchers-list-1').DataTable({
            "oLanguage": {
                "sLoadingRecords": "Please wait - loading Journal Voucher...",
                "sZeroRecords": "No Journal Voucher to Display.",
                "sInfoEmpty": "No entries to display."
            },
            ajax: {
                url: '{{route('vouchers.data-table.journals')}}',
                data: function (d) {
                    d.journal_voucher_id = jQuery('#journal_voucher_id').val();
                    d.account_id = jQuery('#account_id').val();
                    d.transaction_date = jQuery('#transaction_date').val();
                    d.grn_id = jQuery('#grn_id').val();
                },
                error: function (xhr, textStatus, error) {
                    if (textStatus === 'timeout') {
                        alert('Timeout error. The server took too long to send back the data.\nPlease try again.');
                    }
                    mainDataTable.fnProcessingIndicator(false);
                }
            },
            scrollCollapse: true,
            "sPaginationType": "full_numbers",
            processing: true,
            serverSide: true,
            // "order": [[ 2, "desc" ]],
            // "aoColumnDefs": [{
            //     "aTargets": [6],
            //     "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
            //         jQuery(nTd).css('text-align', 'right');
            //         if ((sData == 0.00)) {
            //             jQuery(nTd).addClass('highlight-red')
            //         }
            //     }
            // }],

            // "fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
            //     if ( aData[2] == "5" )
            //     {
            //         $('td', nRow).css('background-color', 'Red');
            //     }
            // },
            "columns": [
                {data: 'checkbox'},
                {
                    "class": "details-control",
                    "orderable": false,
                    "data": null,
                    "defaultContent": ""
                },
                {"class": "link", data: 'journal_number'},
                {"class": "link", data: 'date'},
                {"class": "link", data: 'reference_number'},
                {"class": "link number", data: 'exchange_rate'},
                {"class": "link", data: 'amount'},
                {"class": "link number", data: 'descriptions'},
                {data: 'action'}
            ],
            "bStateSave": true
        });

        function format(d) {
            return d.journal_voucher_details;
        }


        $('#filter_journal_voucher').on('click', function (e) {
            e.preventDefault();
            mainDataTable.draw();
        });
        // Array to track the ids of the details displayed rows
        var payment_voucher_more = [];

        jQuery('#journal-vouchers-list-1 tbody').on('click', 'tr td.details-control', function () {

            var tr = jQuery(this).closest('tr');
            var row = mainDataTable.row(tr);
            var idx = jQuery.inArray(tr.attr('id'), payment_voucher_more);

            if (row.child.isShown()) {
                tr.removeClass('details');
                row.child.hide();

                // Remove from the 'open' array
                payment_voucher_more.splice(idx, 1);
            } else {
                tr.addClass('details');
                row.child(format(row.data())).show();

                // Add to the 'open' array
                if (idx === -1) {
                    payment_voucher_more.push(tr.attr('id'));
                }
            }
        });


        pupulate();

        function pupulate() {
            jQuery('.payment-voucher-amount').keyup(function (event) {
                // skip for arrow keys
                if (event.which >= 37 && event.which <= 40) return;
                jQuery(this).val(function (index, value) {
                    return value.replace(/\D/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
                });
            });
        }


        jQuery('#add_vendor_grn').on('click', function () {
            if (jQuery('#vendor_cr_account_id').val() != 'NONE') {
                jQuery('#vendor_goods_received_notes').appendTo("body").modal({show: true})
            } else {
                alert('SELECT THE VALID VENDOR ACCOUNT');
            }
        });


        jQuery('#vendor_cr_account_id').on('change', function () {
            getGoodReceivedNote();
        });

        getGoodReceivedNote();

        function getGoodReceivedNote() {
            if (jQuery('#vendor_cr_account_id').val() != 'NONE') {
                var vendor_cr_account_id = jQuery('#vendor_cr_account_id').val();
                var good_receive_note_id = [];
                jQuery('.good_receive_note_id').each(function () {
                    good_receive_note_id.push(jQuery(this).val());
                });

                jQuery.ajax({
                    type: "GET",
                    url: "{{route('journal_vouchers.create')}}",
                    data: {
                        vendor_debited_account_id: vendor_cr_account_id,
                        good_receive_note_id: good_receive_note_id,
                    },
                    success: function (data) {
                        jQuery('#added_vendor_grn').empty().append(data);
                        jQuery('.goods_received_note_id').on('change', function () {
                            var table = jQuery(this).parent().parent();

                            var amount = table.find('.amount');
                            var payable = table.find('.payable');
                            var disabled_field = table.find('.disabled_field');
                            disabled_field.each(function () {
                                jQuery(this).removeAttr('disabled');
                            });
//                        var outstanding_amount = table.find('.outstanding_amount');
                            if (this.checked) {
                                payable.val(amount.val());
                            } else {
                                payable.val('');
                                disabled_field.val('');
                                disabled_field.attr({'disabled': 'disabled'});
                            }
                        });

                        jQuery('.discount_amount').on('keyup', function () {
                            var tr = jQuery(this).closest('tr');
                            var payable = tr.find('.payable');
                            var amount = tr.find('.amount').val();
                            var discount_amount = jQuery(this).val();
                            var discount_percent = tr.find('.discount_percent');

                            discount_percent.val(((discount_amount / amount) * 100));
                            payable.val((amount - discount_amount).toLocaleString());

                            getOverAllAmount();
                        });

                        jQuery('.discount_percent').on('keyup', function () {
                            var tr = jQuery(this).closest('tr');
                            var payable = tr.find('.payable');
                            var amount = tr.find('.amount').val();
                            var discount_amount = tr.find('.discount_amount');
                            var discount_percent = jQuery(this).val();


                            discount_amount.val((discount_percent * amount * 0.01));
                            payable.val((amount - (discount_percent * amount * 0.01)).toLocaleString());
                            getOverAllAmount();
                        });

                        jQuery(".remove_good_received_note_from_payment").on('click', function () {
                            jQuery(this).parents('tr').remove();
                        });
                    },
                    error: function (data) {

                    }
                });
            }
        }


        function getOverAllAmount() {
            var over_all_amount = 0;
            jQuery('.payable').each(function () {
                var amount = jQuery(this).val();
                if (amount > 0) {
                    over_all_amount += parseInt(removeComma(jQuery(this).val()));
                }
            });
            jQuery('.over_all_amount').val(over_all_amount.toLocaleString());
        }

        jQuery('#vendor_goods_received_note_edit').click(function () {
            if (jQuery('#vendor_credit_account_edit').val() != 'NONE') {
                jQuery('#vendor_goods_received_notes_edit').appendTo("body").modal({
                    show: true
                })
            } else {
                alert('SELECT THE VALID VENDOR ACCOUNT');
            }
        });

        function getGrnEdit() {
            var cr_account_id = jQuery('#vendor_credit_account_edit').val();
            var journal_voucher_id = jQuery('#journal_voucher_id').val();

            jQuery.ajax({
                type: "GET",
                url: "{{route('journal-vouchers.goods-received-notes.edit')}}",
                data: {
                    cr_account_id: cr_account_id,
                    journal_voucher_id: journal_voucher_id
                },
                success: function (data) {
                    jQuery('#grn_selection_option_edit').empty().append(data);

                    jQuery('.edit_goods_received_note_id').on('change', function () {
                        var table = jQuery(this).parent().parent();

                        var amount = table.find('.amount');
                        var payable = table.find('.payable');
                        var disabled_field = table.find('.disabled_field');
                        disabled_field.each(function () {
                            jQuery(this).removeAttr('disabled');
                        });
//                        var outstanding_amount = table.find('.outstanding_amount');
                        if (this.checked) {
                            payable.val(amount.val());
                        } else {
                            payable.val('');
                            disabled_field.val('');
                            disabled_field.attr({'disabled': 'disabled'});
                        }
                    });

                    jQuery('.discount_amount').on('keyup', function () {
                        var tr = jQuery(this).closest('tr');
                        var payable = tr.find('.payable');
                        var amount = removeComma(tr.find('.amount').val());
                        var discount_amount = removeComma(jQuery(this).val());
                        var discount_percent = tr.find('.discount_percent');

                        discount_percent.val(((discount_amount / amount) * 100));
                        payable.val((amount - discount_amount).toLocaleString());

                        getOverAllAmount();
                    });

                    jQuery('.discount_percent').on('keyup', function () {
                        var tr = jQuery(this).closest('tr');
                        var payable = tr.find('.payable');
                        var amount = removeComma(tr.find('.amount').val());
                        var discount_amount = tr.find('.discount_amount');
                        var discount_percent = jQuery(this).val();


                        discount_amount.val((discount_percent * amount * 0.01).toLocaleString());
                        payable.val((amount - (discount_percent * amount * 0.01)).toLocaleString());
                        getOverAllAmount();
                    });
                },
                error: function (data) {

                }
            });
        }

        jQuery('#vendor_goods_received_notes_edit').on('hidden.bs.modal', function (e) {
            var invoice_amount = [], text = '', grn_amount_total = 0, grn_amount_before_discount_total = 0,
                grn_discount_amount_total = 0, i = 1;

            jQuery('.edit_goods_received_note_id').each(function () {
                if (jQuery(this).is(':checked')) {
                    var table = jQuery(this).parent().parent();
                    var payable = table.find('.payable');
                    var journal_voucher_item_id = table.find('.journal_voucher_item_id');
                    var journal_voucher_item_description_id = table.find('.journal_voucher_item_description_id');
                    var amount = table.find('.amount');
                    var currency = table.find('.currency');
                    var discount_amount = table.find('.discount_amount');
                    var discount_percent = table.find('.discount_percent');
                    var dr_account_id = table.find('.dr_account_id');
                    text += "<tr>" +
                        "<td>" + i + "</td>" +
                        "<td><input type='hidden' name='goods_received_note_id[]' value='" + jQuery(this).val() + "'> GRN " + jQuery(this).val() + "</td>" +
                        "<td><input type='hidden' name='currency[]' value='" + currency.val() + "'>" + currency.val() + "</td>" +
                        "<td>" +
                        "<input type='hidden' name='journal_voucher_item_id[]' value='" + journal_voucher_item_id.val() + "'>" +
                        "<input type='hidden' name='journal_voucher_item_description_id[]' value='" + journal_voucher_item_description_id.val() + "'>" +
                        "<input type='hidden' name='dr_account_id[]' value='" + dr_account_id.val() + "'>" +
                        "<input type='hidden' name='journal_voucher_item_description_type[]' value='GRN'>" +
                        "<input type='hidden' name='amount[]' value='" + payable.val() + "'>" + amount.val() + "</td>" +
                        "<td><input type='hidden' name='discount_amount[]' value='" + discount_amount.val() + "'>" + discount_amount.val() + "</td>" +
                        "<td><input type='hidden' name='discount_percent[]' value='" + discount_percent.val() + "'>" + discount_percent.val() + "</td>" +
                        "<td style='text-align: right'>" + payable.val() + "</td>" +
                        "</tr>";
                    grn_amount_total += parseFloat(removeComma(payable.val()));
                    grn_amount_before_discount_total += parseFloat(removeComma(amount.val()));
                    grn_discount_amount_total += parseFloat(removeComma(discount_amount.val()));
                    i += 1;
                }
            });

            text += "<tr>" +
                "<td colspan='6' style='text-align: right'>GRNs AMOUNT</td>" +
                "<td style='text-align: right'>" + grn_amount_before_discount_total.toLocaleString() + "</td>" +
                "</tr>";
            text += "<tr>" +
                "<td colspan='6' style='text-align: right'>DISCOUNT AMOUNT</td>" +
                "<td style='text-align: right'>" + grn_discount_amount_total.toLocaleString() + "</td>" +
                "</tr>";
            text += "<tr>" +
                "<td colspan='6' style='text-align: right'>PAYABLE AMOUNT</td>" +
                "<td style='text-align: right'>" + grn_amount_total.toLocaleString() + "</td>" +
                "</tr>";

            if (grn_amount_total > 0) {
                jQuery('#selected_vendor_grn_edit').empty().append(text);
            }
        })
        jQuery('#vendor_goods_received_notes').on('hidden.bs.modal', function (e) {
            var invoice_amount = [], text = '', grn_amount_total = 0, grn_amount_before_discount_total = 0,
                grn_discount_amount_total = 0, i = 1;

            jQuery('.goods_received_note_id').each(function () {
                if (jQuery(this).is(':checked')) {
                    var table = jQuery(this).parent().parent();
                    var payable = table.find('.payable');
                    var amount = table.find('.amount');
                    var currency = table.find('.currency');
                    var discount_amount = table.find('.discount_amount');
                    var discount_percent = table.find('.discount_percent');
                    var dr_account_id = table.find('.dr_account_id');
                    text += "<tr>" +
                        "<td>" + i + "</td>" +
                        "<td><input type='hidden' name='invoice_id[]' value='" + jQuery(this).val() + "'> GRN " + jQuery(this).val() + "</td>" +
                        "<td><input type='hidden' name='currency[]' value='" + currency.val() + "'>" + currency.val() + "</td>" +
                        "<td>" +
                        "<input type='hidden' name='dr_account_id[]' value='" + dr_account_id.val() + "'>" +
                        "<input type='hidden' name='journal_voucher_item_description_type[]' value='GRN'>" +
                        "<input type='hidden' name='journal_voucher_item_description_id[]' value='" + jQuery(this).val() + "'>" +
                        "<input type='hidden' name='amount[]' value='" + payable.val() + "'>" + amount.val() + "</td>" +
                        "<td><input type='hidden' name='discount_amount[]' value='" + discount_amount.val() + "'>" + discount_amount.val() + "</td>" +
                        "<td><input type='hidden' name='discount_percent[]' value='" + discount_percent.val() + "'>" + discount_percent.val() + "</td>" +
                        "<td style='text-align: right'>" + payable.val() + "</td>" +
                        "</tr>";
                    grn_amount_total += parseFloat(removeComma(payable.val()));
                    grn_amount_before_discount_total += parseFloat(removeComma(amount.val()));
                    grn_discount_amount_total += parseFloat(removeComma(discount_amount.val()));
                    i += 1;
                }
            });

            text += "<tr>" +
                "<td colspan='6' style='text-align: right'>GRNs AMOUNT</td>" +
                "<td style='text-align: right'>" + grn_amount_before_discount_total.toLocaleString() + "</td>" +
                "</tr>";
            text += "<tr>" +
                "<td colspan='6' style='text-align: right'>DISCOUNT AMOUNT</td>" +
                "<td style='text-align: right'>" + grn_discount_amount_total.toLocaleString() + "</td>" +
                "</tr>";
            text += "<tr>" +
                "<td colspan='6' style='text-align: right'>PAYABLE AMOUNT</td>" +
                "<td style='text-align: right'>" + grn_amount_total.toLocaleString() + "</td>" +
                "</tr>";

            if (grn_amount_total > 0) {
                jQuery('#selected_vendor_grn').empty().append(text);
            }
        })

    </script>
@stop