@extends('admin')

@section('title')
    NotaireApp - Créer Nouveau Dossier
@endsection


@section('content')
@section('menu-title')
    <!-- BEGIN: Breadcrumb -->
    <div class="-intro-x breadcrumb mr-auto hidden sm:flex"> <a href="{{ url('/admin') }}" class="">NotairesApp</a> <i
            data-feather="chevron-right" class="breadcrumb__icon"></i> <a href="#/" class="breadcrumb--active">Créer un
            nouveau dossier</a> </div>
    <!-- END: Breadcrumb -->
@endsection

<div class="intro-y flex items-center mt-8">
    <h2 class="text-lg font-medium mr-auto">
        Créer Un Nouveau Dossier
    </h2>
</div>

<form method="post" action="" id="fileinfo" enctype="multipart/form-data">
    @csrf
    <div class="grid grid-cols-12 gap-6 mt-5">

        <div class="intro-y col-span-12 lg:col-span-6">

            <!-- BEGIN: Vertical Form -->
            <div class="intro-y box mb-3 p-3">
                {{-- <div class="flex flex-col sm:flex-row items-center p-5 border-b border-gray-200 dark:border-dark-5">
                    <h2 class="font-medium text-base mr-auto">
                        Ajouter une propriéte
                    </h2>
                </div> --}}
                <div>
                    <label for=""> Type du dossier </label>
                    <select type="text" class="input w-full mt-2 border-2 type_dossier" name="type_dossier">
                        <option value="0">Sélectionner un type</option>
                        <option value="Immobiliers">Immobilier</option>
                        <option value="Non immobiliers">Non Immobilier</option>
                    </select>
                </div>
                <div class="my-3 ">
                    <label for=""> Nom du dossier </label>
                    <input type="text" class="input w-full mt-2 border-2 nom_dossier"
                        placeholder="Entrer un nom du dossier" name="nom_dossier">
                </div>
                <div>
                    <div class="">
                        <label> Nature d'opération </label>
                        <div class="sm:mt-2">
                            <select class="input w-full mt-2 border-2" name="nature_doperation">
                                @foreach ($nature_operations as $no)
                                    <option value="{{ $no->id_operation }}">{{ $no->nature_doperation }}
                                    </option>
                                @endforeach
                            </select>
                            <div class="help-block form-text with-errors form-control-feedback">
                            </div>
                        </div>
                    </div>
                </div>

            </div>
            <!-- BEGIN: Input -->

            <div class="intro-y box p-5">


                <div class="my-3">
                    <div class="">
                        <div class="">
                            <label for=""> N°Dossier </label>
                            <input class="input w-full  mt-2 border-2 @error('num_dossier') is-invalid @enderror"
                                name="num_dossier" placeholder="N° Dossier " required="required" type="text">
                            @error('num_dossier')
                                <div style="padding:6px 0px; color:#721c24;">
                                    Ce numéro de dossier est déjà existe
                                </div>
                            @enderror

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

                <div class="my-3 hidden">
                    <div class="">
                        <div class="">
                            <label for="">N°Affaire </label>
                            <input class="input w-full  mt-2 border-2" name="num_affaire" placeholder="N° Affaire"
                                type="text">

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

                <div class="my-3">
                    <div class="">
                        <div class="">
                            <label for="">N°Répertoire </label>
                            <input class="input w-full  mt-2 border-2" name="num_repertoire" placeholder="N° Répertoire"
                                type="text">

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

                <div class="my-3">
                    <div class="">
                        <div class="">
                            <label for="">Date </label>
                            <input class="input w-full  mt-2 border-2" name="date_dossier" placeholder="Date"
                                required="required" type="date" value="2024-11-13">
                        </div>
                    </div>
                </div>


                <div class="Form_imob ">
                    <div class="mt-4" style="display: flex;"> <label>Mainlevée :</label>
                        <div class="flex flex-col sm:flex-row mt-2" style="margin-top: auto;margin-left: 50px;">
                            <div class="flex items-center text-gray-700 dark:text-gray-500 mr-2"> 
                                <input type="radio" onchange  = "hide_if_input_not_checked(this)"
                                    class="input border mr-2" id="horizontal-radio-chris-evans" name="mainlevee"
                                    value="1"> <label class="cursor-pointer select-none"
                                    for="horizontal-radio-chris-evans">Oui</label> </div>
                            <div class="flex items-center text-gray-700 dark:text-gray-500 mr-2 mt-2 sm:mt-0">
                                <input onchange  = "hide_if_input_not_checked(this)" type="radio" class="input border mr-2" id="horizontal-radio-liam-neeson"
                                    name="mainlevee" value="0" checked> <label class="cursor-pointer select-none"
                                    for="horizontal-radio-liam-neeson">Non</label>
                            </div>
                            <div class=" hidden">

                                {{-- <div class="p-5" id="horizontal-form"> --}}
                                {{-- <div class="preview"> --}}
                                <div class="flex flex-col sm:flex-row items-center">
                                    <select class="input w-full  border-2" name="etat_etape_mainlevee">
                                        @foreach ($etapes as $etape)
                                            <option value="{{ $etape->id }}">{{ $etape->nom }}
                                            </option>
                                        @endforeach
                                    </select>
                                    {{-- </div> --}}

                                    {{-- </div> --}}
                                    <div class="source-code hidden">
                                        <button data-target="#copy-horizontal-form"
                                            class="copy-code button button--sm border flex items-center text-gray-700 dark:border-dark-5 dark:text-gray-300">
                                            <i data-feather="file" class="w-4 h-4 "></i> Copy example code </button>
                                        <div class="overflow-y-auto h-64 ">
                                            <pre class="source-preview" id="copy-horizontal-form"> <code class="text-xs p-0 rounded-md html pl-5 pt-8 pb-4 -mb-10 -mt-10"> HTMLOpenTagdiv class=&quot;flex flex-col sm:flex-row items-center&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;w-full sm:w-20 sm:text-right sm:mr-5&quot;HTMLCloseTagEmailHTMLOpenTag/labelHTMLCloseTag HTMLOpenTaginput type=&quot;email&quot; class=&quot;input w-full border mt-2 flex-1&quot; placeholder=&quot;example@gmail.com&quot;HTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;flex flex-col sm:flex-row items-center mt-3&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;w-full sm:w-20 sm:text-right sm:mr-5&quot;HTMLCloseTagPasswordHTMLOpenTag/labelHTMLCloseTag HTMLOpenTaginput type=&quot;password&quot; class=&quot;input w-full border mt-2 flex-1&quot; placeholder=&quot;secret&quot;HTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;flex items-center text-gray-700 dark:text-gray-500 mt-5 sm:ml-20 sm:pl-5&quot;HTMLCloseTag HTMLOpenTaginput type=&quot;checkbox&quot; class=&quot;input border mr-2&quot; id=&quot;horizontal-remember-me&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;cursor-pointer select-none&quot; for=&quot;horizontal-remember-me&quot;HTMLCloseTagRemember meHTMLOpenTag/labelHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;sm:ml-20 sm:pl-5 mt-5&quot;HTMLCloseTag HTMLOpenTagbutton type=&quot;button&quot; class=&quot;button bg-theme-1 text-white&quot;HTMLCloseTagLoginHTMLOpenTag/buttonHTMLCloseTag HTMLOpenTag/divHTMLCloseTag </code> </pre>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>

                    <div class="mt-3" style="display: flex;"> <label>Quitu fiscal :</label>
                        <div class="flex flex-col sm:flex-row mt-2" style="margin-top: auto;margin-left: 42px;">
                            <div class="flex items-center text-gray-700 dark:text-gray-500 mr-2">
                                <input onchange  = "hide_if_input_not_checked(this)" type="radio"
                                    class="input border mr-2" id="horizontal-radio-chris-evans" name="qfiscale"
                                    value="1"> <label class="cursor-pointer select-none"
                                    for="horizontal-radio-chris-evans">Oui</label> </div>
                            <div class="flex items-center text-gray-700 dark:text-gray-500 mr-2 mt-2 sm:mt-0">
                                <input onchange  = "hide_if_input_not_checked(this)" type="radio" class="input border mr-2" id="horizontal-radio-liam-neeson"
                                    name="qfiscale" value="0" checked> <label class="cursor-pointer select-none"
                                    for="horizontal-radio-liam-neeson">Non</label>
                            </div>
                            <div class=" hidden">

                                {{-- <div class="p-5" id="horizontal-form"> --}}
                                {{-- <div class="preview"> --}}
                                <div class="flex flex-col sm:flex-row items-center">
                                    <select class="input w-full  border-2" name="etat_etape_qfiscale">
                                        @foreach ($etapes as $etape)
                                            <option value="{{ $etape->id }}">{{ $etape->nom }}
                                            </option>
                                        @endforeach
                                    </select>
                                    {{-- </div> --}}

                                    {{-- </div> --}}
                                    <div class="source-code hidden">
                                        <button data-target="#copy-horizontal-form"
                                            class="copy-code button button--sm border flex items-center text-gray-700 dark:border-dark-5 dark:text-gray-300">
                                            <i data-feather="file" class="w-4 h-4 "></i> Copy example code </button>
                                        <div class="overflow-y-auto h-64 ">
                                            <pre class="source-preview" id="copy-horizontal-form"> <code class="text-xs p-0 rounded-md html pl-5 pt-8 pb-4 -mb-10 -mt-10"> HTMLOpenTagdiv class=&quot;flex flex-col sm:flex-row items-center&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;w-full sm:w-20 sm:text-right sm:mr-5&quot;HTMLCloseTagEmailHTMLOpenTag/labelHTMLCloseTag HTMLOpenTaginput type=&quot;email&quot; class=&quot;input w-full border mt-2 flex-1&quot; placeholder=&quot;example@gmail.com&quot;HTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;flex flex-col sm:flex-row items-center mt-3&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;w-full sm:w-20 sm:text-right sm:mr-5&quot;HTMLCloseTagPasswordHTMLOpenTag/labelHTMLCloseTag HTMLOpenTaginput type=&quot;password&quot; class=&quot;input w-full border mt-2 flex-1&quot; placeholder=&quot;secret&quot;HTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;flex items-center text-gray-700 dark:text-gray-500 mt-5 sm:ml-20 sm:pl-5&quot;HTMLCloseTag HTMLOpenTaginput type=&quot;checkbox&quot; class=&quot;input border mr-2&quot; id=&quot;horizontal-remember-me&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;cursor-pointer select-none&quot; for=&quot;horizontal-remember-me&quot;HTMLCloseTagRemember meHTMLOpenTag/labelHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;sm:ml-20 sm:pl-5 mt-5&quot;HTMLCloseTag HTMLOpenTagbutton type=&quot;button&quot; class=&quot;button bg-theme-1 text-white&quot;HTMLCloseTagLoginHTMLOpenTag/buttonHTMLCloseTag HTMLOpenTag/divHTMLCloseTag </code> </pre>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>


                    <div class="mt-3" style="display: flex;"> <label> Hypothèque :</label>
                        <div class="flex flex-col sm:flex-row mt-2" style="margin-top: auto;margin-left: 37px;">
                            <div class="flex items-center text-gray-700 dark:text-gray-500 mr-2"> 
                                <input onchange  = "hide_if_input_not_checked(this)" type="radio"
                                    class="input border mr-2" id="horizontal-radio-chris-evans" name="hypotheque"
                                    value="1">
                                <label class="cursor-pointer select-none"
                                    for="horizontal-radio-chris-evans">Oui</label>
                            </div>
                            <div class="flex items-center text-gray-700 dark:text-gray-500 mr-2 mt-2 sm:mt-0">
                                <input onchange  = "hide_if_input_not_checked(this)" type="radio" class="input border mr-2" id="horizontal-radio-liam-neeson"
                                    name="hypotheque" value="0" checked>
                                <label class="cursor-pointer select-none"
                                    for="horizontal-radio-liam-neeson">Non</label>
                            </div>
                            <div class="hidden ">

                                {{-- <div class="p-5" id="horizontal-form"> --}}
                                {{-- <div class="preview"> --}}
                                <div class="flex flex-col sm:flex-row items-center">
                                    <select class="input w-full  border-2" name="etat_etape_hypotheque">
                                        @foreach ($etapes as $etape)
                                            <option value="{{ $etape->id }}">{{ $etape->nom }}
                                            </option>
                                        @endforeach
                                    </select>
                                    {{-- </div> --}}

                                    {{-- </div> --}}
                                    <div class="source-code hidden">
                                        <button data-target="#copy-horizontal-form"
                                            class="copy-code button button--sm border flex items-center text-gray-700 dark:border-dark-5 dark:text-gray-300">
                                            <i data-feather="file" class="w-4 h-4 "></i> Copy example code </button>
                                        <div class="overflow-y-auto h-64 ">
                                            <pre class="source-preview" id="copy-horizontal-form"> <code class="text-xs p-0 rounded-md html pl-5 pt-8 pb-4 -mb-10 -mt-10"> HTMLOpenTagdiv 
                                                class=&quot;flex flex-col sm:flex-row items-center&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;w-full sm:w-20 sm:text-right sm:mr-5&quot;HTMLCloseTagEmailHTMLOpenTag/labelHTMLCloseTag HTMLOpenTaginput type=&quot;email&quot; class=&quot;input w-full border mt-2 flex-1&quot; placeholder=&quot;example@gmail.com&quot;HTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;flex flex-col sm:flex-row items-center mt-3&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;w-full sm:w-20 sm:text-right sm:mr-5&quot;HTMLCloseTagPasswordHTMLOpenTag/labelHTMLCloseTag HTMLOpenTaginput type=&quot;password&quot; class=&quot;input w-full border mt-2 flex-1&quot; placeholder=&quot;secret&quot;HTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;flex items-center text-gray-700 dark:text-gray-500 mt-5 sm:ml-20 sm:pl-5&quot;HTMLCloseTag HTMLOpenTaginput type=&quot;checkbox&quot; class=&quot;input border mr-2&quot; id=&quot;horizontal-remember-me&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;cursor-pointer select-none&quot; for=&quot;horizontal-remember-me&quot;HTMLCloseTagRemember meHTMLOpenTag/labelHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;sm:ml-20 sm:pl-5 mt-5&quot;HTMLCloseTag HTMLOpenTagbutton type=&quot;button&quot; class=&quot;button bg-theme-1 text-white&quot;HTMLCloseTagLoginHTMLOpenTag/buttonHTMLCloseTag HTMLOpenTag/divHTMLCloseTag </code> </pre>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="mt-3" style="display: flex;"> <label> Crédit :</label>
                        <div class="flex flex-col sm:flex-row mt-2" style="margin-top: auto;margin-left: 76px;">
                            <div class="flex items-center text-gray-700 dark:text-gray-500 mr-2">
                                <input onchange  = "hide_if_input_not_checked(this)"  type="radio"
                                    class="input border mr-2 credit" id="horizontal-radio-chris-evans" name="credit"
                                    value="1"> <label class="cursor-pointer select-none"
                                    for="horizontal-radio-chris-evans">Oui</label> </div>
                            <div class="flex items-center text-gray-700 dark:text-gray-500 mr-2 mt-2 sm:mt-0">
                                <input onchange  = "hide_if_input_not_checked(this)" type="radio" class="input border mr-2 credit"
                                    id="horizontal-radio-liam-neeson" name="credit" value="0" checked> <label
                                    class="cursor-pointer select-none" for="horizontal-radio-liam-neeson">Non</label>
                            </div>
                            <div class="hidden ">

                                {{-- <div class="p-5" id="horizontal-form"> --}}
                                {{-- <div class="preview"> --}}
                                <div class="flex flex-col sm:flex-row items-center">
                                    <select class="input w-full  border-2" name="etat_etape_credit">
                                        @foreach ($etapes as $etape)
                                            <option value="{{ $etape->id }}">{{ $etape->nom }}
                                            </option>
                                        @endforeach
                                    </select>
                                    {{-- </div> --}}

                                    {{-- </div> --}}
                                    <div class="source-code hidden">
                                        <button data-target="#copy-horizontal-form"
                                            class="copy-code button button--sm border flex items-center text-gray-700 dark:border-dark-5 dark:text-gray-300">
                                            <i data-feather="file" class="w-4 h-4 "></i> Copy example code </button>
                                        <div class="overflow-y-auto h-64 ">
                                            <pre class="source-preview" id="copy-horizontal-form"> <code class="text-xs p-0 rounded-md html pl-5 pt-8 pb-4 -mb-10 -mt-10"> HTMLOpenTagdiv class=&quot;flex flex-col sm:flex-row items-center&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;w-full sm:w-20 sm:text-right sm:mr-5&quot;HTMLCloseTagEmailHTMLOpenTag/labelHTMLCloseTag HTMLOpenTaginput type=&quot;email&quot; class=&quot;input w-full border mt-2 flex-1&quot; placeholder=&quot;example@gmail.com&quot;HTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;flex flex-col sm:flex-row items-center mt-3&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;w-full sm:w-20 sm:text-right sm:mr-5&quot;HTMLCloseTagPasswordHTMLOpenTag/labelHTMLCloseTag HTMLOpenTaginput type=&quot;password&quot; class=&quot;input w-full border mt-2 flex-1&quot; placeholder=&quot;secret&quot;HTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;flex items-center text-gray-700 dark:text-gray-500 mt-5 sm:ml-20 sm:pl-5&quot;HTMLCloseTag HTMLOpenTaginput type=&quot;checkbox&quot; class=&quot;input border mr-2&quot; id=&quot;horizontal-remember-me&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;cursor-pointer select-none&quot; for=&quot;horizontal-remember-me&quot;HTMLCloseTagRemember meHTMLOpenTag/labelHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;sm:ml-20 sm:pl-5 mt-5&quot;HTMLCloseTag HTMLOpenTagbutton type=&quot;button&quot; class=&quot;button bg-theme-1 text-white&quot;HTMLCloseTagLoginHTMLOpenTag/buttonHTMLCloseTag HTMLOpenTag/divHTMLCloseTag </code> </pre>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <br>

                    <div class="flex flex-col w-full mx-2" id="divavec" style="display: none;">
                        <label>Compte bancaire</label>
                        <select required class="input w-full mt-2 border-2" name="id_compt">
                            <option value="0" selected>Séléctionner un compte</option>
                            @foreach ($cmpt as $cmpt)
                                <option value="{{ $cmpt->id }}">{{ $cmpt->nomCompt . ' - ' . $cmpt->munCompt }}
                                </option>
                            @endforeach
                        </select>
                    </div>


                    {{-- <div class="my-2">
                        <div class="">
                            <div class="">
                                <label for="">Montant global Acte</label>
                                <input class="input w-full border-2 mt-2 " name="montant_global_acte"
                                    placeholder="Montant global Acte" type="number" step="0.001" min=0>

                            </div>
                        </div>
                    </div>
                    <div class="my-2">
                        <div class="">
                            <div class="">
                                <label for="">Montant Quittance Partielle</label>
                                <input class="input w-full border-2 mt-2 " name="montant_quittance_partielle"
                                    placeholder="Montant Quittance Partielle" type="number" step="0.001" min=0>

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

                    <div class="my-2">
                        <div class="">
                            <div class="">
                                <label for="">Montant comptabilité</label>
                                <input class="input w-full border-2 mt-2 " name="montant_vue"
                                    placeholder="Montant comptabilité" type="number" step="0.001" min=0>

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

                    <div class="my-2">
                        <div class="">
                            <div class="">
                                <label for="">Montant hors comptabilité</label>
                                <input class="input w-full border-2 mt-2 " name="montant_nonvue"
                                    placeholder="Montant hors comptabilité" type="number" step="0.001" min=0>

                            </div>
                        </div>
                    </div>
                </div> --}}
                <div class="my-2">
                    <div class="">
                        <div class="">
                            <label for="">Montant global Acte</label>
                            <input class="input w-full border-2 mt-2 montant" name="montant_global_acte"
                                placeholder="Montant global Acte" type="text" step="0.001" min=0
                                >

                        </div>
                    </div>
                </div>
                <div class="my-2">
                    <div class="">
                        <div class="">
                            <label for="">Montant Quittance Partielle</label>
                            <input class="input w-full border-2 mt-2 montant" name="montant_quittance_partielle"
                                placeholder="Montant Quittance Partielle" type="text" step="0.001" min=0
                                >

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

                <div class="my-2">
                    <div class="">
                        <div class="">
                            <label for="">Montant à comptabilité</label>
                            <input class="input w-full border-2 mt-2 montant" name="montant_vue"
                                placeholder="Montant comptabilité" type="text" step="0.001" min=0
                                >

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

                <div class="my-2">
                    <div class="">
                        <div class="">
                            <label for="">Montant hors comptabilité</label>
                            <input class="input w-full border-2 mt-2 montant" name="montant_nonvue"
                                placeholder="Montant hors comptabilité" type="text" step="0.001" min=0
                                >

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


                <div class="my-2">
                    <div class="">
                        <div class="">
                            <label for="">Observation</label>
                            <textarea class="input w-full border mt-2" name="remarque" placeholder="Observation"></textarea>
                        </div>
                    </div>
                </div>

</form>
</div>
<!-- END: Input -->



</div>


<div class="intro-y col-span-12 lg:col-span-6">

    <!-- END: Vertical Form -->
    <div class="intro-y box  mb-5">
        <div class="flex flex-col sm:flex-row items-center p-5 border-b border-gray-200 dark:border-dark-5">
            <h2 class="font-medium text-base mr-auto">
                Les parties
            </h2>
        </div>
        <div class="p-5" id="vertical-form">
            <div class="preview">

                <div class="mt-3">
                    <label>Partie</label>
                    <div class="mt-2">
                        <select name="parties[]" class="input w-full border-2">
                            @foreach ($clients as $client)
                                <option value="{{ $client->id }}">
                                    {{ $client->type == 0 ? $client->raisonsocial : $client->prenom . ' ' . $client->name }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="my-3">
                        <label>Qualité</label>
                        <select name="type_parti[]" class="input w-full border-2 mt-2">
                            <option value="Acheteur">Acquéreur</option>
                            <option value="Administrateur">Administrateur</option>
                            <option value="Associé">Associé</option>
                            <option value="Bailleur">Bailleur</option>
                            <option value="Bénéficiaire">Bénéficiaire</option>
                            <option value="Cédant">Cédant</option>
                            <option value="Céssionnaire">Céssionnaire</option>
                            <option value="Créancier">Créancier</option>
                            <option value="Copartageant">Copartageant</option>
                            <option value="Débiteur">Débiteur</option>
                            <option value="Donateur">Donateur</option>
                            <option value="Donataire">Donataire</option>
                            <option value="Défunt">Défunt</option>
                            <option value="Emprunteur">Emprunteur</option>
                            <option value="Gérant">Gérant</option>
                            <option value="Héritier">Héritier</option>
                            <option value="Légataire">Légataire</option>
                            <option value="Mandant">Mandant</option>
                            <option value="Mandataire">Mandataire</option>
                            <option value="Occupant">Occupant</option>
                            <option value="Prêteur">Prêteur</option>
                            <option value="Preneur">Preneur</option>
                            <option value="Promettant">Promettant</option>
                            <option value="Vendeur">Vendeur</option>
                        </select>
                    </div>

                    {{-- <label>Qualité</label>
                    <div class="">
                       <input type="text" name="qualite[]" placeholder="Entrer la qualité de la première partie" class="input w-full border-2"> 
                    </div> --}}
                </div>

                <div class="more_parties">

                </div>

                <div class="grid justify-items-center mt-2">
                    <button class="button bg-theme-33 text-white add_paties">Ajouter</button>
                </div>

                {{-- <div class="mt-3 Form_imob">
                    <label>Partie 2</label>
                    <div class="mt-2">
                        <select data-placeholder="Sélectionner un ou plusieurs" name="vendeur[]"
                            class="tail-select w-full vendeur" multiple>
                            @foreach ($clients as $client)
                                <option value="{{ $client->id }}">
                                    @if ($client->type == 0)
                                        {{ $client->raisonsocial }}
                                    @else
                                        {{ $client->prenom }} {{ $client->name }}
                                    @endif
                                </option>
                            @endforeach
                        </select>
                    </div>
                    <label>Qualité</label>
                    <div class="">
                       <input type="text" name="qualite2" placeholder="Entrer la qualité de la deuxième partie" class="input w-full border-2"> 
                    </div>
                </div> --}}
            </div>

        </div>
    </div>

    <!-- BEGIN: Vertical Form -->
    <div class="intro-y box ">
        <div class="flex flex-col sm:flex-row items-center p-5 border-b border-gray-200 dark:border-dark-5">
            <h2 class="font-medium text-base mr-auto">
                Ajouter des pièces jointes
            </h2>
        </div>

        <!-- partie fichiers jointes -->
        <div class="gpice p-5">
            <div class=" lg:flex flex-row  grid sm:gap-4 sm:grid-cols-1 pice">
                <div class="my-2 mr-2 flex flex-col w-full">
                    <div class="flex flex-col w-full overflow-hidden ">
                        <label class="">Pièces joints multiple</label>
                        <input type="file" name="file[]"
                            class="input hover:bg-gray-500 w-full border-gray-400 border-2 mt-2 border joint">
                    </div>
                </div>
                <div class="flex flex-row w-full">
                    <div class="my-2 flex flex-col w-full">
                        <label class="">Type de fichier</label>
                        <select class="input w-full border-2 pb-3 border-gray-400 mt-2" class="id_type"
                            name="id_typefichier[]">
                            <option value="">Type de fichier</option>
                            @foreach ($typefichiers as $type_fichier)
                                <option value="{{ $type_fichier->id }}">{{ $type_fichier->nom }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div style="margin-top: 2rem;margin-buttom: 1.8rem;"
                        class="w-16 flex flex-row text-white font-semibold ">
                        <span class=" ml-2">
                            <img class="addpice" style="margin-top:10px; cursor:pointer;"
                                src="{{ asset('dist/images/add_attachement.png') }}" />
                        </span>

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

        <!-- module d'ajout un autre fichier -->
        <div class="tpice hidden">
            <div class="flex flex-row pice px-5">
                <div class="my-2 mr-2 flex flex-col w-full">
                    <div class="flex flex-col w-full overflow-hidden ">
                        <label class="">Pièces joints multiple</label>
                        <input type="file" name="file[]"
                            class="input hover:bg-gray-500 w-full border-gray-400 border-2 mt-2 border joint">
                    </div>
                </div>
                <div class="flex flex-row w-full">
                    <div class="my-2 flex flex-col w-full">
                        <label class="">Type de fichier</label>
                        <select class="input w-full border-2 pb-3 border-gray-400 mt-2" class="id_type"
                            name="id_typefichier[]">
                            <option value="">Type de fichier</option>
                            @foreach ($typefichiers as $type_fichier)
                                <option value="{{ $type_fichier->id }}">{{ $type_fichier->nom }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div style="margin-top: 2rem;margin-buttom: 1.8rem;"
                        class="w-16 flex flex-row text-white font-semibold kill">
                        <span class=" ml-2">
                            <span class=" ml-2"><img style="margin-top:-10px; cursor:pointer;"
                                    src="{{ asset('dist/images/delete_attachement.png') }}" /></span>
                        </span>

                    </div>
                </div>
            </div>
        </div>
        <!-- fin module -->
        <!--fin jointes -->
    </div>
    <!-- END: Vertical Form -->

    <!-- BEGIN: Horizontal Form -->
    <div class="intro-y box mt-5">
        <div class="flex flex-col sm:flex-row items-center p-5 border-b border-gray-200 dark:border-dark-5">
            <h2 class="font-medium text-base mr-auto">
                Étape du dossier
            </h2>
        </div>
        <div class="p-5" id="horizontal-form">
            <div class="preview">
                <div class="flex flex-col sm:flex-row items-center">
                    <select class="input w-full mt-2 border-2" name="id_etape">
                        @foreach ($etapes as $etape)
                            <option value="{{ $etape->id }}">{{ $etape->nom }}
                            </option>
                        @endforeach
                    </select>
                </div>

            </div>
            <div class="source-code hidden">
                <button data-target="#copy-horizontal-form"
                    class="copy-code button button--sm border flex items-center text-gray-700 dark:border-dark-5 dark:text-gray-300">
                    <i data-feather="file" class="w-4 h-4 mr-2"></i> Copy example code </button>
                <div class="overflow-y-auto h-64 mt-3">
                    <pre class="source-preview" id="copy-horizontal-form"> <code class="text-xs p-0 rounded-md html pl-5 pt-8 pb-4 -mb-10 -mt-10"> HTMLOpenTagdiv class=&quot;flex flex-col sm:flex-row items-center&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;w-full sm:w-20 sm:text-right sm:mr-5&quot;HTMLCloseTagEmailHTMLOpenTag/labelHTMLCloseTag HTMLOpenTaginput type=&quot;email&quot; class=&quot;input w-full border mt-2 flex-1&quot; placeholder=&quot;example@gmail.com&quot;HTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;flex flex-col sm:flex-row items-center mt-3&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;w-full sm:w-20 sm:text-right sm:mr-5&quot;HTMLCloseTagPasswordHTMLOpenTag/labelHTMLCloseTag HTMLOpenTaginput type=&quot;password&quot; class=&quot;input w-full border mt-2 flex-1&quot; placeholder=&quot;secret&quot;HTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;flex items-center text-gray-700 dark:text-gray-500 mt-5 sm:ml-20 sm:pl-5&quot;HTMLCloseTag HTMLOpenTaginput type=&quot;checkbox&quot; class=&quot;input border mr-2&quot; id=&quot;horizontal-remember-me&quot;HTMLCloseTag HTMLOpenTaglabel class=&quot;cursor-pointer select-none&quot; for=&quot;horizontal-remember-me&quot;HTMLCloseTagRemember meHTMLOpenTag/labelHTMLCloseTag HTMLOpenTag/divHTMLCloseTag HTMLOpenTagdiv class=&quot;sm:ml-20 sm:pl-5 mt-5&quot;HTMLCloseTag HTMLOpenTagbutton type=&quot;button&quot; class=&quot;button bg-theme-1 text-white&quot;HTMLCloseTagLoginHTMLOpenTag/buttonHTMLCloseTag HTMLOpenTag/divHTMLCloseTag </code> </pre>
                </div>
            </div>
        </div>
    </div>
    <!-- END: Horizontal Form -->



</div>

<div class="my-2">
    <button class="button bg-theme-1 text-white mt-5 valid" type="submit">
        Enregistrer</button>
</div>


</div>
</form>
@endsection

@section('script')
<script>
    $(document).ready(function() {
        $("#bord").attr('class', 'side-menu');
        $("#client").attr('class', 'side-menu side-menu');
        $('#propr').attr('class', 'side-menu side-menu');
        $('#dossier').attr('class', 'side-menu side-menu--active');
    });
</script>
<script>
    $("body").on('click', '.add_paties', function() {
        event.preventDefault();
        $.ajax({
            url: `{{ route('add_paties_form') }}`,
            type: 'post',
            dataType: 'json',
            success: function(data) {
                $('.more_parties').append(data);
                $('.new_partie').slideDown('normal');
            },
            error: function(error) {
                console.log(error);
            },
        });
    });
    $('body').on('click', '.kill_partie', function() {
        // $(this).parent().parent().slideUp();
        $(this).parent().parent().remove();
    });
</script>

{{-- <script src="https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/markerclusterer.js">
</script> --}}
{{-- <script src="https://maps.googleapis.com/maps/api/js?key=[" your-google-map-api"]&libraries=places"></script> --}}
<script src="{{ asset('dist/js/app.js') }}"></script>

<script type="text/javascript">
    $('.type_dossier').change(function() {
        if ($(this).val() == 'Non immobiliers') {
            $('.Form_imob').slideUp('slow');
        } else {
            $('.Form_imob').slideDown('slow');
        }
    });

    $('.credit').change(function() {
        if ($(this).val() == '1') {
            var x = document.getElementById("divavec");


            x.style.display = "grid";

        } else {
            var x = document.getElementById("divavec");

            x.style.display = "none";

        }

    });
</script>
<script>
    $("body").on("click", ".addpice", function() {
        var html = $(".tpice").html();
        $(".gpice").after(html);
        console.log(html);
    });

    $("body").on("click", ".kill", function() {
        $(this).parent().parent().toggle();
    });

    $(document).ready(function() {
        $("body").on('change', '.id_propriete', function() {
            var id_propriete = $(this).val();
            $.ajax({
                url: `{{ route('get_prop_type') }}`,
                dataType: 'json',
                type: 'post',
                data: {
                    id_propriete: id_propriete
                },
                success: function(data) {
                    if (data.typ_aff == 'Non immobilier') {
                        $('.Form_imob').slideUp('slow');

                    } else {
                        $('.Form_imob').slideDown('slow');
                    }
                },
                error: function(error) {
                    console.log(error);
                },
            });
        });
    });

    function hide_if_input_not_checked($this) {

        if ($this.nextElementSibling.innerHTML == 'Oui') {
            $this.parentNode.nextElementSibling.nextElementSibling.classList.remove('hidden');
        }
        if ($this.nextElementSibling.innerHTML == 'Non') {
            $this.parentNode.nextElementSibling.classList.add('hidden');
        }
    }
    // formattage en temps réel des champs ;
    const montants = $(".montant");

// montants.each((element, input) => {


// });
montants.on('input', (event) => {
    let value = event.target.value;

    // Remove any existing spaces and non-numeric characters
    value = value.replace(/[^0-9]/g, '');

    // Add spaces as thousands separators
    value = Number(value).toLocaleString('en-US').replace(/,/g, ' ');

    // Update the input value with the formatted number
    event.target.value = value;


})
</script>
@endsection