fix: 优化运动监控页面右键菜单逻辑,移除冗余事件监听,增强事件处理的准确性和用户体验
This commit is contained in:
parent
5cd5ecba20
commit
a46c170fbb
@ -424,12 +424,6 @@ onMounted(async () => {
|
||||
contextMenuState.value = state;
|
||||
});
|
||||
|
||||
// 监听EditorService的自定义右键菜单事件
|
||||
if (editor.value) {
|
||||
(editor.value as any).on('customContextMenu', (event: Record<string, unknown>) => {
|
||||
handleEditorContextMenu(event);
|
||||
});
|
||||
}
|
||||
|
||||
// 添加全局点击事件监听器,用于关闭右键菜单
|
||||
document.addEventListener('click', handleGlobalClick);
|
||||
@ -572,18 +566,29 @@ let rightClickGuardTimer: ReturnType<typeof setTimeout> | undefined;
|
||||
const handleCanvasPointerDown = (event: PointerEvent) => {
|
||||
if (event.button !== 2) return;
|
||||
|
||||
contextMenuManager.setState({ isRightClickActive: true });
|
||||
console.log('[排查] 1. handleCanvasPointerDown 触发,直接处理右键逻辑');
|
||||
// 阻止事件继续传播,防止 Meta2d 库的默认行为抑制 contextmenu 事件
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
if (rightClickGuardTimer) {
|
||||
clearTimeout(rightClickGuardTimer);
|
||||
}
|
||||
// 手动构建事件对象,模拟从 EditorService 接收到的数据
|
||||
const penData = {
|
||||
e: event,
|
||||
clientRect: {
|
||||
x: event.clientX,
|
||||
y: event.clientY,
|
||||
width: 0,
|
||||
height: 0,
|
||||
top: event.clientY,
|
||||
right: event.clientX,
|
||||
bottom: event.clientY,
|
||||
left: event.clientX,
|
||||
},
|
||||
pen: editor.value?.store.hover, // 从 editor store 获取当前悬停的元素
|
||||
};
|
||||
|
||||
rightClickGuardTimer = setTimeout(() => {
|
||||
rightClickGuardTimer = undefined;
|
||||
if (!contextMenuState.value.visible) {
|
||||
contextMenuManager.setState({ isRightClickActive: false });
|
||||
}
|
||||
}, 200);
|
||||
// 直接调用右键菜单处理函数
|
||||
handleEditorContextMenu(penData);
|
||||
};
|
||||
|
||||
//#endregion
|
||||
@ -599,7 +604,7 @@ const backToCards = () => {
|
||||
* @param penData EditorService传递的pen数据
|
||||
*/
|
||||
const handleEditorContextMenu = (penData: Record<string, unknown>) => {
|
||||
console.log('EditorService自定义右键菜单事件:', penData);
|
||||
console.log('[排查] 3. handleEditorContextMenu 开始处理事件', penData);
|
||||
handleContextMenuFromPenData(penData, contextMenuManager, {
|
||||
storageLocationService: storageLocationService.value,
|
||||
robotService: editor.value, // 传递EditorService作为机器人服务
|
||||
@ -611,6 +616,7 @@ const handleEditorContextMenu = (penData: Record<string, unknown>) => {
|
||||
*/
|
||||
const handleCloseContextMenu = () => {
|
||||
contextMenuManager.close();
|
||||
contextMenuManager.setState({ isRightClickActive: false });
|
||||
};
|
||||
|
||||
/**
|
||||
|
@ -1199,10 +1199,13 @@ export class EditorService extends Meta2d {
|
||||
// 添加额外的右键事件监听器,确保阻止默认行为
|
||||
const canvasElement = this.canvas as unknown as HTMLCanvasElement;
|
||||
if (canvasElement && canvasElement.addEventListener) {
|
||||
canvasElement.addEventListener('contextmenu', (event) => {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}, true);
|
||||
canvasElement.addEventListener(
|
||||
'contextmenu',
|
||||
(event) => {
|
||||
event.preventDefault(); // 仅屏蔽浏览器默认菜单,保留 Meta2D 的事件派发
|
||||
},
|
||||
true,
|
||||
);
|
||||
}
|
||||
|
||||
// 注册自定义绘制函数和锚点
|
||||
|
Loading…
x
Reference in New Issue
Block a user