거래 관련 페이지 다국어화 완료 (현금영수증, 에스크로, 빌링)

- 현금영수증 페이지 다국어화 (목록, 상세, 수기발행)
  * 승인/취소 금액 통화 표기 개선 (₩ prefix for EN)
  * 검색옵션, 다운로드, 용도변경 등 모든 텍스트 다국어화
- 에스크로 페이지 다국어화 (목록, 상세)
  * 헤더 타이틀 및 UI 텍스트 다국어화
- 빌링 페이지 다국어화 (목록, 상세, 청구)
  * 통화 표기 언어별 처리 (한국어: 원 suffix / 영어: ₩ prefix)
- 번역 키 추가: cashReceipt, escrow, billing, common 네임스페이스
- 모든 거래 페이지 일관된 다국어 지원 완료

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

Co-Authored-By: Claude <noreply@anthropic.com>

src/locales/en.json

@@ -14,7 +14,8 @@
         "loading": "Loading...",
         "error": "An error occurred",
         "success": "Success",
-        "noData": "No data available"
+        "noData": "No data available",
+        "next": "Next"
     },
     "menu": {
         "home": "Home",
@@ -275,5 +276,22 @@
         "download": "Download",
         "cancelTransaction": "Cancel Transaction",
         "confirmCancel": "Do you want to cancel this transaction?"
+    },
+    "cashReceipt": {
+        "title": "Cash Receipt",
+        "detailTitle": "Cash Receipt Details",
+        "manualIssuance": "Manual Issuance",
+        "approval": "Approved",
+        "changePurpose": "Change Purpose",
+        "issue": "Issue"
+    },
+    "escrow": {
+        "title": "Escrow",
+        "detailTitle": "Escrow Details"
+    },
+    "billing": {
+        "title": "Billing",
+        "detailTitle": "Billing Details",
+        "charge": "Billing Charge"
     }
 }

src/locales/ko.json

@@ -14,7 +14,8 @@
         "loading": "로딩중...",
         "error": "오류가 발생했습니다",
         "success": "성공",
-        "noData": "데이터가 없습니다"
+        "noData": "데이터가 없습니다",
+        "next": "다음"
     },
     "menu": {
         "home": "홈",
@@ -279,5 +280,22 @@
         "download": "다운로드",
         "cancelTransaction": "거래 취소",
         "confirmCancel": "거래를 취소하시겠습니까?"
+    },
+    "cashReceipt": {
+        "title": "현금영수증",
+        "detailTitle": "현금영수증 상세",
+        "manualIssuance": "수기 발행",
+        "approval": "승인",
+        "changePurpose": "용도 변경",
+        "issue": "발행"
+    },
+    "escrow": {
+        "title": "에스크로",
+        "detailTitle": "에스크로 상세"
+    },
+    "billing": {
+        "title": "빌링",
+        "detailTitle": "빌링 상세",
+        "charge": "빌링 청구"
     }
 }

src/pages/transaction/billing/charge-page.tsx

@@ -1,4 +1,5 @@
 import { ChangeEvent, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { PATHS } from '@/shared/constants/paths';
 import { IMAGE_ROOT } from '@/shared/constants/common';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
@@ -18,6 +19,7 @@ import { notiBar, snackBar } from '@/shared/lib';
 
 export const BillingChargePage = () => {
   const { navigate } = useNavigate();
+  const { t } = useTranslation();
 
   const [billKey, setBillKey] = useState<string>('');
   const [productName, setProductName] = useState<string>('');
@@ -30,7 +32,7 @@ export const BillingChargePage = () => {
   const [calendarOpen, setCalendarOpen] = useState<boolean>(false);
 
 
-  useSetHeaderTitle('빌링 결제 신청');
+  useSetHeaderTitle(t('billing.charge'));
   useSetHeaderType(HeaderType.RightClose);
   useSetOnBack(() => {
     navigate(PATHS.transaction.billing.list);

src/pages/transaction/billing/detail-page.tsx

@@ -1,4 +1,5 @@
 import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { useLocation } from 'react-router';
 import { PATHS } from '@/shared/constants/paths';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
@@ -24,6 +25,7 @@ import { AmountInfoSection } from '@/entities/transaction/ui/section/amount-info
 
 export const BillingDetailPage = () => {
   const { navigate } = useNavigate();
+  const { t, i18n } = useTranslation();
   const location = useLocation();
   const tid = location?.state.tid;
   const serviceCode = location?.state.serviceCode;
@@ -32,7 +34,7 @@ export const BillingDetailPage = () => {
   const [billingInfo, setBillingInfo] = useState<BillingInfo>();
   const [amountInfo, setAmountInfo] = useState<AmountInfo>();
 
-  useSetHeaderTitle('빌링 상세');
+  useSetHeaderTitle(t('billing.detailTitle'));
   useSetHeaderType(HeaderType.RightClose);
   useSetOnBack(() => {
     navigate(PATHS.transaction.billing.list);
@@ -67,12 +69,13 @@ export const BillingDetailPage = () => {
                 <div className="txn-num-group">
                   <div className="txn-amount">
                     <div className="value">
+                      { i18n.language === 'en' && <span className="unit">{ t('home.currencySymbol') }</span> }
                       <NumericFormat
                         value={ amountInfo?.transactionAmount }
                         thousandSeparator
                         displayType="text"
                       ></NumericFormat>
-                      <span className="unit">원</span>
+                      { i18n.language !== 'en' && <span className="unit">{ t('home.currencyWon') }</span> }
                     </div>
                   </div>
                   <div className="txn-mid">

src/pages/transaction/billing/list-page.tsx

@@ -1,5 +1,6 @@
 import moment from 'moment';
 import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { useStore } from '@/shared/model/store';
 import { IMAGE_ROOT } from '@/shared/constants/common';
 import { PATHS } from '@/shared/constants/paths';
@@ -33,6 +34,7 @@ import useIntersectionObserver from '@/widgets/intersection-observer';
 
 export const BillingListPage = () => {
 	const { navigate } = useNavigate();
+	const { t } = useTranslation();
 	const userMid = useStore.getState().UserStore.mid;
 	
 	const [onActionIntersect, setOnActionIntersect] = useState<boolean>(false);
@@ -54,7 +56,7 @@ export const BillingListPage = () => {
 
 	const [downloadBottomSheetOn, setDownloadBottomSheetOn] = useState<boolean>(false);
 
-	useSetHeaderTitle('빌링');
+	useSetHeaderTitle(t('billing.title'));
 	useSetHeaderType(HeaderType.LeftArrow);
 	useSetOnBack(() => {
 		navigate(PATHS.home);
@@ -178,7 +180,7 @@ export const BillingListPage = () => {
 									<button className="filter-btn">
 										<img
 											src={ IMAGE_ROOT + '/ico_setting.svg' }
-											alt="검색옵션"
+											alt={ t('transaction.searchOptions') }
 											onClick={ () => onClickToOpenFilter() }
 										/>
 									</button>
@@ -186,7 +188,7 @@ export const BillingListPage = () => {
 								<button className="download-btn">
 									<img
 										src={ IMAGE_ROOT + '/ico_download.svg' }
-										alt="다운로드"
+										alt={ t('transaction.download') }
 										onClick={ () => onClickToOpenDownloadBottomSheet() }
 									/>
 								</button>

src/pages/transaction/cash-receipt/detail-page.tsx

@@ -1,4 +1,5 @@
 import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { useLocation } from 'react-router';
 import { PATHS } from '@/shared/constants/paths';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
@@ -31,6 +32,7 @@ import { snackBar } from '@/shared/lib';
 
 export const CashReceiptDetailPage = () => {
   const { navigate, reload } = useNavigate();
+  const { t } = useTranslation();
   const location = useLocation();
   
   const [amountInfo, setAmountInfo] = useState<AmountInfo>();
@@ -43,7 +45,7 @@ export const CashReceiptDetailPage = () => {
   const [canDownloadReceipt, setCanDownloadReceipt] = useState<boolean>(false);
 
 
-  useSetHeaderTitle('현금영수증 상세');
+  useSetHeaderTitle(t('cashReceipt.detailTitle'));
   useSetHeaderType(HeaderType.RightClose);
   useSetOnBack(() => {
     navigate(PATHS.transaction.cashReceipt.list);
@@ -143,7 +145,7 @@ export const CashReceiptDetailPage = () => {
                 <button
                   className="btn-50 btn-blue flex-1"
                   onClick={ () => onClickToPurposeUpdate() }
-                >용도 변경</button>
+                >{ t('cashReceipt.changePurpose') }</button>
               </div>
             }
           </div>

src/pages/transaction/cash-receipt/hand-written-issuance-page.tsx

@@ -1,4 +1,5 @@
 import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { PATHS } from '@/shared/constants/paths';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
 import { CashReceiptHandWrittenIssuanceStep1 } from '@/entities/transaction/ui/cash-receipt-hand-written-issuance-step1';
@@ -13,6 +14,7 @@ import { snackBar } from '@/shared/lib';
 
 export const CashReceitHandWrittenIssuancePage = () => {
   const { navigate } = useNavigate();
+  const { t } = useTranslation();
   let businessInfo = useStore.getState().UserStore.businessInfo;
   let userMid = useStore.getState().UserStore.mid;
   // 1 or 2
@@ -30,7 +32,7 @@ export const CashReceitHandWrittenIssuancePage = () => {
   const [taxFreeAmount, setTaxFreeAmount] = useState<number>(0);
   const [serviceCharge, setServiceCharge] = useState<number>(0);
 
-  useSetHeaderTitle('수기 발행');
+  useSetHeaderTitle(t('cashReceipt.manualIssuance'));
   useSetHeaderType(HeaderType.RightClose);
   useSetFooterMode(false);
 
@@ -176,8 +178,8 @@ export const CashReceitHandWrittenIssuancePage = () => {
                 className="btn-50 btn-blue flex-1"
                 onClick={ () => onClickToChangeTab() }
               >
-                { (processStep === ProcessStep.One) && '다음' }
+                { (processStep === ProcessStep.One) && t('common.next') }
-                { (processStep === ProcessStep.Two) && '발행' }
+                { (processStep === ProcessStep.Two) && t('cashReceipt.issue') }
               </button>
             </div>
           </div>

src/pages/transaction/cash-receipt/list-page.tsx

@@ -1,5 +1,6 @@
 import moment from 'moment';
 import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { NumericFormat } from 'react-number-format';
 import { IMAGE_ROOT } from '@/shared/constants/common';
 import { PATHS } from '@/shared/constants/paths';
@@ -37,6 +38,7 @@ import useIntersectionObserver from '@/widgets/intersection-observer';
 
 export const CashReceiptListPage = () => {
 	const { navigate } = useNavigate();
+	const { t, i18n } = useTranslation();
 	const userMid = useStore.getState().UserStore.mid;
 
 	const [onActionIntersect, setOnActionIntersect] = useState<boolean>(false);
@@ -60,7 +62,7 @@ export const CashReceiptListPage = () => {
 
 	const [emailBottomSheetOn, setEmailBottomSheetOn] = useState<boolean>(false);
 
-	useSetHeaderTitle('현금영수증');
+	useSetHeaderTitle(t('cashReceipt.title'));
 	useSetHeaderType(HeaderType.LeftArrow);
 	useSetOnBack(() => {
 		navigate(PATHS.home);
@@ -199,7 +201,7 @@ export const CashReceiptListPage = () => {
 									<button className="filter-btn">
 										<img
 											src={ IMAGE_ROOT + '/ico_setting.svg' }
-											alt="검색옵션"
+											alt={ t('transaction.searchOptions') }
 											onClick={ () => onClickToOpenFilter() }
 										/>
 									</button>
@@ -207,20 +209,21 @@ export const CashReceiptListPage = () => {
 								<button className="download-btn">
 									<img
 										src={IMAGE_ROOT + '/ico_download.svg'}
-										alt="다운로드"
+										alt={ t('transaction.download') }
 										onClick={() => onClickToDownloadExcel()}
 									/>
 								</button>
 							</div>
 							<div className="credit-summary">
 								<div className="row">
-									<span className="label">승인</span>
+									<span className="label">{ t('cashReceipt.approval') }</span>
 									<strong className="amount22">
 										<NumericFormat
 											value={ approvalAmount }
 											thousandSeparator
 											displayType="text"
-											suffix='원'
+											prefix={ i18n.language === 'en' ? t('home.currencySymbol') : '' }
+											suffix={ i18n.language === 'en' ? '' : t('home.currencyWon') }
 										></NumericFormat>
 									</strong>
 									<span className="count">
@@ -234,13 +237,14 @@ export const CashReceiptListPage = () => {
 									</span>
 								</div>
 								<div className="row">
-									<span className="label">취소</span>
+									<span className="label">{ t('common.cancel') }</span>
 									<strong className="amount19">
 										<NumericFormat
 											value={ cancelAmount }
 											thousandSeparator
 											displayType="text"
-											suffix='원'
+											prefix={ i18n.language === 'en' ? t('home.currencySymbol') : '' }
+											suffix={ i18n.language === 'en' ? '' : t('home.currencyWon') }
 										></NumericFormat>
 									</strong>
 									<span className="count">

src/pages/transaction/escrow/detail-page.tsx

@@ -1,4 +1,5 @@
 import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { useLocation } from 'react-router';
 import { PATHS } from '@/shared/constants/paths';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
@@ -35,6 +36,7 @@ import { AmountInfoSection } from '@/entities/transaction/ui/section/amount-info
 
 export const EscrowDetailPage = () => {
   const { navigate } = useNavigate();
+  const { t } = useTranslation();
   const location = useLocation();
   const paramTid = location?.state.tid;
   const serviceCode = location?.state.serviceCode;
@@ -60,7 +62,7 @@ export const EscrowDetailPage = () => {
   const [orderNumber, setOrderNumber] = useState<string>();
   const [tid, setTid] = useState<string | undefined>(paramTid);
 
-  useSetHeaderTitle('에스크로 상세');
+  useSetHeaderTitle(t('escrow.detailTitle'));
   useSetHeaderType(HeaderType.RightClose);
   useSetOnBack(() => {
     navigate(PATHS.transaction.escrow.list);

src/pages/transaction/escrow/list-page.tsx

@@ -1,5 +1,6 @@
 import moment from 'moment';
 import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
 import { useStore } from '@/shared/model/store';
 import { IMAGE_ROOT } from '@/shared/constants/common';
 import { PATHS } from '@/shared/constants/paths';
@@ -32,6 +33,7 @@ import useIntersectionObserver from '@/widgets/intersection-observer';
 
 export const EscrowListPage = () => {
 	const { navigate } = useNavigate();
+	const { t } = useTranslation();
 	const userInfo = useStore((state) => state.UserStore.userInfo);
 	const userMid = useStore.getState().UserStore.mid;
 
@@ -53,7 +55,7 @@ export const EscrowListPage = () => {
 
 	const [emailBottomSheetOn, setEmailBottomSheetOn] = useState<boolean>(false);
 		
-	useSetHeaderTitle('에스크로');
+	useSetHeaderTitle(t('escrow.title'));
 	useSetHeaderType(HeaderType.LeftArrow);
 	useSetOnBack(() => {
 		navigate(PATHS.home);
@@ -182,7 +184,7 @@ export const EscrowListPage = () => {
 									<button className="filter-btn">
 										<img
 											src={ IMAGE_ROOT + '/ico_setting.svg' }
-											alt="검색옵션"
+											alt={ t('transaction.searchOptions') }
 											onClick={ () => onClickToOpenFilter() }
 										/>
 									</button>
@@ -190,7 +192,7 @@ export const EscrowListPage = () => {
 								<button className="download-btn">
 									<img
 										src={ IMAGE_ROOT + '/ico_download.svg' }
-										alt="다운로드"
+										alt={ t('transaction.download') }
 										onClick={ () => onClickToDownloadExcel() }
 									/>
 								</button>