@extends('admin')

@section('title')
    NotaireApp - Modifier
@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">Modifier
            Dépense</a> </div>
    <!-- END: Breadcrumb -->
@endsection

<div class="intro-y flex items-center mt-8">
    <h2 class="text-lg font-medium mr-auto">
        Modifier la Dépense
    </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: Input -->
            <div class="intro-y box p-5">

                @if ($charge->id_dossier)
                    <input name="id_dossier" value="{{ $charge->id_dossier }}" type="hidden">
                    <div class="my-3">

                        <div class="">
                            <label> Dossier </label>
                            <div class="sm:mt-2">

                                <select class="input w-full mt-2 border-2" name="id_dossier">
                                    @foreach ($dossiers as $dossier)
                                        <option value="{{ $dossier->id }}">{{ $dossier->num_dossier }}
                                        </option>
                                    @endforeach
                                </select>

                                <div class="help-block form-text with-errors form-control-feedback">
                                </div>
                            </div>
                        </div>
                    </div>
                @endif

                <div class="my-3">
                    <div class="">
                        <div class="">
                            <label for=""> Désignation </label>
                            {{-- <input class="input w-full  mt-2 border-2" name="designation" placeholder="Designation"
                                value="{{ $charge->designation }}" type="text"> --}}
                            <select name="designation" class="input w-full  mt-2 border-2">
                                <option value="0">Sélectionnez une désignation</option>
                                @foreach ($DepenseName as $depname)
                                    <option value="{{$depname->dep_name}}" {{ ($depname->dep_name == $charge->designation )? 'selected' : '' }}>{{$depname->dep_name}}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                </div>

                <div class="my-3">
                    <div class="">
                        <div class="">
                            <label for="">Mode Règlement </label>
                            <select class="input w-full mt-2 border-2" required name="mode_reg" id="mode-reg">
                                <option value="Espèces" {{ $charge->mode_reg == 'Espèces' ? 'selected' : '' }}>Espèces
                                </option>
                                <option value="Cheque" {{ $charge->mode_reg == 'Cheque' ? 'selected' : '' }}>Cheque
                                </option>
                                <option value="Virement" {{ $charge->mode_reg == 'Virement' ? 'selected' : '' }}>
                                    Virement</option>
                                <option value="Carte bancaire"
                                    {{ $charge->mode_reg == 'Carte bancaire' ? 'selected' : '' }}>Carte bancaire
                                </option>
                                {{-- <option value="Effect" {{ $charge->mode_reg == 'Effect' ? 'selected' : '' }}>Effect </option> --}}
                                <option value="Autre" {{ $charge->mode_reg == 'Autre' ? 'selected' : '' }}>Autre
                                </option>
                            </select>

                        </div>
                    </div>
                </div>
                <div class="my-3  banks" {{ ($charge->mode_reg == 'Cheque' || $charge->mode_reg == 'Autre' || $charge->mode_reg == 'Carte bancaire') ? '' : 'hidden' }}>
                    <label for="">Compte Bancaire</label>
                    <select class="input w-full mt-2 border-2" name="compt_bank">
                        <option value="0">Selectionner un compte</option>
                        @foreach ($Compte as $item)
                            <option value="{{ $item->id }}"
                                {{ $charge->compt_bank == $item->id ? 'selected' : '' }}>
                                {{ $item->nomCompt }}--{{ $item->munCompt }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="my-3 {{ ($charge->mode_reg == 'Cheque' )? '' : 'hidden' }}" id="cheque-num">
                    <div class="">
                        <div class="">
                            <label for="">N° Chèque </label>
                            <input class="input w-full  mt-2 border-2"  name="num_cheque" placeholder="N° Cheque"
                                value="{{ $charge->num_cheque }}" type="text">

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




                <div class="my-2">
                    <div class="">
                        <div class="">
                            <label for="">Montant</label>
                            <input class="input w-full border-2 mt-2" name="montant" value="{{ $charge->montant }}"
                                placeholder="Montant" type="number" step="0.01">
                        </div>
                    </div>
                </div>


                <div class="my-2">
                    <div class="">
                        <div class="">
                            <label for="">Date Dépense</label>
                            <input class="input w-full border-2 mt-2 " value="{{ $charge->date_charge }}"
                                name="date_charge" placeholder="Date" type="date">
                        </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="Ramarque">{{ $charge->remarque }}</textarea>
                        </div>
                    </div>
                </div>



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



</div>


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

    <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>
        <div class="p-5" id="vertical-form">
            <div class="preview">
                <select class="input w-full " name="id_typefichier">
                    <option value="0">Séléctionner un type de fichier</option>
                    @foreach ($typefichiers as $type_fichier)
                        <option value="{{ $type_fichier->id }}">{{ $type_fichier->nom }}
                        </option>
                    @endforeach
                </select><br>

                <div class="p-5" id="multiple-file-upload">
                    <div class="preview">
                        <div class="fallback">
                            <input type="file" name="file[]" multiple />
                        </div>

                    </div>

                </div>
            </div>

        </div>
    </div>

    <!-- BEGIN: Vertical 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">
                Les pièces jointes
            </h2>


        </div>
        <div class="p-5">

            @forelse ($fichiers as $fichier)
                <div class="flex items-center">
                    <div class="file"> <a target="_blank" href="{{ URL::to($path->paths . $fichier->file) }}"
                            class="w-12 file__icon file__icon--directory"></a> </div>
                    <div class="ml-4">
                        <a class="font-medium" target="_blank"
                            href="{{ URL::to($path->paths . $fichier->file) }}">{{ $fichier->file }}</a>
                        <div class="text-gray-600 text-xs">{{ $fichier->nom_fichier }}</div>
                    </div>
                    <div class="dropdown ml-auto">
                        <a class="dropdown-toggle w-5 h-5 block"> <i data-feather="more-horizontal"
                                class="w-5 h-5 text-gray-700 dark:text-gray-300"></i> </a>
                        <div class="dropdown-box w-40">
                            <div class="dropdown-box__content box dark:bg-dark-1 p-2">
                                <a href="javascript:;"
                                    class="flex items-center block p-2 transition duration-300 ease-in-out bg-white dark:bg-dark-1 hover:bg-gray-200 dark:hover:bg-dark-2 rounded-md"
                                    data-toggle="modal" data-target="#delete-confirmation-modal{{ $fichier->id }}">
                                    <i data-feather="trash" class="w-4 h-4 mr-2"></i> Supprimer </a>
                            </div>
                        </div>
                    </div>
                </div>

                <br>

                <div class="modal" id="delete-confirmation-modal{{ $fichier->id }}">
                    <div class="modal__content">
                        <div class="p-5 text-center">
                            <i data-feather="x-circle" class="w-16 h-16 text-theme-6 mx-auto mt-3"></i>
                            <div class="text-3xl mt-5">Êtes-vous sûr? </div>
                            <div class="text-gray-600 mt-2">Voulez-vous vraiment supprimer ces enregistrements? Ce
                                processus ne peut pas être annulé.</div>
                        </div>
                        <div class="px-5 pb-8 text-center">
                            <button type="button" data-dismiss="modal"
                                class="button w-24 border text-gray-700 mr-1">Annuler</button>
                            <a class="button w-24 bg-theme-6 text-white"
                                href="{{ URL::to('/admin/fichier/delete/' . $fichier->id) }}">Supprimer</a>
                        </div>
                    </div>
                </div>

            @empty

                <div class="flex items-center">
                    <p>Il n'y a pas encore des fichiers pour ce client.</p>
                </div>
            @endforelse

        </div>
    </div>



</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');
        $('#charge').attr('class', 'side-menu side-menu--active');

        $('#mode-reg').change(function() {
            // console.log('method: ' + $(this).val())
            if ($(this).val() === 'Cheque' || $(this).val() === 'Carte bancaire' || $(this).val() === 'Autre') {
                $('.banks').show();
                $('#cheque-num ').show();
            } else {
                $('.banks').hide();
                $('#cheque-num ').hide();
            }
        });
    });
</script>


<script src="https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/markerclusterer.js">
</script>

<script src="{{ asset('dist/js/app.js') }}"></script>

<script type="text/javascript">
    $('.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>
@endsection