자금이체 페이지 다국어 지원 추가

자금이체 관련 모든 페이지에 대한 다국어 지원을 추가했습니다.

변경사항:
- 이체등록 페이지: 폼 레이블, 버튼, 에러 메시지 다국어화
- 이체요청 목록 페이지: 페이지 타이틀 다국어화
- 결과조회 목록 페이지: 페이지 타이틀 다국어화
- 이체 상세 페이지: 상세 정보 레이블, 버튼, 상태 메시지 다국어화
- 결과 상세 페이지: 상세 정보 레이블, 입금확인서 버튼 다국어화

번역 키 추가:
- 은행, 계좌번호, 예금주명, 이체금액, 입금인자
- 등록/요청 성공/실패 메시지
- 상세 정보 레이블 (등록일시, 요청일시, 이체일시, 이체결과, 실패사유 등)
- 수취인명, 입금확인서 등

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Jay Sheen
2025-11-03 16:42:29 +09:00
parent 0e0c4c90ba
commit a566f18da9
7 changed files with 101 additions and 47 deletions

View File

@@ -986,6 +986,8 @@
"authenticationResult": "Authentication Result"
},
"fundAccount": {
"title": "Fund Transfer",
"transferRegistrationTitle": "Fund Transfer Registration",
"registrationComplete": "Registration Complete",
"transferRequest": "Transfer Request",
"requestSuccess": "Request Success",
@@ -1003,7 +1005,29 @@
"transferRegistrationNotice": "After transfer registration, separate 'transfer request' processing is required for execution. If not requested, transfer will not proceed.",
"resultInquiry": "Result Inquiry",
"tabTransferRequest": "Transfer Request",
"tabResultInquiry": "Result Inquiry"
"tabResultInquiry": "Result Inquiry",
"bank": "Bank",
"pleaseSelect": "Please Select",
"accountHolderName": "Account Holder Name",
"transferAmount": "Transfer Amount",
"depositParameter": "Deposit Parameter",
"registrationSuccess": "Transfer registration successful.",
"registrationFailed": "Transfer registration failed.",
"registrationError": "An error occurred during transfer registration.",
"register": "Register",
"transferDetailTitle": "Fund Transfer Detail",
"detailInfo": "Detail Information",
"registrationDateTime": "Registration Date/Time",
"transferResult": "Transfer Result",
"beneficiaryName": "Beneficiary Name",
"transferRequestButton": "Transfer Request",
"transferRequestSuccess": "Transfer request successful.",
"transferRequestFailed": "Transfer request failed.",
"transferRequestError": "An error occurred during transfer request.",
"requestDateTime": "Request Date/Time",
"transferDateTime": "Transfer Date/Time",
"failureReason": "Failure Reason",
"depositCertificate": "Deposit Certificate"
},
"alimtalk": {
"buyer": "Buyer",

View File

@@ -986,6 +986,8 @@
"authenticationResult": "인증 결과"
},
"fundAccount": {
"title": "자금이체",
"transferRegistrationTitle": "자금이체 이체등록",
"registrationComplete": "등록완료",
"transferRequest": "이체요청",
"requestSuccess": "요청성공",
@@ -1003,7 +1005,29 @@
"transferRegistrationNotice": "송금등록 후 별도의 '이체요청' 처리가 필요하며, 요청하지 않을 경우 이체가 진행되지 않습니다.",
"resultInquiry": "결과조회",
"tabTransferRequest": "이체요청",
"tabResultInquiry": "결과조회"
"tabResultInquiry": "결과조회",
"bank": "은행",
"pleaseSelect": "선택하세요",
"accountHolderName": "예금주명",
"transferAmount": "이체금액",
"depositParameter": "입금인자",
"registrationSuccess": "이체등록을 성공하였습니다.",
"registrationFailed": "이체등록이 실패하였습니다.",
"registrationError": "이체등록 중 오류가 발생했습니다.",
"register": "등록",
"transferDetailTitle": "자금이체 상세",
"detailInfo": "상세 정보",
"registrationDateTime": "등록일시",
"transferResult": "이체결과",
"beneficiaryName": "수취인명",
"transferRequestButton": "이체 요청",
"transferRequestSuccess": "이체요청을 성공하였습니다.",
"transferRequestFailed": "이체요청이 실패하였습니다.",
"transferRequestError": "이체요청 중 오류가 발생했습니다.",
"requestDateTime": "요청일시",
"transferDateTime": "이체일시",
"failureReason": "실패사유",
"depositCertificate": "입금확인서"
},
"alimtalk": {
"buyer": "주문자",

View File

@@ -66,7 +66,7 @@ export const FundAccountResultDetailPage = () => {
setEmailBottomSheetOn(false);
};
useSetHeaderTitle('자금이체 상세');
useSetHeaderTitle(t('additionalService.fundAccount.transferDetailTitle'));
useSetHeaderType(HeaderType.LeftArrow);
useSetFooterMode(false);
useSetOnBack(() => {
@@ -103,40 +103,40 @@ export const FundAccountResultDetailPage = () => {
onClick={ onClickToOpenEmailBottomSheet }
>
<span className="icon-24 download"></span>
<span></span>
<span>{t('additionalService.fundAccount.depositCertificate')}</span>
</button>
</div>
)}
<div className="detail-divider"></div>
<div className="pay-detail">
<div className="detail-title"> </div>
<div className="detail-title">{t('additionalService.fundAccount.detailInfo')}</div>
<ul className="kv-list">
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.requestDateTime')}</span>
<span className="v">{moment(detail?.requestDate,'YYYYMMDDHHmmss').format('YYYY.MM.DD HH:mm:ss')}</span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.transferDateTime')}</span>
<span className="v">{detail?.applicationDate ? moment(detail?.applicationDate, 'YYYYMMDDHHmmss').format('YYYY.MM.DD HH:mm:ss') : '-'}</span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.transferResult')}</span>
<span className="v">{detail?.resultMessage || '-'}</span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.failureReason')}</span>
<span className="v">{detail?.failReason || '-'}</span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.beneficiaryName')}</span>
<span className="v">{detail?.accountName}</span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.bank')}</span>
<span className="v">{detail?.bankName}</span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.accountNumber')}</span>
<span className="v">{detail?.accountNo}</span>
</li>
<li className="kv-row">
@@ -144,7 +144,7 @@ export const FundAccountResultDetailPage = () => {
<span className="v">{mid}</span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('transaction.fields.orderNumber')}</span>
<span className="v">{detail?.moid}</span>
</li>
<li className="kv-row">

View File

@@ -1,11 +1,12 @@
import { useState } from 'react';
import { PATHS } from '@/shared/constants/paths';
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { FundAccountTab } from '@/entities/additional-service/ui/fund-account/tab';
import { useTranslation } from 'react-i18next';
import { FundAccountTab } from '@/entities/additional-service/ui/fund-account/tab';
import { FundAccountResultListWrap } from '@/entities/additional-service/ui/fund-account/result-list-wrap';
import { FundAccountTabKeys } from '@/entities/additional-service/model/fund-account/types';
import { HeaderType } from '@/entities/common/model/types';
import {
import {
useSetHeaderTitle,
useSetHeaderType,
useSetFooterMode,
@@ -13,11 +14,12 @@ import {
} from '@/widgets/sub-layout/use-sub-layout';
export const FundAccountResultListPage = () => {
const { t } = useTranslation();
const { navigate } = useNavigate();
const [activeTab, setActiveTab] = useState<FundAccountTabKeys>(FundAccountTabKeys.ResultList);
useSetHeaderTitle('자금이체');
useSetHeaderTitle(t('additionalService.fundAccount.title'));
useSetHeaderType(HeaderType.LeftArrow);
useSetFooterMode(false);
useSetOnBack(() => {

View File

@@ -40,7 +40,7 @@ export const FundAccountTransferDetailPage = () => {
});
};
useSetHeaderTitle('자금이체 상세');
useSetHeaderTitle(t('additionalService.fundAccount.transferDetailTitle'));
useSetHeaderType(HeaderType.LeftArrow);
useSetFooterMode(false);
useSetOnBack(() => {
@@ -58,16 +58,16 @@ export const FundAccountTransferDetailPage = () => {
extensionFundAccountTransferRequest(params).then((rs: ExtensionFundAccountTransferRequestResponse) => {
if (rs.status) {
callDetail();
snackBar("이체요청을 성공하였습니다.")
snackBar(t('additionalService.fundAccount.transferRequestSuccess'))
} else {
const errorMessage = rs.error?.message || '이체요청이 실패하였습니다.';
snackBar(`[실패] ${errorMessage}`);
const errorMessage = rs.error?.message || t('additionalService.fundAccount.transferRequestFailed');
snackBar(`[${t('common.failed')}] ${errorMessage}`);
}
}).catch((error) => {
const errorMessage = error?.response?.data?.error?.message ||
error?.message ||
'이체요청 중 오류가 발생했습니다.';
snackBar(`[실패] ${errorMessage}`);
t('additionalService.fundAccount.transferRequestError');
snackBar(`[${t('common.failed')}] ${errorMessage}`);
});
};
@@ -89,38 +89,38 @@ export const FundAccountTransferDetailPage = () => {
</div>
<div className="detail-divider"></div>
<div className="pay-detail">
<div className="detail-title"> </div>
<div className="detail-title">{t('additionalService.fundAccount.detailInfo')}</div>
<ul className="kv-list">
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.registrationDateTime')}</span>
<span className="v">
{detail?.registDate ? moment(detail.registDate, 'YYYYMMDDHHmmss').format('YYYY.MM.DD HH:mm:ss') : '-'}
</span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.processingResult')}</span>
<span className="v">{getFundAccountStatusName(t)(detail?.resultStatus) || '-'}</span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.requestDate')}</span>
<span className="v">
{detail?.requestDate ? moment(detail.requestDate, 'YYYYMMDDHHmmss').format('YYYY.MM.DD') : '-'}
</span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.transferResult')}</span>
<span className="v">{detail?.resultMessage || '-'}</span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.beneficiaryName')}</span>
<span className="v">{detail?.accountName}</span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.bank')}</span>
<span className="v">{detail?.bankCode || '-'} </span>
</li>
<li className="kv-row">
<span className="k"></span>
<span className="k">{t('additionalService.fundAccount.accountNumber')}</span>
<span className="v">{detail?.accountNo}</span>
</li>
<li className="kv-row">
@@ -135,7 +135,7 @@ export const FundAccountTransferDetailPage = () => {
className="btn-50 btn-blue flex-1"
onClick={() => onClickToRequest()}
disabled={detail?.resultStatus !== FundAccountStatus.REGIST_COMPLETE}
> </button>
>{t('additionalService.fundAccount.transferRequestButton')}</button>
</div>
</div>
</div>

View File

@@ -1,6 +1,7 @@
import { useState } from 'react';
import { PATHS } from '@/shared/constants/paths';
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { useTranslation } from 'react-i18next';
import { FundAccountTab } from '@/entities/additional-service/ui/fund-account/tab';
import { FundAccountTransferListWrap } from '@/entities/additional-service/ui/fund-account/transfer-list-wrap';
import { FundAccountTabKeys } from '@/entities/additional-service/model/fund-account/types';
@@ -14,6 +15,7 @@ import {
import { useExtensionAccessCheck } from '@/shared/lib/hooks/use-extension-access-check';
export const FundAccountTransferListPage = () => {
const { t } = useTranslation();
const { navigate } = useNavigate();
// 권한 체크
const { hasAccess, AccessDeniedDialog } = useExtensionAccessCheck({
@@ -21,7 +23,7 @@ export const FundAccountTransferListPage = () => {
});
const [activeTab, setActiveTab] = useState<FundAccountTabKeys>(FundAccountTabKeys.TransferList);
useSetHeaderTitle('자금이체');
useSetHeaderTitle(t('additionalService.fundAccount.title'));
useSetHeaderType(HeaderType.LeftArrow);
useSetFooterMode(false);
useSetOnBack(() => {

View File

@@ -1,3 +1,4 @@
import { useTranslation } from 'react-i18next';
import { PATHS } from '@/shared/constants/paths';
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
import { HeaderType } from '@/entities/common/model/types';
@@ -17,6 +18,7 @@ import { useExtensionFundAccountTransferRequestMutation } from '@/entities/addit
export const FundAccountTransferRequestPage = () => {
const { t } = useTranslation();
const { navigate } = useNavigate();
const midOptionsWithoutGids = useStore.getState().UserStore.selectOptionsMidsWithoutGids;
const userMid = useStore.getState().UserStore.mid;
@@ -32,7 +34,7 @@ export const FundAccountTransferRequestPage = () => {
const { mutateAsync: extensionFundAccountRegist } = useExtensionFundAccountTransferRegistMutation();
useSetHeaderTitle('자금이체 이체등록');
useSetHeaderTitle(t('additionalService.fundAccount.transferRegistrationTitle'));
useSetHeaderType(HeaderType.RightClose);
useSetFooterMode(false);
useSetOnBack(() => {
@@ -72,17 +74,17 @@ export const FundAccountTransferRequestPage = () => {
};
extensionFundAccountRegist(params).then((rs: ExtensionFundAccountTransferRegistResponse) => {
if (rs.status) {
snackBar("이체등록을 성공하였습니다.")
snackBar(t('additionalService.fundAccount.registrationSuccess'))
resetForm();
} else {
const errorMessage = rs.error?.message || '이체등록이 실패하였습니다.';
snackBar(`[실패] ${errorMessage}`);
const errorMessage = rs.error?.message || t('additionalService.fundAccount.registrationFailed');
snackBar(`[${t('common.failed')}] ${errorMessage}`);
}
}).catch((error) => {
const errorMessage = error?.response?.data?.error?.message ||
error?.message ||
'이체등록 중 오류가 발생했습니다.';
snackBar(`[실패] ${errorMessage}`);
t('additionalService.fundAccount.registrationError');
snackBar(`[${t('common.failed')}] ${errorMessage}`);
});
};
@@ -106,7 +108,7 @@ export const FundAccountTransferRequestPage = () => {
<div className="ing-list">
<div className="billing-form gap-30">
<div className="billing-row">
<div className="billing-label"><span>*</span></div>
<div className="billing-label">{t('filter.merchant')}<span>*</span></div>
<div className="billing-field">
<select
value={mid}
@@ -123,10 +125,10 @@ export const FundAccountTransferRequestPage = () => {
</div>
</div>
<div className="billing-row">
<div className="billing-label"><span>*</span></div>
<div className="billing-label">{t('additionalService.fundAccount.bank')}<span>*</span></div>
<div className="billing-field">
<select value={bankCode} onChange={(e) => setBankCode(e.target.value)}>
<option value=""></option>
<option value="">{t('additionalService.fundAccount.pleaseSelect')}</option>
{
bankList
.filter((bank) => bank.code1 !== '****')
@@ -141,7 +143,7 @@ export const FundAccountTransferRequestPage = () => {
</div>
</div>
<div className="billing-row">
<div className="billing-label"><span>*</span></div>
<div className="billing-label">{t('additionalService.fundAccount.accountNumber')}<span>*</span></div>
<div className="billing-field">
<NumericFormat
value={accountNo}
@@ -157,7 +159,7 @@ export const FundAccountTransferRequestPage = () => {
</div>
</div>
<div className="billing-row">
<div className="billing-label"><span>*</span></div>
<div className="billing-label">{t('additionalService.fundAccount.accountHolderName')}<span>*</span></div>
<div className="billing-field">
<input
type="text"
@@ -167,7 +169,7 @@ export const FundAccountTransferRequestPage = () => {
</div>
</div>
<div className="billing-row">
<div className="billing-label"><span>*</span></div>
<div className="billing-label">{t('additionalService.fundAccount.transferAmount')}<span>*</span></div>
<div className="billing-field">
<NumericFormat
value={amount}
@@ -182,7 +184,7 @@ export const FundAccountTransferRequestPage = () => {
</div>
</div>
<div className="billing-row">
<div className="billing-label"><span>*</span></div>
<div className="billing-label">{t('transaction.fields.orderNumber')}<span>*</span></div>
<div className="billing-field" style={{ display: 'flex', gap: '8px', alignItems: 'center' }}>
<input
type="text"
@@ -192,7 +194,7 @@ export const FundAccountTransferRequestPage = () => {
</div>
</div>
<div className="billing-row">
<div className="billing-label"></div>
<div className="billing-label">{t('additionalService.fundAccount.depositParameter')}</div>
<div className="billing-field">
<input
type="text"
@@ -211,7 +213,7 @@ export const FundAccountTransferRequestPage = () => {
className="btn-50 btn-blue flex-1"
onClick={callExtensionFundAccountTransferRegist}
disabled={!isFormValid()}
></button>
>{t('additionalService.fundAccount.register')}</button>
</div>
</>
);