@extends('layouts.app')
@section('title', __('report.reports_outstanding'))

@section('content')

    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>{{ __('Reports Outstanding') }}</h1>
    </section>
    <section class="content">
        <div class="row">
            <div class="col-md-12">
                @component('components.filters', ['title' => __('report.filters')])
                    <div class="col-md-4">
                        <div class="form-group">
                            {!! Form::label('sell_list_filter_location_id', __('purchase.business_location') . ':') !!}
                            <select class="form-control select2" multiple="multiple" id="sell_list_filter_location_id"
                                name="sell_list_filter_location_id[]" data-placeholder="Select a location" style="width: 100%;">
                                @foreach ($business_locations as $business_location)
                                    <option value="{{ $business_location->id }}">{{ $business_location->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-group">
                            {!! Form::label('sell_list_filter_customer_id', __('contact.customer') . ':') !!}
                            {!! Form::select('sell_list_filter_customer_id', $customers, null, [
                                'class' => 'form-control select2',
                                'style' => 'width:100%',
                                'placeholder' => __('lang_v1.all'),
                            ]) !!}
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-group">
                            {!! Form::label('sell_list_filter_date_range', __('report.date_range') . ':') !!}
                            {!! Form::text('sell_list_filter_date_range', null, [
                                'placeholder' => __('lang_v1.select_a_date_range'),
                                'class' => 'form-control',
                                'readonly',
                            ]) !!}
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-group">
                            <label>User</label>
                            <select class="form-control select2" multiple="multiple" id="created_by" name="created_by[]"
                                data-placeholder="Select a Username" style="width: 100%;">
                                @foreach ($users as $user)
                                    <option value="{{ $user->id }}">{{ $user->username }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-group">
                            <label>Multiple Payment Status</label>
                            <select class="form-control select2" multiple="multiple" id="multiple_payment_status"
                                name="multiple_payment_status[]" data-placeholder="Select a Payment Status"
                                style="width: 100%;">
                                <option value="due">Due</option>
                                <option value="partial">Partial</option>
                                <option value="paid">Paid</option>
                            </select>
                        </div>
                    </div>
                @endcomponent
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                @component('components.widget', ['class' => 'box-primary'])
                    <table class="table table-bordered table-striped" id="outstanding_report">
                        <thead>
                            <tr>
                                <th>@lang('Customer Name')</th>
                                <th>@lang('Total Amount')</th>
                                <th>@lang('Total Outstanding')</th>
                                <th>@lang('Total Return Due')</th>
                                <th>@lang('Total Paid')</th>
                            </tr>
                        </thead>
                        <tbody></tbody>
                        <tfoot>
                            <tr class="bg-gray font-17 footer-total text-center">
                                <td colspan="1"><strong>@lang('sale.total'):</strong></td>
                                <td class="footer_sale_total"></td>
                                <td class="footer_total_remaining"></td>
                                <td class="footer_total_sell_return_due"></td>
                                <td class="footer_total_paid"></td>
                            </tr>
                        </tfoot>
                    </table>
                @endcomponent
            </div>
        </div>
    </section>
@endsection
@section('javascript')
    <script type="text/javascript">
        $(document).ready(function() {
            //Date range as a button
            dateRangeSettings.startDate = moment().subtract('days');;
            dateRangeSettings.endDate = moment(); 
            $('#sell_list_filter_date_range').daterangepicker(
                dateRangeSettings,
                function(start, end) {
                    $('#sell_list_filter_date_range').val(start.format(moment_date_format) + ' ~ ' + end.format(
                        moment_date_format));
                    sell_table.ajax.reload();
                }
            );
            $('#sell_list_filter_date_range').on('cancel.daterangepicker', function(ev, picker) {
                $('#sell_list_filter_date_range').val('');
                sell_table.ajax.reload();
            });
            sell_table = $('#outstanding_report').DataTable({
                processing: true,
                serverSide: true,
                aaSorting: [
                    [1, 'desc']
                ],
                "ajax": {
                    "url": "/reports/outstanding",
                    "data": function(d) {
                        if ($('#sell_list_filter_date_range').val()) {
                            var start = $('#sell_list_filter_date_range').data('daterangepicker')
                                .startDate.format('YYYY-MM-DD');
                            var end = $('#sell_list_filter_date_range').data('daterangepicker').endDate
                                .format('YYYY-MM-DD');
                            d.start_date = start;
                            d.end_date = end;
                        }
                        d.location_id = $('#sell_list_filter_location_id').val();
                        d.customer_id = $('#sell_list_filter_customer_id').val();
                        d.payment_status = $('#sell_list_filter_payment_status').val();
                        d.multiple_payment_status = $('#multiple_payment_status').val();
                        d.created_by = $('#created_by').val();
                        d = __datatable_ajax_callback(d);
                    }
                },
                columns: [{
                        data: 'name',
                        name: 'name',
                    },
                    {
                        data: 'total_invoice',
                        name: 'total_invoice',
                        // orderable: false,
                        "searchable": false
                    },
                    {
                        data: 'due',
                        name: 'due',
                        // orderable: false,
                        "searchable": false
                    },
                    {
                        data: 'total_sell_return',
                        name: 'total_sell_return',
                        // orderable: false,
                        "searchable": false,
                        visible: false
                    },
                    {
                        data: 'total_paid_amount',
                        name: 'total_paid_amount',
                        // orderable: false,
                        "searchable": false
                    },
                ],
                "fnDrawCallback": function(oSettings) {
                    __currency_convert_recursively($('#sell_table'));
                },
                "footerCallback": function(row, data, start, end, display) {
                    var footer_sale_total = 0;
                    var footer_total_paid = 0;
                    var footer_total_remaining = 0;
                    var footer_total_sell_return_due = 0;
                    for (var r in data) {
                        footer_sale_total += $(data[r].total_invoice).data('orig-value') ? parseFloat($(
                            data[r].total_invoice).data('orig-value')) : 0;
                        footer_total_paid += $(data[r].total_paid_amount).data('orig-value') ?
                            parseFloat($(
                                data[r].total_paid_amount).data('orig-value')) : 0;
                        footer_total_remaining += $(data[r].due).data('orig-value') ?
                            parseFloat($(data[r].due).data('orig-value')) : 0;
                        footer_total_sell_return_due += $(data[r].total_sell_return).find(
                                '.sell_return_due')
                            .data('orig-value') ? parseFloat($(data[r].total_sell_return).find(
                                '.sell_return_due').data('orig-value')) : 0;
                    }
                    $('.footer_total_sell_return_due').html(__currency_trans_from_en(
                        footer_total_sell_return_due));
                    $('.footer_total_remaining').html(__currency_trans_from_en(footer_total_remaining));
                    $('.footer_total_paid').html(__currency_trans_from_en(footer_total_paid));
                    $('.footer_sale_total').html(__currency_trans_from_en(footer_sale_total));

                },
                createdRow: function(row, data, dataIndex) {
                    $(row).find('td:eq(6)').attr('class', 'clickable_td');
                }
            });
            $(document).on('change',
                '#multiple_payment_status, #created_by, #sell_list_filter_payment_status, #sell_list_filter_customer_id, #sell_list_filter_location_id',
                function() {
                    sell_table.ajax.reload();
                });
        });
    </script>
@endsection