{{--@if (count($request->sessions) > 0)--}}
{{--    @foreach ($request->sessions as $session)--}}
{{--        @if ($session->is_current_device)--}}
{{--            bonjour--}}
{{--        @endif--}}
{{--    @endforeach--}}
{{--@endif--}}




<form id="formulaire_utilisateur">

    @csrf
    <input type="hidden" id="utilisateur_id" name="utilisateur_id" value="{{$utilisateur->id?? ''}}">
    <div class="alert alert-success text-center" id="entete" style="background:#000000 !important; color: white !important">
        <h1>utilisateur</h1>
    </div>

    <div class="form-group">
        <label for="code"><strong>NOM :</strong></label>
        <input type="text" name="name"  class="form-control" id="name" placeholder="Nom" value="{{old('name',$utilisateur->name)}}" @if($utilisateur->id) disabled @endif maxlength="4">
        @if($utilisateur->id)
            <input type="hidden" class="form-control" id="code_utilisateur"   value="{{old('name',$utilisateur->name)}}" name="name" >
        @endif

        <div class="alert alert-danger text-center col-sm-6 " id="erreur_name" style="display: none"></div>

    </div>
    <div class="form-group">
        <label for="email"><strong>mail :</strong></label>
        <input type="text"  class="form-control" id="email" name="email" placeholder="E-mail" value="{{old('email',$utilisateur->email)}}" maxlength="100">
        <div class="alert alert-danger text-center col-sm-6 " id="erreur_email" style="display: none"></div>
    </div>

    @if($utilisateur->two_factor_secret)

    <div class="mt-4 p-2 inline-block bg-white">
        {!! $utilisateur->twoFactorQrCodeSvg() !!}
    </div>
        {{ decrypt($utilisateur->two_factor_secret) }}
    @endif
    @if($utilisateur->two_factor_recovery_codes)
    <div class="grid gap-1 max-w-xl mt-4 px-4 py-4 font-mono text-sm bg-gray-100 rounded-lg">
        @foreach (json_decode(decrypt($utilisateur->two_factor_recovery_codes), true) as $code)
            <div>{{ $code }}</div>
        @endforeach
    </div>
    @endif
    @if(!$utilisateur->id)
{{--        {{dd($utilisateur)}}--}}
        <div class="form-group">
            <label for="password"><strong>mot de passe :</strong></label>
            <input type="password"  class="form-control" id="password" name="password" placeholder="Mot de passe" value="{{old('password')}}" >

        </div>
        <div class="form-group">
            <label for="password_confirmation"><strong>Confirmation  :</strong></label>
            <input type="password"  class="form-control" id="password_confirmation" name="password_confirmation" placeholder="Mot de passe" value="{{old('password')}}" >

        </div>

    @endif

    <div class="col-md-12 text-center">
        <button class="btn btn-success" id="reset">Nouveau</button>
        <button class="btn btn-success " type="submit">Valider</button>
        <button class="btn btn-success" id="supp_utilisateur">Supprimer</button>
        <button class="btn btn-success" >Traçabilité</button>
    </div>


    <div class="container">
        <h2>Welcome {{ $utilisateur->name }}</h2>


            @if($utilisateur->two_factor_secret)
                Two factor authentication is enabled.
                <h3>QR Code for authenticator applications</h3>
                <div class="pt-5 pb-5">
                    {!!  $utilisateur->twoFactorQrCodeSvg() !!}
                </div>
                <h3>Recovery codes</h3>
                <ul>
                    @foreach($utilisateur->recoveryCodes() as $code)
                        <li>{{ $code }}</li>
                    @endforeach
                </ul>

                <button class="btn btn-danger">Disable</button>
            @else
                Two factor authentication is not enabled.
                <button class="btn btn-primary" id="activer_double_autentification">Enable</button>
            @endif

    </div>

</form>


    @if ($utilisateur->id && $utilisateur->id==$utilisateur_connecte->id)
        <form id="formulaire_modifier_mot_de_passe">
            @csrf
            <div class="form-group">
                <label for="current_password"><strong>Mot de passe actuel :</strong></label>
                <input type="password"  class="form-control" id="current_password" name="current_password" placeholder="Mot de passe actuel" value="{{old('current_password')}}" >

            </div>
            <div class="form-group">
                <label for="password"><strong>Nouveau mot de passe  :</strong></label>
                <div class="input-group">

                <input type="password"  class="form-control" id="password" name="password" placeholder="nouveau mot de passe" value="{{old('password')}}" >
                    <span class="input-group-text">

                        <i id="toggle-password" class="fa fa-eye" style="cursor: pointer;"> </i>
                    </span>
                </div>

            </div>
            <div class="form-group">
                <label for="password_confirmation"><strong>Nouveau mot de passe  :</strong></label>
                <input type="password"  class="form-control" id="password_confirmation" name="password_confirmation" placeholder=" Confirmation nouveau mot de passe" value="{{old('password')}}" >

            </div>
            <button type="submit" class="btn btn-success" >Modifier mot de passe</button>
        </form>
    @endif



<script >
    $(function() { // Dom ready
        $("#reset").click(function(e) {
            e.preventDefault();
            $(".ajouter_utilisateur").click();
            {{--window.location.href = '{{url('utilisateur/creer')}}';--}}
        });
        $("#name").change(function(e) {
            e.preventDefault();

            function reponse(retour) {
                if (!$.isEmptyObject(retour)) {

                    $("#affiche_utilisateur").empty();
                    $("#affiche_utilisateur").html(retour);

                    {{--window.location.href = '{{url('utilisateur')}}/'+retour.id_utilisateur+'/modifier';--}}
                }

            }

            $.post('{{url('utilisateur/chercher_element')}}',{utilisateur_code:$("#name").val(),_token: '{{ csrf_token() }}'} ,reponse, 'html');

        });
        $("#formulaire_utilisateur").submit(function(e) {
            e.preventDefault();
            var id_utilisateur=$("#utilisateur_id").val();
            var formulaire=$(this).serialize();
            $(this).find(":input").removeClass("is-invalid");
            var url='{{url('utilisateur/enregistrer')}}';
            function reponse(retour) {
                if (retour.success){
                    $('#message').html(retour.message).show();

                    setTimeout(function() {
                        $('#message').hide();
                        $('#filtre').click();
                        $('#rafraichir').click();
                    }, 3000);


                }else{

                    errors = retour.errors;
                    var champ_invalid = Object.keys(errors)[0];
                    $("#"+champ_invalid).focus().addClass('is-invalid');
                    $("#message_base_erreur").html(errors[champ_invalid][0]);
                    $("#message_base_erreur").show();
                    setTimeout(function() {
                        $('#message_base_erreur').hide();
                    }, 3000);
                }

            }

            $.post(url,formulaire ,reponse, 'json');
        });
        //////////////////////
        $("#formulaire_modifier_mot_de_passe").submit(function(e) {
            e.preventDefault();
            // var id_utilisateur=$("#utilisateur_id").val();
            var formulaire=$(this).serialize();
            // $(this).find(":input").removeClass("is-invalid");
            var url='{{url('utilisateur/modifier_mot_de_passe')}}';


            function reponse(retour) {

                console.log(retour);
                // if (retour.success){
                //     $('#message').html(retour.message).show();
                //
                //     setTimeout(function() {
                //         $('#message').hide();
                //         $('#filtre').click();
                //         $('#rafraichir').click();
                //     }, 3000);
                //
                //
                // }else{
                //
                //     errors = retour.errors;
                //     var champ_invalid = Object.keys(errors)[0];
                //     $("#"+champ_invalid).focus().addClass('is-invalid');
                //     $("#message_base_erreur").html(errors[champ_invalid][0]);
                //     $("#message_base_erreur").show();
                //     setTimeout(function() {
                //         $('#message_base_erreur').hide();
                //     }, 3000);
                // }

            }

            $.post(url,formulaire ,reponse, 'json');
        });



        /////////////////////
        $("#supp_utilisateur").click(function(e) {
            e.preventDefault();
            var id_utilisateur=$("#utilisateur_id").val();

            if (confirm("Êtes-vous sûr(e)?")) {
                function reponse(retour) {
                    $("#message_base_supprimer").html(retour.message);
                    $("#message_base_supprimer").show();
                    setTimeout(function() {
                        $('#message_base_supprimer').hide();
                    }, 3000);
                    if (retour.success) {
                        setTimeout(function() {
                            $('#filtre').click();
                        }, 3000);
                        setTimeout(function() {
                            $('#rafraichir').click();
                        }, 3000);


                    }

                }
                $.ajax({
                    url: '{{url('utilisateur')}}/' + id_utilisateur + '/supprimer',
                    method: 'DELETE',
                    data: {
                        _token: '{{ csrf_token() }}' // Assurez-vous d'inclure le jeton CSRF pour les requêtes DELETE
                    },
                    success: function(response) {
                        // Traitement de la réponse retournée par le serveur
                        reponse(response)
                    },
                    error: function(xhr, status, error) {
                        // Gestion des erreurs
                        console.error(error);
                    }
                })
            }

        });

        $("#activer_double_autentification").click(function(e) {
            e.preventDefault();
            var id_utilisateur=$("#utilisateur_id").val();

            // if (confirm("Êtes-vous sûr(e)?")) {
                function reponse(retour) {
                    console.log(retour)
                    $("#message_base_supprimer").html(retour.message);
                    $("#message_base_supprimer").show();
                    setTimeout(function() {
                        $('#message_base_supprimer').hide();
                    }, 3000);
                    if (retour.success) {
                        setTimeout(function() {
                            $('#filtre').click();
                        }, 3000);
                        setTimeout(function() {
                            $('#rafraichir').click();
                        }, 3000);


                    }

                }
                $.ajax({
                    url: '{{url('user/two-factor-authentication')}}',
                    method: 'POST',
                    data: {
                        _token: '{{ csrf_token() }}', // Assurez-vous d'inclure le jeton CSRF pour les requêtes DELETE
                    },
                    success: function(response) {
                        console.log(response)
                        // Traitement de la réponse retournée par le serveur
                        // reponse(response)
                    },
                    error: function(xhr, status, error) {
                        // Gestion des erreurs
                        console.error(error);
                    }
                })
            // }

        });


    });//Fin dom ready
</script>