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

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

        form.form-grupos label.error {
            display: none;
        }
    </style>
{% endblock %}

{% block javascripts %}
    <script src="{{asset('js/misJs/validacionPeriodos.js')}}"></script>
{% endblock %}

{% block content %}
    {% for flashMessage in app.session.flashbag.get('correctoP') %}
        <script>
            swal("", "¡ACTUALIZACIÓN CORRECTA!", "success");
        </script>
    {% endfor %}
    <div class="container-fluid">
        <h1 class="mt-4">EDITAR PERIODO</h1>
        <ol class="breadcrumb mb-2">
            <li class="breadcrumb-item active">Tablero</a></li>
        </ol>
        <div class="row">

            <div class="col-lg-12">
                <form role="form" action="{{path('periodos-actualizar')}}" method="POST" id="form-periodos" class="row small g-3">
                    <div class="col-lg-3">
                        <label class="control-label">Periódo:</label>
                        <input type="text" class="form-control form-control-sm" placeholder="Ingresa el nombre del Periódo" id="periodo" name="periodo" value="{{p.periodo}}">
                        <input type="hidden" id="idePer" name="idePer" value="{{p.idePer}}">
                    </div><!-- FIN COL-LG-4 -->
                    <div class="col-lg-3">
                        <label class="control-label">Fecha Inicio:</label>
                        <input type="date" class="form-control form-control-sm" id="mesInicio" name="mesInicio" value="{{p.mesInicio | date('Y-m-d')}}">
                    </div><!-- FIN COL-LG-4 -->
                    <div class="col-lg-3">
                        <label class="control-label">Fecha Termino:</label>
                        <input type="date" class="form-control form-control-sm" id="mesFinal" name="mesFinal" value="{{p.mesFinal | date('Y-m-d')}}">
                    </div><!-- FIN COL-LG-4 -->
                    <div class="col-lg-3">
                        <label class="control-label">Estatus:</label>
                        {% if p.estatus == 1 %}
                            <select id="estatusP" name="estatusP" class="form-select form-select-sm">
                                <option value="default">Selecciona</option>
                                <option value="1" selected="true">Vigente</option>
                                <option value="-1">Pendiente</option>
                                <option value="0">Terminado</option>
                            </select>
                        {% elseif p.estatus == -1 %}
                            <select id="estatusP" name="estatusP" class="form-select form-select-sm">
                                <option value="default">Selecciona</option>
                                <option value="1">Vigente</option>
                                <option value="-1" selected="true">Pendiente</option>
                                <option value="0">Terminado</option>
                            </select>
                        {% elseif p.estatus == 0 %}
                            <select id="estatusP" name="estatusP" class="form-select form-select-sm">
                                <option value="default">Selecciona</option>
                                <option value="1">Vigente</option>
                                <option value="-1">Pendiente</option>
                                <option value="0" selected="true">Terminado</option>
                            </select>
                        {% endif %}

                    </div><!-- FIN COL-LG-4 -->
                    <div class="col-lg-12 text-right">
                        <input type="submit" class="btn btn-primary btn-sm" value="Actualizar">
                        <a href="{{path('periodos')}}" class="btn btn-success btn-sm">Terminar</a>
                    </div><!-- FIN COL-LG-12 -->
                </form>
            </div><!-- FIN DIV-12 -->

        </div><!-- FIN row -->
    </div><!-- FIN container-fluid -->
{% endblock %}