@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)" maxlength="10" pattern="\d{10}">
                                                </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" maxlength="10" pattern="\d{10}" 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>
                                                    <span class="text-danger">*</span></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" onkeydown="return false">
                                        </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>
                                    @php
                                        $slotArr = [];
                                        $date= date('H');
                                        foreach (timeSlots() as $key => $value){
                                            $slot= explode('-',$value['slot']);
                                            if((date('Y-m-d'))&&($slot[0] > $date)){
                                                $slotArr[$value['id']] = $value['slot'];
                                            }
                                        }
                                    @endphp
                                    <div class="col-md-4">
                                        <div class="form-group custom-form-group">
                                            <label class="form-label" for="expected_time">Preferred Pickup Time<span
                                                    class="text-danger">*</span> </label>
                                                <select class="form-control" name="expected_time" id="expected_time">
                                                    <option value="">Select Time Slot</option>
                                                    @foreach ($slotArr as $timeSlotKey => $timeSlotValue)
                                                        <option value="{{ $timeSlotKey }}">
                                                            {{ $timeSlotValue }}</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=""
                                                            oninput="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=""
                                                            oninput="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="" oninput="priceCalculation(this,0)">
                                                            <div class="input-group-append">
                                                                <span class="input-group-text new-input-txt">
                                                                    <select class="form-control discount_type"
                                                                        oninput="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">Unit Weight (kg)<span
                                                                class="text-danger">*</span></label>
                                                        <input id="productWeight0" name="productWeight[]"
                                                            class="form-control product_weight AllowNumericDecimal" patternR="^\d*(\.\d{0,2})?$" placeholder="Enter 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">Unit Length (cm)<span
                                                                class="text-danger">*</span></label>
                                                        <input id="productLength0" name="productLength[]"
                                                            class="form-control product_length AllowNumeric" 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">Unit Width (cm)<span
                                                                class="text-danger">*</span></label>
                                                        <input id="productWidth0" name="productWidth[]"
                                                            class="form-control product_width AllowNumeric" 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">Unit Height (cm)<span
                                                                class="text-danger">*</span></label>
                                                        <input id="productHeight0" name="productHeight[]"
                                                            class="form-control product_height AllowNumeric" 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_shipping"
                                                type="checkbox" id="other_charges_shipping_id">
                                            <label for="other_charges_shipping_id" class="order-label">Shipping</label>

                                            <input name="shipping_charge" class="form-control mt-3 AllowNumeric"
                                                placeholder="" type="text" value="" aria-invalid="false"
                                                style="display: none;" id="shipping_charge_value_id"
                                                onblur="priceCalculation(this,1)">
                                        </div>
                                    </div>
                                    <div class="col-md-2 col-6">
                                        <div class="form-group custom-form-group">
                                            <input class="filled-in filled-check" name="gift_wrap_checkbox"
                                                type="checkbox" id="gift_wrap_id">
                                            <label for="gift_wrap_id" class="order-label">Gift Wrap</label>

                                            <input name="gift_wrap_charge" class="form-control mt-3 AllowNumeric"
                                                placeholder="" type="text" value="" aria-invalid="false"
                                                style="display: none;" id="gift_wrap_id_value"
                                                onblur="priceCalculation(this,1)">
                                        </div>
                                    </div>
                                    <div class="col-md-2 col-6">
                                        <div class="form-group custom-form-group">
                                            <input class="filled-in filled-check" name="shipping_transaction"
                                                type="checkbox" id="transaction_check">
                                            <label for="transaction_check" class="order-label">Transaction</label>

                                            <input name="transaction_charge" class="form-control mt-3 AllowNumeric"
                                                placeholder="" type="text" value="" aria-invalid="false"
                                                style="display: none;" id="transaction_charge_id"
                                                onblur="priceCalculation(this,1)">
                                        </div>
                                    </div>
                                    <div class="col-md-2 col-6">
                                        <div class="form-group custom-form-group">
                                            <input class="filled-in filled-check" name="shipping_discount"
                                                type="checkbox" id="discount_check_id">
                                            <label for="discount_check_id" class="order-label">Discounts</label>

                                            <input name="discount_charge" class="form-control mt-3 AllowNumeric"
                                                placeholder="" type="text" value="" aria-invalid="false"
                                                style="display: none;" id="shipping_discount_id"
                                                onblur="priceCalculation(this,1)">
                                        </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>


                                <!-- address modals ================================  -->

                                <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 id="alert-add-msg" class="alert alert-danger" role="alert" style="margin-top: 20px; display:none">
                                        Please add pickup address!
                                    </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">Seller Name <img
                                                    src="{{ asset('assets/mages/Info.svg') }}" class="ml-1"
                                                    height="18px" alt=""></label>
                                            <input name="reseller_name" class="form-control alphabetsonly"
                                                placeholder="Seller Name" type="text"
                                                value="{{ old('reseller_name', Auth::user()->first_name . ' ' . Auth::user()->last_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"
                                                                    id="phoneNumber" 
                                                                    placeholder="Enter phone number"
                                                                    maxlength="10" pattern="\d{10}"
                                                                    type="text" value="" id="phoneNumber">
                                                                <!-- <p class="mt-2 font-weight-bold"><a href="#"
                                                                        class="text-dark" id="verifymobile"
                                                                        data-toggle="modal"
                                                                        data-target="#addressmodal12">Verify via OTP</a>
                                                                </p> -->
                                                                <span id="phoneNumber-error"
                                                                    style="display: none; color: red;"> </span>
                                                                <input type="hidden" name="isVerified" id="isVerified"
                                                                    value="no">
                                                            </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"
                                                                    maxlength="10" pattern="\d{10}"
                                                                    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"
                                                                    maxlength="10" pattern="\d{10}"
                                                                    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"
                                                                    maxlength="10" pattern="\d{10}"
                                                                    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>
                                                <input type="hidden" name="userAddressId" value="" id="addressEditValueField">
                                            <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  -->

                <!-- edit modal  -->
                

                </form> <!-- ------- -->
            </div>
    </section>

<style>
    .card-body::after, .card-footer::after, .card-header::after {content: none !important;}
</style>

    <div class="modal fade" id="verifymobilepop" 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>Verify Mobile OTP</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="checkOtpForm" 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">Mobile OTP<span
                                                    class="text-danger">*</span></label>
                                            <input class="form-control" placeholder="Enter 6 digit OTP" type="text"
                                                name="mobileOtp" value="" id="mobileOtp">
                                            <span id="showError"></span>
                                        </div>
                                    </div>

                                </div>
                                <input type="hidden" value="" name="addresId" id="addresId">
                                <input type="hidden" value="111111" name="matchOTP" id="matchOTP">
                                <div class="row mt-4">
                                    <div class="text-center mt-4">
                                        <button class="btn btn-danger" id="cancelOtp">Cancel</button>
                                        <button class="btn btn-danger" id="saveStatusOtp">Save</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

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

        span.verified_mobile {

            display: inline-block;
            transform: rotate(45deg);
            height: 25px;
            width: 12px;
            margin-left: 60%;
            border-bottom: 7px solid #78b13f;
            border-right: 7px solid #78b13f;
        }

        span.notverify_mobile:after {
            content: "\274c";
            font-size: 20px;
            color: #FFF;
            line-height: 50px;
            text-align: center;
        }
    </style>

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

        $(document).ready(function() {
          $('#phoneNumber').on('change', function() {
            
             $('#isVerified').val('no');
            
          });
        });

        $(document).on('keydown', 'input[patternR]', function(e){
            var input = $(this);
            var oldVal = input.val();
            var regex = new RegExp(input.attr('patternR'), 'g');

            setTimeout(function(){
                var newVal = input.val();
                if(!regex.test(newVal)){
                input.val(oldVal); 
                }
            }, 1);
        });

        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) / 4500) : 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) / 4500) : 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) / 4500) : 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) / 4500) : 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
                    },
                    alt_mobile_number: {
                        digits: true,
                        minlength: 10,
                        maxlength: 10
                    },
                    email: {
                        email: true,
                        maxlength: 70
                    },
                    address1: "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,
                        maxlength: 20,
                    },
                    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
                    },
                    'skuPackages[]': {
                        required: true,
                    },
                },
                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: {
                        digits: 'please enter digits only',
                        minLength: 'Invalid mobile number',
                        maxlength: 'Invalid mobile number',
                    },
                    email: {
                        email: 'Please enter a valid email address',
                        maxlength: 'Email must be less then 70 characters'
                    },
                    order_id: {
                        required: 'Please enter order id.',
                        maxlength: 'Order id must be less then 20 characters.',
                    },
                    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%.',
                    },
                    'skuPackages[]': {
                        required: 'Packages is required.',
                    },
                    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,
                        space: false,
                        min: 5,
                        // pattern: "/^\d+(\.\d{1,2})?$/"
                    })

                });

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

                    $(e).rules("add", {
                        required: true,
                        number: true,
                        space: false,
                        min: 5,
                        // pattern: "/^\d+(\.\d{1,2})?$/"
                    })

                });

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

                    $(e).rules("add", {
                        required: true,
                        number: true,
                        space: false,
                        min: 5,
                        // pattern: '/^\d+(\.\d{1,2})?$/'
                    })

                });

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

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

                });

            }

            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="" oninput="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="" oninput="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="" oninput="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[]" oninput="priceCalculation(this,' + x +
                        ')"> <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 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">Unit Weight (kg)</label><input id="productWeight' +x+'" name="productWeight[]" class="form-control product_weight AllowNumericDecimal" 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">Unit Length (cm)</label><input id="productLength' +x+'" name="productLength[]" class="form-control product_length AllowNumeric" 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">Unit Width</label><input id="productWidth'+x+
                        '" name="productWidth[]" class="form-control product_width AllowNumeric" 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">Unit Height (cm)</label><input id="productHeight' +x+'"name="productHeight[]" class="form-control product_height AllowNumeric" 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 + '';

                    $('.product_sku').each(function() {
                        if ($(this).val()) {
                            $('#' + skuList1 + ' option[value="' + $(this).val() + '"]').remove();
                        }
                    });

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

                    $(".AllowNumeric").on("keypress keyup blur", function(event) {
                        $(this).val($(this).val().replace(/[^\d].+/, ""));
                        if ((event.which < 48 || event.which > 57)) {
                            event.preventDefault();
                        }
                    });
                    
                    $('.AllowNumericDecimal').on("keypress keyup blur", function(event) {
                        var inputValue = $(this).val();
                        var sanitizedValue = inputValue.replace(/[^0-9.]/g, ""); // Allow digits and decimal point
                        // Remove multiple decimal points and leading zeros
                        sanitizedValue = sanitizedValue.replace(/(\..*)\./g, '$1');
                        sanitizedValue = sanitizedValue.replace(/^0+(?=\d)/, '');
                        $(this).val(sanitizedValue);
                    });

                    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()) {

                    let totalCalculation =  $('#subtotalCalCulation').text();

                    if (totalCalculation <= 0) {

                        swal({
                            icon: 'warning',
                            title: "Alert",
                            text: 'Please enter a valid discount or Total Price cannot be zero.',
                            type: "error",

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

                    $('.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()) {
                   
                    //$('#home4').addClass('active show');
                    let toPincodes = $("input[name=userAddressSectedData]").val();
                    let paymentMode = $('input[name=payment_mode]:checked', '#save_buyer_details').val();
                    let fromPincode = $('#pincode').val();

                    //let servicibilityCheck = checkServicibility(fromPincode,toPincodes,paymentMode);


            if (fromPincode && toPincodes && paymentMode) {
                jQuery.ajax({
                    url: "{{ route('pincode-servicibility-check') }}",
                    type: "POST",
                    data: {
                        _token: "{{ csrf_token() }}",
                        fromPincode: fromPincode,
                        toPincodeId: toPincodes,
                        serviceType: paymentMode
                    },
                    success: function(data) {
                        
                        if(!data.success){
                            
                            // if(servicibilityCheck){

                                swal({
                                    icon: 'error',
                                    title: "Alert",
                                    text: 'Eolac says no LSP found serviceable on this pincode.',
                                    type: "error",

                                    closeOnConfirm: false,
                                    showLoaderOnConfirm: true,
                                });

                            //}

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

                            return;

                        }

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

                    }
                });
            }

          // return responseStatus;

                } 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

            // $('document').ready(function() {

                $('#verifymobile').on('click', function(e) {
                    var mobile = $('#phoneNumber').val();
                    if (mobile == '' || mobile == 'undefined') {
                        alert('Phone number is required');
                        $('#phoneNumber-error').show();
                        $('#phoneNumber-error').html('Phone number is required.');
                        return;
                    } else {
                        e.preventDefault();
                        $('#verifymobilepop').modal('show');
                        $('#phoneNumber-error').hide();
                    }
                });


            // });

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

                e.preventDefault();
                $('#verifymobilepop').modal('hide');
            });



            $('document').ready(function() {

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

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

                });

            });

            $('document').ready(function() {

                $('#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 userAddressId = $('#addressEditValueField').val();
                let addressNickName = $('#addressNickName').val();
                let alternateEmailAddress = $('#alternateEmailAddress').val();
                let contactName = $('#contactName').val();
                let phoneNumber = $('#phoneNumber').val();
                let verifycheck = $('#isVerified').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 anthoreAlternateNumebr = $('#anthoreAlternateNumebr').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')) {

                        if (anotherNickNameAddress == '' || anotherNickNameAddress == 'undefined') {

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

                        }else {
                            $('#anotherNickNameAddress-error').hide();
                        }

                        if (anotherContactName == '' || anotherContactName == 'undefined') {

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

                        }else {
                            $('#anotherContactName-error').hide();
                        }

                        if (anotherPhoneNumber == '' || anotherPhoneNumber == 'undefined') {

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

                        }else {
                            $('#anotherEmail-error').hide();
                        }

                        if (anotherEmail == '' || anotherEmail == 'undefined') {

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


                        }else {
                            $('#anotherEmail-error').hide();
                        }

                        if (anotherAddressLine1 == '' || anotherAddressLine1 == 'undefined') {

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

                        }else {
                            $('#anotherAddressLine1-error').hide();

                        }
                        // $('#anthoreAlternateNumebr-error').show();
                        // $('#anthoreAlternateNumebr-error').html('Alternate Phone number is required.');

                        if (anotherPincode == '' || anotherPincode == 'undefined') {

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

                        }else {

                            $('#anotherPincode-error').hide();

                        }

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

                        }else {

                            $('#anotherState-error').hide();

                        }

                        if (anotherCity == '' || anotherCity == 'undefined') {

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

                        }else {

                            $('#anotherCity-error').hide();

                        }

                        return;

                    }


                } else {

                    userAnotherAddressFormArray = [];

                }


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

                    if (addressNickName == '' || addressNickName == 'undefined') {

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

                    }else {
                         $('#addressNickName-error').hide();
                    }

                    if (contactName == '' || contactName == 'undefined') {

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

                    }else {

                         $('#contactName-error').hide();

                    }

                    if (phoneNumber == '' || phoneNumber == 'undefined') {

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

                    }else {

                        $('#phoneNumber-error').hide();  

                    }

                    if (userAddressaddressLine1 == '' || userAddressaddressLine1 == 'undefined') {

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

                    }else {

                        $('#userAddressaddressLine1-error').hide();

                    }

                    if (userAddressPincode == '' || userAddressPincode) {

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

                    }else {

                         $('#userAddressPincode-error').hide();

                    }

                    if (alternateEmailAddress == '' || alternateEmailAddress == 'undefined') {

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


                    }else {

                        $('#alternateEmailAddress-error').hide();
                    }

                    return;

                }

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

                    $('#addressNickName-error').hide();

                }

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

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

                    $('#phoneNumber-error').hide();

                }

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

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

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

                    $('#userAddressState-error').hide();

                }

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



                let userAddressFormArray = [];

                userAddressFormArray.push({
                    'userAddressId':userAddressId,
                    'addressNickName': addressNickName,
                    'contactName': contactName,
                    'phoneNumber': phoneNumber,
                    'verifycheck': verifycheck,
                    '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,
                    'verifycheck': verifycheck,
                    'anthoreAlternateNumebr': anthoreAlternateNumebr,
                    'anotherEmail': anotherEmail,
                    'userAddressaddressLine1': anotherAddressLine1,
                    'userAddressaddressLine2': anotherAddressLine2,
                    'userAddressCity': anotherCity,
                    'userAddressPincode': anotherPincode,
                    'userAddressState': anotherState,
                    'userAddressCountry': 1,
                });

                console.log(userAddressFormArray);

                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');
                            $('#nextButtonHome4').prop("disabled", false);
                            $('#alert-add-msg').css("display", "none");

                                dynamicAddressList();

                        }

                    });

                }

            });

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

                    console.log(data.userAddress.length);
                    $(".add-user-address-html").empty();

                    let totalAddressCount = data?.userAddress?.length;
                    if(totalAddressCount == 0){
                        
                        $('#nextButtonHome4').prop("disabled", true);
                        $('#alert-add-msg').css("display", "block");

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


                        let htmlId = (value.id + 1);
                        let id = value.id;
                        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 checkVerified = value['is_mobile_verified'] ? value[
                            'is_mobile_verified'] : 'N/A';
                        

                        if (checkVerified == 'no') {
                            var verify =
                                '<span class="notverify_mobile"></span> Not Verified <a href="#" onclick="verifyOtpModal('+id+')">Click to Verify</a>';
                        } else if (checkVerified == 'yes') {
                            var verify = '<span class="verified_mobile"></span> Verified';
                        } else {
                            var verify = "--";
                        }


                        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 d-flex justify-content-between align-items-center">' +
                            addressNickName + '<icon class="fa fa-pencil" data-toggle="modal" data-target="#addressmodal12" onclick="selectedAddressData('+value.id+')"></icon></div>      <div class="card-body address-card-body"><p>' + userAddress +
                            '</p><p>' + tempAddress + '</p><p>Post box -' + userPincodes +
                            '</p><h6>Phone: <strong> ' + phoneNumber + ' ' + verify +
                            '</strong> </h6> </div></div></label></div></div>';
                        $("#addresId").val(id);
                        $(wrapper1).append(html12);

                    });


                }
            });

}

dynamicAddressList();
            

            //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>');
                });

            });


            //Another pincode Address Details

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

                let pincode = $('#anotherPincode').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="anotherState"]').empty();
                                jQuery('select[name="anotherCity"]').empty();

                                $('#anotherState').removeClass('dissbleClickButton');
                                $('#anotherCity').removeClass('dissbleClickButton');

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

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

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

                                    $('select[name="anotherState"]').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 {
                                $('#anotherState').addClass('dissbleClickButton');
                                $('#anotherCity').addClass('dissbleClickButton');

                                jQuery('select[name="anotherState"]').empty();
                                jQuery('select[name="anotherCity"]').empty();

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

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

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

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

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


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

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

                listData.state.forEach(state => {

                    $('select[name="anotherState"]').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();
                }
            });

            $('.AllowNumericDecimal').on("keypress keyup blur", function(event) {
                var inputValue = $(this).val();
                var sanitizedValue = inputValue.replace(/[^0-9.]/g, ""); // Allow digits and decimal point
                // Remove multiple decimal points and leading zeros
                sanitizedValue = sanitizedValue.replace(/(\..*)\./g, '$1');
                sanitizedValue = sanitizedValue.replace(/^0+(?=\d)/, '');
                $(this).val(sanitizedValue);
            });

            $(".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) {

                    console.log('data',data.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.category.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.trim() + "</td><td>" + value.code.trim() +
                    "</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.trim() +
                        '</option>');
                });

                decreamentIds++;

            });
        }

        function verifyOtpModal(id){
            $('#addresId').val(id);
            $('#verifymobilepop').modal('show');
        }

        function priceCalculation() {

            // 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;
            let discountType = [];

            quantity = [];
            price = [];
            discount = [];
            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() {
                //alert('aya');
                if ($(this).val()) {
                    discountType.push($(this).val());
                } else {
                    discountType.push('rs');
                }
            });

            console.log('+++++Quantity Type+++++', discountType);

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

            });
            //shipping_discount_id
            let shippingChargeValue = 0;
            let giftWrapIdValue = 0;
            let transactionChargeIdValue = 0;
            let shippingDiscountValue = 0;

            if ($('#shipping_charge_value_id').val()) {
                shippingChargeValue = parseInt($('#shipping_charge_value_id').val());
            }

            if ($('#gift_wrap_id_value').val()) {
                giftWrapIdValue = parseInt($('#gift_wrap_id_value').val());
            }

            if ($('#transaction_charge_id').val()) {
                transactionChargeIdValue = parseInt($('#transaction_charge_id').val());
            }

            if ($('#shipping_discount_id').val()) {
                shippingDiscountValue = parseInt($('#shipping_discount_id').val());
            }
            let subTotal1 = (total + shippingChargeValue + giftWrapIdValue +
                transactionChargeIdValue - shippingDiscountValue);

            if (subTotal1 < 0) {

                swal({
                    icon: 'warning',
                    title: "Alert",
                    text: 'Please enter a valid discount.',
                    type: "error",

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

            }

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

        }

        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++;
        }*/
        //Shipping Charges checkbox
        $('#other_charges_shipping_id').on('click', function(e) {

            if ($('#other_charges_shipping_id').is(":checked")) {
                $('#shipping_charge_value_id').show();
            } else {
                $('#shipping_charge_value_id').hide();
                $('#shipping_charge_value_id').val(0);
            }

            priceCalculation();

        });

        //Gift Wrap id
        $('#gift_wrap_id').on('click', function(e) {

            if ($('#gift_wrap_id').is(":checked")) {
                $('#gift_wrap_id_value').show();
            } else {
                $('#gift_wrap_id_value').hide();
                $('#gift_wrap_id_value').val(0);
            }
            priceCalculation();

        });

        //Transaction Id
        $('#transaction_check').on('click', function(e) {

            if ($('#transaction_check').is(":checked")) {
                $('#transaction_charge_id').show();
            } else {
                $('#transaction_charge_id').hide();
                $('#transaction_charge_id').val(0);
            }

            priceCalculation();

        });

        //Shipping Charges Discount
        $('#discount_check_id').on('click', function(e) {

            if ($('#discount_check_id').is(":checked")) {
                $('#shipping_discount_id').show();
            } else {
                $('#shipping_discount_id').hide();
                $('#shipping_discount_id').val(0);
            }
            priceCalculation();

        });

        $("#checkOtpForm").validate({

            rules: {

                mobileOtp: {
                    required: true,
                    digits: true,
                    minlength: 6,
                    maxlength: 6,

                },
            },
            messages: {
                mobileOtp: {
                    required: 'Please enter 6 digit OTP',
                    digits: 'Please enter digits only',
                    maxlength: 'Enter only 6 digit',
                    minlength: 'Please enter at least 6 digit.'
                },

            }

        });




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


            e.preventDefault();
            let allFormFields = [];

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

                    if ($('#mobileOtp').val() == '123456') {
                        var varifyval = 'yes';
                        $('#isVerified').val(varifyval);
                        $('#verifymobilepop').modal('hide');
                        $('#showError').hide();
                        $('#verifymobile').html('<span style="color:green">OTP Verified</span>');

                    } else {

                        $('#showError').html('<span style="color:red">Please enter correct OTP</span>');
                    }

                }
            });

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

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

                    let totalAddressCount = data?.userAddress?.length;

                    if(totalAddressCount == 0){
                        
                        ('#nextButtonHome4').attr("disabled", true);
                        $('#alert-add-msg').css("display", "block");
                        
                    }

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


                        let htmlId = (value.id + 1);
                        let id = value.id;
                        // alert(id);
                        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 checkVerified = value['is_mobile_verified'] ? value[
                            'is_mobile_verified'] : 'N/A';

                        // alert(checkVerified);

                        if (checkVerified == 'no') {
                            var verify =
                                '<span class="notverify_mobile"></span> Not Verified <a href="#"  onclick="verifyOtpModal('+id+')">Click to Verify</a>';
                        } else if (checkVerified == 'yes') {
                            var verify = '<span class="verified_mobile"></span> Verified';
                        } else {
                            var verify = "--";
                        }


                        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 d-flex justify-content-between align-items-center">' +
                            addressNickName +
                            '<icon class="fa fa-pencil" data-toggle="modal" data-target="#addressmodal12" onclick="selectedAddressData('+value.id+')"></icon></div><div class="card-body address-card-body"><p>' + userAddress +
                            '</p><p>' + tempAddress + '</p><p>Post box -' + userPincodes +
                            '</p><h6>Phone: <strong> ' + phoneNumber + ' ' + verify +
                            '</strong> </h6> </div></div></label></div></div>';
                        $("#addresId").val(id);
                        $('#verifymobile').html('<span style="" onclick="verifyOtpModal('+id+')">Verify via OTP</span>');
                        $(wrapper1).append(html12);

                    });


                }
            });

        });

        function selectAddress(id,mobile) {
            $('#addresId').val(id);
            $('#phoneNumber').val(mobile);
            $('#verifymobile').html('<span style="">Verify via OTP</span>');
            $('#addressmodal12').modal('show');
        }

        function selectedAddressData(valuesId) {
            let addressId = valuesId;

            $.ajax({
                method: 'POST',
                url: "{{ url('get-address-details') }}",
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data: {
                     _token: "{{ csrf_token() }}",
                     addressId: addressId,
                },
                success: function(data) {
                    
                    $('select[name="userAddressCity"]').empty();
                    $('#addressEditValueField').val(valuesId);
                    let addressNickName = $('#addressNickName').val(data?.data?.address_nick_name);
                    let alternateEmailAddress = $('#alternateEmailAddress').val(data?.data?.email);
                    let contactName = $('#contactName').val(data?.data?.contact_name);
                    let phoneNumber = $('#phoneNumber').val(data?.data?.phoneNumber);
                    let verifycheck = $('#isVerified').val(data?.data?.is_mobile_verified);
                    let alternatePhoneNumberAddress = $('#alternatePhoneNumberAddress').val(data?.data?.alt_phone_number);
                    let userAddressaddressLine1 = $('#userAddressaddressLine1').val(data?.data?.address);
                    let userAddressaddressLine2 = $('#userAddressaddressLine2').val(data?.data?.temp_address);
                    let userAddressPincode = $('#userAddressPincode').val(data?.data?.pincode);
                    let userAddressState = $('#userAddressState').val(data?.data?.state_id);

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

                    return;

                }
            });
           

        }

        // appending default slots on change
        $("#start_date").change(function() {
            var selectedDate = $(this).val();
            var slots = {!! json_encode(timeSlots()) !!};
             var dropdown = $("#expected_time");
            // Remove existing options
            dropdown.empty();
            $.each(slots, function(index, slot) {
              dropdown.append("<option value='" + slot.id + "'>" + slot.slot + "</option>");
            });
          
        });
        
        // Get the current date
        const currentDate = new Date();

        // Calculate the date 15 days ago
        const fifteenDaysAgo = new Date();
        fifteenDaysAgo.setDate(currentDate.getDate() - 15);

        // Format the dates as "YYYY-MM-DD" (required format for input type="date")
        const formattedCurrentDate = currentDate.toISOString().split("T")[0];
        const formattedFifteenDaysAgo = fifteenDaysAgo.toISOString().split("T")[0];

        // Set the min and max attributes of the input element
        document.getElementById("start_date").min = formattedFifteenDaysAgo;
        document.getElementById("start_date").max = formattedCurrentDate;

        function checkServicibility(fromPincode,toPincodeId,serviceType){

             let responseStatus = false;

            if (fromPincode && toPincodeId && serviceType) {
                jQuery.ajax({
                    url: "{{ route('pincode-servicibility-check') }}",
                    type: "POST",
                    data: {
                        _token: "{{ csrf_token() }}",
                        fromPincode: fromPincode,
                        toPincodeId: toPincodeId,
                        serviceType: serviceType
                    },
                    success: function(data) {

                        responseStatus = false;
                        if(!data.success){
                            
                            responseStatus = true;

                        }

                        responseStatus = false;
                    }
                });
            }

           return responseStatus;

        }
    </script>
@endsection