@extends('app')
@section('content')
<script src="{{url('js/Productos.js')}}"></script>
<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>Devoluci&oacute;n</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('/admin') }}"> Atras </a></li>
                            </ul>
                        </div>          
				        @if ($alert = Session::get('alert-success'))
                            <div class="alert alert-success">
                                {!! $alert !!}
                            </div>
                        @endif    
                        @if ($alert = Session::get('alert-warning'))
                            <div class="alert alert-warning">
                                {!! $alert !!}
                            </div>
                        @endif              
                        <div class="form-horizontal">   
                        {{-- El id 'regForm' es importante para que el JavaScript lo encuentre --}}
                        {!!Form::open(array('url' =>'/Devolucion', 'method'=>'POST','role'=>'form','id'=>'regForm','name'=>'regForm'))!!}
                        {!!Form::token()!!}

                            <div class="form-group">
                                <div class="col-md-4 control-label"> 
                                    {!!Form::label('documento','Número de Documento')!!}
                                </div>
                                <div class="col-md-6">
                                    {!!Form::text('documento',null,array('class'=>'form-control','id'=>'documento','required'))!!}
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="col-md-4 control-label"> 
                                    {!!Form::label('producto','C&oacute;digo Producto')!!}
                                </div>
                                <div class="col-md-6">
                                    {!!Form::text('producto',null,array('class'=>'form-control','id'=>'producto'))!!}
							    </div>
                                <center> <div class="col-md-12" id="productos"></div></center>
						    </div>
                            <div class="form-group">
                                <div class="col-md-4 control-label"> 
                                    {!!Form::label('cantidad','Cantidad a Devolver')!!}
                                </div>
                                <div class="col-md-6">
                                    {!!Form::text('cantidad',null,array('class'=>'form-control','id'=>'cantidad','pattern'=>'[0-9]+','required'))!!}
							    </div>
						    </div>                                             
                            <div class="form-group">
                                <div><center>
								    {!!Form::submit('Devolver',array('name'=>'Devolver','id'=>'Devolver','class'=>'btn btn-primary'))!!}
                                </center></div>
						    </div>        
                        {!! Form::close()!!}   
				</div>
			</div>
		</div>
	</div>
</div>

{{-- =================================================================== --}}
{{-- ================ INICIO: CÓDIGO JAVASCRIPT AÑADIDO =============== --}}
{{-- =================================================================== --}}
<script>
    // Se ejecuta cuando todo el contenido HTML de la página ha sido cargado.
    document.addEventListener('DOMContentLoaded', function () {
        
        // 1. Seleccionamos el formulario por su ID 'regForm'.
        const form = document.getElementById('regForm');

        // 2. Añadimos un "oyente" para el evento 'submit'.
        form.addEventListener('submit', function (event) {
            
            // 3. Mostramos una ventana de confirmación nativa del navegador.
            // La función confirm() devuelve `true` si el usuario presiona "Aceptar" y `false` si presiona "Cancelar".
            const isConfirmed = confirm('¿Está seguro de que desea realizar esta devolución?');
            
            // 4. Si el usuario presiona "Cancelar" (isConfirmed es false)...
            if (!isConfirmed) {
                // ...prevenimos la acción por defecto del formulario, que es enviarse.
                event.preventDefault();
            }
            // Si el usuario presiona "Aceptar", no hacemos nada y el formulario se envía normalmente.
        });
    });
</script>
{{-- =================================================================== --}}
{{-- ================= FIN: CÓDIGO JAVASCRIPT AÑADIDO ================= --}}
{{-- =================================================================== --}}

@endsection