@extends('frontend.layouts.app')

@section('content')
<section class="pt-4 mb-4">
    <div class="container text-center">
        <div class="row">
            <div class="col-lg-6 text-center text-lg-left">
                <h1 class="fw-600 h4">{{ translate('Availability') }}</h1>
            </div>
            <div class="col-lg-6">
                <ul class="breadcrumb bg-transparent p-0 justify-content-center justify-content-lg-end">
                    <li class="breadcrumb-item opacity-50">
                        <a class="text-reset" href="{{ route('home') }}">{{ translate('Home') }}</a>
                    </li>
                    <li class="text-dark fw-600 breadcrumb-item">
                        <a class="text-reset" href="#">"{{ translate('Availability') }}"</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</section>
<section class="mb-5">
    <div class="container text-left">
        <div class="row">
            <div class="col-xxl-5 col-xl-6 col-lg-8 mx-auto">
                <form class="" action="{{ route('customer_packages_list_show') }}" method="GET" enctype="multipart/form-data">
                    <div class="bg-white rounded shadow-sm">
                        <div class="fs-15 fw-600 p-3 border-bottom text-center">
                            {{ translate('Check Availability')}}
                        </div>
                        <div class="text-center">
                          <span id="message" style="color:green;float:center;"></span>
                        </div>  
                        <div class="form-box-content p-3">
                            <div class="form-group position-relative">
                                <input type="text" class="form-control mb-3 pincode" placeholder="{{ translate('Pincode')}}" name="availability" id="availability" onkeyup="pincodeget('{{ route('pincodesearch') }}','getonlypincode')">
                            <div id="pincodelist" class="pincodelist d-none"></div>
                            </div>
                            <div class="text-center" style="display:none;" id="add">
                                <button type="submit"  class="btn btn-primary">{{ translate('Add')}}</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</section>

@endsection
@section('script')
  <script type="text/javascript">
   function  getdata(id,type){

            $.ajax({
                type: "post",
                url: "{{route('pincodedetail')}}",
                dataType: "json",
                data: {
                "_token": "{{ csrf_token() }}",
                "id": id,
                "type": type,
            },
                success: function (response) {
                    
                    if(response.success==1){
                      $('#add').hide();
                      $('#message').html("<p style='color:red;'>This pincode is not available</p>")
                      $(":submit").attr("disabled", true);

                    }
                    else if(response.success==0){
                      $('#add').show();
                      $('#message').text("This pincode is available")
                      $(":submit").removeAttr("disabled");
                    }
                    $('#message').show();
                    $('#message').delay(5000).fadeOut('slow'); 
                    $('#availability').val(response.pincode);
                    $('#pincodelist').addClass('d-none');
                }
            });
        }
  </script>      
@endsection