@extends('backend.layout.app')
<!-- title go hear -->
@section('title' , 'email' )
<!-- content go hear -->
@section('content')
<div class="   ">
	<h4 class="header-sub">   Email Settings </h4>
</div>
<div class="  border-top py-4">
	<!-- row start -->
	<div class="row">
		<!-- col start -->
		<div class="col-12 col-md-4">
			<h6>  Primary email address</h6>
		</div>
		<!-- col end -->
		<!-- col start -->
		<div class="col-12 col-md-6">
			<div class="card m-0">
				<div class="card-body">
					    <p class="text-capitalize">{{ $result['auth_user_email'] }}  – <span class="text-success"> Primary</span> </p>
						<!-- Button trigger modal -->
						<button type="button" class="btn btn-r  btn-outline-secondary" data-toggle="modal" data-target="#modalpassword">
						  change Primary  email
						</button>
						<!-- Button trigger modal -->
				</div>
			</div>
		</div>
		<!-- col end -->
	</div>
	<!-- row end -->
</div>
 

 <!-- Modal -->
<div class="modal fade" id="modalpassword" data-backdrop="static" data-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title"  >   change Primary  email </h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
         <div class="modal-body">
         	 	 <form   id="formProfileName">
         	 	 <div class="  mb-3">
							<label class="form-label">confirm password</label>
							<input type="password" name="password" class="form-control"     >
						</div>
 						<div class="  mb-3">
							<label class="form-label">New Email</label>
							<input type="email" name="email" class="form-control"     >
						</div>
					<input type="submit"   type="submit" id="submitBtn" class="btn btn-md btn-r btn-dark"  value="Submit">
						 <button type="button" class="btn  btn-md btn-r" data-dismiss="modal">Close</button>
					</form>
         </div>
				</div>
			</div>
		</div>
 <!-- modal end -->

@endsection

@push('footer-script')
<script type="text/javascript">

    formProfileName = document.getElementById('formProfileName');
    formProfileName.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(formProfileName);   
    const url = '{{ route('backend.settings.email.emailUpdate') }}';

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

    try {
	      const response = await axios.post(url, formData, config);
	      toastr.success(response.data.message);
	  } 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