@extends('admin')

@section('title')
    NotaireApp - Liste Des factures
@endsection

@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">Liste des factures</a> </div>
    <!-- END: Breadcrumb -->
@endsection

@section('content')

<h2 class="intro-y text-lg font-medium mt-10">
    Liste des factures de devis {{$devis->id}} 
</h2>

<div class="grid grid-cols-12 gap-6 mt-5">
    <div class="intro-y col-span-12 flex flex-wrap sm:flex-no-wrap items-center mt-2">
        <a class="hidden addfacture button text-white bg-theme-1 shadow-md mr-2 " href="{{ url('/admin/facture/create/'.$devis->id) }}">Ajouter Une Nouvelle Facture</a>
        <input type="hidden" value="{{$devis->id}}" id="key_devi">
        <div class="hidden md:block mx-auto text-gray-600" style="visibility: hidden;">Showing 1 to 10 of 150 entries</div>
        <input type="hidden" class="numrowr" value="{{Session::get('rowcountFACTp')}}">
    </div>
    <!-- BEGIN: Data List -->
    <div class="intro-y col-span-12 overflow-auto lg:overflow-visible">
        <table class="table table-report -mt-2 border-none" style="border-style: none !important;" id="table_id">
            <thead style="border-style: none !important;">
                <tr class="shadow-lg">
                    <th class="whitespace-no-wrap" style="border-style: none !important;">DEVIS</th>
                    <th class="text-center whitespace-no-wrap" style="border-style: none !important;">N° FACTURE</th>
                    <th class="text-center whitespace-no-wrap" style="border-style: none !important;">REMARQUE</th>
                    <th class="text-center whitespace-no-wrap" style="border-style: none !important;">DATE</th>
                    <th class="text-center whitespace-no-wrap" style="border-style: none !important;">ACTIONS</th>
                </tr>
                
            </thead >
            <tbody id="tbd">
                @foreach( $factures as $facture )
                <tr class="intro-x shadow-md rounded-lg intro-y" style="height: 63px;">
                    <td class="text-center">{{ $facture->id_devis }}</td>
                    <td class="text-center">{{ $facture->num_facture }}</td>
                    <td class="text-center">{{ $facture->remarque }}</td>
                    <td class="text-center">{{ $facture->date_facture }}</td>
                    <td class="table-report__action w-56">
                        <div class="flex justify-center items-center">
                            <a title="Modifier" 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" href="{{ URL::to('/admin/facture/edit/'.$facture->id) }}"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-check-square w-4 h-4"><polyline points="9 11 12 14 22 4"></polyline><path d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"></path></svg> </a>
                            <a title="Supprimer" 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" href="javascript:;" data-toggle="modal" data-target="#delete-confirmation-modal{{ $facture->id }}"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-trash-2 w-4 h-4 "><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg> </a>
                            <a title="Imprimer" target="_blank" href="{{ URL::to('/admin/facture/imprimer/'.$facture->id) }}" 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"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="feather feather-file-text w-4 h-4 "><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><polyline points="10 9 9 9 8 9"></polyline></svg></a>
                        </div>
                    </td>
                </tr>

                <!-- BEGIN: Delete Confirmation Modal -->
                <div class="modal" id="delete-confirmation-modal{{ $facture->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/facture/delete/'.$facture->id) }}">Supprimer</a>
                        </div>
                    </div>
                </div>
                <!-- END: Delete Confirmation Modal -->
                @endforeach

            </tbody>
        </table>
    </div>
    <!-- END: Data List -->



    </div>
    
@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');
            $('#devis').attr('class','side-menu side-menu');
            $('#facture').attr('class','side-menu side-menu--active');
        });
        // admin.fact
        
    </script>
    <script>
        if($('.numrowr').val()!=null){
                $('.nb_row').val($('.numrowr').val());
            }
    
            $('.nb_row').change(function(){
                $.ajax({
                    url:"{{route('admin.fact',1)}}",
                    type:'get',
                    dataTaype:'json',
                    data:{nb_row:$('.nb_row').val(),},
                    success:function(data){
                        console.log($('.numrowr').val());
                        location.reload();
                    },
                    error:function(error){
                        console.log(error);
                    }
                });
            });
    </script>
    
    <script>
        // $.ajaxSetup({headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')}});
        $(".find").bind("change paste keyup", function() {
            // console.log('test');
            $.ajax({
                data:{
                    key:$(this).val(),
                    key_devi:$('#key_devi').val()
                },
                    type:'post',
                    dataType:'json',
                    url:"{{route('search.fact')}}",
                    success:function(data){
                        console.log(data);
                        $('#tbd').html("");
                       
                        $.each(data,function(index,a){
                            remarque="";

                            url1="{{ URL::to('/admin/facture/edit/'."+id+") }}"
                            url2="{{ URL::to('/admin/facture/imprimer/'."+id+") }}";
                           
                            modif=url1.replace("id",a.id);
                            imp=url2.replace("id",a.id);
                            if(a.remarque!=null){
                                remarque=a.remarque;
                            }
                            $('#tbd').append(
                            "<tr>"
                            +"<td class='text-center'>"+a.id_devis+"</td>"
                            +"<td class='text-center'>"+a.num_facture+"</td>"
                            +"<td class='text-center'>"+remarque+"</td>"
                            +"<td class='text-center'>"+a.date_facture+"</td>"
                            +"<td class='table-report__action w-56  addfacture hidden res'>"
                                +"<div class='flex justify-center items-center'>"
                                  +"<a title='Modifier' 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' href="+modif+">"
                                    +"<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.5'stroke-linecap='round' stroke-linejoin='round' class='feather feather-check-square w-4 h-4 mr-1'><polyline points='9 11 12 14 22 4'></polyline><path d='M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11'></path></svg>"
                                  +"</a>"
                                  +"<a title='Supprimer' 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' href='javascript:;' data-toggle='modal' data-target='#delete-confirmation-modal"+a.id+"'> "
                                    +"<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' class='feather feather-trash-2 w-4 h-4 '><polyline points='3 6 5 6 21 6'></polyline><path d='M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2'></path><line x1='10' y1='11' x2='10' y2='17'></line><line x1='14' y1='11' x2='14' y2='17'></line></svg> " 
                                  +"</a>"
                                  +"<a title='Imprimer' target='_blank' href='"+imp+"' 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'> "
                                    +"<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' class='feather feather-file-text w-4 h-4 mr-2'><path d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'></path><polyline points='14 2 14 8 20 8'></polyline><line x1='16' y1='13' x2='8' y2='13'></line><line x1='16' y1='17' x2='8' y2='17'></line><polyline points='10 9 9 9 8 9'></polyline></svg>"
                                  +"</a>"
                                +"</div>"
                            +"</tb>"
                            +"</tr>"
                            );
                        });
                        $.ajax({
                                url:"{{route('admin.RoleS.regle')}}",
                                dataType:'json',
                                type:'post',
                                success:function(data){
                                    if(data.addfacture==1){
                                        $('.res').show();
                                    }
                                },
                                error:function(error){
                                    console.log(error);
                                },
                            });
                    },
                    error:function(error){console.log(error);},
            });
        });
    </script>
@endsection