@extends('admin')

@section('title')
    NotaireApp -  Créer Nouvelle Affaire
@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 Nouvelle Affaire</a> </div>
    <!-- END: Breadcrumb -->
@endsection
<div class="my-3 p-5 box w-56">
    <div class="-intro-x">
        <label> Type d'affaire </label>
        <select class="input w-full mt-2 border-2 typ_aff">
            <option value="Immobilier">immobilier</option>
            <option value="Non immobilier">Non immobilier</option>
        </select>
    </div>
</div>
<div class=" intro-x container box mt-2 px-8 py-8 rounded-lg ">
    <div class="container">
        <div class="">
            <div class="">
                <div class="">
                    <div class="">
                        <div class="">

                            <form method="post" action="{{ route('admin.store.propriete') }}" id="fileinfo"
                                enctype="multipart/form-data">
                                @csrf
                                <input type="hidden" name="typ_aff" class="typ_aff_val">
                                <div class="">
                                    <div class="lg:flex flex-row  grid sm:gap-4 sm:grid-cols-1">

                                        <div class="my-3 flex flex-col mr-2 w-full">
                                            <div class="">
                                                <label> Catégorie </label>
                                                <div class="">
                                                    <select class="input w-full mt-2 border-2" name="cat">
                                                        @foreach ($cats as $cat)
                                                            <option value="{{ $cat->id }}">{{ $cat->Cat }}
                                                            </option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="my-3 flex flex-col w-full">
                                            <div class="">
                                                <label for="">Sous Catégorie </label>
                                                <input class="input w-full  mt-2 border-2" name="nom"
                                                    placeholder="dénomination " required="required" type="text">
                                            </div>
                                        </div>

                                    </div>
                                </div>

                                <div class="Form_immob">
                                    <div class="">
                                        <div class="lg:flex flex-row  grid sm:gap-4 sm:grid-cols-1">
                                            <div class="flex flex-col mr-2 my-2 w-full">
                                                <div class="">
                                                    <div class="">
                                                        <label for="">Titre foncier </label>
                                                        <input class="input w-full  mt-2 border-2" name="titrefon"
                                                            placeholder="titre foncier" required="required"
                                                            type="text">

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

                                            <div class="flex flex-col my-2 w-full">
                                                <div class="">
                                                    <label for=""> Conservation Foncière </label>
                                                    <select name="conser" id=""
                                                        class="input w-full mt-2 border-2" required="required">
                                                        @foreach ($convs as $conv)
                                                            <option value="{{ $conv->id }}">
                                                                {{ $conv->conservationFonciere }}</option>
                                                        @endforeach
                                                    </select>
                                                    <div class="help-block form-text with-errors form-control-feedback">
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="my-2">
                                            {{-- <label for=""> Superficie</label> --}}
                                            <div class="flex flex-row ">
                                                <div class="flex flex-col w-full">
                                                    <label for=""> Superficie</label>
                                                    <input class="input w-full border-2 mt-2" name="super"
                                                        placeholder="Superficie" value="" min='0'
                                                        required="required" type="number">
                                                </div>

                                                <div class="flex flex-col ml-2 w-64">
                                                    <label for=""> Unité </label>
                                                    <select name="unit" id=""
                                                        class="input w-full mt-2 border-2" required="required">
                                                        <option value="mètre carré">mètre carré</option>
                                                        <option value="hectare">hectare</option>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="flex flex-row">
                                        <div class="my-2 mr-2 flex flex-col w-full">
                                            <div class="">
                                                <label for=""> Adresse</label>
                                                <input class="input w-full  mt-2 border-2" name="adresse"
                                                    placeholder="Adresse" required="required" type="text">
                                                <div class="help-block form-text with-errors form-control-feedback">
                                                </div>
                                            </div>
                                        </div>

                                        <div class="my-2 flex flex-col w-full">
                                            <div class="">
                                                <div class="">
                                                    <label for="">Complément</label>
                                                    <input class="input w-full border-2 mt-2" name="complement"
                                                        placeholder="Complément" required="required" type="text">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="flex flex-row w-full">
                                        <div class="my-2 flex flex-col mr-2 w-full">
                                            <div class="">
                                                <div class="">
                                                    <label for=""> Ville</label>
                                                    <input class="input w-full border-2" name="ville"
                                                        placeholder="Ville" required="required" type="text">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="gpice">
                                    <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 jointes multiples</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="">Séléctionner un 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"
                                                        src="https://img.icons8.com/flat_round/128/000000/plus.png" />
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="tpice hidden">
                                    <div class="w-full 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 jointes multiples</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="w-full flex flex-row ">
                                            <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="">Séléctionner un 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">
                                                    <img
                                                        src="https://img.icons8.com/flat_round/128/000000/delete-sign.png" />
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="my-2 ">
                                    <div class="">
                                        <div class="">
                                            <label>Remarque</label>
                                            <textarea name="desc" id="desc"class="input w-full border-2 mt-2 border-gray-400"></textarea>
                                        </div>
                                    </div>
                                </div>
                                <div class="my-2">
                                    <button class="button bg-theme-1 text-white mt-5 valid" type="submit">
                                        Créer</button>
                                    <button class="button  text-white mt-5 cncl" style="background-color: #bfbfbf;"
                                        type="submit"> Annuler</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<script type="text/javascript">
    $(document).ready(function() {

        $("#bord").attr('class', 'side-menu');
        $("#client").attr('class', 'side-menu');
        $('#propr').attr('class', 'side-menu side-menu--active');
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        // hada houwa js lli ki dupliki dak div lli lfo9
        $("body").on("click", ".addpice", function() {
            var html = $(".tpice").html();
            $(".gpice").after(html);
        });
        // hada diyal remove db sir lcontroller diyal 'ProprieteController'
        $("body").on("click", ".kill", function() {
            $(this).parent().parent().toggle();
        });
        // $("body").on("click",".piceval",function(){ 

        //     console.log($(this).parent().children().eq(1).find('select').html());
        // });

        $('.cncl').click(function() {
            // $('form').val("");
            var com = confirm("êtes-vous sûr de votre action ?");
            if (com == true)
                $(':input', '#fileinfo')
                .not(':button, :submit, :reset, :hidden')
                .val('')
                .prop('checked', false)
                .prop('selected', false);
        });

        $('.valid').click(function(event) {
            event.preventDefault();
            formData = new FormData(document.getElementById("fileinfo"));

            $.ajax({
                url: "{{ route('admin.store.propriete') }}",
                enctype: 'multipart/form-data',
                type: 'post',
                dataType: 'json',
                // timeout: 600000,
                data: formData,
                processData: false,
                contentType: false,
                cache: false,
                success: function(data) {
                    location.href = '{{ route('admin.list.propriete') }}';
                    //    console.log(data);
                },
                error: function(error) {
                    // console.log(error);
                    Swal.fire({
                        icon: 'error',
                        title: 'Oops...',
                        text: 'Un problème est survenu!',
                    });
                    console.log(error);
                },

            });

        });
        $('body').on('change', '.typ_aff', function() {
            $('.typ_aff_val').val($(this).val());

            if ($(this).val() != 'Immobilier') {
                $('.Form_immob').hide("slow");
            } else {
                $('.Form_immob').show("slow");
            }
        });
    });
</script>

@endsection