@extends('layout.master')

@section('title', 'Educa Auge | Actualización de Datos')

@section('styles')
    <link rel="stylesheet" href="{{ asset('assets/css/login.css') }}" />
@endsection

@section('content')
<main class="page-main">
    <div class="bodyfull">
        <div class="uk-section uk-flex uk-flex-middle uk-animation-fade" uk-height-viewport="expand: true">
            <div class="uk-width-1-2@m uk-width-1-1@s uk-margin-auto">
            
                <div class="uk-card uk-card-default uk-card-body">
                @if (isset($mensaje) && $tipo === 'error')
                  <div class="uk-text-center">
                        <span uk-icon="icon: warning; ratio: 4" class="uk-text-danger uk-margin-bottom"></span>
                        <h3 class="uk-text-danger uk-margin-small">Error</h3>
                        <p>{{ $mensaje }}</p>
                        <a href="{{ url('/') }}" class="uk-button uk-button-secondary uk-margin-top">Regresar al Inicio</a>
                   </div>
                @else
                    <h3 class="uk-text-center">ACTUALIZA Y VERIFICA TUS DATOS PARA TU CERTIFICADO</h3>
                    <form id="update_info_seguimiento">
                        @csrf
                        <input type="hidden" name="id_suscrito" value="{{ $solicitud->id_suscrito }}">
                        <input type="hidden" name="ide_seguimiento" value="{{ $solicitud->ide }}">

                        <div class="uk-margin">
                            <label>DNI o Cédula</label>
                            <input class="uk-input" type="text" value="{{ $solicitud->dni }}" disabled>
                        </div>

                        <div class="uk-margin">
                            <label>Nombres completos</label>
                            <input class="uk-input" type="text" name="api_nombre_editado" required value="{{ $solicitud->api_nombre }}">
                        </div>

                        <div class="uk-margin">
                            <label>Apellido paterno</label>
                            <input class="uk-input" type="text" name="api_paterno_editado" required value="{{ $solicitud->api_paterno }}">
                        </div>

                        <div class="uk-margin">
                            <label>Apellido materno</label>
                            <input class="uk-input" type="text" name="api_materno_editado" required value="{{ $solicitud->api_materno }}">
                        </div>

                        <button type="submit" class="uk-button uk-button-primary uk-width-1-1">ACTUALIZAR DATOS</button>
                    </form>
                    <p class="uk-text-center uk-text-meta uk-margin-top">* Si sus datos no coinciden, comuníquese con nosotros.</p>
                    @endif
                </div>
                <script>
                    $(document).ready(function () {
                        $('#update_info_seguimiento').on('submit', function (e) {
                            e.preventDefault();

                            $.ajax({
                                url: '{{ route("actualizar.datos") }}', // Ruta del controlador
                                method: 'POST',
                                data: $(this).serialize(),
                                success: function (response) {
                                    if (response.rpta === 1) {
                                        UIkit.notification({
                                            message: '<span uk-icon="icon: check"></span> ' + response.mensaje,
                                            status: 'success',
                                            pos: 'top-center',
                                            timeout: 3000
                                        });
                                        window.location.href='/';
                                    } else {
                                        UIkit.notification({
                                            message: '<span uk-icon="icon: warning"></span> ' + response.mensaje,
                                            status: 'danger',
                                            pos: 'top-center',
                                            timeout: 3000
                                        });
                                    }
                                }
                            });
                        });
                    });
                </script>
            </div>
        </div>
    </div>
</main>
@endsection