@extends('backend.layout.app')
<!-- title go hear -->
@section('title' , 'account' )
<!-- content go hear -->
@section('content')
<div class="  ">
	<h4  class="header-sub">Account Settings </h4>
</div>
<div class="  border-top py-4">
	<!-- row start -->
	<div class="row">
		<!-- col start -->
		<div class="col-12 col-md-4">
			<h6>General</h6>
		</div>
		<!-- col end -->
		<!-- col start -->
		<div class="col-12 col-md-6">
			<div class="card m-0">
				<div class="card-body">
						<!-- Button trigger modal -->
						<button type="button" class="btn btn-r  btn-outline-secondary" data-toggle="modal" data-target="#modalpassword">
						  change name
						</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 name </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">Name</label>
							<input type="text" name="name" 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.account.nameUpdate') }}';

    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