feat: 二次确认弹窗多包裹一层 使弹窗距离边界有最小距离

src/components/mui/MyPopconfirm.tsx

@@ -68,43 +68,52 @@ const MyPopconfirm = (props: IMyPopconfirmProps) => {
 			placement={placement}
 			sx={{
 				zIndex: 2000,
-				bgcolor: "#fff",
+				bgcolor: "transparent",
 				minWidth: "200px",
-				borderRadius: "4px",
 				fontSize: "14px",
 				padding: "20px 16px",
-				boxShadow: "0px 3px 10px 0px rgba(0, 24, 57, 0.14)",
 			}}
 		>
-			<Box sx={{ marginBottom: "16px" }}>
-				<img
-					style={{
-						width: "16px",
-						marginRight: "12px",
-						position: "relative",
-						top: "3px",
-					}}
-					src={tipsIcon}
-					alt=""
-				/>
-				{title}
-			</Box>
-			<Box sx={{ display: "flex", justifyContent: "flex-end" }}>
-				{showCancel && (
+			<Box
+				sx={{
+					bgcolor: "#fff",
+					minWidth: "200px",
+					borderRadius: "4px",
+					fontSize: "14px",
+					padding: "20px 16px",
+					boxShadow: "0px 3px 10px 0px rgba(0, 24, 57, 0.14)",
+				}}
+			>
+				<Box sx={{ marginBottom: "16px" }}>
+					<img
+						style={{
+							width: "16px",
+							marginRight: "12px",
+							position: "relative",
+							top: "3px",
+						}}
+						src={tipsIcon}
+						alt=""
+					/>
+					{title}
+				</Box>
+				<Box sx={{ display: "flex", justifyContent: "flex-end" }}>
+					{showCancel && (
+						<MyButton
+							text={cancelText}
+							variant="outlined"
+							color="inherit"
+							onClick={handleCancel}
+							style={{ marginRight: "12px" }}
+						/>
+					)}
 					<MyButton
-						text={cancelText}
-						variant="outlined"
-						color="inherit"
-						onClick={handleCancel}
-						style={{ marginRight: "12px" }}
+						text={okText}
+						onClick={handleOk}
+						loading={loading}
+						isLoadingButton={true}
 					/>
-				)}
-				<MyButton
-					text={okText}
-					onClick={handleOk}
-					loading={loading}
-					isLoadingButton={true}
-				/>
+				</Box>
 			</Box>
 		</Popper>
 	);