@extends($theme.'.layouts.admin')
@section('content')
<section class="checkout-page section-padding">
    <div class="container">
        <div class="row pt-2">
            <div class="col-lg-12 col-md-12 right-side wow slideInUp mb-5">
                <div class="profile-page bg-white mb-4">
                    <div class="col-12 pl-0 mb-3"><h5 class=""> Account Info</h5></div>
                    {!!Form::open(array('class'=>'','id'=>'update_profile','files' => true));!!}
                    <div class="row">
                        <div class="col-lg-3">
                            <div class="center">
                                @if($customer_detail->profile_image !="")
                                    <span class="profile-picture">
                                        <img class="editable img-responsive" alt=" Avatar" id="avatar2" src="">
                                        <!--<span class="prem_icon"><img src="assets/img/icons/profile_premium_icon.png" /></span>-->
                                    </span>
                                @endif
                                <input name="profile_image" id="profile" accept=".jpg,.jpeg,.png,.bmp" class="custom-file-upload" onchange="validateFileType()" type="file" />
                                <div class="space space-4"></div>
                                                            </div>
                        </div>
                        <div class="col-lg-9">
                            <div class="row">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label>First Name *</label>
                                        <input class="form-control" name="firstname" type="text" placeholder="First Name *" value="{{ $customer_detail->firstname }}" required="">
                                    </div>
                                </div>
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <label>Last Name *</label>
                                        <input class="form-control" name="lastname" type="text" placeholder="Last Name *" value="{{ $customer_detail->lastname }}" required="">
                                    </div>
                                </div>
                                <div class="col-12 col-md-6">
                                    <div class="form-group">
                                        <label>Phone Number</label>
                                        <input class="form-control" name="phone" type="text" placeholder="Phone Number " value="{{ $customer_detail->phone }}" required="">
                                    </div>
                                </div>
                                <div class="col-12 col-md-6">
                                    @php $readonly = '';
                                    if(!empty($customer_detail->email)) {
                                        $readonly = 'readonly';
                                    }@endphp
                                    <div class="form-group">
                                        <label> Email Address *</label>
                                        <input class="form-control" name="email_id" {{$readonly}} type="email" placeholder="Email Address *" value="{{ $customer_detail->email }}" required="">
                                    </div>
                                </div>
                                <div class="col-12 col-lg-6 select-gender-box">
                                    <div class="form-group mb-8">
                                        <label>Gender</label>
                                        <div class="btn-group-toggle mt-2 d-flex bd-highlight">
                                            <div class="mr-2">
                                                <input id="male" class="radio-custom mr-1" name="gender" type="radio" value="Male" {{ $customer_detail->gender == 'Male' ? 'checked' : ''}}> Male
                                            </div>
                                            <div class="ml-1">
                                                <input id="female" class="radio-custom mr-1" name="gender" type="radio" value="Female" {{ $customer_detail->gender == 'Female' ? 'checked' : ''}}> Female
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                                                <div class="col-12 col-lg-6 mt-4 text-right">
                                    <button class="btn btn-dark btn-md float-none" id="submit_button" type="submit">Save Changes</button>
                                </div>

                                                            </div>
                        </div>
                    </div>
                    {!!Form::close();!!}
                </div>
            </div>
        </div>
    </div>
</section>

<script>
 var locale = "{{app()->getLocale()}}";
  $(document).ready(function(){
    $('#update_profile').submit(function(e){

      e.preventDefault();
      var token, url, data;

      if($('#gst_number').val()) {
            var gstinformat = new RegExp('^[0-9]{2}[A-Z]{5}[0-9]{4}[A-Z]{1}[1-9A-Z]{1}Z[0-9A-Z]{1}$');
            if (!gstinformat.test($('#gst_number').val())) {
                toastr.error("Please! Enter Valid GSTIN Number. It should be in this '22AAAAA0000A1Z0' format");
                $("#gst_number").focus();
                return false;
            }
      }

      token = $('meta[name="csrf-token"]').attr('content');
      url = '{{url('/profile/update')}}';
      data = new FormData(this);
      $.ajax({
        url: url,
        headers: {'X-CSRF-TOKEN': token},
        data: data,
        processData: false,
        contentType: false,
        type: 'POST',
        datatype: 'JSON',
        success: function (resp) {
          if(resp.http_code == 400){
            err_msg = resp.message.replace(/, \\n /g, '<br>');
            toastr.error(err_msg);
          } else if(resp.http_code == 200){
            toastr.success(resp.message);
            var loc = '{{ url('profile')}}';
            $(location).attr('href',loc);
          } else if(resp.http_code == 500){
            toastr.success(resp.message);
          }
        },
      });
    });

    });
  function validateFileType() {
    var fileName = $('#profile')[0].files[0];
    var file_name = fileName.name;
    var file_size = fileName.size;
    var extFile = file_name.split('.').pop().toLowerCase();
    if (extFile != "jpg" && extFile != "png" && extFile != "jpeg" && extFile != "bmp") {
        $('#profile').val('');
        alert("Only jpg,jpeg,bmp and png files are allowed!");
    } else if (file_size > 2097152) {
        $('#profile').val('');
        alert('Image size should not be more than 2mb.');
    }
}
</script>
@endsection