@extends('layouts.app')

@section('content')
 
<div class="breadcomb-area">
    <div class="container">
        <div class="row">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div class="breadcomb-list">
                    <div class="row"> 

 
                        <div class="col-12">
                            @include('layouts.alertas')
                        </div>

                        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                            <div class="breadcomb-wp">
                                <div class="breadcomb-icon">
                                    <i class="fas fa-boxes"></i>
                                </div>
                                <div class="breadcomb-ctn">
                                    <h2>Administrador de Facturas Credito</h2>                                     
                                </div>
                            </div> 
                        </div>
                        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-3">

                            <!--
                            <div class="breadcomb-report">

                                
                                <a href="{{ url('cotizaciones/create') }}">
                                    <button data-placement="left" title="" class="btn waves-effect" h data-original-title="Crear nueva categoria">
                                        <i class="fas fa-plus"></i> Pagar Crédito
                                    </button>
                                </a> 
                                <a href="javascript:imprSelec('ListadoCotizaciones')"><button data-placement="left" title="" class="btn waves-effect" >
                                    <i class="fas fa-print"></i> 
                                </button></a>
                            </div> -->

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>




<!-- DATOS NUMERICOS -->
<div class="breadcomb-area">
    <div class="container">
        <div class="grid-1">
            <div class="col-3_sm-6_xs-12">
                <div class="contenedor_info_cigfras">
                    <h5>TOTAL FACTURAS CRÉDITOS</h5>
                    <h2 id="total_facturas">{{$total_facturas}}</h2>
                </div>
            </div>


            <div class="col-3_sm-6_xs-12">
                <div class="contenedor_info_cigfras">
                    <h5>TOTAL SALDADAS</h5>
                    <h2 id="facturas_saldadas">{{$total_saldadas}}</h2>
                </div>
            </div>


            <div class="col-3_sm-6_xs-12">
                <div class="contenedor_info_cigfras">
                    <h5>FACTURAS MES</h5>
                    <h2 id="facturas_mes">{{$total_mes}}</h2>
                </div>
            </div>

            <div class="col-3_sm-6_xs-12">
                <div class="contenedor_info_cigfras">
                    <h5>FACTURAS PENDIENTES</h5>
                    <h2 <h2 id="facturas_pendientes">{{$total_pendientes}}</h2>
                </div>
            </div>

        </div>
    </div>
</div>





<!-- TABLA DE FACTURAS CREDITOS POR COBRAR -->
<div class="data-table-area">
    <div class="container">
        <div class="row" id="ListadoCotizaciones">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div class="data-table-list">
                    <div class="basic-tb-hd">
                        <h2>Tabla de Facturas Crédito</h2> 
                        <p>Listado de todas las facturas a crédito creadas en el sistema con todos los detalles</p>
                    </div>


                    <div class="table-responsive">  
                        <div id="data-table-basic_wrapper" class="dataTables_wrapper">

                            <table id="data-table-basic" class="table table-striped dataTable" role="grid" aria-describedby="data-table-basic_info">
                                <thead>
                                    <tr role="row">

                                        <th class="sorting_asc" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" aria-sort="ascending">N. Factura</th>

                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Cliente</th>

                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Vendedor</th>
                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Total</th>

                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Fecha</th>
                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Acciones </th>

                                    </tr>
                                </thead>
                                <tbody class="creditos_pendientes" id="creditos_pendientes"> 
                                    @foreach($data as $datos)


                                        <tr role="row" class="odd">
                                                <td class="sorting_1" style="position: relative;">
                                                    {{ sprintf("FAC-%'.06d", $datos->id) }}
                                               
                                                </td>

                                                <td>
                                                    {{$datos->cliente}}
                                                    <h6>{{$datos->documento}} / {{$datos->telefono}}</h6>
                                                </td>

                                                <td>
                                                    {{$datos->vendedor}}
                                                    <h6>{{$datos->documento}}</h6>
                                                </td>


                                                <td>
                                                    <strong>RD$ {{ number_format($datos->total, 2) }}</strong>
                                                    <h6 style="color: green;">Recibido: RD$ {{ number_format($datos->recibido, 2) }}</h6>

                                                    @php $restante = $datos->total - $datos->recibido; @endphp

                                                    <h6 style="color: red; margin-top: -10px;">Restante: RD$ {{ number_format( $restante, 2) }}</h6>
                                                </td>

                                                <td>
                                                    {{ Carbon\Carbon::parse($datos->fecha)->format('d M Y') }}
                                                    <h6>{{ Carbon\Carbon::parse($datos->fecha)->diffForHumans() }}</h6> 
                                                </td>


                                                <td>

                                                    <button type="button" id="{{$datos->id}}" class="btn btn-primary abrir_datos">Ver registro</button>
                                                    
                                                </td>
                                            
                                        </tr>
                                            
                                    @endforeach
                                </tbody>
                                <tfoot>
                                    <tr>
                                         <th class="sorting_asc" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" aria-sort="ascending">N. Factura</th>

                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Cliente</th>

                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Vendedor</th>
                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Total</th>

                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Fecha</th>
                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Acciones </th>
                                      
                                    </tr>
                                </tfoot>
                            </table> 
                        </div>
                    </div>
                    
                </div>
            </div>
        </div>
    </div>
</div>



<!-- TABLA DE FACTURAS CREDITOS SALDADAS -->
<div class="data-table-area">
    <div class="container">
        <div class="row" id="ListadoCotizaciones">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div class="data-table-list">
                    <div class="basic-tb-hd">
                        <h2>Tabla de Facturas Crédito Pagadas</h2> 
                        <p>Listado de todas las facturas a crédito pagadas en el sistema con todos los detalles</p>
                    </div>



                    <div class="table-responsive">  
                        <div id="data-table-basic_wrapper" class="dataTables_wrapper">

                            <table id="data-table-basic" class="table table-striped dataTable" role="grid" aria-describedby="data-table-basic_info">
                                <thead>
                                    <tr role="row">
                                        <th class="sorting_asc" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" aria-sort="ascending">N. Factura</th>
                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Cliente</th>
                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Vendedor</th>
                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Total</th>
                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Fecha</th>
                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Acciones </th>
                                    </tr>
                                </thead>
                                <tbody class="Creditospagados" id="Creditospagados"> 
                                    @foreach($all as $datos)

                                        <tr role="row" class="odd">
                                                <td class="sorting_1" style="position: relative;">
                                                    {{ sprintf("FAC-%'.06d", $datos->id) }}                                               
                                                </td>
                                                <td>
                                                    {{$datos->cliente}}
                                                    <h6>{{$datos->documento}} / {{$datos->telefono}}</h6>
                                                </td>
                                                <td>
                                                    {{$datos->vendedor}}
                                                    <h6>{{$datos->documento}}</h6>
                                                </td>
                                                <td>
                                                    <strong>RD$ {{ number_format($datos->total, 2) }}</strong>
                                                    <h6 style="color: green;">Recibido: RD$ {{ number_format($datos->recibido, 2) }}</h6>

                                                    @php $restante = $datos->total - $datos->recibido; @endphp
                                                    <h6 style="color: red; margin-top: -10px;">Restante: RD$ {{ number_format( $restante, 2) }}</h6>
                                                </td> 
                                                <td>
                                                    {{ Carbon\Carbon::parse($datos->fecha)->format('d M Y') }}
                                                    <h6>{{ Carbon\Carbon::parse($datos->fecha)->diffForHumans() }}</h6> 
                                                </td>
                                                <td>
                                                    <span class="dropdown boton_more_table">
                                                            <button id="btnSearchDrop2" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" class="btn btn-primary dropdown-toggle dropdown-menu-right ">
                                                                ACCIONES
                                                            </button>
                                                        
                                                            <span aria-labelledby="btnSearchDrop2" class="dropdown-menu mt-1 dropdown-menu-right option_drown drown_option">
                                                                <div class="opcion">
                                                                    <a href="{{ route('Facturas.Show', ['id' => $datos->id]) }}" class="dropdown-item">
                                                                        <i class="fas fa-user-circle"></i> Ver Factura
                                                                    </a>
                                                                </div> 
                                                                <div class="opcion">
                                                                    <button id="{{$datos->id}}" class="dropdown-item abrir_datos_finalizado" style="background-color: #fff; border: none;" >
                                                                        <i class="fas fa-user-circle"></i> Ver Recibos
                                                                    </button>
                                                                </div>     
                                                            </span>
                                                        </span>                                                    
                                                </td>                                            
                                        </tr>
                                            
                                    @endforeach
                                </tbody>
                                <tfoot>
                                    <tr>
                                         <th class="sorting_asc" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" aria-sort="ascending">N. Factura</th>

                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Cliente</th>

                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Vendedor</th>
                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Total</th>

                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Fecha</th>
                                        <th class="sorting" tabindex="0" aria-controls="data-table-basic" rowspan="1" colspan="1" >Acciones </th>
                                      
                                    </tr>
                                </tfoot>
                            </table> 
                        </div>
                    </div>
                    
                </div>
            </div>
        </div>
    </div>
</div>



<!-- CONTENEDOR EMERGENTE --->
<div id="emergente_incompleto" class="contenedor_emergente_credito">
    <div class="contenedor_centro_credito">

        <div class="header_conte">
            <h5>Datos de la factura de crédito</h5>
            <div class="exit_credito">
                <i class="fas fa-times close_window_credito" id="close_window_credito"></i>
            </div>
        </div>

        <div class="informacion">
            <div class="grid-1-noGutter">
                <div class="col-8 datos_facturas">
                    <div class="grid-1-noGutter">
                        <div class="col-4_xs-12">
                            <p>Metodos registrados</p>
                        </div>

                        <div class="col-4_xs-12">
                            <h5>ID factura:  FAC-0000<span class="id_factura"></span></h5>
                        </div>
                    </div>
                    
                    <div class="contenedor_resultado">

                        <!-- AQUI MONTAMOS LOS DATOS TRAIDOS POR EL CONTROLLADOR -->
                        <div class="contenedor_datos_factura">
                           <div class="viejos_inscritos"></div>
                            
                           <form action="{{ route('Pago.Credito.Store') }}" id="CreditoFormStore" method="POST" accept-charset="utf-8">
                              <input type="hidden" name="id_factura" id="id_factura">
                              <div class="nuevos_inscritos">
                                    
                              </div>
                           </form>
                        </div>

                    </div>

                    <div class="montofinal">
                        <h5>Monto total: RD$<b class="monto_total"></b></h5>
                        <input type="hidden" id="monto_total">

                        <h5>Monto recibido: RD$<b class="monto_recibido"></b></h5>
                        <input type="hidden" name="monto_recibido" id="monto_recibido_hidden" value="0">

                        <h5>Monto restante: RD$<b class="monto_restante"></b></h5>
                        <input type="hidden" name="monto_restante" id="monto_restante_hidden">
                    </div>
                </div>



                <div class="col-4">
                    <p>Añadir nuevo pago</p>

                    <form action="index_submit" method="get" accept-charset="utf-8">
                        <div class="form-group">
                            <label>Seleccione el metodo</label>
                            <select class="form-control" id="select_method">
                                <option>Seleccione el metodo</option>}
                                option
                                @foreach($metodos_pago as $value)
                                    @if($value->nombre == 'Credito 15' || $value->nombre == 'Credito 30' || $value->nombre == 'Credito 60' || $value->nombre == 'Nota de crédito')

                                    @else
                                         <option value="{{$value->nombre}}">{{$value->nombre}}</option>
                                    @endif
                                   
                                @endforeach
                            </select>
                        </div>


                        <div class="contenedor_inputs"></div>


                        <div class="buttons_options" style="display: flex; justify-content: space-between;">
                            <div  class="btn btn-warning" id="limpiar_form" style="width: 50%;"><i class="fas fa-minus"></i> Limpiar</div>
                            <div class="btn btn-success" id="agregar_lista" style="width: 50%;"><i class="fas fa-plus"></i> Agregar</div>
                        </div>
                        
                    </form>

                    <div id="procesar_facturas" class="btn btn-primary" style="width: 100%; margin-top: 10px;"><i class="fas fa-plus"></i> Procesar metodos de pago</div>
                    
                </div>
            </div>
            
        </div>

        
    </div>
</div>

<div id="emergente_done" class="contenedor_emergente_credito">
    <div class="contenedor_centro_credito">

        <div class="header_conte">
            <h5>Datos de la factura de crédito</h5>
            <div class="exit_credito">
                <i class="fas fa-times close_window_credito" id="close_window_credito"></i>
            </div>
        </div>

        <div class="informacion">
            <div class="grid-1-noGutter">
                <div class="col-12 datos_facturas">
                    <div class="grid-1-noGutter">
                        <div class="col-4_xs-12">
                            <p>Metodos registrados</p>
                        </div>

                        <div class="col-4_xs-12">
                            <h5>ID factura:  FAC-0000<span class="id_factura"></span></h5>
                        </div>
                    </div>
                    
                    <div class="contenedor_resultado">

                        <!-- AQUI MONTAMOS LOS DATOS TRAIDOS POR EL CONTROLLADOR -->
                        <div class="contenedor_datos_factura">
                           <div class="viejos_inscritos"></div>
                            
                           <form action="{{ route('Pago.Credito.Store') }}" id="CreditoFormStore" method="POST" accept-charset="utf-8">
                              <input type="hidden" name="id_factura" id="id_factura">
                              <div class="nuevos_inscritos">
                                    
                              </div>
                           </form>
                        </div>

                    </div>

                    <div class="montofinal">
                        <h5>Monto total: RD$<b class="monto_total"></b></h5>
                        <input type="hidden" id="monto_total">

                        <h5>Monto recibido: RD$<b class="monto_recibido"></b></h5>
                        <input type="hidden" name="monto_recibido" id="monto_recibido_hidden" value="0">

                        <h5>Monto restante: RD$<b class="monto_restante"></b></h5>
                        <input type="hidden" name="monto_restante" id="monto_restante_hidden">
                    </div>
                </div>
            </div>
            
        </div>

        
    </div>
</div>

<iframe id="printf" name="printf" style="width: 0; height: 0; padding: 0; margin: 0;"></iframe>

<script>

    
    setInterval(function(){

        var url = '{{ route("PagoCredito.Refresh") }}';
        $.ajax({
            method: 'POST',
            url: url,
            data: '',
            beforeSend: function(){
               //console.log('loading')
               $('#creditos_pendientes').html('<p>loading...</p>');
               $('#Creditospagados').html('<p>loading...</p>');
            },
            success: function (mensaje) {

                var result = $.parseJSON(mensaje);

                if (mensaje.length ) {
                    $('#creditos_pendientes').html('');
                    $('#creditos_pendientes').append(result[0]);

                    $('#Creditospagados').html('');
                    $('#Creditospagados').append(result[1]);

                    document.getElementById('total_facturas').value= result[2]
                    document.getElementById('facturas_saldadas').value= result[3]
                    document.getElementById('facturas_mes').value= result[4]
                    document.getElementById('facturas_pendientes').value= result[5]

                } else{
                    $('#creditos_pendientes').html('');
                    $('#Creditospagados').html('');
                    console.log('funciona pero vacio')
                }  
               
            },
            error: function (xhr, status) {
                $('#contenedor_resultado_caja').html('<p>error</p>');
                console.log(xhr);
                console.log(status);
            } 
        }); 
    }, 10000);






    
</script>






@endsection