Files
ACORE/templates/pages/dashboard.html
T
lokses 3387418332 dashboard: группировка виджетов по ширине (½ / полная)
Каждому виджету можно задать ширину: «Полная» (на всю строку) или «½».
Виджеты выстраиваются в flex-сетку: два «½» встают в один ряд, «Полная»
занимает строку целиком. На узких экранах половинные переносятся в столбик.

- DashboardLayout.widget_widths (JSON {ключ: half|full}) + миграция 0022;
  поле widgets не тронуто — обратная совместимость сохранена
- core/dashboard: layout_widths, ширина в build_dashboard_context/
  customize_rows, save_layout(widths=...), normalize_width
- dashboard.html: flex-wrap сетка по ширине; customize: переключатель ½/полная
- tests: 6 (сохранение/чтение ширин, нормализация, дефолт, контекст, POST)

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-09-22 10:47:14 +03:00

26 lines
2.1 KiB
HTML

{% load i18n %}
<div class="page-content">
<div style="display: flex; justify-content: flex-end; margin-bottom: 0.75rem;">
<button class="btn btn-secondary" style="border: 1px solid var(--color-border); font-size: 0.8125rem; display: inline-flex; align-items: center; gap: 0.4rem;"
hx-get="/dashboard/customize/" hx-target="#main-content" hx-push-url="/dashboard/customize/" hx-indicator="#loader">
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg>
{% trans "Настроить дашборд" %}
</button>
</div>
<div style="display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: flex-start;">
{% for w in dashboard_widgets %}
<div style="{% if w.width == 'half' %}flex: 1 1 calc(50% - 0.75rem); min-width: min(100%, 22rem);{% else %}flex: 1 1 100%; min-width: 0;{% endif %}">
{% include w.template %}
</div>
{% empty %}
<div style="flex: 1 1 100%; padding: 2rem; text-align: center; color: var(--color-muted-foreground); font-size: 0.875rem;">
{% trans "Все виджеты скрыты." %}
<a href="/dashboard/customize/" hx-get="/dashboard/customize/" hx-target="#main-content" hx-push-url="/dashboard/customize/" hx-indicator="#loader" style="color: var(--color-primary);">{% trans "Настроить дашборд" %}</a>
</div>
{% endfor %}
</div>
</div>