修复左侧list和右侧甘特视图滚动偏差,行无法对齐问题

This commit is contained in:
qiuchengw
2025-09-25 11:43:05 +08:00
parent 185c6047cc
commit 139b76423f
3 changed files with 7 additions and 8 deletions
+3 -5
View File
@@ -313,14 +313,12 @@ const handleTaskListScroll = (event: Event) => {
detail: { scrollTop },
}),
)
}
// 处理Timeline垂直滚动同步
}// 处理Timeline垂直滚动同步
const handleTimelineVerticalScroll = (event: CustomEvent) => {
const { scrollTop } = event.detail
const taskListBodyElement = document.querySelector('.task-list-body') as HTMLElement
if (taskListBodyElement && taskListBodyElement.scrollTop !== scrollTop) {
// 避免循环触发,只在scrollTop不同时才设置
if (taskListBodyElement && Math.abs(taskListBodyElement.scrollTop - scrollTop) > 1) {
// 使用更精确的比较,避免1px以内的细微差异导致的循环触发
taskListBodyElement.scrollTop = scrollTop
}
}
+2 -1
View File
@@ -518,7 +518,8 @@ onUnmounted(() => {
.task-row {
display: flex;
border-bottom: 1px solid var(--gantt-border-light);
height: 50px;
height: 51px; /* 修改为51px,与Timeline中的task-row高度保持一致,包含border-bottom 1px */
box-sizing: border-box; /* 确保border包含在高度计算中 */
background: var(--gantt-bg-primary);
align-items: center;
color: var(--gantt-text-secondary);
+2 -2
View File
@@ -1543,8 +1543,8 @@ onMounted(() => {
const handleTaskListVerticalScroll = (event: CustomEvent) => {
const { scrollTop } = event.detail
const timelineBody = document.querySelector('.timeline-body') as HTMLElement
if (timelineBody && timelineBody.scrollTop !== scrollTop) {
// 避免循环触发,只在scrollTop不同时才设置
if (timelineBody && Math.abs(timelineBody.scrollTop - scrollTop) > 1) {
// 使用更精确的比较,避免1px以内的细微差异导致的循环触发
timelineBody.scrollTop = scrollTop
}
}