{% extends 'base.html.twig' %}

{% block title %}{% trans %}Nueva Bateria{% endtrans %}{% endblock %}
{% block contenido %}
<main>
    <div class="container-fluid p-5">
        <div id="window" class="row justify-content-center">
            <div class="col-8 ">
                <div class="row justify-content-center mt-3">
                    <div class="col-12 text-left" style="font-size: 24px">
                        <i class="fas fa-file text-danger"></i><span class="text-danger"> Nueva Bateria</span>
                    </div>
                </div>
                <hr>
                {{ form_start(form, {'attr': {'id': 'forNew','class':"needs-validation",'novalidate':''}}) }}
                <div class="row align-items-center justify-content-center" style="display: none">
                    <div class="text-left col-6 mb-3">
                        <label for="batCodCrm">{% trans %}Código CRM{% endtrans %}</label>
                        {{ form_widget(form.batCodCrm,{'id':'batCodCrm','attr':{'class':'form-control form-control-sm'}}) }}
                        <div class="valid-feedback">
                            {% trans %}válido{% endtrans %}
                        </div>
                        <div id="lbatCodCrm" class="invalid-feedback">
                            {% trans %}inválido!{% endtrans %}
                        </div>
                    </div>
                    <div class="text-left col-6 mb-3">
                        <label for="batCodNeural">{% trans %}Código Neural{% endtrans %}</label>
                        {{ form_widget(form.batCodNeural,{'id':'batCodNeural','attr':{'class':'form-control form-control-sm'}}) }}
                        <div class="valid-feedback">
                            {% trans %}válido{% endtrans %}
                        </div>
                        <div id="lbatCodNeural" class="invalid-feedback">
                            {% trans %}inválido!{% endtrans %}
                        </div>
                    </div>
                </div>
                <div class="row align-items-center justify-content-center" style="display: none">
                    <div class="text-left col-6 mb-3">
                        <label for="batNomProducto">{% trans %}Nombre Producto{% endtrans %}</label>
                        {{ form_widget(form.batNomProducto,{'id':'batNomProducto','attr':{'class':'form-control form-control-sm'}}) }}
                        <div class="valid-feedback">
                            {% trans %}válido{% endtrans %}
                        </div>
                        <div id="lbatNomProducto" class="invalid-feedback">
                            {% trans %}inválido!{% endtrans %}
                        </div>
                    </div>
                    <div class="text-left col-6 mb-3">
                        <label for="batNomProdNeural">{% trans %}Nombre Producto Neural{% endtrans %}</label>
                        {{ form_widget(form.batNomProdNeural,{'id':'batNomProdNeural','attr':{'class':'form-control form-control-sm'}}) }}
                        <div class="valid-feedback">
                            {% trans %}válido{% endtrans %}
                        </div>
                        <div id="lbatNomProdNeural" class="invalid-feedback">
                            {% trans %}inválido!{% endtrans %}
                        </div>
                    </div>
                </div>
                <div class="row align-items-center justify-content-center">
                    <div class="text-left col-6 mb-3">
                        <label for="batModelo">{% trans %}Descripción{% endtrans %}</label>
                        {{ form_widget(form.batModelo,{'id':'batModelo','attr':{'class':'form-control form-control-sm'}}) }}
                        <div class="valid-feedback">
                            {% trans %}válido{% endtrans %}
                        </div>
                        <div id="lbatModelo" class="invalid-feedback">
                            {% trans %}inválido!{% endtrans %}
                        </div>
                    </div>
                    <div class="text-left col-6 mb-3" >
                        <label for="batCodDynamics">{% trans %}Código Dynamics{% endtrans %}</label>
                        {{ form_widget(form.batCodDynamics,{'id':'batCodDynamics','attr':{'class':'form-control form-control-sm'}}) }}
                        <div class="valid-feedback">
                            {% trans %}válido{% endtrans %}
                        </div>
                        <div id="lbatCodDynamics" class="invalid-feedback">
                            {% trans %}inválido!{% endtrans %}
                        </div>
                    </div>
                    <div class="text-left col-6 mb-3" style="display: none">
                        <label for="batCodLp">{% trans %}Código LP{% endtrans %}</label>
                        {{ form_widget(form.batCodLp,{'id':'batCodLp','attr':{'class':'form-control form-control-sm'}}) }}
                        <div class="valid-feedback">
                            {% trans %}válido{% endtrans %}
                        </div>
                        <div id="lbatCodLp" class="invalid-feedback">
                            {% trans %}inválido!{% endtrans %}
                        </div>
                    </div>
                </div>
                <div class="row align-items-center justify-content-center">
                    <div class="text-left col-6 mb-3">
                        <label for="batCodInicio">{% trans %}Código Inicio{% endtrans %}</label>
                        {{ form_widget(form.batCodInicio,{'id':'batCodInicio','attr':{'class':'form-control form-control-sm'}}) }}
                        <div class="valid-feedback">
                            {% trans %}válido{% endtrans %}
                        </div>
                        <div id="batCodInicio" class="invalid-feedback">
                            {% trans %}inválido!{% endtrans %}
                        </div>
                    </div>
                    <div class="text-left col-6 mb-3">
                        <label for="batTipo">{% trans %}Tipo{% endtrans %}</label>
                        {{ form_widget(form.batTipo,{'id':'batTipo','attr':{'class':'form-control form-control-sm'}}) }}
                        <div class="valid-feedback">
                            {% trans %}válido{% endtrans %}
                        </div>
                        <div id="lbatTipo" class="invalid-feedback">
                            {% trans %}inválido!{% endtrans %}
                        </div>
                    </div>
                </div>
                <div class="row align-items-center justify-content-center">
                    <div class="text-left col-6 mb-3">
                        <label for="batCodGrupo">{% trans %}Código Grupo{% endtrans %}</label>
                        {{ form_widget(form.batCodGrupo,{'id':'batCodGrupo','attr':{'class':'form-control form-control-sm'}}) }}
                        <div class="valid-feedback">
                            {% trans %}válido{% endtrans %}
                        </div>
                        <div id="lbatCodGrupo" class="invalid-feedback">
                            {% trans %}inválido!{% endtrans %}
                        </div>
                    </div>
                    <div class="text-left col-6 mb-3">
                        <label for="batNumPlacas">{% trans %}No. de Placas{% endtrans %}</label>
                        {{ form_widget(form.batNumPlacas,{'id':'batNumPlacas','attr':{'class':'form-control form-control-sm'}}) }}
                        <div class="valid-feedback">
                            {% trans %}válido{% endtrans %}
                        </div>
                        <div id="lbatNumPlacas" class="invalid-feedback">
                            {% trans %}inválido!{% endtrans %}
                        </div>
                    </div>
                </div>
                <div class="row align-items-center justify-content-center">
                    <div class="text-left col-12 mb-3">
                        <label>{% trans %}Estado{% endtrans %}</label>
                        <div class="form-control custom-control">
                            <div class="custom-control custom-switch">
                                {{ form_widget(form.batEstado,{'id':'batEstado','attr':{'class':'custom-control-input','checked':'checked'}}) }}
                                <label id="labEstado" class="custom-control-label" for="batEstado">{% trans %}Registro Activo{% endtrans %}</label>
                            </div>
                        </div>
                    </div>
                </div>
                <br>
                <div class="row align-items-center justify-content-center mt-2 mb-3">
                    <div class="col-12 smallText text-center">
                        <button type="submit" class="btn btn-danger">
                            <i class="far fa-save"></i> Guardar
                        </button>
                        <a href="{{ path('app_baterias_index') }}">
                            <button type="button" class="btn btn-warning">
                                <i class="fas fa-undo-alt"></i> Volver
                            </button>
                        </a>
                    </div>
                </div>
                {{ form_end(form)}}
            </div>
        </div>
    </div>
</main>
    <script>
        var baterias = JSON.parse('{{ baterias|json_encode|raw }}');
        $(document).ready(function(){
            $("#batEstado").click(function(){
                if(this.checked == true){
                    $("#labEstado").addClass('text-primary');
                    $("#labEstado").empty();
                    $("#labEstado").append('{% trans %}Registro Activo{% endtrans %}');
                }else{
                    $("#labEstado").removeClass('text-primary');
                    $("#labEstado").empty();
                    $("#labEstado").append('{% trans %}Registro Inactivo{% endtrans %}');
                }
            });

            $("input:checkbox").click(function(){
                if(this.checked == true){
                    $("#l"+$(this).val()).addClass('text-primary');
                }else{
                    $("#l"+$(this).val()).removeClass('text-primary');
                }
            });

        });
        // VALIDACION
        (function() {
            'use strict';
            window.addEventListener('load', function() {
                var forms = document.getElementsByClassName('needs-validation');
                var validation = Array.prototype.filter.call(forms, function(form) {
                    form.addEventListener('submit', function(event) {
                        if (form.checkValidity() === false) {
                            event.preventDefault();
                            event.stopPropagation();
                        }else{
                            baterias.forEach(function(element) {
                                /*if(element.batCodCrm == $("#batCodCrm").val()){
                                    $("#batCodCrm").val('');
                                    $("#lbatCodCrm").empty();
                                    $("#lbatCodCrm").append("{% trans %}Código ya registrado!{% endtrans %}");
                                    $("#batCodCrm").focus();
                                    event.preventDefault();
                                    event.stopPropagation();
                                }*/
                            });

                        }
                        form.classList.add('was-validated');
                    }, false);
                });
            }, false);
        })();
    </script>
{% endblock %}