@extends('adminlte::page')

@section('title', 'Soportes Transferencias de Ley')

@section('content_header')
    <h1>Cargar soporte pagos transferencias de Ley Autoridades de Tránsito</h1>
@stop

@section('content')

    <section class="section">
        <div class="container">
            <div class="columns">
                <div class="column">
                    @if ($errors->any())
                        <div class="notification is-danger is-light">
                            <ul>
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    @endif

                    <form action="{{ route('admin.pagos.store') }}" method="POST" enctype="multipart/form-data">
                        @csrf
                        <div class="form-group">
                            {!! Form::label('divipo_id', 'Seleccione cuenta recaudo externo para adjuntar soportes') !!}
                            <select class="form-select form-select-sm" name="divipo_id" id="divipo_id">
                                @foreach ($areaList as $item)
                                    <option value="{{$item->id}}"> {{$item->municipio}}</option>
                                @endforeach
                            </select>
                            
                            @error('divipo_id')
                            <span class="text-danger">{{$message}}</span>
                            @enderror
                        </div>

                        <div class="form-group">
                            {!! Form::label('banco_id', 'Banco recaudador') !!}
                            <select class="form-select form-select-sm" name="banco_id" id="banco_id">
                                @foreach ($areaList2 as $item)
                                    <option value="{{$item->id}}"> {{$item->nombre}}</option>
                                @endforeach
                            </select>
            
                            @error('banco_id')
                            <span class="text-danger">{{$message}}</span>
                            @enderror
                        </div>

                        <div class="form-group">
                            {!! Form::label('tipoingreso', 'Tipo de Ingreso') !!}
                            {!! Form::select('tipoingreso', ['Diario' => 'Diario', 'Mensual' => 'Mensual'],null ,['class'=>'form-select form-select-sm','placeholder' => 'Seleccione...']) !!}   
                           
                            @error('tipoingreso')
                            <span class="text-danger">{{$message}}</span>
                            @enderror
                        </div>

                        <div class="form-group">
                            {!! Form::label('jurisdiccion', 'Jurisdiccion') !!}
                            {!! Form::select('jurisdiccion', ['Urbano' => 'Urbano', 'Via_Nacional' => 'Via Nacional'],null ,['class'=>'form-select form-select-sm','placeholder' => 'Seleccione...']) !!}   
                           
                            @error('jurisdiccion')
                            <span class="text-danger">{{$message}}</span>
                            @enderror
                        </div>
                        
                        <div class="form-group">
                            {!! Form::label('cuantia', 'Cuantia') !!}
                            {!! Form::select('cuantia', ['10' => '10%', '45' => '45%', '55' => '55%'],null ,['class'=>'form-select form-select-sm','placeholder' => 'Seleccione...']) !!}   
                           
                            @error('cuantia')
                            <span class="text-danger">{{$message}}</span>
                            @enderror
                        </div>
                        

                        <div class="form-group">
                            {!! Form::label('valor45', 'Valor 45%') !!}
                            {!! Form::text('valor45', null, ['id'=>'bloquear','class'=>'form-control form-control', 'onblur'=>'sumar();','onKeypress'=>"if (event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;",'placeholder'=>'Valor 45%']) !!}

                            @error('valor45')
                            <span class="text-danger">{{$message}}</span>
                            @enderror
                        </div>

                        <div class="form-group">
                            {!! Form::label('valor10', 'Valor 10%') !!}
                            {!! Form::text('valor10', null, ['id'=>'bloquear1','type'=>'number','class'=>'form-control form-control', 'onblur'=>'sumar();','onKeypress'=>"if (event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;",'placeholder'=>'Valor 10%']) !!}
                            
                            @error('valor10')
                            <span class="text-danger">{{$message}}</span>
                            @enderror
                        </div>

                        <div class="form-group">
                            {!! Form::label('valor', 'Valor Total') !!}
                            {!! Form::text('valor', null, ['id'=>'total1','type'=>'number','class'=>'form-control form-control' ,'onKeypress'=>"if (event.keyCode < 45 || event.keyCode > 57) event.returnValue = false;",'placeholder'=>'Valor Total']) !!}
                            
                            @error('valor')
                            <span class="text-danger">{{$message}}</span>
                            @enderror
                        </div>

                        <div class="form-group">
                            {!! Form::label('fechadesde', 'Fecha desde') !!}
                            {!! Form::text('fechadesde', null, ['id'=>'fromDate','class'=>'form-control form-control-sm', 'placeholder'=>'Fecha donde inicia el cobro']) !!}
                            
                            @error('fechadesde')
                                <span class="text-danger">{{$message}}</span>
                            @enderror
                        </div>
            
                        <div class="form-group">
                            {!! Form::label('fechahasta', 'Fecha hasta') !!}
                            {!! Form::text('fechahasta', null, ['id'=>'toDate','class'=>'form-control form-control-sm', 'placeholder'=>'Fecha donde finaliza el cobro']) !!}
                            
                            @error('fechahasta')
                                <span class="text-danger">{{$message}}</span>
                            @enderror
                        </div>

                        <div class="form-group">
                            {!! Form::label('fechapago', 'Fecha pago') !!}
                            {!! Form::text('fechapago', null, ['id'=>'datepicker','class'=>'form-control form-control-sm', 'placeholder'=>'Fecha pago']) !!}
                            
                            @error('fechapago')
                                <span class="text-danger">{{$message}}</span>
                            @enderror
                        </div>

                        <div class="form-group">
                            {!! Form::label('observacion', 'Observaciones pago') !!}
                            {!! Form::textarea('observacion', null, ['class'=>'form-control form-control-sm', 'placeholder'=>'Observaciones pago']) !!}
                            
                            @error('observacion')
                                <span class="text-danger">{{$message}}</span>
                            @enderror
                        </div>


                        <hr class="mx-n3">
                        
                        {!! Form::label('Soporte', 'Soporte Transferencia PDF') !!}

                        <label class="is-block mb-4">
                            <span class="file has-name is-fullwidth">
                                <label class="file-label">
                                    <input class="form-control form-control-sm" type="file" name="file_upload" accept=".pdf"/>
                                </label>
                            </span>
                        </label>

                        <hr class="mx-n3">

                        {!! Form::label('Soporte', 'Soporte Transferencia Excel (Opcional)') !!}

                        <label class="is-block mb-4">
                            <span class="file has-name is-fullwidth">
                                <label class="file-label">
                                    <input class="form-control form-control-sm" type="file" name="file_upload_excel" accept=".xls,.xlsx"/>
                                </label>
                            </span>
                        </label>
                                                                      
                                                   
                        <div class="field is-grouped mt-3">
                            
                            <div class="control">
                                <button type="submit" class="btn btn-primary btn-sm">Cargar</button>
                            </div>

                            <hr class="mx-n3">
                               
                            <div class="control">
                                <a href="{{ route('admin.pagos.index') }}" class="btn btn-danger btn-sm">Regresar</a>
                            </div>
                        </div>
                            
                    </form>
                </div>
            </div>
        </div>
    </section>

@stop

@section('css')

<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.3/themes/base/jquery-ui.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">


<style>
    .progress { position:relative; width:100%; }
    .bar { background-color: #2dab27; width:0%; }
    .percent { position: relative; display: block; left:50%; color: #040608; text-align: center;}    
</style>

@endsection

@section('js')

<script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
<script src="https://code.jquery.com/jquery-3.7.1.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.form/4.3.0/jquery.form.min.js"></script>
<script src="https://code.jquery.com/ui/1.13.3/jquery-ui.js"></script>
    
<script type="text/javascript">
        $(document).ready(function() {
            $("#valor45").on("keyup", function() {
                if ($("#valor45").val() == "") {
                    $("#jurisdiccion").prop("enabled", false);
                } else {
                    $("#jurisdiccion").prop("enabled", true );
                }
            });
            $("#jurisdiccion").on("change", function() {
                if ($("#jurisdiccion").val() === "Polca") {
                    $("#valor45").prop("disabled", false);
                } else {
                    $("#valor45").prop("disabled", true);
                }
            });
        });
</script>

<script>
    $( function() 
    {
        $("#datepicker").datepicker({
        dateFormat: "yy-mm-dd"
        });
    } );
</script>

<script>
    $( function() 
    {
        var from = $( "#fromDate" )
            .datepicker
            ({
            dateFormat: "yy-mm-dd",
            changeMonth: true
            })
            .on( "change", function() {
                to.datepicker( "option", "minDate", getDate( this ) );
            }),
            to = $( "#toDate" ).datepicker
            ({
                dateFormat: "yy-mm-dd",
                changeMonth: true
            })
            .on( "change", function() 
            {
            from.datepicker( "option", "maxDate", getDate( this ) );
            });

            function getDate( element ) 
            {
                var date;
                var dateFormat = "yy-mm-dd";
                try {
                    date = $.datepicker.parseDate( dateFormat, element.value );
                    } catch( error ) 
                    {
                        date = null;
                    }

                return date;
            }
    });
</script>
 
<script>
    
    function sumar()
    {
        
        const $total = document.getElementById('total');
        let subtotal = 0;
        [ ...document.getElementsByClassName( "form-control" ) ].forEach( function ( element ) {
            if(element.value !== '') {
            subtotal += parseFloat(element.value);
            }
        });
        $total.value = subtotal;
    }

</script>

<script>

    $(document).ready(function(){
        $("#bloquear").on('paste', function(e){
            e.preventDefault();
            alert('Esta acción está prohibida');
        })
        
        $("#bloquear").on('copy', function(e){
            e.preventDefault();
            alert('Esta acción está prohibida');
        })
    })

</script>

<script>

    $(document).ready(function(){
        $("#bloquear1").on('paste', function(e){
            e.preventDefault();
            alert('Esta acción está prohibida');
        })
        
        $("#bloquear1").on('copy', function(e){
            e.preventDefault();
            alert('Esta acción está prohibida');
        })
    })

</script>

@stop