fix: correct duty list scrolling behavior and simplify current duty check
All checks were successful
CI / lint-and-test (push) Successful in 25s
All checks were successful
CI / lint-and-test (push) Successful in 25s
- Removed unnecessary condition for determining if a duty is current, streamlining the logic. - Refactored the scrolling functionality to ensure the view correctly focuses on the current duty or today's block. - Improved code clarity by consolidating the scroll target logic into a reusable function.
This commit is contained in:
@@ -136,7 +136,7 @@ export function renderDutyList(duties) {
|
||||
dayDuties.forEach((d) => {
|
||||
const start = new Date(d.start_at);
|
||||
const end = new Date(d.end_at);
|
||||
const isCurrent = isToday && start <= now && now < end;
|
||||
const isCurrent = start <= now && now < end;
|
||||
dayHtml +=
|
||||
'<div class="duty-timeline-row">' +
|
||||
dateCellHtml +
|
||||
@@ -160,18 +160,25 @@ export function renderDutyList(duties) {
|
||||
"</div>";
|
||||
});
|
||||
dutyListEl.innerHTML = fullHtml;
|
||||
const scrollTarget = dutyListEl.querySelector(".duty-timeline-day--today");
|
||||
if (scrollTarget) {
|
||||
const calendarSticky = document.getElementById("calendarSticky");
|
||||
const calendarSticky = document.getElementById("calendarSticky");
|
||||
const scrollToEl = (el) => {
|
||||
if (!el) return;
|
||||
if (calendarSticky) {
|
||||
requestAnimationFrame(() => {
|
||||
const calendarHeight = calendarSticky.offsetHeight;
|
||||
const todayTop = scrollTarget.getBoundingClientRect().top + window.scrollY;
|
||||
const scrollTop = Math.max(0, todayTop - calendarHeight);
|
||||
const top = el.getBoundingClientRect().top + window.scrollY;
|
||||
const scrollTop = Math.max(0, top - calendarHeight);
|
||||
window.scrollTo({ top: scrollTop, behavior: "auto" });
|
||||
});
|
||||
} else {
|
||||
scrollTarget.scrollIntoView({ behavior: "auto", block: "start" });
|
||||
el.scrollIntoView({ behavior: "auto", block: "start" });
|
||||
}
|
||||
};
|
||||
const currentDutyCard = dutyListEl.querySelector(".duty-item--current");
|
||||
const todayBlock = dutyListEl.querySelector(".duty-timeline-day--today");
|
||||
if (currentDutyCard) {
|
||||
scrollToEl(currentDutyCard);
|
||||
} else if (todayBlock) {
|
||||
scrollToEl(todayBlock);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user