@extends('layout.master')
@section('content')

<section class="content pb-5">
    <div class="container-fluid">
        <meta name="csrf-token" content="{!! csrf_token() !!}">
         @if (session()->has('msg'))
        <div class="alert alert-dismissable alert-success">
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
            <strong>
                {!! session()->get('msg') !!}
            </strong>
        </div>
        @endif
        <div class="row pt-4">
            <div class="col-md-6">
                <div class="title-section">
                    <p>Ship</p>
                </div>
            </div>
            <div class="col-md-6 text-right">
                <button type="button" class="btn btn-danger" data-toggle="modal" data-target="#packagemodal" style="height:35px;">Add Package</button>
            </div>
        </div>
        <div class="row">
         <div class="col-md-6" style="margin-left: 50%;"> 
            <div class="row justify-content-end">
                <div class="col-md-6 float-right">
                    <div class="form-group custom-form-group">
                        <label class="form-label" for="customer">Sort by</label>
                        <select class="form-control" name="lsp_shorting" id="lsp_shorting">
                            <option value="cheapest">Cheapest</option>
                            <option value="fastest">Fastest</option>
                            <option value="rating">Rating</option>
                            <option value="recommended">Recommended</option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <form id="save_buyer_details" method="post" autocomplete="off">
                    @csrf
                <div class="table-responsive">
                    <table class="table table-striped" id="myTable">
                        <thead>
                            <tr>
                                <th rowspan="2" scope="col">Order Id</th>
                                <th rowspan="2" scope="col">SaP</th>
                                <th rowspan="2" scope="col">Box Qty</th>
                                <th rowspan="2" scope="col">Unit</th>
                                <th rowspan="2" scope="col">Per Box Weight</th>
                                <th rowspan="2" scope="col">Package</th>
                                <th colspan="3" class="text-center" scope="col">Box Dimension</th>
                                <th  rowspan="2" scope="col">SKUs</th>
                                <th  rowspan="2" scope="col">Action</th>
                            </tr>
                            <tr>
                                <th>Length</th>
                                <th>Width</th>
                                <th>Height</th>
                            </tr>
                        </thead>
                        
                        <tbody>
                            @foreach($orders as $key => $value)
                            @php
                                $orderPackagesid = 'packages'.'-'.$value['order_id'].'-'.$key;
                                $orderWeightId = 'weight'.'-'.$value['order_id'].'-'.$key;
                                $orderLengthId = 'length'.'-'.$value['order_id'].'-'.$key;
                                $orderWidthId = 'width'.'-'.$value['order_id'].'-'.$key;
                                $orderHeightId = 'height'.'-'.$value['order_id'].'-'.$key;
                                $orderQuantityId = 'quantity'.'-'.$value['order_id'].'-'.$key;
                                $orderUnitId = 'unitPrice'.'-'.$value['order_id'].'-'.$key;
                                $orderAddButtonId = 'addBoxButton'.'-'.$value['order_id'].'-'.$key;
                                $sameAsProductIds = 'sameAsProductIds'.'-'.$value['order_id'].'-'.$key;
                                $addMoreIds = 'add-more-ids'.'-'.$value['order_id'].'-'.$key;
                                $skuIds = 'skusId'.'-'.$value['order_id'].'-'.$key;
                            @endphp
                            <tr id="{{$addMoreIds}}">
                                <td>{{$value['order_id']}}</td>
                                <td><input class="filled-in filled-check" name="same_as_product[{{$value['order_id']}}][]" type="checkbox" id="{{$sameAsProductIds}}" onclick="sameAsProductIdsData(this)">
                                <label for="{{$sameAsProductIds}}" class="order-label"></label>
                                </td>
                                <td><input name="quantity[{{$value['order_id']}}][]" class="quantity form-control AllowNumeric" placeholder="Quantity" value="" id="{{$orderQuantityId}}"></td>
                                <td><input name="unit_price[{{$value['order_id']}}][]" class="unit_price form-control AllowNumeric" placeholder="Unit" id="{{$orderUnitId}}" value=""></td>
                                
                                <td><input name="dead_weight[{{$value['order_id']}}][]" class="dead_weight form-control AllowNumericWithDecimals" placeholder="Weight" id="{{$orderWeightId}}" value=""></td>

                                <td>
                                    <div class="form-group custom-form-group">
                                        <select class="form-control packages package_masters" name="packages[{{$value['order_id']}}][]"  id="{{$orderPackagesid}}"  onblur="skusPackageSelection(this,0)">
                                            <option value="">Select</option>
                                        @foreach($packages as $key2 => $value2)
                                            <option value="{{$value2['id']}}">{{$value2['name']}}</option>
                                        @endforeach
                                        </select>
                                    </div>
                                </td>

                                <td><input name="length[{{$value['order_id']}}][]" class="length form-control AllowNumeric" placeholder="Length" id="{{$orderLengthId}}" value=""></td>
                                <td><input name="width[{{$value['order_id']}}][]" class="width form-control AllowNumeric" placeholder="Width" id="{{$orderWidthId}}" value=""></td>
                                <td><input name="height[{{$value['order_id']}}][]" class="height form-control AllowNumeric" placeholder="Height" id="{{$orderHeightId}}" value=""></td>
                                <td id="{{$skuIds}}"> 
                                @foreach($value['products'] as $key3 => $productList)
                                 <span>{{$productList['sku']}}({{$productList['quantity']}})</span>
                                @endforeach
                                </td>
                                
                                <td><button type="button" class="btn btn-danger add_field_button" id="{{$orderAddButtonId}}" onclick="addMoreButton(this)"><img src="{{asset('images/add-icon.svg')}}" alt=""></button></td>

                            </tr>

                            @endforeach
                          
                        </tbody>
                    </table>
                </div>
                <input type="hidden" name="ordersSkuIds" value="{{ $_GET['skuIds'] }}">
                <div class="col-md-12">
                    <div class="text-right">
                        <button type="submit" class="btn btn-danger">Submit</button>
                    </div>
                </div>
            </form>
            </div>
        </div>
    </div>


      <!-- package modal  -->
            <div class="modal fade" id="packagemodal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
                <div class="modal-dialog modal-lg">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title mb-0" id="exampleModalLabel">
                                <div class="title-section">
                                    <p>Add Package Details</p>
                                </div>
                            </h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true"><img src="images/close.png" height="30px" alt=""></span>
                            </button>
                        </div>
                        <div class="modal-body">
                            <div class="row">
                                <div class="col-md-12">
                                    <form id="packageModelDetails" method="post" autocomplete="off">
                                        @csrf
                                        <div class="row">
                                            <div class="col-md-6">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="package-name">Package Name<span class="text-danger">*</span></label>
                                                    <input class="form-control" placeholder="Enter Package Name" type="text" name="new_package_name" value="" id="new_package_name">
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="package-type">Package Type<span class="text-danger">*</span></label>
                                                    <select class="form-control" name="new_package_type" id="new_package_type">
                                                        <option value="box">Box</option>
                                                    </select>
                                                    <p class="mt-2"><a href="#" class="text-dark">*Package master is only applicable to box type packaging</a></p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row mt-4">
                                            <div class="col-md-12 mb-3">
                                                <div class="new-border">
                                                    <h6><strong> Package Dimentions </strong><span class="text-danger">*</span> <span>Dimentions Should be in centimeters only</span> </h6>
                                                </div>
                                            </div>
                                            <div class="col-md-4">
                                                <div class="form-group custom-form-group mb-1">
                                                    <label class="form-label" for="customer"><span class="text-danger">*</span>Length</label>
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" placeholder="Enter Length" aria-label="Dollar amount (with dot and two decimal places)" name="new_package_length" id="new_package_length">
                                                        <div class="input-group-append">
                                                            <span class="input-group-text">CM</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-4">
                                                <div class="form-group custom-form-group mb-1">
                                                    <label class="form-label" for="customer"><span class="text-danger">*</span>Width</label>
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" placeholder="Enter Width" aria-label="Dollar amount (with dot and two decimal places)" name="new_package_width" id="new_package_width">
                                                        <div class="input-group-append">
                                                            <span class="input-group-text">CM</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-4">
                                                <div class="form-group custom-form-group mb-1">
                                                    <label class="form-label" for="customer"><span class="text-danger">*</span>Height</label>
                                                    <div class="input-group">
                                                        <input type="text" class="form-control" placeholder="Enter Height" aria-label="Dollar amount (with dot and two decimal places)" name="new_package_height" id="new_package_height">
                                                        <div class="input-group-append">
                                                            <span class="input-group-text">CM</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            
                                            <div class="text-center mt-4">
                                                <button class="btn btn-danger" id="cancelPackageAddFormButton">Cancel</button>
                                                <button class="btn btn-danger" id="newPackageAddFormButton">Save</button>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- package modal  -->

</section>
<style>
    .dissableClick {
        pointer-events: none;
    }
</style>
<script>

    let skuIds123 = '{{ $_GET['skuIds'] }}';

    function sameAsProductIdsData(ids) { 

        let id = ids.getAttribute('id');
        let orderId = id.split("-")[1];
        let subId = id.split("-")[2];
        let  oldAddMoreIds = 'add-more-ids'+'-'+orderId+'-'+subId;
        var uniqueObjects = [];

        let checkBoxCondition = $('#'+ids.getAttribute('id')).is(':checked');

        let i = 0;

        if (orderId) {

            jQuery.ajax({
                url: "{{route('get-order-skus-detail')}}",
                type: "POST",
                data: { _token: "{{csrf_token()}}", id: orderId , skuIds: atob(skuIds123) },
                success: function(data) {
                    
                    
                    if(data.data.length > 0) {

                        let lengthArr = [];
                        let widthArr = [];
                        let heightArr = [];
                        let skuArr = [];
                        let addMoreIdsArr = [];
                        let weightArr = [];

                        let uniqueRowData = [];

                    if (checkBoxCondition) {

                        let totalQuantity = 0;

                        let oldOrderPackageId = 'packages'+'-'+orderId+'-'+subId;
                        let oldOrderWeightId = 'weight'+'-'+orderId+'-'+subId;
                        let oldOrderLengthId = 'length'+'-'+orderId+'-'+subId;
                        let oldOrderWidthId = 'width'+'-'+orderId+'-'+subId;
                        let oldOrderHeightId = 'height'+'-'+orderId+'-'+subId;
                        let oldOrderQuantityId = 'quantity'+'-'+orderId+'-'+subId;
                        let oldUnitId = 'unitPrice'+'-'+orderId+'-'+subId;
                        let oldAddBoxButton = 'addBoxButton'+'-'+orderId+'-'+subId;
                        let oldSkusId = 'skusId'+'-'+orderId+'-'+subId;

                        $(data.data).each((i, e) => {

                            lengthArr.push(e.length);
                            widthArr.push(e.width);
                            heightArr.push(e.height);
                            weightArr.push(e.weight);

                            skuArr.push(e.sku);

                            totalQuantity += parseInt(e.quantity);

                            let lengthUnique = lengthArr.filter(onlyUnique);
                            let widthUnique = widthArr.filter(onlyUnique);
                            let heightUnique = heightArr.filter(onlyUnique);
                            let skuUnique = skuArr.filter(onlyUnique);
                            let WeightUnique = weightArr.filter(onlyUnique);



                            let  orderPackagesid = 'packages'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderWeightId = 'weight'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderLengthId = 'length'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderWidthId = 'width'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderHeightId = 'height'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderQuantityId = 'quantity'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderUnitId = 'unitPrice'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderAddButtonId = 'addBoxButton'+'-'+orderId+'-'+subId+'-'+i;
                            let  sameAsProductIds = 'sameAsProductIds'+'-'+orderId+'-'+subId+'-'+i;
                            let  addMoreIds = 'add-more-ids'+'-'+orderId+'-'+subId+'-'+i;

                            addMoreIdsArr.push(addMoreIds);


                            if((lengthUnique.length == 1) &&  (widthUnique.length == 1) && (heightUnique.length == 1) && (WeightUnique.length == 1)) {

                                $(addMoreIdsArr).each((i, e) => {

                                    $('#'+e).remove();

                                 });


                                $('#'+oldOrderWeightId).val(e.weight);
                                $('#'+oldOrderWeightId).addClass('dissableClick');

                                $('#'+oldOrderLengthId).val(e.length);
                                $('#'+oldOrderLengthId).addClass('dissableClick');

                                $('#'+oldOrderWidthId).val(e.width);
                                $('#'+oldOrderWidthId).addClass('dissableClick');

                                $('#'+oldOrderHeightId).val(e.height);
                                $('#'+oldOrderHeightId).addClass('dissableClick');

                                $('#'+oldOrderQuantityId).val(totalQuantity);
                                $('#'+oldOrderQuantityId).addClass('dissableClick');

                                $('#'+oldUnitId).val(totalQuantity);
                                $('#'+oldUnitId).addClass('dissableClick');

                                $('#'+oldSkusId).html('<span>'+e.sku+'('+e.quantity+')'+'</span>');
                                $('#'+oldUnitId).addClass('dissableClick');
                                $('#'+oldOrderPackageId).addClass('dissableClick');
                                $('#'+oldAddBoxButton).addClass('dissableClick');

                                return;

                            }

                                let uniquElementArray = [];
                                let dublicateQuantity = 0;
                    

                                $(data.data).each((j, k) => {

                                    if ((e.length = k.length) &&  (e.width == k.width) && (e.height == k.height) && (e.weight == k.weight)) {

                                        dublicateQuantity += parseInt(k.quantity);

                                        uniquElementArray.push({
                                            'id':k.id,
                                            'quantity': parseInt(k.quantity),
                                            'length':k.length,
                                            'width':k.width,
                                            'height':k.height,
                                            'weight':k.weight,
                                            'sku':k.sku
                                        });

                                    }else {

                                        uniquElementArray.push({
                                            'id':k.id,
                                            'quantity': k.quantity,
                                            'length':k.length,
                                            'width':k.width,
                                            'height':k.height,
                                            'weight':k.weight,
                                            'sku':k.sku
                                        });

                                    }

                                });

                                 uniqueObjects = [];

                                uniquElementArray.forEach((object) => { 
                                    let isUnique = true; 
                                    let uniqueIndex;
                                    uniqueObjects.forEach((uniqueObject,index) => { 
                                        if (object.length === uniqueObject.length && object.width === uniqueObject.width && object.height === uniqueObject.height && object.weight === uniqueObject.weight) {
                                           isUnique = false; 
                                           uniqueIndex = index
                                       } 
                                   }); 
                                    if (isUnique) {

                                        uniqueObjects.push(object); 

                                    } 
                                    else  {

                                        uniqueObjects[uniqueIndex].quantity += object.quantity;
                                        uniqueObjects[uniqueIndex].sku += ','+object.sku;
                                    }
                                });

                        });
                        

                        let m = 0

                        uniqueObjects.forEach((dataId,dataIndex) => { 

                            if (m == 0) {

                                $('#'+oldOrderWeightId).val(dataId.weight);
                                $('#'+oldOrderWeightId).addClass('dissableClick');

                                $('#'+oldOrderLengthId).val(dataId.length);
                                $('#'+oldOrderLengthId).addClass('dissableClick');

                                $('#'+oldOrderWidthId).val(dataId.width);
                                $('#'+oldOrderWidthId).addClass('dissableClick');

                                $('#'+oldOrderHeightId).val(dataId.height);
                                $('#'+oldOrderHeightId).addClass('dissableClick');

                                $('#'+oldOrderQuantityId).val(dataId.quantity);
                                $('#'+oldOrderQuantityId).addClass('dissableClick');

                                $('#'+oldUnitId).val(dataId.quantity);
                                $('#'+oldUnitId).addClass('dissableClick');

                                $('#'+oldSkusId).html('<span>'+dataId.sku+'('+dataId.quantity+')'+'</span>');
                                $('#'+oldUnitId).addClass('dissableClick');
                                $('#'+oldOrderPackageId).addClass('dissableClick');
                                $('#'+oldAddBoxButton).addClass('dissableClick'); 

                                m++; 

                            }else {

                            let  orderPackagesid = 'packages'+'-'+orderId+'-'+subId+'-'+m;
                            let  orderWeightId = 'weight'+'-'+orderId+'-'+subId+'-'+m;
                            let  orderLengthId = 'length'+'-'+orderId+'-'+subId+'-'+m;
                            let  orderWidthId = 'width'+'-'+orderId+'-'+subId+'-'+m;
                            let  orderHeightId = 'height'+'-'+orderId+'-'+subId+'-'+m;
                            let  orderQuantityId = 'quantity'+'-'+orderId+'-'+subId+'-'+m;
                            let  orderUnitId = 'unitPrice'+'-'+orderId+'-'+subId+'-'+m;
                            let  orderAddButtonId = 'addBoxButton'+'-'+orderId+'-'+subId+'-'+m;
                            let  sameAsProductIds = 'sameAsProductIds'+'-'+orderId+'-'+subId+'-'+m;
                            let  addMoreIds = 'add-more-ids'+'-'+orderId+'-'+subId+'-'+m;

                               let html = '<tr id="'+addMoreIds+'"><td>'+orderId+'</td><td></td><td><input name="quantity['+orderId+'][]" class="quantity form-control AllowNumeric dissableClick" placeholder="Quantity" value="'+dataId.quantity+'" id="'+orderQuantityId+'"></td><td><input name="unit_price['+orderId+'][]" class="unit_price form-control AllowNumeric dissableClick" placeholder="Unit Price" id="'+orderUnitId+'" value="'+dataId.quantity+'"></td><td><input name="dead_weight['+orderId+'][]" class="dead_weight form-control AllowNumeric dissableClick" placeholder="Weight" id="'+orderWeightId+'" value="'+dataId.weight+'"></td><td><div class="form-group custom-form-group dissableClick"><select class="form-control packages package_masters" name="packages["'+orderId+'"][]"  id="'+orderPackagesid+'" onblur="skusPackageSelection(this,'+m+')"><option value="">Select</option>@foreach($packages as $key2 => $value2)<option value="{{$value2['id']}}">{{$value2['name']}}</option>@endforeach</select></div></td><td><input name="length['+orderId+'][]" class="length form-control AllowNumeric dissableClick" placeholder="Length" id="'+orderLengthId+'" value="'+dataId.length+'"></td><td><input name="width['+orderId+'][]" class="width form-control AllowNumeric dissableClick" placeholder="Width" id="'+orderWidthId+'" value="'+dataId.width+'"></td><td><input name="height['+orderId+'][]" class="height form-control AllowNumeric dissableClick" placeholder="Height" id="'+orderHeightId+'" value="'+dataId.height+'"></td><td class="dissableClick"><span>'+dataId.sku +'('+ dataId.quantity +')'+'</span></td><td></td></tr>';

                                $('#myTable > tbody > tr#'+oldAddMoreIds).after(html);

                                m++;   

                            }

                        }); 

                    } else {


                        $(data.data).each((i, e) => {


                            let oldOrderPackageId = 'packages'+'-'+orderId+'-'+subId;
                            let oldOrderWeightId = 'weight'+'-'+orderId+'-'+subId;
                            let oldOrderLengthId = 'length'+'-'+orderId+'-'+subId;
                            let oldOrderWidthId = 'width'+'-'+orderId+'-'+subId;
                            let oldOrderHeightId = 'height'+'-'+orderId+'-'+subId;
                            let oldOrderQuantityId = 'quantity'+'-'+orderId+'-'+subId;
                            let oldUnitId = 'unitPrice'+'-'+orderId+'-'+subId;
                            let oldAddBoxButton = 'addBoxButton'+'-'+orderId+'-'+subId;
                            let oldSkusId = 'skusId'+'-'+orderId+'-'+subId;

                             $('#'+oldOrderWeightId).removeClass('dissableClick');
                             $('#'+oldOrderLengthId).removeClass('dissableClick');
                             $('#'+oldOrderWidthId).removeClass('dissableClick');
                             $('#'+oldOrderHeightId).removeClass('dissableClick');
                             $('#'+oldOrderQuantityId).removeClass('dissableClick');
                             $('#'+oldUnitId).removeClass('dissableClick');
                             $('#'+oldOrderPackageId).removeClass('dissableClick');
                             $('#'+oldAddBoxButton).removeClass('dissableClick');


                            let  orderPackagesid = 'packages'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderWeightId = 'weight'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderLengthId = 'length'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderWidthId = 'width'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderHeightId = 'height'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderQuantityId = 'quantity'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderUnitId = 'unitPrice'+'-'+orderId+'-'+subId+'-'+i;
                            let  orderAddButtonId = 'addBoxButton'+'-'+orderId+'-'+subId+'-'+i;
                            let  sameAsProductIds = 'sameAsProductIds'+'-'+orderId+'-'+subId+'-'+i;
                            let  addMoreIds = 'add-more-ids'+'-'+orderId+'-'+subId+'-'+i;




                            $('#'+addMoreIds).remove();
                            if(i != 0) {
                                $('#'+oldSkusId).append('</br><span>'+e.sku+'</span>');
                            }
                            i++;



                        });



                    }

                        

                    }

                }
            });

        }

    }

    var oldOrderId = '';
    var i = 0;

    function addMoreButton(ids) {

        let id = ids.getAttribute('id');
        let orderId = id.split("-")[1];
        let subId = id.split("-")[2];
        let oldAddMoreIds = '';
        if (id.split("-").length == 3) {
           oldAddMoreIds = 'add-more-ids'+'-'+orderId+'-'+subId; 
       }else {

           oldAddMoreIds = 'add-more-ids'+'-'+orderId+'-'+subId+'-'+id.split('-')[3];

            let  orderWeightIds = 'weight'+'-'+orderId+'-'+subId+'-'+id.split('-')[3];
            let  orderLengthIds = 'length'+'-'+orderId+'-'+subId+'-'+id.split('-')[3];
            let  orderWidthIds = 'width'+'-'+orderId+'-'+subId+'-'+id.split('-')[3];
            let  orderHeightIds = 'height'+'-'+orderId+'-'+subId+'-'+id.split('-')[3];
            let  orderQuantityIds = 'quantity'+'-'+orderId+'-'+subId+'-'+id.split('-')[3];
            let  orderUnitIds = 'unitPrice'+'-'+orderId+'-'+subId+'-'+id.split('-')[3];

            let newWeight =  $('#'+orderWeightIds).val();
            let newLength = $('#'+orderLengthIds).val();
            let newWidth = $('#'+orderWidthIds).val();
            let newHeight = $('#'+orderHeightIds).val();
            let newQuantity =  $('#'+orderQuantityIds).val();
            let newUnit = $('#'+orderUnitIds).val();

            if ((!newWeight) || (!newLength) || (!newWidth) || (!newHeight) || (!newQuantity) || (!newUnit)) {

                return swal({
                    title: "Warning",
                    text: 'Pleae fill all mandatory fields',
                    type: "warning",
                    closeOnConfirm: true,
                },
                function() {

                });

            }



       }

       if(oldOrderId != orderId) {
            i = 0 ;
            oldOrderId = orderId;
       }
        
        let oldOrderPackageId = 'packages'+'-'+orderId+'-'+subId;
        let oldOrderWeightId = 'weight'+'-'+orderId+'-'+subId;
        let oldOrderLengthId = 'length'+'-'+orderId+'-'+subId;
        let oldOrderWidthId = 'width'+'-'+orderId+'-'+subId;
        let oldOrderHeightId = 'height'+'-'+orderId+'-'+subId;
        let oldOrderQuantityId = 'quantity'+'-'+orderId+'-'+subId;
        let oldUnitId = 'unitPrice'+'-'+orderId+'-'+subId;
        let oldAddBoxButton = 'addBoxButton'+'-'+orderId+'-'+subId;
        let oldSkusId = 'skusId'+'-'+orderId+'-'+subId;

       let weight =  $('#'+oldOrderWeightId).val();
       let length = $('#'+oldOrderLengthId).val();
       let width = $('#'+oldOrderWidthId).val();
       let height = $('#'+oldOrderHeightId).val();
       let quantity =  $('#'+oldOrderQuantityId).val();
       let unit = $('#'+oldUnitId).val();

       if ((!weight) || (!length) || (!width) || (!height) || (!quantity) || (!unit)) {

        return swal({
            title: "Warning",
            text: 'Pleae fill all mandatory fields',
            type: "warning",
            closeOnConfirm: true,
        },
        function() {

        });

       }else {

            let  orderPackagesid = 'packages'+'-'+orderId+'-'+subId+'-'+i;
            let  orderWeightId = 'weight'+'-'+orderId+'-'+subId+'-'+i;
            let  orderLengthId = 'length'+'-'+orderId+'-'+subId+'-'+i;
            let  orderWidthId = 'width'+'-'+orderId+'-'+subId+'-'+i;
            let  orderHeightId = 'height'+'-'+orderId+'-'+subId+'-'+i;
            let  orderQuantityId = 'quantity'+'-'+orderId+'-'+subId+'-'+i;
            let  orderUnitId = 'unitPrice'+'-'+orderId+'-'+subId+'-'+i;
            let  orderAddButtonId = 'addBoxButton'+'-'+orderId+'-'+subId+'-'+i;
            let  sameAsProductIds = 'sameAsProductIds'+'-'+orderId+'-'+subId+'-'+i;
            let  addMoreIds = 'add-more-ids'+'-'+orderId+'-'+subId+'-'+i; 
            let  deleteIds = 'delete'+'-'+orderId+'-'+subId+'-'+i;

            let html = '<tr id="'+addMoreIds+'"><td>'+orderId+'</td><td></td><td><input name="quantity['+orderId+'][]" class="quantity form-control AllowNumeric" placeholder="Quantity" value="" id="'+orderQuantityId+'"></td><td><input name="unit_price['+orderId+'][]" class="unit_price form-control AllowNumeric" placeholder="Unit" id="'+orderUnitId+'" value=""></td><td><input name="dead_weight['+orderId+'][]" class="dead_weight form-control AllowNumericWithDecimals" placeholder="Weight" id="'+orderWeightId+'" value=""></td><td><div class="form-group custom-form-group"><select class="form-control packages package_masters" name="packages["'+orderId+'"][]"  id="'+orderPackagesid+'" onblur="skusPackageSelectionMultiple(this,'+i+')"><option value="">Select</option>@foreach($packages as $key2 => $value2)<option value="{{$value2['id']}}">{{$value2['name']}}</option>@endforeach</select></div></td><td><input name="length['+orderId+'][]" class="length form-control AllowNumeric" placeholder="Length" id="'+orderLengthId+'" value=""></td><td><input name="width['+orderId+'][]" class="width form-control AllowNumeric" placeholder="Width" id="'+orderWidthId+'" value=""></td><td><input name="height['+orderId+'][]" class="height form-control" placeholder="Height" id="'+orderHeightId+'" value=""></td><td class=""><span></span></td><td><button type="button" class="btn btn-danger add_field_button" id="'+orderAddButtonId+'" onclick="addMoreButton(this)"><img src="{{asset('images/add-icon.svg')}}" alt=""></button><button type="button" class="btn btn-danger mr-3 remove_field" id="'+ deleteIds+'" onclick="deleteDynamicRows(this)"><img src="{{asset('assets/images/trash-icon.svg ')}}" height="14px" alt=""></button></td></tr>';

                $('#myTable > tbody > tr#'+oldAddMoreIds).after(html);

                $('#'+id).addClass('d-none');


            $('#'+orderPackagesid).empty();
            var availableOptions = $('#'+oldOrderPackageId).html();
            $('#'+orderPackagesid).append(availableOptions);

            $(".AllowNumeric").on("keypress keyup blur", function(event) {
                $(this).val($(this).val().replace(/[^\d].+/, ""));
                if ((event.which < 48 || event.which > 57)) {
                    event.preventDefault();
                }
            });


            $(".AllowNumericWithDecimals").keydown(function (event) {


                if (event.shiftKey == true) {
                    event.preventDefault();
                }

                if ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105) || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 37 || event.keyCode == 39 || event.keyCode == 46 || event.keyCode == 190) {

                } else {
                    event.preventDefault();
                }

                if($(this).val().indexOf('.') !== -1 && event.keyCode == 190)
                    event.preventDefault();

            });
    
            i++;

       }

    }

    function deleteDynamicRows(ids) {

        let id = ids.getAttribute('id');
        let orderId = id.split("-")[1];
        let subId = id.split("-")[2];
        let l = id.split("-")[3] ? id.split("-")[3] : 0;

        if (l>0) {
            let addButtonAppendId = (l-1);
            let  oldAddMoreIds = 'add-more-ids'+'-'+orderId+'-'+subId+'-'+l;
            let  addOldBoxButtonId = 'addBoxButton'+'-'+orderId+'-'+subId+'-'+addButtonAppendId;  
            $('#' + oldAddMoreIds + '').remove();
            $('#'+addOldBoxButtonId).removeClass('d-none');
        }else {
            let  oldAddMoreIds = 'add-more-ids'+'-'+orderId+'-'+subId+'-'+l;
            let  addOldBoxButtonId = 'addBoxButton'+'-'+orderId+'-'+subId; 
            $('#' + oldAddMoreIds + '').remove();
          $('#'+addOldBoxButtonId).removeClass('d-none');  
        }
        

    }

    $(".AllowNumeric").on("keypress keyup blur", function(event) {
        $(this).val($(this).val().replace(/[^\d].+/, ""));
        if ((event.which < 48 || event.which > 57)) {
            event.preventDefault();
        }
    });


    $(".AllowNumericWithDecimals").keydown(function (event) {


            if (event.shiftKey == true) {
                event.preventDefault();
            }

            if ((event.keyCode >= 48 && event.keyCode <= 57) || (event.keyCode >= 96 && event.keyCode <= 105) || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 37 || event.keyCode == 39 || event.keyCode == 46 || event.keyCode == 190) {

            } else {
                event.preventDefault();
            }
            
            if($(this).val().indexOf('.') !== -1 && event.keyCode == 190)
                event.preventDefault();

    });

    function onlyUnique(value, index, self) {
        return self.indexOf(value) === index;
    }

    $("#save_buyer_details").on('submit', function(e) {

        e.preventDefault();

        var form = $(this);

        let enteredNoOfQuan = 0;
        let numberOfBox1 = 0;

        $.ajax({
            method: 'POST',
            url: "{{url('multiple-orders_package_store')}}",
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            data: form.serialize(),
            success: function(data) {

                if (data.success == false) {
                    return swal({
                        title: "Warning",
                        text: data.message,
                        type: "warning",
                        closeOnConfirm: true,
                    });
                }


                if (data.success == true) {

                    return swal({
                        title: "Success",
                        text: data.message,
                        type: "success",

                        closeOnConfirm: false,
                        showLoaderOnConfirm: true,
                    },
                    function() {
                        localStorage.setItem('packagesData',JSON.stringify(data.data));
                        window.location.href = '{{url("/orders/bulk/shipment-with-lsp")}}';
                    });

                }

            },
            error: function(data) {

                var errors = $.parseJSON(data.responseText);

                $.each(errors, function(index, value) {

                    if (value.order_id) {

                        swal({
                            title: "Order id must be unique",
                            text: 'Order id must be unique',
                            type: "warning",
                            closeOnConfirm: false,
                            showLoaderOnConfirm: true,
                        });

                    }

                });

            }
        });
    });

    //Package Models.


    $("#packageModelDetails").validate({

        rules: {

            new_package_name: {
                required: true,
                maxlength: 20
            },
            new_package_type: {
                required: true,
                maxlength: 20
            },
            new_package_length: {
                required: true,
                number: true,
            },
            new_package_width: {
                required: true,
                number: true,
            },
            new_package_height: {
                required: true,
                number: true,
            },
        },
        messages: {
            new_package_name: {
                required: 'Please enter package name',
                digits: 'please enter digits only',
                maxlength: 'Invalid package name'
            },
            new_package_type: {
                digits: 'please enter digits only',
                maxlength: 'Invalid package type'
            },
            new_package_length: {
                required: 'Length is required',
                number: 'length must be a number.',
            },
            new_package_width: {
                required: 'width is required',
                number: 'width must be a number.',
            },
            new_package_height: {
                required: 'height is required',
                number: 'height must be a number.',
            },
        }

    });

    $("#newPackageAddFormButton").on('click', function(e) {
        e.preventDefault();
        let allFormFields = [];
        if ($("#packageModelDetails").valid()) {


            $.ajax({
                method: 'POST',
                url: "{{url('package-master-store')}}",
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data: $("#packageModelDetails").serialize(),
                success: function(data) {

                    if (data.success == false) {
                        return swal({
                                title: "Warning",
                                text: data.message,
                                type: "warning",
                                closeOnConfirm: true,
                            },
                            function() {

                            });
                    }


                    if (data.success == true) {

                        //package_details_master

                        $('.package_masters').empty();

                        jQuery.each(data.data, function(key, value) {

                            $('.package_masters').append('<option value="' + value.id + '">' + value.name + '</option>');
                        });

                        return swal({
                                title: "Success",
                                text: data.message,
                                type: "success",

                                closeOnConfirm: true,
                                showLoaderOnConfirm: true,
                            },
                            function() {
                                $('#packagemodal').modal('hide');
                            });

                    }

                }
            });
        } else {
            return;
        }

    });

    function skusPackageSelection(eventValue, eventId) {

    let packageValue = eventValue.value;
    let packageId = eventId;
    let id = eventValue.getAttribute('id');

    console.log('+++id+++',id);
    let orderId = id.split("-")[1];
    let subId = id.split("-")[2];

    if (eventValue.value) {
        jQuery.ajax({
            url: "{{route('get-packages-detail')}}",
            type: "POST",
            data: { _token: "{{csrf_token()}}", id: eventValue.value },
            success: function(data) {

                let skuLength = "length" + '-'+orderId+'-'+subId + "";
                let skuWidth = "width" + '-'+orderId+'-'+subId + "";
                let skuHeight = "height" + '-'+orderId+'-'+subId + "";

                console.log(skuLength, skuWidth, skuHeight);

                $('#' + skuLength).val(data.data.length);
                $('#' + skuWidth).val(data.data.width);
                $('#' + skuHeight).val(data.data.height);
                //$('#'+skuWeight).val(data.data.weight);


            }
        });
    }
}

function skusPackageSelectionMultiple(eventValue, eventId) {

    let packageValue = eventValue.value;
    let packageId = eventId;
    let id = eventValue.getAttribute('id');

    console.log('+++id+++',id);
    let orderId = id.split("-")[1];
    let subId = id.split("-")[2];
    let subChildId = id.split("-")[3];

    if (eventValue.value) {
        jQuery.ajax({
            url: "{{route('get-packages-detail')}}",
            type: "POST",
            data: { _token: "{{csrf_token()}}", id: eventValue.value },
            success: function(data) {
                
                let skuLength = "length" + '-'+orderId+'-'+subId + '-' + subChildId + "";
                let skuWidth = "width" + '-'+orderId+'-'+subId + '-' + subChildId + "";
                let skuHeight = "height" + '-'+orderId+'-'+subId + '-' + subChildId + "";

                console.log(skuLength, skuWidth, skuHeight);

                $('#' + skuLength).val(data.data.length);
                $('#' + skuWidth).val(data.data.width);
                $('#' + skuHeight).val(data.data.height);

            }
        });
    }
}

let errorMsg = '{{ session()->get('msg') }}';

 if (errorMsg == 'Please verify Kyc') {

    swal({
        title: "Warning",
        text: "KYC not found",
        type: "warning",
        allowOutsideClick: true,
        closeOnConfirm: false,
        showLoaderOnConfirm: true,
        confirmButtonText: 'Complete KYC here...',
    },
    function() {
        let kyc = 'yes';
        window.location.href='{{url("/profile")}}?kyc='+kyc;
    });
}

 //Lsp Shorting

       $("#lsp_shorting").on("change", function(e) {

            let lspValue =  $(this).val();

            $('#custum-loader').removeClass('hidden');

            if(lspValue)
            {
                jQuery.ajax({
                    url : "{{route('lsp-listing-filters')}}",
                    type : "POST",
                    data: {  _token: "{{csrf_token()}}",lsp: lspValue },

                    success:function(data)
                    {
                        $('#custum-loader').addClass('hidden');

                        return;

                    }

                });

                $('#custum-loader').addClass('hidden');

            }

        });


$('#cancelPackageAddFormButton').on("click", function(e) { //user click on remove text
    e.preventDefault();
    $('#packagemodal').modal('hide');

});





</script>
@endsection