fix: 修复远程桌面光标不显示的问题

.env

@@ -1,5 +1,5 @@
 # local/docker
-DEPLOYMENT_MODE=docker
+DEPLOYMENT_MODE=local
 
 RDP_SERVICE_URL_DOCKER=ws://rdp:8081
 

packages/frontend/src/components/RemoteDesktopModal.vue

@@ -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;