From 9f56e866f20f932c6c130b7775eff06661e583dd Mon Sep 17 00:00:00 2001
From: logan <admin@attacker.club>
Date: Sat, 23 May 2026 23:38:58 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E7=A7=BB=E9=99=A4=E6=89=80=E6=9C=89?=
 =?UTF-8?q?=E5=BC=B9=E6=A1=86=E9=81=AE=E7=BD=A9=E5=B1=82=E7=82=B9=E5=87=BB?=
 =?UTF-8?q?=E5=85=B3=E9=97=AD=20=E2=80=94=20=E9=98=B2=E6=AD=A2=E8=BE=93?=
 =?UTF-8?q?=E5=85=A5=E6=97=B6=E8=AF=AF=E8=A7=A6=E5=85=B3=E9=97=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

涉及文件 (12处):
- InstancePage.tsx: 添加数据源弹框
- UsersPage.tsx: 新建/编辑/重置密码/详情弹框 (4处)
- RolesPage.tsx: 克隆角色弹框
- InstanceGroupPage.tsx: 新建/编辑/关联实例/关联用户弹框 (4处)
- SlowQueryPage.tsx: 查询对比弹框
- RedisDetailPage.tsx: 键详情/新增键弹框 (2处)

改动: 遮罩层div移除onClick，只能通过X按钮或取消按钮关闭
---
 frontend/src/pages/InstanceGroupPage.tsx | 8 ++++----
 frontend/src/pages/InstancePage.tsx      | 2 +-
 frontend/src/pages/RedisDetailPage.tsx   | 4 ++--
 frontend/src/pages/RolesPage.tsx         | 2 +-
 frontend/src/pages/SlowQueryPage.tsx     | 2 +-
 frontend/src/pages/UsersPage.tsx         | 8 ++++----
 6 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/frontend/src/pages/InstanceGroupPage.tsx b/frontend/src/pages/InstanceGroupPage.tsx
index be1e050..398bace 100644
--- a/frontend/src/pages/InstanceGroupPage.tsx
+++ b/frontend/src/pages/InstanceGroupPage.tsx
@@ -703,7 +703,7 @@ export default function InstanceGroupPage() {
 
       {/* Create Modal */}
       {showCreateModal && (
-        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={() => { setShowCreateModal(false); resetForm(); }}>
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
           <div className="w-full max-w-lg bg-[var(--dg-bg-primary)] border border-[var(--dg-border)] rounded-xl p-6 shadow-2xl" onClick={e => e.stopPropagation()}>
             <h3 className="text-lg font-semibold mb-4">新建权限组</h3>
             {renderGroupForm(handleCreate, '创建')}
@@ -713,7 +713,7 @@ export default function InstanceGroupPage() {
 
       {/* Edit Modal */}
       {showEditModal && (
-        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={() => { setShowEditModal(false); resetForm(); }}>
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
           <div className="w-full max-w-lg bg-[var(--dg-bg-primary)] border border-[var(--dg-border)] rounded-xl p-6 shadow-2xl" onClick={e => e.stopPropagation()}>
             <h3 className="text-lg font-semibold mb-4">编辑权限组</h3>
             {renderGroupForm(handleEdit, '保存')}
@@ -723,7 +723,7 @@ export default function InstanceGroupPage() {
 
       {/* Instance Modal with search */}
       {showInstanceModal && (
-        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={() => setShowInstanceModal(false)}>
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
           <div className="w-full max-w-md bg-[var(--dg-bg-primary)] border border-[var(--dg-border)] rounded-xl p-6 shadow-2xl" onClick={e => e.stopPropagation()}>
             <h3 className="text-lg font-semibold mb-4">关联实例</h3>
             <div className="relative mb-3">
@@ -758,7 +758,7 @@ export default function InstanceGroupPage() {
 
       {/* User Modal with search */}
       {showUserModal && (
-        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={() => setShowUserModal(false)}>
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
           <div className="w-full max-w-md bg-[var(--dg-bg-primary)] border border-[var(--dg-border)] rounded-xl p-6 shadow-2xl" onClick={e => e.stopPropagation()}>
             <h3 className="text-lg font-semibold mb-4">关联用户</h3>
             <div className="relative mb-3">
diff --git a/frontend/src/pages/InstancePage.tsx b/frontend/src/pages/InstancePage.tsx
index a6433ee..136dde4 100644
--- a/frontend/src/pages/InstancePage.tsx
+++ b/frontend/src/pages/InstancePage.tsx
@@ -991,7 +991,7 @@ function CreateInstanceForm({ defaultType, onCancel, onCreated }: {
   const labelCls = 'block text-sm font-medium mb-1.5';
 
   return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm" onClick={onCancel}>
+    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50 backdrop-blur-sm">
       <div
         className="bg-[var(--dg-bg-secondary)] rounded-xl shadow-2xl w-full max-w-2xl max-h-[90vh] overflow-y-auto"
         onClick={e => e.stopPropagation()}
diff --git a/frontend/src/pages/RedisDetailPage.tsx b/frontend/src/pages/RedisDetailPage.tsx
index 82f1b1b..fd46cc4 100644
--- a/frontend/src/pages/RedisDetailPage.tsx
+++ b/frontend/src/pages/RedisDetailPage.tsx
@@ -246,7 +246,7 @@ export default function RedisDetailPage() {
 
       {/* 键详情弹窗 */}
       {selectedKey && (
-        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={function () { setSelectedKey(null); }}>
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
           <div className="bg-[var(--dg-bg-secondary)] rounded-xl shadow-2xl w-full max-w-lg max-h-[70vh] overflow-y-auto p-6" onClick={function (e) { e.stopPropagation(); }}>
             <div className="flex items-center justify-between mb-4">
               <h3 className="font-semibold">键详情</h3>
@@ -268,7 +268,7 @@ export default function RedisDetailPage() {
 
       {/* 新增键弹窗 */}
       {showAddKey && (
-        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={function () { setShowAddKey(false); }}>
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
           <div className="bg-[var(--dg-bg-secondary)] rounded-xl shadow-2xl w-full max-w-md p-6" onClick={function (e) { e.stopPropagation(); }}>
             <div className="flex items-center justify-between mb-4">
               <h3 className="font-semibold">新增键</h3>
diff --git a/frontend/src/pages/RolesPage.tsx b/frontend/src/pages/RolesPage.tsx
index c83a038..52f129f 100644
--- a/frontend/src/pages/RolesPage.tsx
+++ b/frontend/src/pages/RolesPage.tsx
@@ -553,7 +553,7 @@ function CloneRoleModal({ sourceRole, onClose }: { sourceRole: Role; onClose: ()
   };
 
   return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={onClose}>
+    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
       <div className="w-full max-w-md bg-[var(--dg-bg-secondary)] border border-[var(--dg-border)] rounded-xl p-6 shadow-xl" onClick={e => e.stopPropagation()}>
         <div className="flex items-center justify-between mb-5">
           <h2 className="text-lg font-semibold flex items-center gap-2"><Copy className="w-5 h-5 text-blue-400" /> 克隆角色</h2>
diff --git a/frontend/src/pages/SlowQueryPage.tsx b/frontend/src/pages/SlowQueryPage.tsx
index 00721d5..cccc6e2 100644
--- a/frontend/src/pages/SlowQueryPage.tsx
+++ b/frontend/src/pages/SlowQueryPage.tsx
@@ -893,7 +893,7 @@ export default function SlowQueryPage() {
 
       {/* Compare Modal */}
       {showCompare && compareLogs.length === 2 && (
-        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={() => setShowCompare(false)}>
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
           <div className="w-full max-w-4xl bg-[var(--dg-bg-secondary)] border border-[var(--dg-border)] rounded-xl p-6 shadow-xl max-h-[80vh] overflow-y-auto" onClick={e => e.stopPropagation()}>
             <div className="flex items-center justify-between mb-5">
               <h2 className="text-lg font-semibold flex items-center gap-2"><GitCompare className="w-5 h-5 text-blue-400" /> 查询对比</h2>
diff --git a/frontend/src/pages/UsersPage.tsx b/frontend/src/pages/UsersPage.tsx
index 258da1f..4a84aae 100644
--- a/frontend/src/pages/UsersPage.tsx
+++ b/frontend/src/pages/UsersPage.tsx
@@ -590,7 +590,7 @@ function CreateUserModal({ onClose, onCreated, setToast }: { onClose: () => void
   };
 
   return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={onClose}>
+    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
       <div className="w-full max-w-md bg-[var(--dg-bg-secondary)] border border-[var(--dg-border)] rounded-xl p-6 shadow-xl" onClick={e => e.stopPropagation()}>
         <div className="flex items-center justify-between mb-5">
           <h2 className="text-lg font-semibold">新建用户</h2>
@@ -677,7 +677,7 @@ function EditUserModal({ user, onClose, onUpdated, setToast }: { user: UserItem;
   };
 
   return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={onClose}>
+    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
       <div className="w-full max-w-md bg-[var(--dg-bg-secondary)] border border-[var(--dg-border)] rounded-xl p-6 shadow-xl" onClick={e => e.stopPropagation()}>
         <div className="flex items-center justify-between mb-5">
           <h2 className="text-lg font-semibold">编辑用户</h2>
@@ -758,7 +758,7 @@ function ResetPasswordModal({ user, onClose, setToast }: { user: UserItem; onClo
   };
 
   return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={onClose}>
+    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
       <div className="w-full max-w-sm bg-[var(--dg-bg-secondary)] border border-[var(--dg-border)] rounded-xl p-6 shadow-xl" onClick={e => e.stopPropagation()}>
         <div className="flex items-center justify-between mb-5">
           <h2 className="text-lg font-semibold flex items-center gap-2"><KeyRound className="w-5 h-5 text-yellow-400" /> 重置密码</h2>
@@ -795,7 +795,7 @@ function UserDetailModal({ user, onClose }: { user: UserItem; onClose: () => voi
   const activities = useMemo(() => generateMockActivities(user.id), [user.id]);
 
   return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50" onClick={onClose}>
+    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
       <div className="w-full max-w-lg bg-[var(--dg-bg-secondary)] border border-[var(--dg-border)] rounded-xl p-6 shadow-xl max-h-[80vh] overflow-y-auto" onClick={e => e.stopPropagation()}>
         <div className="flex items-center justify-between mb-5">
           <h2 className="text-lg font-semibold">用户详情</h2>