@extends('layouts.master')
@php
    $states = config('custom.states');
@endphp
@section('content')
    <!-- <div class="content d-flex flex-column flex-column-fluid" id="kt_content">
        <div id="kt_content_container" class="container-xxl">
             <div class="d-flex flex-wrap flex-stack pb-7">
                <div class="d-flex flex-wrap align-items-center my-1">
                    <h3 class="fw-bold me-5 my-1">Ltl <span class="text-muted">Group</span>
                    </h3>
                    <h3 class="fw-bold me-5 my-1"></h3>
                </div>
            </div>
        </div>
    </div> -->
    <style>

        .ajax-loader,
.ajax-loader div {
  box-sizing: border-box;
}
.ajax-loader {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.ajax-loader div {
  position: absolute;
  top: 33.33333px;
  width: 13.33333px;
  height: 13.33333px;
  border-radius: 50%;
  background: currentColor;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.ajax-loader div:nth-child(1) {
  left: 8px;
  animation: ajax-loader1 0.6s infinite;
}
.ajax-loader div:nth-child(2) {
  left: 8px;
  animation: ajax-loader2 0.6s infinite;
}
.ajax-loader div:nth-child(3) {
  left: 32px;
  animation: ajax-loader2 0.6s infinite;
}
.ajax-loader div:nth-child(4) {
  left: 56px;
  animation: ajax-loader3 0.6s infinite;
}
@keyframes ajax-loader1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes ajax-loader3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes ajax-loader2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(24px, 0);
  }
}
    
</style>
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0">{{ __('Ltl Builder Outbound') }}</h1>
                </div>
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">{{ __('Home') }}</a></li>
                        <li class="breadcrumb-item active">{{ __('LTL Builder') }}</li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
    <section class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-12">
                    <div class="card card-primary">
                        <div class="card-header">
                            <h3 class="card-title m-0">Build</h3>
                        </div>
                        <div class="col-md-12 panels">
                            <div class="panel panel-success gradient-diag1">
                                <div class="panel-body pt-3 pb-3">
                                    <select class="form-control" id="selected_group_buildtab" style="overflow-y:scroll;">
                                        <option id="0">Select Build </option>
                                        @foreach ($group_data as $data)
                                            <option id="{{ $data->id }}" data-id="{{ $data->id }}"
                                                value="{{ $data->tlorder_ids }}">Build {{ $data->id }}</option>
                                        @endforeach
                                    </select>
                                    <table class="table table-hover" id="droptbl">
                                        <thead>
                                            <tr class="row-mid">
                                                <th>PRO #</th>
                                                <th>SHIPPER</th>
                                                <th>DESTINATION</th>
                                                <th>DELIVER BY</th>
                                                <th>TOTAL CHARGES</th>
                                                <th>PALLETS / PIECES</th>
                                                <th>WEIGHT / CUBE</th>
                                                <th>Lineal Ft</th>
                                                <th>STATUS</th>
                                                <th>ACTION</th>
                                            </tr>
                                        </thead>
                                        <tbody class="ui-sortable">
                                        </tbody>
                                    </table>
                                    <hr>
                                    <div class="row">
                                        <div class="col-md-12 d-flex">
                                            <div id="bulid_button">
                                                <form method="POST">
                                                    <input id="new_ids" type="hidden" name="idsss">
                                                    <button type="button" onclick="return built();"
                                                        class="btn btn-primary mr-2">Built
                                                        It</button>
                                                </form>
                                            </div>
                                            <div id="update_button" style="display: none;">
                                                <button type="button" onclick="return update();"
                                                    class="btn btn-primary mr-2">Update
                                                    It</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card p-3">
                        <div class="panel-colorize gradient-diag1">
                            <div class="panel-line-top panel-line-bottom text-center">
                                <div class="row">
                                    <div class="col-md-2">
                                        <h4 class="panel-text-dk" id="total_charges">0</h4>
                                        <h4 class="panel-text-dk" style="display:none;" id="data_id">'0',</h4>
                                        <h5>Total Charges</h5>
                                    </div>
                                    <div class="col-md-2">
                                        <h4 id="total_pallets" class="panel-text-dk">0</h4>
                                        <h5>Total Pallets</h5>
                                    </div>
                                    <div class="col-md-2">
                                        <h4 id="total_pieces" class="panel-text-dk">0</h4>
                                        <h5>Total Pieces</h5>
                                    </div>
                                    <div class="col-md-2">
                                        <h4 id="total_cube" class="panel-text-dk">0</h4>
                                        <h5>Total Cubes</h5>
                                    </div>
                                    <div class="col-md-2">
                                        <h4 id="total_feet" class="panel-text-dk">0</h4>
                                        <h5>Lineal Ft</h5>
                                    </div>
                                    <div class="col-md-2">
                                        <h4 id="total_lbs" class="panel-text-dk">0</h4>
                                        <h5>Total Lbs</h5>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="card">
                        <div class="card-body table-responsive p-0">
                            <table class="table table-hover " id="tbls">
                                <thead>
                                    <tr>
                                        <th class="text-uppercase">{{ __('BILL') }} #</th>
                                        <th class="text-uppercase">{{ __('PRO') }} #</th>
                                        <th class="text-uppercase">{{ __('SHIPPER') }}</th>
                                        <th class="text-uppercase">{{ __('CONSIGNEE') }}</th>
                                        <th class="text-uppercase">{{ __('Charges') }}</th>
                                        <th class="text-uppercase">{{ __('WEIGHT') }}/{{ __('Cube') }}</th>
                                        <th class="text-uppercase">{{ __('PLT') }}/{{ __('PCS') }}</th>
                                        <th class="text-uppercase">{{ __('Ln ft.') }}</th>
                                        <th class="text-uppercase">{{ __('Status') }}</th>
                                        <th></th>
                                    </tr>
                                </thead>
                                <tbody>
                                     @php

                                            $zoneArr = [];
                                        @endphp
                                    @forelse ($results as $key => $value)
                                       
                                        @if (!in_array($value->zone, $zoneArr))
                                            @php
                                                $zoneArr[] = $value->zone;  
                                            @endphp
                                            <tr id="zone{{ $value->zone }}">
                                                <td colspan="10" class="text-center">
                                                    <h4><b>{{ __('Zone') }}:
                                                                                                                    </b></h4>
                                                </td>
                                            </tr>
                                        @endif
                                        @if ($value->status == 'ATDOC')
                                            <tr style="text-transform: uppercase;" class="row-mid columnmove"
                                                id="{{ $value->bidid }}">
                                                <td><a href=""><b>{{ $value->bidid }}</b></a></td> {{-- route('load.edit', $value->id) --}}
                                                <td><b>{{ $value->loadid }}</b></td>
                                                <td>
                                                    <b>{{ $value->mc_id }}</b>
                                                    <br>
                                                    {{ date('D m/d', strtotime($value->pick_date)) }}
                                                </td>
                                                <td>
                                                    <b>{{ $value->delivery_location }}</b>
                                                    <br>
                                                    {{ $value->del_city .
                                                        ', ' .
                                                        $value->del_state .
                                                        ', ' .
                                                        $value->del_zip .
                                                        ' - ' .
                                                        date('m/d/Y h:i A', strtotime($value->deliver_date)) }}
                                                    <br>
                                                    {{ $value->Deliver_Notes }}
                                                </td>
                                                <td><b>{{ number_format($value->total_charge, 2) }}</b></td>
                                                <td><b>S3:&nbsp;&nbsp;&nbsp;&nbsp;{{ $value->weight }}/{{ $value->total_cube }}<br><a href="javascript:void(0)" onclick="verifyCargoModal({{ $value->id }}, 'ltl_builder');">V4:</a>&nbsp;&nbsp;&nbsp;&nbsp;{{ $value->weight }}/{{ $value->cube }}</b></td>
                                                <td><b>{{ $value->pallets }}/{{ $value->pieces }}<br>{{ $value->ADMIN_PALLETS }}/{{ $value->ADMIN_PIECES }}<b></td>
                                                <!--<td><b>{{ $value->total_ln_ft }}/{{ $value->ADMIN_LENGTH_1 }}</b></td>-->
                                                <td><b>{{ $value->total_ln_ft }}/{{ $value->length_1 }}</b></td>
                                                
                                                <td><b><span
                                                            class='badge badge-success'>{{ strtoupper($value->status) }}</span></b>
                                                </td>
                                                <td><button type="button" id="{{ $value->bidid }}"
                                                        onclick="add_row(this);" class="btn btn-primary btn-sm"><i
                                                            class="fa fa-plus-circle" aria-hidden="true"></i> Add</button>
                                                </td>
                                                
                                            </tr>
                                        @else
                                            <tr class="row-mid columnmove" id="{{ $value->bidid }}">
                                                <td><a href=""><b>{{ $value->bidid }}</b></a></td> {{-- route('load.edit', $value->id) --}}
                                                <td><b>{{ $value->loadid }}</b></td>
                                                <td>
                                                    <b>{{ $value->mc_id }}</b>
                                                    <br>
                                                    {{ date('D m/d', strtotime($value->pick_date)) }}
                                                </td>
                                                <td>
                                                    <b>{{ $value->delivery_location }}</b>
                                                    <br>
                                                    {{ $value->del_city .
                                                        ', ' .
                                                        $value->del_state .
                                                        ', ' .
                                                        $value->del_zip .
                                                        ' - ' .
                                                        date('m/d/Y h:i A', strtotime($value->deliver_date)) }}
                                                    <br>
                                                    {{ $value->Deliver_Notes }}
                                                </td>
                                                 <td><b>{{ number_format($value->total_charge, 2) }}</b></td>
                                                <td><b>S5:&nbsp;&nbsp;&nbsp;&nbsp;{{ $value->weight }}/{{ $value->total_cube }}<br><a href="javascript:void(0)" onclick="verifyCargoModal({{ $value->id }}, 'ltl_builder');">V6:</a>&nbsp;&nbsp;&nbsp;&nbsp;{{ $value->weight }}/{{ $value->cube }}</b></td>
                                                <td><b>{{ $value->pallets }}/{{ $value->pieces }}<br>{{ $value->ADMIN_PALLETS }}/{{ $value->ADMIN_PIECES }}<b></td>
                                                <!--<td><b>{{ $value->total_ln_ft }}/{{ $value->ADMIN_LENGTH_1 }}</b></td>-->
                                                <td><b>{{ $value->total_ln_ft }}/{{ $value->length_1 }}</b></td>
                                                <td>
                                                    @if ($value->status == 'PENDING' || $value->status == 'ASSIGNED' || $value->status == 'PICKED')
                                                        <b><span
                                                                class='badge badge-danger'>{{ strtoupper($value->status) }}</span></b>
                                                    @else
                                                        <b><span
                                                                class='badge badge-success'>{{ strtoupper($value->status) }}</span></b>
                                                    @endif
                                                </td>
                                                <td><button type="button" id="{{ $value->bidid }}"
                                                        onclick="add_row(this);" class="btn btn-primary btn-sm"><i
                                                            class="fa fa-plus-circle" aria-hidden="true"></i> Add</button>
                                                </td>
                                            </tr>
                                        @endif
                                    @empty
                                        <tr>
                                            <td colspan="10" style="text-align: center;">No Data Found</td>
                                        </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <div class="modal fade" id="builtModel" tabindex="-1" role="dialog" aria-labelledby="builtModelLabel"
        aria-hidden="true">
        <div class="modal-dialog" style="max-width: 75%;">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="builtModelLabel">{{ __('Build Confirmation') }}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <table class="table table-hover" style="width: 100%;">
                        <thead>
                            <tr>
                                <th class="text-uppercase">{{ __('TRACE NO') }}</th>
                                <th class="text-uppercase">{{ __('SHIPPER') }}</th>
                                <th class="text-uppercase">{{ __('DESTINATION') }}</th>
                                <th class="text-uppercase">{{ __('Deliver By') }}</th>
                                <th class="text-uppercase">{{ __('PALLETS / PIECES') }}</th>
                                <th class="text-uppercase">{{ __('Weight / Cube') }}</th>
                                <th class="text-uppercase">{{ __('Ln Feet') }}</th>
                                <th class="text-uppercase">{{ __('Local Pay') }}</th>
                                <th class="text-uppercase">{{ __('Status') }}</th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody id="orders_data">

                        </tbody>
                    </table>
                    <div id="counts_data" class="mt-2">

                    </div>
                    <form action="{{ route('ltl_builder.submit_build') }}" method="POST" id="build-form">
                        @csrf
                        <input type="hidden" name="tlf" value="" id="tlf">
                        <input type="hidden" name="tlbs" value="" id="tlbs">
                        <input type="hidden" name="type" value="outbound" id="type">
                        <input type="hidden" name="orderids" value="" id="orderids">
                        <div class="form-group">
                            <label for="form-label"></label>
                            <textarea id="notes" name="notes" class="form-control" rows="5"></textarea>
                        </div>
                        <div class="float-right">
                            <button type="submit" class="btn btn-primary"><i class="fa fa-check"></i>
                                Confirm</button>
                            <button type="button" onclick="$('#builtModel').modal('hide');" class="btn btn-primary"><i
                                    class="fa fa-times"></i> Cancel</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection()
@section('script')
<link rel="stylesheet"
        href="https://cdnjs.cloudflare.com/ajax/libs/jquery-timepicker/1.13.18/jquery.timepicker.min.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-timepicker/1.13.18/jquery.timepicker.min.js"></script>
    <script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
    <script>
        // $('.timepick').timepicker();

        // var format = ""
        // var f = format.toLowerCase()
        // let result = f.replace("y", "Y");
        // var datetimeformat = result;

        // $(".datepick").each(function() {
        //     $(this).datetimepicker({
        //         format: datetimeformat
        //     });
        // });

        $("#droptbl tbody").sortable().disableSelection();

        function add_row(e) {
            var getid = $(e).attr('id');
            $('#' + getid).hide('fadeOut');
            var url = "{{ route('ltl_builder.get_order_data', '@') }}";
            url = url.replace('@', getid);

            $.ajax({
                url: url,
                cache: false,
                dataType: "json",
                success: function(html) {
                    $('#droptbl').find('tbody:last').append(html.data);
                    $("#tbls tbody").find("#" + getid).remove();
                    $('#' + getid).show('fadeIn');
                    var trowid;
                    var tcharge = 0;
                    var tpallets = 0;
                    var tcudes = 0;
                    var tfeets = 0;
                    var tlbss = 0;
                    trowid = $('#data_id').text() + "," + (html.row_id);
                    $('#data_id').text(trowid);
                    tcharge = parseInt($('#total_charges').text(), 10) + parseInt(html.charge, 10);
                    $('#total_charges').text(tcharge);
                    tpallets = parseInt($('#total_pallets').text(), 10) + parseInt(html.pallets, 10);
                    $('#total_pallets').text(tpallets);
                    tcudes = parseFloat($('#total_cube').text(), 10) + parseFloat(html.cube, 10);
                    $('#total_cube').text(Math.round(tcudes * 100) / 100);
                    tfeets = parseFloat($('#total_feet').text()) + parseFloat(html.length);
                    $('#total_feet').text(tfeets);
                    tlbss = parseInt($('#total_lbs').text(), 10) + parseInt(html.lbs, 10);
                    $('#total_lbs').text(tlbss);
                    tfeets = parseFloat($('#total_pieces').text()) + parseFloat(html.pieces);
                    $('#total_pieces').text(tfeets);
                }
            });
        }

        function built() {
            curr_id = $('#data_id').text();
            if (curr_id != "'0',") {
                var sorted = $("#droptbl tbody").sortable("toArray");
                console.log(sorted);
                $('#new_ids').attr('value', sorted);
                var new_ids = $('#new_ids').val();

                $.ajax({
                    url: "{{ route('ltl_builder.get_orders_data') }}",
                    mrthod: "GET",
                    data: {
                        new_ids: new_ids
                    },
                    success: function(data) {
                        var html = JSON.parse(data);
                        $('#orders_data').html(html.data);
                        $('#counts_data').html(html.data2);
                        $('#tlbs').val(html.lbs);
                        $('#tlf').val(html.tlf);
                        $('#orderids').val(html.orderids);
                        $('#builtModel').modal('show');
                    },
                    error: function(error) {
                        toastr.error(error);
                    }
                });
            } else {
                alert("Please Choose the Destination");
                return false;
            }
        }

        $('#build-form').on('submit', function(e) {
            if ($('#tlf').val() > 53 || $('#tlbs').val() > 40000) {
                if ($('#notes').val() == "") {
                    alert('Please Enter notes');
                    return false;
                }
            }

            $('#build-form').submit();
        });

        $(document).on('change', "#DRIVER_ID", function() {
            if ($(this).val() == '0') {
                $("#DRIVER_NAME").val('');
                $("#DCELL").val('');
                return false;
            }

            let name = $(this).find('option:selected').attr('data-drivername');
            let phone = $(this).find('option:selected').attr('data-driverphone');

            $("#DRIVER_NAME").val(name);
            $("#DCELL").val(phone);
        });

        $(document).on('change', '#selected_group_buildtab', function() {
            $body = $("body");
            var val = $(this).val();
            var gid = $('#selected_group_buildtab option:selected').val();
            $('#selected_group').val(gid).attr("selected", "selected");
            var buildid = $(this).find('option:selected').attr('id');
            $("#hidden_build").val(buildid);
            $("#curr_id").val(buildid);

            if (val != 'Select Build') {
                $('#update_button').show();
                $('#load_button').show();
                $('#view_button').show();
                $('#bulid_button').hide();
                $body.addClass("loading");
                // $('.ui-sortable').html('<div id="custom-loader" class="custom-datatable-loader flex-column justify-content-center align-items-center"><img src="{{ asset("img/ajax-loader1.gif") }}" alt="Loading..."></div>');
                $.ajax({
                    url: "{{ route('ltl_builder.get_orders_data') }}",
                    method: "GET",
                    data: {
                        new_ids: val,
                        from: 'select'
                    },
                    beforeSend: function () {//We add this before send to disable the button once we submit it so that we prevent the multiple click
                        $('#droptbl').find('tbody').html("");
                        ajaxLoader(".ui-sortable", "show");
                    },
                    success: function(data) {
                        var html = JSON.parse(data);
                        $('#droptbl').find('tbody').html("");
                        $('#droptbl').find('tbody').append(html.data);
                        if (html.charge != null) {
                            $('#total_charges').text(html.charge);
                        }
                        if (html.pallets != null) {
                            $('#total_pallets').text(html.pallets);
                        }
                        if (html.pieces != null) {
                            $('#total_pieces').text(html.pieces);
                        }
                        if (html.cube != null) {
                            $('#total_cube').text(html.cube);
                        }
                        if (html.length != null) {
                            $('#total_feet').text(html.length);
                        }
                        if (html.lbs != null) {
                            $('#total_lbs').text(html.lbs);
                        }
                        $body.removeClass("loading");
                        // $("#custom-loader").hide();
                    },
                    complete: function() {
                        ajaxLoader(".ui-sortable", "hide");
                    }
                });

                var trowid;
                trowid = $('#data_id').text('');
                $('#data_id').text(gid);
            } else {
                alert("Please Select the Group");
                $('#data_id').text('');
                $('#bulid_button').show();
                $('#update_button').hide();
                $('#load_button').hide();
                $('#view_button').hide();
                $('#droptbl').find('tbody').html("");
            }
        });

        function ajaxLoader(selector, action) 
        {
            var $class = "ajax-loader";

            $html = '<div class="d-flex"></div><div class="'+$class+' justify-content-center align-items-center"><div></div><div></div><div></div><div></div></div></div>';

            if(action == "show") {
                $($html).insertBefore(selector);
            } else if(action == "hide") {
                $("."+$class).hide();
            }
            
        }

        function update() {
            curr_id = $('#data_id').text();
            if (curr_id != "'0',") {
                var sorted = $("#droptbl tbody").sortable("toArray");
                var main_id = $('#selected_group_buildtab option:selected').attr('id');
                curr_id = sorted.join(',');

                $.ajax({
                    url: "{{ route('ltl_builder.update_build') }}",
                    method: "POST",
                    data: {
                        curr_id: curr_id,
                        main_id: main_id,
                        _token: '{{ csrf_token() }}'
                    },
                    success: function(data) {
                        if (data.status == true) {
                            toastr.success(data.message);
                            window.location.reload();
                        } else {
                            toastr.error(data.message);
                        }
                    },
                    error: function(xhr, status, error) {
                        toastr.error(xhr.responseText);
                    }
                });
            }
        }

        function remove_tr(c)
        {
           
           
           
            //var removeid=$(c).attr('id');
            //alert(removeid);
            // $.each($("#droptbl tbody").find("#"+c), function() {
            // 				$(this).hide();
            // 				});

            var curr_id = $('#data_id').text();
            curr_id = curr_id.slice(0, -1);


            // done animating, remove

            $("#droptbl tbody").find("#" + c).fadeOut();
    // ------------------------------------------------------------------------------- COMMENT CODE
            // $.ajax({
            //     url: "fflboard-db-demo.php?action=getTr&dlid=" + c + "&addid=" + curr_id,
            //     cache: false,
            //     dataType: "json",
            //     success: function (html) {
    
    //                 $("#droptbl tbody").find("#" + c).remove();
    //                 //$('#droptbl').find('tbody:last').append(html.data);
    // //                $("#tbls tbody").find("#" + c).show();
    //                 //$('#tbls').find('tbody:last').append(html.data);
    //                 var trowid;
    //                 var tpallets = $('#total_pallets').text();
    //                 var tcudes = $('#total_cube').text();
    //                 var tfeets = $('#total_feet').text();
    //                 var tlbss = $('#total_lbs').text();
    //                 //remove the id
    //                 var id = "," + c + ",";
    //                 //alert(id);
    //                 trowid = $('#data_id').text().replace(id, '');
    //                 trowid = $.trim(trowid);
    // ------------------------------------------------------------------------------- COMMENT CODE END

    // ----------------------------------- FOR FROM RIGHT TO LEFT ---------------------

                    //var ad = "<tr class=\"row-mid columnmove\" id=\"" + html.row_id + "\"><td>" + html.BILL_NUMBER + "</td><td class=\"text-muted\"><a href=\"PUNITview.php?showdetail=&ID=" + html.row_id + "\" target=\"_blank\">" + html.lbs + "/" + html.cube + "</a></td><td class=\"text-muted\">" + html.pallets + "</td><td>" + html.DESTCITY + "," + html.DESTPROV + "-" + html.DESTPC + "</td><td>" + html.DELIVER_BY + "</td><td>" + html.length + "</td><td><button type=\"button\" id=\"" + html.row_id + "\" onclick=\"add_row(this);\" class=\"btn btn-primary\">Add</button></td></tr>";
                    //$('#dest-content').append(ad);

    //                $('#dest-content').append('back');
                    // ------------------------------------------------------------------------------- MAIN LOGIC
                    var main_id = $('#selected_group_buildtab option:selected').attr('id');
                    console.log(main_id);
                    
                    var str = $('#data_id').html();
                    // ------------------------------------------------------------------------------- COMMENT CODE
                    // $.ajax({
                    //     url: "fflboard-db-demo.php?action=backTr&dli=" + html.row_id,
                    //     cache: false,
                    //     success: function (text) {
                    //         $('#dest-content').append(text);
                    //         $('#' + html.row_id).fadeIn();
                    //     }
                    // });
                    // ------------------------------------------------------------------------------- COMMENT CODE END
                    //alert(str);
                    //alert(c);
                    str = str.replace(c, '');
                    //alert(str);
                    $.ajax({
                        url: "{{-- route('ltl_builder.remove_ltl_order') --}}",
                        method : "POST",
                        data: {
                            main_id: main_id,
                            did:str,
                            cid:c,
                            _token: '{{ csrf_token() }}'
                        },
                        cache: false,
                        success: function (html) {

                        }
                    });
                    // -------------------------------------------------------------------------------
                    //alert(trowid);
                    //trowid.replace(c+",","");
                    //alert(trowid);
                    //$('#data_id:contains("'.html.row_id.'",)');
                    // ------------------------------------------------------------------------------- COMMENT CODE
                    // $('#data_id').text(str);
                    
                    // tpallets = parseInt($('#total_pallets').text(), 10) - parseInt(html.pallets, 10);
                    // $('#total_pallets').text(tpallets);
                    // tcudes = parseInt($('#total_cube').text(), 10) - parseInt(html.cube, 10);
                    // $('#total_cube').text(tcudes);
                    // tfeets = parseInt($('#total_feet').text(), 10) - parseInt(html.length, 10);
                    // $('#total_feet').text(tfeets);
                    // tlbss = parseInt($('#total_lbs').text(), 10) - parseInt(html.lbs, 10);
                    // $('#total_lbs').text(tlbss);
                    // ------------------------------------------------------------------------------- COMMENT CODE END

            //     }
            // });
        }

        // $(".carriertype").on("change", function() {
        //     if ($(this).val() == 'TOA') {
        //         alert(1);
        //         var $option = $('option[data-id="TOATRANS"]');
        //         $option.prop('selected', true).trigger('change');
        //         $("#VENDOR_ID").attr("disabled", true);
        //         $('#VENDOR_ID').trigger("chosen:updated");
        //     } else if ($(this).val() == 'AD') {
        //         alert(2);
        //         $("#VENDOR_ID").attr("disabled", true);
        //         getAvailableDriver();
        //     } else {
        //         alert(3);
        //         $("#VENDOR_ID").attr("disabled", false);
        //         $("#VENDOR_ID").val("").change();
        //         $("#DRIVER_ID").val("").change();
        //         $("#DRIVER_NAME").val('');
        //         $("#DCELL").val('');
        //         $('#VENDOR_ID').trigger("chosen:updated");
        //     }
        // });

        // $('#VENDOR_ID').change(function() {
        //     var val1 = $('#VENDOR_ID option:selected').val();
        //     var vendor_id = $('#VENDOR_ID option:selected').data('id');
        //     if (val1 == '') {
        //         return false;
        //     }
        //     getDriverByEmpCode(val1,vendor_id);
        // });

        function getAvailableDriver() {
            $.ajax({
                url: "{{-- route('ltl_builder.get_drivers') --}}",
                method: "GET",
                success: function(result) {
                    var obj = $.parseJSON(result);
                    if (obj.status == false) {
                        $('#DRIVER_ID').html("");
                        $('#DRIVER_ID').append('<option value="" data-id="">NO DRIVER FOUND</option>');
                        $("#DRIVER_NAME").val('');
                        $("#DCELL").val('');
                    } else {
                        $('#DRIVER_ID').html("");
                        $('#DRIVER_ID').append('<option value="" data-id="">Select Driver</option>');
                        for (var i = obj.length - 1; i >= 0; i--) {
                            if (obj[i].PHONE == null) {
                                obj[i].PHONE = '';
                            }
                            if (obj[i].NAME == null) {
                                obj[i].NAME = '';
                            }
                            var option = '<option  data-drivername="' + obj[i].NAME + '"  data-driverphone="' +
                                obj[i].PHONE + '"  id="' + obj[i].DRIVER_ID + '" value="' + obj[i].DRIVER_ID +
                                '">' + obj[i].NAME + '</option>';
                            $('#DRIVER_ID').append(option);
                        }
                    }
                }
            });
        }

        function getDriverByEmpCode(carrier_id,vendor_id) {
            $.ajax({
                url: "{{-- route('ltl_builder.get_drivers') --}}?carrier_id=" + carrier_id +"&vendor_id=" + vendor_id,
                method: "GET",
                success: function(result) {
                    var obj = $.parseJSON(result);
                    if (obj.status === false) {
                        $('#DRIVER_ID').html("");
                        $('#DRIVER_ID').append('<option value="" data-id="">NO DRIVER FOUND</option>');
                        $("#DRIVER_NAME").val('');
                        $("#DCELL").val('');
                        if (obj.carrier_ins_exp) {
                            alert(obj.message);
                            $('#VENDOR_ID').val('');
                            $('#DRIVER_ID').html("");
                            $('#DRIVER_ID').append('<option value="" data-id="">Select Driver</option>');
                        }
                    } else {
                        if (obj.carrier_ins_exp) {
                            alert(obj.message);
                            $('#VENDOR_ID').val('');
                            $('#DRIVER_ID').html("");
                            $('#DRIVER_ID').append('<option value="" data-id="">Select Driver</option>');
                        } else {
                            $('#DRIVER_ID').html("");
                            $('#DRIVER_ID').append('<option value="" data-id="">Select Driver</option>');
                            for (var i = 0; i < obj.drivers.length; i++) {
                                var option = '<option data-drivername="' + (obj.drivers[i].NAME || '') +
                                    '" data-driverphone="' + (obj.drivers[i].PHONE || '') + '" id="' + obj
                                    .drivers[i].DRIVER_ID + '" value="' + obj.drivers[i].DRIVER_ID + '">' + (obj
                                        .drivers[i].NAME || '') + '</option>';
                                $('#DRIVER_ID').append(option);
                            }
                        }
                    }
                }
            });
        }

        function remove_tr_list(c) {
            var url = "{{-- route('ltl_builder.get_back_order_data', '@') --}}";
            url = url.replace('@', c);

            $.ajax({
                url: url,
                cache: false,
                dataType: "json",
                success: function(html) {
                    $("#droptbl tbody").find("#" + c).remove();
                    $("#tbls tbody").find("#zone" + html.zone).after(html.data);
                    var trowid;
                    var tcharge = 0;
                    var tpallets = 0;
                    var tcudes = 0;
                    var tfeets = 0;
                    var tlbss = 0;
                    trowid = $('#data_id').text() + "," + (html.row_id);
                    $('#data_id').text(trowid);
                    tcharge = parseInt($('#total_charges').text(), 10) - parseInt(html.charge, 10);
                    $('#total_charges').text(tcharge);
                    tpallets = parseInt($('#total_pallets').text(), 10) - parseInt(html.pallets, 10);
                    $('#total_pallets').text(tpallets);
                    tcudes = parseFloat($('#total_cube').text(), 10) - parseFloat(html.cube, 10);
                    $('#total_cube').text(Math.round(tcudes * 100) / 100);
                    tfeets = parseFloat($('#total_feet').text()) - parseFloat(html.length);
                    $('#total_feet').text(tfeets);
                    tlbss = parseInt($('#total_lbs').text(), 10) - parseInt(html.lbs, 10);
                    $('#total_lbs').text(tlbss);
                    tfeets = parseFloat($('#total_pieces').text()) - parseFloat(html.pieces);
                    $('#total_pieces').text(tfeets);
                }
            });
        }

    function verifyCargoModal(id, from) {
        var url = '{{-- route('load.getVerifyCargo', '@') --}}';
        url = url.replace('@', id);
        $.ajax({
            method: "GET",
            url: url,
            data: {
                from: from
            },
            success: function(data) {
                if (data.status == true) {
                    $('#verifyCargoModal').remove();
                    $('.content-wrapper').append(data.view);
                    $('#verifyCargoModal').modal('show');
                }
            }
        });
    }
    </script>
@endsection()