SMS 결제 통보 다국어 지원 추가
- SMS 결제 통보 관련 컴포넌트에 i18n 적용 - 한글/영문 번역 키 추가 (ko.json, en.json) - sms-payment-detail-resend, sms-payment-filter, sms-payment-page 현지화 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
import { motion } from 'framer-motion';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { IMAGE_ROOT } from '@/shared/constants/common';
|
||||
import { SmsPaymentDetailResendProps } from '../../../additional-service/model/sms-payment/types';
|
||||
import { useExtensionSmsResendMutation } from '../../api/sms-payment/use-extension-sms-resend-mutation';
|
||||
@@ -12,7 +13,8 @@ export const SmsPaymentDetailResend = ({
|
||||
mid,
|
||||
tid
|
||||
}: SmsPaymentDetailResendProps) => {
|
||||
|
||||
const { t } = useTranslation();
|
||||
|
||||
const variants = {
|
||||
hidden: { y: '100%' },
|
||||
visible: { y: '0%' },
|
||||
@@ -32,13 +34,13 @@ export const SmsPaymentDetailResend = ({
|
||||
sendMessage: smsDetailData.sendMessage
|
||||
}).then((rs) => {
|
||||
if (rs.status) {
|
||||
snackBar("SMS 발송을 성공하였습니다.")
|
||||
snackBar(t('additionalService.sms.sendSuccess'))
|
||||
} else {
|
||||
snackBar(`[실패] ${rs.error?.message}`)
|
||||
snackBar(t('additionalService.sms.sendFailed', { message: rs.error?.message }))
|
||||
}
|
||||
setBottomSmsPaymentDetailResendOn(false);
|
||||
}).catch((error) => {
|
||||
snackBar(`[실패] ${error?.response?.data?.message || error?.response?.data?.error?.message}` || '[실패] 신청을 실패하였습니다.')
|
||||
snackBar(t('additionalService.sms.sendFailed', { message: error?.response?.data?.message || error?.response?.data?.error?.message }) || t('additionalService.sms.sendFailedGeneric'))
|
||||
});
|
||||
}
|
||||
|
||||
@@ -61,22 +63,22 @@ export const SmsPaymentDetailResend = ({
|
||||
>
|
||||
<div className="bottomsheet-header">
|
||||
<div className="bottomsheet-title">
|
||||
<h2>SMS 상세 & 재발송</h2>
|
||||
<button
|
||||
className="close-btn"
|
||||
<h2>{t('additionalService.sms.smsDetailAndResend')}</h2>
|
||||
<button
|
||||
className="close-btn"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
<img
|
||||
src={ IMAGE_ROOT + '/ico_close.svg' }
|
||||
alt="닫기"
|
||||
alt={t('common.close')}
|
||||
onClick={ () => onClickToClose() }
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="resend-info">
|
||||
<div className="resend-row">발신자(번호) : {smsDetailData?.senderName || '-'}({smsDetailData?.senderNumber || '-'})</div>
|
||||
<div className="resend-row">수신자(번호) : {smsDetailData?.receiverName || '-'}({smsDetailData?.receiverNumber || '-'})</div>
|
||||
<div className="resend-row">{t('additionalService.sms.sender')} : {smsDetailData?.senderName || '-'}({smsDetailData?.senderNumber || '-'})</div>
|
||||
<div className="resend-row">{t('additionalService.sms.receiver')} : {smsDetailData?.receiverName || '-'}({smsDetailData?.receiverNumber || '-'})</div>
|
||||
</div>
|
||||
<div className="resend-box">
|
||||
<p className="resend-text">{smsDetailData?.sendMessage || '-'}</p>
|
||||
@@ -88,7 +90,7 @@ export const SmsPaymentDetailResend = ({
|
||||
onClick={onClickResend}
|
||||
disabled={!smsDetailData?.sendMessage}
|
||||
>
|
||||
신청
|
||||
{t('common.request')}
|
||||
</button>
|
||||
</div>
|
||||
</motion.div>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import moment from 'moment';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { IMAGE_ROOT } from '@/shared/constants/common';
|
||||
import { motion } from 'framer-motion';
|
||||
import { useState } from 'react';
|
||||
@@ -28,6 +29,7 @@ export const SmsPaymentFilter = ({
|
||||
setToDate,
|
||||
setSmsCl
|
||||
}: SmsPaymentFilterProps) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const [filterMid, setFilterMid] = useState<string>(mid);
|
||||
const [filterSearchCl, setFilterSearchCl] = useState<SmsPaymentSearchCl>(searchCl);
|
||||
@@ -52,14 +54,14 @@ export const SmsPaymentFilter = ({
|
||||
];
|
||||
|
||||
let searchTypeOption = [
|
||||
{ name: '주문자', value: SmsPaymentSearchCl.BUYER_NAME },
|
||||
{ name: '수신번호', value: SmsPaymentSearchCl.RECEIVE_PHONE_NUMBER },
|
||||
{ name: t('transaction.fields.buyerName'), value: SmsPaymentSearchCl.BUYER_NAME },
|
||||
{ name: t('additionalService.sms.receivePhoneNumber'), value: SmsPaymentSearchCl.RECEIVE_PHONE_NUMBER },
|
||||
]
|
||||
|
||||
let smsTypeOption = [
|
||||
{ name: '전체', value: SmsCl.ALL },
|
||||
{ name: '가상계좌\n요청', value: SmsCl.VACCOUNT_REQ },
|
||||
{ name: '가상계좌\n요청+입금', value: SmsCl.VACCOUNT_REQ_DEPOSIT },
|
||||
{ name: t('additionalService.sms.all'), value: SmsCl.ALL },
|
||||
{ name: t('additionalService.sms.virtualAccountReqShort'), value: SmsCl.VACCOUNT_REQ },
|
||||
{ name: t('additionalService.sms.virtualAccountReqDepositShort'), value: SmsCl.VACCOUNT_REQ_DEPOSIT },
|
||||
]
|
||||
|
||||
const onClickToClose = () => {
|
||||
@@ -78,7 +80,7 @@ export const SmsPaymentFilter = ({
|
||||
>
|
||||
<div className="full-menu-container">
|
||||
<div className="full-menu-header">
|
||||
<div className="full-menu-title center">필터</div>
|
||||
<div className="full-menu-title center">{t('filter.filter')}</div>
|
||||
<div className="full-menu-actions">
|
||||
<FullMenuClose
|
||||
addClass='full-menu-close'
|
||||
@@ -89,13 +91,13 @@ export const SmsPaymentFilter = ({
|
||||
|
||||
<div className="option-list pt-16 pb-86">
|
||||
<FilterSelectMid
|
||||
title='가맹점'
|
||||
title={t('filter.merchant')}
|
||||
selectSetter={setFilterMid}
|
||||
showType={'GID'}
|
||||
></FilterSelectMid>
|
||||
|
||||
<FilterSelectInput
|
||||
title='주문자,수신번호'
|
||||
title={t('additionalService.sms.buyerReceiveNumber')}
|
||||
selectValue={searchCl}
|
||||
selectSetter={setSearchCl}
|
||||
selectOptions={searchTypeOption}
|
||||
@@ -109,7 +111,7 @@ export const SmsPaymentFilter = ({
|
||||
setEndDate={setFilterToDate}
|
||||
></FilterCalendar>
|
||||
<FilterButtonGroups
|
||||
title='조회결과'
|
||||
title={t('additionalService.sms.queryResult')}
|
||||
activeValue={filterSmsCl}
|
||||
btnGroups={smsTypeOption}
|
||||
setter={setFilterSmsCl}
|
||||
@@ -119,7 +121,7 @@ export const SmsPaymentFilter = ({
|
||||
<button
|
||||
className="btn-50 btn-blue flex-1"
|
||||
onClick={() => onClickToSetFilter()}
|
||||
>적용</button>
|
||||
>{t('filter.apply')}</button>
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
|
||||
Reference in New Issue
Block a user