This commit is contained in:
focp212@naver.com
2025-11-11 18:23:14 +09:00
parent 297215fe09
commit a5abe3f0fd
4 changed files with 282 additions and 269 deletions

View File

@@ -210,7 +210,7 @@ export const FundAccountResultDetail = ({
></DownloadBottomSheet>
}
</motion.div>
{
{ depositReceiptSampleOn &&
<DepositReceiptSample
depositReceiptSampleOn={depositReceiptSampleOn}
setDepositReceiptSampleOn={setDepositReceiptSampleOn}

View File

@@ -39,7 +39,7 @@ export const CashReceiptSample = ({
link.href = image;
link.click();
snackBar(t('common.imageRequested'), function(){
// onClickToClose();
//onClickToClose();
});
});
};
@@ -68,33 +68,25 @@ export const CashReceiptSample = ({
if(!!cashReceiptSampleOn){
setTimeout(() => {
downloadImage();
}, 500);
}, 300);
}
}, [cashReceiptSampleOn]);
return (
<>
<div
id="image-section"
className="mail-page"
>
<div className="mail-page">
<div id="image-section">
<div className="wrap">
<div className="header">
<div
className="header-top"
style={{ boxSizing: 'unset' }}
>
<div className="header-top">
<img
className="logo"
src={ IMAGE_ROOT + '/mail_nicepay_logo.svg' }
alt="NICEPAY"
/>
</div>
<div
className="divider"
style={{ marginTop: '0px'}}
></div>
<div className="divider"></div>
<div className="title-row">
<div className="title"></div>
</div>
@@ -248,6 +240,7 @@ export const CashReceiptSample = ({
</div>
</div>
</div>
</div>
</>
);
};

View File

@@ -1,6 +1,4 @@
import { IMAGE_ROOT } from '@/shared/constants/common';
import { motion } from 'framer-motion';
import { FilterMotionDuration, FilterMotionVariants } from '../model/constant';
import { snackBar } from '@/shared/lib';
import { toPng } from 'html-to-image';
import { useTranslation } from 'react-i18next';
@@ -29,7 +27,7 @@ export const DepositReceiptSample = ({
link.download = 'downloadImage.png';
link.href = image;
link.click();
snackBar(t('common.imageRequested'), function () {
snackBar(t('common.imageRequested'), () => {
onClickToClose();
});
});
@@ -39,25 +37,32 @@ export const DepositReceiptSample = ({
};
useEffect(() => {
if (!!depositReceiptSampleOn) {
if(!!depositReceiptSampleOn){
setTimeout(() => {
downloadImage();
}, 300);
}
}, [depositReceiptSampleOn]);
return (
<>
<motion.div
className="bottomsheet mail-page"
initial="hidden"
animate={(depositReceiptSampleOn) ? 'hidden' : 'hidden'}
variants={FilterMotionVariants}
transition={FilterMotionDuration}
>
<div className="mail-page">
<div id="image-section">
<div className="wrap">
<div id="image-section" style={{ paddingLeft: '20px', paddingRight: '20px', backgroundColor: '#E4E4E4', paddingTop: '20px', paddingBottom: '20px' }}>
<div style={{ fontSize: '20px', fontWeight: 'bold', marginBottom: '16px', color: '#2D3436' }}></div>
<div className="section" style={{paddingLeft: '20px', paddingRight: '20px'}}>
<div className="header">
<div className="header-top">
<img
className="logo"
src={ IMAGE_ROOT + '/mail_nicepay_logo.svg' }
alt="NICEPAY"
/>
</div>
<div className="divider"></div>
<div className="title-row">
<div className="title"></div>
</div>
</div>
<div className="section">
<div className="head">
<div className="icon">
<svg
@@ -78,40 +83,39 @@ export const DepositReceiptSample = ({
</div>
<div className="row">
<div className="k"></div>
<div className="v">{depositInfo?.depositDate}</div>
<div className="v">{ depositInfo?.depositDate}</div>
</div>
<div className="row">
<div className="k"></div>
<div className="v">{depositInfo?.depositBank}</div>
<div className="v">{ depositInfo?.depositBank }</div>
</div>
<div className="row">
<div className="k"></div>
<div className="v">{depositInfo?.depositAccount}</div>
<div className="v">{ depositInfo?.depositAccount }</div>
</div>
<div className="row">
<div className="k"></div>
<div className="v">
<NumericFormat
value={depositInfo?.amount}
value={ depositInfo?.amount }
thousandSeparator
displayType='text'
suffix='원'
>
</NumericFormat>
></NumericFormat>
</div>
</div>
<div className="row">
<div className="k"></div>
<div className="v">{depositInfo?.depositReason}</div>
<div className="v">{ depositInfo?.depositReason }</div>
</div>
<div className="row">
<div className="k">ID</div>
<div className="v">{depositInfo?.depositId}</div>
<div className="v">{ depositInfo?.depositId }</div>
</div>
</div>
</div>
</div>
</div>
</motion.div>
</>
)
}
);
};

View File

@@ -40,9 +40,25 @@
.mail-page {
margin: 0; background: #FAFAFA;
padding: 0; width: 100%;
transform: translateY(100%);
min-height: unset;
width: 100%;
position: fixed;
bottom: 0;
left: 0;
top: 0;
z-index: 1010;
display: unset;
padding-bottom: 0;
transform: translateX(100%);
}
.mail-page .wrap {
min-width: unset;
padding-bottom: 30px;
}
.mail-page .wrap .header .header-top {
box-sizing: unset;
}
.mail-page .wrap .header .divider {
margin-top: 0px;
}