refactor(ui): 优化移动端编辑交互逻辑

This commit is contained in:
2026-04-21 09:26:58 +08:00
parent 332bfc9b45
commit dfaff637af

View File

@@ -1034,7 +1034,7 @@
} }
} }
// 双击进入编辑模式(电脑端和移动端通用) // 双击进入编辑模式(电脑端)
element.addEventListener('dblclick', (e) => { element.addEventListener('dblclick', (e) => {
e.stopPropagation(); e.stopPropagation();
startEdit(element); startEdit(element);
@@ -1042,20 +1042,45 @@
setTimeout(() => { element.dataset.justEdited = 'false'; }, 200); setTimeout(() => { element.dataset.justEdited = 'false'; }, 200);
}); });
// 单击选中显示删除按钮 // 单击选中并进入编辑模式(移动端友好)
element.addEventListener('click', (e) => { element.addEventListener('click', (e) => {
if (hasMoved) return; if (hasMoved) return;
if (element.dataset.justEdited === 'true') return; if (element.dataset.justEdited === 'true') return;
element.classList.add('selected');
// 如果已经在编辑中,不重复进入
if (editingInput === element) return;
// 选中并立即进入编辑模式
selectInput(element);
startEdit(element);
}); });
// 触摸双击检测(移动端双击进入编辑) // 移动端:触摸结束后进入编辑(更灵敏)
let lastTapTime = 0; let lastTapTime = 0;
let touchEditTriggered = false;
element.addEventListener('touchend', (e) => { element.addEventListener('touchend', (e) => {
// 如果正在拖拽,不触发编辑
if (isDragging) return;
// 防止 touchend 后立即触发 click 导致重复进入编辑
e.preventDefault();
e.stopPropagation();
const currentTime = Date.now(); const currentTime = Date.now();
// 双击检测(300ms内两次点击)
if (currentTime - lastTapTime < 300) { if (currentTime - lastTapTime < 300) {
e.stopPropagation(); // 双击已在 click 事件中处理,这里不重复
startEdit(element); touchEditTriggered = true;
} else {
// 单击延迟处理,避免与拖拽冲突
touchEditTriggered = false;
setTimeout(() => {
if (!isDragging && !touchEditTriggered && editingInput !== element) {
touchEditTriggered = true;
selectInput(element);
startEdit(element);
}
}, 50);
} }
lastTapTime = currentTime; lastTapTime = currentTime;
}); });