@extends('layouts.main')
@section('title')
    Trailers
@stop
@section('navigation')
    <ul class="breadcrumb">
        <li><a href="{{route('home')}}">Dashboard</a> <span class="divider">/</span></li>
        <li class="active">Trailers</li>
    </ul>
@stop
@section('msghead_menu')
    <li class="right btn-group">
        @if(Auth::user()->can('EMPTY VEHICLES'))
            <button class="btn msgtrash btn-danger" style="margin-right: 4px" id="delete_all_trucks">
                TRUNCATE
            </button>
        @endif

        <div class="btn-group">
            <button class="btn dropdown-toggle" data-toggle="dropdown">
                <i class="icon-th"></i> &nbsp;OPTIONS <span class="caret"></span>
            </button>
            <ul class="dropdown-menu">
                @if(Auth::user()->can('ADD VEHICLES'))
                    <li><a onclick="modelShow('addNewTrailer')"><i class="icon-plus"></i> &nbsp;ADD TRAILER</a></li>
                @endif
                @if(Auth::user()->can('PRINT VEHICLE'))
                    <li>
                        <a href="{{route('trailers.print')}}" target="_blank"><i class="icon-plus"></i> &nbsp;PRINT ALL</a>
                    </li>
                    <li>
                        <a href="{{route('idle.trailers.print')}}" target="_blank"><i class="icon-plus"></i> &nbsp;PRINT IDLE</a>
                    </li>
                @endif
            </ul>
        </div><!--btn-group-->
    </li>
@stop
@section('contentinner')
    <style>
        .form-filter {
            border-top: 1px solid #dddddd;
            border-bottom: 1px solid #dddddd;
            color: #0e4722;
            font-weight: normal;
            text-align: center;
            padding-bottom: 4px;
        }
    </style>
    <div class="row-fluid">
        <div class="span12">
            @if(Auth::user()->can('ADD VEHICLES'))
                <div style="margin-bottom: 8px">
                    <form class="form-inline form-filter" id="vehicle_import_excel"
                          action="{{route('trailers.import-excel.store')}}" method="post"
                          enctype="multipart/form-data">
                        <input type="file" name="import_file"/>
                        <button class="btn btn-mini btn-primary">Import File</button>
                        {{--<button class="btn btn-mini" id="download_sample_file">Download Sample--}}
                        {{--here--}}
                        {{--</button>--}}
                    </form>
                </div>
            @endif
            <div class="clearfix"></div>
            <div class="row-fluid">
                <div class="span12">
                    {{--*/ $type = 'TRAILER' /*--}}
                    @include('vehicles.includes._vehicle',compact('type'))
                </div><!--span12-->
            </div><!--row-fluid-->
            @include('vehicles.trailers.model')
            <script>
                jQuery(function () {
                    var oTable = jQuery('#vehicles-list').dataTable({
                        "oLanguage": {
                            "sLoadingRecords": "Please wait - loading records...",
                            "sZeroRecords": "No records to display.",
                            "sProcessing": "Please wait - loading records...",
                            "sInfoEmpty": "No entries to display."
                        },
                        ajax: {
                            url: '{{route('data-tables.vehicles.index',array('type'=>'trailer'))}}'
//                    data: function (d) {
//                        d.starting_date = jQuery('#starting_date').val();
//                        d.expire_date = jQuery('#expire_date').val();
//                        d.permit_type = jQuery('#select').val();
//                        d.search = jQuery('div.dataTables_filter input').val();
//                    }
                        },
                        "sPaginationType": "full_numbers",
                        processing: true,
                        serverSide: true,
                        "columns": [
                            {data: 'checkbox'},
                            {data: 'registration_number'},
                            {data: 'chassis_number'},
                            {data: 'model'},
                            {data: 'trailer_registration_number'},
                            {data: 'category'},
//                            {data: 'status'},
                            {data: 'location'},
                            {data: 'action'}
                        ],
                        "bStateSave": true

                    });
                });

                function editRecordByURL(url) {
                    jQuery.ajax({
                        url: url,
                        type: "GET",
                        dataType: "html",
                        beforeSend: function () {
                            startSpinner();
                        },
                        success: function (data) {
                            jQuery('#edit_form').empty().append(data);
                            jQuery('#edit_model').appendTo("body").modal('toggle');
                            $('select').select2();

                            jQuery('#edit_route_form').on('submit', function (e) {
                                e.preventDefault();
                                var form = $(this);
                                var formAction = form.attr('action');
                                var formMethod = 'PUT';
                                var formData = form.serialize();

                                jQuery.ajax({
                                    url: formAction,
                                    type: formMethod,
                                    data: formData,
                                    success: function (data) {
                                        console.log(data);

                                        if (data.state === 'Done') {
                                            jQuery.jGrowl(data.msg);
                                            resetFormAndClose(form);
                                            $('#vehicles-list').dataTable().fnFilter(this.value);
                                        } else if (data.state === 'Fail') {
                                            jQuery.jGrowl(data.msg);
                                        }
                                    },
                                    error: function (data) {
                                        console.log('Error: ');
                                        console.log(data);
                                    }
                                });

                            });

                        },
                        complete: function () {
                            stopSpinner()
                        },
                        error: function (data) {
                            console.log('Error: ');
                            console.log(data);
                        }
                    });
                }

                jQuery('#delete_all_trucks').click(function () {
                    swal({
                                title: "Are you sure?",
                                text: "You will not be able to recover this imaginary file!",
                                type: "warning",
                                showCancelButton: true,
                                confirmButtonColor: "#DD6B55",
                                confirmButtonText: "Yes, delete it!",
                                closeOnConfirm: false
                            },
                            function () {
                                swal({title: "", text: "", timer: 0, showConfirmButton: false});
                                jQuery.ajax({
                                    type: "post",
                                    url: "{{route('trailers.empty')}}",
                                    success: function (data) {
                                        console.log(data);

                                        if (data.state === 'Done') {
                                            jQuery.jGrowl(data.msg);
                                            jQuery('#vehicles-list').dataTable().fnFilter(this.value);
                                        } else if (data.state === 'Fail') {
                                            jQuery.jGrowl(data.msg);
                                        }
                                    },
                                    error: function (data) {
                                        console.log('Error: ');
                                        console.log(data);
                                    }
                                });
                            });
                });
            </script>
@stop