@extends('layouts.master')

@section('page_title','Customers - Suppliers Report')
@section('title','Customers & Suppliers Report')
@section('main_item','Reports')
@section('sub_item','Customers & Suppliers Report')

@section('content')

<div class="col-12">
        <div class="card">
            <div class="card-body">
                <div class="row">
                    <div class="col-md-4">
                        <div class="form-group">
                            <label style="font-weight: bold" for="supplier">Select Customer</label>
                            <select class="form-control select2" id="contact_id" name="contact_id">
                                <option value="">Select</option>
                                @foreach ($customers as $customer)
                                    <option value="{{$customer->id}}">{{$customer->name}}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                </div>
            </div>
           
        </div>
       
    </div>

<div class="col-md-12">
    <div class="card">
        <div class="card-body">
                <div class="table-responsive dash-social">
                        <table id="laravel_datatable" class="table table-striped">
                            <thead class="thead-dark">
                                <tr>
                                    <th>Contact Name</th>

                                    <th>Order Count</th>
                                    <th>Orders Value</th>
                                    <th>Return Count</th>
                                    <th>Return Value</th>

                                </tr>
                               
                            </thead>
                            <tbody>
                            </tbody>
                        </table>
                    </div>
        </div>
       
    </div>
   
</div>

@endsection

@section('scripts')

<script>
       
        $(document).ready(function () {
            table = $('#laravel_datatable').DataTable({
                lengthMenu: [
                    [25, 50, 100 ,-1],
                    ['25 ', '50 ', '100' ,'All']
                ],
                buttons: ['copy', 'excel', 'pdf', 'colvis'],
                processing: true,
                serverSide: true,
                ajax:{
                    url: "{{ url('/reports/customer') }}",
                    data: function(d) {
                                    d.contact_id = $('#contact_id').val();
                                },
                },
                columns: [{
                        data: 'name',
                        name: 'name'
                    },

                    {
                        data: 'order_count',
                        name: 'order_count'
                    },
                    {
                        data: 'order_value',
                        name: 'order_value'
                    },
                    {
                        data: 'return_count',
                        name: 'return_count'
                    },
                    {
                        data: 'return_value',
                        name: 'return_value'
                    },

                ]
            });

        });

        $(document).on('change','#contact_id', function () {
          
            table.ajax.reload();

        })

    </script>

@endsection