{% extends "view/layout.html.twig" %}
{% block title %} Code postal | CRM BIVTeam {% endblock %}
{% block body %}
    <div class="container-fluid mt-2">
        {% set titleHelp = "help.postalCode.title"|trans %}
        {% include 'view/header/_help.html.twig' %}
        <!-- box -->
        <div class="row">
            <div class="col-sm-4 col-md-4">
                <div class="content-box content-lighten" data-step="1"
                     data-intro="{{ "help.postalCode.list.step1"|trans }}">
                    <h2 class="mb-3">{{ "postalCode.formPostalCode.title"|trans }}</h2>
                    {{ form(formPostalCode) }}
                </div>
            </div>
            <div class="col-sm-8 col-md-8">
                <div class="content-box content-lighten">
                    <div class="row">
                        <div class="col-md-6">
                            <h3> {{ "postalCode.list.title"|trans }} </h3>
                        </div>
                        <div class="col-md-6">
                            <div class="text-right">
                                {% if 'ROLE_CLIENT_ADMIN' in app.user.roles %}
                                    <div class="text-right mb-2">
                                        <form id="deletePostalCodeForm" action="{{ path('deletePostalCode') }}">
                                            <input type="hidden" name="_method" value="DELETE"/>
                                            <input type="hidden" name="postalsCodes[]" value="">
                                            <button type="submit" id='deletePostalCode' class="btn btn-danger"
                                                    data-toggle="tooltipDelete"
                                                    data-step="3" data-intro="{{ "help.postalCode.list.step3"|trans }}"
                                                    data-placement="left" title="{{ "header.delete"| trans }}"
                                                    disabled>
                                                <i class="fas fa-trash-alt"></i>
                                            </button>
                                            <button title="Exporter en csv" id="exportCsvPostalCode" type="button"
                                                    class="btn btn-outline-success m-1">
                                                <i class="fa fa-file-csv"></i>
                                            </button>
                                        </form>
                                    </div>
                                {% endif %}
                            </div>
                        </div>
                    </div>
                    <div class="h-600" data-step="2" data-intro="{{ "help.postalCode.list.step2"|trans }}">
                        <div id="postalCodeLoader" class="table-loader"><div class="spinner-border"></div></div>
                        <div id="postalCodeTable" class="ag-theme-quartz h-600"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script>
        let translations = {
            code: "{{ "postalCode.list.table.code"|trans }}",
            city: "{{ "postalCode.list.table.city"|trans }}",
            town: "{{ "postalCode.list.table.town"|trans }}",
        };
    </script>
    <script type="text/javascript" charset="utf8" src="{{ asset('js/signaletique/postalCode/postalCodes.js') }}"></script>
{% endblock %}