@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')
    <li class="right btn-group">

        <div class="btn-group">
            <button class="btn dropdown-toggle" data-toggle="dropdown" id="truck_nomination_create">
                &nbsp; CREATE NOMINATION
            </button>
        </div><!--btn-group-->
        <button class="btn" onclick="openAdvancedSearch('route_truck_allocation')">
            <span class="icon-search"></span> &nbsp; FILTER
        </button>
    </li>
@endsection
@section('contentinner')

    <style>
        #logistics_modal {
            width: 95%;
            margin-left: -32%;
        }
    </style>
    <div id="route_truck_allocation" class="sidenav">
        <a href="javascript:void(0)" class="closebtn"
           onclick="closeAdvancedSearch('route_truck_allocation')">&times;</a>

        <div style="margin-bottom: 8px">
            <form target="_blank" class="form-inline form-filter" method="get" action="#">
                <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_truck_allocations">FILTER</button>
            </form>
        </div>
    </div>


    <div class="row-fluid">
        <div class="span12">
            <table class="table table-bordered logistics_table table-condensed" id="truck_pending_allocations">
                <thead>
                <tr>
                    <th width='3%'><input type="checkbox" class="checkall"/></th>
                    <th style="width:20%">Horse</th>
                    <th style="width:20%">Trailer</th>
                    <th style="width:30%">Driver</th>
                    <th style="width: 27%">Location</th>
                </tr>
                </thead>
            </table>
        </div><!--span12-->

    </div><!--row-fluid-->

    <script>
        $('#truck_id').select2();
        var calcDataTableHeight = function () {
            var viewportHeight = jQuery(window).height();
            var headerpanel = jQuery('#headerpanel').height();
            var breadcrumbwidget = jQuery('#breadcrumbwidget').height();
            var widgettitle_msghead = jQuery('#widgettitle_msghead').height();
            var footer = jQuery('#footer').height();

            return viewportHeight - (headerpanel + breadcrumbwidget + widgettitle_msghead + footer + 120);

        };
        var mainDataTable = jQuery('#truck_pending_allocations').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 Orders available.",
                    "sInfoEmpty": "No entries to display."
                },
                "initComplete": function (settings, json) {
                    stopSpinner();
                },
                ajax: {
                    url: "{{ route('operations.truck_allocations.import.trucks.data_table') }}",
                    data: function (d) {
                        d.search_field = $('input[name=search_field]').val();
                        d.truck_id = $('#truck_id').val();
                        d.city_id = $('#city_id').val();
                        d.vehicle_type = '{{$cargo_type}}';
                    }
                },
                "sPaginationType": "full_numbers",
                processing: true,
                serverSide: true,
                "columns": [
                    {
                        data: 'checkbox',
                        "class": "dt_checkbox",
                        "orderable": false
                    },
                    {"class": "link", data: 'vehicle'},
                    {"class": "link", data: 'trailer'},
                    {"class": "link", data: 'driver'},
                     {"class": "link", data: 'location'}
                ],
                "fnDrawCallback": function () {
                    // 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
            });

        function reDrawTruckPendingAllocationsTable() {
            mainDataTable.draw();
        }
        $('#filter_truck_allocations').on('click', function (e) {
            e.preventDefault();
            mainDataTable.draw();
        });


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

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

            if (selected_trucks > 0) {

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

                    var vehicle_id = checkRows('vehicle_id');

                    jQuery.ajax({
                            url: "{{ route('operations.truck_allocations.loading_orders.create') }}",
                            type: "GET",
                            beforeSend: function () {
                                startSpinner();
                            },
                            data: {
                                vehicle_id: vehicle_id,
                                type: 'NOMINATION',
                                cargo_type: '{{$cargo_type}}',
                                client_inquiry_id: '{{$client_inquiry_id}}'
                            },
                            success: function (data) {
                                onAjaxSuccess(data, 'POST');
                                jQuery('select[name="cargo_type[]"]').on('change', function () {
                                    var cargo_type = jQuery(this).val();
                                    var table = jQuery(this).parents('table');
                                    var template = jQuery('#truck_subdetails');
                                    var thead, tbody;

                                    switch (cargo_type) {
                                        case 'TANK':
                                            thead = jQuery('#truck_subdetails_head_Tank').find('tr').clone();
                                            tbody = template.find('#truck_subdetails_body_Tank').find('tr').clone();
                                            tbody.find('select').select2();
                                            break;
                                        case 'CONTAINER':
                                            thead = template.find('#truck_subdetails_head_Container').children('tr').clone();
                                            tbody = template.find('#truck_subdetails_body_Container').children('tr').clone();
                                            break;
                                        case 'LOOSE_CARGO':
                                            thead = template.find('#truck_subdetails_head_Loose_cargo').children('tr').clone();
                                            tbody = template.find('#truck_subdetails_body_Loose_cargo').children('tr').clone();
                                            break;
                                        default:
                                            table.find('.truck_subdetails_head').html('');
                                            table.find('.truck_subdetails_body').html('');
                                            break;
                                    }

                                    table.append("<tr><tsd colspan='10'>col-10</td></tr>");
                                    table.find('.truck_subdetails_head').append(thead);
                                    table.find('.truck_subdetails_body').append(tbody);
                                });
                                jQuery('select[name="cargo_type[]"]').each(function () {
                                    var cargo_type = jQuery(this).val();
                                    var table = jQuery(this).parents('table');
                                    var template = jQuery('#truck_subdetails');
                                    var thead, tbody;

                                    switch (cargo_type) {
                                        case 'TANK':
                                            thead = jQuery('#truck_subdetails_head_Tank').find('tr').clone();
                                            tbody = template.find('#truck_subdetails_body_Tank').find('tr').clone();
                                            tbody.find('select').select2();
                                            break;
                                        case 'CONTAINER':
                                            thead = template.find('#truck_subdetails_head_Container').children('tr').clone();
                                            tbody = template.find('#truck_subdetails_body_Container').children('tr').clone();
                                            break;
                                        case 'LOOSE_CARGO':
                                            thead = template.find('#truck_subdetails_head_Loose_cargo').children('tr').clone();
                                            tbody = template.find('#truck_subdetails_body_Loose_cargo').children('tr').clone();
                                            break;
                                        default:
                                            table.find('.truck_subdetails_head').html('');
                                            table.find('.truck_subdetails_body').html('');
                                            break;
                                    }

                                    table.append("<tr><tsd colspan='10'>col-10</td></tr>");
                                    table.find('.truck_subdetails_head').append(thead);
                                    table.find('.truck_subdetails_body').append(tbody);
                                    jQuery('.datepickers').datepicker();
                                });
                            },
                            error: function (xhr, textStatus, error) {
                                console.log(textStatus);
                                console.log(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');
            }


        });

        function formInitializations() {
            jQuery('.searchable_select').select2();
            var generate_trucks = jQuery('#generate_trucks');
            var cargo_fields = jQuery('.cargo_fields');
            cargo_fields.change(function () {
                onCargoFieldChange(jQuery(this));
            });
            var vehicle_fields = jQuery('.vehicle_fields');
            vehicle_fields.change(function () {
                onVehicleFieldChange(jQuery(this));
            });
        }

        function onVehicleFieldChange(changed_vehicle_field) {
            var parent_tr = changed_vehicle_field.parents('tr');
            var trailer_id = parent_tr.find('select[name="trailer_id[]"]');
            var driver_id = parent_tr.find('select[name="driver_id[]"]');
            var cargo_type = parent_tr.find('select[name="cargo_type[]"]');
            var vehicle_id = changed_vehicle_field.val();
            jQuery.ajax({
                url: "{{ route('general_ajax_calls.truck') }}",
                data: {
                    vehicle_id: vehicle_id
                },
                type: "GET",
                dataType: 'xml',
                beforeSend: function () {
                    startSpinner();
                    trailer_id.val('').trigger('change');
                    driver_id.val('').trigger('change');
                    cargo_type.val('').trigger('change');
                    // route_assignment_driver_passport_name.val('');
                    // route_assignment_driver_passport_number.val('');
                },
                success: function (data) {

                    if (data) {
                        var truck = jQuery(data).find('xml').find('truck');

                        var trailer = truck.find('trailer');
                        var driver = truck.find('driver');
                        var is_trailer_assigned = false;
                        var is_driver_assigned = false;
                        if (trailer.find('status').text() != 'NOT_FOUND') {
                            trailer_id.val(trailer.find('trailer_id').text()).trigger('change');
                            if (trailer.find('type_number').text() == 7) {
                                cargo_type.val('TANK').trigger('change');
                            } else {

                            }
                            is_trailer_assigned = true;
                        }

                        if (driver.find('status').text() != 'NOT_FOUND') {
                            driver_id.val(driver.find('driver_id').text()).trigger('change');
                            // route_assignment_driver_passport_name.val(driver.find('passport_name').text());
                            // route_assignment_driver_passport_number.val(driver.find('passport_number').text());
                        }

                        if ((trailer.find('status').text() == 'NOT_FOUND') & (driver.find('status').text() == 'NOT_FOUND')) {
                            alert('DRIVER AND TRAILER ARE NOT ASSIGNED TO THIS TRUCK');
                        }
                        else if ((trailer.find('status').text() != 'NOT_FOUND') & (driver.find('status').text() == 'NOT_FOUND')) {
                            alert('DRIVER IS NOT ASSIGNED TO THIS TRUCK');
                        }
                        else if ((trailer.find('status').text() == 'NOT_FOUND') & (driver.find('status').text() != 'NOT_FOUND')) {
                            alert('TRAILER IS NOT ASSIGNED TO THIS TRUCK');
                        }

                    }
                },
                complete: function () {
                    stopSpinner();
                }
            });
        }

        function onCargoFieldChange(changed_cargo_field) {
            var cargo_type = changed_cargo_field.val();
            var table = changed_cargo_field.parents('table');
            var template = jQuery('#truck_subdetails');
            var thead, tbody;

            switch (cargo_type) {
                case 'TANK':
                    thead = template.find('#truck_subdetails_head_Tank').children('tr').clone();
                    tbody = template.find('#truck_subdetails_body_Tank').children('tr').clone();
                    tbody.find('select').select2();
                    break;
                case 'CONTAINER':
                    thead = template.find('#truck_subdetails_head_Container').children('tr').clone();
                    tbody = template.find('#truck_subdetails_body_Container').children('tr').clone();
                    break;
                case 'LOOSE_CARGO':
                    thead = template.find('#truck_subdetails_head_Loose_cargo').children('tr').clone();
                    tbody = template.find('#truck_subdetails_body_Loose_cargo').children('tr').clone();
                    break;
                default:
                    table.find('.truck_subdetails_head').html('');
                    table.find('.truck_subdetails_body').html('');
                    break;
            }

            table.append("<tr><tsd colspan='10'>col-10</td></tr>");
            table.find('.truck_subdetails_head').html(thead);
            table.find('.truck_subdetails_body').html(tbody);
            jQuery('.datepickers').datepicker();
        }
    </script>
@endsection