@extends('layouts.buddy-screens')
@section('content')

          <!-- Content wrapper -->
          <div class="content-wrapper">
            <!-- Content -->

            <div class="container-xxl flex-grow-1 container-p-y">
              <h4 class="fw-bold py-3 mb-4"><span class="text-muted fw-light">Account Settings /</span> Account</h4>
@if ($errors->any())
                  @foreach ($errors->all() as $error)
                    <div class="alert alert-danger">{{ $error }}</div>
                  @endforeach
                  @endif
              <div class="row">
                <div class="col-md-12">

                  <div class="card mb-4">
                    <h5 class="card-header">Profile Details</h5>
                    <!-- Account -->
                <form id="formAccountSettings" method="POST" action="{{route('update_user',$edit_profile->id)}}" enctype="multipart/form-data">
                  @method('PUT')
                  @csrf
                    <div class="card-body">
                      <div class="d-flex align-items-start align-items-sm-center gap-4">
                        <img
                          src="@if(isset($edit_profile->profilepic)) {{asset('public/uploads/user_media/user_profile/'.$edit_profile->profilepic)}} @else../assets/dashboard/assets/img/avatars/userlogo.png @endif"
                          alt="user-avatar"
                          class="d-block rounded"
                          height="100"
                          width="100"
                          id="uploadedAvatar"
                        />
                        <div class="button-wrapper">
                          <label for="upload" class="btn btn-primary me-2 mb-4" tabindex="0">
                            <span class="d-none d-sm-block">Upload new photo</span>
                            <i class="bx bx-upload d-block d-sm-none"></i>
                            <input
                              type="file"
                              id="upload"
                              class="account-file-input"
                              hidden
                              name="profilepic"
                              accept="image/png, image/jpeg"
                            />
                          </label>
                          <button type="reset" class="btn btn-outline-secondary account-image-reset mb-4" onclick="resetform();">
                            <i class="bx bx-reset d-block d-sm-none"></i>
                            <span class="d-none d-sm-block">Reset</span>
                          </button>

                          <p class="text-muted mb-0">Allowed JPG, GIF or PNG. Max size of 800K</p>
                        </div>
                      </div>
                    </div>
                    <hr class="my-0" />
                    <div class="card-body">
                        <div class="row">
                          <div class="mb-3 col-md-6">
                            <label for="firstName" class="form-label">First Name<sup style="color:red;">*</sup></label>
                            <input
                              class="form-control"
                              type="text"
                              id="firstName"
                              name="name"
                              value="{{$edit_profile->name ?? old('name')}}"
                              autofocus
                              onkeyup="value=value.replace(/[^\a-\z\A-\Z ]/g,'')"
                            />
                          </div>
                          <div class="mb-3 col-md-6">
                            <label for="lastName" class="form-label">Last Name<sup style="color:red;">*</sup></label>
                            <input class="form-control" type="text" name="last_name" id="lastName" value="{{$edit_profile->last_name ?? old('last_name')}}" onkeyup="value=value.replace(/[^\a-\z\A-\Z ]/g,'')"/>
                          </div>
                          <div class="mb-3 col-md-6">
                            <label for="email" class="form-label">E-mail<sup style="color:red;">*</sup></label>
                            <input
                              class="form-control"
                              type="text"
                              id="email"
                              name="email"
                              value="{{$edit_profile->email ?? old('email')}}"
                              placeholder="john.doe@example.com"
                            />
                          </div>

                          <div class="mb-3 col-md-6">
                            <label class="form-label" for="phoneNumber">Contact No<sup style="color:red;">*</sup></label>
                            <div class="input-group input-group-merge">

                              <input
                                type="tel"
                                id="phoneNumber"
                                name="phone"
                                maxlength="12"
                                class="form-control"
                                placeholder="202 555 0111"
                                value="{{$edit_profile->phone ?? old('phone')}}"
                                onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')"
                              />
                            </div> 
                          </div>
                          <div class="mb-3 col-md-6">
                            <label for="educational_qualification" class="form-label">Educational qualification<sup style="color:red;">*</sup></label>
                            <input
                              type="text"
                              class="form-control"
                              id="educational_qualification"
                              name="educational_qualification"
                              value="{{$edit_profile->educational_qualification ?? old('educational_qualification')}}"
                            />
                          </div>
                          <div class="mb-3 col-md-6">
                            <label for="professional_qualification" class="form-label">Professional Qualification<sup style="color:red;">*</sup></label>
                            <input
                              type="text"
                              class="form-control"
                              id="professional_qualification"
                              name="professional_qualification"
                              value="{{$edit_profile->professional_qualification ?? old('professional_qualification')}}"
                            />
                          </div>
						             <div class="mb-3 col-md-6">
                            <label for="organization" class="form-label">Organization<sup style="color:red;">*</sup></label>
                            <input
                              type="text"
                              class="form-control"
                              id="organization"
                              name="organization"
                              value="{{$edit_profile->organization ?? old('organization')}}"
                            />
                          </div>
                          <div class="mb-3 col-md-6">
                            <label for="language" class="form-label">Working Status<sup style="color:red;">*</sup></label>
                            <select id="working_status" class="select2 form-select" name="working_status" onchange="workingstatus()">
                              <option value="">Select status</option>
                              <option value="student" @if ($edit_profile->working_status === 'student' || old('working_status') === 'student') selected @endif>Student</option>
                              <option value="salaried" @if ($edit_profile->working_status === 'salaried' || old('working_status') === 'salaried') selected @endif>Salaried</option>
                              <option value="self_employeed" @if ($edit_profile->working_status === 'self_employeed' || old('working_status') === 'self_employeed') selected @endif>self-employed professional</option>
                              <option value="business" @if ($edit_profile->working_status === 'business' || old('working_status') === 'business') selected @endif>Business</option>
                              <option value="housewife" @if ($edit_profile->working_status === 'housewife' || old('working_status') === 'housewife') selected @endif>Housewife</option>
                              <option value="other" @if ($edit_profile->working_status === 'other' || old('working_status') === 'other') selected @endif>Other</option>
                            </select>
                            @if($edit_profile->working_status == 'other')
                              <input
                              style="display: block"
                              type="text"
                              class="form-control mt-3"
                              id="other_working_status"
                              name="other_working_status"
                              value="{{$edit_profile->other_working_status}}"
                              />
                              @elseif(old('working_status') === 'other')
                              <input
                              style="display: block"
                              type="text"
                              class="form-control mt-3"
                              id="other_working_status"
                              name="other_working_status"
                              value="{{$edit_profile->other_working_status}}"
                              />
                            @else
                            <input
                            type="text"
                            class="form-control mt-3"
                            id="other_working_status"
                            name="other_working_status"
                            value="{{$edit_profile->other_working_status}}"
                            />
                            @endif
                          </div>
						             <div class="mb-3 col-md-6">
                            <label class="form-label" for="country">Country<sup style="color:red;">*</sup></label>
                            <select id="country" class="select2 form-select" name="country_id">
                              <option disabled selected>Select country</option>
                              @foreach($country as $list)
                                @if($edit_profile->country_id == $list->country_id)
                                <option value="{{$list->country_id}}" selected>{{$list->country_name}}</option>
                                @else
                                <option value="{{$list->country_id}}">{{$list->country_name}}</option>
                                @endif
                              @endforeach
                            </select>
                          </div>

                          <div class="mb-3 col-md-6">
                            <div class="row">
                              <div class="mb-3 col-md-6">
                                <label for="state" class="form-label">State<sup style="color:red;">*</sup></label>
                                <select id="state" class="form-control" name="state_id">
                                  <option value="">Select State</option>
                                  @foreach($state as $list)
                                    @if($edit_profile->state_id == $list->state_id)
                                    <option value="{{$list->state_id}}" selected>{{$list->state_name}}</option>
                                    @else
                                    <option value="{{$list->state_id}}">{{$list->state_name}}</option>
                                    @endif
                                  @endforeach
                                </select>
                              </div>
                              <div class="mb-3 col-md-6">
                                <label for="city" class="form-label">City<sup style="color:red;">*</sup></label>
                                <select id="city" class="form-control" name="city_id">
                                  <option value="">Select City</option>
                                  @foreach($city as $list)
                                  @if($edit_profile->city_id == $list->city_id)
                                  <option value="{{$list->city_id}}" selected>{{$list->city_name}}</option>
                                  @else
                                  <option value="{{$list->city_id}}">{{$list->city_name}}</option>
                                  @endif
                                @endforeach

                                </select>                            

                              </div>
                            </div>
                          </div>
                          <div class="mb-3 col-md-6">
                            <label for="address" class="form-label">Address<sup style="color:red;">*</sup></label>
                            <input type="text" class="form-control" id="address" name="address" placeholder="Address" value="{{$edit_profile->address	?? old('address')}}"/>
                          </div>
                             <div class="mb-3 col-md-6">
                            <label for="zipCode" class="form-label">Zip Code<sup style="color:red;">*</sup></label>
                            <input
                              type="tel"
                              class="form-control"
                              id="zipCode"
                              name="zipcode"
                              placeholder="231465"
                              maxlength="6"
                              value="{{$edit_profile->zipcode ?? old('zipcode')}}"
                              onkeyup="if (/\D/g.test(this.value)) this.value = this.value.replace(/\D/g,'')"
                            />
                          </div>

                          <h6 class="green">Reset Password</h6>
						  <hr>
                          <div class="mb-3 col-md-6">
                            <label for="address" class="form-label">New password</label>
                            <input type="password" class="form-control" id="address" name="password" placeholder="xxxxxxxx" />
                          </div>
                          <div class="mb-3 col-md-6">
                            <label for="state" class="form-label">Confirm Password</label>
                            <input class="form-control" type="password" id="state" name="password_confirmation" placeholder="xxxxxxxx" />
                          </div>
                        </div>
                        <div class="mb-3 col-md-6">
                          <div class="col-md">
                          <label class="form-label  col-lg-12" for="password">Residential Status<sup style="color:red;">*</sup></label>
                                    <div class="form-check form-check-inline ">
                                      <input
                                        class="form-check-input"
                                        type="radio"
                                        name="inlineRadioOptions"
                                        id="inlineRadio1"
                                        value="Indian"
                                       {{ ( $edit_profile->residential =='Indian' ) ? 'checked' : '' }}
                                      />
                                      <label class="form-check-label" for="inlineRadio1">Indian Resident</label>
                                    </div>
                                    <div class="form-check form-check-inline">
                                      <input
                                        class="form-check-input"
                                        type="radio"
                                        name="inlineRadioOptions"
                                        id="inlineRadio2"
                                        value="NRI"
                                       {{ ( $edit_profile->residential =='NRI' ) ? 'checked' : '' }}
                                      />
                                      <label class="form-check-label" for="inlineRadio2">Non Indian Resident</label>
                                    </div>
                                  </div>
                          </div>
                        <div class="mt-2">
                          <button type="submit" class="btn btn-primary me-2">Save changes</button>
                            @php

                            $role = Auth::User()->role;			
                            @endphp
                            @if($role=='dpuser')
                              <a href="{{route('user.dashboard')}}" class="btn btn-outline-secondary">Cancel</a>
                            @elseif($role=='dpbuddy')
                              <a href="{{route('buddy.dashboard')}}" class="btn btn-outline-secondary">Cancel</a>
                            @elseif($role=='dpSaarthi')
                              <a href="{{route('saarthi.dashboard')}}" class="btn btn-outline-secondary">Cancel</a>
                            @else
                              <a href="{{route('dpbuddy.dashboard')}}" class="app-brand-link">
                                <img src="{{asset('assets/dashboard/assets/img/elements/logo.jpg')}}"/>
                              </a>
                            @endif
                        </div>
                      </form>
                    </div>
                    <!-- /Account -->
                  </div>

                  <div class="card mb-3">
                    <h5 class="card-header">I want to be a Dealplexus Buddy

					</h5>
					<span> &nbsp;&nbsp;&nbsp;	Congratulations on your decision to be a DP Buddy. </span>
					<span> &nbsp;&nbsp;&nbsp;   Please upload a few documents below, and you shall be ready to start.</span>
                    <div class="card-body">


                      @if(isset($user_media->user_id))
                      <form id="formAuthentication" class="mb-3" action="{{route('update_user_media',$user_media->user_id)}}"  enctype="multipart/form-data" method="POST">
                      @csrf
                      @method('PUT')
                      @else
                      <form id="formAuthentication" class="mb-3" action="{{route('user_media')}}"  enctype="multipart/form-data" method="POST">
                      @endif
                      @csrf
					              <!--<div class="row mb-3">
                          <div class="col-lg-2"><label class=" col-form-label" for="basic-default-name">Upload Aadhar Card<sup style="color:red;">*</sup></label></div>
                          <div class="col-lg-5">
                            <input class="form-control" type="file" id="formFile" name="aadhar_card"/>
                          </div>
						             <div class="col-lg-5">
                            <input class="form-control" type="number" name="adhar_no" id="lastName" value="{{ $user_media->adhar_no ?? old('adhar_no') }}" placeholder="Enter Adhar card No."/>
                          </div>
						           </div>
								   -->

						           <div class="row mb-3">
                          <div class="col-lg-2"><label class=" col-form-label" for="basic-default-name">Upload PAN Card<sup style="color:red;">*</sup></label></div>
                          <div class="col-lg-5">
                            <input class="form-control" type="file" id="formFile"  name="pan_card"/>
                          </div>
						             <div class="col-lg-5">
                            <input class="form-control" type="text" name="pan_no" id="lastName"  value="{{ $user_media->pan_no ?? old('pan_no') }}" placeholder="Enter PAN card No."/>
                          </div>
						            </div>
						            <div class="row mb-3">
                          <div class="col-lg-2"><label class=" col-form-label" for="basic-default-name">Upload GSTIN<sup style="color:red;"></sup></label></div>
                          <div class="col-lg-5">
                            <input class="form-control" type="file" id="formFile"  name="gstin"/>
                          </div>
						             <div class="col-lg-5">
                            <input class="form-control" type="text" id="lastName" value="{{ $user_media->gstin_no ?? old('gstin_no') }}" placeholder="Enter GST No." name="gstin_no"/>
                          </div>
						            </div>
						           <div class="row mb-3">
                          <div class="col-lg-2"><label class=" col-form-label" for="basic-default-name">Address Proof<sup style="color:red;">*</sup></label></div>
                          <div class="col-lg-5">
                           <select id="language" class="select2 form-select" name="address_proof">
                              <option disabled selected>Select proof</option>
                              <option value="voter_id" {{ ($user_media->address_proof ?? '') == 'voter_id' ? 'selected' : '' }}>Voter ID</option>
                              <!--<option value="aadhar_card" {{ ($user_media->address_proof ?? '') == 'aadhar_card' ? 'selected' : '' }}>Aadhar Card</option> -->
                              <option value="driving_licence" {{ ($user_media->address_proof ?? '') == 'driving_licence' ? 'selected' : '' }}>Driving Licence </option>
                              <option value="bank_statement" {{ ($user_media->address_proof ?? '') == 'bank_statement' ? 'selected' : '' }}>Bank Statement</option>
                              <option value="passport" {{ ($user_media->address_proof ?? '') == 'passport' ? 'selected' : '' }}>Passport</option>
                            </select>
                          </div>
						             <div class="col-lg-5">
                            <input class="form-control" type="file" id="formFile"  name="address_proof_docu"/>
                          </div>
						            </div>


<!--
<div class="form-row mb-3" id="imgc">
              Signature :
              <div class="wrapper mb-3">
                <canvas id="signature-pad" class="signature-pad" width=400 height=200 required name="signature"></canvas>
              </div>
			  <p onclick="uploadEx();" >Clear</p>
            </div>
					-->







						         <div class="row">
						            <div class="mb-3 col-lg-4"><button type="button" class="btn btn-outline-primary">Assign Agreement</button></div>
						            <div class="mb-3 col-lg-4">
                        <label for="upload1" class="btn btn-primary " tabindex="0">
                            <span class="d-none d-sm-block">Upload Agreement</span>
                            <i class="bx bx-upload d-block d-sm-none"></i>
                            <input type="file" id="upload1" class="account-file-input"
                            hidden  name="upload_agreement"/>
                          </label>
						           </div>
						           <div class="mb-3 col-lg-4"><button type="submit" class="btn btn-primary">Save changes</button></div>
						          </div>
                      </form>
                    </div>
                  </div>

                  <div class="modal fade" id="smallModal_3" tabindex="-1" aria-hidden="true">
                    <div class="modal-dialog modal-sm" role="document">
                      <div class="modal-content">
                        <div class="modal-header">
                          <h5 class="modal-title" id="exampleModalLabel2">Success</h5>
                          <button
                            type="button"
                            class="btn-close"
                            data-bs-dismiss="modal"
                            aria-label="Close"
                          >X</button>
                        </div>
                        <div class="modal-body" id="body_msg">
                        <p> You’re a/c has been deactivated successfully. Should you at any time in future want to rejoin us, we would be happy to have you back. Thank you and best wishes for your future endeavours</p>
                        </div>
                        <div class="modal-footer">
                          <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">
                            Close
                          </button>
                          <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Ok</button>
                        </div>
                      </div>
                    </div>
                  </div>

                  <div class="card">

                    <div class="card-body">

                      {{-- <p>If you are going to be away for some time, you can deactivate your account for time being.<a href="javascript:void(0)" class="red" id="deactivate"> Deactivate Now</a></p> --}}
                      <p> If you are unhappy with any of our services, you may connect with us here : <a href="{{route('user.support')}}">Support</a>. If you still want to discontinue your account, please click here <a href="javascript:void(0)" class="red" id="deactivate"> Deactivate Now</a></p>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <!-- / Content -->

            <!-- Footer -->
           <footer class="content-footer footer bg-footer-theme">
              <div class="container-xxl d-flex flex-wrap justify-content-between py-2 flex-md-row flex-column">
                <div class="mb-2 mb-md-0">
                  ©
                  <script>
                    document.write(new Date().getFullYear());
                  </script>
                  , Developed by
                  <a href="https://www.basicmantra.com" target="_blank" class="footer-link fw-bolder">Basic Mantra</a>
                </div>
              </div>
            </footer>
            <!-- / Footer -->

            <div class="content-backdrop fade"></div>
          </div>
          <!-- Content wrapper -->
        </div>
        <!-- / Layout page -->
      </div>

      <!-- Overlay -->
      <div class="layout-overlay layout-menu-toggle"></div>
    </div>

<style>
		.wrapper.mb-3 canvas {
		border: 1px solid;
	}

</style>	
	<script src="https://cdn.jsdelivr.net/npm/signature_pad@2.3.2/dist/signature_pad.min.js"></script>
<script>

            var canvas = document.querySelector("canvas");

            // Adjust canvas coordinate space taking into account pixel ratio,
            // to make it look crisp on mobile devices.
            // This also causes canvas to be cleared.
            function resizeCanvas() {
                // When zoomed out to less than 100%, for some very strange reason,
                // some browsers report devicePixelRatio as less than 1
                // and only part of the canvas is cleared then.
                var ratio =  Math.max(window.devicePixelRatio || 1, 1);
                canvas.width = canvas.offsetWidth * ratio;
                canvas.height = canvas.offsetHeight * ratio;
                canvas.getContext("2d").scale(ratio, ratio);
            }

            window.onresize = resizeCanvas;
            resizeCanvas();

            var signaturePad = new SignaturePad(canvas, {
              backgroundColor: 'rgb(255, 255, 255)' // necessary for saving image as JPEG; can be removed is only saving as PNG or SVG
            });


            
            var dataURL = canvas.toDataURL();
			
</script>
<script>
			function uploadEx() {
				var canvas = document.getElementById("canvas");
				var dataURL = canvas.toDataURL("image/png");
				document.getElementById('hidden_data').value = dataURL;
				alert(dataURL);
			};
		</script>

    <!-- / Layout wrapper -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
    <script>
        $("#upload").on('change', function() {
            if (typeof(FileReader) != "undefined") {
                var reader = new FileReader();
                reader.onload = function(e) {
                    $("#uploadedAvatar").attr('src', e.target.result);
                }
                reader.readAsDataURL($(this)[0].files[0]);
            } else {
                alert("This browser does not support FileReader.");
            }
        });

        function resetform() {
            var ipat = "{{ asset('public/uploads/user_media/user_profile/' . $edit_profile->profilepic) }}";
            $("#uploadedAvatar").attr('src', ipat);
        }
    </script>

    <script>
       function workingstatus(){

        var other =$('#working_status').val(); 
        //alert(other); 
        if(other == "other"){
           $('#other_working_status').show();
        }else{
           $('#other_working_status').hide(); 
        }
      }
    </script>

    <script>
      jQuery(document).ready(function(){
        jQuery('#country').change(function(){
          let cid=jQuery(this).val();
          //alert(cid);
          jQuery('#city').html('<option value="">Select City</option>')
          jQuery.ajax({
            url:'/getState',
            type:'post',
            data:'cid='+cid+'&_token={{csrf_token()}}',
            success:function(result){
             // alert(result);
              jQuery('#state').html(result)
            }
          });
        });
        
        jQuery('#state').change(function(){
          let sid=jQuery(this).val();
          jQuery.ajax({
            url:'/getCity',
            type:'post',
            data:'sid='+sid+'&_token={{csrf_token()}}',
            success:function(result){
              jQuery('#city').html(result)
            }
          });
        });
        
        jQuery('#deactivate').click(function(){
          let user_id = {{Auth::User()->id}};
          //alert(user_id);
        if (confirm('Are you sure you want to deactivate your account ?')) {
          jQuery.ajax({
            url:'/deactivate-user',
            type:'post',
            data:'user_id='+user_id+'&_token={{csrf_token()}}',
            success:function(result){
              $('#smallModal_3').modal('show');
              $('#smallModal_3').on('hidden.bs.modal', function () {
                window.location.href = '/';
              })
            }
          });
        }
        });
      });
        
      </script>
@endsection