diff --git a/projects/app/src/components/support/activity/ActivityAdModal.tsx b/projects/app/src/components/support/activity/ActivityAdModal.tsx
index c4078c47b..c970447db 100644
--- a/projects/app/src/components/support/activity/ActivityAdModal.tsx
+++ b/projects/app/src/components/support/activity/ActivityAdModal.tsx
@@ -86,7 +86,7 @@ const ActivityAdModal = () => {
}
}, [data?.activityAdLink, handleClose, router]);
- if (!data?.activityAdImage) {
+ if (!data?.activityAdImage || !userInfo) {
return null;
}
diff --git a/projects/app/src/components/support/wallet/QRCodePayModal.tsx b/projects/app/src/components/support/wallet/QRCodePayModal.tsx
index c98dd6cfa..c4b62ab84 100644
--- a/projects/app/src/components/support/wallet/QRCodePayModal.tsx
+++ b/projects/app/src/components/support/wallet/QRCodePayModal.tsx
@@ -47,6 +47,27 @@ const QRCodePayModal = ({
const isWxConfigured = feConfigs.payConfig?.wx;
const isBankConfigured = feConfigs.payConfig?.bank;
+ const MIN_QR_SIZE = 150;
+ const [dynamicQRSize, setDynamicQRSize] = useState(QR_CODE_SIZE);
+
+ useEffect(() => {
+ const calculateQRSize = () => {
+ const windowHeight = window.innerHeight;
+ const reservedSpace = 470 + (tip ? 60 : 0) + (discountCouponName ? 30 : 0);
+ const availableHeight = windowHeight - reservedSpace;
+
+ const newSize = Math.min(QR_CODE_SIZE, Math.max(MIN_QR_SIZE, availableHeight));
+
+ setDynamicQRSize(newSize);
+ };
+
+ window.addEventListener('resize', calculateQRSize);
+
+ return () => {
+ window.removeEventListener('resize', calculateQRSize);
+ };
+ }, [tip, discountCouponName]);
+
const [payWayRenderData, setPayWayRenderData] = useState<{
qrCode?: string;
iframeCode?: string;
@@ -99,7 +120,7 @@ const QRCodePayModal = ({
const canvas = document.createElement('canvas');
QRCode.toCanvas(canvas, payWayRenderData.qrCode, {
- width: QR_CODE_SIZE,
+ width: dynamicQRSize,
margin: 0,
color: {
dark: '#000000',
@@ -113,7 +134,7 @@ const QRCodePayModal = ({
}
})
.catch(console.error);
- }, [payWayRenderData.qrCode]);
+ }, [payWayRenderData.qrCode, dynamicQRSize]);
useEffect(() => {
drawCode();
}, [drawCode]);
@@ -140,15 +161,15 @@ const QRCodePayModal = ({
});
const renderPaymentContent = () => {
if (payWayRenderData.qrCode) {
- return ;
+ return ;
}
if (payWayRenderData.iframeCode) {
return (