@extends('layouts.main_without_top_button')
@section('title')
    {{$vendor->name}} Profile
@stop
@section('payments')
    active
@stop
@section('navigation')
    <ul class="breadcrumb">
        <li><a href="{{route('home')}}">Dashboard</a> <span class="divider">/</span></li>
        <li><a href="{{route('vendors.index')}}">Vendors</a> <span class="divider">/</span></li>
        <li><a href="{{route('vendors.show')}}">{{$vendor->name}} Profile</a> <span class="divider">/</span></li>
        <li class="active">Payments</li>
    </ul>
@stop
@section('contentinner')
    <style>
        table tbody td .number {
            text-align: right;
        }
        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 class="tabbable">
        @include('vendors.includes.vendor_profile')
        <div class="tab-content">
            <div class="tab-pane active">
                {{--<div class="msghead">--}}
                    {{--<ul class="msghead_menu">--}}
                        {{--<li class="right btn-group">--}}
                            {{--<div class="btn-group">--}}
                                {{--<button class="btn dropdown-toggle" data-toggle="dropdown" id="update_payment_button" style="margin-right: 4px">--}}
                                    {{--UPDATE--}}
                                {{--</button>--}}
                                {{--<button class="btn dropdown-toggle" data-toggle="dropdown" id="delete_payment_button">--}}
                                    {{--<span class="iconsweets-trashcan" style="color: red"></span>--}}
                                {{--</button>--}}
                            {{--</div><!--btn-group-->--}}
                        {{--</li>--}}
                    {{--</ul>--}}
                    {{--<span class="clearall"></span>--}}
                {{--</div><!--msghead-->--}}
                {{--<br>--}}
                <table class="table table-bordered table-condensed" id="payments-vouchers-list-1">
                    <thead>
                    <tr>
                        <th class="head0 nosort" style="width: 20px"><input type="checkbox" class="checkall"/></th>
                        <th class="head0" style="width: 20px">MORE</th>
                        <th class="head0" style="width: 20px">PVNO.</th>
                        <th class="head1" style="width: 90px">Date</th>
                        <th class="head1">Paid By</th>
                        <th class="head0">Cr</th>
                        <th class="head0">Received By</th>
                        {{--<th class="head0">Reference</th>--}}
                        <th class="head1">Remarks</th>
                        <th class="head0">Amount</th>
                        <th style="width: 60px">Action</th>
                    </tr>
                    </thead>
                </table>
            </div><!--tab-pane-->
        </div><!--tabcontent-->
    </div><!--tabbable-->
    <div aria-hidden="false" class="fade hide modal animated" data-backdrop="static" id="payment_modal" tabindex="-1">
        {!! Form::open(array('class' => 'stdform','id'=>'payment_form','route'=>'payments.update')) !!}
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h3 id="myModalLabel"><span class="vendors_name"></span></h3>
        </div>
        <div class="modal-body">
            <div id="payment_body"></div>
        </div>
        <div class="modal-footer">
            <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
            <button class="btn btn-success" name="update_vendor" id="update_vendor" type="submit">UPDATE PAYMENT
            </button>
        </div>
        {!! Form::close() !!}
    </div>
    <script>
        jQuery('.make_payment_date').datepicker();
        jQuery('#paid_by,#received_by').chosen();
        jQuery('#credited_account').chosen();

        jQuery("#addedRow").on('click', '#removerow', function () {
            jQuery(this).parent().parent().remove();
        });
        pupulate();
        jQuery("#addRow").click(function () {
            var response = jQuery('#addingrow').html();
            jQuery('#addedRow').append(response);
            pupulate();
            jQuery('.chzn-select').chosen();
        });

        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, ",");
                });
            });
        }

        var oTable = jQuery('#payments-vouchers-list-1').DataTable({
            "oLanguage": {
                "sLoadingRecords": "Please wait - loading Goods Received Note...",
                "sZeroRecords": "No Goods Received Note to Display.",
                "sInfoEmpty": "No entries to display."
            },
            ajax: {
                url: '{{route('vouchers.data-table.payments',array('vendor_id'=>$vendor->id))}}',
                data: function (d) {
//                d.route_id = jQuery('#name').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.');
                    }
                    oTable.fnProcessingIndicator(false);
                }
            },
//            scrollY: '48vh',
            scrollCollapse: true,
            "sPaginationType": "full_numbers",
            processing: true,
            serverSide: true,
            "aoColumnDefs": [{
                "aTargets": [8],
                "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
                    jQuery(nTd).css('text-align', 'right')
                    if ((sData == 0.00)) {
                        jQuery(nTd).addClass('highlight-red')
                    }
                }
            },{
                "aTargets": [9],
                "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
                    jQuery(nTd).css('text-align', 'right')
                }
            }],
            "columns": [
                {data: 'checkbox'},
                {
                    "class": "details-control",
                    "orderable": false,
                    "data": null,
                    "defaultContent": ""
                },
                {"class": "link", data: 'payment_number'},
                {"class": "link", data: 'date_created'},
                {"class": "link number", data: 'paid_by'},
                {"class": "link number", data: 'credit_account'},
                {"class": "link number", data: 'received_by'},
//                {"class": "link number", data: 'reference'},
                {"class": "link number", data: 'remarks'},
                {"class": "link", data: 'amount'},
                {data: 'action'}
            ],
            "fnDrawCallback": function () {
                jQuery('.deleterow_c').click(function () {
                    var conf = confirm('Are you sure?');
                    if (conf)
                        var tr_p = jQuery(this).parents('tr');
                    var payment_voucher_id = tr_p.find('.payment_voucher_id').val();

                    jQuery.ajax({
                        type: "post",
                        cache: false,
                        {{--url: "{{route('payment-vouchers.delete')}}",--}}
                        data: {
                            payment_voucher_id: payment_voucher_id
                        },
                        success: function (data) {
                            if (data == 'DONE') {
                                notify('Payment Voucher Deleted Successful!');
                                jQuery('#payments-vouchers-list-1').dataTable().fnFilter(this.value);
                            } else {
                                alert("Fail To delete Payment Voucher.");
                            }
                        },
                        error: function (data) {

                        }
                    });
                    return false;
                });

                jQuery('.update_payment').click(function () {
                    var tr_p = jQuery(this).parents('tr');
                    var payment_voucher_id = tr_p.find('.payment_voucher_id').val();

                    jQuery.ajax({
                        type: "get",
                        cache: false,
                        url: "{{route('payment-vouchers.edit')}}",
                        data: {
                            payment_voucher_id: payment_voucher_id
                        },
                        success: function (data) {
                            jQuery('#edit_expenses_payments_voucher').empty().append(data);
                            jQuery('#edit_expenses_payments_voucher_modal').appendTo("body").modal('toggle');
                            jQuery(".remove_row").on('click', function () {
                                jQuery(this).parent().parent().remove();
                            });
                        },
                        error: function (data) {

                        }
                    });
                    return false;
                });
            },
            "bStateSave": true,
        });

        function format(d) {
            return d.payment_voucher_details;
        }
        // Array to track the ids of the details displayed rows
        var payment_voucher_more = [];

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

            var tr = jQuery(this).closest('tr');
            var row = oTable.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'));
                }
            }
        });

        jQuery('#add_vendor_grn').on('click', function () {
            if (jQuery('#vendor_debited_account').val() != 'NONE') {
                getGoodReceivedNote();
            } else {
                alert('SELECT THE VALID CREDITOR ACCOUNT');
            }
        });
        jQuery('#vendor_debited_account').on('change', function () {
            getGoodReceivedNote();
        });
        getGoodReceivedNote();
        function getGoodReceivedNote() {
            if (jQuery('#vendor_debited_account').val() != 'NONE') {
                var vendor_debited_account_id = jQuery('#vendor_debited_account').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('payment-vouchers.create')}}",
                    data: {
                        vendor_debited_account_id: vendor_debited_account_id,
                        good_receive_note_id: good_receive_note_id,
                    },
                    success: function (data) {
                        jQuery('#added_vendor_grn').empty().append(data);

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

                    }
                });

            }
        }
    </script>
@stop