{% extends 'panel/base.html' %}

{% block panel_title %}{% if object %}{{ object.subject }}{% else %}Nowa wiadomość{% endif %}{% endblock %}
{% block heading %}{% if object %}{{ object.subject }}{% else %}Nowa wiadomość{% endif %}{% endblock %}
{% block subheading %}<p class="text-sm text-slate-500 dark:text-slate-400">Wiadomość newslettera. Aktywnych adresatów: {{ counts.active }}.</p>{% endblock %}
{% block actions %}<a class="btn-ghost" href="{% url 'panel:newsletter_mailings:index' %}">Wróć do listy</a>{% endblock %}

{% block content %}
{% if object.is_sent %}
  <p class="card card-body text-sm text-slate-500 dark:text-slate-400">
    Wiadomość została wysłana {{ object.sent_at|date:"SHORT_DATETIME_FORMAT" }} do {{ object.sent_count }} adresatów.
    Treść jest już tylko do odczytu.
  </p>
{% elif object.is_sending %}
  <p class="card card-body text-sm text-slate-500 dark:text-slate-400">
    Wysyłka trwa (rozpoczęta {{ object.started_at|date:"SHORT_DATETIME_FORMAT" }}). Treść jest na ten czas
    zablokowana, a przycisk wysyłki nieaktywny - odśwież stronę za chwilę.
  </p>
{% elif object.status == 'failed' %}
  <p class="card card-body text-sm text-amber-700 dark:text-amber-300">
    Poprzednia wysyłka nie objęła wszystkich adresów: doręczono {{ object.sent_count }},
    nie doręczono {{ object.failed_count }}.
    {% if object.last_error %}Serwer poczty odpowiedział: {{ object.last_error }}{% endif %}
    Wysyłkę można ponowić - pójdzie tylko do adresów, które jeszcze nie dostały wiadomości.
  </p>
{% endif %}

<div class="card max-w-3xl">
  <form method="post" novalidate class="card-body space-y-6">
    {% csrf_token %}
    {% include 'panel/partials/form.html' %}
    <p class="help">Znaczniki podstawiane przy wysyłce: {imie}, {email}, {serwis}, {wypisz}.</p>
    {% if not object.is_locked %}
      <div class="flex gap-2 border-t border-slate-200 pt-4 dark:border-slate-800">
        {% include "panel/partials/dirty-note.html" %}
        <button class="btn-primary" type="submit">Zapisz</button>
        <a class="btn-ghost" href="{% url 'panel:newsletter_mailings:index' %}">Anuluj</a>
      </div>
    {% endif %}
  </form>
</div>

{% if object and not object.is_locked %}
  <div class="card max-w-3xl">
    <div class="card-body space-y-5">
      <div class="space-y-1">
        <h2 class="text-sm font-semibold text-slate-900 dark:text-slate-100">Wysyłka</h2>
        <p class="help">Najpierw sprawdź wiadomość na własnym adresie - wysyłki do listy nie da się cofnąć.
          Każdy adres dostaje wiadomość dokładnie raz: ponowienie omija tych, którzy już ją mają.</p>
      </div>

      <form method="post" action="{% url 'panel:newsletter_mailings:test' object.pk %}" class="flex flex-wrap items-end gap-3">
        {% csrf_token %}
        <div class="min-w-56 flex-1">
          <label class="label" for="{{ test_form.email.id_for_label }}">{{ test_form.email.label }}</label>
          <div class="mt-1">{{ test_form.email }}</div>
        </div>
        <button class="btn-ghost" type="submit">Wyślij próbna</button>
      </form>

      <form method="post" action="{% url 'panel:newsletter_mailings:send' object.pk %}"
            class="border-t border-slate-200 pt-4 dark:border-slate-800"
            data-confirm="Wysłać wiadomość do {{ pending_count }} subskrybentów? Tego nie da się cofnąć.">
        {% csrf_token %}
        <button class="btn-primary" type="submit" {% if not pending_count %}disabled{% endif %}>
          {% if object.status == 'failed' %}Ponow wysyłkę{% else %}Wyślij do subskrybentów{% endif %} ({{ pending_count }})
        </button>
        {% if not pending_count %}
          <p class="help mt-2">Nie ma adresu do wysyłki - lista jest pusta, adresy czekają na potwierdzenie
            albo wszyscy już dostali tę wiadomość.</p>
        {% endif %}
      </form>
    </div>
  </div>
{% endif %}

{% if deliveries %}
  <div class="card max-w-3xl">
    <div class="card-body space-y-4">
      <div class="space-y-1">
        <h2 class="text-sm font-semibold text-slate-900 dark:text-slate-100">Doręczenia</h2>
        <p class="help">Jeden wpis na adres - stąd wiadomo, komu wysyłka już poszła, a komu nie.</p>
      </div>
      <div class="overflow-x-auto">
        <table class="table">
          <thead class="bg-slate-50 dark:bg-slate-900/60">
            <tr>
              <th class="th">Adres</th>
              <th class="th">Status</th>
              <th class="th">Kiedy</th>
              <th class="th">Powód</th>
            </tr>
          </thead>
          <tbody class="divide-y divide-slate-100 dark:divide-slate-800">
            {% for item in deliveries %}
              <tr>
                <td class="td">{{ item.email }}</td>
                <td class="td"><span class="badge {{ item.badge_class }}">{{ item.get_status_display|lower }}</span></td>
                <td class="td whitespace-nowrap">{{ item.sent_at|date:"SHORT_DATETIME_FORMAT"|default:"-" }}</td>
                <td class="td text-xs text-slate-500 dark:text-slate-400">{{ item.error|default:"-" }}</td>
              </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
    </div>
  </div>
{% endif %}
{% endblock %}