{% extends "base.html" %}
{% block main %}
<div style="min-height: 100vh;" class="container bg-deepmatte p-6 brdr-yayellow">
<h1 class="title has-text-white has-text-centered">{{ i18n['manage_mail'] }}</h1>
<div class="field">
    <div class="control has-icons-left">
        <input class="input"
               type="text"
               id="mail-search"
               oninput="dashboard_mailsearch(this);"
               placeholder="{{ i18n['placeholder_search_mail'] }}..."
               aria-placeholder="type to search mail addresses">
        <label for="mail-search"></label>
        <span class="icon is-small is-left">
            <span class="mdi mdi-24px mdi-account-search"></span>
        </span>
    </div>
</div>
<div class="table-container">
    <table class="table is-fullwidth">
        <thead>
            <tr>
                <th class="has-text-centered is-uppercase">{{ i18n['address'] }}</th>
                <th class="has-text-centered is-uppercase">{{ i18n['status'] }}</th>
                <th class="has-text-centered"></th>
            </tr>
        </thead>
        <tbody id="mail-table">
        {% for each in addresses %}
            <tr>
                <td>{{each.email}}</td>
                <td>
                    <p class="has-text-centered">
                        {% if each.is_blocked %}
                            <a title="{{ i18n['tooltip_email_blocked'] }}"
                               class="has-text-black"
                               href="/api/mail-toggle-status/{{ each.id_email }}">
                                <i class="mdi mdi-24px mdi-check"></i>
                            </a>
                        {% else %}
                            <a data-tippy-content="{{ i18n['tooltip_email_allowed'] }}"
                               class="has-text-danger"
                               href="/dashboard/toggle-mail-allowed/{{ each.id_email }}">
                                <i class="mdi mdi-24px mdi-block-helper"></i>
                            </a>
                        {% endif %}
                    </p>
                </td>
                <td>
                    <p class="has-text-centered">
                        <a data-tippy-content="{{ i18n['tooltip_delete_email'] }}"
                           class="has-text-danger-dark"
                           href="/api/mail-reset-reputation/{{ each.id_email }}">
                            <i class="mdi mdi-24px mdi-trash-can"></i>
                        </a>
                    </p>
                </td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
</div>
</div>
{% endblock %}