{% extends 'CmBundle:Z:baseDos.html.twig' %}

{% block stylesheet %}
    <style>
        .error{
            color: red;
            border-color: red;
        }
    </style>
{% endblock %}

{% block javascripts %}
    <script src="{{asset('js/misJs/alumno.js')}}"></script>
    <script src="{{asset('js/misJs/alumnoEU.js')}}"></script>
    <script src="{{asset('js/misJs/validarAltaAlumnoEU.js')}}"></script>
    <script type="text/javascript">
        $('.preguntar').on('click', function () {
            return confirm('¿Está seguro que desea salir de la página?');
        });
    </script>
{% endblock %}


{% block content %}
    <div class="row">
        <div class="col-lg-12">
            .
        </div><!-- FIND col-lg-12 -->
        <div class="col-lg-12">
            <div class="col-lg-3 col-md-6">
                <div class="panel panel-primary">
                    <div class="panel-heading">
                        <div class="row">
                            <div class="col-xs-12 text-center">
                                <div><b>EXAMEN ÚNICO</b></div>
                            </div>
                        </div>
                    </div>
                    <a href="{{ path('home_eu_externos') }}" class="preguntar">
                        <div class="panel-footer">
                            <span class="pull-left"><i class="fa fa-home"></i> <b>Inicio</b></span>
                            <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                            <div class="clearfix"></div>
                        </div>
                    </a>
                </div>
            </div>

        </div><!-- FIND col-lg-12 -->
        <div class="col-lg-12" style="background-color: #002060;color: white;">
            <h4 style="font-weight: bolder;text-align: center;">DAR DE ALTA NUEVO ALUMNO DE EXAMEN ÚNICO</h4>
        </div><!-- FIND col-lg-12 -->
        <div class="col-lg-12">
            <form class="form-horizontal" action="{{path('nuevo_eu_externos')}}" method="POST" id="form-alta-EU">
                {# INICIA #}
                <div class="accordion" id="accordionExample">
                    <div class="card">
                        <div class="card-header" id="headingOne" style="background-color: #006600;">
                            <h2 class="mb-0">
                                <button class="btn btn-link" type="button" style="font-weight: bolder; color: white;">
                                    <i class="fa fa-user fw"></i> DATOS PERSONALES
                                </button>
                            </h2>
                        </div>

                        <div id="collapseOne">
                            <div class="card-body">
                                <div class="tab-pane fade in active" id="m1">
                                    <div class="panel-body" style="border: 1px solid #ddd;border-top: none;">
                                        <div class="form-group">
                                            <label class="control-label col-sm-2" for="apePat">Ape. Paterno:</label>
                                            <div class="col-sm-4">
                                                <input type="text" class="form-control" id="apePat" name="apePat" placeholder="Apellido paterno" onKeyUp="this.value = this.value.toUpperCase();">
                                            </div>
                                            <label class="control-label col-sm-2" for="apeMat">Ape. Materno:</label>
                                            <div class="col-sm-4">
                                                <input type="text" class="form-control" id="apeMat" name="apeMat" placeholder="Apellido materno" onKeyUp="this.value = this.value.toUpperCase();">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="control-label col-sm-2" for="nomAlu">Nombre(s):</label>
                                            <div class="col-sm-4">
                                                <input type="text" class="form-control" id="nomAlu" name="nomAlu" placeholder="Nombre o nombres" onKeyUp="this.value = this.value.toUpperCase();">
                                            </div>
                                            <label class="control-label col-sm-2" for="curp">CURP:</label>
                                            <div class="col-sm-4">
                                                <input type="text" class="form-control" id="curp" name="curp" onKeyUp="this.value = this.value.toUpperCase();" onblur="curp2date(this.value);">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="control-label col-sm-1" for="sexAlu">Sexo:</label>
                                            <div class="col-sm-2">
                                                <select id="sexAlu" name="sexAlu" class="form-control">
                                                    <option value="default">Selecciona</option>
                                                    <option value="1">Mujer</option>
                                                    <option value="0">Hombre</option>
                                                </select>
                                            </div>
                                            <label class="control-label col-sm-2" for="fecNac">Fec. Nacimiento:</label>
                                            <div class="col-sm-3">
                                                <input type="date" class="form-control" id="fecNac" name="fecNac">
                                            </div>
                                            <label class="control-label col-sm-1" for="edad">Edad:</label>
                                            <div class="col-sm-2">
                                                <input type="number" class="form-control" id="edad" name="edad">
                                            </div>
                                        </div>
                                    </div>
                                </div> <!-- FIN M1 -->
                            </div>
                        </div>
                    </div>
                    <div class="card">
                        <div class="card-header" id="headingTwo" style="background-color: #006600;">
                            <h2 class="mb-0">
                                <button class="btn btn-link collapsed" type="button" style="font-weight: bolder;color: white;">
                                    <i class="fa fa-graduation-cap fw"></i> DATOS ACADÉMICOS
                                </button>
                            </h2>
                        </div>
                        <div id="collapseTwo">
                            <div class="card-body">
                                <div class="tab-pane fade in" id="m3">
                                    <div class="panel-body" style="border: 1px solid #ddd;border-top: none;">
                                        <div class="form-group">
                                            <label class="control-label col-sm-2" for="tipoAlumno">Tipo Registro:</label>
                                            <div class="col-sm-4">
                                                <select id="tipoAlumno" name="tipoAlumno" class="form-control" readonly="true">
                                                    <option value="default">Selecciona</option>
                                                    <option value="2" selected="true">BACHILLERATO EU</option>
                                                </select>
                                            </div>
                                            <label class="control-label col-sm-3" for="cveNumApli">NÚMERO DE APLICACIÓN:</label>
                                            <div class="col-sm-3">
                                                <select id="cveNumApli" name="cveNumApli" class="form-control" readonly="true">
                                                    <option value="default">Selecciona</option>
                                                    {% if aplicaciones is defined and aplicaciones != null %}
                                                        {% for a in aplicaciones %}
                                                            {#<option value='{{a.ideApExaUni}}'>{{a.numeroAplicacion}} : C-{{a.carpeta}}</option>#}
                                                            <option value='{{a.ideApExaUni}}' selected="true">{{a.numeroAplicacion}}</option>
                                                        {% endfor %}
                                                    {% endif %}
                                                </select>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="control-label col-sm-3" for="fecIng">Fecha de Inscripción:</label>
                                            <div class="col-sm-3">
                                                <input type="date" class="form-control" id="fecIng" name="fecIng" value="{{'now' | date('Y-m-d')}}" readonly="true">
                                            </div>
                                            <label class="control-label col-sm-3" for="fecEgr">Termino de Secundaria:</label>
                                            <div class="col-sm-3">
                                                <input type="date" class="form-control" id="fecEgr" name="fecEgr">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="control-label col-sm-1" for="staAlu">Estatus:</label>
                                            <div class="col-sm-3">
                                                <select id="staAlu" name="staAlu" class="form-control" readonly="true">
                                                    <option value="default">Selecciona</option>
                                                    {% if estatus is defined %}
                                                        {% for e in estatus %}
                                                            {% if e.tipEst == 4 %}
                                                                {% if e.ideEst == 1 %}
                                                                    <option value="{{e.ideEst}}" selected="true">{{e.desEst}}</option>
                                                                {% else %}
                                                                    <option value="{{e.ideEst}}">{{e.desEst}}</option>
                                                                {% endif %}
                                                            {% endif %}
                                                        {% endfor %}
                                                    {% endif %}
                                                </select>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="control-label col-sm-1" for="cveEsc">Plantel:</label>
                                            <div class="col-sm-4">
                                                <select class="form-control" id="cveEsc" name="cveEsc">
                                                    <option value="default">Selecciona</option>
                                                    {% if planteles is defined %}
                                                        {% for p in planteles %}
                                                            <option value="{{p.idePla}}" selected="true">{{p.nomPla}}</option>
                                                        {% endfor %}
                                                    {% endif %}
                                                </select>
                                            </div>
                                            <label class="control-label col-sm-2" for="coordinador">Coordinador:</label>
                                            <div class="col-sm-4">
                                                <input type="text" class="form-control" id="coordinador" name="coordinador" placeholder="">
                                            </div>
                                        </div>
                                    </div>
                                </div> <!-- FIN M3 -->
                            </div>
                        </div>
                    </div><!-- CARD #2 -->
                    <div class="card">
                        <div class="card-header" id="headingThree" style="background-color: #006600;">
                            <h2 class="mb-0">
                                <button class="btn btn-link collapsed" type="button" style="font-weight: bolder; color: white;">
                                    <i class="fa fa-check-square fw"></i> REQUISITOS
                                </button>
                            </h2>
                        </div>
                        <div id="collapseThree">
                            <div class="card-body">
                                <div class="tab-pane fade in" id="m4">
                                    <div class="panel-body" style="border: 1px solid #ddd;border-top: none;">
                                        <div class="col-sm-6">
                                            <div class="panel-body text-center" style="margin: 0px;padding: 0px;">
                                                <h3 style="padding: 0px;margin: 0px;"><strong>ORIGINALES</strong></h3>
                                            </div>
                                            <ul class="list-group">
                                                <li class="list-group-item">
                                                    <strong>1.- Certificado de Secundaria</strong>
                                                    <div class="material-switch pull-right">
                                                        <input type="checkbox" id="cerSec" name="cerSec">
                                                        <label for="cerSec" class="label-success"></label>
                                                    </div>
                                                </li>

                                                <li class="list-group-item">
                                                    <strong>2.- Acta de Nacimiento Certificada</strong>
                                                    <div class="material-switch pull-right">
                                                        <input type="checkbox" id="actNac" name="actNac">
                                                        <label for="actNac" class="label-success"></label>
                                                    </div>
                                                </li>
                                                <li class="list-group-item" style="height: 42px;">
                                                </li>
                                                <li class="list-group-item" style="height: 42px;">
                                                </li>
                                                <li class="list-group-item">
                                                    <strong>5.- Comprobante domiciliario</strong>
                                                    <div class="material-switch pull-right">
                                                        <input type="checkbox" id="cerPre" name="cerPre">
                                                        <label for="cerPre" class="label-success"></label>
                                                    </div>
                                                </li>
                                                <li class="list-group-item">
                                                    <strong>6.- Paquete de fotos (completas)</strong>
                                                    <div class="material-switch pull-right">
                                                        <input type="checkbox" id="fotInf" name="fotInf">
                                                        <label for="fotInf" class="label-success"></label>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div><!-- col-sm-6 -->
                                        <div class="col-sm-6">
                                            <div class="panel-body text-center" style="margin: 0px;padding: 0px;">
                                                <h3 style="padding: 0px;margin: 0px;"><strong>COPIAS</strong></h3>
                                            </div>
                                            <ul class="list-group">
                                                <li class="list-group-item">
                                                    <strong>1.- Certificado de Secundaria (2 copias)</strong>
                                                    <div class="material-switch pull-right">
                                                        <input type="checkbox" id="cerSec2" name="cerSec2">
                                                        <label for="cerSec2" class="label-success"></label>
                                                    </div>
                                                </li>
                                                <li class="list-group-item">
                                                    <strong>2.- Acta de Nacimiento Certificada (2 copias)</strong>
                                                    <div class="material-switch pull-right">
                                                        <input type="checkbox" id="actNac2" name="actNac2">
                                                        <label for="actNac2" class="label-success"></label>
                                                    </div>
                                                </li>
                                                <li class="list-group-item">
                                                    <strong>3.- CURP validada de Internet (3 copias)</strong>
                                                    <div class="material-switch pull-right">
                                                        <input type="checkbox" id="copCurp2" name="copCurp2">
                                                        <label for="copCurp2" class="label-success"></label>
                                                    </div>
                                                </li>
                                                <li class="list-group-item">
                                                    <strong>4.- IFE o INE (3 copias)</strong>
                                                    <div class="material-switch pull-right">
                                                        <input type="checkbox" id="cerMed2" name="cerMed2">
                                                        <label for="cerMed2" class="label-success"></label>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div><!-- col-sm-6 -->
                                        <div class="col-sm-12">
                                            <div class="panel-body text-center" style="margin: 0px;padding: 0px;">
                                                <h3 style="padding: 0px;margin: 0px;"><strong>Acotaciones</strong></h3>
                                            </div>
                                            <div class="col-sm-12 img-responsive">
                                                <img src="{{asset('images/noEntregado.png')}}">
                                                * Indica que el original y/o copia NO se entrego
                                            </div>
                                            <div class="col-sm-12 img-responsive">
                                                <img src="{{asset('images/siEntregado.png')}}">
                                                * Indica que el original y/o copia SI se entrego
                                            </div>
                                        </div><!-- col-sm-12 -->
                                    </div>
                                </div> <!-- FIN M4 -->
                            </div>
                        </div>
                    </div><!-- CARD #3 -->
                </div>

                <div class="panel-body">
                    <div class="form-group">
                        <div class="col-sm-12 text-right">
                            <button type="submit" class="btn btn-primary" id="btnGuardarRegistro"><strong>Registrar</strong></button>
                        </div>
                    </div>
                </div>
            </form>
        </div><!-- FIND col-lg-12 -->
    </div>
{% endblock %}
