{% extends 'panel/base.html' %}
{% load listing revisions %}

{% block panel_title %}Blog · Posty{% endblock %}
{% block heading %}Blog · Posty{% endblock %}
{% block subheading %}<p class="text-sm text-slate-500 dark:text-slate-400">Wpisy bloga.</p>{% endblock %}
{% block actions %}<a class="btn-primary" href="{% url 'panel:blog:post_create' %}">Nowy wpis</a>{% endblock %}

{% block content %}
<form method="get" class="flex flex-wrap gap-2">
  <input class="input max-w-xs" type="search" name="q" value="{{ query }}" placeholder="Szukaj w tytule i treści">
  <select class="input max-w-[10rem]" name="status">
    <option value="">Każdy status</option>
    {% for value, label in statuses %}
      <option value="{{ value }}" {% if value == status %}selected{% endif %}>{{ label }}</option>
    {% endfor %}
  </select>
  <select class="input max-w-[12rem]" name="stan">
    <option value="">Każdy stan publikacji</option>
    {% for value, label in states %}
      <option value="{{ value }}" {% if value == state %}selected{% endif %}>{{ label }}</option>
    {% endfor %}
  </select>
  <select class="input max-w-[12rem]" name="kategoria">
    <option value="">Każda kategoria</option>
    {% for cat in categories %}
      <option value="{{ cat.pk }}" {% if cat.pk|stringformat:"s" == category %}selected{% endif %}>{{ cat.name }}</option>
    {% endfor %}
  </select>
  <button class="btn-ghost" type="submit">Filtruj</button>
  {% if query or status or category or state %}<a class="btn-ghost" href="{% url 'panel:blog:index' %}">Wyczyść</a>{% endif %}
</form>

{% comment %}Jeden formularz na cała tabelę - akcje zbiorcze idą do widoku
   `bulk`, a przyciski wiersza podmieniają adres atrybutem `formaction`
   (formularza w formularzu być nie może). Pole `next` niesie powrót na tę
   sama stronę listy, z filtrem i kolejnością.{% endcomment %}
<form method="post" action="{% url 'panel:blog:bulk' %}" data-bulk data-no-guard class="space-y-4">
  {% csrf_token %}
  <input type="hidden" name="next" value="{{ request.get_full_path }}">

  <section class="card overflow-hidden">
    <div class="overflow-x-auto">
      <table class="table">
        <thead class="bg-slate-50 dark:bg-slate-900/60">
          <tr>
            <th class="th w-10">{% include 'panel/partials/check-all.html' %}</th>
            <th class="th">{% sort_header 'tytul' 'Tytuł' %}</th>
            <th class="th">{% sort_header 'kategoria' 'Kategoria' %}</th>
            <th class="th">{% sort_header 'autor' 'Autor' %}</th>
            <th class="th">Publikacja</th>
            <th class="th">{% sort_header 'okno' 'Okno' %}</th>
            <th class="th">{% sort_header 'zmiana' 'Ostatnia zmiana' %}</th>
            <th class="th text-right">Akcje</th>
          </tr>
        </thead>
        <tbody class="divide-y divide-slate-100 dark:divide-slate-800">
          {% for post in page_obj %}
            <tr class="hover:bg-slate-50 dark:hover:bg-slate-800/50">
              <td class="td">{% include 'panel/partials/check.html' with value=post.pk label=post.title %}</td>
              <td class="td">
                <span class="block font-medium">{{ post.title }}</span>
                <span class="text-xs text-slate-400">/{{ post.slug }}</span>
              </td>
              <td class="td">{{ post.category.name|default:"-" }}</td>
              <td class="td">{% firstof post.author.get_full_name post.author.username "-" %}</td>
              <td class="td">
                <span class="badge {{ post.publication.badge }}">{{ post.publication.label }}</span>
              </td>
              <td class="td whitespace-nowrap text-xs text-slate-500 dark:text-slate-400">
                {{ post.published_at|date:"d.m.Y H:i"|default:"bez daty" }} &ndash; {{ post.unpublish_at|date:"d.m.Y H:i"|default:"bez konca" }}
              </td>
              <td class="td whitespace-nowrap text-xs text-slate-500 dark:text-slate-400">{{ post.updated_at|date:"d.m.Y H:i" }}</td>
              <td class="td">
                <div class="flex justify-end gap-2">
                  {% if post.publication.visible %}
                    <a class="btn-ghost !px-3 !py-1 text-xs" href="{{ post.get_absolute_url }}" target="_blank" rel="noopener">Podgląd</a>
                  {% else %}
                    {% with draft=post|preview_url %}
                      {% if draft %}<a class="btn-ghost !px-3 !py-1 text-xs" href="{{ draft }}" target="_blank" rel="noopener">Zobacz szkic</a>{% endif %}
                    {% endwith %}
                  {% endif %}
                  <a class="btn-ghost !px-3 !py-1 text-xs" href="{{ post|history_url }}">Historia</a>
                  <a class="btn-ghost !px-3 !py-1 text-xs" href="{% url 'panel:blog:post_edit' post.pk %}">Edytuj</a>
                  <button class="btn-danger !px-3 !py-1 text-xs" type="submit"
                          formaction="{% url 'panel:blog:post_delete' post.pk %}"
                          data-confirm="Usunąć wpis {{ post.title }}? Razem z nim znika jego historia zmian.">Usuń</button>
                </div>
              </td>
            </tr>
          {% empty %}
            {% url 'panel:blog:post_create' as create_url %}
            {% include 'panel/partials/empty.html' with colspan=8 url=create_url action="Nowy wpis" title="Nie ma jeszcze żadnego wpisu." hint="Wpisy bloga pokazują się pod adresem /blog/ i w kanale RSS. Pierwszy wpis możesz zapisać jako szkic - na stronę wejdzie dopiero wtedy, kiedy ustawisz mu datę publikacji." %}
          {% endfor %}
        </tbody>
      </table>
    </div>

    {% include 'panel/partials/pagination.html' %}
  </section>

  {% if page_obj %}
    <section class="card">
      <div class="card-body flex flex-wrap items-center gap-2">
        <span class="mr-2 text-sm text-slate-500 dark:text-slate-400" data-bulk-count>Zaznacz wiersze, żeby wykonać akcje na kilku naraz.</span>
        <button class="btn-ghost" type="submit" name="action" value="publish" data-bulk-action disabled>Opublikuj</button>
        <button class="btn-ghost" type="submit" name="action" value="draft" data-bulk-action disabled>Cofnij do szkicu</button>
        <button class="btn-danger" type="submit" name="action" value="delete" data-bulk-action disabled
                data-confirm="Usunąć zaznaczone wpisy? Razem z nimi znika ich historia zmian.">Usuń zaznaczone</button>
      </div>
    </section>
  {% endif %}
</form>
{% endblock %}