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

{% block body %}
    {% block header -%}
        <header class="c-header c-header--is-fixed">
            <div class="c-hamburguer-icon__container js-open-menu">
                <span class="c-hamburguer-icon c-hamburguer-icon--open"></span>
            </div>

            <div class="c-header-search">
                <label for="search"></label>
                <input type="search" name="s" id="search" placeholder="{{ 'main.default.actions.search.placeholder'|trans }}" data-url="{{ path('main_search') }}">
                <i class="u-icon--search c-header-search__icon"></i>

                <span class="c-header-search__info c-header-search__info--start">{{ 'main.default.actions.search.start' | trans | raw }}</span>
                <span class="c-header-search__info">{{ 'main.default.actions.search.info' | trans | raw }}</span>
            </div>

            <ul class="c-header-actions">
                <li class="c-header-actions__item c-header-actions__item--user  js-open-header-profile">
                    <div class="c-header-actions__item-img" style="background-image: url('{% if app.user.foto %}{{ asset(app.user.foto) }}{% else %}{{ asset('images/avatar-1.png') }}{% endif %}');" alt="{{ app.user }}"></div>
                </li>
            </ul>

            <div class="c-header-profile">
                <div class="c-header-profile__welcome">{{ 'main.default.header.welcome' | trans }}, {{ app.user.firstname }}</div>
                <ul class="c-header-profile__actions">
                    {% if is_granted('ROLE_ADMIN') %}
                        <li class="c-header-profile__actions-item"><a href="{{ path('user_index') }}" class="c-header-profile__actions-link ">
                                <i class="u-icon--users"></i> <span>{{ 'main.default.header.gestor.usuarios' | trans }}</span>
                            </a></li>
                    {% endif %}

                    <li class="c-header-profile__actions-item"><a href="{{ path('user_edit', { 'slug':  app.user.slug }) }}" class="c-header-profile__actions-link ">
                            <i class="u-icon--settings"></i> <span>{{ 'main.default.header.settings' | trans }}</span>
                        </a></li>
                    <li class="c-header-profile__actions-item"><a href="{{ path('fos_user_security_logout') }}" class="c-header-profile__actions-link ">
                            <i class="u-icon--power"></i> <span>{{ 'main.default.header.logout' | trans }}</span>
                        </a></li>
                </ul>
            </div>
        </header>
    {% endblock %}

    {% block sidebar -%}
        <div class="c-sidebar">
            <a href="{{ path('dashboard') }}" class="c-sidebar__logo ">
                <h1 class="c-sidebar__app-name">{{ 'main.app.name' | trans }}</h1>
                <i class="c-sidebar__icon material-icons"><img src="{{ asset('images/favicon.png') }}" title="Logo"></i>
            </a>

            <ul class="c-menu">
                {% if is_granted('ROLE_SUPER_ADMIN') %}
                <li class="c-menu__item">
                    <a href="{{ path('user_index') }}" class="c-menu__link  {% if app.request.attributes.get('_route') starts with 'dashboard' %}c-menu__link--active{% endif %}">
                        <i class="u-icon--home"></i> <span>{{ 'main.default.menu.1' | trans }}</span>
                    </a>
                </li>
                {% endif %}
                <li class="c-menu__item">
                    <a href="{{ path('customer_index') }}" class="c-menu__link  {% if app.request.attributes.get('_route') starts with 'customer' %}c-menu__link--active{% endif %}">
                        <i class="u-icon--users"></i> <span>{{ 'main.default.menu.2' | trans }}</span>
                    </a>
                </li>

                {% if is_granted('ROLE_SUPER_ADMIN') %}
                    <li class="c-menu__item">
                        <a href="{{ path('main_uikit') }}" class="c-menu__link  {% if app.request.attributes.get('_route') starts with 'main_u' %}c-menu__link--active{% endif %}">
                            <i class="u-icon--package"></i> <span>{{ 'main.default.menu.6' | trans }}</span>
                        </a>
                    </li>
                    <li class="c-menu__item">
                        <a href="{{ path('default_config') }}" class="c-menu__link c-menu__link--has-submenu js-open-submenu {% if app.request.attributes.get('_route') starts with 'default_config' %}c-menu__link--active{% endif %}">
                            <i class="u-icon--settings"></i> <span>{{ 'main.default.menu.7' | trans }}</span>
                        </a>
                        <ul class="c-menu__submenu" {% if app.request.attributes.get('_route') starts with 'review' %}style="display: block;"{% endif %}>
                            <a href="{{ path('config_dataforseo') }}" class="c-menu__link  {% if app.request.attributes.get('_route') starts with 'config_dataforseo' %}c-menu__link--active{% endif %}">
                               <span>{{ 'main.default.menu.7.1' | trans }}</span>
                            </a>
                        </ul>
                    </li>
                {% endif %}
            </ul>
        </div>
    {% endblock %}

    <div class="c-breadcrumbs__container">
        <h3 class="c-breadcrumbs__current">{% block breadcrumbs_current %}{% endblock %}</h3>

        <ul class="c-breadcrumbs">
            {% block breadcrumbs %}{% endblock %}
        </ul>
    </div>

    <div class="c-content">
        {% block wrapper %}{% endblock %}
    </div>

{% endblock %}

{% block javascripts %}
    {{ parent() }}

    <script>
        {% for label, messages in app.flashes %}
        {% for message in messages %}
        $(document).ready(function ($) {
            Swal.fire({
                type: '{{ label }}',
                title: '{{ message }}',
                showConfirmButton: false,
                timer: 2000,
                animation: false,
            })
        });
        {% endfor %}
        {% endfor %}

        $(document).ready(function ($) {
            $('.js-entity-delete').click(function (event) {
                event.preventDefault();
                form = $(this).data('form');

                DeleteDialog.fire({
                    title: $(this).data('modal-title'),
                    text: $(this).data('modal-text'),
                    confirmButtonText: '{{ 'main.default.actions.delete' | trans }}',
                    cancelButtonText: '{{ 'main.default.actions.cancelar' | trans }}'
                }).then((result) => {
                    if (result.value) {
                        $('#' + form).submit();
                    }
                });
            });
        });
    </script>
{% endblock %}