- SMS,지급대행 다국어 문자 수정
This commit is contained in:
HyeonJongKim
@@ -13,190 +13,190 @@ import { checkGrant } from '@/shared/lib/check-grant';
|
||||
import { snackBar } from '@/shared/lib';
|
||||
|
||||
export interface PayoutDetailProps {
|
||||
detailOn: boolean;
|
||||
setDetailOn: (detailOn: boolean) => void;
|
||||
mid: string;
|
||||
tid: string;
|
||||
detailOn: boolean;
|
||||
setDetailOn: (detailOn: boolean) => void;
|
||||
mid: string;
|
||||
tid: string;
|
||||
};
|
||||
|
||||
export const PayoutDetail = ({
|
||||
detailOn,
|
||||
setDetailOn,
|
||||
mid,
|
||||
tid
|
||||
detailOn,
|
||||
setDetailOn,
|
||||
mid,
|
||||
tid
|
||||
}: PayoutDetailProps) => {
|
||||
const { t } = useTranslation();
|
||||
const { t } = useTranslation();
|
||||
|
||||
const [detail, setDetail] = useState<ExtensionPayoutDetailResponse>();
|
||||
|
||||
const [downloadBottomSheetOn, setDownloadBottomSheetOn] = useState<boolean>(false);
|
||||
const [detail, setDetail] = useState<ExtensionPayoutDetailResponse>();
|
||||
|
||||
const { mutateAsync: extensionPayoutDetail } = useExtensionPayoutDetailMutation();
|
||||
const { mutateAsync: extensionPayoutDetailDownloadCertification } = useExtensionPayoutDetailDownloadCertificateMutation();
|
||||
const [downloadBottomSheetOn, setDownloadBottomSheetOn] = useState<boolean>(false);
|
||||
|
||||
const callDetail = () => {
|
||||
let params: ExtensionPayoutDetailParams = {
|
||||
tid: tid,
|
||||
mid: mid,
|
||||
};
|
||||
extensionPayoutDetail(params).then((rs: ExtensionPayoutDetailResponse) => {
|
||||
setDetail(rs);
|
||||
}).catch((e: any) => {
|
||||
if(e.response?.data?.error?.message){
|
||||
snackBar(e.response?.data?.error?.message);
|
||||
return;
|
||||
}
|
||||
});
|
||||
}
|
||||
const { mutateAsync: extensionPayoutDetail } = useExtensionPayoutDetailMutation();
|
||||
const { mutateAsync: extensionPayoutDetailDownloadCertification } = useExtensionPayoutDetailDownloadCertificateMutation();
|
||||
|
||||
const onClickToOpenDownloadBottomSheet = () => {
|
||||
if(!checkGrant(53, 'D')){
|
||||
showAlert(t('common.nopermission'));
|
||||
return;
|
||||
}
|
||||
setDownloadBottomSheetOn(true);
|
||||
};
|
||||
const callDetail = () => {
|
||||
let params: ExtensionPayoutDetailParams = {
|
||||
tid: tid,
|
||||
mid: mid,
|
||||
};
|
||||
extensionPayoutDetail(params).then((rs: ExtensionPayoutDetailResponse) => {
|
||||
setDetail(rs);
|
||||
}).catch((e: any) => {
|
||||
if (e.response?.data?.error?.message) {
|
||||
snackBar(e.response?.data?.error?.message);
|
||||
return;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const onRequestDownload = (
|
||||
selectedMode: DownloadSelectedMode,
|
||||
userEmail?: string
|
||||
) => {
|
||||
if(selectedMode === DownloadSelectedMode.IMAGE){
|
||||
const params: ExtensionPayoutDetailDownloadCertificateParams = {
|
||||
mid: mid,
|
||||
tid: tid,
|
||||
requestType: 'IMAGE',
|
||||
email: ''
|
||||
};
|
||||
extensionPayoutDetailDownloadCertification(params).then((rs: ExtensionPayoutDetailDownloadCertificateResponse) => {
|
||||
console.log('Certificate Download Status:', rs);
|
||||
}).catch((error) => {
|
||||
console.error('Certificate Download Failed:', error);
|
||||
});
|
||||
}
|
||||
else if(selectedMode === DownloadSelectedMode.EMAIL
|
||||
&& userEmail
|
||||
){
|
||||
const params: ExtensionPayoutDetailDownloadCertificateParams = {
|
||||
mid: mid,
|
||||
tid: tid,
|
||||
requestType: 'EMAIL',
|
||||
email: userEmail
|
||||
};
|
||||
extensionPayoutDetailDownloadCertification(params).then((rs: ExtensionPayoutDetailDownloadCertificateResponse) => {
|
||||
console.log('Certificate Download Status:', rs);
|
||||
}).catch((error) => {
|
||||
console.error('Certificate Download Failed:', error);
|
||||
});
|
||||
}
|
||||
};
|
||||
const onClickToOpenDownloadBottomSheet = () => {
|
||||
if (!checkGrant(53, 'D')) {
|
||||
showAlert(t('common.nopermission'));
|
||||
return;
|
||||
}
|
||||
setDownloadBottomSheetOn(true);
|
||||
};
|
||||
|
||||
const onClickToClose = () => {
|
||||
setDetailOn(false);
|
||||
};
|
||||
const onRequestDownload = (
|
||||
selectedMode: DownloadSelectedMode,
|
||||
userEmail?: string
|
||||
) => {
|
||||
if (selectedMode === DownloadSelectedMode.IMAGE) {
|
||||
const params: ExtensionPayoutDetailDownloadCertificateParams = {
|
||||
mid: mid,
|
||||
tid: tid,
|
||||
requestType: selectedMode,
|
||||
email: ''
|
||||
};
|
||||
extensionPayoutDetailDownloadCertification(params).then((rs: ExtensionPayoutDetailDownloadCertificateResponse) => {
|
||||
console.log('Certificate Download Status:', rs);
|
||||
}).catch((error) => {
|
||||
console.error('Certificate Download Failed:', error);
|
||||
});
|
||||
}
|
||||
else if (selectedMode === DownloadSelectedMode.EMAIL
|
||||
&& userEmail
|
||||
) {
|
||||
const params: ExtensionPayoutDetailDownloadCertificateParams = {
|
||||
mid: mid,
|
||||
tid: tid,
|
||||
requestType: 'EMAIL',
|
||||
email: userEmail
|
||||
};
|
||||
extensionPayoutDetailDownloadCertification(params).then((rs: ExtensionPayoutDetailDownloadCertificateResponse) => {
|
||||
console.log('Certificate Download Status:', rs);
|
||||
}).catch((error) => {
|
||||
console.error('Certificate Download Failed:', error);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (!!mid && !!tid) {
|
||||
callDetail();
|
||||
}
|
||||
}, [mid, tid]);
|
||||
const onClickToClose = () => {
|
||||
setDetailOn(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<motion.div
|
||||
className="full-menu-modal"
|
||||
initial="hidden"
|
||||
animate={(detailOn) ? 'visible' : 'hidden'}
|
||||
variants={DetailMotionVariants}
|
||||
transition={DetailMotionDuration}
|
||||
style={DetailMotionStyle}
|
||||
>
|
||||
<div className="full-menu-container pdw-16">
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('additionalService.payout.detailTitle')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<FullMenuClose
|
||||
addClass="full-menu-close"
|
||||
onClickToCallback={onClickToClose}
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
<div className="pay-top">
|
||||
<div className="num-amount">
|
||||
<span className="amount">
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(detail?.disbursementAmount || 0) })}
|
||||
</span>
|
||||
</div>
|
||||
<div className="num-store">{detail?.companyName}</div>
|
||||
<div className="num-day">{moment(detail?.settlementDate).format('YYYY.MM.DD')}</div>
|
||||
<div className="receipt-row">
|
||||
<button
|
||||
className="receipt-btn"
|
||||
type="button"
|
||||
onClick={ onClickToOpenDownloadBottomSheet }
|
||||
>
|
||||
<span className="icon-24 download"></span>
|
||||
<span>{t('additionalService.payout.depositCertificate')}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="detail-divider"></div>
|
||||
<div className="pay-detail">
|
||||
<div className="detail-title">{t('additionalService.payout.detailInfo')}</div>
|
||||
<ul className="kv-list">
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.disbursementStatus')}</span>
|
||||
<span className="v">{detail?.disbursementStatus}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.transactionType')}</span>
|
||||
<span className="v">{detail?.transTypeName}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('common.requestDate')}</span>
|
||||
<span className="v">{moment(detail?.requestDate).format('YYYY.MM.DD')}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.disbursementDateTime')}</span>
|
||||
<span className="v">{detail?.settlementDateTime ? moment(detail?.settlementDateTime, 'YYYYMMDDHHmmss').format('YYYY.MM.DD HH:mm:ss') : ""}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.businessNumber')}</span>
|
||||
<span className="v">{detail?.companyNo}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.accountHolder')}</span>
|
||||
<span className="v">{detail?.accountName}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.bank')}</span>
|
||||
<span className="v">{detail?.bankName}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.accountNumber')}</span>
|
||||
<span className="v">{detail?.accountNo}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.depositor')}</span>
|
||||
<span className="v">{detail?.depositName}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.failureReason')}</span>
|
||||
<span className="v">{detail?.failReason}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{ !!downloadBottomSheetOn &&
|
||||
<DownloadBottomSheet
|
||||
bottomSheetOn={ downloadBottomSheetOn }
|
||||
setBottomSheetOn={ setDownloadBottomSheetOn }
|
||||
imageMode={ false }
|
||||
emailMode={ true }
|
||||
sendRequest={ onRequestDownload }
|
||||
/>
|
||||
}
|
||||
</motion.div>
|
||||
</>
|
||||
);
|
||||
useEffect(() => {
|
||||
if (!!mid && !!tid) {
|
||||
callDetail();
|
||||
}
|
||||
}, [mid, tid]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<motion.div
|
||||
className="full-menu-modal"
|
||||
initial="hidden"
|
||||
animate={(detailOn) ? 'visible' : 'hidden'}
|
||||
variants={DetailMotionVariants}
|
||||
transition={DetailMotionDuration}
|
||||
style={DetailMotionStyle}
|
||||
>
|
||||
<div className="full-menu-container pdw-16">
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">{t('additionalService.payout.detailTitle')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<FullMenuClose
|
||||
addClass="full-menu-close"
|
||||
onClickToCallback={onClickToClose}
|
||||
></FullMenuClose>
|
||||
</div>
|
||||
</div>
|
||||
<div className="pay-top">
|
||||
<div className="num-amount">
|
||||
<span className="amount">
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(detail?.disbursementAmount || 0) })}
|
||||
</span>
|
||||
</div>
|
||||
<div className="num-store">{detail?.companyName}</div>
|
||||
<div className="num-day">{moment(detail?.settlementDate).format('YYYY.MM.DD')}</div>
|
||||
<div className="receipt-row">
|
||||
<button
|
||||
className="receipt-btn"
|
||||
type="button"
|
||||
onClick={onClickToOpenDownloadBottomSheet}
|
||||
>
|
||||
<span className="icon-24 download"></span>
|
||||
<span>{t('additionalService.payout.depositCertificate')}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="detail-divider"></div>
|
||||
<div className="pay-detail">
|
||||
<div className="detail-title">{t('additionalService.payout.detailInfo')}</div>
|
||||
<ul className="kv-list">
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.disbursementStatus')}</span>
|
||||
<span className="v">{detail?.disbursementStatus}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.transactionType')}</span>
|
||||
<span className="v">{detail?.transTypeName}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('common.requestDate')}</span>
|
||||
<span className="v">{moment(detail?.requestDate).format('YYYY.MM.DD')}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.disbursementDateTime')}</span>
|
||||
<span className="v">{detail?.settlementDateTime ? moment(detail?.settlementDateTime, 'YYYYMMDDHHmmss').format('YYYY.MM.DD HH:mm:ss') : ""}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.businessNumber')}</span>
|
||||
<span className="v">{detail?.companyNo}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.accountHolder')}</span>
|
||||
<span className="v">{detail?.accountName}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.bank')}</span>
|
||||
<span className="v">{detail?.bankName}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.accountNumber')}</span>
|
||||
<span className="v">{detail?.accountNo}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.depositor')}</span>
|
||||
<span className="v">{detail?.depositName}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('additionalService.payout.failureReason')}</span>
|
||||
<span className="v">{detail?.failReason}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{!!downloadBottomSheetOn &&
|
||||
<DownloadBottomSheet
|
||||
bottomSheetOn={downloadBottomSheetOn}
|
||||
setBottomSheetOn={setDownloadBottomSheetOn}
|
||||
imageMode={true}
|
||||
emailMode={true}
|
||||
sendRequest={onRequestDownload}
|
||||
/>
|
||||
}
|
||||
</motion.div>
|
||||
</>
|
||||
);
|
||||
};
|
||||
@@ -99,7 +99,7 @@ export const SmsPaymentDetailResend = ({
|
||||
onClick={onClickResend}
|
||||
disabled={!smsDetailData?.sendMessage}
|
||||
>
|
||||
{t('common.request')}
|
||||
{t('additionalService.sms.smsResendButton')}
|
||||
</button>
|
||||
</div>
|
||||
</motion.div>
|
||||
|
||||
@@ -933,6 +933,7 @@
|
||||
"virtualAccountRequest": "Virtual Account Request",
|
||||
"virtualAccountRequestDeposit": "Virtual Account Request + Deposit",
|
||||
"smsDetailAndResend": "SMS Details & Resend",
|
||||
"smsResendButton": "Resend",
|
||||
"sender": "Sender (Number)",
|
||||
"receiver": "Receiver (Number)",
|
||||
"sendSuccess": "SMS sent successfully.",
|
||||
@@ -1204,7 +1205,7 @@
|
||||
"paymentComplete": "Payment Complete",
|
||||
"paymentFailed": "Payment Failed",
|
||||
"paymentStopped": "Payment Stopped/Inactive",
|
||||
"applyRequest": "Request",
|
||||
"applyRequest": "Payment Request",
|
||||
"noData": "No data available",
|
||||
"phoneNumber": "Phone Number",
|
||||
"email": "Email",
|
||||
|
||||
@@ -933,6 +933,7 @@
|
||||
"virtualAccountRequest": "가상계좌 요청",
|
||||
"virtualAccountRequestDeposit": "가상계좌 요청 + 입금",
|
||||
"smsDetailAndResend": "SMS 상세 & 재발송",
|
||||
"smsResendButton": "재발송",
|
||||
"sender": "발신자(번호)",
|
||||
"receiver": "수신자(번호)",
|
||||
"sendSuccess": "SMS 발송을 성공하였습니다.",
|
||||
@@ -1040,8 +1041,8 @@
|
||||
"processingResult": "처리결과",
|
||||
"balance": "잔액",
|
||||
"won": "원",
|
||||
"transferRegistration": "송금등록",
|
||||
"transferRegistrationNotice": "송금등록 후 별도의 '이체요청' 처리가 필요하며, 요청하지 않을 경우 이체가 진행되지 않습니다.",
|
||||
"transferRegistration": "이체 등록",
|
||||
"transferRegistrationNotice": "이체 등록 후 별도의 '이체요청' 처리가 필요하며, 요청하지 않을 경우 이체가 진행되지 않습니다.",
|
||||
"resultInquiry": "결과조회",
|
||||
"tabTransferRequest": "이체요청",
|
||||
"tabResultInquiry": "결과조회",
|
||||
@@ -1108,7 +1109,7 @@
|
||||
"payout": {
|
||||
"title": "지급대행",
|
||||
"detailTitle": "지급대행 상세",
|
||||
"requestTitle": "지급대행 요청",
|
||||
"requestTitle": "지급대행 신청",
|
||||
"requestDate": "요청일자",
|
||||
"disbursementDate": "지급일자",
|
||||
"paymentStatus": "지급 상태",
|
||||
@@ -1204,7 +1205,7 @@
|
||||
"paymentComplete": "결제완료",
|
||||
"paymentFailed": "결제실패",
|
||||
"paymentStopped": "결제중단/비활성화",
|
||||
"applyRequest": "요청",
|
||||
"applyRequest": "결제 신청",
|
||||
"noData": "데이터가 없습니다",
|
||||
"phoneNumber": "휴대폰번호",
|
||||
"email": "이메일",
|
||||
|
||||
Reference in New Issue
Block a user