@extends('user.base')

@section('title', "S'enregistrer")


@section('content')

    <div class="myd">

        <!-- Our LogIn Register -->
        <section class="our-log bgc-fa">
            <div class="container">
                <div class="row">
                    <div class="col-lg-5 col-xl-5 mt50">
                        <div class="login_thumb">
                            <img class="img-fluid w100" src="{{asset('assets/images/eudimmo/agence-registerpage-1.png')}}" alt="login.jpg">
                        </div>
                    </div>
                    <div class="col-sm-12 col-lg-7 col-xl-7 mt10">
                        <div class="login_form inner_page">
                            @include('admin.shared.flash')

                            <form action="{{route('adminag.register')}}" method="POST" enctype="multipart/form-data">
                                @csrf

                                <div class="my_dashboard_review mb10 form-step form-step-active">
                                    <div class="row d-none d-lg-flex">
                                        <div class="col-lg-4"></div>
                                        <img class=" col-lg-4 heading-img" src="{{asset('assets/images/eudimmo-logo2.png')}}" alt="Eudimmo logo">
                                    </div>
                                    <div class="heading">
                                        <h3 class="text-center">Enregistrer votre Agence</h3>
                                        <p class="text-center">Renseignez vos informations votre agence. <br>ou <br>Vous avez déjà un compte? <a class="text-thm" href="{{route('adminag.login')}}">Se Connecter !</a></p>
                                    </div>

                                    <div class="mt-10">
                                        @include('admin.shared.input', ['label'=>'Raison Sociale','name'=>'raisonSociale', 'placeholder'=>'Nom de votre Agence'])
                                    </div>

                                    <div class="mt0">
                                        @include('admin.shared.input', ['label'=>'Numero RCCM','name'=>'numRCCM', 'placeholder'=>'Votre Identifiant du Registre de Commerce et de Crédit Mobilier'])
                                    </div>

                                    <div class="mt0">
                                        @include('admin.shared.input', ['name'=>'adresse', 'placeholder'=>'L\'adresse de votre agence'])
                                    </div>
                                    <div class="mt0">
                                        @include('admin.shared.input', ['name'=>'emailagence', 'label'=>'Email', 'placeholder'=>'L\'email de votre agence'])
                                    </div>
                                    <div class="mt0">
                                        @include('admin.shared.input', ['label'=>'Téléphone', 'type'=>'phone', 'name'=>'numTel', 'placeholder'=>'Le numéro de Téléphone de votre agence'])
                                    </div>
                                    {{-- <div class="mt0">
                                        @include('admin.shared.select', ['label'=> 'Quartier', 'class'=> 'my_profile_setting_input', 'name'=>'quartier_id', 'options'=> $quartiers])
                                    </div> --}}
                                    <div class="mt0">
                                        @include('admin.shared.input', ['label'=> 'Quartier', 'class'=> 'my_profile_setting_input', 'name'=>'quartierprop', 'placeholder'=>'Le quartier de votre agence'])
                                    </div>
                                    <div class="mt0">
                                        @include('admin.shared.select', ['label'=> 'Ville', 'class'=> 'my_profile_setting_input', 'name'=>'ville_id', 'options'=> $villes])
                                    </div>

                                    <div class="my_profile_setting_input-authp mt50 mb80">
                                        <!--<span class="btn btn1 pt15 float-left">Retour</span>-->
                                        <span class="btn btn2 pt15 float-right">Suivant</span>
                                    </div>
                                </div>


                                <div class="my_dashboard_review mt20 form-step">

                                        <div class="heading">
                                            <h3 class="text-center">Informations du Représentant</h3>
                                            <p class="text-center">Renseignez vos informations personelles. Nous allons vous créer un compte d'administrateur d'agence <a class="text-thm" href="{{route('adminag.login')}}"></a></p>
                                        </div>
                                        <h5 class="text-left mt-10"><b>Informations Personnelles</b></h5>

                                        <div class="mt0">
                                            @include('admin.shared.input', ['name'=>'nom', 'placeholder'=>'Nom'])
                                        </div>
                                        <div class="mt0">
                                            @include('admin.shared.input', ['name'=>'prenoms', 'placeholder'=>'Prénoms'])
                                        </div>
                                        <div class="mt0">
                                            @include('admin.shared.input', ['type'=>'date', 'name'=>'dateNaiss', 'label'=>'Date de Naissance', 'placeholder'=>''])
                                        </div>
                                        <div class="mt0">
                                            @include('admin.shared.input', ['type'=>'email', 'name'=>'email', 'placeholder'=>'Votre adresse Email. Ce sera votre mail d\'authentification'])
                                        </div>
                                        <div class="mt0">
                                            @include('admin.shared.input', ['type'=>'password', 'name'=>'password', 'label'=>'Mot de Passe', 'placeholder'=>'Mot de Passe'])
                                        </div>

                                        <div class="mt0">
                                            @include('admin.shared.input', ['type'=>'password', 'name'=>'password_confirmation', 'label'=>'Confirmer le mot de passe', 'placeholder'=>'Confirmer le mot de Passe'])
                                        </div>
                                        
                                        {{-- <div class="form-group custom-control custom-checkbox">
                                            <input type="checkbox" class="custom-control-input" id="exampleCheck3">
                                            <label class="custom-control-label" for="exampleCheck3">J'ai lu et accepté <a class="tdu btn-fpswd" href="#">les termes et conditions</a></label>
                                        </div> --}}

                                        <div class="my_profile_setting_input-authp mt50 mb80">
                                            <span class="btn btn1 pt15 float-left">Retour</span>
                                            <span class="btn btn2 pt15 float-right">Suivant</span>
                                            {{-- <button type="submit" class="btn btn2 float-right">S'enregistrer</button> --}}
                                        </div>

                                </div>

                                <div class="my_dashboard_review mt20 form-step">

                                    <div class="heading">
                                        <h3 class="text-center">Informations du Représentant</h3>
                                        <p class="text-center">Renseignez vos informations personelles. Nous allons vous créer un compte d'administrateur d'agence <a class="text-thm" href="{{route('adminag.login')}}"></a></p>
                                    </div>
                                    <h5 class="text-left mt-10"><b>KYC: Partie 1</b></h5>

                                    <div class="row mt10">

                                        <div class="col-lg-6 col-xl-6">
                                            @include('admin.shared.input', ['class'=> 'my_profile_setting_input', 'name'=>'numCni', 'label'=>'Numéro CNI',])
                                        </div>

                                        <div class="col-lg-6 col-xl-6">
                                            @include('admin.shared.input', ['type'=>'date', 'class'=> 'my_profile_setting_input', 'name'=>'dateDelivranceCni', 'label'=>'Date de Délivrance CNI', 'min'=>'2020-12-31', 'required'=>true])
                                        </div>

                                        <div class="col-lg-6 col-xl-6">
                                            @include('admin.shared.input', ['type'=>'date', 'class'=> 'my_profile_setting_input', 'name'=>'dateExpirationCni', 'label'=>'Date d\'Expiration CNI', 'max'=>'2031-12-31', 'required'=>true])
                                        </div>

                                        <div class="col-lg-6 col-xl-6">
                                            @include('admin.shared.input', ['class'=> 'my_profile_setting_input', 'name'=>'lieuDelivranceCni', 'label'=>'Lieu de Délivrance CNI',])
                                        </div>
                                    </div>

                                    <div class="row mt-4">
                                        <div class="col-lg-12 mb30">
                                            <small>Veuillez ajouter les photos recto-verso de votre CNI.</small>
                                            <div id="ImgPreviewContainer" class="d-flex flex-wrap gap-3 mb20"></div>
                                        </div>

                                        <div class="col-lg-12 mb10">
                                            <div class="upload_file_input_add_remove mb-4">
                                                {{--<label for="imag" class="form-label fw-bold">Ajouter des images</label>--}}
                                                <span class="btn_upload"><input type="file" id="imag" name="cni[]" multiple accept="image/*" class="form-control input-img @error('images') is-invalid @enderror" style="height: 150px"><span class="flaticon-download "></span></span>
                                                @error('images')
                                                    <span class="text-danger"> {{$message}} </span>
                                                @enderror                                                    
                                            </div>

                                            <small class="text-muted">Taille maximale par fichier : 5 Mo</small>
                                        </div>
                                    </div>

                                    <div class="my_profile_setting_input-authp mt50 mb80">
                                        <span class="btn btn1 pt15 float-left">Retour</span>
                                        <span class="btn btn2 pt15 float-right">Suivant</span>
                                        {{-- <button type="submit" class="btn btn2 float-right">S'enregistrer</button> --}}
                                    </div>

                                </div>


                                <div class="my_dashboard_review mt20 form-step">
                                    <div class="heading">
                                        <h3 class="text-center">Informations du Représentant</h3>
                                        <p class="text-center">Renseignez vos informations personelles. Nous allons vous créer un compte d'administrateur d'agence <a class="text-thm" href="{{route('adminag.login')}}"></a></p>
                                    </div>
                                    <h5 class="text-left mt-10"><b>KYC: Partie 2</b></h5>

                                    <div class="row">

                                        <div class="col-lg-6 col-xl-6">
                                            @include('admin.shared.input', ['class'=> 'my_profile_setting_input', 'name'=>'formation', 'label'=>'Formation',])
                                        </div>

                                        <div class="col-lg-6 col-xl-6">
                                            @include('admin.shared.input', ['class'=> 'my_profile_setting_input', 'name'=>'diplome', 'label'=>'Diplôme',])
                                        </div>

                                        <div class="col-lg-6 col-xl-6">
                                            @include('admin.shared.input', ['class'=> 'my_profile_setting_input', 'name'=>'numTel2', 'label'=>'Numéro Whatsapp'])
                                        </div>
                                        
                                        <div class="col-xl-12">
                                            <div class="resume_uploader mb30">
                                                <h4>Diplôme en document</h4>
                                                <form class="form-inline">
                                                    <input class="upload-path form-control" id="fichier_path" name="fichier_path" readonly placeholder="Aucun fichier sélectionné">

                                                    <script>
                                                        document.addEventListener('DOMContentLoaded', function () {
                                                            const fileInput = document.querySelector('input[type="file"]#fichier');
                                                            const pathInput = document.getElementById('fichier_path');
                                                            if (!fileInput || !pathInput) return;

                                                            fileInput.addEventListener('change', function () {
                                                                // For security reasons browsers don't expose full local paths — show file names instead
                                                                const names = Array.from(this.files).map(f => f.name).join(', ');
                                                                pathInput.value = names || 'Aucun fichier sélectionné';
                                                            });
                                                        });
                                                    </script>
                                                    <label class="upload">
                                                        <input type="file" id="fichier" name="fichier" class="upload_file_input" multiple onchange="previewImages()" >
                                                        Ajouter un fichier
                                                    </label>
                                                </form>
                                            </div>
                                        </div>

                                    </div>
                                    
                                    <div class="form-group custom-control custom-checkbox">
                                        <input type="checkbox" class="custom-control-input" id="exampleCheck3" required>
                                        <label class="custom-control-label" for="exampleCheck3">J'ai lu et accepté <a class="tdu btn-fpswd" href="{{route('page.politique-confidentialite')}}">la politique de confidentialité</a></label>
                                    </div>

                                    <div class="my_profile_setting_input-authp mt50 mb80">
                                        <span class="btn btn1 pt15 float-left">Retour</span>
                                        {{-- <span class="btn btn2 pt15 float-right">Suivant</span> --}}
                                        <button type="submit" class="btn btn2 float-right">S'enregistrer</button>
                                    </div>

                                </div>
                                
                            </form>

                            {{--<div class="row mt20 actopt">
                                <div class="col-lg-12 mt20">
                                    <div class="start_partner text-center tac-smd">
                                        <h2>Vous êtes plutôt un Administrateur d'agence ?</h2>
                                        <p>Connectez vous à votre compte administrateur</p>
                                    </div>
                                </div>
                                <div class="col-lg-12 mt20 mb20">
                                    <div class="parner_reg_btn text-center tac-smd">
                                        <a class="btn btn-thm2" href="#">Se Connecter</a>
                                    </div>
                                </div>
                            </div>--}}

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

        <!-- Start Partners -->
        {{--<section class="start-partners bgc-thm pt50 pb50">
            <div class="container">
                <div class="row">
                    <div class="col-lg-8">
                        <div class="start_partner tac-smd">
                            <h2>Become a Real Estate Agent</h2>
                            <p>We only work with the best companies around the globe</p>
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <div class="parner_reg_btn text-right tac-smd">
                            <a class="btn btn-thm2" href="#">Register Now</a>
                        </div>
                    </div>
                </div>
            </div>
        </section>--}}

    </div>



    
@endsection