From 424199a6979ac1b264ed9d54f52660f74bb60801 Mon Sep 17 00:00:00 2001
From: sijinhui <sijinhui@qq.com>
Date: Wed, 15 May 2024 17:31:57 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=A8=A1=E5=9E=8B=E9=80=89?=
 =?UTF-8?q?=E6=8B=A9ui?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/ui-lib.tsx | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/app/components/ui-lib.tsx b/app/components/ui-lib.tsx
index 02c4fe513..a65f669e3 100644
--- a/app/components/ui-lib.tsx
+++ b/app/components/ui-lib.tsx
@@ -114,7 +114,6 @@ interface ModalProps {
   defaultMax?: boolean;
   footer?: React.ReactNode;
   onClose?: () => void;
-  maskClosable?: boolean;
   is_cus?: boolean;
 }
 export function Modal(props: ModalProps) {
@@ -514,7 +513,7 @@ export function ModalSelector<T extends CheckGroupValueType>(props: {
   onClose?: () => void;
   multiple?: boolean;
 }) {
-  console.log("-----", props);
+  // console.log("-----", props);
 
   const getCheckCardAvatar = (value: string): React.ReactNode => {
     if (value.startsWith("gpt")) {
@@ -526,8 +525,18 @@ export function ModalSelector<T extends CheckGroupValueType>(props: {
     return <></>;
   };
 
+  const clickMaskEvent = (event: React.MouseEvent) => {
+    const div = document.getElementById("modal-mask");
+    // console.log('-----', event.target)
+    if (event.target === div) {
+      props.onClose?.();
+    }
+  };
+
   return (
     <div
+      onClick={(event) => clickMaskEvent(event)}
+      id="modal-mask"
       className={styles["modal-mask"] + " " + styles["modal-mask-container"]}
     >
       <Modal
@@ -535,7 +544,6 @@ export function ModalSelector<T extends CheckGroupValueType>(props: {
         onClose={() => props.onClose?.()}
         footer={null}
         is_cus={true}
-        maskClosable={true}
       >
         <AntList grid={{ gutter: 16 }}>
           <CheckCard.Group