@extends('backend.layout.app')

<!-- title go hear -->
@section('title' , 'appointment Form' )
<!-- content go hear -->
@section('content')
<div class="card  ">
	<div class="card-header d-flex pb-2  bg-light">
		<a href="{{ route('backend.appointment') }}" class="btn btn-r"><i class="fas fa-arrow-left"></i></a>
		<a href="{{ route('backend.appointment.createOrupdate') }}" class="btn  btn-r"><i class="fas fa-plus"></i></a>
		@if( $result['obj']->id)
		<a class=' btn btn-r '
		     href="{{route('backend.appointment.show',['id'=>$result['obj']->id])}}"
			  ><i class="fas fa-laptop"></i> </a>
		<a class=' btn btn-r '
			onclick='deleteMe({
			"url":"{{route("backend.appointment.destroy")}}",
			"id":"{{$result['obj']->id}}",
			"redirect":"{{route("backend.appointment")}}"
		})'><i class='fas fa-trash-alt'></i> </a>
		@endif
	</div>
	<div class="card-body   ">
		<!-- row start -->
		<form id="formId">
			@if( $result["obj"]->id)
			<input type="hidden" name="id"   value="{{ $result['obj']->id }}">
			@else
			<input type="hidden" name="id"   value="0">
			@endif



  <div class="form-group row">
    <label   class="col-4 form-label">name</label>
    <div class="col-8">
      <input  name="name" type="text" class="form-control" value="{{ old('name',$result['obj']->name ) }}">
    </div>
  </div>



  <div class="form-group row">
    <label   class="col-4 form-label">email</label>
    <div class="col-8">
      <input  name="email" type="email" class="form-control" value="{{ old('email',$result['obj']->email ) }}">
    </div>
  </div>

  <div class="form-group row">
    <label   class="col-4 form-label">phone</label>
    <div class="col-8">
      <input  name="phone" type="tel" class="form-control" value="{{ old('phone',$result['obj']->phone ) }}">
    </div>
  </div>

  <div class="form-group row">
    <label   class="col-4 form-label">date</label>
    <div class="col-8">
      <input  name="date" type="date" class="form-control" value="{{ old('date',$result['obj']->date ) }}">
    </div>
  </div>


  <div class="form-group row">
    <label class="col-4 form-label" for="nearest_exprenza_office">nearest_exprenza_office</label>
    <div class="col-8 d-flex">
      <select   id="nearest_exprenza_office" name="nearest_exprenza_office" class="form-control" >
        <option value=" "> select</option>
         <option value="ernakulam" @if(old('nearest_exprenza_office', $result['obj']->nearest_exprenza_office ) == 'ernakulam' ) selected @endif> ernakulam </option>
         <option value="thrissur" @if(old('nearest_exprenza_office', $result['obj']->nearest_exprenza_office ) == 'thrissur' ) selected @endif> thrissur </option>
         <option value="kattappana" @if(old('nearest_exprenza_office', $result['obj']->nearest_exprenza_office ) == 'kattappana' ) selected @endif> kattappana </option>
        </select>
    </div>
  </div>

  <div class="form-group row">
    <label   class="col-4 form-label">message</label>
    <div class="col-8">
      <input  name="message" type="tel" class="form-control" value="{{ old('message',$result['obj']->message ) }}">
    </div>
  </div>

  <div class="form-group row">
    <div class="offset-4 col-8">
      	<input type="submit"   type="submit" id="submitBtn" class="btn btn-md btn-r btn-dark"  value="Submit">
    </div>
  </div>
		</form>
		<!-- row end -->
	</div>
</div>
@endsection

@push('footer-script')
 <script type="text/javascript">
 	    // store
    formId = document.getElementById('formId');
    formId.addEventListener('submit', async (event) => {
    event.preventDefault();

      // Disable the submit button before making the Axios request
  const submitBtn = document.getElementById('submitBtn');
  submitBtn.disabled = true;

    const formData = new FormData(formId);
    const url = '{{ route('backend.appointment.store') }}';

    const config = {
      headers: {
        'Accept': 'application/json',
      }
    };

    try {
          const response = await axios.post(url, formData, config);
          toastr.success(response.data.message);
          if(response.data.redirect){
          	   setTimeout(function () {
			        window.location.href = response.data.redirect;
			    }, 1000);
          }
        } catch (error) {
          handleErrorResponse(error);
      }finally {
        	  // Re-enable the submit button whether the request succeeds or fails
	  	      const submitBtn = document.getElementById('submitBtn');
   	   	    submitBtn.disabled = false;
	       }


    });
 </script>
@endpush