@extends('layouts.app')
@extends('contabilidad.menu')
@section('content')
    <style>

        .form-check {
            display: inline-block;
            top: -15px;
            left: 13px;
        }
        .colorAmarillo{
            background-color: #ffc107!important;
            font-weight: 600;
        }
        .colorAmarillo .sorting_1{
            background-color: #ffc107!important;
            font-weight: 600;
        }
    </style>

    <div class="container date-consult">
        <div class="row">
            <div class="md-col-6 my-4">
                <form action="{{ route('contabilidad.dashboard_recibos') }}" method="POST">
                    @csrf
                    <div class="d-flex flex-column justify-content-center">
                        <div class="d-flex justify-content-center align-items-center">
                            <p class="font-weight-bolder text-uppercase">Fecha Inicio: <input class="date-picker"
                                    type="date" name="fechaInicio" id="datepicker"></p>
                            <p class="font-weight-bolder text-uppercase">Fecha Final: <input class="date-picker"
                                    type="date" name="fechaFin" id="datepicker2"></p>
                            @if (isset($salidasAlmacen->fechaInicio))
                                <div class="d-flex">
                                    <p class="blockquote mx-2">Fecha consultada</p>
                                    <p class="blockquote"> del  <strong>{{ $salidasAlmacen->fechaInicio }}  </strong></p>
                                    <p class="blockquote">- al -<strong>{{ $salidasAlmacen->fechaFin }} </strong></p>
                                </div>
                            @endif
                        </div>
                        <button type="submit" class="btn btn-dark mx-auto">Consultar</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
<br><br>
        @csrf
        <div id="contenedor-dashboard" class="container-fluid">
            <div class="col-md-12">
                <a type="button" href="{{route('contabilidad.recibo_caja_facturas_nuevo')}}" class="botonColor">Nuevo Recibo</a>
                <br><br>
              </div>
            <div class="row ">
                <div class="col-md-12">
                    <h2>Recibos de Caja</h2>
                </div>
            </div>
            <div class="col-md-12">
                <br>

                <table id="example2" class="display" style="width:100%">
                    <thead>
                        <tr>
                            <td>ID</td>
                            <td>Fecha</td>
                            <td>Cliente</td>
                            <td>Recibo de Caja #</td>
                            <td>Anticipos</td>
                            <td>Total</td>
                            <td>Acción</td>
                        </tr>
                    </thead>
                    <tbody>
                                                @foreach ($salidasAlmacen as $op)
                            <tr>
                                <td>{{ $op->id }}</td>
                                <td>{{ date('d/m/Y h:i:s', strtotime($op->created_at)) }}</td>
                                <td>{{ $op->cliente->nombre ?? '' }}</td>
                                
                                <td>{{ $op->recibo_caja_numero ?? '' }}</td>
                                <td>
                                    @if ($op->saldo_favor>0)
                                        -{{number_format($op->saldo_favor, 2, '.', ',')}}
                                    @endif
                                    @if ($op->nombre_imagen_recibo)
                                    <a href="{{ asset('/recibo_caja/' . $op->nombre_imagen_recibo ?? '') }}"
                                        target='_blank'><i class="fas fa-camera"></i>
                                        {{ $op->recibo_caja_numero ?? '' }}</a>
                                    @else
                                        
                                    @endif
                                </td>
                                <td>{{ number_format($op->id_total, 2, '.', ',') }}</td>
                                <td>
                                    <a href="{{route('contabilidad.editar_recibos',$op->id)}}" title="Editar recibo"><i class="fas fa-edit"></i></a>
                                    <a href="{{route('contabilidad.regresar_recibos',$op->id)}}" class="revertir_recibo" title="Revertir recibo"><i class="fas fa-undo-alt"></i></a>
                                    <a href="{{route('contabilidad.imprimir_recibo',$op->id)}}" title="Imprimir Recibo"><i class="fas fa-print"></i></a>
                                </td>
                                                            </tr>
                        @endforeach
                    </tbody>
                    <tfoot>
                        <tr class="colorAmarillo">
                            <td>.TOTAL</td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td id="data1">
                                
                            </td>
                            <td></td>
                        </tr>
                    </tfoot>
                </table>
    </div>
    </div>
    <script>
        jQuery.fn.dataTable.Api.register( 'sum()', function ( ) {
    return this.flatten().reduce( function ( a, b ) {
        if ( typeof a === 'string' ) {
            a = a.replace(/[^\d.-]/g, '') * 1;
        }
        if ( typeof b === 'string' ) {
            b = b.replace(/[^\d.-]/g, '') * 1;
        }
 
        return a + b;
    }, 0 );
  } );
         $('#example2').DataTable({
            "order":[[ 0, "desc" ]],
            "paging": false,
            dom: 'Bfrtip',
            buttons: [
                'excel', 'print'
            ],

            responsive:{
                breakpoints: [
                    { name: 'desktop', width: 920 },
                    { name: 'tablet',  width: 768 },
                    { name: 'fablet',  width: 668},
                    { name: 'phone',   width: 480 }
                ]
            },
            drawCallback: function () {
                var api = this.api();

                let dollarUSLocale = Intl.NumberFormat('en-IN');
                $( "#data1" ).html(
                    api.column( 5, {page:'current'} ).data().sum().toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,')
                );
                
            }
            
        });
        $('.revertir_recibo').click(function(){
            var confirmar= confirm("Esta seguro de querer revertir la operación");
            if(confirmar){

            }else{
                return false;
            }
        })
        $("#fechaInicio").datepicker();
        $("#fechaFin").datepicker();
    </script>
@endsection