Allow filtering by game, edition, purchase from the session list

This commit is contained in:
2023-02-19 14:30:26 +01:00
parent 33939f631c
commit 938c82a395
5 changed files with 50 additions and 7 deletions

View File

@ -10,13 +10,13 @@
{% if dataset.count >= 1 %}
<div class="mb-4">Total playtime: {{ total_duration }} over {{ dataset.count }} sessions.</div>
{% endif %}
{% if purchase or platform or edition %}
{% if purchase or platform or edition or game or ownership_type %}
<span class="block">
<a class="text-red-400 inline" href="{% url 'list_sessions' %}">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 inline">
<path stroke-linecap="round" stroke-linejoin="round" d="M9.75 9.75l4.5 4.5m0-4.5l-4.5 4.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>
</a>Filtering by "{% firstof purchase platform edition %}"
</a>Filtering by "{% firstof purchase platform game edition ownership_type %}"
</span>
{% if purchase %}<a class="dark:text-white hover:underline block" href="{% url 'list_sessions_by_edition' purchase.edition.id %}">See all platforms</a>{% endif %}
{% endif %}
@ -31,15 +31,24 @@
</a>
{% endif %}
</div>
<div id="session-table" class="gap-4 shadow rounded-xl max-w-screen-lg mx-auto dark:bg-slate-700 p-2 justify-center">
<div class="dark:border-white dark:text-slate-300 text-lg">Name</div>
<div id="session-table" class="gap-4 shadow rounded-xl max-w-screen-2xl mx-auto dark:bg-slate-700 p-2 justify-center">
<div class="dark:border-white dark:text-slate-300 text-lg">Purchase</div>
<div class="dark:border-white dark:text-slate-300 text-lg">Platform</div>
<div class="dark:border-white dark:text-slate-300 text-lg text-center">Start</div>
<div class="dark:border-white dark:text-slate-300 text-lg text-center">End</div>
<div class="dark:border-white dark:text-slate-300 text-lg">Duration</div>
<div class="dark:border-white dark:text-slate-300 text-lg text-right">Manage</div>
{% for data in dataset %}
<div class="dark:text-white overflow-hidden text-ellipsis whitespace-nowrap"><a class="hover:underline" href="{% url 'list_sessions_by_purchase' data.purchase.id %}">{{ data.purchase.edition }}</a></div>
<div class="purchase-name">
<span class="dark:text-white overflow-hidden text-ellipsis whitespace-nowrap">{{ data.purchase.edition }} <span class="dark:text-slate-400">({{ data.purchase.get_ownership_type_display }})</span></span>
<span class="dark:text-slate-700 transition-colors duration-300">
(<a class="hover:underline" href="{% url 'list_sessions_by_game' data.purchase.edition.game.id %}">G</a>,
<a class="hover:underline" href="{% url 'list_sessions_by_edition' data.purchase.edition.id %}">E</a>,
<a class="hover:underline" href="{% url 'list_sessions_by_purchase' data.purchase.id %}">P</a>,
<a class="hover:underline" href="{% url 'list_sessions_by_ownership_type' data.purchase.ownership_type %}">O</a>)
</span>
</div>
<div class="dark:text-white overflow-hidden text-ellipsis whitespace-nowrap"><a class="hover:underline" href="{% url 'list_sessions_by_platform' data.purchase.platform.id %}">{{ data.purchase.platform }}</a></div>
<div class="dark:text-slate-400 text-center">{{ data.timestamp_start | date:"d/m/Y H:i" }}</div>
<div class="dark:text-slate-400 text-center">