@extends('layouts.dash_pop')
@section('title_card',"")


@section('content')

    {!! html()->hidden('checklist','')->attributes(['id'=>'checklist']) !!}

    </div>
        <div class=' col-lg-max' style="padding-top:5px">
            <div class="alert" style="padding-top:0px">
                <table id="_table" style="background-color:white" class="table table-condensed table-striped table-bordered">
                    <thead>
                        <tr>
                            <th width='1%'>N°Journal</th>
                            <th width='1%' >Date</th>
                            <th width='1%'>N°Compte</th>
                            <th width='1%'>Référence</th>
                            <th>Libelle</th>
                            <th width='5%'>Débit</th>
                            <th width='5%'>Crédit</th>
                            <th width='1%'>Enc</th>
                        </tr>
                    </thead>
         

                    <tbody>
                                                @foreach ($journaux as $journal)
                                                <tr>
                            <td style="color:grey;font-style:italic">{!! $journal->id !!}</td>
                            <td align="center">{!! $journal->date !!}</td>
                            <td align="center">{!! $journal->numcpt!!}</td>
                            <td nowrap>{!! $journal->ref!!}</td>
                            <td>{!! $journal->libelle!!}</td>
                            <td nowrap align="right" style="color:darkred;font-weight:bold">{!! number_format($journal->debit,0,","," ") !!}</td>
                            <td nowrap align="right" style="color:darkblue;font-weight:bold">{!! number_format($journal->credit,0,","," ") !!}</td>
                            <td nowrap align="right">{!! $journal->enc!!}</td>    
                        </tr>
                        @endforeach
                    </tbody>
                        <tr class="bg-warning">
                            <td colspan="5"></td>
                            <td nowrap align="right" style="color:red;font-weight:bold">{!! number_format($total["debit"],0,","," ") !!}</td>
                            <td nowrap align="right" style="color:blue;font-weight:bold">{!! number_format($total["credit"],0,","," ") !!}</td>
                            <td nowrap align="right">{!! number_format($total["debit"]-$total["credit"],0,","," ") !!} </td> 
                        </tr>
                    <tfoot>
                </table>
            </div>
        </div>
    </div>
@endsection



@section('scripts')
    <script>
        $(document).ready(function() {
            $.fn.dataTable.moment('D/M/YYYY');
                var table =$('#_table').dataTable( {
                    bAutoWidth: false,
                    bPaginate: false,
                    bInfo: false,
                    bFilter: false,
                    deferRender:    true,
                    scrollY:        500,
                    scrollCollapse: true,
                    scroller:       true,
                    oLanguage: {
                        "sZeroRecords": "Aucune ligne",
                        "sInfo": "Affichage de _START_ &agrave; _END_ sur _TOTAL_ lignes",
                        "sInfoEmpty": "Showing 0 to 0 of 0 records",
                        "decimal": ",",
                        "thousands": " ",

                        buttons: {
                            colvis: 'Colonnes à afficher',
                            copy: 'Copier',
                            print: 'Imprimer',
                            copyTitle: 'Ajouté au presse-papiers',
                            copyKeys: 'Appuyez sur <i>ctrl</i> ou <i>\u2318</i> + <i>C</i> pour copier les données du tableau à votre presse-papiers. <br><br>Pour annuler, cliquez sur ce message ou appuyez sur Echap.',
                            copySuccess: {
                                _: '%d lignes copiées',
                                1: '1 ligne copiée'
                            }
                        }
                    },

                    "aaSorting": [
                        [1,'desc']
                    ],

                    "aoColumnDefs": [
                        { "sTypes": "numeric", "aTargets": [ 3 ] },
                        { bSortable: false, aTargets: [] },
                    ],

                    dom: "<'row'<'col-sm-4 text-left'f><'col-sm-4'><'col-sm-6 text-right'B>>" +
                    "<'row'<'col-sm-12'tr>>" +
                    "<'row'<'col-sm-5'i><'col-sm-7'p>>",

                    buttons: [ 
                        {extend: 'copy',exportOptions: {columns: ':visible'} },
                        {extend: 'excel',exportOptions: {columns: ':visible'} },
                        {extend: 'pdf',exportOptions: {columns: ':visible'} },
                        {extend: 'print',exportOptions: {columns: ':visible'} },
                        //'colvis'
                    ],
                } );
        });
    </script>
@endsection