@extends('layouts.frontend')
@section('content')
@if(request('updated'))
    <div class="alert alert-success alert-dismissible fade show" role="alert">
        Profile updated successfully!
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    </div>
@endif
<main>
      <section class="banner-back-img-with profile_main_page">
        <div class="inner-main-img">
          <div class="container">
            <div class="inner-banner-comn">
              <h1>{{ __('messages.profile_overview') }}</h1>
            </div>
          </div>
        </div>
      </section>

      <div class="prof-main">
        <section class="comn-padd">
          <div class="container">
            <div class="inner-acount">
              <div class="row">
                <div class="col-lg-3">
                  <div class="inner-left-tabs">
                  @include('frontend.user.include.sidebar')
                  </div>
                </div>
                <div class="col-lg-9">              
                    <div class="comm_border_box_outer">
                    <div class="edit-profile-main comm_border_box">
                        <div class="d-flex profile_main-row">
                        <div class="img-all-detail d-flex gap-main">
                        <figure class="profile-img">
                          @if ($user->profile_image && file_exists(public_path('storage/' . $user->profile_image)))
                              <img src="{{ asset('storage/' . $user->profile_image) }}" alt="Profile Image" />
                          @else
                              <img src="{{ asset('frontend/images/user.png') }}" alt="Default Profile" />
                          @endif
                      </figure>
                        <div class="detail-profile">
                            <h3>{{$user->first_name . ' ' .$user->last_name}}</h3>
                            <div class="icoms-prof d-flex">
                            <div class="email-ddet">
                                <img
                                src="{{ asset('frontend/images/email-p.png')}}"
                                alt=""
                                />
                                <a href="{{$user->email}}"
                                >{{$user->email}}</a
                                >
                            </div>
                            <div class="email-ddet">
                                <img
                                src="{{ asset('frontend/images/phone-p.png')}}"
                                alt=""
                                />
                                <a href="{{$user->number}}"
                                >{{$user->number}}</a
                                >
                            </div>
            
                            <div class="email-ddet">
                                <img
                                src="{{ asset('frontend/images/loc-p.png')}}"
                                alt=""
                                />
                                <p>{{$user->street . ' , ' . $user->zip_code . ' , ' . $user->city . ' , ' . $user->region}}</p>

                            </div>                                
                            </div>                           
                        </div>
                        </div>
            
                        <a href="{{route('user.edit')}}" class="primary-btn comm_primary_icon_btn">
                            <img
                            src="{{ asset('frontend/images/edit.png')}}"
                            alt=""                                  
                            />
                            {{ __('messages.edit_profile') }}
                            </a>
                        </div>
                    </div>
                    <div class="comm_border_box">
                        <div class="d-flex want_to_delte_sec">
                          <h4>{{ __('messages.want_to_delete_account') }}</h4>
                          <button class="primary-btn comm_primary_icon_btn" data-bs-toggle="modal" data-bs-target="#staticBackdrop">
                            <img
                            src="{{ asset('frontend/images/del.png')}}"
                            alt=""                                  
                            />
                            {{ __('messages.delete_account') }}
                            </button>
                        </div>
                    </div>


                    <div class="modal fade comm-modal logout-modal" id="staticBackdrop" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
                      <div class="modal-dialog modal-dialog-centered">
                          <div class="modal-content">
                              <div class="modal-body">
                                  <div class="inner-modal-content text-center">

                                    <img class="img-delet mb-4"
                                      src="{{ asset('frontend/images/delet.png')}}"
                                      alt=""                                  
                                      />

                                      <h2 class="modal_heading">{{ __('messages.delete_account_confirmation') }}</h2>

                                      <div class="modal_two_btns d-flex justify-content-center">
                                          <button type="button" class="primary-outline-btn " id="confirmDeleteBtn">
                                            {{ __('messages.yes') }}
                                          </button>
                                          <button type="button" class=" primary-btn comn-btn-logout" data-bs-dismiss="modal">
                                            {{ __('messages.no') }}

                                          </button>
                                      </div>
                                  </div>
                              </div>
                          </div>
                        </div>
                    </div> 
                    
                    

                </div>
              </div>
            </div>
          </div>
        </section>
      </div>
    </main>


    <script>
     var baseUrl = "{{ rtrim(config('app.url'), '/') }}";
     $('#confirmDeleteBtn').on('click', function () {
        $(this).prop('disabled', true).text('Deleting...');
    
        $.ajax({
          url: `${baseUrl}/user/delete`, 
          type: 'POST',
          data: {
            _token: '{{ csrf_token() }}' 
          },
          success: function (response) {
            window.location.href = '';
          },
          error: function () {
            alert('Error deleting account');
            $('#confirmDeleteBtn').prop('disabled', false).text('yes');
          }
        });
      });
    </script>
    
@endsection