{% extends 'layout/default.html.twig' %}

{% block toolbarActions %}
    <div class="page-title d-flex flex-column justify-content-center flex-wrap me-3">
        <h1 class="page-heading d-flex text-dark fw-bold fs-3 flex-column justify-content-center my-0">{{ 'welcome'|trans({'%name%': app.user.firstName}, 'cms') }}</h1>
        <ul class="breadcrumb breadcrumb-separatorless fw-semibold fs-7 my-0 pt-1">
            <li class="breadcrumb-item text-muted">
                <div class="text-muted text-hover-primary">{{ 'welcome_intro'|trans({},'cms') }}</div>
            </li>
        </ul>
    </div>

    <div class="d-flex ms-auto">
        <a href="{{ portal_url }}" class="btn btn-sm fw-bold btn-primary" target="_blank">
            {{ 'preview'|trans({},'cms') }}
        </a>
    </div>
{% endblock toolbarActions %}

{% block body %}
    <div class="row g-5 g-xl-10 mb-5 mb-xl-10">
        <div class="col-xl-4">
            {% if is_granted('ROLE_SUPER_ADMIN') %}
                <div class="row mb-5 mb-xl-8 g-5 g-xl-8">

                    <div class="col-6">
                        {{ _self.navigationCard('portal_users','cms_user_list','faceid',6) }}
                    </div>
                    <div class="col-6">
                        {{ _self.navigationCard('magazine','cms_magazine_article_list','book',4) }}
                    </div>
                    <div class="col-6">
                        {{ _self.navigationCard('pages','cms_system_page_list','clipboard',3) }}
                    </div>
                    <div class="col-6">
                        {{ _self.navigationCard('categories','cms_system_category_list','archive',3) }}
                    </div>
                    <div class="col-6">
                        {{ _self.navigationCard('translations','lexik_translation_overview','abstract-20',2) }}
                    </div>
                    <div class="col-6">
                        {{ _self.navigationCard('faqs','cms_system_faq_list','question',3) }}
                    </div>
                </div>
            {% endif %}


        </div>
        <div class="col-xl-8 ps-xl-12">

            <div class="card bgi-position-y-bottom bgi-position-x-end bgi-no-repeat bgi-size-cover bg-primary mb-5 mb-xl-8" dir="ltr">
                <div class="card-body d-flex flex-column justify-content-center ps-lg-12">
                    <h3 class="text-white fs-2qx fw-bold mb-7">
                        Jelenleg {{ exportableApplies|length }}
                        jelentkezés nincs exportálva
                    </h3>
                    <div class="m-0">
                        <a href="{{ path('cms_export_unhandled') }}" class="btn btn-dark fw-semibold px-6 py-3">Exportálás</a>
                    </div>
                </div>
            </div>

            <div class="card mb-5 mb-xl-8"  dir="ltr">
                <div class="card-body d-flex flex-column justify-content-center ps-lg-12">
                    <h3 class="text-dark fs-2qx fw-bold mb-7">
                       Exportálás dátum szerint
                    </h3>

                    <form action="{{ path('cms_export_date') }}">
                        <div class="input-group mb-5">
                        <span class="input-group-text">
                            <i class="ki-duotone ki-calendar fs-2"><span class="path1"></span><span class="path2"></span></i>
                        </span>
                            <input type="date" name="dateFrom" class="form-control" />
                            <input type="date" name="dateTo" class="form-control" />
                        </div>


                        <div class="m-0">
                            <button type="submit" class="btn btn-dark fw-semibold px-6 py-3">Exportálás</button>
                        </div>
                    </form>

                </div>
            </div>



        </div>

        <div class="col-12">
            <div class="row g-5 g-xl-10">
                <div class="col-xl-6">
                    {{ _self.widget(applyChart, 'applies'|trans({},'cms'),'apply') }}
                </div>
                <div class="col-xl-6">
                    {{ _self.widget(lessonChart, 'lessons'|trans({},'cms'),'lesson') }}
                </div>
                <div class="col-xl-6">
                    {{ _self.widget(messageChart, 'messages'|trans({},'cms'),'message') }}
                </div>
                <div class="col-xl-6">
                    {{ _self.widget(categoryChart, 'categories'|trans({},'cms'),'category') }}
                </div>

            </div>
        </div>

    </div>

    {% macro widget(chart,title,icon) %}

            <div id="{{ chart.attributes.id }}" class="card card-flush ">
                <div class="card-header pt-7 mb-7">
                    <h3 class="card-title align-items-start flex-column">
                        <span class="card-label fw-bold text-gray-800">
                             <i class="bi-{{ icon }}"></i>
                            {{ title }}
                        </span>
                        <span class="text-gray-400 mt-1 fw-semibold fs-6">
                            {{ chart.attributes.total }} db
                        </span>
                    </h3>
                </div>
                <div class="card-body pt-0">
                    {{ render_chart(chart) }}
                </div>
            </div>

    {% endmacro %}

    {% macro navigationCard(title,route,icon,iconPath) %}
        <div class="card card-stretch">
            <a href="{{ path(route) }}" class="btn btn-flex btn-text-gray-800 btn-icon-gray-400 btn-active-color-primary bg-body flex-column justfiy-content-start align-items-start text-start w-100 p-10">
                {% include 'utils/_icon.html.twig' with {icon:icon,'path':iconPath, 'classes': 'fs-2tx mb-5 ms-n1'} %}
                <span class="fs-4 fw-bold">
                    {{ title|trans({},'cms') }}
                </span>
            </a>
        </div>
    {% endmacro %}

{% endblock %}