{% extends "base/base-back.html.twig" %}
{% block title %}Sugerir atributo | Cershop{% endblock %}
{% block metadescription %}Sugerir atributo{% endblock %}
{% block stylesheet %}
    {{ parent() }}
{% endblock %}

{% block titulo %}Sugerir atributo{% endblock %}
{% block contenido %}

<div class="container-fluid">
    <div class="row">
        <div class="col">
            {% for flash_message in app.session.flashbag.get('danger') %}
                <div class="alert alert-danger" role="alert">{{ flash_message }}</div>
            {% endfor %}
            {% for flash_message in app.session.flashbag.get('success') %}
                <div class="alert alert-success" role="alert">{{ flash_message }}</div>
            {% endfor %}
        </div>
    </div>
    <!-- Inicio del formulario -->
    <form name="atributo" action="{{ path(app.request.attributes.get('_route'), app.request.attributes.get('_route_params')) }}" method="post">

        <div class="row">
            <div class="col">
                <ul class="nav nav-tabs mb-4" id="tabIdiomas" role="tablist">
                    {% for idioma in idiomas %}
                    <li class="nav-item">
                        <a class="nav-link{% if loop.first %} active{% endif %}" id="{{ idioma.codigo }}-tab" data-toggle="tab" href="#{{ idioma.codigo }}" role="tab" aria-controls="{{ idioma.codigo }}" aria-selected="{% if loop.first %}true{% else %}false{% endif %}">{{ idioma.nombre }}</a>
                    </li>
                    {% endfor %}
                </ul>

                <div class="tab-content" id="tabIdiomasContenido">
                    {% for idioma in idiomas %}
                    <!-- {{ idioma.nombre }} -->
                    <div class="tab-pane fade{% if loop.first %} show active{% endif %}" id="{{ idioma.codigo }}" role="tabpanel" aria-labelledby="{{ idioma.codigo }}-tab">
                        <div class="form-group col">
                            <!-- Campos principales -->
                            <div class="form-group row">
                                <div class="form-group col-md-6">
                                    <label for="nombreAtributo{{ idioma.codigo }}"{% if idioma.defecto == 1 %} class="required"{% endif %}>Nombre del atributo</label>
                                    <input type="text" id="nombreAtributo{{ idioma.codigo }}" name="nombre_{{ idioma.codigo }}" class="form-control" placeholder="Indica el nombre del atributo..." value="{{ app.request.get('nombre_'~idioma.codigo) }}">
                                </div>
                                {% if idioma.codigo == 'es' %}
                                <div class="form-group col-md-6">
                                    <label for="filtroDelAtributo" class="required">Filtro del atributo</label>
                                    <select class="form-control" required="required" id="filtroDelAtributo" name="filtro">
                                        <option value="">Selecciona...</option>
                                        <option value="acabados"{% if app.request.get('filtro') == 'acabados' %} selected="selected"{% endif %}>Acabados</option>
                                        <option value="caracteristicas"{% if app.request.get('filtro') == 'caracteristicas' %} selected="selected"{% endif %}>Características técnicas</option>
                                        <option value="efectos"{% if app.request.get('filtro') == 'efectos' %} selected="selected"{% endif %}>Efectos</option>
                                        <option value="espacios"{% if app.request.get('filtro') == 'espacios' %} selected="selected"{% endif %}>Espacios</option>
                                        <option value="formas"{% if app.request.get('filtro') == 'formas' %} selected="selected"{% endif %}>Formas</option>
                                        <option value="formas-montaje"{% if app.request.get('filtro') == 'formas-montaje' %} selected="selected"{% endif %}>Formas de montaje</option>
                                        <option value="grupos-color"{% if app.request.get('filtro') == 'grupos-color' %} selected="selected"{% endif %}>Grupos de color</option>
                                        <option value="materiales"{% if app.request.get('filtro') == 'materiales' %} selected="selected"{% endif %}>Materiales</option>
                                        <option value="usos"{% if app.request.get('filtro') == 'usos' %} selected="selected"{% endif %}>Usos</option>
                                    </select>
                                </div>
                                {% endif %}
                            </div>
                        </div>
                    </div>
                    <!-- /.{{ idioma.nombre }} -->
                    {% endfor %}
                </div>
            </div>
        </div>

        <div class="form-group row">
            <div class="form-group col">
                <hr class="divisor-final-formularios">
                <button type="submit" id="sugerirAtributo" name="save" class="btn btn-primary float-right ml-2">Sugerir nuevo atributo</button>
            </div>
        </div>
        
    </form>
    <!-- ./fin del formulario -->
</div>

{% endblock %}

{% block javascript %}
    {{ parent() }}
{% endblock %}