@extends('layout.master')
@section('content')
@php
//dd($listData);
@endphp
<section class="content pb-5">
    <div class="container-fluid">
        <meta name="csrf-token" content="{!! csrf_token() !!}">
        <div class="row pt-4 pb-3">
            <div class="col-md-12">
                <div class="title-section">
                    <p>Forward Orders</p>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <form id="save_buyer_details" method="post" autocomplete="off">
                    @csrf
                    <div class="tab-content user-pro" id="myTabContent2">
                        <div class="tab-pane fade show active" id="home1" role="tabpanel" aria-labelledby="home-tab">
                            <ul class="appointmnettabs forward-tab">
                                <li class="active">
                                    Buyer Details<div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li>
                                    Order Details <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li>
                                    Pickup Address <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li style="display: none;">
                                    Package Weight <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li>
                                    Other Details <div class="appoint-ratedashed appoint-ratedashedtop appoint-ratedashed-forward"><span class="appoint-rate"></span></div>
                                </li>
                            </ul>
                            <div class="row ">
                                <div class="col-md-12">
                                    <div class="row justify-content-between py-4 pt-sm-4 pb-sm-5">
                                        <div class="col-md-3">
                                            <div class="form-group custom-form-group">
                                                <label class="form-label" for="customer">Phone No.<span class="text-danger">*</span></label>
                                                <input name="mobile_number" class="form-control AllowNumeric" placeholder="Phone No." type="text" value="{{old('mobile_number')}}" id="mobile_number" onblur="fetchUserDetails(this)">
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="form-group custom-form-group">
                                                <label class="form-label" for="customer">Buyer Name<span class="text-danger">*</span></label>
                                                <input name="buyer_name" class="form-control alphabetsonly" placeholder="Buyer Name" type="text" value="{{old('buyer_name')}}" id="buyer_name">
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="form-group custom-form-group">
                                                <label class="form-label" for="customer">Alternate Phone No.</label>
                                                <input name="alt_mobile_number" class="form-control AllowNumeric" placeholder="Alternate Phone No." type="text" value="{{old('alt_mobile_number')}}" id="alt_mobile_number">
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="form-group custom-form-group">
                                                <label class="form-label" for="customer">Email<span class="text-danger">*</span></label>
                                                <input name="email" class="form-control" placeholder="Email" type="email" value="{{old('email')}}" id="email">
                                            </div>
                                        </div>
                                        <div class="col-md-12 py-3">
                                            <h6 class="heading">Address Details</h6>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group custom-form-group">
                                                <label class="form-label" for="customer">Address Line 1<span class="text-danger">*</span></label>
                                                <input name="address1" class="form-control" placeholder="Address Line 1" type="text" value="{{old('address1')}}" id="address1">
                                            </div>
                                        </div>
                                        <div class="col-md-4">
                                            <div class="form-group custom-form-group">
                                                <label class="form-label" for="customer">Address Line 2</label>
                                                <input name="address2" class="form-control" placeholder="Address Line 2" type="text" value="{{old('address2')}}" id="address2">
                                            </div>
                                        </div>
                                        <div class="col-md-4"></div>
                                        <div class="col-md-3">
                                            <div class="form-group custom-form-group">
                                                <label class="form-label" for="pincode">Pincode<span class="text-danger">*</span></label>
                                                <input name="pincode" class="form-control AllowNumeric" placeholder="Pincode" type="text" value="{{old('pincode')}}" id="pincode">
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="form-group custom-form-group">
                                                <label class="form-label" for="customer">Country</label>
                                                <select class="form-control" name="country_id" id="country_id">
                                                    <option value="">Select Country</option>
                                                    @foreach($listData['countries'] as $country)
                                                    <option value="{{$country['id']}}" {{ old('country_id') == $country['id'] ? 'selected': ''}}>{{$country['name']}}</option>
                                                    @endforeach
                                                </select>
                                                <span id="country_id" style="display: none; color: red;"> </span>
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="form-group custom-form-group">
                                                <label class="form-label" for="customer">State</label>
                                                <select class="form-control" name="state_id" id="state_id">
                                                    <option value="">Select State</option>
                                                    @foreach($listData['state'] as $states)
                                                    <option value="{{$states['id']}}" {{ old('state_id') == $states['id'] ? 'selected': ''}}>{{$states['name']}}</option>
                                                    @endforeach
                                                </select>
                                                <span id="state_id" style="display: none; color: red;">
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="form-group custom-form-group">
                                                <label class="form-label" for="customer">City</label>
                                                <select id="city_id" class="form-control" autocomplete="off" name="city_id" id="city_id">
                                                    <option value="">Select City</option>
                                                </select>
                                                <span id="city" style="display: none; color: red;"> </span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row" id="appendBuyersAddress">
                                        
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="form-group custom-form-group">
                                                <input class="filled-in filled-check" name="group1" type="checkbox" id="check">
                                                <label for="check" class="order-label">Select for hyperlocal shipment</label>
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="form-group custom-form-group">
                                                <input class="filled-in filled-check" name="group1" type="checkbox" id="checks" checked>
                                                <label for="checks" class="order-label">Billing address same as delivery address</label>
                                            </div>
                                        </div>
                                        <div class="col-md-12 mt-5">
                                            <button id="secondHomeButton" type="button" class="btn btn-outline-dark next-btn" data-target="#home2" data-toggle="tab">Next</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!-- Tab-2  -->
                        <div class="tab-pane fade" id="home2" role="tabpanel" aria-labelledby="profile-tab">
                            <ul class="appointmnettabs forward-tab">
                                <li class="active">
                                    Buyer Details <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li class="active">
                                    Order Details <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li>
                                    Pickup Address <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li style="display: none;">
                                    Package Weight <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li>
                                    Other Details <div class="appoint-ratedashed appoint-ratedashedtop appoint-ratedashed-forward"><span class="appoint-rate"></span></div>
                                </li>
                            </ul>
                            <div class="row py-4 pt-sm-4 pb-sm-5">
                                <div class="col-md-3">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="orderid">Order ID<span class="text-danger">*</span></label>
                                        <input id="order_id" name="order_id" class="form-control" placeholder="Order ID" type="text" value="{{old('order_id')}}">
                                    </div>
                                </div>
                                <div class="col-md-1">
                                    
                                    <div class="form-group custom-form-group">
                                        
                                    </div>
                                   
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="orderdate">Order Date<span class="text-danger">*</span></label>
                                        <input id="start_date" name="start_date" class="form-control" placeholder="" type="date" value="{{old('start_date')}}" max="2025-12-15">
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="orderchannel">Order Channel<span class="text-danger">*</span></label>
                                        <input id="channel" name="channel" class="form-control" placeholder="Custom" type="text" value="custom" style="pointer-events: none;">
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="orderchannel">Order Type</label>
                                        <select class="form-control" name="order_type">
                                            <option value="">Select Order Type</option>
                                            <option value="essential">Essential</option>
                                            <option value="nonEssential">Non Essential</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="orderdate">Order Tag</label>
                                        <input id="order_tag" name="order_tag" class="form-control" placeholder="Please enter order tag" type="text" value="{{old('order_tag')}}" min="2025-12-15">
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="expected_time">Time Slot</label>
                                        
                                        <select class="form-control" name="expected_time" id="expected_time">
                                            <option value="">Select Time Slot</option>
                                            @foreach(timeSlots() as $timeSlotKey => $timeSlotValue)
                                            <option value="{{$timeSlotValue['id']}}">{{$timeSlotValue['slot']}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-4"> </div>
                                <div class="col-md-12 py-3">
                                    <h6 class="heading">Product Details</h6>
                                </div>
                                <div class="col-md-12">
                                    <div class="add-more">
                                        <div class="row">
                                            <div class="col-md-2">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="sku">SKU<span class="text-danger">*</span></label>
                                                    <select id="skuList0" name="sku[]" class="form-control product_sku" onblur="productName(this,0)">
                                                        @if(!empty($listData['productMasters']))
                                                        @foreach($listData['productMasters'] as $key => $value)
                                                        <option value="{{$value['id']}}">{{$value['code']}}</option>
                                                        @endforeach
                                                        @endif
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="col-md-2">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="product">Product Name<span class="text-danger">*</span></label>
                                                    <input name="name[]" class="form-control  product_name" placeholder="Product Name" type="text" value="" id="productNameList0">
                                                    
                                                </div>
                                            </div>
                                            <div class="col-md-2">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="quantity">Quantity<span class="text-danger">*</span></label>
                                                    <input name="quantity[]" class="form-control product_quantity AllowNumeric" placeholder="Enter Quantity" type="text" value="" onblur="priceCalculation(this,0)" id="quantity0">
                                                </div>
                                            </div>
                                            <div class="col-md-2">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="unit">Unit Price<span class="text-danger">*</span></label>
                                                    <input id="unit_price0" name="unit_price[]" class="form-control product_unit_price" placeholder="Enter Price" type="text" value="" onblur="priceCalculation(this,0)">
                                                </div>
                                            </div>
                                            <div class="col-md-2">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="hsn">Tax Rate</label>
                                                    <input id="tax_rate0" name="tax_rate[]" class="form-control product_tax_rate" placeholder="Enter Tax Rate" type="text" value="">
                                                </div>
                                            </div>
                                            <div class="col-md-2">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="hsn">HSN</label>
                                                    <input name="hsn[]" class="form-control product_hsn" placeholder="Enter Hsn" type="text" value="" id="productHsnList0">
                                                </div>
                                            </div>
                                            <div class="col-md-2">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="discount">Discount</label>
                                                    <div class="input-group mb-3">
                                                        <input id="discount0" name="discount[]" class="form-control product_discount" placeholder="Enter Discount" type="text" value="" onblur="priceCalculation(this,0)">
                                                        <div class="input-group-append">
                                                            <span class="input-group-text new-input-txt">
                                                                <select class="form-control discount_type" onblur="priceCalculation(this,0)" id="discount_type" name="discount_type[]">
                                                                    <option value="rs">₹</option>
                                                                    <option value="percentage">%</option>
                                                                </select></span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-2">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="category">Product Category</label>
                                                    <select class="form-control product_category" name="productCategory[]" id="product_category0">
                                                        <option value="">Select Category</option>
                                                        @if($listData['categoryData'])
                                                        @foreach($listData['categoryData'] as $productCategries)
                                                        <option value="{{$productCategries['id']}}" {{ old('country_id') == $productCategries['id'] ? 'selected': ''}}>{{$productCategries['name']}}</option>
                                                        @endforeach
                                                        @endif
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="col-md-2">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="productWeight">Weight (kg)</label>
                                                    <input id="productWeight0" name="productWeight[]" class="form-control product_weight" placeholder="Enter weight" type="text" value="">
                                                </div>
                                            </div>
                                            <div class="col-md-2">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="productLength">Length (cm)</label>
                                                    <input id="productLength0" name="productLength[]" class="form-control product_length" placeholder="Enter Length" type="text" value="">
                                                </div>
                                            </div>
                                            <div class="col-md-2">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="productWidth">Width (cm)</label>
                                                    <input id="productWidth0" name="productWidth[]" class="form-control product_width" placeholder="Enter Width" type="text" value="">
                                                </div>
                                            </div>
                                            <div class="col-md-2">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="productHeight">Height (cm)</label>
                                                    <input id="productHeight0" name="productHeight[]" class="form-control product_height" placeholder="Enter Height" type="text" value="">
                                                </div>
                                            </div>
                                            <div class="col-md-3">
                                                <div class="form-group custom-form-group">
                                                    <label class="form-label" for="category">&nbsp;&nbsp;</label><br />
                                                    <button type="button" class="btn btn-danger mr-2 add_field_button"><img src="{{asset('assets/images/add-icon.svg')}}" alt=""></button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-12 py-3">
                                    <h6 class="heading">Payments</h6>
                                </div>
                                <div class="col-md-2 col-7">
                                    <input class="with-gap" name="payment_mode" type="radio" id="number" value="cod" checked>
                                    <label for="number" class="order-label">Cash on Delivery</label>
                                </div>
                                <div class="col-md-2 col-5">
                                    <input class="with-gap" name="payment_mode" type="radio" id="number1" value="prepaid">
                                    <label for="number1" class="order-label">Pre-paid</label>
                                </div>
                                <div class="col-md-2 col-6">
                                    <h6 class="font-weight-bold" id="subtotalCalCulation">Sub Total: ₹ 0</h6>
                                </div>
                                <div class="col-md-12 py-3">
                                    <h6 class="heading">Other Charges</h6>
                                </div>
                                <div class="col-md-2 col-6">
                                    <div class="form-group custom-form-group">
                                        <input class="filled-in filled-check" name="other_charges" type="checkbox" id="check1" value="shipping">
                                        <label for="check1" class="order-label">Shipping</label>
                                    </div>
                                </div>
                                <div class="col-md-2 col-6">
                                    <div class="form-group custom-form-group">
                                        <input class="filled-in filled-check" name="other_charges" type="checkbox" id="check2" value="giftwrap">
                                        <label for="check2" class="order-label">Gift Wrap</label>
                                    </div>
                                </div>
                                <div class="col-md-2 col-6">
                                    <div class="form-group custom-form-group">
                                        <input class="filled-in filled-check" name="other_charges" type="checkbox" id="check3" value="transaction" checked>
                                        <label for="check3" class="order-label">Transaction</label>
                                    </div>
                                </div>
                                <div class="col-md-2 col-6">
                                    <div class="form-group custom-form-group">
                                        <input class="filled-in filled-check" name="other_charges" type="checkbox" id="check4" value="discount">
                                        <label for="check4" class="order-label">Discounts</label>
                                    </div>
                                </div>
                                <div class="col-md-12 mt-5">
                                    <button type="button" id="secondPreviosButton" class="btn btn-outline-dark next-btn mr-3" data-target="#home1" data-toggle="tab">Previous</button>
                                    <button id="thirdNextHomeButtonb" type="button" class="btn btn-outline-dark next-btn" data-target="#home3" data-toggle="tab">Next</button>
                                </div>
                            </div>
                        </div>
                        <!-- Tab-3  -->
                        <div class="tab-pane fade" id="home3" role="tabpanel" aria-labelledby="profile-tab">
                            <ul class="appointmnettabs forward-tab">
                                <li class="active">
                                    Buyer Details <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li class="active">
                                    Order Details <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li class="active">
                                    Pickup Address <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li style="display: none;">
                                    Package Weight <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li>
                                    Other Details <div class="appoint-ratedashed appoint-ratedashedtop appoint-ratedashed-forward"><span class="appoint-rate"></span></div>
                                </li>
                            </ul>
                            <div class="row py-4">
                                <div class="col-md-6 col-7">
                                    <div class="">
                                        <h6 class="heading">Pickup Address <span class="text-danger">*</span></h6>
                                        <p class="font-italic mt-1">Select a pickup location for the order</p>
                                    </div>
                                </div>
                                <div class="col-md-6 col-5">
                                    <div class="float-right location-btns mb-4">
                                        <button id="addAddressModalButton" type="button" class="btn btn-danger mr-2" data-toggle="modal" data-target="#addressmodal12"><i class="fa fa-plus" aria-hidden="true"></i> Add Address</button>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group address-search">
                                       
                                    </div>
                                </div>
                            </div>
                            <div class="row py-5 py-sm-5 address-radio-btns">
                               
                                <div class="col-md-12">
                                    <div class="row add-user-address-html">
                                    </div>
                                </div>
                                <div class="col-md-12 mt-5">
                                    <button type="button" id="thirdPreviosButton" class="btn btn-outline-dark next-btn mr-3" data-target="#home2" data-toggle="tab">Previous</button>
                                    <button id="nextButtonHome4" type="button" class="btn btn-outline-dark next-btn" data-target="#home5" data-toggle="tab">Next</button>
                                </div>
                            </div>
                        </div>
                        <div class="tab-pane fade" id="home4" role="tabpanel" aria-labelledby="profile-tab">
                            <ul class="appointmnettabs forward-tab">
                                <li class="active">
                                    Buyer Details <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li class="active">
                                    Order Details <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li class="active">
                                    Pickup Address <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li class="active" style="display: none;">
                                    Package Weight <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li>
                                    Other Details <div class="appoint-ratedashed appoint-ratedashedtop appoint-ratedashed-forward"><span class="appoint-rate"></span></div>
                                </li>
                            </ul>
                            <div class="row py-4 pt-sm-4">
                                <div class="col-md-12">
                                    <h6 class="heading">Package Details</h6>
                                </div>
                               
                                <div class="col-md-3">
                                    
                                </div>
                                <div class="col-md-12 mt-3">
                                    <button type="button" class="btn btn-danger" data-toggle="modal" data-target="#packagemodal" style="height:35px;">Add Package</button>
                                </div>
                            </div>
                            <div>
                                <div class="table-responsive">
                                    <table class="table table-bordered table-striped package-table">
                                        <thead>
                                            <tr>
                                                <th>Product Name</th>
                                                <th> SKU'S</th>
                                                <th>Quantity</th>
                                                <th>Packages</th>
                                                <th>Weight(kg)</th>
                                                <th>Length(cm)</th>
                                                <th>Width(cm)</th>
                                                <th>Height(cm)</th>
                                            </tr>
                                        </thead>
                                        <tbody id="addMultiplePackagesTables">
                                        </tbody>
                                    </table>
                                </div>
                               
                                <table>
                                </table>
                            </div>
                            <div class="row mt-3">
                               
                            </div>
                            <div class="row mt-3">
                               
                                <div class="col-md-12 mt-5">
                                    <button type="button" id="forthPreviosButton" class="btn btn-outline-dark next-btn mr-3" data-target="#home3" data-toggle="tab">Previous</button>
                                    <button id="nextButtonHome5" type="button" class="btn btn-outline-dark next-btn" data-target="#home5" data-toggle="tab">Next</button>
                                </div>
                            </div>
                        </div>
                        <!-- Tab-5  -->
                        <div class="tab-pane fade" id="home5" role="tabpanel" aria-labelledby="profile-tab">
                            <ul class="appointmnettabs forward-tab">
                                <li class="active">
                                    Buyer Details <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li class="active">
                                    Order Details <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li class="active">
                                    Pickup Address <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li class="active" style="display: none;">
                                    Package Weight <div class="appoint-ratedashed"><span class="appoint-rate"></span></div>
                                </li>
                                <li class="active">
                                    Other Details <div class="appoint-ratedashed appoint-ratedashedtop appoint-ratedashed-forward"><span class="appoint-rate"></span></div>
                                </li>
                            </ul>
                            <div class="row py-4 pt-sm-4 pb-sm-5">
                                <div class="col-md-12 pb-3">
                                    <h6 class="heading">Other Details</h6>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="reseller">Reseller Name <img src="{{asset('assets/mages/Info.svg')}}" class="ml-1" height="18px" alt=""></label>
                                        <input name="reseller_name" class="form-control alphabetsonly" placeholder="Reseller Name" type="text" value="{{old('reseller_name')}}">
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="bill">Eway Bill No. <img src="{{asset('assets/images/Info.svg')}}" class="ml-1" height="18px" alt=""></label>
                                        <input name="eway_bill_number" class="form-control" placeholder="Eway Bill No" type="text" value="{{old('eway_bill_number')}}">
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group custom-form-group">
                                        <label class="form-label" for="gstin">GSTIN No. <img src="{{asset('assets/images/Info.svg')}}" class="ml-1" height="18px" alt=""></label>
                                        <input name="gstin_no" class="form-control gst" placeholder="GSTIN No" type="text" value="{{old('gstin_no')}}">
                                        <span id="gstin-error" style="display: none; color: red;"> </span>
                                    </div>
                                </div>
                                <div class="col-md-12 mt-5">
                                    <button type="button" id="fifthPreviousButton" class="btn btn-outline-dark next-btn mr-3" data-target="#home3" data-toggle="tab">Previous</button>
                                    <button type="submit" class="btn btn-danger">Add Order</button>
                                </div>
                            </div>
                        </div>
                    </div>
            </div>
            <!-- Modal Popup  -->
            <div class="modal fade" id="addressmodal12" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
                <div class="modal-dialog modal-xl">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title mb-0" id="exampleModalLabel">
                                <div class="title-section">
                                    <p>Add Pickup Address</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="userModelFormAddress" method="post" autocomplete="off">
                                        @csrf
                                        <div class="row">
                                            <div class="col-md-12">
                                                <div class="row">
                                                    <div class="col-md-12 mb-3">
                                                        <h6 class="heading">Contact Info</h6>
                                                    </div>
                                                    <div class="col-md-3">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="address">Address Nickname<span class="text-danger">*</span></label>
                                                            <input class="form-control alphabetsonly" name="addressNickName" placeholder="Enter Address Nickname" type="text" value="" id="addressNickName">
                                                            <span id="addressNickName-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-3">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="name">Contact Name<span class="text-danger">*</span></label>
                                                            <input class="form-control alphabetsonly" name="contactName" placeholder="Enter Contact Name" type="text" value="" id="contactName">
                                                            <span id="contactName-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-3">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="phone">Phone<span class="text-danger">*</span></label>
                                                            <input class="form-control AllowNumeric" name="phoneNumber" placeholder="Enter Contact Name" type="text" value="" id="phoneNumber">
                                                            <p class="mt-2 font-weight-bold"><a href="#" class="text-dark">Verify via OTP</a></p>
                                                            <span id="phoneNumber-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-3">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="phone">Alternate Phone</label>
                                                            <input class="form-control AllowNumeric" name="alternatePhoneNumberAddress" placeholder="Enter Alternate Number" type="text" value="" id="alternatePhoneNumberAddress">
                                                            <span id="alternatePhoneNumberAddress-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-3">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="phone">Email</label>
                                                            <input class="form-control" name="alternateEmailAddress" placeholder="Enter Email" type="email" value="" id="alternateEmailAddress">
                                                            <span id="alternateEmailAddress-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="col-md-12">
                                                <div class="row">
                                                    <div class="col-md-12 mb-3">
                                                        <h6 class="heading">Address Detail</h6>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="customer">Address Line 1<span class="text-danger">*</span></label>
                                                            <input class="form-control" name="userAddressaddressLine1" placeholder="Enter Address" type="text" value="" id="userAddressaddressLine1">
                                                            <span id="userAddressaddressLine1-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="customer">Address Line 2</label>
                                                            <input class="form-control" name="userAddressaddressLine2" placeholder="Enter address line 1" type="text" value="" id="userAddressaddressLine2">
                                                            <span id="userAddressaddressLine2-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="pincode">Pincode<span class="text-danger">*</span></label>
                                                            <input class="form-control AllowNumeric" name="userAddressPincode" placeholder="Enter Pincode" type="text" value="" id="userAddressPincode">
                                                            <span id="userAddressPincode-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="country">Country<span class="text-danger">*</span></label>
                                                            <select class="form-control" name="userAddressCountry" id="userAddressCountry">
                                                                <option value="1">India</option>
                                                            </select>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="state">State<span class="text-danger">*</span></label>
                                                            <select class="form-control" name="userAddressState" id="userAddressState">
                                                                <option value="">Select State</option>
                                                                @foreach($listData['state'] as $states)
                                                                <option value="{{$states['id']}}" {{ old('userAddressState') == $states['id'] ? 'selected': ''}}>{{$states['name']}}</option>
                                                                @endforeach
                                                            </select>
                                                            <span id="userAddressState-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="city">City<span class="text-danger">*</span></label>
                                                            <select class="form-control" autocomplete="off" name="userAddressCity" id="userAddressCity">
                                                                <option value="">Select City</option>
                                                            </select>
                                                            <span id="userAddressCity-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-12">
                                                        <div class="form-group custom-form-group mt-3">
                                                            <input class="filled-in filled-check" name="supplierAddressCheckBox" type="checkbox" id="supplieraddress">
                                                            <label for="supplieraddress" class="order-label">Add this address as supplier/vendor address</label>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-12">
                                                        <div class="form-group custom-form-group mt-2">
                                                            <input class="filled-in filled-check" name="rtoAddressCheckBox" type="checkbox" id="rtoaddress">
                                                            <label for="rtoaddress" class="order-label">Use a diffrent address as RTO address</label>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4" style="display:none;" id="supplier_vendor_name">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="address">Supplier/Vendor's Name</label>
                                                            <input class="form-control" id="supplier_vendor_input_name" name="supplier_vendor_input_name" placeholder="Supplier/Vendor's Name" type="text" value="">
                                                            <span id="supplier_vendor_input_name-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4" style="display:none;" id="supplier_vendor_gstin_number">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="address">Supplier/Vender's GSTIN</label>
                                                            <input class="form-control" id="supplier_vendor_gstin_number1" name="supplier_vendor_gstin_number1" placeholder="GSTIN" type="text" value="">
                                                            <span id="supplier_vendor_gstin_number1-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            
                                        </div>
                                        <div class="row mt-2" style="display:none" id="differentAddressRto">
                                            <div class="col-md-12">
                                                <div class="row rto-address">
                                                    <div class="col-md-4">
                                                        <div class="form-group address-search mb-0">
                                                            <label class="form-label" for="customer">Selected Pickup Address</label>
                                                            <input class="form-control" placeholder="Select by location name,city,state,pincode" type="text" value="" id="pickupAddressSearch">
                                                        </div>
                                                        <p class="text-danger mt-0">*Note: RTO address is only applicable for Xpressbees,Delivery, Bluedart, Ekart and Ecom express
                                                        </p>
                                                    </div>
                                                    <div class="col-md-3">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="customer">&nbsp;&nbsp;</label>
                                                            <p class="mt-0 rto-circle">or</p>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group custom-form-group mb-0">
                                                            <label class="form-label" for="amount">&nbsp;&nbsp;</label><br />
                                                            <button type="button" class="btn btn-primary" id="rtoaddressButton">Add a new RTO Address</button>
                                                        </div>
                                                        <span class="mt-0">*New address will be saved as a pickup address</span>
                                                    </div>
                                                    
                                                </div>
                                            </div>
                                            <div class="col-md-12">
                                                <div class="row add-user-address-html-model-search">
                                                </div>
                                            </div>
                                            <div class="col-md-12" id="rtoaddressDataId">
                                                <div class="row">
                                                    <div class="col-md-12 py-3">
                                                        <h6 class="heading">RTO Contact Info</h6>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="address">Address Nickname<span class="text-danger">* </span> <img src="images/Info.svg" class="ml-1" height="18px" alt=""></label>
                                                            <input class="form-control" name="anotherNickNameAddress" placeholder="Enter Address Nickname" type="text" value="" id="anotherNickNameAddress">
                                                            <span id="anotherNickNameAddress-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="contact">Contact Name<span class="text-danger">*</span></label>
                                                            <input class="form-control" name="anotherContactName" placeholder="Enter Contact Name" type="text" value="" id="anotherContactName">
                                                            <span id="anotherContactName-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group custom-form-group mb-2">
                                                            <label class="form-label" for="phone">Phone<span class="text-danger">*</span> <img src="images/Info.svg" class="ml-1" height="18px" alt=""></label>
                                                            <input class="form-control" name="anotherPhoneNumber" placeholder="Enter Phone Number" type="text" value="" id="anotherPhoneNumber">
                                                            <span id="anotherPhoneNumber-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                        <div class="Verify-otp">
                                                            <div class="row align-items-center">
                                                                <div class="col-md-4">
                                                                    <a href="">Verify via OTP</a>
                                                                </div>
                                                                <div class="col-md-3">
                                                                    <p class="mt-0 rto-circle">or</p>
                                                                </div>
                                                                <div class="col-md-4">
                                                                    <a href="">Verify via IVR</a>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="phone">Alternate Phone <img src="images/Info.svg" class="ml-1" height="18px" alt=""></label>
                                                            <input class="form-control" name="anthoreAlternateNumebr" placeholder="Enter Alternate Number" type="text" value="" id="anthoreAlternateNumebr">
                                                            <span id="anthoreAlternateNumebr-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="email">Email<span class="text-danger">*</span></label>
                                                            <input class="form-control" name="anotherEmail" placeholder="Enter Email Id" type="email" value="" id="anotherEmail">
                                                            <span id="anotherEmail-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-12 py-3">
                                                        <h6 class="heading">Address Details</h6>
                                                    </div>
                                                    <div class="col-md-5">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="customer">Address Line 1<span class="text-danger">*</span></label>
                                                            <input class="form-control" name="anotherAddressLine1" placeholder="Address Line 1" type="text" value="" id="anotherAddressLine1">
                                                            <span id="anotherAddressLine1-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-5">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="customer">Address Line 2</label>
                                                            <input class="form-control" name="anotherAddressLine2" placeholder="" type="text" value="" id="anotherAddressLine2">
                                                            <span id="anotherAddressLine2-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-3">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="pincode">Pincode<span class="text-danger">*</span></label>
                                                            <input class="form-control" name="anotherPincode" placeholder="" type="text" value="" id="anotherPincode">
                                                            <span id="anotherPincode-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-3">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="state">State<span class="text-danger">*</span></label>
                                                            <select class="form-control" name="anotherState" id="anotherState">
                                                                <option value="">Select State</option>
                                                                @foreach($listData['state'] as $states)
                                                                <option value="{{$states['id']}}" {{ old('anotherState') == $states['id'] ? 'selected': ''}}>{{$states['name']}}</option>
                                                                @endforeach
                                                            </select>
                                                            <span id="anotherState-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-3">
                                                        <div class="form-group custom-form-group">
                                                            <label class="form-label" for="city">City<span class="text-danger">*</span></label>
                                                            <!-- <input class="form-control" name="anotherCity" placeholder="" type="text" value="" id="anotherCity"> -->
                                                            <select class="form-control" autocomplete="off" name="anotherCity" id="anotherCity">
                                                                <option value="">Select City</option>
                                                            </select>
                                                            <span id="anotherCity-error" style="display: none; color: red;"> </span>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-12 mt-2">
                                                        <div class="rto-btns text-center mt-3">
                                                            <!-- <button type="button" class="btn btn-outline-primary mr-3">Cancel</button>
                            <button type="button" class="btn btn-primary">Save Address</button> -->
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                </div>
                                <div class="modal-footer">
                                    <div class="float-right import-btns">
                                        <button type="button" id="cancelAddAdressButton" class="btn btn-outline-dark next-btn mr-3">Cancel</button>
                                        <button type="button" id="adduserAddressButton" class="btn btn-danger save-btn">Save</button>
                                    </div>
                                </div>
                                </form>
                            </div>
                        </div>
                    </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="col-md-4">
                                    <div class="form-group custom-form-group mb-1">
                                        <label class="form-label" for="customer"><span class="text-danger">*</span>Weight</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_weight" id="new_package_weight">
                                            <div class="input-group-append">
                                                <span class="input-group-text">kg</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  -->
            </form> <!-- ------- -->
        </div>
</section>
<style>
    .new-input-txt{height:35px; border: 0; padding: 0px; background: #E5F7FD;}
    #save_buyer_details label.error {
        margin-left: 10px;
        width: auto;
        display: inline;
    }

    .rtoaddressData {
        display: none;
    }

    .dissbleClickButton {
        pointer-events: none;
    }

.add-icon{height: 50px; width: 50px; margin: 0 auto; background-color: red;
    border-radius: 50px; line-height: 59px; text-align: center; margin-top: 50px;}
.add-icon i{color: #ffffff; font-size: 25px;}

.form-control{
    border: none;
    border-radius: 4px;
    background-color: #E5F7FD !important;
    height: 35px;
    color: #000000;
}

/* input text code  */
.input-group-text{padding: 0 0.8rem;}

.new-address-radio input[type="radio"]+label:before,
.new-address-radio  input[type="radio"]+label:after{
    height: 30px !important;
    width: 30px !important;
    position: absolute;
    content: '';
    right: 0;
    top: -13px;
    z-index: 3;
    transition: .28s ease;
    background: #FFFFFF;
    border: 1px solid #00AEEF;
    margin-right: 0px;}

.new-card-header {padding: 0.25rem 1.25rem;}
.new-card-body{padding: 0.25rem 1rem;}
.new-card-body p{margin-bottom: 0px; font-size: 13px;}

.new-address-radio [type="radio"]:not(:checked)+label, .new-address-radio [type="radio"]:checked+label{padding-left: 18px !important;}

</style>
<script type="text/javascript">
    
let productMaster = '[]';
let hsnMaster = '[]';
let skuMaster = '[]';
let categoryData = '[]';
let packageDetails = '[]';

function fetchUserDetails(val) {

    let mobileNumber = val.value;

    if (mobileNumber.length == 10) {
        jQuery.ajax({
            url: "{{route('fetch-user-details')}}",
            type: "POST",
            data: { _token: "{{csrf_token()}}", mobileNumber: mobileNumber },
            success: function(data) {
                let pincode = '';
                if (data.data) {
                    pincode = data.data.address.pincode;
                    $('#buyer_name').val(data.data.first_name);
                    $('#alt_mobile_number').val(data.data.alternate_mobile_number);
                    $('#email').val(data.data.email);
                    $('#address1').val(data.data.address.address);
                    $('#address2').val(data.data.address.temp_address);
                    $('#pincode').val(data.data.address.pincode);
                } else {

                    $('#buyer_name').val('');
                    $('#alt_mobile_number').val('');
                    $('#email').val('');
                    $('#address1').val('');
                    $('#address2').val('');
                    $('#pincode').val('');

                }




                if (pincode.length == 6) {

                    $('#custum-loader').removeClass('hidden');
                    jQuery.ajax({
                        url: "{{route('pincode-country-state')}}",
                        type: "POST",
                        data: { _token: "{{csrf_token()}}", pincode: pincode },
                        success: function(data) {
                            $('#custum-loader').addClass('hidden');
                            if (!data.data) {
                                jQuery('select[name="state_id"]').empty();
                                jQuery('select[name="country_id"]').empty();
                                jQuery('select[name="city_id"]').empty();

                                $('#state_id').removeClass('dissbleClickButton');
                                $('#city_id').addClass('dissbleClickButton');
                                $('#country_id').removeClass('dissbleClickButton');


                                $('select[name="country_id"]').append('<option value="">' + 'Select Country' + '</option>');
                                $('select[name="country_id"]').append('<option value="' + 101 + '">' + 'India' + '</option>');

                                $('select[name="state_id"]').append('<option value="">' + 'Select State' + '</option>');

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

                                    $('select[name="state_id"]').append('<option value="' + value.id + '">' + value.name + '</option>');
                                });

                                swal({
                                    icon: 'error',
                                    title: "Alert",
                                    text: 'Pincode is not serviceable.',
                                    type: "error",

                                    closeOnConfirm: false,
                                    showLoaderOnConfirm: true,
                                });
                                return;
                            } else {
                                $('#state_id').addClass('dissbleClickButton');
                                $('#city_id').addClass('dissbleClickButton');
                                $('#country_id').addClass('dissbleClickButton');

                                jQuery('select[name="state_id"]').empty();
                                jQuery('select[name="city_id"]').empty();
                                jQuery('select[name="country_id"]').empty();

                                $('select[name="country_id"]').append('<option value="' + 101 + '">' + 'India' + '</option>');

                                if (data.data.state) {
                                    $('select[name="state_id"]').append('<option value="' + data.data.state.id + '">' + data.data.state.name + '</option>');
                                }

                                if (data.data.district) {
                                    $('select[name="city_id"]').append('<option value="' + data.data.district.id + '">' + data.data.district.name + '</option>');
                                }

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

                        }
                    });

                }

                //Append Buyers Address Defaults :-

                $('#appendBuyersAddress').empty();

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

                    console.log('data',data.data);

                    /* let html12 = '<div class="col-md-4"><div class="address-radio"><input class="with-gap fill-gap" name="userAddressSectedData" type="radio" id="number' + htmlId + '" value="' + value.id + '" ' + (data.defaultAddress.id ? "checked" : "") + '><label for="number' + htmlId + '" class="w-100" ><div class="card address-card"><div class="card-header address-card-header">' + value['address'] + '</div><div class="card-body address-card-body"><p>' + value['contact_name'] + '</p><p>' + value['temp_address'] + '</p><p>Post box -' + value['pincode'] + '</p><p>' +  value['temp_address'] + '</p><h6>Phone: <strong> ' + value['phoneNumber'] + '</strong></h6></div></div></label></div></div>';*/

                    //alert('aya');

                    let buyersHtml = '<div class="col-md-3"><div class="address-radio new-address-radio"><input class="with-gap fill-gap" name="buyersDefaultAddress" type="radio" id="number' + '-' + '' + value.id + '" value="' + value.id + '" ' + (data.data.address.id == value.id ? "checked" : "") + '><label for="number' + '-' + '' + value.id + '" class="w-100"><div class="card address-card"><div class="card-header address-card-header new-card-header">' + value.address + '</div><div class="card-body address-card-body new-card-body"><p>' + value.temp_address   + '</p><p>' + value.state.name  + ',</p><p>Pincode - ' + value.pincode  + '</p></div></div></label></div></div>';

                    $('#appendBuyersAddress').append(buyersHtml);

                });


            }
        });
    }

}


function minimumChargableWeight(event) {
    
}

$(document).ready(function() {
    $('#skuList0').editableSelect();
    $('#product_category0').editableSelect();

    $("#rtoaddressDataId").hide();

    Date.prototype.toDateInputValue = (function() {
        var local = new Date(this);
        local.setMinutes(this.getMinutes() - this.getTimezoneOffset());
        return local.toJSON().slice(0, 10);
    });

    $('#start_date').val(new Date().toDateInputValue());



    let height = 0;
    let width = 0;
    let length = 0;
    let totalVolumetricWeight = 0;
    let weight = 0;

    $("#height").blur(function() {
        weight = $('#weight').val() ? $('#weight').val() : 0;
        height = $('#height').val();
        totalVolumetricWeight = (height != 0) && (width != 0) && (length != 0) ? ((height * width * length) / 5000) : 0;
        $('#voumetricWeightId').text(totalVolumetricWeight);
        if (totalVolumetricWeight > weight) {
            $('#minimumChargableWeight').text(totalVolumetricWeight);
        } else {
            $('#minimumChargableWeight').text(weight);
        }
        return height;
    });

    $("#width").blur(function() {
        weight = $('#weight').val() ? $('#weight').val() : 0;
        width = $('#width').val();
        totalVolumetricWeight = (height != 0) && (width != 0) && (length != 0) ? ((height * width * length) / 5000) : 0;
        $('#voumetricWeightId').text(totalVolumetricWeight);
        if (totalVolumetricWeight > weight) {
            $('#minimumChargableWeight').text(totalVolumetricWeight);
        } else {
            $('#minimumChargableWeight').text(weight);
        }
        return width;
    });

    $("#length").blur(function() {
        weight = $('#weight').val() ? $('#weight').val() : 0;
        length = $('#length').val();
        totalVolumetricWeight = (height != 0) && (width != 0) && (length != 0) ? ((height * width * length) / 5000) : 0;
        $('#voumetricWeightId').text(totalVolumetricWeight);
        if (totalVolumetricWeight > weight) {
            $('#minimumChargableWeight').text(totalVolumetricWeight);
        } else {
            $('#minimumChargableWeight').text(weight);
        }
        return length;
    });

    $("#weight").blur(function() {
        weight = $('#weight').val() ? $('#weight').val() : 0;
        length = $('#length').val();
        totalVolumetricWeight = (height != 0) && (width != 0) && (length != 0) ? ((height * width * length) / 5000) : 0;
        $('#voumetricWeightId').text(totalVolumetricWeight);
        if (totalVolumetricWeight > weight) {
            $('#minimumChargableWeight').text(totalVolumetricWeight);
        } else {
            $('#minimumChargableWeight').text(weight);
        }
        return length;
    });


    //For generate random number Function :-

    //$("#random_number").on("click", function(e) {

    let number = Math.floor(Math.random() * 1000000000);
    $("#order_id").val(number.toString())

    //})

    // validate signup form on keyup and submit

    $("#save_buyer_details").validate({
        // myField: { lettersonly: true }

        rules: {
            //Buyers Validations
            buyer_name: "required",
            expected_time: "required",
            mobile_number: {
                required: true,
                digits: true,
                minlength: 10,
                maxlength: 10
            },
            email: {
                required: true,
                email: true
            },
            address1: "required",
            //address2: "required",
            pincode: {
                required: true,
                digits: true,
                minlength: 6,
                maxlength: 6
            },
            country_id: "required",
            state_id: "required",
            city_id: "required",

            //Product Validations
            order_id: {
                required: true,
            },
            start_date: "required",
            channel: "required",

            //weight Validations
            weight: {
                required: true,
                number: true,
            },
            length: {
                required: true,
                number: true,
            },
            width: {
                required: true,
                number: true,
            },
            height: {
                required: true,
                number: true,
            },
            'tax_rate[]': {
                number: true,
                maxlength: 3
            },
            'discount[]': {
                number: true,
                maxlength: 3
            },
        },
        messages: {
            buyer_name: "Please enter your buyer name",
            mobile_number: {
                required: 'Please enter mobile number',
                digits: 'please enter digits only',
                minLength: 'Invalid mobile number',
                maxlength: 'Invalid mobile number'
            },
            pincode: {
                required: 'Please enter pincode',
                digits: 'please enter digits only',
                minLength: 'Invalid pincode',
                maxlength: 'Invalid pincode'
            },
            alt_mobile_number: {
                // required : 'Please enter mobile number',
                digits: 'please enter digits only',
                minLength: 'Invalid mobile number',
                maxlength: 'Invalid mobile number'
            },
            email: {
                required: 'Email is required',
                email: 'Please enter a valid email address'
            },
            order_id: {
                required: 'Please enter order id.',
            },
            address1: "Please enter address line 1",
            //address2: "Please enter address line 2",
            country_id: "Please enter country",
            state_id: "Please enter state",
            city_id: "Please enter city",

            weight: {
                required: 'Weight is required.',
                number: 'Weight must be a number.',
            },
            length: {
                required: 'Weight is required.',
                number: 'Weight must be a number.',
            },
            width: {
                required: 'Weight is required.',
                number: 'Weight must be a number.',
            },
            height: {
                required: 'Weight is required.',
                number: 'Weight must be a number.',
            },
            'tax_rate[]': {
                number: 'Tax rate must be a number.',
            },
            'discount[]': {
                number: 'Discount must be a number.',
                max: 'Discount not be more than 100%.',
            },
            expected_time: {
                expected_time: 'Expected pickup time.'
            }

        }

    });

    //Validations for product details.

    function addValidationRules() {

        $('.product_name').each((i, e) => {

            $(e).rules("add", {
                required: true
            })

        });

        $('.product_sku').each((i, e) => {

            $(e).rules("add", {
                required: true
            })

        });

        $('.product_quantity').each((i, e) => {

            $(e).rules("add", {
                required: true,
                number: true
            })

        });

        $('.product_unit_price').each((i, e) => {

            $(e).rules("add", {
                required: true,
                number: true
            })

        });

        $('.product_height').each((i, e) => {

            $(e).rules("add", {
                required: true,
                number: true
            })

        });

        $('.product_width').each((i, e) => {

            $(e).rules("add", {
                required: true,
                number: true
            })

        });

        $('.product_length').each((i, e) => {

            $(e).rules("add", {
                required: true,
                number: true
            })

        });

        $('.product_weight').each((i, e) => {

            $(e).rules("add", {
                required: true,
                number: true
            })

        });

    }



    addValidationRules();

    //For Additional Products

    var max_fields = 3;
    var wrapper = $(".add-more");
    var add_button = $(".add_field_button");

    let x = 0;

    $(add_button).on('click', function(e) {

        e.preventDefault();

        if (x < max_fields && $("#save_buyer_details").valid()) {

            x++;

            let html1 = '<div class="row" id="row' + x + '"><div class="col-md-12"><div class="add-more"><div class="row"><div class="col-md-2"><div class="form-group custom-form-group"><label class="form-label" for="sku">SKU<span class="text-danger">*</span></label><select id="skuList' + x + '" name="sku[]" class="form-control product_sku" onblur="productName(this,' + x + ')">@foreach($listData['productMasters'] as $key => $value)<option value="{{$value['id']}}">{{$value['code']}}</option>@endforeach</select></div></div><div class="col-md-2"><div class="form-group custom-form-group"><label class="form-label" for="product">Product Name<span class="text-danger">*</span></label><input name="name[]" class="form-control  product_name" placeholder="Product Name" type="text" value="" id="productNameList' + x + '"></div></div><div class="col-md-2"><div class="form-group custom-form-group"><label class="form-label" for="quantity">Quantity<span class="text-danger">*</span></label><input id="quantity' + x + '" name="quantity[]" class="form-control product_quantity" placeholder="" type="text" value="" onblur="priceCalculation(this,' + x + ')"> </div></div><div class="col-md-2"><div class="form-group custom-form-group"><label class="form-label" for="unit">Unit Price<span class="text-danger">*</span></label><input id="unit_price' + x + '" name="unit_price[]" class="form-control product_unit_price" placeholder="" type="text" value="" onblur="priceCalculation(this,' + x + ')"> </div></div><div class="col-md-2"><div class="form-group custom-form-group"><label class="form-label product_tax_rate" for="hsn">Tax Rate</label><input id="tax_rate' + x + '" name="tax_rate[]" class="form-control" placeholder="" type="text" value=""> </div></div><div class="col-md-2"><div class="form-group custom-form-group"><label class="form-label product_hsn" for="hsn">HSN</label><input name="hsn[]" class="form-control product_hsn" placeholder="Enter Hsn" type="text" value="" id="productHsnList' + x + '"></div></div><div class="col-md-2"><div class="form-group custom-form-group"><label class="form-label" for="discount">Discount</label><div class="input-group mb-3"> <input id="discount' + x + '" name="discount[]" class="form-control product_discount" placeholder="Enter Discount" type="text" value="" onblur="priceCalculation(this,' + x + ')"> <div class="input-group-append"> <span class="input-group-text new-input-txt"> <select class="form-control discount_type" id="discount_type' + x + '" name="discount_type[]" onblur="priceCalculation(this,' + x + ')"> <option>₹</option> <option>%</option> </select></span> </div></div> </div></div><div class="col-md-2"><div class="form-group custom-form-group"><label class="form-label product_category" for="category">Product Category</label><select class="form-control product_category" id="product_category' + x + '" name="productCategory[]"><option value="">Select Category</option>@foreach($listData['categoryData'] as $productCategries)<option value="{{$productCategries['id']}}" {{ old('country_id') == $productCategries['id'] ? 'selected': ''}}>{{$productCategries['name']}}</option>@endforeach</select></div></div><div class="col-md-2"><div class="form-group custom-form-group"><label class="form-label" for="productWeight">Weight (kg)</label><input id="productWeight' + x + '" name="productWeight[]" class="form-control product_weight" placeholder="Enter Weight" type="text" value=""> </div></div><div class="col-md-2"><div class="form-group custom-form-group"><label class="form-label" for="productLength">Length (cm)</label><input id="productLength' + x + '" name="productLength[]" class="form-control product_length" placeholder="Enter Length" type="text" value=""> </div></div><div class="col-md-2"><div class="form-group custom-form-group"><label class="form-label" for="productWidth">Width</label><input id="productWidth' + x + '" name="productWidth[]" class="form-control product_width" placeholder="Enter Weight" type="text" value=""> </div></div><div class="col-md-2"><div class="form-group custom-form-group"><label class="form-label" for="productHeight">Height (cm)</label><input id="productHeight' + x + '" name="productHeight[]" class="form-control product_height" placeholder="Enter Height" type="text" value=""> </div></div><div class="col-md-3"><div class="form-group custom-form-group"><label class="form-label" for="category">&nbsp;&nbsp;</label><br /><button type="button" class="btn btn-danger mr-3 remove_field" id="' + x + '"><img src="{{asset('assets/images/trash-icon.svg ')}}" height="14px" alt=""></button></div></div></div></div></div></div>';

            $(wrapper).append(html1);

            let skuList1 = 'skuList' + x + '';
            let productCategoryList1 = 'product_category' + x + '';

            $('#' + skuList1).editableSelect();
            $('#' + productCategoryList1).editableSelect();

            addValidationRules();

        }
    })

    $(wrapper).on("click", ".remove_field", function(e) { //user click on remove text
        e.preventDefault();
        var button_id = $(this).attr("id");
        $('#row' + button_id + '').remove();
        x--;
    })


    //Buyer Details

    check = [];

    check = 'home2';


    //Movement with next button

    $("#secondHomeButton").on("click", function(e) {


        if ($("#save_buyer_details").valid()) {



            $('#home1').removeClass('active show');
            $('#home2').addClass('active show');
            $('#home3').removeClass('active show');
            $('#home4').removeClass('active show');
            $('#home5').removeClass('active show');
            $('#secondHomeButton').addClass('active');



        } else {

            $('#home1').addClass('active show');
            $('#home2').removeClass('active show');
            $('#home3').removeClass('active show');
            $('#home4').removeClass('active show');
            $('#home5').removeClass('active show');
            $('#secondHomeButton').addClass('active');

            swal({
                icon: 'error',
                title: "Alert",
                text: 'Please fill all mandatory fields.',
                type: "error",

                closeOnConfirm: true,
                showLoaderOnConfirm: true,
            });

            return;

        }




    });

    let appendSkusArr = [];
    let appendQuantityArr = [];
    let productNameArr = [];

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

    $("#thirdNextHomeButtonb").on("click", function(e) {

        appendQuantityArr = [];
        appendSkusArr = [];
        productNameArr = [];
        weightArr = [];
        lengthArr = [];
        widthArr = [];
        heightArr = [];


        addValidationRules();

        if ($("#save_buyer_details").valid()) {

            $('.product_quantity').each(function() {
                if ($(this).val()) {
                    appendQuantityArr.push(parseFloat($(this).val()));
                } else {
                    appendQuantityArr.push(0);
                }
            });

            $('.product_sku').each(function() {
                if ($(this).val()) {
                    appendSkusArr.push($(this).val());
                } else {
                    appendQuantityArr.push('');
                }
            });

            $('.product_name').each(function() {
                if ($(this).val()) {
                    productNameArr.push($(this).val());
                } else {
                    productNameArr.push('');
                }
            });

            $('.product_weight').each(function() {
                if ($(this).val()) {
                    weightArr.push($(this).val());
                } else {
                    weightArr.push('');
                }
            });
            $('.product_height').each(function() {
                if ($(this).val()) {
                    heightArr.push($(this).val());
                } else {
                    heightArr.push('');
                }
            });

            $('.product_length').each(function() {
                if ($(this).val()) {
                    lengthArr.push($(this).val());
                } else {
                    lengthArr.push('');
                }
            });

            $('.product_width').each(function() {
                if ($(this).val()) {
                    widthArr.push($(this).val());
                } else {
                    widthArr.push('');
                }
            });



            $('#addMultiplePackagesTables').empty();
            let decreamentIds = 0;
            $.each(appendQuantityArr, function(key, value) {

                let appendedSkusHtml = "<tr><td>" + productNameArr[key] + "</td><td>" + appendSkusArr[key] + "</td><td id='skusQuantity" + decreamentIds + "'>" + value + "</td><td><select class='package_masters' name='skuPackages[]' id='skuPackages" + decreamentIds + "'  onblur='skusPackageSelection(this," + decreamentIds + ")'><option value=''>Select</option></select></td><td><input id='skusWeight" + decreamentIds + "' name='skuProductWeight[]'value='" + weightArr[key] + "' /></td><td><input id='skuslength" + decreamentIds + "' name='skuProductLength[]'value='" + lengthArr[key] + "' readonly/></td><td><input id='skuswidth" + decreamentIds + "' name='skuProductWidth[]'value='" + widthArr[key] + "' readonly/></td><td><input  id='skusheight" + decreamentIds + "'' name='skuProductHeight[]'value='" + heightArr[key] + "' readonly/></td></tr>";

                $('#addMultiplePackagesTables').append(appendedSkusHtml);

                $.each(JSON.parse(packageDetails), function(key1, value1) {
                    let packageDetailsId = "skuPackages" + decreamentIds + ""
                    $('#' + packageDetailsId).append('<option value=' + value1.id + '>' + value1.name + '</option>');
                });

                decreamentIds++;

            });

            $('#home1').removeClass('active show');
            $('#home2').removeClass('active show');
            $('#home3').addClass('active show');
            $('#home4').removeClass('active show');
            $('#home5').removeClass('active show');
            $('#thirdNextHomeButtonb').addClass('active');

        } else {


            $('#home1').removeClass('active show');

            $('#home2').addClass('active show');

            $('#home3').removeClass('active show');

            $('#home4').removeClass('active show');

            $('#home5').removeClass('active show');

            $('#thirdNextHomeButtonb').addClass('active');

            swal({
                icon: 'error',
                title: "Alert",
                text: 'Please fill all mandatory fields.',
                type: "error",

                closeOnConfirm: false,
                showLoaderOnConfirm: true,
            });

            return;

        }



    });

    $("#nextButtonHome4").on("click", function(e) {

        if ($("#save_buyer_details").valid()) {
            $('#home1').removeClass('active show');
            $('#home2').removeClass('active show');
            $('#home3').removeClass('active show');
            //$('#home4').addClass('active show');
            $('#home5').addClass('active show');
            $('#nextButtonHome4').addClass('active');
        } else {
            $('#home1').removeClass('active show');
            $('#home2').removeClass('active show');
            $('#home3').addClass('active show');
            //$('#home4').addClass('active show');
            $('#home5').removeClass('active show');
            $('#nextButtonHome4').addClass('active');

            swal({
                icon: 'error',
                title: "Alert",
                text: 'Please fill all mandatory fields.',
                type: "error",

                closeOnConfirm: false,
                showLoaderOnConfirm: true,
            });

            return;

        }


    });

    $("#nextButtonHome5").on("click", function(e) {

        if ($("#save_buyer_details").valid()) {

            $('#home1').removeClass('active show');
            $('#home2').removeClass('active show');
            $('#home3').removeClass('active show');
            $('#home4').removeClass('active show');
            $('#home5').addClass('active show');
            $('#nextButtonHome5').addClass('active');

        } else {

            $('#home1').removeClass('active show');
            $('#home2').removeClass('active show');
            $('#home3').removeClass('active show');
            $('#home4').addClass('active show');
            $('#home5').removeClass('active show');
            $('#nextButtonHome5').addClass('active');

            swal({
                icon: 'error',
                title: "Alert",
                text: 'Please fill all mandatory fields.',
                type: "error",

                closeOnConfirm: false,
                showLoaderOnConfirm: true,
            });

            return;
        }

    });

    //Movement with Previos button

    $("#fifthPreviousButton").on("click", function(e) {

        $('#home1').removeClass('active show');
        $('#home2').removeClass('active show');
        $('#home3').addClass('active show');
        //$('#home4').addClass('active show');
        $('#home5').removeClass('active show');

    });

    $("#forthPreviosButton").on("click", function(e) {

        $('#home1').removeClass('active show');
        $('#home2').removeClass('active show');
        $('#home3').addClass('active show');
        $('#home4').removeClass('active show');
        $('#home5').removeClass('active show');

    });

    $("#thirdPreviosButton").on("click", function(e) {

        $('#home1').removeClass('active show');
        $('#home2').addClass('active show');
        $('#home3').removeClass('active show');
        $('#home4').removeClass('active show');
        $('#home5').removeClass('active show');

    });

    $("#secondPreviosButton").on("click", function(e) {

        $('#home1').addClass('active show');
        $('#home2').removeClass('active show');
        $('#home3').removeClass('active show');
        $('#home4').removeClass('active show');
        $('#home5').removeClass('active show');
        $('#secondHomeButton').addClass('active');

    });



    //Adding Package Details Validations

    //newPackageAddFormButton


    $("#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;
        }

    });


    $("#save_buyer_details").on('submit', function(e) {
        console.log('hi');
        e.preventDefault();

        var form = $(this);

        console.log('++++++++++formData+++++++++++', form);


        var validator = $("#save_buyer_details").validate();
        console.log(validator);

        if (validator.numberOfInvalids() != 0) {
            return;
        }

        else {

            $.ajax({
                method: 'POST',
                url: "{{url('orders-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,
                            },
                            function() {

                            });
                    }


                    if (data.success == true) {

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

                                closeOnConfirm: false,
                                showLoaderOnConfirm: true,
                            },
                            function() {
                                window.location.href = '{{url("/orders/all")}}'
                            });

                    }

                },
                error: function(data) {

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

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

                        console.log('errors', index, value);

                        if (value.oldPassword) {

                            $("#oldPassword").show();
                            $("#oldPassword").html(value.oldPassword.toString());

                        } else {

                            $("#oldPassword").hide();

                        }

                        if (value.newPassword) {

                            $("#newPassword").show();
                            $("#newPassword").html(value.newPassword.toString());

                        } else {

                            $("#newPassword").hide();

                        }

                        if (value.order_id) {

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

                        }

                    });

                }
            });

        }
    });

    //State and City Dependent dropdown

    jQuery('select[name="state_id"]').on('change', function() {
        $('#custum-loader').removeClass('hidden');
        var state_id = jQuery(this).val();
        if (state_id) {
            jQuery.ajax({
                url: "{{route('cities-list')}}",
                type: "POST",
                data: { _token: "{{csrf_token()}}", state_id: state_id },
                //dataType : "json",
                success: function(data) {
                    jQuery('select[name="city_id"]').empty();
                    localStorage.setItem("city_id", JSON.stringify(data));
                    $('select[name="city_id"]').append('<option value="' + '' + '">' + 'Select City' + '</option>');
                    jQuery.each(data.cities, function(key, value) {

                        $('select[name="city_id"]').append('<option value="' + value.id + '">' + value.name + '</option>');
                    });

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

    //User Address State and city dependent dropdown

    jQuery('select[name="userAddressState"]').on('change', function() {

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

        var state_id = jQuery(this).val();

        if (state_id) {
            jQuery.ajax({
                url: "{{route('cities-list')}}",
                type: "POST",
                data: { _token: "{{csrf_token()}}", state_id: state_id },
                //dataType : "json",
                success: function(data) {
                    jQuery('select[name="userAddressCity"]').empty();

                    $('select[name="userAddressCity"]').append('<option value="' + '' + '">' + 'Select City' + '</option>');
                    jQuery.each(data.cities, function(key, value) {

                        $('select[name="userAddressCity"]').append('<option value="' + value.id + '">' + value.name + '</option>');
                    });

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


        }
    });


    //User Address State and city dependent dropdown for another state

    jQuery('select[name="anotherState"]').on('change', function() {

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

        var state_id = jQuery(this).val();

        if (state_id) {
            jQuery.ajax({
                url: "{{route('cities-list')}}",
                type: "POST",
                data: { _token: "{{csrf_token()}}", state_id: state_id },
                //dataType : "json",
                success: function(data) {
                    jQuery('select[name="anotherCity"]').empty();

                    $('select[name="anotherCity"]').append('<option value="' + '' + '">' + 'Select City' + '</option>');
                    jQuery.each(data.cities, function(key, value) {

                        $('select[name="anotherCity"]').append('<option value="' + value.id + '">' + value.name + '</option>');
                    });

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


        }
    });


    //

    //User Model Form Address
    //addAddressModalButton

    $('#adduserAddressButton').on('click', function(e) {

        $('#addressmodal12').modal('show');

    });

    $('#cancelAddAdressButton').on('click', function(e) {
        
        $('#addressmodal12').modal('hide');
        $("#addressmodal12").trigger( "reset" );

    });

    $('#cancelPackageAddFormButton').on('click', function(e) {

        e.preventDefault();
        $('#packagemodal').modal('hide');

    });

    $('#adduserAddressButton').on('click', function(e) {

        e.preventDefault();

        let userAnotherAddressFormArray = [];

        //Getting value from html for address modal data

        $('#addressNickName-error').hide();
        $('#alternateEmailAddress-error').hide();
        $('#phoneNumber-error').hide();
        $('#contactName-error').hide();
        $('#userAddressaddressLine1-error').hide();
        $('#userAddressPincode-error').hide();
        //Supplier checkbox value
        $('#supplier_vendor_input_name-error').hide();
        $('#supplier_vendor_gstin_number1-error').hide();

        //rto button fields value.

        $('#anotherNickNameAddress-error').hide();
        $('#anotherContactName-error').hide();
        $('#anotherPhoneNumber-error').hide();
        $('#anotherEmail-error').hide();
        $('#anotherAddressLine1-error').hide();
        $('#anotherPincode-error').hide();
        $('#anotherState-error').hide();
        $('#anotherCity-error').hide();

        //variables for address modal data

        let addressNickName = $('#addressNickName').val();
        let alternateEmailAddress = $('#alternateEmailAddress').val();
        let contactName = $('#contactName').val();
        let phoneNumber = $('#phoneNumber').val();
        let alternatePhoneNumberAddress = $('#alternatePhoneNumberAddress').val();
        let userAddressaddressLine1 = $('#userAddressaddressLine1').val();
        let userAddressaddressLine2 = $('#userAddressaddressLine2').val();
        let userAddressCity = $('#userAddressCity').val();
        let userAddressPincode = $('#userAddressPincode').val();
        let userAddressState = $('#userAddressState').val();
        let userAddressSectedDataForRtoSearch = $("input[name='userAddressSectedDataForRtoSearch']").val();

        //Variables for another Address Data

        let anotherNickNameAddress = $('#anotherNickNameAddress').val();
        let anotherContactName = $('#anotherContactName').val();
        let anotherPhoneNumber = $('#anotherPhoneNumber').val();
        let anotherEmail = $('#anotherEmail').val();
        let anotherAddressLine1 = $('#anotherAddressLine1').val();
        let anotherAddressLine2 = $('#anotherAddressLine2').val();
        let anotherPincode = $('#anotherPincode').val();
        let anotherState = $('#anotherState').val();
        let anotherCity = $('#anotherCity').val();


        //Supplier checkbox variables

        let isSupplierGstinNumberChecked = $('#supplieraddress')[0].checked;
        let supplier_vendor_input_name = '';
        let supplier_vendor_gstin_number1 = '';

        //alert(supplier_vendor_gstin_number1);

        if (isSupplierGstinNumberChecked) {

            supplier_vendor_input_name = $('#supplier_vendor_input_name').val();
            supplier_vendor_gstin_number1 = $('#supplier_vendor_gstin_number1').val();

            if ((supplier_vendor_input_name == '' || supplier_vendor_gstin_number == 'undefined') && (supplier_vendor_gstin_number1 == '' || supplier_vendor_gstin_number1 == 'undefined')) {

                $('#supplier_vendor_input_name-error').show();
                $('#supplier_vendor_input_name-error').html('Supplier and vendor name is required.');

                $('#supplier_vendor_gstin_number1-error').show();
                $('#supplier_vendor_gstin_number1-error').html('Supplier and vendor gstin number is required.');

                return;

            } else if (supplier_vendor_input_name == '' || supplier_vendor_gstin_number == 'undefined') {

                $('#supplier_vendor_input_name-error').show();
                $('#supplier_vendor_input_name-error').html('Supplier and vendor name is required.');
                return;

            } else if (supplier_vendor_gstin_number1 == '' || supplier_vendor_gstin_number1 == 'undefined') {

                $('#supplier_vendor_gstin_number1-error').show();
                $('#supplier_vendor_gstin_number1-error').html('Supplier and vendor gstin number is required.');
                return;

            }

        } else {

            supplier_vendor_input_name = '';
            supplier_vendor_gstin_number1 = '';

        }

        let addANewRtoButton = $('#rtoaddressDataId').is(":visible");

        //alert(addANewRtoButton);

        //Validations for another address

        if (addANewRtoButton) {

            if ((anotherNickNameAddress == '' || anotherNickNameAddress == 'undefined') && (anotherContactName == '' || anotherContactName == 'undefined') && (anotherPhoneNumber == '' || anotherPhoneNumber == 'undefined') && (anotherEmail == '' || anotherEmail == 'undefined') && (anotherAddressLine1 == '' || anotherAddressLine1 == 'undefined') && (anotherPincode == '' || anotherPincode == 'undefined') && (anotherState == '' || anotherState == 'undefined') && (anotherCity == '' || anotherCity == 'undefined')) {

                $('#anotherNickNameAddress-error').show();
                $('#anotherNickNameAddress-error').html('Nick name is required.');

                $('#anotherContactName-error').show();
                $('#anotherContactName-error').html('Contact name is required.');

                $('#anotherPhoneNumber-error').show();
                $('#anotherPhoneNumber-error').html('Phone number is required.');

                $('#anotherEmail-error').show();
                $('#anotherEmail-error').html('Email is required.');

                $('#anotherAddressLine1-error').show();
                $('#anotherAddressLine1-error').html('Address line is required.');

                $('#anotherPincode-error').show();
                $('#anotherPincode-error').html('Pincode is required.');

                $('#anotherState-error').show();
                $('#anotherState-error').html('State is required.');

                $('#anotherCity-error').show();
                $('#anotherCity-error').html('City is required.');

                return;

            }


        } else {

            userAnotherAddressFormArray = [];

        }


        if ((addressNickName == '' || addressNickName == 'undefined') && (contactName == '' || contactName == 'undefined') && (phoneNumber == '' || phoneNumber == 'undefined') && (userAddressaddressLine1 == '' || userAddressaddressLine1 == 'undefined') && (userAddressPincode == '' || userAddressPincode) || (alternateEmailAddress == '' || alternateEmailAddress == 'undefined')) {

            $('#addressNickName-error').show();
            $('#addressNickName-error').html('Address nick name is required.');

            $('#contactName-error').show();
            $('#contactName-error').html('Contact name is required.');

            $('#phoneNumber-error').show();
            $('#phoneNumber-error').html('Phone number is required.');

            $('#alternateEmailAddress-error').show();
            $('#alternateEmailAddress-error').html('Email is required.');

            $('#userAddressaddressLine1-error').show();
            $('#userAddressaddressLine1-error').html('Address line 1 is required.');

            $('#userAddressPincode-error').show();
            $('#userAddressPincode-error').html('pincode is required.');

            $('#userAddressCity-error').show();
            $('#userAddressCity-error').html('City is required.');

            return;

        }

        if (addressNickName == '' || addressNickName == 'undefined') {
            $('#addressNickName-error').show();
            $('#addressNickName-error').html('Address nick name is required.');
            return;
        }

        if (contactName == '' || contactName == 'undefined') {
            $('#contactName-error').show();
            $('#contactName-error').html('Contact name is required.');
            return;
        }

        if (phoneNumber == '' || phoneNumber == 'undefined') {
            $('#phoneNumber-error').show();
            $('#phoneNumber-error').html('Phone number is required.');
            return;
        }

        if (userAddressaddressLine1 == '' || userAddressaddressLine1 == 'undefined') {
            $('#userAddressaddressLine1-error').show();
            $('#userAddressaddressLine1-error').html('Address line 1 is required.');
            return;
        }

        if (userAddressPincode == '' || userAddressPincode == 'undefined') {
            $('#userAddressPincode-error').show();
            $('#userAddressPincode-error').html('pincode is required.');
            return;
        }

        if (userAddressState == '' || userAddressState == 'undefined') {
            $('#userAddressState-error').show();
            $('#userAddressState-error').html('State is required.');
            return;
        }

        if (userAddressCity == '' || userAddressCity == 'undefined') {
            $('#userAddressCity-error').show();
            $('#userAddressCity-error').html('City is required.');
            return;
        }



        let userAddressFormArray = [];

        userAddressFormArray.push({
            'addressNickName': addressNickName,
            'contactName': contactName,
            'phoneNumber': phoneNumber,
            'alternatePhoneNumberAddress': alternatePhoneNumberAddress,
            'userAddressaddressLine1': userAddressaddressLine1,
            'userAddressaddressLine2': userAddressaddressLine2,
            'userAddressCity': userAddressCity,
            'userAddressPincode': userAddressPincode,
            'userAddressState': userAddressState,
            'userAddressEmail': userAddressState,
            'userAddressCountry': 1,
            'supplier_vendor_input_name': supplier_vendor_input_name,
            'supplier_vendor_gstin_number1': supplier_vendor_gstin_number1,
            'alternateEmailAddress': alternateEmailAddress,
            'addANewRtoButton': addANewRtoButton,
            'isSupplierGstinNumberChecked': isSupplierGstinNumberChecked,
            'userAddressSectedDataForRtoSearch': userAddressSectedDataForRtoSearch
        });

        userAnotherAddressFormArray.push({
            'addressNickName': anotherNickNameAddress,
            'contactName': anotherContactName,
            'phoneNumber': anotherPhoneNumber,
            'anotherEmail': anotherEmail,
            'userAddressaddressLine1': anotherAddressLine1,
            'userAddressaddressLine2': anotherAddressLine2,
            'userAddressCity': anotherCity,
            'userAddressPincode': anotherPincode,
            'userAddressState': anotherState,
            'userAddressCountry': 1,
        });




        if (userAddressFormArray.length > 0) {

            let requestData = { _token: "{{csrf_token()}}", userAddressFormArray: userAddressFormArray, userAnotherAddressFormArray: userAnotherAddressFormArray };

            jQuery.ajax({
                url: "{{route('add-user-pickup-address')}}",
                type: "POST",
                data: requestData,
                success: function(data) {
                    $('#addressmodal12').modal('hide');

                    var wrapper2 = $(".add-user-address-html");

                    let htmlId = (data.data.id + 1);
                    let address =  data.data.address ?  data.data.address : 'N/A';
                    let addressNickName =  data.data['address_nick_name'] ?  data.data['address_nick_name'] : 'N/A';
                    let pincode =  data.data.pincode ?  data.data.pincode : 'N/A';
                    let mobileNumber =  data.data['phoneNumber'] ?  data.data['phoneNumber'] : 'N/A';

                    let html123 = '<div class="col-md-4"><div class="address-radio"><input class="with-gap fill-gap" name="userAddressSectedData" type="radio" id="number' + htmlId + '" value="' + data.data.id + '" ' + (data.data.id ? "checked" : "checked") + '><label for="number' + htmlId + '" class="w-100" ><div class="card address-card"><div class="card-header address-card-header">' + addressNickName + '</div><div class="card-body address-card-body"><p>' + addressNickName + '</p><p>' + address  + '</p><p>Post box -' + pincode + '</p><h6>Phone: <strong> '+ mobileNumber +'</strong></h6></div></div></label></div></div>';

                    $(wrapper2).append(html123);

                }

            });

        }

    });

    //ajax calling for user address

    jQuery.ajax({
        url: "{{route('user-dynamic-address-list')}}",
        type: "POST",
        data: { _token: "{{csrf_token()}}", userAddressFormArray: '' },
        success: function(data) {

            $(".add-user-address-html").empty();

            var wrapper1 = $(".add-user-address-html");
            jQuery.each(data.userAddress, function(key, value) {

                let htmlId = (value.id + 1);
                let userAddress = value['address'] ? value['address'] : 'N/A';
                let tempAddress = value['temp_address'] ? value['temp_address'] : 'N/A';
                let userPincodes = value['pincode'] ? value['pincode'] : 'N/A';
                let phoneNumber = value['phoneNumber'] ? value['phoneNumber'] : 'N/A';
                let addressNickName = value['address_nick_name'] ? value['address_nick_name'] : 'N/A';


                let html12 = '<div class="col-md-4"><div class="address-radio"><input class="with-gap fill-gap" name="userAddressSectedData" type="radio" id="number' + htmlId + '" value="' + value.id + '" ' + (data.defaultAddress.id ? "checked" : "") + '><label for="number' + htmlId + '" class="w-100" ><div class="card address-card"><div class="card-header address-card-header">' + addressNickName + '</div><div class="card-body address-card-body"><p>' +userAddress + '</p><p>' + tempAddress + '</p><p>Post box -' + userPincodes + '</p><h6>Phone: <strong> ' + phoneNumber + '</strong></h6></div></div></label></div></div>';

                $(wrapper1).append(html12);

            });


        }
    });

    //supplierAddressCheckBox

    $('#supplieraddress').on('click', function(e) {

        if (this.checked) {

            $('#supplier_vendor_name').show();
            $('#supplier_vendor_gstin_number').show();

        } else {

            $('#supplier_vendor_name').hide();
            $('#supplier_vendor_gstin_number').hide();

        }

    });

    $('#rtoaddress').on('click', function(e) {

        if (this.checked) {

            $('#differentAddressRto').show();
            $('#differentAddressRto').show();

        } else {

            $('#differentAddressRto').hide();
            $('#differentAddressRto').hide();

        }

    });

    //RtoAddressButton

    $('#rtoaddressButton').on('click', function(e) {

        $("#rtoaddressDataId").toggle();

    });

    //Searching address When both address are different.

    $("#pickupAddressSearch").keypress(function() {

        let selectPickupAddress = $('#pickupAddressSearch').val();

        jQuery.ajax({
            url: "{{route('address-search-box')}}",
            type: "POST",
            data: { _token: "{{csrf_token()}}", selectPickupAddress: selectPickupAddress },
            success: function(data) {


                /*if (data.data.length > 0) {*/

                console.log('data', data.data);

                var wrapper2 = $(".add-user-address-html-model-search");
                $(".add-user-address-html-model-search").empty();

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

                    console.log('++++DataValue++++', value);

                    let htmlId = ('0' + value.id);
                    let html14 = '<div class="col-md-4"><div class="address-radio"><input class="with-gap fill-gap" name="userAddressSectedDataForRtoSearch" type="radio" id="number' + htmlId + '" value="' + value.id + '"><label for="number' + htmlId + '" class="w-100" ><div class="card address-card"><div class="card-header address-card-header">' + value['address'] + '</div><div class="card-body address-card-body"><p>' + value['contact_name'] + '</p><p>' + value['temp_address'] + '</p><p>Post box -' + value['pincode'] + '</p><p>' + value.city + '</p><p>Landmark: near old chowk.</p><h6>Phone: <strong> ' + value['phoneNumber'] + '</strong></h6></div></div></label></div></div>';
                    $(wrapper2).append(html14);

                });

                //}
            }
        });


    });

    //Pincode country dependent dropdown

    $("#pincode").keyup(function() {

        let pincode = $('#pincode').val();

        if (pincode.length == 6) {
            $('#custum-loader').removeClass('hidden');
            jQuery.ajax({
                url: "{{route('pincode-country-state')}}",
                type: "POST",
                data: { _token: "{{csrf_token()}}", pincode: pincode },
                success: function(data) {
                    // console.log(data); return false;
                    $('#custum-loader').addClass('hidden');
                    if (!data.data) {
                                jQuery('select[name="state_id"]').empty();
                                jQuery('select[name="country_id"]').empty();
                                jQuery('select[name="city_id"]').empty();

                                $('#state_id').removeClass('dissbleClickButton');
                                $('#city_id').removeClass('dissbleClickButton');
                                $('#country_id').removeClass('dissbleClickButton');


                                $('select[name="country_id"]').append('<option value="">' + 'Select Country' + '</option>');
                                $('select[name="country_id"]').append('<option value="' + 101 + '">' + 'India' + '</option>');

                                $('select[name="state_id"]').append('<option value="">' + 'Select State' + '</option>');

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

                                    $('select[name="state_id"]').append('<option value="' + value.id + '">' + value.name + '</option>');
                                });

                                swal({
                                    icon: 'error',
                                    title: "Alert",
                                    text: 'Pincode is not serviceable.',
                                    type: "error",

                                    closeOnConfirm: false,
                                    showLoaderOnConfirm: true,
                                });
                                return;
                            } else {
                                $('#state_id').addClass('dissbleClickButton');
                                $('#city_id').addClass('dissbleClickButton');
                                $('#country_id').addClass('dissbleClickButton');

                                jQuery('select[name="state_id"]').empty();
                                jQuery('select[name="city_id"]').empty();
                                jQuery('select[name="country_id"]').empty();

                                $('select[name="country_id"]').append('<option value="' + 101 + '">' + 'India' + '</option>');

                                if (data.data.state) {
                                    $('select[name="state_id"]').append('<option value="' + data.data.state.id + '">' + data.data.state.name + '</option>');
                                }

                                if (data.data.district) {
                                    $('select[name="city_id"]').append('<option value="' + data.data.district.id + '">' + data.data.district.name + '</option>');
                                }

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

                }
            });
        }
        $("#country_id").val('');
        $("#state_id").val('');
        $("#city_id").val('');
        $('#state_id').removeClass('dissbleClickButton');
        $('#city_id').removeClass('dissbleClickButton');
        $('#country_id').removeClass('dissbleClickButton');


        let listData = null;
        jQuery('select[name="state_id"]').empty();
        jQuery('select[name="country_id"]').empty();

        $('select[name="country_id"]').append('<option value="">Select</option>');
        $('select[name="state_id"]').append('<option value="">Select</option>');
        $('select[name="city_id"]').append('<option value="">Select</option>');


        $('select[name="country_id"]').append('<option value="' + 101 + '">' + 'India' + '</option>');

        listData.state.forEach(state => {

            $('select[name="state_id"]').append('<option value="' + state.id + '">' + state.name + '</option>');
        });

    });

    //Pincode dependenet dropdown for model

    $("#userAddressPincode").keyup(function() {

        let pincode = $('#userAddressPincode').val();

        if (pincode.length == 6) {
            $('#custum-loader').removeClass('hidden');
            jQuery.ajax({
                url: "{{route('pincode-country-state')}}",
                type: "POST",
                data: { _token: "{{csrf_token()}}", pincode: pincode },
                success: function(data) {
                    $('#custum-loader').addClass('hidden');
                    if (!data.data) {
                        jQuery('select[name="userAddressState"]').empty();
                        jQuery('select[name="userAddressCountry"]').empty();
                        jQuery('select[name="userAddressCity"]').empty();

                        $('#userAddressState').removeClass('dissbleClickButton');
                        $('#userAddressCity').addClass('dissbleClickButton');
                        $('#userAddressCountry').removeClass('dissbleClickButton');


                        $('select[name="userAddressCountry"]').append('<option value="">' + 'Select Country' + '</option>');
                        $('select[name="userAddressCountry"]').append('<option value="' + 101 + '">' + 'India' + '</option>');

                        $('select[name="userAddressState"]').append('<option value="">' + 'Select State' + '</option>');

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

                            $('select[name="userAddressState"]').append('<option value="' + value.id + '">' + value.name + '</option>');
                        });

                        swal({
                            icon: 'error',
                            title: "Alert",
                            text: 'Pincode is not serviceable.',
                            type: "error",

                            closeOnConfirm: false,
                            showLoaderOnConfirm: true,
                        });
                        return;
                    }

                    $('#userAddressState').addClass('dissbleClickButton');
                    $('#userAddressCity').addClass('dissbleClickButton');
                    $('#userAddressCountry').addClass('dissbleClickButton');

                    jQuery('select[name="userAddressState"]').empty();
                    jQuery('select[name="userAddressCity"]').empty();
                    jQuery('select[name="userAddressCountry"]').empty();

                    $('select[name="userAddressCountry"]').append('<option value="' + 101 + '">' + 'India' + '</option>');

                    if (data.data.state) {
                        $('select[name="userAddressState"]').append('<option value="' + data.data.state.id + '">' + data.data.state.name + '</option>');
                    }

                    if (data.data.district) {
                        $('select[name="userAddressCity"]').append('<option value="' + data.data.district.id + '">' + data.data.district.name + '</option>');
                    }

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

    //Allow only numeric fields

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

    $(".alphabetsonly").keypress(function(e) {
        var key = e.keyCode;
        if (key >= 48 && key <= 57) {
            e.preventDefault();
        }
    });

    $("#addressNickName").on("keypress", function(event) {
        $('#addressNickName-error').hide();
    });

    $("#alternateEmailAddress").on("keypress", function(event) {
        $('#alternateEmailAddress-error').hide();
    });

})

var skusArray = [];
var skuQuantity = [];
var quantity = [];

function productName(e, x) {
    //alert('aya');
    //skusArray = [];
    var skuQuantity = [];
    let uniqueId = x;
    let a = x;
    let id = e.getAttribute('list');

    jQuery.ajax({
        url: "{{route('fetch-product-details')}}",
        type: "POST",
        data: { _token: "{{csrf_token()}}", prductName: e.value, sku: '' },
        success: function(data) {
            let productNameList = 'productNameList' + uniqueId + '';
            let skuList = 'skuList' + x + '';
            let productCategory = 'product_category' + uniqueId + '';
            let productWeight = 'productWeight' + x + '';
            let productLength = 'productLength' + uniqueId + '';
            let productHeight = 'productHeight' + uniqueId + '';
            let productWidth = 'productWidth' + uniqueId + '';
            let unitPrice = 'unit_price' + uniqueId + '';
            let hsnList = 'productHsnList' + uniqueId + '';
            let taxRate = 'tax_rate' + uniqueId + '';

            //alert('aya');

            /*$('.product_quantity').each(function(){
                if ($(this).val()) {
                    skuQuantity.push(parseFloat($(this).val()));
                }else{
                    skuQuantity.push(0);
                }
            });*/

            let appendskuData = {
                'id': data.data.id,
                'name': data.data.name,
                'weight': data.data.weight,
                'length': data.data.length,
                'width': data.data.width,
                'height': data.data.height,
                'code': data.data.code,
                'quantity': skuQuantity[x],
                'packages': data.packages
            };

            skusArray[x] = appendskuData;

            $('#' + productNameList).val(data.data.name);
            $('#' + productCategory).val(data.data.name);
            $('#' + productWeight).val(data.data.weight);
            $('#' + productLength).val(data.data.length);
            $('#' + productWidth).val(data.data.width);
            $('#' + productHeight).val(data.data.height);
            $('#' + unitPrice).val(data.data.price);
            $('#' + hsnList).val(data.hsn.code);
            $('#' + taxRate).val(data.hsn.tax_rate);
        }
    });

    /*addMultiplePackagesTables


    //console.log('+++++data+++++',skusArray);*/
    //console.log('+++++quantity+++++',quantity);
    $('#addMultiplePackagesTables').empty();
    let decreamentIds = 0;
    $.each(skusArray, function(key, value) {

        /*let decreamentIds = (parseInt(value.id) - 1);*/
        let appendedSkusHtml = "<tr><td>" + value.name + "</td><td>" + value.code + "</td><td id='skusQuantity" + decreamentIds + "'>" + value.quantity + "</td><td><select name='skuPackages[]' id='skuPackages" + decreamentIds + "'  onblur='skusPackageSelection(this," + decreamentIds + ")'><option value=''>Select</option></select></td><td><input id='skusWeight" + decreamentIds + "' name='skuProductWeight[]'value='" + value.weight + "' readonly/></td><td><input id='skuslength" + decreamentIds + "' name='skuProductLength[]'value='" + value.length + "' readonly/></td><td><input id='skuswidth" + decreamentIds + "' name='skuProductWidth[]'value='" + value.width + "' readonly/></td><td><input  id='skusheight" + decreamentIds + "'' name='skuProductHeight[]'value='" + value.height + "' readonly/></td></tr>";

        $('#addMultiplePackagesTables').append(appendedSkusHtml);

        $.each(value.packages, function(key1, value1) {
            let packageDetailsId = "skuPackages" + decreamentIds + "";
            $('#' + packageDetailsId).append('<option value=' + value1.id + '>' + value1.name + '</option>');
        });

        decreamentIds++;

    });
}

function priceCalculation(event, id) {

    // alert(id);
    // alert(event.value);

    let discountIds = id;
    let discountName = event.getAttribute('name');

    /*if (discountName == 'quantity[]') {
        let quantityIds123 = "skusQuantity"+discountIds+"";
        //alert(quantityIds123);
        $('#'+quantityIds123).text(event.value);
    }*/

    let total = 0;
    let subTotal = 0;
    var quantity = [];
    let price = [];
    let discount = 0;
    let quantityProductDiscount = 0;
    let basicPriceQuantity = 0;

    quantity = [];
    price = [];
    discount = [];
    discountType = [];
    let y = 0;
    $('.product_quantity').each(function() {
        console.log('Value123', $(this).val(), 'y+++', y);
        if ($(this).val()) {
            quantity.push(parseFloat($(this).val()));
            let quantityIds123 = "skusQuantity" + y + "";
            $('#' + quantityIds123).text($(this).val());
            y++;
        } else {
            quantity.push(0);
            y++;
        }
    });

    $('.product_unit_price').each(function() {
        if ($(this).val()) {
            price.push(parseFloat($(this).val()));
        } else {
            price.push(0);
        }

    });

    $('.product_discount').each(function() {
        if ($(this).val()) {
            discount.push(parseFloat($(this).val()));
        } else {
            discount.push(0);
        }
    });

    $('.discount_type').each(function() {
        if ($(this).val()) {
            discountType.push(parseFloat($(this).val()));
        } else {
            discountType.push('rs');
        }
    });

    i = 0;
    total = 0;
    quantity.forEach(function() {

        if (discountType[i] == 'percentage') {
            total += (quantity[i] * price[i] - (quantity[i] * price[i] * discount[i]) / 100);
        } else {
            total += (quantity[i] * price[i] - quantity[i] * discount[i]);
        }
        i++;

    });

    return $('#subtotalCalCulation').text(total);

}

function skusPackageSelection(eventValue, eventId) {

    let packageValue = eventValue.value;
    let packageId = eventId;

    if (eventValue.value) {
        jQuery.ajax({
            url: "{{route('get-packages-detail')}}",
            type: "POST",
            data: { _token: "{{csrf_token()}}", id: eventValue.value },
            success: function(data) {
                //let skuWeight= "skusWeight"+packageId+"";
                let skuLength = "skuslength" + packageId + "";
                let skuWidth = "skuswidth" + packageId + "";
                let skuHeight = "skusheight" + packageId + "";

                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);


            }
        });
    }
}

/*let m = 0;

function selectPackages(selectBoxValue){

    let skuQuantity = [];

    $('.product_quantity').each(function(){
        skuQuantity.push($(this).val());
    });
    let addDimensionsOfBoxId = 'addDimensionsOfBox'+m+'';

    let skuBoxPackageId = selectBoxValue.getAttribute('id');

    var newArray = evenNumbers.filter((value, index, self) => self.indexOf(value) === index);

    console.log('skuDatas',skusArray,skuQuantity);

    if (selectBoxValue.value) {
        jQuery.ajax({
            url : "{{route('get-packages-detail')}}",
            type : "POST",
            data: {  _token: "{{csrf_token()}}",id:selectBoxValue.value },
            success:function(data)
            {
                console.log('ids',addDimensionsOfBoxId,'datasss',data.data);
                let lbh = data.data.length + 'x' + data.data.width + 'x' + data.data.height;

                $('#'+addDimensionsOfBoxId).text(lbh);

            }
        });
    }

     m++;
}*/

</script>
@endsection