{# @var ea \EasyCorp\Bundle\EasyAdminBundle\Context\AdminContext #}
{% use 'bootstrap_4_layout.html.twig' %}

{% block form_start %}
    {% if form.vars.errors|length > 0 and 'ea_crud' in form.vars.block_prefixes|default([]) %}
        {{ form_errors(form) }}
    {% endif %}

    {{ parent() }}

    <input type="hidden" name="referrer" value="{{ ea.request.query.get('referrer') }}">
{% endblock form_start %}

{# Widgets #}

{% block form_widget_simple -%}
    {% if type is not defined or type not in ['file', 'hidden'] %}
        {%- set attr = attr|merge({class: (attr.class|default(''))|trim}) -%}
    {% endif %}
    {%- if type is defined and (type == 'range' or type == 'color') %}
        {# Attribute "required" is not supported #}
        {%- set required = false -%}
    {% endif %}
    {{- parent() -}}
{%- endblock form_widget_simple %}

{% block date_widget -%}
    <div class="datetime-widget datetime-widget-date">
        {{- parent() -}}
    </div>
{%- endblock date_widget %}

{% block time_widget -%}
    <div class="datetime-widget datetime-widget-time">
        {{- parent() -}}
    </div>
{%- endblock time_widget %}

{% block file_widget -%}
    {% if vich|default(false) %}
        {%- set type = type|default('file') -%}
        {{- block('form_widget_simple') -}}
    {% else %}
        {{- parent() -}}

        <script>
            document.querySelector('#{{ id }}').addEventListener('change', function() {
                const fileName = this.value.replace('C:\\fakepath\\', '');
                const customInputFileLabel = document.querySelector('#{{ id }} ~ .custom-file-label');
                customInputFileLabel.classList.add('selected');
                customInputFileLabel.innerHTML = fileName;
            });
        </script>
    {% endif %}
{%- endblock %}

{# Rows #}

{% block form_row %}
    {% set row_attr = row_attr|merge({
        class: row_attr.class|default('') ~ ' form-group'
    }) %}

    <div {% with { attr: row_attr } %}{{ block('attributes') }}{% endwith %}>
        {{- form_label(form) -}}
        <div class="form-widget">
            {% set has_prepend_html = ea.field.prepend_html|default(null) is not null %}
            {% set has_append_html = ea.field.append_html|default(null) is not null %}
            {% set has_input_groups = has_prepend_html or has_append_html %}

            {% if has_input_groups %}<div class="input-group">{% endif %}
                {% if has_prepend_html %}
                    <div class="input-group-prepend">
                        <span class="input-group-text">{{ ea.field.prepend_html|raw }}</span>
                    </div>
                {% endif %}

                {{ form_widget(form) }}

                {% if has_append_html %}
                    <div class="input-group-append">
                        <span class="input-group-text">{{ ea.field.append_html|raw }}</span>
                    </div>
                {% endif %}
                {% if has_input_groups %}</div>{% endif %}

            {% set nullable_fields_fqcn = [
                'EasyCorp\Bundle\EasyAdminBundle\Field\DateTimeField',
                'EasyCorp\Bundle\EasyAdminBundle\Field\DateField',
                'EasyCorp\Bundle\EasyAdminBundle\Field\TimeField',
            ] %}
            {% if form.vars.ea_crud_form.ea_field.fieldFqcn|default(false) in nullable_fields_fqcn and ea.field.nullable|default(false) %}
                <div class="nullable-control">
                    <label>
                        <input type="checkbox" {% if data is null %}checked="checked"{% endif %}>
                        {{ 'label.nullable_field'|trans({}, 'EasyAdminBundle')}}
                    </label>
                </div>
            {% endif %}

            {% if ea.field.help|default(form.vars.help) != '' %}
                <small class="form-help">{{ ea.field.help|default(form.vars.help)|raw }}</small>
            {% endif %}

            {{- form_errors(form) -}}
        </div>
    </div>
{% endblock form_row %}

{% block collection_row %}
    {% if prototype is defined and not prototype.rendered %}
        {% set row_attr = row_attr|merge({ 'data-prototype': form_row(prototype) }) %}
    {% endif %}

    {% set row_attr = row_attr|merge({
        'data-ea-collection-field': 'true',
        'data-entry-is-complex': form.vars.ea_crud_form.ea_field and form.vars.ea_crud_form.ea_field.customOptions.get('entryIsComplex') ? 'true' : 'false',
        'data-allow-add': allow_add ? 'true' : 'false',
        'data-allow-delete': allow_delete ? 'true' : 'false',
        'data-num-items': form.children|length,
        'data-form-type-name-placeholder': prototype is defined ? prototype.vars.name : '',
    }) %}

    {{ block('form_row') }}
{% endblock collection_row %}

{% block collection_widget %}
    {{ block('form_widget') }}

    {% if allow_add|default(false) %}
        <button type="button" class="btn btn-link field-collection-add-button">
            <i class="fa fa-plus pr-1"></i>
            {{ 'action.add_new_item'|trans({}, 'EasyAdminBundle') }}
        </button>
    {% endif %}
{% endblock collection_widget %}

{% block collection_entry_widget %}
    {% set is_complex = form_parent(form).vars.ea_crud_form.ea_field.customOptions.get('entryIsComplex') ?? false %}

    <div class="field-collection-item {{ is_complex ? 'field-collection-item-complex' }}">
        {{ form_widget(form) }}

        {% if form_parent(form).vars.allow_delete|default(false) %}
            <button type="button" class="btn btn-link field-collection-delete-button"
                    title="{{ 'action.remove_item'|trans({}, 'EasyAdminBundle') }}"
                    onclick="this.closest('.form-group').remove(); return false;">
                <i class="fas fa-times"></i>
            </button>
        {% endif %}
    </div>
{% endblock collection_entry_widget %}

{% block button_row -%}
    <div class="form-group field-{{ block_prefixes|slice(-2)|first }} {{ ea.field.css_class|default('') }}">
        {{- form_widget(form) -}}
    </div>
{%- endblock button_row %}

{# Labels #}

{% block form_label -%}
    {% if label is not same as(false) -%}
        {%- if compound is defined and compound -%}
            {%- set element = 'legend' -%}
            {%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' col-form-label')|trim}) -%}
        {%- else -%}
            {%- set label_attr = label_attr|merge({for: id, class: (label_attr.class|default('') ~ ' form-control-label')|trim}) -%}
        {%- endif -%}
        {% if required -%}
            {% set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' required')|trim}) %}
        {%- endif -%}
        {% if label is empty -%}
            {%- if label_format is not empty -%}
                {% set label = label_format|replace({
                    '%name%': name,
                    '%id%': id,
                }) %}
            {%- else -%}
                {% set label = name|humanize %}
            {%- endif -%}
        {%- endif -%}
        <{{ element|default('label') }}{% if label_attr %}{% with { attr: label_attr } %}{{ block('attributes') }}{% endwith %}{% endif %}>{{ translation_domain is same as(false) ? label : label|trans({}, translation_domain) }}</{{ element|default('label') }}>
    {%- endif -%}
{%- endblock form_label %}

{# Errors #}

{% block form_widget_compound %}
    <div class="form-widget-compound">
        {% if 'collection' in block_prefixes %}
            {# the "is iterable" check is needed because if an object implements __toString() and
               returns an empty string, "is empty" returns true even if it's not a collection #}
            {% set isEmptyCollection = value is null or (value is iterable and value is empty) %}
            {% if isEmptyCollection %}
                {{ block('empty_collection') }}
            {% endif %}
            {% if isEmptyCollection or form.vars.prototype is defined %}
                {% set attr = attr|merge({'data-empty-collection': block('empty_collection') }) %}
            {% endif %}
        {% endif %}

        {{ parent() }}
    </div>
{% endblock form_widget_compound %}

{% block empty_collection %}
    <div class="empty collection-empty">
        {{ include(ea.templatePath('label/empty')) }}
    </div>
{% endblock empty_collection %}

{% block vich_file_row %}
    {% set force_error = true %}
    {{ block('form_row') }}
{% endblock %}

{% block vich_file_widget %}
    <div class="ea-vich-file">
        {% if download_uri|default('') is not empty %}
            {% set download_title = download_uri|split('/')|last ?: 'download'|trans({}, 'VichUploaderBundle') %}
            {% set file_extension = download_uri|split('.')|last %}
            {% set extension_icons = {
                'gif': 'fa-file-image-o',
                'jpg': 'fa-file-image-o',
                'pdf': 'fa-file-pdf-o',
                'png': 'fa-file-image-o',
                'zip': 'fa-file-archive-o'
            } %}
            <a class="ea-vich-file-name" href="{{ asset(download_uri) }}">
                <i class="fa fa-fw {{ extension_icons[file_extension] ?? 'fa-file-o' }}"></i>
                {{ download_title }}
            </a>
        {% endif %}

        {% set file_upload_js %}
            var newFile = document.getElementById('{{ form.file.vars.id }}').files[0];
            var fileSizeInMegabytes = newFile.size > 1024 * 1024;
            var fileSize = fileSizeInMegabytes ? newFile.size / (1024 * 1024) : newFile.size / 1024;
            document.getElementById('{{ form.file.vars.id }}_new_file_name').innerText = newFile.name + ' (' + fileSize.toFixed(2) + ' ' + (fileSizeInMegabytes ? 'MB' : 'KB') + ')';
        {% endset %}

        <div class="ea-vich-file-actions">
            {# the container element is needed to allow customizing the <input type="file" /> #}
            <div class="btn btn-secondary input-file-container">
                <i class="fa fa-fw fa-upload"></i> {{ 'action.choose_file'|trans({}, 'EasyAdminBundle') }}
                {{ form_widget(form.file, { 'attr': { 'onchange': file_upload_js }, vich: true}) }}
            </div>

            {% if form.delete is defined %}
                {{ form_row(form.delete, { label: 'form.label.delete'|trans({}, 'VichUploaderBundle') }) }}
            {% endif %}
        </div>
        <div class="small" id="{{ form.file.vars.id }}_new_file_name"></div>
    </div>
{% endblock %}

{% block vich_image_row %}
    {% set force_error = true %}
    {{ block('form_row') }}
{% endblock %}

{% block vich_image_widget %}
    {% set formTypeOptions = ea_crud_form.ea_field.formTypeOptions|default('') %}
    <div class="ea-vich-image">
        {% if image_uri|default('') is not empty %}
            {% if download_uri|default('') is empty %}
                <div class="ea-lightbox-thumbnail">
                    {% if formTypeOptions.imagine_pattern is defined and formTypeOptions.imagine_pattern is not empty %}
                        <img style="cursor: initial" src="{{ asset(image_uri)|ea_apply_filter_if_exists('imagine_filter', formTypeOptions.imagine_pattern) }}">
                    {% else %}
                        <img style="cursor: initial" src="{{ asset(image_uri) }}">
                    {% endif %}
                </div>
            {% else %}
                {% set _lightbox_id = 'ea-lightbox-' ~ id %}

                <a href="#" class="ea-lightbox-thumbnail" data-featherlight="#{{ _lightbox_id }}" data-featherlight-close-on-click="anywhere">
                    {% if formTypeOptions.imagine_pattern is defined and formTypeOptions.imagine_pattern is not empty %}
                        <img src="{{ asset(download_uri)|ea_apply_filter_if_exists('imagine_filter', formTypeOptions.imagine_pattern) }}">
                    {% else %}
                        <img src="{{ asset(download_uri) }}">
                    {% endif %}
                </a>

                <div id="{{ _lightbox_id }}" class="ea-lightbox">
                    {% if formTypeOptions.imagine_pattern is defined and formTypeOptions.imagine_pattern is not empty %}
                        <img src="{{ asset(download_uri)|ea_apply_filter_if_exists('imagine_filter', formTypeOptions.imagine_pattern) }}">
                    {% else %}
                        <img src="{{ asset(download_uri) }}">
                    {% endif %}
                </div>
            {% endif %}
        {% endif %}

        {% set file_upload_js %}
            var newFile = document.getElementById('{{ form.file.vars.id }}').files[0];
            var fileSizeInMegabytes = newFile.size > 1024 * 1024;
            var fileSize = fileSizeInMegabytes ? newFile.size / (1024 * 1024) : newFile.size / 1024;
            document.getElementById('{{ form.file.vars.id }}_new_file_name').innerText = newFile.name + ' (' + fileSize.toFixed(2) + ' ' + (fileSizeInMegabytes ? 'MB' : 'KB') + ')';
        {% endset %}

        <div class="ea-vich-image-actions">
            {# the container element is needed to allow customizing the <input type="file" /> #}
            <div class="btn btn-secondary input-file-container">
                <i class="fa fa-fw fa-upload"></i> {{ 'action.choose_file'|trans({}, 'EasyAdminBundle') }}
                {{ form_widget(form.file, { 'attr': { 'onchange': file_upload_js }, vich: true}) }}
            </div>

            {% if form.delete is defined %}
                {{ form_row(form.delete, { label: 'form.label.delete'|trans({}, 'VichUploaderBundle') }) }}
            {% endif %}
        </div>
        <div class="small" id="{{ form.file.vars.id }}_new_file_name"></div>
    </div>
{% endblock %}

{% block ea_crud_rest %}
    {{ form_rest(form) }}
{% endblock ea_crud_rest %}

{# EasyAdmin form type #}
{% block ea_crud_widget %}
    {% if ea_crud_form.form_tabs|length > 0 %}
        <div class="col-12">
            <div class="nav-tabs-custom form-tabs">
                <ul class="nav nav-tabs">
                    {% for tab_name, tab_config in ea_form_tabs %}
                        <li class="nav-item">
                            <a class="nav-link {% if tab_config.active %}active{% endif %}" href="#{{ tab_config['id'] }}" id="{{ tab_config['id'] }}-tab" data-toggle="tab">
                                {%- if tab_config.icon|default(false) -%}
                                    <i class="fa fa-fw fa-{{ tab_config.icon }}"></i>
                                {%- endif -%}
                                {{ tab_config['label']|trans(domain = ea.i18n.translationDomain) }}
                                {%- if tab_config.errors > 0 -%}
                                    <span class="badge badge-danger" title="{{ 'form.tab.error_badge_title'|trans({'%count%': tab_config.errors}, 'EasyAdminBundle') }}">
                                        {{- tab_config.errors -}}
                                    </span>
                                {%- endif -%}
                            </a>
                        </li>
                    {% endfor %}
                </ul>
                <div class="tab-content">
                    {% for tab_name, tab_config in ea_form_tabs %}
                        <div id="{{ tab_config['id'] }}" class="tab-pane {% if tab_config.active %}active{% endif %} {{ tab_config['css_class']|default('') }}">
                            {% if tab_config['help']|default(false) %}
                                <div class="content-header-help tab-help">
                                    {{ tab_config['help']|trans(domain = ea.i18n.translationDomain)|raw }}
                                </div>
                            {% endif %}

                            {{ block('ea_crud_widget_panels') }}
                        </div>
                    {% endfor %}
                </div>
            </div>
        </div>
    {% else %}
        {{ block('ea_crud_widget_panels') }}
    {% endif %}
{% endblock ea_crud_widget %}

{% block ea_crud_widget_panels %}
    {% for panel_name, panel_config in ea_crud_form.form_panels|filter(panel_config => not panel_config.form_tab or panel_config.form_tab == tab_name) %}
        {% set panel_has_header = panel_config.label|default(false) or panel_config.icon|default(false) %}

        {% set collapsible = panel_config.collapsible %}
        {% set collapsed = panel_config.collapsed %}

        <div class="{{ panel_config.css_class ?? '' }}">
            <div class="content-panel">
                {% if panel_has_header %}
                    <div class="content-panel-header {{ collapsible ? 'collapsible' }} {{ panel_config.help|default(false) is not empty ? 'with-help' }}">
                        {% if collapsible %}
                            <a href="#content-{{ panel_name }}" data-toggle="collapse" class="content-panel-collapse {{ collapsed ? 'collapsed' }}" aria-expanded="{{ collapsed ? 'false' : 'true' }}" aria-controls="content-{{ panel_name }}">
                                <i class="fas fw fa-chevron-right collapse-icon"></i>
                        {% endif %}

                            {% if panel_config.icon|default(false) %}
                                <i class="{{ panel_config.icon }}"></i>
                            {% endif %}
                            {{ panel_config.label|raw }}

                        {% if collapsible %}
                            </a>
                        {% endif %}

                        {% if panel_config.help|default(false) %}
                            <div class="content-panel-header-help">{{ panel_config.help|raw }}</div>
                        {% endif %}
                    </div>
                {% endif %}

                <div id="content-{{ panel_name }}" class="content-panel-body with-background {{ not panel_has_header ? 'without-header' }} without-footer {{ collapsible ? 'collapse' }} {{ not collapsed ? 'show'}}">
                    {% for field in form|filter(field => 'hidden' not in field.vars.block_prefixes and field.vars.ea_crud_form.form_panel == panel_name) %}
                        {% if not field.vars.ea_crud_form.form_tab or field.vars.ea_crud_form.form_tab == tab_name %}
                            {{ form_row(field) }}
                        {% endif %}
                    {% endfor %}
                </div>
            </div>
        </div>
    {% else %}
        <div class="content-panel">
            <div class="content-panel-body with-background without-header without-footer">
                {% for field in form|filter(field => 'hidden' not in field.vars.block_prefixes and (not field.vars.ea_crud_form.form_tab or field.vars.ea_crud_form.form_tab == tab_name)) %}
                    {{ form_row(field) }}
                {% endfor %}
            </div>
        </div>
    {% endfor %}
{% endblock ea_crud_widget_panels %}

{# EasyAdminAutocomplete form type #}
{% block ea_autocomplete_widget %}
    {{ form_widget(form.autocomplete, { attr: attr|merge({ required: required }) }) }}
{% endblock ea_autocomplete_widget %}

{% block ea_autocomplete_inner_label %}
    {% set name = form_parent(form).vars.name %}
    {{ block('form_label') }}
{% endblock ea_autocomplete_inner_label %}

{# EasyAdmin's CodeEditor form type #}
{% block ea_code_editor_widget %}
    {{ form_widget(form, { attr: attr|merge({
        'data-ea-code-editor-field': 'true',
        'data-language': form.vars.ea_crud_form.ea_field.customOptions.get('language'),
        'data-tab-size': form.vars.ea_crud_form.ea_field.customOptions.get('tabSize'),
        'data-indent-with-tabs': form.vars.ea_crud_form.ea_field.customOptions.get('indentWithTabs') ? 'true' : 'false',
        'data-show-line-numbers': form.vars.ea_crud_form.ea_field.customOptions.get('showLineNumbers') ? 'true' : 'false',
    }) }) }}

    {% set numOfRows = form.vars.ea_crud_form.ea_field.customOptions.get('numOfRows') %}
    {% if numOfRows is not null %}
        <style type="text/css">
            {# here we consider 21px as the average line height #}
            #{{ id }} + .CodeMirror { height: {{ (21 * numOfRows)|round }}px !important; max-height: none; }
        </style>
    {% endif %}
{% endblock ea_code_editor_widget %}

{# EasyAdmin's TextEditor form type #}
{% block ea_text_editor_widget %}
    {% set numOfRows = form.vars.ea_crud_form.ea_field.customOptions.get('numOfRows') %}

    {{ form_widget(form, { attr: attr|merge({ style: 'display: none', class: 'ea-text-editor-content' }) }) }}

    <div class="ea-text-editor-wrapper">
        <trix-editor input="{{ id }}" class="trix-content"></trix-editor>
    </div>

    {% if numOfRows %}
        <style type="text/css">
            trix-editor[input={{ id }}].trix-content {
                {# here we consider 21px as the average line height #}
                min-height: {{ (numOfRows * 21)|round }}px;
            }
        </style>
    {% endif %}
{% endblock ea_text_editor_widget %}

{# EasyAdminSection form type #}
{% block ea_section_row %}
    <div class="form-section {{ ea.field.icon|default(false) == false and ea.field.label|default(false) == false ? 'form-section-empty' }} {{ ea.field.css_class|default('') }}">
        <h2>
            {% if ea.field.icon|default(false) %}<i class="fa fa-fw fa-{{ ea.field.icon }}"></i>{% endif %}
            <span>{% if ea.field.label|default(false) %}{{ ea.field.label|default('')|trans(domain = ea.i18n.translationDomain)|raw }}{% endif %}</span>
        </h2>

        {% if ea.field.help|default(false) %}
            <p class="form-section-help">{{ ea.field.help|trans(domain = ea.i18n.translationDomain)|raw }}</p>
        {% endif %}
    </div>
{% endblock ea_section_row %}

{# EasyAdminBatch form type #}
{% block ea_batch_widget %}
    {% set _trans_parameters = { '%entity_name%':  ea.entity.name|trans(domain = ea.i18n.translationDomain), '%entity_label%': ea.entity.label|trans(domain = ea.i18n.translationDomain) } %}

    {{ form_widget(form.ids) }}
    <button type="button" class="btn btn-link deselect-batch-button">{{ 'action.deselect'|trans(_trans_parameters, ea.i18n.translationDomain) }}</button>
    {% for action in batch_actions %}
        <button type="submit" class="btn {{ action.css_class|default('btn-secondary') }} {% if action.ask_confirm %}ask-confirm-batch-button{% endif -%}" title="{{ action.title|default('') is empty ? '' : action.title|trans(_trans_parameters) }}" name="{{ form.name.vars.full_name }}" value="{{ action.name }}">
            {%- if action.icon %}<i class="fa fa-fw fa-{{ action.icon }}"></i> {% endif -%}
            {%- if action.label is defined and not action.label is empty -%}
                {{ action.label|trans(_trans_parameters, ea.i18n.translationDomain) }}
            {%- endif -%}
        </button>
    {% endfor %}
{% endblock ea_batch_widget %}

{# EasyAdminFilters form type #}
{% block ea_filters_widget %}
    {% set applied_filters = ea.request.query.get('filters')|default([])|keys %}

    {% for field in form %}
        <div class="filter-field {% if not loop.last %}border-bottom{% endif %} py-1 px-3 {% if loop.last %}pb-2{% endif %}" data-filter-property="{{ field.vars.name }}">
            <div class="filter-heading" id="filter-heading-{{ loop.index }}">
                <input type="checkbox" class="filter-checkbox" {% if field.vars.name in applied_filters %}checked{% endif %}>
                <a data-toggle="collapse" href="#filter-content-{{ loop.index }}" aria-expanded="{{ field.vars.name in applied_filters ? 'true' : 'false' }}" aria-controls="filter-content-{{ loop.index }}">
                    {{ field.vars.label|default(field.vars.name|humanize)|trans(domain = ea.i18n.translationDomain) }}
                </a>
            </div>
            <div id="filter-content-{{ loop.index }}" class="filter-content collapse {% if field.vars.name in applied_filters %}show{% endif %}" aria-labelledby="filter-heading-{{ loop.index }}">
                <div class="form-widget my-2">
                    {{ form_widget(field) }}
                </div>
            </div>
        </div>
    {% endfor %}

    <script>
        document.querySelectorAll('.filter-checkbox').forEach(filterCheckbox => {
            filterCheckbox.addEventListener('change', function () {
                const filterToggleLink = filterCheckbox.nextElementSibling;
                const filterExpandedAttribute = filterCheckbox.nextElementSibling.getAttribute('aria-expanded');

                if ((filterCheckbox.checked && 'false' === filterExpandedAttribute) || (!filterCheckbox.checked && 'true' === filterExpandedAttribute)) {
                    filterToggleLink.click();
                }
            });
        });

        // we can't use -> "document.querySelector('form#filters').addEventListener('change', ...);"
        // because it doesn't work with Select2 elements changes
        // TODO: when using the native datepicker, 'change' isn't fired (either in plain JavaScript
        // or jQuery) unless you input the entire date + time information
        $(document).on('change', 'form#{{ form.vars.id }}', function (event) {
            if (event.target.classList.contains('filter-checkbox')) {
                return;
            }

            let filterCheckbox = event.target.closest('.filter-field').querySelector('.filter-checkbox');
            if (!filterCheckbox.checked) {
                filterCheckbox.checked = true;
            }
        });
    </script>

    {{ include('@EasyAdmin/crud/includes/_select2_widget.html.twig') }}
{% endblock ea_filters_widget %}

{% block ea_numeric_filter_widget %}
    <div class="form-widget-compound">
        {{ form_row(form.comparison) }}
        {{ form_row(form.value) }}
        <div id="wrapper_{{ form.value2.vars.id }}" {% if form.comparison.vars.value != 'between' %}style="display: none"{% endif %}>
            {{ form_row(form.value2) }}
        </div>
        <script>
            document.querySelector('#{{ form.comparison.vars.id }}').addEventListener('change', function(event) {
                const input = document.querySelector('#wrapper_{{ form.value2.vars.id }}');
                input.style.display = event.currentTarget.value === 'between' ? '' : 'none';
            });
        </script>
    </div>
    {{- form_errors(form) -}}
{% endblock ea_numeric_filter_widget %}

{% block ea_datetime_filter_widget %}
    {{ block('ea_numeric_filter_widget') }}
{% endblock ea_datetime_filter_widget %}

{% block ea_fileupload_widget %}
    <div class="ea-fileupload">
        <div class="input-group">
            {% set placeholder = '' %}
            {% set title = '' %}
            {% set filesLabel = 'files'|trans({}, 'EasyAdminBundle') %}
            {% if currentFiles %}
                {% if multiple %}
                    {% set placeholder = currentFiles|length ~ ' ' ~ filesLabel %}
                {% else %}
                    {% set placeholder = (currentFiles|first).filename %}
                    {% set title = (currentFiles|first).mTime|date %}
                {% endif %}
            {% endif %}
            {{ form_widget(form.file, { attr: form.file.vars.attr|merge({ placeholder: placeholder, title: title, 'data-files-label': filesLabel }) }) }}
            <div class="input-group-append">
                <span class="input-group-text" {% if currentFiles is empty %}style="display: none"{% endif %}>
                    {%- if currentFiles -%}
                        {% if multiple %}
                            {{ (currentFiles|reduce((carry, file) => carry + file.size))|ea_filesize }}
                        {% else %}
                            {{ (currentFiles|first).size|ea_filesize }}
                        {% endif %}
                    {%- endif -%}
                </span>
                {% if allow_delete %}
                    <label class="btn ea-fileupload-delete-btn" {% if currentFiles is empty %}style="display: none"{% endif %} for="{{ form.delete.vars.id }}">
                        <i class="fa fa-trash-o"></i>
                    </label>
                {% endif %}
                <label class="btn" for="{{ form.file.vars.id }}">
                    <i class="fa fa-folder-open-o"></i>
                </label>
            </div>
        </div>
        {% if multiple and currentFiles %}
            <div class="form-control fileupload-list">
                <table class="fileupload-table">
                    <tbody>
                    {% for file in currentFiles %}
                        <tr>
                            <td>
                                {% if download_path %}<a href="{{ asset(download_path ~ file.filename) }}">{% endif %}
                                    <span title="{{ file.mTime|date }}">
                                        <i class="fa fa-file-o"></i> {{ file.filename }}
                                    </span>
                                    {% if download_path %}</a>{% endif %}
                            </td>
                            <td class="text-right file-size">{{ file.size|ea_filesize }}</td>
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
        {% endif %}
        {% if allow_delete %}
            <div style="display: none">{{ form_widget(form.delete, { label: false }) }}</div>
        {% endif %}
    </div>
    {{ form_errors(form.file) }}
{% endblock %}

{% block ea_slug_widget %}
    {% set attr = attr|merge({
        'data-ea-slug-field': '',
        'data-target': form.parent.children[target].vars.id
    }) %}

    <div class="input-group">
        {{ block('form_widget') }}
        <div class="input-group-append">
            <button class="btn btn-outline-secondary" type="button">
                <i class="fas fa-lock fa-fw"></i>
            </button>
        </div>
    </div>
{% endblock %}