调整弹窗定位问题

components/ui/FloatingGlassPanel.tsx

@@ -21,10 +21,10 @@ export default function FloatingGlassPanel({ open, onClose, children, width = '3
   return (
     <AnimatePresence>
       {open && (
+        <div className="fixed inset-0 z-50 flex items-center justify-center">
           <motion.div
             key={r_key}
-          className="fixed top-1/2 left-1/2 z-50 cursor-grab active:cursor-grabbing"
-          style={{ transform: 'translate(-50%, -50%)', pointerEvents: 'auto' }}
+            className="cursor-grab active:cursor-grabbing"
             drag
             dragElastic={0.2}
             dragMomentum={false}
@@ -54,6 +54,15 @@ export default function FloatingGlassPanel({ open, onClose, children, width = '3
               {children}
             </div>
           </motion.div>
+          {/* 添加遮罩层，点击时关闭面板 */}
+          <motion.div
+            className="fixed inset-0 bg-black/20 backdrop-blur-sm -z-10"
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            exit={{ opacity: 0 }}
+            onClick={onClose}
+          />
+        </div>
       )}
     </AnimatePresence>
   );