@extends('layouts.app')

@section('link')
    <link href="{{ asset('css/theme.default.css') }}" rel="stylesheet">
    <link href="{{ asset('css/chosen.min.css') }}" rel="stylesheet">
    <link href="{{ asset('css/datatables.min.css') }}" rel="stylesheet">
    <link href="{{ asset('css/style.css') }}" rel="stylesheet">
    
    <link href="{{ asset('css/admin_filters.css') }}" rel="stylesheet">
    <link href="{{ asset('css/jquery.dataTables.yadcf.css') }}" rel="stylesheet">
    <link href="{{ asset('css/jquery-ui.min.css') }}" rel="stylesheet">
@endsection


@section('content')
<div class="container">
    <div class="row">
        <div class="col-xs-12 col-sm-12 col-md-12">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title">{{__('texte.vehicles_arr.show.show_vehicle')}}</h3>
                    <div class="pull-right">
                        <button class="btn btn-primary back-btn" onclick="window.history.back()">{{__('texte.vehicles_arr.show.back')}}</button>
                    </div>
                </div>
                <div class="panel-body">
                    <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>{{__('texte.vehicles_arr.show.mark')}}: </strong>
                            {{ $vehicle->make }}
                        </div>
                    </div>
                    <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>{{__('texte.vehicles_arr.show.model')}}: </strong>
                            {{ $vehicle->model }}
                        </div>
                    </div>
                    <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>{{__('texte.vehicles_arr.show.tonnage')}}: </strong>
                            {{ $vehicle->load_capacity }} {{__('texte.vehicles_arr.show.kg')}}
                        </div>
                    </div>
                    <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>{{__('texte.vehicles_arr.show.registration_number')}}: </strong>
                            {{ $vehicle->reg_number}}
                        </div>
                    </div>
                    <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>{{__('texte.vehicles_arr.show.active')}}: </strong>
                            {{ Lang::get('texte.replies_arr')[$vehicle->active]}}
                        </div>
                    </div>
                    
                    @if(count($vehicle_documents)>0)
                    
                    <div class="col-xs-12 col-sm-12 col-md-12">
                        <div class="form-group">
                            <strong>{{__('texte.vehicles_arr.show.balance')}}: </strong>
                            {{ $balance }} лв.
                        </div>   
                        
                        <div class="form-inline panel panel-default">
                            @permission('document-form-contragent-read')
                                <div class="form-group">
                                    <div class="input-group">
                                        <select class="form-control" id="contragents" name="contragent">
                                            <option value="">--- {{Lang::get('texte.vehicles_arr.show.contragent')}} ---</option>
                                            @foreach ($contragents as $contragent)
                                                <option value="{{ $contragent->id }}">{{ $contragent->company_name ?? $contragent->user->name }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            @endpermission                                 

                            @permission('document-form-type-read')
                                <div class="form-group">
                                    <div class="input-group">
                                        <select class="form-control" id="type" name="type" multiple>
                                            @foreach ($doc_types as $type)
                                                <option value="{{ $type['id'] }}">{{ $type['title'] }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            @endpermission

                            <div class="form-group">
                                <div class="input-group">
                                    <div id="first_filters_div" style="display: inline-block; height:40px;"></div>
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="input-group">
                                    <div id="second_filters_div" style="display: inline-block; height:40px;"></div>
                                </div>
                            </div>

                            @permission('document-form-payment_type-read')
                                <div class="form-group">
                                    <div class="input-group">
                                        <select class="form-control" id="payment_type" name="payment_type">
                                            <option value="">--- {{Lang::get('texte.vehicles_arr.show.payment_type')}} ---</option>
                                            @foreach (App\Document::PAYMENT as $payment_type)
                                                <option value="{{ mb_ucfirst($payment_type)}}">{{mb_ucfirst($payment_type)}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                            @endpermission

                            <button class='btn  btn-warning dark_bordered_warning' type="button" onclick="reset_filters();" title='{{Lang::get('texte.vehicles_arr.show.reset_filters')}}' data-toggle='tooltip'>{{Lang::get('texte.vehicles_arr.show.reset_filters')}}</button>
                        </div>
                    
                        <h4 style='margin-top:30px;'>{{Lang::get('texte.vehicles_arr.show.documents')}}</h4>
                        <table id="documents_table" class="table table-striped table-bordered table-hover dataTables-example dataTable" width="100%">
                            <thead>
                                <tr>
                                    <th>{{strtoupper(__('texte.vehicles_arr.show.id'))}}</th>
                                    <th>{{Lang::get('texte.vehicles_arr.show.number')}}</th>
                                    <th>{{Lang::get('texte.vehicles_arr.show.type')}}</th>
                                    <th>{{Lang::get('texte.vehicles_arr.show.date')}}</th>
                                    <th>{{Lang::get('texte.vehicles_arr.show.payment_end_date')}}</th>
                                    <th>{{Lang::get('texte.vehicles_arr.show.payment')}}</th>                                    
                                    <th>{{Lang::get('texte.vehicles_arr.show.contragent')}}</th>
                                    <th>{{Lang::get('texte.vehicles_arr.show.amount')}}</th>                                    
                                    <th>{{Lang::get('texte.vehicles_arr.show.actions')}}</th>
                                    <th hidden>{{Lang::get('texte.vehicles_arr.show.contragent')}}</th>
                                    <th hidden>{{Lang::get('texte.vehicles_arr.show.type')}}</th>     
                                    <th hidden>{{Lang::get('texte.vehicles_arr.show.amount')}}</th>
                                 </tr>
                            </thead>
                            <tbody> 
                                @foreach($vehicle_documents as $vehicle_document)
                                <tr
                                    @if ($vehicle_document->status === 1)
                                        class="danger" data-class="danger"
                                    @elseif ($vehicle_document->status > 1)
                                        class="warning" data-class="warning"
                                    @endif
                                >
                                    <td>{{$vehicle_document->id}}</td>
                                    <td>{{$vehicle_document->number}}</td>
                                    <td>{{$vehicle_document->type->title}}</td>
                                    <td>{{ (new DateTime($vehicle_document->date))->format('d.m.Y') }}</td>
                                    <td>{{ $vehicle_document->payment_date ? (new DateTime($vehicle_document->payment_date))->format('d.m.Y') : '' }}</td>
                                    <td>{{mb_ucfirst(App\Document::PAYMENT[$vehicle_document->payment_type]) }}</td>                                
                                    <td>
                                        @if($vehicle_document->documentable instanceof \App\Contragent) 
                                            {{$vehicle_document->documentable->company_name ?? $vehicle_document->documentable->user->name }}
                                        @elseif($vehicle_document->documentable instanceof \App\Obect)    
                                            {{$vehicle_document->documentable->contragent->company_name ?? $vehicle_document->documentable->contragent->user->name}}
                                        @endif
                                    </td>
                                    <td>{{number_format($vehicle_document->total,5,'.','')}}</td>                                    
                                    <td>
                                        <div class='btn-group btn-group-xs'>
                                            @permission('document-route-list')
                                                <a class='btn btn-info' target='_blank' href='{{route('documents.show',$vehicle_document->id)}}' title='{{Lang::get('texte.vehicles_arr.show.show')}}' data-toggle='tooltip'>
                                                    <i class='glyphicon glyphicon-eye-open'></i>
                                                </a>
                                            @endpermission
                                        </div>
                                    </td>
                                    <td hidden>{{$vehicle_document->documentable_id}}</td>
                                    <td hidden>{{$vehicle_document->type->id}}</td>  
                                    <td hidden>{{number_format($vehicle_document->total*($vehicle_document->doc_type==52 || $vehicle_document->doc_type==59 ? 1 : (-1)),5,'.','')}}</td>
                                </tr>
                                @endforeach
                            </tbody>
                            <tfoot>
                                <tr>
                                    <th colspan="7" style="text-align:right">{{__('texte.vehicles_arr.show.balance')}}:</th>
                                    <th></th>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                    @endif
                </div>
            </div>
        </div>
    </div>
</div>

<script src="{{ asset('js/jquery-ui.min.js') }}"></script>
<script src="{{ asset('js/datepicker-bg.js') }}"></script>
<script src="{{ asset('js/chosen.js') }}"></script>
<script src="{{ asset('js/datatables.min.js') }}"></script> 
<script src="{{ asset('js/jquery.dataTables.yadcf.js') }}"></script>

<script>
    $('#contragents,#payment_type').chosen();
    
    $('#type').chosen({placeholder_text_multiple: '--- Тип документ ---'});
    
    table = $('.dataTables-example').DataTable({
        pageLength: 100,
        responsive: true,
        "oLanguage": {
            "sSearch": "",
            "sLengthMenu": "_MENU_  <span style='vertical-align:-moz-middle-with-baseline;margin-left:5px;'>Резултата на страница</span>",  
            "sInfo": "Показване на записи от _START_ до _END_ от общо _TOTAL_ записа",
            "sZeroRecords": "Не са намерени записи по зададените параметри",
            "sInfoEmpty": "Не са намерени записи по зададените параметри",
            "sInfoFiltered" : "- филтрирани от _MAX_ записа",
            "sLoadingRecords" : "Резултатите се зареждат, моля изчакайте...",
            "oPaginate": {
                                    "sNext": "Следваща страница",
                                    "sPrevious": "Предишна страница",
                              },

        },
        "columnDefs": [
                        { "orderable": false, "targets": 10 }
                      ],
        "initComplete":function(settings, json) {
            $('select[name="documents_table_length"]').chosen();
            $('.input-sm').attr('placeholder','Търсене');
            $('div.dataTables_filter input').css({ marginLeft : "0px"});
            this_table = $('.dataTables-example').dataTable();
        },
        "dom" : "fl<'#add_vehicle'>tip",
        
        "footerCallback": function ( row, data, start, end, display ) {
            var api = this.api(), data;
 
            // Remove the formatting to get integer data for summation
            var intVal = function ( i ) {
                return typeof i === 'string' ?
                    i.replace(/[\$,]/g, '')*1 :
                    typeof i === 'number' ?
                        i : 0;
            };
 
            // Total over this page
            pageTotal = api
                .column(11,{ page: 'current'} )
                .data()
                .reduce( function (a, b) {
                    return intVal(a) + intVal(b);
                }, 0 );
 
            // Update footer
            $( api.column(7).footer() ).html(
                pageTotal.toFixed(5) + ' лв.'
            );
        }

    });

    yadcf.init(table, [
        {
            column_number: 3,
            filter_type: "range_date",
            date_format: "dd.mm.yyyy",
            filter_delay: 500,
            filter_container_id: "first_filters_div",
            filter_default_label: ['Даата от:','Дата до:'],
            filter_reset_button_text: false
        },
        
        {
            column_number: 4,
            filter_type: "range_date",
            date_format: "dd.mm.yyyy",
            filter_delay: 500,
            filter_container_id: "second_filters_div",
            filter_default_label: ['Падеж от:','Падеж до:'],
            filter_reset_button_text: false
        },
    ]);
    
    $('#contragents').on('change', function(){
        if($(this).val()!=''){
            table.column(9).search("^" + $(this).val() + "$", true, false).draw();  
        }
        else{
           table.column(9).search('').draw(); 
        }        
    });

    $('#type').on('change', function(){
        if($(this).val()!=''){
            var value = $(this).val().join('$|^');
            table.column(10).search("^" + value + "$", true, false).draw();
        }
        else{
            table.column(10).search('').draw();
        }
    });

    $('#payment_type').on('change', function(){
        table.column(5).search(this.value).draw();   
    });
    
    function reset_filters(){
        $('.yadcf-filter-range-date').val('');   
        $('#payment_type,#type,#contragents').val('').trigger("chosen:updated").change();
    }
    
</script>
@endsection