86 lines
6.9 KiB
HTML
86 lines
6.9 KiB
HTML
{% extends "base.html" %}
|
||
{% block title %}Séries - Kodi{% endblock %}
|
||
{% block content %}
|
||
<div class="bg-white dark:bg-gray-800 rounded-2xl shadow p-4 md:p-6 mb-6 border">
|
||
<form method="get" action="/shows" class="grid grid-cols-1 md:grid-cols-6 gap-3 items-end">
|
||
<input type="hidden" name="view" value="{{ view }}"><input type="hidden" name="dir" value="{{ direction }}"><input type="hidden" name="page" value="{{ page }}">
|
||
<div><label class="block text-sm font-medium mb-1">Recherche</label><input type="text" name="q" value="{{ q }}" class="w-full rounded-xl border px-3 py-2 dark:bg-gray-900 dark:border-gray-700"></div>
|
||
<div><label class="block text-sm font-medium mb-1">Diffuseur</label><input type="text" name="network" value="{{ network }}" class="w-full rounded-xl border px-3 py-2 dark:bg-gray-900 dark:border-gray-700"></div>
|
||
<div><label class="block text-sm font-medium mb-1">Genre</label><input type="text" name="genre" value="{{ genre }}" class="w-full rounded-xl border px-3 py-2 dark:bg-gray-900 dark:border-gray-700"></div>
|
||
<div><label class="block text-sm font-medium mb-1">Année min</label><input type="number" name="year_from" value="{{ year_from }}" class="w-full rounded-xl border px-3 py-2 dark:bg-gray-900 dark:border-gray-700"></div>
|
||
<div><label class="block text-sm font-medium mb-1">Année max</label><input type="number" name="year_to" value="{{ year_to }}" class="w-full rounded-xl border px-3 py-2 dark:bg-gray-900 dark:border-gray-700"></div>
|
||
<div class="flex gap-2">
|
||
<button class="rounded-xl px-4 py-2 bg-indigo-600 text-white">Filtrer</button>
|
||
<a href="/shows?view={{ view }}" class="rounded-xl px-4 py-2 border dark:border-gray-600">Réinitialiser</a>
|
||
<a href="/export_shows.csv?{{ build_querystring() }}" class="rounded-xl px-4 py-2 bg-emerald-600 text-white">Export CSV</a>
|
||
</div>
|
||
<div class="md:col-span-6 flex items-center gap-2 mt-1">
|
||
<span class="text-sm">Vue :</span>
|
||
<a href="/shows?{{ build_querystring(view='gallery', page=1, per_page=24) }}" class="text-sm px-3 py-1 rounded-lg border {{ 'bg-indigo-600 text-white' if view=='gallery' else '' }}">Galerie</a>
|
||
<a href="/shows?{{ build_querystring(view='list', page=1, per_page=25) }}" class="text-sm px-3 py-1 rounded-lg border {{ 'bg-indigo-600 text-white' if view=='list' else '' }}">Liste</a>
|
||
<div class="ml-auto flex items-center gap-2">
|
||
<label class="text-sm">Trier par :</label>
|
||
<select name="sort" onchange="this.form.page.value=1; this.form.submit()" class="rounded-xl border px-2 py-1 dark:bg-gray-900 dark:border-gray-700">
|
||
{% for key,label in {'title':'Titre','original':'Original','network':'Diffuseur','genre':'Genre','year':'Année','date':'Date'}.items() %}
|
||
<option value="{{key}}" {% if sort==key %}selected{% endif %}>{{label}}</option>
|
||
{% endfor %}
|
||
</select>
|
||
{% set dir_toggle = ('desc' if direction=='asc' else 'asc') %}
|
||
<a href="/shows?{{ build_querystring(dir=dir_toggle, page=1) }}" class="text-sm px-3 py-1 rounded-lg border">{{ '▲ Asc' if direction=='asc' else '▼ Desc' }}</a>
|
||
<label class="text-sm ml-3">Par page :</label>
|
||
<select name="per_page" onchange="this.form.page.value=1; this.form.submit()" class="rounded-xl border px-2 py-1 dark:bg-gray-900 dark:border-gray-700">
|
||
{% if view=='gallery' %}{% for n in (12,24,48,96) %}<option value="{{n}}" {% if per_page==n %}selected{% endif %}>{{n}}</option>{% endfor %}
|
||
{% else %}{% for n in (10,25,50,100) %}<option value="{{n}}" {% if per_page==n %}selected{% endif %}>{{n}}</option>{% endfor %}{% endif %}
|
||
</select>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
<div class="mb-3 text-sm">Résultats: <span class="font-semibold">{{ total }}</span></div>
|
||
{% if view == 'gallery' %}
|
||
<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6 gap-4">
|
||
{% for s in shows %}
|
||
<a href="/show/{{ s.id }}" class="group block border rounded-2xl overflow-hidden shadow dark:border-gray-700">
|
||
{% if s.poster %}<img src="{{ s.poster }}" class="w-full aspect-[2/3] object-cover">{% else %}<div class="w-full aspect-[2/3] bg-gray-200 dark:bg-gray-700"></div>{% endif %}
|
||
<div class="p-2">
|
||
<div class="text-sm font-medium line-clamp-2 group-hover:underline">{{ s.titre|default('—') }}</div>
|
||
<div class="text-xs text-gray-500 dark:text-gray-400 mt-1">{% if s.year %}{{ s.year }}{% endif %}{% if s.genre %} • {{ s.genre }}{% endif %}</div>
|
||
</div>
|
||
</a>
|
||
{% endfor %}
|
||
{% if shows|length == 0 %}<div class="col-span-full text-center py-8">Aucun résultat.</div>{% endif %}
|
||
</div>
|
||
{% else %}
|
||
<div class="bg-white dark:bg-gray-800 rounded-2xl shadow overflow-x-auto border">
|
||
<table class="min-w-full text-sm">
|
||
<thead><tr><th class="text-left px-4 py-2">Poster</th><th class="text-left px-4 py-2">Titre</th><th class="text-left px-4 py-2">Original</th><th class="text-left px-4 py-2">Genre</th><th class="text-left px-4 py-2">Diffuseur</th><th class="text-left px-4 py-2">Année</th><th class="text-left px-4 py-2">Date</th></tr></thead>
|
||
<tbody>
|
||
{% for s in shows %}
|
||
<tr class="border-t dark:border-gray-700 hover:bg-gray-50 dark:hover:bg-gray-700/40">
|
||
<td class="px-4 py-2">{% if s.poster %}<img src="{{ s.poster }}" class="w-10 h-16 object-cover rounded-lg shadow">{% else %}<div class="w-10 h-16 bg-gray-200 dark:bg-gray-700 rounded-lg"></div>{% endif %}</td>
|
||
<td class="px-4 py-2"><a href="/show/{{ s.id }}" class="text-indigo-600 dark:text-indigo-400 hover:underline">{{ s.titre|default('—') }}</a></td>
|
||
<td class="px-4 py-2">{{ s.original|none_to_dash }}</td>
|
||
<td class="px-4 py-2">{{ s.genre|none_to_dash }}</td>
|
||
<td class="px-4 py-2">{{ s.diffuseur|none_to_dash }}</td>
|
||
<td class="px-4 py-2">{{ s.year if s.year else '—' }}</td>
|
||
<td class="px-4 py-2">{{ s.date if s.date else '—' }}</td>
|
||
</tr>
|
||
{% endfor %}
|
||
{% if shows|length == 0 %}<tr><td colspan="7" class="px-4 py-6 text-center">Aucun résultat.</td></tr>{% endif %}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
{% endif %}
|
||
{% if last_page > 1 %}
|
||
<nav class="mt-6 flex items-center justify-center gap-2 flex-wrap">
|
||
<a href="/shows?{{ build_querystring(page=1) }}" class="px-3 py-1 rounded-lg border {{ 'opacity-60 pointer-events-none' if page==1 else '' }}">«</a>
|
||
<a href="/shows?{{ build_querystring(page=page-1) }}" class="px-3 py-1 rounded-lg border">‹</a>
|
||
{% for p in range(start_page, end_page + 1) %}
|
||
<a href="/shows?{{ build_querystring(page=p) }}" class="px-3 py-1 rounded-lg border {{ 'bg-indigo-600 text-white' if p==page else '' }}">{{ p }}</a>
|
||
{% endfor %}
|
||
<a href="/shows?{{ build_querystring(page=page+1) }}" class="px-3 py-1 rounded-lg border">›</a>
|
||
<a href="/shows?{{ build_querystring(page=last_page) }}" class="px-3 py-1 rounded-lg border {{ 'opacity-60 pointer-events-none' if page==last_page else '' }}">»</a>
|
||
</nav>
|
||
{% endif %}
|
||
{% endblock %}
|