@extends('layouts.main')
@push('styles')
<link href='{{asset('css/redtrack.css')}}' rel='stylesheet' />
<link href='{{asset('css/daterangepicker.css')}}' rel='stylesheet' />
<!-- BEGIN DataTables-->
<link rel="stylesheet" type="text/css" href="{{asset('datatables/datatables.min.css')}}">
<!-- END DataTables-->
@endpush
@section('content')
<div class="card">
    <div class="card-block">
        <div class="col-md-12">
            <div class="panel panel-default">                   
                <div class="panel-heading"><h5>{{ __('strings.trips_report') }}</h5></div>

                <div class="cc-selector panel-body">
                                        
                    <div id="reportrange" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc;" class="col-md-4">
                        <i class="fa fa-calendar"></i>&nbsp;
                        <span></span> <i class="fa fa-caret-down"></i>
                    </div>
                    <br>
                    <hr>
                    <div class="col-md-12">
                    <div class="table-responsive">
                        <table id="quiq-drivers-table" class="table hover mb-0">
                            <thead class="thead-inverse">
                                <tr>
                                    <th>ID</th>	 
                                    <th>{{__('strings.created_at')}}</th>
                                    <th>Hora</th>
                                    <th>STATUS</th>
                                    <th>NIP</th>
                                    <th>DEPARTAMENTO</th>
                                    <th>TIPO RUTA</th>
                                    <th>{{__('strings.driver_name')}}</th>
                                    <th>{{__('strings.driver_lastname')}}</th>
                                    <th>{{__('strings.eco')}}</th>
                                    <th>{{__('strings.start_address')}}</th>
                                    <th>{{__('strings.amount')}}</th>
                                    <th>{{__('strings.wait_minutes')}}</th>
                                    <th>{{__('strings.wait_minutes_total')}}</th>
                                    <th>{{__('strings.payment')}}</th>
                                    <th>{{__('strings.number_of_passengers')}}</th>
                                    @for($i = 1; $i <= 5; $i++)                                    
                                        <th>{{__('strings.start_location')}} #{{$i}}</th>
                                        <th>{{__('strings.passenger_name')}}</th>
                                        <th>{{__('strings.employee_number')}}</th>
                                        <th>{{__('strings.department')}}</th>
                                    @endfor
                                    @for($i = 1; $i <= 5; $i++)                                    
                                        <th>{{__('strings.place')}} #{{$i}}</th>
                                        <th>{{__('strings.passenger_name')}}</th>
                                        <th>{{__('strings.employee_number')}}</th>
                                        <th>{{__('strings.department')}}</th>
                                    @endfor
                                    <th>KM</th>
                                    <th>URL</th>
                                    <th>Comentarios</th>
                                    <th>Recibo</th>
                                    <th>{{__('strings.km_local')}}</th>
                                    <th>{{__('strings.km_foreign')}}</th>
                                    <th>{{__('strings.extra_passengers')}}</th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')

<!-- BEGIN DataTables-->
<script src="{{asset('datatables/datatables.min.js')}}" type="text/javascript"></script>
<!-- END DataTables-->
<script src="{{asset('js/daterangepicker.js')}}" type="text/javascript"></script>


<script type="text/javascript">
    var table;
    $(document).ready(function() {
        $('#reportrange').daterangepicker({
                "timePicker": true,
                "timePicker24Hour": true,
                "locale": {
                    "format": "YYYY-MM-DD HH:mm",
                    "separator": " - ",
                    "applyLabel": "Aceptar",
                    "cancelLabel": "Cancelar",
                    "fromLabel": "De",
                    "toLabel": "A",
                    "customRangeLabel": "Personalizado",
                    "weekLabel": "S",
                },
        });

        function cb(start, end) {
            $('#reportrange span').html(start.format('YYYY-MM-DD HH:mm') + ' - ' + end.format('YYYY-MM-DD HH:mm'));
            getTrips(start.format('YYYY-MM-DD HH:mm'), end.format('YYYY-MM-DD HH:mm'));
        }
        
        $('#reportrange').on('apply.daterangepicker', function (ev, picker) {  
            $('#reportrange span').html(picker.startDate.format('YYYY-MM-DD HH:mm') + ' - ' + picker.endDate.format('YYYY-MM-DD HH:mm'));
            getTrips(picker.startDate.format('YYYY-MM-DD HH:mm'), picker.endDate.format('YYYY-MM-DD HH:mm'));
        });

        //setting language for moment.js
        moment.locale('es');

        // call business trips on load page
        cb(moment().subtract(1, 'days'),  moment());

        //initialize datetable
        table = $('#quiq-drivers-table').DataTable({
                                responsive: false,
                                paging: false,				
                                columns: [
                                { data: 'TOKEN', name: 'TOKEN', render: function(data, type, row, meta) {
                                        return "<a class='btn btn-small btn-rounded btn-primary'  target='_blank' href='{{route('trip_info')}}/" + data + "'>{{__('strings.details')}}</a>";
                                    }
                                },
                                { data: 'CREATED_AT', name: 'CREATED_AT', render: function(data, type, row, meta) {
                                            return moment.utc(data).local().format('YYYY-MM-DD');
                                    }
                                }, 
                                { data: 'CREATED_AT', name: 'CREATED_AT', render: function(data, type, row, meta) {
                                            return moment.utc(data).local().format('HH:mm:ss');
                                    }
                                },  
                                { data: 'ROUTE_STATUS', name: 'ROUTE_STATUS'},
                                { data: 'business_trip', render: function(business_trip, type, row){
                                        if(business_trip)
                                            return business_trip.NIP
                                        else
                                            return null;
                                }, defaultContent:"N/A"},
                                { data: 'business_trip', render: function(business_trip, type, row){
                                        if(business_trip)
                                            return business_trip.NIP_DEPARTMENT
                                        else
                                            return null;
                                }, defaultContent:"N/A"},
                                {data:'ROUTE_TYPE', name:'ROUTE_TYPE', defaultContent:'---'},
                                { data: 'driver',render: function(driver){
                                        if(driver) 
                                            return driver.NAME + ', Tel: ' + driver.PHONE_NUMBER;
                                        else 
                                            return "N / A";
                                }},
                                { data: 'driver', render: function(driver){
                                        if(driver) 
                                            return driver.LAST_NAME;
                                        else 
                                            return "N / A";
                                }},
                                { data: 'driver', render: function(driver){
                                        if(driver) 
                                            return driver.ECO + "/" + driver.NUMBER_PLATE;
                                        else 
                                            return "N / A";
                                }},
                                { data: 'BEGIN_ADDRESS', name: 'BEGIN_ADDRESS'},
                                { data: 'business_trip', render: function(business_trip, type, row){
                                        if(business_trip)
                                            return business_trip.TOTAL;
                                        else if(row.invoice)
                                            return row.invoice.AMOUNT;
                                        else
                                            return "0.0";
                                }},
                                { data: 'WAITING_MINUTES', name: 'WAITING_MINUTES', defaultContent:'0'},
                                { data: 'WAITING_MINUTES_TOTAL', name: 'WAITING_MINUTES_TOTAL', defaultContent:'0'},
                                { data: 'invoice', name: 'PAYMENT_JSON', render: function(data){
                                                if(data != null) {
                                                        var payment = JSON.parse(data.PAYMENT_JSON);
                                                        var image = '';

                                                        switch(payment.DATA.type) {
                                                                case 'EFEC':
                                                                        image = '{{asset('images/cash.png')}}';
                                                                break;
                                                                case 'VISA':
                                                                        image = '{{asset('images/visa.png')}}';
                                                                break;
                                                                case 'MAST':
                                                                        image = '{{asset('images/mast.png')}}';
                                                                break;
                                                                case 'AMEX':
                                                                        image = '{{asset('images/amex.png')}}';
                                                                break;
                                                                case 'CRED':
                                                                        image = '{{asset('images/cred.png')}}';
                                                                break;
                                                        }
                                                        var html = "<div class='media'>"
                                                        + "<a class='media-left media-middle'>"
                                                        + "<img class='media-object' src='"+image+"' style='width: 32px;height: 32px;' />"

                                                        + "</a>"
                                                        + "<div >"
                                                        + "<h5 class='media-heading'>" + payment.DATA.alias + " </h5>"
                                                        + payment.DATA.description
                                                        +  "</div>"
                                                        + "</div>";
                                                        return html;
                                                } else {
                                                        return null;
                                                }
                                }, defaultContent: "<i>Sin Pago</i>"},
                                { data: 'business_trip', render: function(trip){
                                        if(trip) 
                                            return trip.PASSENGERS_NUMBER;
                                        else 
                                            return "N / A";
                                }},
                                    @for($i = 1; $i <= 5; $i++) 
                                        { data: 'business_trip', render: function(trip){
                                                if(trip) {
                                                    if(trip.LOCATIONS["start_address{{$i}}"] && trip.LOCATIONS["start_address{{$i}}"].address) {
                                                        return trip.LOCATIONS["start_address{{$i}}"].address;
                                                    }
                                                }
                                                return "N / A";
                                        }},
                                        { data: 'business_trip', render: function(trip){
                                                if(trip) {
                                                    if(trip.LOCATIONS["start_address{{$i}}"] && trip.LOCATIONS["start_address{{$i}}"].passenger) {
                                                        return trip.LOCATIONS["start_address{{$i}}"].passenger + ', [' + trip.LOCATIONS["start_address{{$i}}"].passenger_phone + ']';
                                                    }
                                                }
                                                return "N / A";
                                        }},
                                        { data: 'business_trip', render: function(trip){
                                                if(trip) {
                                                    if(trip.LOCATIONS["start_address{{$i}}"] && trip.LOCATIONS["start_address{{$i}}"].employee_number) {
                                                        return trip.LOCATIONS["start_address{{$i}}"].employee_number;
                                                    }
                                                } 
                                                return "N / A";
                                        }},
                                        { data: 'business_trip', render: function(trip){
                                                if(trip) {
                                                    if(trip.LOCATIONS["start_address{{$i}}"] && trip.LOCATIONS["start_address{{$i}}"].passenger_department) {
                                                        return trip.LOCATIONS["start_address{{$i}}"].passenger_department;
                                                    }
                                                }
                                                return "N / A";
                                        }},
                                    @endfor
                                
                                    @for($i = 1; $i <= 5; $i++) 
                                        { data: 'business_trip', render: function(trip){
                                                if(trip) {
                                                    if(trip.LOCATIONS["end_address{{$i}}"] && trip.LOCATIONS["end_address{{$i}}"].address) {
                                                        return trip.LOCATIONS["end_address{{$i}}"].address;
                                                    }
                                                }
                                                return "N / A";
                                        }},
                                        { data: 'business_trip', render: function(trip){
                                                if(trip) {
                                                    if(trip.LOCATIONS["end_address{{$i}}"] && trip.LOCATIONS["end_address{{$i}}"].passenger) {
                                                        return trip.LOCATIONS["end_address{{$i}}"].passenger + ', [' + trip.LOCATIONS["end_address{{$i}}"].passenger_phone + ']';
                                                    }
                                                }
                                                return "N / A";
                                        }},
                                        { data: 'business_trip', render: function(trip){
                                                if(trip) {
                                                    if(trip.LOCATIONS["end_address{{$i}}"] && trip.LOCATIONS["end_address{{$i}}"].employee_number) {
                                                        return trip.LOCATIONS["end_address{{$i}}"].employee_number;
                                                    }
                                                }
                                                return "N / A";
                                        }},
                                        { data: 'business_trip', render: function(trip){
                                                if(trip) {
                                                    if(trip.LOCATIONS["end_address{{$i}}"] && trip.LOCATIONS["end_address{{$i}}"].passenger_department) {
                                                        return trip.LOCATIONS["end_address{{$i}}"].passenger_department;
                                                    }
                                                }
                                                return "N / A";
                                        }},
                                    @endfor
                                { data: 'TRIP_FARE.km', defaultContent: "",render: function(data, type, row, meta) {
                                            return data ? (data  + " KM") : data;
                                    }
                                }, 
                                { data: 'TOKEN', defaultContent: "",render: function(data, type, row, meta) {
                                        var url = "https://api-quiq.com/production/viajes?token=" + data;
                                        return "<a target='_blank' href=" + url + ">" + url + "</a>";
                                    }
                                },
                                { data: 'COMMENTS', name: 'COMMENTS',  defaultContent:""}, 
                                { data: 'TOKEN', defaultContent: "",render: function(data, type, row, meta) {
                                        let invoiceUrl = "{{route('invoice')}}" + "/" + data;
                                        return "<a target='_blank' href=" + invoiceUrl + ">" + invoiceUrl + "</a>";
                                    }
                                },
                                { data: 'km_local', defaultContent: '0'},
                                { data: 'km_foreign', defaultContent: '0'},
                                { data: 'business_trip', render: function(trip){
                                        if(trip) 
                                            return trip.PASSENGERS_NUMBER - 1;
                                        else 
                                            return 0;
                                }}
                        ],
                        dom: 'Bfrtip',
                        buttons: [ 'copy', 'excel' ],
                        paging: false,
                        order: [],
                        "language": {
                                "url": "{!! asset('datatables/languages/spanish.json') !!}"
                        },
                        createdRow: function( row, data, dataIndex ) {
                            if ( data.ROUTE_STATUS == "CANCELED" ) {
                                $(row).addClass( 'bg-warning bg-lighten-4' );
                            }
                        }
                });

    });

function getTrips(startDate, endDate) {
        $.showPreloader("{{__('strings.loading')}}");
	
        $.ajax({
        url: "{{route('api_user_routes')}}",
        type: "POST",
        contentType: "application/json",
        data: JSON.stringify({
                user_token: '{{Auth::user()->SECURE_TOKEN}}',
                start_date: moment(startDate).utc().format('YYYY-MM-DD HH:mm'),
                end_date: moment(endDate).utc().format('YYYY-MM-DD HH:mm'),
        }),
        dataType: "json",
        success: function (json) {
            if(json.success)  {
        	fillTable(json.data);
            }
            $.hidePreloader(); // hide the preloader
        },
        error: function (err) {
        	console.log(err);
                $.hidePreloader(); 
        }
    });
}


function fillTable(dataSet) {
	table.clear();
	table.rows.add(dataSet).draw();
}
</script>
@endpush