fix: 修复远程桌面光标不显示的问题
This commit is contained in:
@@ -203,20 +203,50 @@ const setupInputListeners = () => {
|
||||
};
|
||||
displayEl.addEventListener('click', handleRdpDisplayClick);
|
||||
|
||||
|
||||
// 鼠标进入 RDP 区域时隐藏本地光标
|
||||
const handleMouseEnter = () => {
|
||||
if (displayEl) displayEl.style.cursor = 'none';
|
||||
};
|
||||
// 鼠标离开 RDP 区域时恢复本地光标
|
||||
const handleMouseLeave = () => {
|
||||
if (displayEl) displayEl.style.cursor = 'default';
|
||||
};
|
||||
displayEl.addEventListener('mouseenter', handleMouseEnter);
|
||||
displayEl.addEventListener('mouseleave', handleMouseLeave);
|
||||
|
||||
|
||||
|
||||
// @ts-ignore
|
||||
mouse.value = new Guacamole.Mouse(displayEl);
|
||||
|
||||
const display = guacClient.value.getDisplay();
|
||||
// 启用 Guacamole 的内置光标渲染
|
||||
display.showCursor(true);
|
||||
|
||||
|
||||
// 提高 Guacamole 光标图层的 z-index
|
||||
const cursorLayer = display.getCursorLayer(); // 获取光标图层
|
||||
if (cursorLayer) {
|
||||
const cursorElement = cursorLayer.getElement(); // 获取光标图层的 DOM 元素
|
||||
if (cursorElement) {
|
||||
cursorElement.style.zIndex = '1000'; // 设置 DOM 元素的 z-index
|
||||
console.log('[RDP Modal] Set cursor layer element z-index to 1000.');
|
||||
} else {
|
||||
console.warn('[RDP Modal] Could not get cursor layer element to set z-index.');
|
||||
}
|
||||
} else {
|
||||
console.warn('[RDP Modal] Could not get cursor layer to set z-index.');
|
||||
}
|
||||
|
||||
|
||||
|
||||
// @ts-ignore
|
||||
mouse.value.onmousedown = mouse.value.onmouseup = mouse.value.onmousemove = (mouseState: any) => {
|
||||
if (guacClient.value) {
|
||||
guacClient.value.sendMouseState(mouseState);
|
||||
}
|
||||
};
|
||||
// @ts-ignore
|
||||
mouse.value.onmouseup = mouse.value.onmousemove = (mouseState: any) => {
|
||||
if (guacClient.value) {
|
||||
guacClient.value.sendMouseState(mouseState);
|
||||
}
|
||||
};
|
||||
|
||||
// @ts-ignore
|
||||
keyboard.value = new Guacamole.Keyboard(displayEl); // 将监听器附加到 RDP 显示元素
|
||||
@@ -235,19 +265,32 @@ const setupInputListeners = () => {
|
||||
};
|
||||
|
||||
} catch (inputError) {
|
||||
console.error("Error setting up input listeners:", inputError); // 添加错误日志
|
||||
statusMessage.value = t('remoteDesktopModal.errors.inputError');
|
||||
}
|
||||
};
|
||||
|
||||
const removeInputListeners = () => {
|
||||
// 恢复光标并尝试移除监听器
|
||||
if (guacClient.value) {
|
||||
try {
|
||||
const displayEl = guacClient.value.getDisplay()?.getElement();
|
||||
if (displayEl) {
|
||||
// 恢复默认光标样式
|
||||
displayEl.style.cursor = 'default';
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn("Could not reset cursor or remove listeners on display element during listener removal:", e);
|
||||
}
|
||||
}
|
||||
|
||||
// 清理 Guacamole 的键盘和鼠标对象
|
||||
if (keyboard.value) {
|
||||
keyboard.value.onkeydown = null;
|
||||
keyboard.value.onkeyup = null;
|
||||
keyboard.value = null; // Guacamole 内部可能会处理移除监听器,但显式置 null 更好
|
||||
keyboard.value = null;
|
||||
}
|
||||
if (mouse.value) {
|
||||
// Guacamole Mouse 对象没有明确的 'destroy' 或 'removeListeners' 方法
|
||||
// 我们需要确保事件处理器被移除
|
||||
mouse.value.onmousedown = null;
|
||||
mouse.value.onmouseup = null;
|
||||
mouse.value.onmousemove = null;
|
||||
|
||||
Reference in New Issue
Block a user