{% extends '@DWGinger/base.html.twig' %}

{% block body %}
    <div class="row heading">
        <div class="col">
            <h1>{{ 'import.preview.heading'|trans }}</h1>
        </div>
    </div>
    <div class="row heading-desc">
        <div class="col">
            <p>{{ 'import.preview.heading_desc'|trans }}</p>
        </div>
    </div>
    <div class="row">
        <div class="col">
            <ul>
                <li>{{ fileImport.countTotal }} {{ 'import.preview.rows'|trans }}</li>
                <li>{{ fileImport.countColumns }} {{ 'import.preview.columns'|trans }}</li>
                <li>{{ 'import.preview.validation_summary'|trans({
                        '%number%': min(constant('DW\\GingerBundle\\Import\\Controller\\FileImportController::PREVIEW_LENGTH'), fileImport.countTotal),
                        '%errorcount%': violationsPreview|length ? ' ' : 'import.preview.none'|trans()
                    }) }}
                </li>
                {% if extraFields is not empty %}
                    <li>{{ 'import.preview.extra_fields'|trans }}: {{ extraFields|join(', ')  }}</li>
                {% endif %}
            </ul>
            <div class="mb-2">
                {{ 'import.chosen_file'|trans }} {{ fileImport.uploadTitle }}
            </div>
            <div class="mb-2">
                {{ "import.title.mode"|trans }}: {{ "import.mode.#{fileImport.mode}"|trans }}
            </div>
            {{ 'import.preview.number_of_rows'|trans({'%number%': min(constant('DW\\GingerBundle\\Import\\Controller\\FileImportController::PREVIEW_LENGTH'), fileImport.countTotal)}) }}
            {{ form_start(form) }}
            {{ form_errors(form.selectedCols) }}
            <div class="overflow-scroll mt-1 mb-0">
                <table class="table table-striped table-sm table-bordered mb-0">
                    <thead class="thead-light">
                        {% block table_header %}
                            <tr>
                                <th class="text-nowrap small text-center">
                                    Match
                                </th>
                                {% for header in headers %}
                                    <th class="text-nowrap small">
                                        {% set disabledProps = ['id'] %}
                                        {% if header|trans([], 'import') in disabledProps %}
                                            {{ header }}
                                        {% else %}
                                            {{ form_widget(form.selectedCols[header|trans([], 'import')]) }}
                                        {% endif %}
                                    </th>
                                {% endfor %}
                            </tr>
                        {% endblock %}
                    <tbody>
                    {% for person in preview %}
                        <tr>
                            <td class="small text-center">
                                {% if matchesPreview[loop.index0] is defined %}
                                    {% if matchesPreview[loop.index0]['link'] is defined -%}
                                        <a href="{{ matchesPreview[loop.index0]['link'] }}" target="_blank" title="{{ matchesPreview[loop.index0]['msg']|e('html_attr') }}">
                                    {%- endif -%}
                                    <i class="fa fa-{{ matchesPreview[loop.index0]['icon'] }}"
                                       title="{{ matchesPreview[loop.index0]['msg']|e('html_attr') }}">
                                    </i>
                                    {% if matchesPreview[loop.index0]['link'] is defined %}</a>{% endif %}
                                {% endif %}
                            </td>
                            {% for header in headers %}
                                {% set class = "" %}
                                {% set msg = "" %}
                                {% if violationsPreview[loop.parent.loop.index0] is defined and violationsPreview[loop.parent.loop.index0][header|trans([], 'import')] is defined %}
                                    {% set class = 'violation_preview' %}
                                    {% set msg = violationsPreview[loop.parent.loop.index0][header|trans([], 'import')] %}
                                {% endif %}
                                <td class="small {{ class }}">
                                    {% if msg is not empty %}
                                        <span class="d-block">
                                            <span class="form-error-icon badge badge-danger text-uppercase">Fehler</span><span class="msg smaller"> {{ msg|raw }}</span>
                                        </span>
                                    {% endif %}
                                    {{ render_person_property(person, header) }}
                                </td>
                            {% endfor %}
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
            <div>
                <a href="#" class="small toggler">{{ 'import.preview.selectall'|trans }}</a>
                <a class="small" tabindex="0" role="button" data-toggle="popover" data-placement="right" data-html="true" data-trigger="focus"
                   title="{{ 'import.preview.import_help.title'|trans|e('html_attr') }}"
                   data-content="{{ 'import.preview.import_help.body'|trans|e('html_attr') }}">
                    <i class="fa fa-info-circle"></i>
                </a>
            </div>
            <div class="col">
                <button type="submit" class="btn btn-primary float-right ml-3" {{ violationsPreview|length > 0 ? 'disabled=disabled' : '' }}>
                    {{ 'import.submit'|trans }}
                </button>
            </div>
            {{ form_widget(form._token) }}
            {{ form_end(form, {render_rest: false}) }}
            {{ form_start(deleteForm) }}
                <button type="submit" class="btn btn-light float-right">
                    {{ 'import.delete'|trans }}
                </button>
            {{ form_end(deleteForm) }}
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script type="text/javascript">
        $(function (){
            $('a.toggler').on('click', function(e) {
                let currentState = $('input.form-check-input').prop('checked');
                $('input.form-check-input').prop('checked', !currentState);
            })
        });
    </script>
{% endblock %}