@extends('app')
@section('content')
<div class="container-fluid">
	<div class="row">
		<div class="col-md-8 col-md-offset-2">
                    <div class="panel panel-default">
                        <div class="panel-heading"><center>Listado de Créditos del Cliente: <b>{{$ccli." ".$dcli}}</b></center></div>
                            <div class="panel-body">
                                <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                                    <ul class="nav navbar-nav navbar-right">				
                                      <!--  <li><a href="{{ url('/') }}"> Opciones </a></li>--> 
                                       <!-- <li><a href="{{ url('/Mod_usuario') }}"> Atras </a></li>-->
                                    </ul>
                                </div>
                                @if (count($errors) > 0)
                                        <div class="alert alert-danger">
						<strong>Whoops!</strong> Hay algunos problemas!!!.<br><br>
                                                    <ul>
							@foreach ($errors->all() as $error)
                                                            <li>{{ $error }}</li>
							@endforeach
                                                    </ul>
					</div>
				    @endif
                                        
                                    <div class="table-responsive">                                        
                                        <table class="table table-striped table-hover table-bordered">
                                            <tr>
                                                <th class="text-center"><input type="checkbox" id="select-all"></th>
                                                <th class="text-center">Factura</th>
                                                <th class="text-center" colspan="3">Valor</th>
                                                <th class="text-center">Usuario</th>
                                                <th class="text-center" colspan="2">Fecha</th>
                                                <th class="text-center">Acción</th>
                                            </tr>
                                            
                                            <tr class="text-info">
                                                <th class="text-center"></th>
                                                <th class="text-center">#</th>
                                                <th class="text-center">Compra</th>
                                                <th class="text-center">Abonado</th>
                                                <th class="text-center">Restante</th>
                                                <th class="text-center">Fiador</th>
                                                <th class="text-center">Venta</th>
                                                <th class="text-center">Actualización</th>
                                                <th class="text-center">Abonar</th>
                                            </tr>
                                            
                                            @foreach ($crecli as $item)
                                            <tr>
                                                <td class="text-center"><input type="checkbox" class="credito-checkbox" data-restante="{{$item->vcompra - $item->vpagado}}" value="{{$item->IdVenta_Fin}}" name="ventas_id[]"></td>
                                                <td class="text-right"><a href="../detcrecli/{{$item->idcredito}}/{{$item->IdVenta_Fin}}/{{$ccli}}" target="_blank">{{$item->IdVenta_Fin}}</a></td>
                                                <td class="text-right">{{$item->vcompra}}</td>
                                                <td class="text-right">{{$item->vpagado}}</td>
                                                <td class="text-right">{{$item->vcompra - $item->vpagado}}</td>
                                                <td class="text-right">{{$item->Nombres}} {{$item->Apellidos}}</td>
                                                <td class="text-right">{{$item->created_at}}</td>
                                                <td class="text-right">{{$item->updated_at}}</td>
                                                <td class="text-right"><a href="../abocrecli/{{$item->IdVenta_Fin}}/{{$ccli}}" target="_blank"><img src="{{url('images/dine.png')}}" width="50px" height="30px" /></a></td>
                                            </tr>
                                            @endforeach
                                                <tr><td colspan="7"></td></tr>
                                                <tr>
                                                  <td class="text-right"></td>
                                                  <td class="text-right"><b>Total:</b></td>
                                                  <td class="text-right">{{$sumcom}}</td>
                                                  <td class="text-right">{{$sumpag}}</td>
                                                  <td class="text-right">{{$sumcom-$sumpag}}</td>
                                                  <td colspan="4"></td>
                                                </tr>

                                                <tfoot>
                                <tr>
                                    <td colspan="4" class="text-right"><b>Total seleccionado:</b></td>
                                    <td class="text-right" id="total-seleccionado">0</td>
             
                                    <td colspan="4" class="text-center">
                                        {!! Form::open(['route' => 'credito.pagarTodo', 'method' => 'POST']) !!}
                                            {!! Form::hidden('cliente_id', $ccli) !!}
                                            <input type="hidden" name="ventas_id[]" id="ventas-seleccionadas">
                                            {!! Form::submit('Pagar Todo', ['class' => 'btn btn-success', 'onclick' => "return confirm('¿Estás seguro de que deseas pagar todos los créditos seleccionados?')"]) !!}
                                        {!! Form::close() !!}
                                    </td>
                                </tr>

                            </tfoot>
                                                
                                        </table>                                        
                                    </div>
			</div>
		</div>
	</div>
</div>

<script>
    document.getElementById('select-all').addEventListener('click', function() {
        const checkboxes = document.querySelectorAll('.credito-checkbox');
        checkboxes.forEach(chk => chk.checked = this.checked);
        calcularTotalSeleccionado();
    });

    document.querySelectorAll('.credito-checkbox').forEach(chk => {
        chk.addEventListener('change', calcularTotalSeleccionado);
    });

    function calcularTotalSeleccionado() {
        let total = 0;
        const checkboxes = document.querySelectorAll('.credito-checkbox:checked');
        const ids = [];

        checkboxes.forEach(chk => {
            total += parseFloat(chk.getAttribute('data-restante'));
            ids.push(chk.value);
        });

        document.getElementById('total-seleccionado').innerText = total.toFixed(2);
        document.getElementById('ventas-seleccionadas').value = ids.join(',');
    }
</script>
@endsection