{% 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': false }) }}

            <div class="card">
                {{ 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>
                    </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 %}