Add 'Today' button next to date filter label
This commit is contained in:
@@ -361,6 +361,7 @@ class DateCarousel {
|
||||
attachNavHandlers() {
|
||||
const prevBtn = this.container.parentElement.querySelector('.carousel-prev');
|
||||
const nextBtn = this.container.parentElement.querySelector('.carousel-next');
|
||||
const todayBtn = this.container.parentElement.querySelector('.today-btn');
|
||||
|
||||
if (prevBtn) {
|
||||
prevBtn.addEventListener('click', () => this.shiftDays(-1));
|
||||
@@ -369,6 +370,40 @@ class DateCarousel {
|
||||
if (nextBtn) {
|
||||
nextBtn.addEventListener('click', () => this.shiftDays(1));
|
||||
}
|
||||
|
||||
if (todayBtn) {
|
||||
todayBtn.addEventListener('click', () => this.goToToday());
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Переход к сегодняшней дате
|
||||
*/
|
||||
goToToday() {
|
||||
const today = new Date();
|
||||
today.setHours(0, 0, 0, 0);
|
||||
|
||||
// Устанавливаем сегодняшнюю дату в фильтр
|
||||
const formattedDate = this.formatDate(today);
|
||||
this.minInput.value = formattedDate;
|
||||
this.maxInput.value = formattedDate;
|
||||
|
||||
// Устанавливаем сегодняшнюю дату как центральную
|
||||
this.centerDate = today;
|
||||
|
||||
// Сохраняем новую центральную дату без смещения
|
||||
this.saveCenterDate();
|
||||
|
||||
// Очищаем выделение с других кнопок и обновляем визуальное состояние
|
||||
this.render();
|
||||
|
||||
console.log(`Navigated to today: ${formattedDate}`);
|
||||
|
||||
// Автоматическая отправка формы
|
||||
const form = this.minInput.closest('form');
|
||||
if (form) {
|
||||
form.submit();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -14,11 +14,20 @@
|
||||
{% load static %}
|
||||
|
||||
<div class="date-range-filter mb-3">
|
||||
<label class="form-label">
|
||||
<div class="d-flex align-items-center justify-content-between">
|
||||
<label class="form-label mb-0">
|
||||
<i class="bi bi-{{ icon|default:'calendar-range' }}"></i>
|
||||
{{ label }}
|
||||
</label>
|
||||
|
||||
<button type="button" class="btn btn-sm btn-outline-primary ms-2 today-btn"
|
||||
data-min-input="{{ field_after.id_for_label }}"
|
||||
data-max-input="{{ field_before.id_for_label }}"
|
||||
title="Сегодня">
|
||||
Сегодня
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Скрытые поля для хранения дат -->
|
||||
<div class="d-none">
|
||||
{{ field_after }}
|
||||
|
||||
Reference in New Issue
Block a user