@extends('layouts.main', ['title' => 'Driver Management'])
@section('navigation')
    <ul class="breadcrumb">
        <li><a href="{{route('home')}}">Dashboard</a> <span class="divider">/</span></li>
        <li class="active">Drivers Management</li>
        </li>
    </ul>
@stop
@section('title')
    Drivers
@endsection
@section('msghead_menu')
    <li class="right btn-group">
        <div class="btn-group">
            <button class="btn" onclick="openAdvancedSearch('drivers_filter')">
                <span class="icon-search"></span> &nbsp; FILTER
            </button>
{{--            <button class="btn" onclick="create('{{ route('drivers.create') }}')"--}}
{{--                    onclick="modelShow('create_driver_modal')"--}}
{{--            >--}}
{{--                <span class="icon-search"></span> &nbsp; CREATE DRIVER--}}
{{--            </button>--}}
            {{--<button class="btn dropdown-toggle" data-toggle="dropdown">--}}
                {{--<i class="icon-th"></i> &nbsp;OPTIONS <span class="caret"></span>--}}
            {{--</button>--}}
            {{--<ul class="dropdown-menu">--}}
                {{--<li><a ><i class="icon-plus"></i> &nbsp;Create Driver</a></li>--}}
            {{--</ul>--}}
        </div><!--btn-group-->
    </li>
@endsection
@section('contentinner')
    <!-- Main Table -->
    <div id="drivers_filter" class="sidenav">
        <a href="javascript:void(0)" class="closebtn"
           onclick="closeAdvancedSearch('drivers_filter')">&times;</a>

        <div style="margin-bottom: 8px">
            <form target="_blank" class="form-inline form-filter" method="get"
                  action="#">

                <label class="control-label" for="Category">Driver</label>
                <select name="select" width="100%" id="driver_id" class="searchable_select" multiple>
                    <option value="">ALL</option>
                    @foreach($drivers as $driver)
                        <option value="{{$driver->employee_id}}">{{$driver->driver}}</option>
                    @endforeach
                </select>
                <label class="control-label" for="Category">Truck</label>
                <select name="select" width="100%" id="truck_id" class="searchable_select" multiple>
                    <option value="">ALL</option>
                    @foreach($trucks as $truck)
                        <option value="{{$truck->id}}">{{$truck->registration_number}}</option>
                    @endforeach
                </select>


                <button class="btn" style="" id="filter_driver_botton">FILTER</button>
                {{--<input class="btn" id="print_permits" type="submit" value="PRINT">--}}
            </form>
            <form class="form-inline form-filter" id="driver_import_excel"
                  action="{{route('operations.drivers_management.excel_import')}}" method="post"
                  enctype="multipart/form-data">
                <input type="file" name="import_file" class="import_file"/>
                <button class="btn btn-mini btn-primary">Import File</button>
                {{--<button class="btn btn-mini" id="download_sample_file">Download template</button>--}}
            </form>
        </div>
    </div>

    <div class="row-fluid">
        <div class="span12">
            <table class="table table-bordered table-condensed logistics_table" id="drivers">
                <thead>
                    <tr>
                        <th style="width: 10%">License No</th>
                        <th style="width: 10%">Code</th>
                        <th style="width: 35%">Name</th>
                        <th style="width: 10%">Phone</th>
                        <th style="width: 10%">Truck</th>
                        <th style="width: 10%">License Status</th>
                        <th style="width: 10%">Passport Status</th>
                        <th style="width: 5%">Action</th>
                    </tr>
                </thead>
            </table>
        </div><!--span12-->
    </div><!--row-fluid-->
    
    
    <script>
        $('#driver_id,#truck_id').select2();
        var dt = jQuery('#drivers');
        var mainDataTable = dt.on('error.dt', function (e, settings, techNote, message) {
            console.log('An error has been reported by DataTables: ', message);
            $.jGrowl("ERROR LOADING DATA!", {header: 'Important'});
            stopSpinner();
        })
            .DataTable({
                "oLanguage": {
                    "sLoadingRecords": startSpinner(),
                    "sZeroRecords": "No Orders available.",
                    "sInfoEmpty": "No entries to display."
                },
                ajax: {
                    url: "{{ route('drivers_management.indexDatas') }}",
                    data: function (d) {
                        d.search_field = $('input[name=search_field]').val();
                        d.driver_id = $('#driver_id').val();
                        d.truck_id = $('#truck_id').val();
                    }
//                         error: function(xhr, textStatus, error) {
//                             onAjaxError(xhr, textStatus, error);
//                         }
                },
                "initComplete": function (settings, json) {
                    stopSpinner();
                },
                scrollCollapse: true,
                "sPaginationType": "full_numbers",
                processing: true,
                serverSide: true,
                "order": [[ 2, "asc" ]],
                "columns": [
//                {data: 'checkbox'},
                    {"class": "link", data: 'licence_number'},
                    {"class": "link", data: 'code'},
                    {"class": "link", data: 'driver'},
                    {"class": "link number", data: 'phone_number'},
                    {"class": "link", data: 'truck'},
                    {"class": "link", data: 'licence_status'},
                    {"class": "link", data: 'passport_status'},
//                {"class": "link", data: 'location'},
                    {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: "http://localhost:8000/payment-vouchers/delete",
                            data: {
                                payment_voucher_id: payment_voucher_id
                            },
                            success: function (data) {
                                if (data == 'DONE') {
                                    notify('PAYMENT VOUCHER DETELETED SUCCESSFUL!');
                                    jQuery('#payments-vouchers-list-1').dataTable().fnFilter(this.value);
                                } else {
                                    alert("FAIL TO DELETE PAYMENT VOUCHER!");
                                }
                            },
                            error: function (data) {

                            }
                        });
                        return false;
                    });
                },
                "bStateSave": true
            });
        $('#filter_driver_botton').on('click', function (e) {
            e.preventDefault();
            mainDataTable.draw();
        });
    </script>
  @endsection