@extends('layouts.app')

@section('title', 'Registrar Horas')

@section('content')
    @if(session('info'))
        <div class="alert alert-success">
            <strong>{{session('info')}}</strong>
        </div>
    @endif

    <p>Bienvenido a esta vista para registrar horas de vuelo de Pilotos y Copilotos del Boeing</p>
    <div class="card">
        <div class="card-body">
            <form action="{{ route('horas-colaboradorB737.store') }}" method="POST" id="crear_registro">
                @csrf
                <div class="row">
                        <input type="hidden" class="form-control" value="{{ old('nombre', $colaborador->id ?? '') }}" style="background-color: rgba(220, 214, 239, 0.719);" name="colaborador_id">
                    <div class="col-12 col-md-3 mb-3">
                        <label for="nombre">Nombres:</label>
                        <input class="form-control" type="text" value="{{ old('nombre', $colaborador->nombre ?? '') }}" style="background-color: rgba(220, 214, 239, 0.719);" id="nombre" readonly>
                    </div>
                    <div class="col-12 col-md-3 mb-3">
                        <label for="ap_paterno">Apellido Paterno:</label>
                        <input class="form-control" type="text"  value="{{ old('paterno', $colaborador->ap_paterno ?? '') }}" style="background-color: rgba(220, 214, 239, 0.719);" id="ap_paterno" readonly>
                    </div>
                    <div class="col-12 col-md-3 mb-3">
                        <label for="ap_materno">Apellido Materno:</label>
                        <input class="form-control" type="text"  value="{{ old('materno', $colaborador->ap_materno ?? '') }}" style="background-color: rgba(220, 214, 239, 0.719);" id="ap_materno" readonly>
                    </div>
                    <div class="col-12 col-md-3 mb-3">
                        <label for="numero_dgac">N° DGAC</label>
                        <input class="form-control" type="text" value="{{ old('numero_dgac', $colaborador->numero_dgac ?? '') }}" style="background-color: rgba(220, 214, 239, 0.719);" id="numero_dgac" readonly>
                    </div>
                </div>
                <hr>
                <div class="row align-items-end">
                    <div class="col-12 col-md-3 mb-3">
                        <label for="horas_totales">Horas Totales:</label>
                        <input class="form-control" type="text" id="horas_totales" name="horas_totales">
                    </div>
                    <div class="col-12 col-md-3 mb-3">
                        <label for="horas_equipo">Horas Equipo:</label>
                        <input class="form-control" type="text" id="horas_equipo" name="horas_equipo">
                    </div>
                    <div class="col-12 col-md-3 mb-3 d-flex flex-column flex-md-row gap-2">
                        <button type="submit" class="btn btn-primary">Registrar</button>
                        <a href="{{ route('horas-vuelo-B737.index') }}" class="btn btn-warning">Cancelar</a>
                    </div>
                </div>
            </form>
        </div>
    </div>
@endsection

@section('js')
    <script>
        document.getElementById('crear_registro').addEventListener('submit', function(event) {
            event.preventDefault();
            fetch(URLs+'/horas-colaboradorB737', {
                method: 'POST',
                body: new FormData(this),
                headers: {
                    'X-CSRF-TOKEN': '{{ csrf_token() }}',
                    'Accept': 'application/json'
                }
            })
            .then(response => response.json())
            .then(data => {
                if (data.errors) {
                    // Manejo de errores de validación
                    let errorMessage = Object.values(data.errors).join('\n');
                    Swal.fire({
                        icon: 'error',
                        title: 'Error de validación',
                        text: errorMessage
                    });
                } else {
                    // Éxito
                    Swal.fire({
                        icon: 'success',
                        title: 'Éxito',
                        text: data.message,
                        confirmButtonText: 'OK'
                    }).then((result) => {
                        if (result.isConfirmed) {
                            window.location.href = data.redirect;
                        }
                    });
                }
            })
            .catch(error => {
                Swal.fire({
                    title            : 'Error',
                    text             : 'Hubo un problema al procesar tu solicitud. Por favor, inténtalo de nuevo.',
                    icon             : 'error',
                    confirmButtonText: 'OK'
                });
            });
        });
    </script>
@endsection