Apply localization to account-holder-search pages
- Replace hardcoded Korean text with i18n translation keys - Update page titles, form labels, and button text - Localize error messages and console logs - Apply to list page, detail page, and request page - Support dynamic language switching (ko/en) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -51,7 +51,7 @@ export const AccountHolderSearchPage = () => {
|
||||
const [resultStatus, setResultStatus] = useState<AccountHolderResultStatus>(AccountHolderResultStatus.ALL);
|
||||
const [emailBottomSheetOn, setEmailBottomSheetOn] = useState<boolean>(false);
|
||||
|
||||
useSetHeaderTitle('계좌성명조회');
|
||||
useSetHeaderTitle(t('additionalService.services.accountHolderSearch'));
|
||||
useSetHeaderType(HeaderType.LeftArrow);
|
||||
useSetFooterMode(false);
|
||||
useSetOnBack(() => {
|
||||
@@ -196,11 +196,11 @@ export const AccountHolderSearchPage = () => {
|
||||
/>
|
||||
<button
|
||||
className="filter-btn"
|
||||
aria-label="필터"
|
||||
aria-label={t('filter.filter')}
|
||||
>
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_setting.svg'}
|
||||
alt="검색옵션"
|
||||
alt={t('filter.searchOptions')}
|
||||
onClick={() => onClickToOpenFilter()}
|
||||
/>
|
||||
</button>
|
||||
@@ -211,7 +211,7 @@ export const AccountHolderSearchPage = () => {
|
||||
>
|
||||
<img
|
||||
src={IMAGE_ROOT + '/ico_download.svg'}
|
||||
alt="다운로드"
|
||||
alt={t('filter.download')}
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
@@ -222,8 +222,8 @@ export const AccountHolderSearchPage = () => {
|
||||
sortType={sortType}
|
||||
onClickToSort={onClickToSort}
|
||||
sortOptions={[
|
||||
{ key: SortTypeKeys.LATEST, label: '최신순' },
|
||||
{ key: SortTypeKeys.OLDEST, label: '오래된순' }
|
||||
{ key: SortTypeKeys.LATEST, label: t('common.latest') },
|
||||
{ key: SortTypeKeys.OLDEST, label: t('common.oldest') }
|
||||
]}
|
||||
></SortTypeBox>
|
||||
<div className="excrow">
|
||||
|
||||
@@ -27,7 +27,7 @@ export const AccountHolderSearchDetailPage = () => {
|
||||
|
||||
const [detail, setDetail] = useState<ExtensionAccountHolderSearchDetailResponse>();
|
||||
|
||||
useSetHeaderTitle('계좌성명조회 상세');
|
||||
useSetHeaderTitle(t('additionalService.services.accountHolderSearch') + ' ' + t('common.detail'));
|
||||
useSetHeaderType(HeaderType.LeftArrow);
|
||||
useSetFooterMode(false);
|
||||
useSetOnBack(() => {
|
||||
@@ -67,34 +67,34 @@ export const AccountHolderSearchDetailPage = () => {
|
||||
</div>
|
||||
<div className="detail-divider"></div>
|
||||
<div className="pay-detail">
|
||||
<div className="detail-title">상세 정보</div>
|
||||
<div className="detail-title">{t('transaction.fields.detailInfo')}</div>
|
||||
<ul className="kv-list">
|
||||
<li className="kv-row">
|
||||
<span className="k">예금주</span>
|
||||
<span className="k">{t('transaction.fields.accountHolder')}</span>
|
||||
<span className="v">{detail?.accountName}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">조회 일시</span>
|
||||
<span className="k">{t('additionalService.accountHolderAuth.requestDate')}</span>
|
||||
<span className="v">{getDate(detail?.requestDate)}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">결과</span>
|
||||
<span className="k">{t('common.result')}</span>
|
||||
<span className="v">{getAccountHolderStatusText(t)(detail?.resultStatus)}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">실패사유</span>
|
||||
<span className="k">{t('transaction.fields.failureReason')}</span>
|
||||
<span className="v">{detail?.failReason ? detail?.failReason : '-' }</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">은행</span>
|
||||
<span className="k">{t('transaction.fields.bank')}</span>
|
||||
<span className="v">{detail?.bankName}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">계좌번호</span>
|
||||
<span className="k">{t('transaction.fields.accountNo')}</span>
|
||||
<span className="v">{detail?.accountNo}</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">요청 구분</span>
|
||||
<span className="k">{t('additionalService.accountHolderAuth.requestWay')}</span>
|
||||
<span className="v">{detail?.requestWay}</span>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
@@ -13,14 +13,16 @@ import { ExtensionAccountHolderSearchRequestParams } from '@/entities/additional
|
||||
import { useStore } from '@/shared/model/store';
|
||||
import { NumericFormat } from 'react-number-format';
|
||||
import { snackBar } from '@/shared/lib';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
export const AccountHolderSearchRequestPage = () => {
|
||||
const { navigate } = useNavigate();
|
||||
const { t } = useTranslation();
|
||||
const userMid = useStore.getState().UserStore.mid;
|
||||
const midOptionsWithoutGids = useStore.getState().UserStore.selectOptionsMidsWithoutGids;
|
||||
const bankList = useStore.getState().CommonStore.bankList
|
||||
|
||||
useSetHeaderTitle('계좌성명조회 신청');
|
||||
useSetHeaderTitle(t('additionalService.services.accountHolderSearch') + ' ' + t('common.request'));
|
||||
useSetHeaderType(HeaderType.LeftArrow);
|
||||
useSetFooterMode(false);
|
||||
useSetOnBack(() => {
|
||||
@@ -58,25 +60,25 @@ export const AccountHolderSearchRequestPage = () => {
|
||||
accountNo: formData.accountNo
|
||||
}
|
||||
|
||||
console.log("계좌성명 조회 조회신청 요청 파라미터 : ", reuqestParams);
|
||||
console.log("Account holder search request params: ", reuqestParams);
|
||||
|
||||
accountHolderSearchRequest(reuqestParams)
|
||||
.then((response) => {
|
||||
if (response.status) {
|
||||
console.log("계좌성명 조회 조회 신청 성공 응답: ", response.status)
|
||||
snackBar("계좌성명 조회 신청을 성공하였습니다.")
|
||||
console.log("Account holder search request success: ", response.status)
|
||||
snackBar(t('common.requestSuccess'))
|
||||
navigate(PATHS.additionalService.accountHolderSearch.list);
|
||||
} else {
|
||||
const errorMessage = response.error?.message || '계좌성명 조회 신청이 실패하였습니다.';
|
||||
snackBar(`[실패] ${errorMessage}`);
|
||||
const errorMessage = response.error?.message || t('common.requestFailed');
|
||||
snackBar(`[${t('common.failed')}] ${errorMessage}`);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error("계좌성명 조회 조회 신청 실패: ", error)
|
||||
console.error("Account holder search request failed: ", error)
|
||||
const errorMessage = error?.response?.data?.error?.message ||
|
||||
error?.message ||
|
||||
'계좌성명 조회 신청 중 오류가 발생했습니다.';
|
||||
snackBar(`[실패] ${errorMessage}`);
|
||||
t('common.errorOccurred');
|
||||
snackBar(`[${t('common.failed')}] ${errorMessage}`);
|
||||
})
|
||||
};
|
||||
|
||||
@@ -96,7 +98,7 @@ export const AccountHolderSearchRequestPage = () => {
|
||||
<div className="option-list">
|
||||
<div className="billing-form gap-16">
|
||||
<div className="billing-row">
|
||||
<div className="billing-label">가맹점</div>
|
||||
<div className="billing-label">{t('filter.merchant')}</div>
|
||||
<div className="billing-field">
|
||||
<select value={formData.mid} onChange={(e) => handleInputChange('mid', e.target.value)}>
|
||||
{
|
||||
@@ -112,10 +114,10 @@ export const AccountHolderSearchRequestPage = () => {
|
||||
</div>
|
||||
|
||||
<div className="billing-row">
|
||||
<div className="billing-label">은행</div>
|
||||
<div className="billing-label">{t('transaction.fields.bank')}</div>
|
||||
<div className="billing-field">
|
||||
<select value={formData.bankCode} onChange={(e) => handleInputChange('bankCode', e.target.value)}>
|
||||
<option value="">선택하세요</option>
|
||||
<option value="">{t('common.pleaseSelect')}</option>
|
||||
{
|
||||
bankList
|
||||
.filter((bank) => bank.code1 !== '****')
|
||||
@@ -131,7 +133,7 @@ export const AccountHolderSearchRequestPage = () => {
|
||||
</div>
|
||||
|
||||
<div className="billing-row">
|
||||
<div className="billing-label">계좌번호</div>
|
||||
<div className="billing-label">{t('transaction.fields.accountNo')}</div>
|
||||
<div className="billing-field">
|
||||
<NumericFormat
|
||||
value={formData.accountNo}
|
||||
@@ -155,7 +157,7 @@ export const AccountHolderSearchRequestPage = () => {
|
||||
className="btn-50 btn-blue flex-1"
|
||||
disabled={!isFormValid()}
|
||||
onClick={() => onClickToRequest()}
|
||||
>신청</button>
|
||||
>{t('common.request')}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user