Улучшение календаря фильтра дат: выбранные даты теперь всегда видны на экране

This commit is contained in:
2025-12-27 02:42:26 +03:00
parent 1654962ba2
commit 7d7038e67b

View File

@@ -40,11 +40,18 @@ class DateCarousel {
this.today.setHours(0, 0, 0, 0); this.today.setHours(0, 0, 0, 0);
this.daysCount = 0; // Будет рассчитано динамически this.daysCount = 0; // Будет рассчитано динамически
// Загружаем сохранённую дату из localStorage или устанавливаем сегодня // Проверяем, есть ли выбранная дата в фильтрах
// Но для нового поведения всегда устанавливаем сегодняшнюю дату как центральную const selectedDate = this.getSelectedDateFromInputs();
if (selectedDate && this.isDateInRange(selectedDate)) {
// Если выбранная дата в пределах разумного диапазона, используем её как центр
this.centerDate = new Date(selectedDate);
this.centerDate.setHours(0, 0, 0, 0);
} else {
// Иначе устанавливаем сегодняшнюю дату как центральную
this.centerDate = new Date(); this.centerDate = new Date();
this.centerDate.setHours(0, 0, 0, 0); // Сбрасываем время! this.centerDate.setHours(0, 0, 0, 0); // Сбрасываем время!
} }
}
/** /**
* Инициализация календарной ленты * Инициализация календарной ленты
@@ -56,6 +63,37 @@ class DateCarousel {
this.attachTodayHandler(); this.attachTodayHandler();
} }
/**
* Получение выбранной даты из input полей
*/
getSelectedDateFromInputs() {
// Проверяем, совпадают ли даты "от" и "до" - это означает, что выбран конкретный день
if (this.minInput.value && this.maxInput.value && this.minInput.value === this.maxInput.value) {
const selectedDate = new Date(this.minInput.value);
if (!isNaN(selectedDate.getTime())) {
return selectedDate;
}
}
return null;
}
/**
* Проверка, находится ли дата в разумном диапазоне (не слишком далеко от сегодня)
*/
isDateInRange(date) {
const today = new Date();
today.setHours(0, 0, 0, 0);
// Проверяем, находится ли дата в пределах примерно 1 года от сегодня
const minDate = new Date(today);
minDate.setFullYear(today.getFullYear() - 1);
const maxDate = new Date(today);
maxDate.setFullYear(today.getFullYear() + 1);
return date >= minDate && date <= maxDate;
}
/** /**
* Расчёт количества дней на основе доступной ширины * Расчёт количества дней на основе доступной ширины
*/ */
@@ -271,6 +309,9 @@ class DateCarousel {
console.log(`Selected date: ${formattedDate}, center stays at: ${this.formatDate(this.centerDate)}`); console.log(`Selected date: ${formattedDate}, center stays at: ${this.formatDate(this.centerDate)}`);
// Сохраняем текущую позицию карусели на время сессии
this.saveCenterDate();
// Автоматическая отправка формы // Автоматическая отправка формы
const form = this.minInput.closest('form'); const form = this.minInput.closest('form');
if (form) { if (form) {
@@ -359,21 +400,21 @@ class DateCarousel {
} }
/** /**
* Сохранение центральной даты в localStorage * Сохранение центральной даты в sessionStorage (только на время сессии)
*/ */
saveCenterDate() { saveCenterDate() {
const key = `date_carousel_center_${this.minInputId}`; const key = `date_carousel_center_${this.minInputId}`;
// Используем formatDate вместо toISOString для избежания проблем с часовыми поясами // Используем formatDate вместо toISOString для избежания проблем с часовыми поясами
const centerDateStr = this.formatDate(this.centerDate); const centerDateStr = this.formatDate(this.centerDate);
localStorage.setItem(key, centerDateStr); sessionStorage.setItem(key, centerDateStr);
} }
/** /**
* Загрузка центральной даты из localStorage * Загрузка центральной даты из sessionStorage
*/ */
loadSavedCenterDate() { loadSavedCenterDate() {
const key = `date_carousel_center_${this.minInputId}`; const key = `date_carousel_center_${this.minInputId}`;
const savedDateStr = localStorage.getItem(key); const savedDateStr = sessionStorage.getItem(key);
if (savedDateStr) { if (savedDateStr) {
const savedDate = new Date(savedDateStr); const savedDate = new Date(savedDateStr);