@extends('layouts.dash')

@section('title') BalanceAUx @stop
@section('title_card') Balance Auxiliaire @stop
@section('subtitle_card',"")

@section('content')
    <div class="card">

        @if (Session::has('message'))
            <div class="alert alert-warning">{!! Session::get('message') !!}</div>
        @endif

        @if ($errors)
            @foreach ($errors->all() as $error)
                <div class='bg-danger alert'>{!! $error !!}</div>
            @endforeach
        @endif

        @if (Session::has('success'))
            <div class="alert alert-success">{!! \Session::get('success') !!}</div>
        @endif  

        <div class="card-header">
            <form class="form-inline">
                <div class='form-group'>
                    {!! html()->label('Date de début','date_debut') !!}&nbsp;&nbsp;
                    <div class='input-group date' id='datepicker_date_debut'>
                    {!! html()->text('date_debut', isset($date_deb)?$date_deb:'01/01/'.date('Y'))
                        ->attributes(['id'=>'date_debut','size'=>'10','placeholder' => 'JJ/MM/AAAA', 'class' => 'form-control']) !!}
                        <span class='input-group-addon'>
                            <span class='glyphicon glyphicon-calendar'></span>
                        </span>
                    </div>
                </div>
                <div class='form-group ml-4' style=''>
                    {!! html()->label('Date de fin','date_fin') !!}&nbsp;&nbsp;
                    <div class='input-group date' id='datepicker_date_fin'>
                    {!! html()->text('date_fin', isset($date_fin)?$date_fin:'31/12/'.date('Y'))
                        ->attributes(['id'=>'date_fin','size'=>'10','placeholder' => 'JJ/MM/AAAA', 'class' => 'form-control']) !!}
                        <span class='input-group-addon'>
                            <span class='glyphicon glyphicon-calendar'></span>
                        </span>
                    </div>
                </div>
                <div class='col-md-4 p-4' style="margin-top:5px" >
                    <a id='btn_filtre' class="btn btn-primary"  href="#" ><i class="fas fa-search"></i>&nbsp;Rechercher</a>
                </div>
            </form>
            <div class="row form-inline ">
                <div class='form-group'>
                    {!! html()->label('Journal','select_jnx') !!}&nbsp;&nbsp;
                    {!! html()->select('select_jnx')->options($liste_journaux)
                        ->value(isset($jnx)?$jnx:"")
                        ->placeholder('')->attributes(['id'=>'select_jnx','class' => 'form-control'])  !!}
                </div>
                <div class='form-group'>&nbsp;&nbsp;
                    {!! html()->label('Comptes Auxiliaires','select_compte_aux') !!}&nbsp;&nbsp;
                    {!! html()->select('select_compte_aux')->options($liste_comptes_aux)
                        ->value(isset($compte_aux)?$compte_aux:"")->placeholder('')
                        ->attributes(['id'=>'select_compte_aux','class' => 'form-control'])  !!}
                </div>
            </div>
        </div>

        <div class="card-body">
            <table id="_table" width="100%" class="table table-condensed table-bordered">
                <thead>
                    <tr>
                        <th width='1%'>Compte</th>
                        <th>Designation</th>
                        <th width='1%'>Débit</th>
                        <th width='1%'>Crédit</th>
                        <th width='1%'>Solde</th>
                    </tr>
                </thead>
                <tbody>
                    @php $total_debit=0;$total_credit=0;$solde=0; @endphp
                    @foreach ($liste_comptes as $compte)
                        @php
                            $total_debit+=$compte->debit;
                            $total_credit+=$compte->credit;
                        @endphp
                        @if($compte->debit||$compte->credit)
                        <tr class="">
                            <td class="">
                                @if($compte->designation)
                                <a title='Afficher le détail' class="btn btn-sm bg-info box_detail fancybox.iframe" href="{{ url('balance_aux_detail/'.$date_debUS.'/'.$date_finUS.'/'.$compte->compte_aux.'/'.$jnx) }}">
                                {!! $compte->compte_aux !!}
                                </a>
                                @else
                                    <span class="btn btn-sm bg-danger" title='Compte innexistant'>{!! $compte->compte_aux !!}</span>
                                @endif
                            </td>
                            <td >{!! $compte->designation !!}</td>
                            <td align="right">{!! $compte->debit !!}</td>
                            <td align="right">{!! $compte->credit !!}</td>
                            <td align="right">{!! $compte->debit-$compte->credit !!}</td>
                        </tr>
                        @endif
                    @endforeach
                </tbody>
                <tfoot>
                    <tr>
                        <th colspan="2"></th>
                        <th width='1%'style="text-align:right;color:darkred">{{ $total_debit }}</th>
                        <th width='1%'style="text-align:right;color:darkgreen">{{ $total_credit }}</th>
                        <th width='1%'style="text-align:right;color:darkblue">{{ $total_debit-$total_credit }}</th>
                    </tr>
                </tfoot>
            </table>
        </div>
    </div>
@endsection


@section('styles')
    <!-- FancyBox -->
    <link media="all" type="text/css" rel="stylesheet" href="{{ url('css/jquery.fancybox.css') }}">
    <link media="all" type="text/css" rel="stylesheet" href="{{ url('css/jquery.fancybox-buttons.css') }}">
@stop

@section('scripts')
    <!-- FancyBox -->
    <script src="{{ url('js/jquery.fancybox.js') }}"></script>
    
<script>
  $(function () {
    
    $('#datepicker_date_debut').datepicker({
        format: "dd/mm/yyyy",language: "fr",autoclose: true
    });

    $('#datepicker_date_fin').datepicker({
        format: "dd/mm/yyyy",language: "fr",autoclose: true
    });


    $('#select_compte_aux').change( function() {filtre();});
    $('#select_jnx').change( function() {filtre();});
    $('#btn_filtre').click( function() {filtre();});
    function filtre() {
        var compte_aux = $('#select_compte_aux').val();
        var jnx = $('#select_jnx').val();
        var date_dep=$('#date_debut').val();
        var date_fin=$('#date_fin').val();
        var t_date_dep = date_dep.split('/');
        if(!compte_aux) compte_aux=0;
        date_dep= t_date_dep[2]+"-"+t_date_dep[1]+"-"+t_date_dep[0];
        var t_date_fin = date_fin.split('/');
        date_fin= t_date_fin[2]+"-"+t_date_fin[1]+"-"+t_date_fin[0];
        var url="{!! url('balance_aux/') !!}/"+date_dep+"/"+date_fin+"/"+compte_aux+"/"+jnx ; 
        location.href=url;
    }

        $(".box_detail").fancybox({
            //maxWidth    : 800,
            //maxHeight   : 600,
            fitToView   : false,
            width       : '75%',
            //height      : '70%',
            autoSize    : true,
            autoScale   : false,
            closeClick  : true,
            openEffect  : 'fade',
            closeEffect : 'fade',
        });

    $("#_table").DataTable({
      "paging": true,
      "lengthChange": false,
      "searching": true,
      "ordering": true,
      "info": false,
      "responsive": true, 
      "autoWidth": true,
       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 à 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'
                    }
                }
        },
        dom: "<'row'<'col-sm-6'l><'col-sm-6'f>>" + "<'row'<'col-sm-12'tr>>" + "<'row'<'col-sm-4'i><'col-sm-6'B><'col-sm-2'p>>",
        "buttons": ["copy", "excel", "colvis"], //"print", "pdf", "csv", 
        "aaSorting": [
            [1,'asc']
        ],
        "columnDefs": [
            { "targets": [ 0], "orderable": true,"searchable": false},
        ]
    })
    .buttons().container().appendTo('#_table_wrapper .col-md-6:eq(0)');

  });
</script>
@endsection