diff --git a/src/renderer/src/components/Popups/ExportToPhoneLanPopup.tsx b/src/renderer/src/components/Popups/ExportToPhoneLanPopup.tsx index 61539d34ca..cbe51ac614 100644 --- a/src/renderer/src/components/Popups/ExportToPhoneLanPopup.tsx +++ b/src/renderer/src/components/Popups/ExportToPhoneLanPopup.tsx @@ -2,7 +2,7 @@ import { loggerService } from '@logger' import { AppLogo } from '@renderer/config/env' import { SettingHelpText, SettingRow } from '@renderer/pages/settings' import type { WebSocketCandidatesResponse } from '@shared/config/types' -import { Button, Modal, Progress, Spin } from 'antd' +import { Alert, Button, Modal, Progress, Spin } from 'antd' import { QRCodeSVG } from 'qrcode.react' import { useCallback, useEffect, useMemo, useState } from 'react' import { useTranslation } from 'react-i18next' @@ -41,8 +41,8 @@ const ScanQRCode: React.FC<{ qrCodeValue: string }> = ({ qrCodeValue }) => { size={200} imageSettings={{ src: AppLogo, - width: 60, - height: 60, + width: 40, + height: 40, excavate: true }} /> @@ -134,7 +134,6 @@ const PopupContainer: React.FC = ({ resolve }) => { const [selectedFolderPath, setSelectedFolderPath] = useState(null) const [sendProgress, setSendProgress] = useState(0) const [error, setError] = useState(null) - const [showCloseConfirm, setShowCloseConfirm] = useState(false) const [autoCloseCountdown, setAutoCloseCountdown] = useState(null) const { t } = useTranslation() @@ -296,22 +295,20 @@ const PopupContainer: React.FC = ({ resolve }) => { // 尝试关闭弹窗 - 如果正在传输则显示确认 const handleCancel = useCallback(() => { if (isSending) { - setShowCloseConfirm(true) + window.modal.confirm({ + title: t('settings.data.export_to_phone.lan.confirm_close_title'), + content: t('settings.data.export_to_phone.lan.confirm_close_message'), + centered: true, + okButtonProps: { + danger: true + }, + okText: t('settings.data.export_to_phone.lan.force_close'), + onOk: () => setIsOpen(false) + }) } else { setIsOpen(false) } - }, [isSending]) - - // 确认强制关闭 - const handleForceClose = useCallback(() => { - logger.info('Force closing popup during transfer') - setIsOpen(false) - }, []) - - // 取消关闭确认 - const handleCancelClose = useCallback(() => { - setShowCloseConfirm(false) - }, []) + }, [isSending, t]) // 清理并关闭 const handleClose = useCallback(async () => { @@ -373,11 +370,13 @@ const PopupContainer: React.FC = ({ resolve }) => { style={{ display: 'flex', alignItems: 'center', + justifyContent: 'center', gap: '8px', - padding: '8px 12px', - borderRadius: '8px', + padding: '5px 12px', + width: '100%', backgroundColor: connectionStatusStyles.bg, - border: `1px solid ${connectionStatusStyles.border}` + border: `1px solid ${connectionStatusStyles.border}`, + marginBottom: 10 }}> {connectionStatusText} @@ -409,7 +408,7 @@ const PopupContainer: React.FC = ({ resolve }) => { if (!isSending && transferPhase !== 'completed') return null return ( -
+
= ({ resolve }) => { closable={!isSending} maskClosable={false} keyboard={true} - footer={ - showCloseConfirm ? ( -
-
- ⚠️ - - {t('settings.data.export_to_phone.lan.confirm_close_title')} - -
- - {t('settings.data.export_to_phone.lan.confirm_close_message')} - -
- - -
-
- ) : null - }> + footer={null} + styles={{ body: { paddingBottom: 10 } }}> - -
{t('settings.data.export_to_phone.lan.content')}
-
+ - + - +