Features: 1) Streamline component inclusion in admin dashboard; 2) Simplify KPIs and sales data layout; 3) Revise product list card structure for better readability and maintainability;

Fixes: 1) Remove redundant breaks and unnecessary div wrappings; 2) Simplify filters component by eliminating unnecessary card wrapper;

Extra: Refactor and clean up admin dashboard templates for decluttered structure and improved code consistency;
This commit is contained in:
Egor Pavlovich Gorbunov 2025-12-10 20:25:54 +03:00
parent d891000b19
commit 76cea49c06
3 changed files with 79 additions and 97 deletions

View file

@ -1,10 +1,6 @@
{% load i18n unfold %} {% load i18n unfold %}
{% component "unfold/components/card.html" with class="mb-4" %}
<div class="flex flex-wrap items-center gap-2"> <div class="flex flex-wrap items-center gap-2">
{% component "unfold/components/text.html" with class="text-sm text-gray-500 dark:text-gray-400 mr-2" %}
{% trans "Timeframe" %}
{% endcomponent %}
{% with cur=tf|default:30 %} {% with cur=tf|default:30 %}
<a href="?tf=7" <a href="?tf=7"
class="px-3 py-1 rounded-full text-sm border transition-colors {% if cur == 7 %} bg-gray-900 text-white dark:bg-white dark:text-gray-900 border-transparent {% else %} border-gray-300 dark:border-gray-700 hover:bg-gray-100 dark:hover:bg-gray-800 {% endif %}">7d</a> class="px-3 py-1 rounded-full text-sm border transition-colors {% if cur == 7 %} bg-gray-900 text-white dark:bg-white dark:text-gray-900 border-transparent {% else %} border-gray-300 dark:border-gray-700 hover:bg-gray-100 dark:hover:bg-gray-800 {% endif %}">7d</a>
@ -15,8 +11,4 @@
<a href="?tf=360" <a href="?tf=360"
class="px-3 py-1 rounded-full text-sm border transition-colors {% if cur == 360 %} bg-gray-900 text-white dark:bg-white dark:text-gray-900 border-transparent {% else %} border-gray-300 dark:border-gray-700 hover:bg-gray-100 dark:hover:bg-gray-800 {% endif %}">360d</a> class="px-3 py-1 rounded-full text-sm border transition-colors {% if cur == 360 %} bg-gray-900 text-white dark:bg-white dark:text-gray-900 border-transparent {% else %} border-gray-300 dark:border-gray-700 hover:bg-gray-100 dark:hover:bg-gray-800 {% endif %}">360d</a>
{% endwith %} {% endwith %}
{# <div class="ml-auto text-xs text-gray-400">#}
{# TODO: Integrate GA/Yandex.Metrica & Ads metrics#}
{# </div>#}
</div> </div>
{% endcomponent %}

View file

@ -1,6 +1,5 @@
{% load i18n unfold %} {% load i18n unfold %}
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mt-6">
{% component "unfold/components/card.html" %} {% component "unfold/components/card.html" %}
{% component "unfold/components/title.html" %} {% component "unfold/components/title.html" %}
{% trans "Most wished product" %} {% trans "Most wished product" %}
@ -68,4 +67,3 @@
{% endcomponent %} {% endcomponent %}
{% endif %} {% endif %}
{% endcomponent %} {% endcomponent %}
</div>

View file

@ -18,18 +18,14 @@
<div class="flex flex-col min-h-screen"> <div class="flex flex-col min-h-screen">
{% component "unfold/components/title.html" %} {% component "unfold/components/title.html" %}
{% trans "Dashboard" %} {% trans "Dashboard" %}
<br/>
{% endcomponent %}
{% include "admin/dashboard/_filters.html" %} {% include "admin/dashboard/_filters.html" %}
{% endcomponent %}
{% include "admin/dashboard/_kpis.html" %} {% include "admin/dashboard/_kpis.html" %}
<div class="grid grid-cols-1 xl:grid-cols-3 gap-6 items-start"> <div class="grid grid-cols-1 xl:grid-cols-3 gap-6 items-start">
<div class="xl:col-span-2">
{% include "admin/dashboard/_daily_sales.html" %} {% include "admin/dashboard/_daily_sales.html" %}
</div> </div>
</div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mt-6"> <div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mt-6">
{% include "admin/dashboard/_low_stock.html" %} {% include "admin/dashboard/_low_stock.html" %}
@ -43,11 +39,7 @@
{% endif %} {% endif %}
</div> </div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mt-6">
{% include "admin/dashboard/_top_categories.html" %} {% include "admin/dashboard/_top_categories.html" %}
{% include "admin/dashboard/_quick_links.html" %}
</div>
{% include "admin/dashboard/_product_lists.html" %} {% include "admin/dashboard/_product_lists.html" %}
{% component "unfold/components/separator.html" %} {% component "unfold/components/separator.html" %}