@extends('layouts.main', ['title' => 'TRUCKS ALLOCATION'])
@section('navigation')
    <ul class="breadcrumb">
        <li><a href="{{route('home')}}">Dashboard</a><span class="divider">/</span></li>
        <li class="active">Truck Pending Allocations</li>
    </ul>
@stop
@section('title') Enquiry NO. {{$client_enquiry->id}};Client: {{$client_enquiry->client}};Trucks Req: {{$client_enquiry->pending}};Cargo: {{$cargo_type}} @endsection
@section('msghead_menu')
    @if(auth()->user()->can('CREATE RETURN LOADING ORDES'))
        <li class="right btn-group">
            <a class="btn" id="create_loading_order">
                <span class="iconsweets-create"></span> CREATE LOADING ORDER
                <span style="font-size: 10px;color: #51a7c6"> ( alt+g )</span>
            </a>
        </li>
        <li class="right btn-group">
            <button class="btn" onclick="openAdvancedSearch()">
                <span class="icon-search"></span> &nbsp; FILTER
            </button>
        </li>
    @endif
@endsection




@section('contentinner')

    <style>
        #logistics_modal {
            width: 95%;
            margin-left: -32%;
        }
    </style>

    <div id="advanced_search" class="sidenav">
        <a href="javascript:void(0)" class="closebtn" onclick="closeAdvancedSearch()">&times;</a>

        <div style="margin-bottom: 8px">
            <form target="_blank" class="form-inline form-filter" method="get"
                  action="{{route('permits.print')}}">

                <label class="control-label" for="Category">Truck</label>
                <select name="select" width="50px" id="id_from_truck_id" multiple="multiple">
                    <option value="">ALL</option>
                    @foreach($route_assignments as $route_assignment)
                        <option value="{{$route_assignment->route_assignment_id}}">{{$route_assignment->truck}}</option>
                    @endforeach
                </select>
                <button class="btn" style="" id="search-form">FILTER</button>
                {{--<input class="btn" id="print_permits" type="submit" value="PRINT">--}}
            </form>
        </div>
    </div>

    <div class="row-fluid">
        <div class="span12">
            <div class="full-view-mode">
                <table class="table table-bordered table-condensed table-striped logistics_table" style="width: 100%"
                       id="return-loading-order">
                    <thead>
                    <tr>
                        <th style="width: 20px"><input type="checkbox" class="checkall"/></th>
                        <th>Date</th>
                        <th>Horse</th>
                        <th>Trailer</th>
                        {{--<th style="width:30%">Driver</th>--}}
                        <th>Type</th>
                        <th>Destination</th>
                        <th>Location</th>
                    </tr>
                    </thead>
                </table>
            </div><!--span12-->
        </div><!--span12-->
    </div><!--row-fluid-->


    <script>

        jQuery('#id_from_truck_id,#id_from_container,.searchable_select').select2();
        jQuery(function () {
            var oTable = jQuery('#return-loading-order').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({
                    lengthMenu: [
                        [100, 200],
                        ['100 Trucks', '200 Trucks']
                    ],
                    "oLanguage": {
                        "sLoadingRecords": startSpinner(),
                        "sZeroRecords": "No records to display.",
                        "sProcessing": "Please wait - loading records...",
                        "sInfoEmpty": "No entries to display."
                    },
                    ajax: {
                        url: '{{route('operations.truck_allocations.exports.trucks.data_table')}}',
                        data: function (d) {
                            d.id_from_truck_id = jQuery('#id_from_truck_id').val();
                            d.id_from_container = jQuery('#id_from_container').val();
                            d.search = jQuery('div.dataTables_filter input').val();
                        }
                    },
                    "initComplete": function (settings, json) {
                        stopSpinner();
                    },
                    "sPaginationType": "full_numbers",
                    processing: true,
                    serverSide: true,
                    "order": [[ 1, "asc"]],
                    "columns": [
                        {data: 'checkbox'},
                        {data: 'departure_date'},
                        {data: 'truck'},
                        {data: 'trailer'},
                        {data: 'type'},
                        {data: 'destination'},
                        {data: 'location'}
                    ],
                    "fnDrawCallback": function () {
                        {{--jQuery('.delete_return_order').on('click', function () {--}}
                            {{--var td = jQuery(this).parents('td');--}}
                            {{--var route_assignment_id = td.find('.route_assignment_id').val();--}}
                            {{--if (route_assignment_id) {--}}
                                {{--jQuery.ajax({--}}
                                    {{--url: '{{route('return_loading_orders.destroy')}}',--}}
                                    {{--type: 'get',--}}
                                    {{--data: {--}}
                                        {{--route_assignment_id: route_assignment_id--}}
                                    {{--},--}}
                                    {{--success: function (data) {--}}
                                        {{--if (data == 'DONE') {--}}
                                            {{--jQuery('#return-loading-order').dataTable().fnFilter(this.value);--}}
                                        {{--} else {--}}
                                            {{--alert('FAIL TO DELETE ORDER');--}}
                                        {{--}--}}
                                    {{--}--}}
                                {{--});--}}
                            {{--} else {--}}
                                {{--alert('FAIL TO DELETE ORDER');--}}
                            {{--}--}}
                        {{--});--}}

                        // jQuery('.vehicle_id').on('click change', function () {
                            {{--if (jQuery('.vehicle_id:checked').size() > '{{$client_enquiry->pending}}') { logistics_alert('YOU HAVE SELECTED MORE THAN REQUIRED TRUCK', 'Select Dialog');--}}
                            //     (":checkbox:checked").length;
                            //     jQuery(this).removeAttr('checked');
                            // }
                        // });
                    },
                    "bStateSave": true
                });

            jQuery('#search-form').on('click', function (e) {
                searchTable(e);
            });

            function searchTable(e) {
                oTable.draw();
                e.preventDefault();
            }
        });

        jQuery('#create_loading_order').click(function () {

            var selected_trucks = jQuery('.route_id:checked').size();

            if (selected_trucks > 0) {

                {{--if (selected_trucks <= '{{$client_enquiry->pending}}') {--}}

                    var vehicle_id = checkRows('route_id');

                    var url = "{{route('operations.truck_allocations.loading_orders.exports.create')}}";
                    jQuery.ajax({
                        url: url,
                        type: 'GET',
                        data: {
                            'vehicle_id': vehicle_id,
                            'client_enquiry_id': '{{$client_enquiry->id}}'
                        },
                        beforeSend: function () {
                            startSpinner();
                        },
                        success: function (data) {
                            onAjaxSuccess(data, 'POST');
                        },
                        error: function (xhr, textStatus, error) {
                            onAjaxError(xhr, textStatus, error);
                        },
                        complete: function () {
                            stopSpinner();
                        }
                    });

                // } else {
                //     alert('You have selected more than required trucks');
                // }

            }else {
                logistics_alert('Select at least one truck to continue', 'Select Dialog');
            }


        });


        {{--jQuery('#create_loading_order').on('click', function () {--}}
        {{--generateOrders();--}}

        {{--jQuery("#add_sub_contract").each(function () {--}}
        {{--if (jQuery(this).attr('initialized') != 'true') {--}}
        {{--jQuery(this).click(function () {--}}
        {{--var response = jQuery('#add_body_sub_contract').find('table').clone();--}}
        {{--response.find('tbody tr td select').each(function () {--}}
        {{--jQuery(this).select2();--}}
        {{--});--}}
        {{--jQuery('#added_body_sub_contract').append(response);--}}
        {{--jQuery('.date_picker').datepicker();--}}

        {{--jQuery(".remove_sub_contract").on('click', function () {--}}
        {{--jQuery(this).parents('table').remove();--}}
        {{--});--}}
        {{--});--}}
        {{--}--}}
        {{--jQuery(this).attr('initialized', 'true');--}}
        {{--});--}}

        {{--jQuery("#add_from_route_assignment").each(function () {--}}
        {{--if (jQuery(this).attr('initialized') != 'true') {--}}
        {{--jQuery(this).click(function () {--}}
        {{--var route_assignment_id = [];--}}
        {{--jQuery('.route_assignment_id').each(function () {--}}
        {{--route_assignment_id.push(jQuery(this).val());--}}
        {{--});--}}
        {{--jQuery.ajax({--}}
        {{--url: '{{route('return.loading-orders.more-routes')}}',--}}
        {{--type: 'get',--}}
        {{--data: {--}}
        {{--route_assignment_id: route_assignment_id--}}
        {{--},--}}
        {{--success: function (html) {--}}
        {{--jQuery('#client_return_loading_order_more_routes').appendTo('body').modal('show');--}}
        {{--jQuery('#client_return_loading_order_more_routes_body').empty().append(html);--}}
        {{--}--}}
        {{--});--}}
        {{--});--}}
        {{--}--}}
        {{--jQuery(this).attr('initialized', 'true');--}}
        {{--});--}}

        {{--});--}}

        {{--jQuery('#client_return_loading_order_more_routes').on('hidden.bs.modal', function (e) {--}}
        {{--var more_route_assignment_id = [];--}}
        {{--jQuery(this).find('.more_route_assignment_id').each(function () {--}}
        {{--if (jQuery(this).is(':checked')) {--}}
        {{--more_route_assignment_id.push(jQuery(this).val());--}}
        {{--}--}}
        {{--});--}}
        {{--jQuery.ajax({--}}
        {{--url: '{{route('return.loading-orders.append-more-routes')}}',--}}
        {{--type: 'get',--}}
        {{--data: {--}}
        {{--route_assignment_id: more_route_assignment_id--}}
        {{--},--}}
        {{--success: function (html) {--}}
        {{--jQuery('#client_return_loading_order').modal('show');--}}
        {{--jQuery('#return_order_from_route_table').append(html);--}}
        {{--jQuery('.date_picker').datepicker();--}}
        {{--jQuery('.return_cargo_driver_1').select2();--}}
        {{--jQuery(".remove_sub_contract").on('click', function () {--}}
        {{--jQuery(this).parents('table').remove();--}}
        {{--});--}}
        {{--}--}}
        {{--});--}}
        {{--});--}}





        function closeAdvancedSearch() {
            jQuery("#advanced_search").css({
                "width": 0,
                'padding-left': 0
            });
        }
        function openAdvancedSearch() {
            jQuery("#advanced_search").css({
                "width": 230,
                'padding-left': 30
            });
        }
    </script>
@endsection