@vite([
    'resources/css/dashboard.css',
    'resources/css/add-button.css',
    'resources/js/user/upload.js',
    'resources/js/user/profile.js',
    'resources/css/user/profile.css',
])
@extends('main')
@section('content')
    <div class="content" id="content">
        <div class="d-flex justify-content-between align-items-center border-bottom mb-4 pb-0" style="width: 100%;" >
            @include('components.content_header')

    </div>
     <form id="profileForm" method="POST" action="{{route('users.informations.update',$user->id)}} ">
         @csrf
         @method('PUT')
         <div class="d-flex justify-content-start align-items-center mb-3">
         <img class="rounded-circle mb-3"
              style="width: 150px; height: 150px; object-fit: cover;"
                   @if($user->picture)
                    src="{{asset('storage/' . $user->picture)}}"
                   @else src="{{asset('images/avatar.png')}}"@endif alt="Profile">

             <button type="button" for="picture" class="img-icon btn"  data-bs-toggle="modal"
                     data-bs-target="#picUploadModal"
                     >
                 <img src="{{asset('icons/camera-icon.svg')}}" >
             </button>

         </div>
         <div class="mb-3">

         <div class="row">
             <div class="col-5 ">
             <input class="form-control" type="text" name="last_name"
                    placeholder="Nom" value="{{old('last_name',$last_name)}}" >
                 <div id="last_name-error"></div>

             </div>
                 <div class="col-5">
                 <input class="form-control"
                        type="text"
                        name="first_name"
                        placeholder="Prénom"
                        value="{{old('first_name',$first_name)}}">
                     <div id="first_name-error"></div>


                 </div>
         </div>

         </div>

         <div class="mb-3">
             <div class="row">

             <div class="col-5">
         <input class="form-control"
                name="email"
                placeholder="Email"
                value="{{old('user',$user->email)}}" disabled>
         </div>

         </div>
         </div>
         <div class="mb-3 d-flex justify-content-center align-items-center">
         <div class="col-3 ms-5">
             <button type="submit" class="btn btn-add-button text-light">Enregistrer</button>
         </div>
         </div>
     </form>
        <form id="passwordForm" method="POST" action="{{route('users.password.update',$user->id)}}">
            @csrf
            @method('PUT')
            <div class="mb-3">
                <div class="d-flex justify-content-between  align-items-center border-bottom mb-4 pb-0"
                     style="width: 100%;">
                <h4 style="color: #232F68 !important;"> Modifier Le mot de passe</h4>

                </div>
        </div>
            <div class="mb-3">
                <div class="row">

                <div class="col-5">
            <input class="form-control"
                   name="old_password"
                   type="password"
                   placeholder="Le mot de passe actuel">
                </div>
                    <div class="col-5">
                    <input class="form-control"
                           type="password"
                           name="password"
                           placeholder="Le nouveau de passe">
                    </div>
                </div>
            </div>

            <div class="mb-3">
            <div class="row">
                <div class="col-5">
            <input class="form-control"
                   type="password"
                   name="password_confirmation"
                   placeholder="Confirmer votre nouveau mot de passe">
                </div>

            </div>

            </div>
            <div class="mb-3 d-flex justify-content-center align-items-center">
                <div class="col-3 ms-5">
                    <button type="submit" class="btn btn-add-button text-light">Enregistrer</button>
                </div>
            </div>
        </form>
        <div class="modal fade" id="picUploadModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="false">
        @include('users.upload')
        </div>

@endsection