@extends('base')
@section('title')
Caja Chica
@endsection

@section('extracss')
   <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
@endsection
@section('extrajs')
   <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
   <script>
       function limpiarCampos() {

       }
       let inputMonto = document.getElementById('monto');
       let checkCotrans = document.getElementById('include_contrans_check');
       let inputContrans = document.getElementById('fovial_cotrans');
       let inputTotal =  document.getElementById('total');
       let inputIva = document.getElementById('iva');
       let inputCompraExenta = document.getElementById('compra_exenta');
       let renta = 0;
        $(document).ready(function() {
            $('#cliente-select').select2();
            document.querySelector('#cliente-select').parentElement.querySelector('span.select2-container').style.width="100%"
            });
        function onChangeTipoDocumento(documentosSelect) {
            let option = documentosSelect.selectedOptions[0];
            if(option.value == 3){
                inputIva.value = "0.00";
                inputIva.readOnly = true;
            }
            else{
                inputIva.value = (inputMonto.value*0.13).toFixed(2);
                inputIva.readOnly = false;
            }
            actualizarTotal();
        }
        function onSetMonto(montoInput){
            inputIva.value = (montoInput.value*0.13).toFixed(2);
            onCheckCotrans(checkCotrans);
        }
        function onCheckCotrans(checkbox){
            if(checkbox.checked){
                // inputContrans.value = (inputMonto.value*0.1).toFixed(2);
                inputContrans.readOnly = false;
            }
            else{
                inputContrans.value = "0.00";
                inputContrans.readOnly = true;

            }
            actualizarTotal();
        }
        function onCheckRenta(checkbox){
            if(checkbox.checked)
                renta = (inputMonto.value*0.1).toFixed(2);

            else
                renta = 0;
            actualizarTotal();
        }
        function actualizarTotal() {
            inputTotal.value = (parseFloat(inputMonto.value)
            + parseFloat(inputIva.value) + parseFloat(inputContrans.value)
            - parseFloat(inputCompraExenta.value==""?"0":inputCompraExenta.value) - parseFloat(renta)).toFixed(2);
        }
   </script>
@endsection
@section('content')
<!-- Mensaje ocupado -->
@if(session('ocupado'))
<div class="alert alert-danger">
    <button type="button" class="close" data-dismiss="alert">×</button>
    {{ session('ocupado') }}
</div>
@endif


<nav aria-label="breadcrumb">
   <ol class="breadcrumb">
       <li class="breadcrumb-item active" aria-current="page">Caja Chica</li>
   </ol>
</nav>

<!-- Boton agregar cotizacion modal -->
<!--can('CotizacionInicial.store')-->
<div class="d-sm-flex align-items-center justify-content-between mb-4">
   <button type="button" class="btn btn-primary" onclick="limpiarCampos()" data-toggle="modal" data-target="#modalCajaChica">
      Agregar
   </button>
   <button type="button" class="btn btn-primary" onclick="" data-toggle="modal" data-target="#modalLiquidarCajaChica">
    Liquidar Caja
 </button>
 <div class="d-flex" style="gap:1rem;">
    <div class="form-group">
         <label for="monto_caja">Monto de Caja:</label>
         <input type="text" name="monto_caja" disabled readonly class="form-control" value="500.00">
    </div>
    <div class="form-group">
        <label for="restante">Restante:</label>
        <input type="text" name="restante" id="caja_restante" disabled readonly class="form-control" value="">
    </div>

 </div>
</div>
<!--endcan-->
<!-- Fin Boton agregar cotizacion modal -->

<!-- Mensaje Exito -->
@if(session('exito'))
<div class="alert alert-success">
   <button type="button" class="close" data-dismiss="alert">×</button>
   {{ session('exito') }}
</div>
@endif
@if ($errors->any())
    <div class="errors">
        <p class="alert alert-warning" role="alert">Por favor corrige los siguientes errores</p>
        <ul>
            @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
            @endforeach
        </ul>
    </div>
@endif
<!-- Fin Mensaje Exito -->
{{-- @if(count($cotizaciones) > 0) --}}
<br>

<!-- Table -->
<div class="table-responsive">
<table class=" table">
   <thead class="thead-dark" style="width: auto;">
      <tr>
         <th scope="col">ITEM</th>
         <th scope="col">FECHA</th>
         <th scope="col">NO. CCF</th>
         <th scope="col">NO. FACT.</th>
         <th scope="col">RECIBO/TICKET</th>
         <th scope="col">NOMBRE DEL PROVEEDOR</th>
         <th scope="col">DESCRIPCION</th>
         <th scope="col">MONTO</th>
         <th scope="col">IVA</th>
         <th scope="col">FOVIAL COTRANS</th>
         <th scope="col">COMPRA EXENTA</th>
         <th scope="col">RENTA</th>
         <th scope="col">TOTAL</th>
      </tr>
   </thead>
   <tbody>
        @php
            $i=1;
            $suma_total = 0;
        @endphp
      @foreach ($documentos as $documento)
      <tr>
        <td style="width:auto;"> {{ $i }} </td>
        <td style="width:auto;"> {{ $documento->fecha }} </td>
        <td style="width:auto;">
            @if($documento->tipo_doc==1)
                {{ $documento->n_doc }}
            @endif
        </td>
        <td style="width:auto;">
            @if($documento->tipo_doc==2)
                {{ $documento->n_doc }}
            @endif
        </td>
        <td style="width:auto;">
            @if($documento->tipo_doc==3)
                {{ $documento->n_doc }}
            @endif
        </td>
        <td style="width:auto;"> {{ $documento->supplier->nombreProveedor }} </td>
        <td style="width:auto;"> {{ $documento->descripcion }} </td>
        <td style="width:auto;"> {{ $documento->monto }} </td>
        <td style="width:auto;"> {{ $documento->iva }} </td>
        <td style="width:auto;"> {{ $documento->fovial_cotrans }} </td>
        <td style="width:auto;"> {{ $documento->compra_exenta }} </td>
        <td style="width:auto;"> {{ $documento->renta }} </td>
        <td style="width:auto;"> {{ $documento->total }} </td>

     </tr>
     @php
         $i++;
         $suma_total += $documento->total;
     @endphp
      @endforeach
   </tbody>
</table>
</div>



@include('compra.modals.modalCajaChica')
@include('compra.modals.modalLiquidarCajaChica')
<script>
    document.getElementById('caja_restante').value = (500-{{$suma_total}}).toFixed(2);

</script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<script>
    $(document).ready(function(){
        $('#cuenta_contable').select2();
    });

</script>
@endsection