@extends('layouts.app')

@section('scripts')
    @vite(['resources/js/inscripciones/pregrado/cambioGrupoCargaDoc/cambioGrupoCargaDoc.js'])
    <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.9.3/dropzone.js" integrity="sha512-9e9rr82F9BPzG81+6UrwWLFj8ZLf59jnuIA/tIf8dEGoQVu7l5qvr02G/BiAabsFOYrIUTMslVN+iDYuszftVQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/4.3.0/min/dropzone.min.css">

@endsection

@section('styles')
@endsection

@section('title')
    {{ Breadcrumbs::render('cambioGrupoCargaDoc') }}
    <div class="page-header">
        <h2>Solicitud de Cambio de Grupo (Carga de Documentos)</h2>
    </div>
@endsection

@section('content')
    <div class="nav nav-tabs" id="nav-tab" role="tablist">
        <button class="nav-link active" id="nav-home-tab"
                data-bs-toggle="tab" data-bs-target="#nav-cambioGrupoCargaDoc" type="button" role="tab"
                aria-controls="nav-cambioGrupoCargaDoc-tab"
                aria-selected="active">Carga de Documentos
        </button>
    </div>

    <div class="tab-content p-3" id="nav-tabContent">
        <div class="tab-pane show active  " id="nav-cambioGrupoCargaDoc" role="tabpanel" aria-labelledby="nav-cambioGrupoCargaDoc-tab"
             tabindex="0">

            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="card">
                        <div class="card-header text-bg-secondary">
                            ALUMNO
                        </div>
                        <div class="card-body">
                            <ul class="list-group">
                                {!! Form::hidden('numero_cuenta', $ultima_inscripcion['numero_cuenta']?? null,['id' => 'numero_cuenta']) !!}
                                <li class="list-group-item">Número de cuenta: <span
                                        class="fw-bold">{{ $ultima_inscripcion['numero_cuenta'] }}</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    Nombre: <span
                                        class="fw-bold">{{ $ultima_inscripcion['apellido_paterno'] . " " .$ultima_inscripcion['apellido_materno']. " " .$ultima_inscripcion['nombre'] }}</span>
                                </li>
                                <li class="list-group-item fst-normal">Periodo: <span
                                        class="fw-bold">{{ $ultima_inscripcion['periodo'] }}</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    Grupo: <span class="fw-bold">{{ $ultima_inscripcion['grupo_fm'] }}</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>


            <div class="row ">
                <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 pt-3">
                    <div class="card">
                        <div class="card-header text-bg-secondary">
                            INTRUCCIONES
                        </div>
                        <div class="card-header fw-bold p-3">
                            Para concluir con tu solicitud de cambio de grupo deberás subir los siguientes documentos
                        </div>

                        <div class="card-body">
                            <br>
                            <ul>
                                <li>Solicitud que obtuviste del sistema firmado de dos tantos ( Servicios Escolares y Alumno).</li>
                                <li>Copia del comprobante de inscripción con los códigos QR.</li>
                                <li>Carta descriptiva del o los motivos de la solicitud del cambio y documentos que lo sustenten. </li>
                                <li>Una identificación oficial por ambos lados que contenga foto y firma pues serán cotejados (credencial estudiante, INE ó pasaporte).</li>
                            </ul>
                            <br>
                            <div class="card-header alert alert-dismissible alert-danger">En caso de no subir estos documentos no se habrá cumplido el trámite, por tal motivo no serás considerado en cuenta en el proceso de cambio de grupo.</div>
                            <br>
                            <div class = "pb-1">
                                <ul class = "text-danger">
                                    <li>
                                        Nota: El documento no debe exceder los 2MB. &emsp; <a href="" target="_blanc" class="card-link">Compresor de archivos PDF</a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 pt-3">
                    <div class="card">
                        <div class="card-header text-bg-secondary">
                            DOCUMENTOS OBLIGATORIOS
                        </div>
                        <div class="card-body">
                            <ul class="list-group list-group-flush">
                                <li class="list-group-item">
                                    <div class="card-header bg-info-subtle">
                                        COMPROBANTE DE INSCRIPCIÓN
                                    </div>
                                    <div class="input-group mb-3">
                                        <input type="file" class="form-control" id="inputGroupComprobanteInscripcion">
                                        <label class="input-group-text text-danger" for=""><i class="bi bi-filetype-pdf" hidden></i>&emsp;</label>
                                    </div>
                                </li>
                                <li class="list-group-item">
                                    <div class="card-header bg-info-subtle">
                                        DOCUMENTOS PROBATORIOS
                                    </div>
                                    <div class="input-group mb-3">
                                        <input type="file" class="form-control" id="inputGroupDocumentosProbatorios">
                                        <label class="input-group-text text-danger" for=""><i class="bi bi-filetype-pdf" hidden></i>&emsp;</label>
                                    </div>
                                </li>
                                <li class="list-group-item">
                                    <div class="card-header bg-info-subtle">
                                        SOLICITUD DE CAMBIO DE GRUPO
                                    </div>
                                    <div class="input-group mb-3">
                                        <input type="file" class="form-control" id="inputGroupSolicitudCambioGrupo">
                                        <label class="input-group-text text-danger" for=""><i class="bi bi-filetype-pdf" hidden></i>&emsp;</label>
                                    </div>
                                </li>
                                <li class="list-group-item">
                                    <div class="card-header bg-info-subtle">
                                        IDENTIFICACIÓN OFICIAL
                                    </div>
                                    <div class="input-group mb-3">
                                        <input type="file" class="form-control" id="inputGroupIdentificacionOficial">
                                        <label class="input-group-text text-danger" for=""><i class="bi bi-filetype-pdf" hidden></i>&emsp;</label>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>



{{--            <div class="row pt-3">--}}
{{--                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">--}}
{{--                    <div class="card">--}}
{{--                        <div class="card-header text-bg-secondary">--}}
{{--                           DOCUMENTOS OBLIGATORIOS--}}
{{--                        </div>--}}
{{--                        <div class="card-body">--}}
{{--                            <ul class="list-group list-group-flush">--}}
{{--                                <li class="list-group-item">--}}
{{--                                    <div class="card-header bg-info-subtle">--}}
{{--                                        COMPROBANTE DE INSCRIPCIÓN--}}
{{--                                    </div>--}}
{{--                                    <div class="input-group mb-3">--}}
{{--                                        <input type="file" class="form-control" id="inputGroupFile02">--}}
{{--                                        <label class="input-group-text" for="inputGroupFile02">Upload</label>--}}
{{--                                    </div>--}}
{{--                                </li>--}}
{{--                                <li class="list-group-item">--}}
{{--                                    <div class="card-header bg-info-subtle">--}}
{{--                                        COMPROBANTE DE INSCRIPCIÓN--}}
{{--                                    </div>--}}
{{--                                    <div class="input-group mb-3">--}}
{{--                                        <input type="file" class="form-control" id="inputGroupFile02">--}}
{{--                                        <label class="input-group-text" for="inputGroupFile02">Upload</label>--}}
{{--                                    </div>--}}
{{--                                </li>--}}
{{--                                <li class="list-group-item">--}}
{{--                                    <div class="card-header bg-info-subtle">--}}
{{--                                        COMPROBANTE DE INSCRIPCIÓN--}}
{{--                                    </div>--}}
{{--                                    <div class="input-group mb-3">--}}
{{--                                        <input type="file" class="form-control" id="inputGroupFile02">--}}
{{--                                        <label class="input-group-text" for="inputGroupFile02">Upload</label>--}}
{{--                                    </div>--}}
{{--                                </li>--}}
{{--                                <li class="list-group-item">--}}
{{--                                    <div class="card-header bg-info-subtle">--}}
{{--                                        COMPROBANTE DE INSCRIPCIÓN--}}
{{--                                    </div>--}}
{{--                                    <div class="input-group mb-3">--}}
{{--                                        <input type="file" class="form-control" id="inputGroupFile02">--}}
{{--                                        <label class="input-group-text" for="inputGroupFile02">Upload</label>--}}
{{--                                    </div>--}}
{{--                                </li>--}}
{{--                            </ul>--}}
{{--                        </div>--}}
{{--                    </div>--}}
{{--                </div>--}}
{{--            </div>--}}

            <div class="row pt-3">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="alert alert-warning" role="alert">
                        Una vez cargados los documentos recibirás un correo electrónico de confirmación de tu solicitud y deberás seguir las instrucciones, de lo contrario No serás considerado dentro del proceso de cambio de grupo.
                    </div>
                </div>
            </div>

            <div class="row p-3">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="d-flex flex-row-reverse">
                        {!! Form::button('<i class="bi bi-check-lg"></i> Guardar',['class' => 'btn btn-primary btnGuardarCamGrupoCD', 'id'=>'btnGuardarCamGrupoCD']) !!} &emsp;
                        {!! Form::button('<i class="bi bi-printer"></i> Imprimir',['class' => 'btn btn-primary btnImprimirCamGrupoCD', 'id'=>'btnImprimirCamGrupoCD']) !!}
                    </div>
                </div>
            </div>

        </div>
    </div>
@endsection