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

{% block title %}Редактирование страницы «{{ page.name }}»{% endblock %}

{% block body %}
    <div class="row">
        <div class="col-12 col-xl-4 mb-3 mb-xl-0">

            {{ render(
                controller(
                    'App\\Controller\\Admin\\PageController::treeAction',
                    { 'page': page.id, 'routeName': 'admin_page_widget' }
                )
            ) }}

        </div>
        <div class="col-12 col-lg-12 col-xl-8">
            {{ include('admin/page/include/page_header.html.twig', { 'is_update': true }) }}

            <div class="card">
                <div class="card-header">
                    <ul class="nav nav-pills card-header-pills">
                        <li class="nav-item">
                            <div class="nav-link active">
                                Настройки страницы
                            </div>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="{{ path('admin_page_widget', {'page': page.id}) }}">
                                Наполнение
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="{{ path('admin_page_seo', {'page': page.id}) }}">
                                SEO
                            </a>
                        </li>
                    </ul>
                </div>
                {{ form_start(form) }}
                    <div class="card-body">
                        {{ form_widget(form) }}
                    </div>
                    <div class="card-footer d-flex gap-1">
                        <button type="submit" class="btn btn-primary">Сохранить</button>
                        <a href="{{ path('admin_page_edit', {'page': page.id }) }}" class="btn">Отменить</a>
                        <a href="{{ path('admin_page_delete', {'page': page.id }) }}" onclick="return confirm('Вы подтверждаете удаление?');" class="btn btn-danger ms-auto">Удалить</a>
                    </div>
                {{ form_end(form) }}
            </div>

        </div>
    </div>
{% endblock %}

{% block javascripts %}
    <script>
        (function () {
            const type = document.querySelector('#page_form_type');
            const external = document.querySelector('#page_form_external');

            type.addEventListener('change', function (event) {
                external.closest('div.row').classList.add('d-none');

                if(this.value === 'LOCAL') {
                    external.closest('div.row').classList.add('d-none');
                }

                if(this.value === 'EXTERNAL') {
                    external.closest('div.row').classList.remove('d-none');
                }
            });

            type.dispatchEvent(new Event('change'));
        })()
    </script>
{% endblock %}