@extends('layouts.dash_pop')
@section('title')Historique des versements @stop

@section('content')
    <div class="card card-info">
        <div class="card-header">
            <h2>Historique des versements <span style='color:darkblue'>{!! $beneficiaire->nomcomplet !!}</span></h2>
        </div>

        <div class="card-body">
            <table id="_table" class="table table-striped table-bordered">
                <thead>
                    <tr>
                        <th width='1%'>N°</th>
                        <th width='1%'>Date</th>
                        <th width='1%'>Montant</th>
                        <th width='1%'>Banque/Compte</th>
                        <th width='1%'>Mode de paiement</th>
                        <th width='1%'>Type</th>
                        <th width='1%'>DateValid</th>
                        <th width='13%'>Soc.</th>
                        <th width='1%'>MontantC.</th>
                        <th width='1%'>MontantR.</th>
                        <th width='1%'>NumImp</th>
                        <th width='1%'>RetType</th>
                        <th width='1%'>RetDate</th>
                        <th width='1%'>RetNum</th>
                        <th width=50%>Observations</th>
                    </tr>
                </thead>

                <tbody>
                    @foreach ($versements_hg as $versement_hg)
                        <tr>
                            <td >{!! $versement_hg->id !!}</td>
                            <td >{!! $versement_hg->date !!}</td>
                            <td align="right">{!! $versement_hg->montant !!}</td>

                            <td >{!! $versement_hg->BanqueNom !!}<br/>{!! $versement_hg->compte !!}</td>
                            <td align="right">{!! $versement_hg->mode_pmt !!}</td>
                            <td >{!! $versement_hg->type !!}</td>
                            <td >{!! $versement_hg->date_valid !!}</td>
                            <td >{!! $versement_hg->nom_court_employeur !!}</td>
                            <td align="right">{!! $versement_hg->montant_c !!}</td>
                            <td align="right">{!! $versement_hg->montant_r !!}</td>
                            <td >{!! $versement_hg->num_imp !!}</td>
                            <td >{!! $versement_hg->ret_type !!}</td>
                            <td >{!! $versement_hg->ret_date !!}</td>
                            <td >{!! $versement_hg->ret_num !!}</td>
                            <td >{!! $versement_hg->obs_vers !!}</td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
@stop

@section('scripts')

    <script>
        $(document).ready(function() {


            //Salaires
            var table =$('#_table').dataTable( {
                bAutoWidth: false,
                bPaginate: true,
                bInfo: false,
                bFilter: false,
                deferRender:    true,
                scrollCollapse: true,
                scroller:true,
                searching: true,
                responsive: false,
                iDisplayLength:10,
                oLanguage: {
                    "sZeroRecords": "Aucune ligne",
                    "sInfo": "Affichage de _START_ &agrave; _END_ sur _TOTAL_ lignes",
                    "sInfoEmpty": "Showing 0 to 0 of 0 records",
                    "sInfoFiltered": "(sur un total de _MAX_ lignes)",
                    "oPaginate": {"sPrevious": "Pr&eacute;c&eacute;dente","sNext": "Suivante"
                        ,"sFirst": "Premi&egrave;re","sLast": "Derni&egrave;re"},
                        "sSearch":"Chercher ",
                    buttons: {
                        colvis: 'Colonnes',
                        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'
                            }
                        }
                    },
                    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: 'print',exportOptions: {columns: ':visible'} },
                        'colvis'
                    ],

                    columnDefs: [ {
                        targets: [5,6,8,12,13,14],
                        visible: false
                    } ],

                    "order": [[ 0, "desc" ]],
            } );

            $.fn.dataTable.moment('D/M/YYYY');
       });
    </script>

@stop