[Object Object] 표시 오류 수정: Intl.NumberFormat 사용
This commit is contained in:
@@ -47,7 +47,7 @@ export const TitleInfoWrap = ({
|
||||
<>
|
||||
<div className="num-amount">
|
||||
<span className="amount-text">
|
||||
{t('home.money', { value: <NumericFormat value={titleInfo?.amount} thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(titleInfo?.amount || 0) })}
|
||||
</span>
|
||||
</div>
|
||||
<div className="num-store">{titleInfo?.corpName}</div>
|
||||
@@ -59,7 +59,7 @@ export const TitleInfoWrap = ({
|
||||
<>
|
||||
<div className="num-amount">
|
||||
<span className="amount-text">
|
||||
{t('home.money', { value: <NumericFormat value={titleInfo?.amount} thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(titleInfo?.amount || 0) })}
|
||||
</span>
|
||||
</div>
|
||||
<div className="num-store">{titleInfo?.corpName}</div>
|
||||
|
||||
@@ -557,7 +557,7 @@ export const ListItem = ({
|
||||
else if (additionalServiceCategory === AdditionalServiceCategory.KeyInPayment) {
|
||||
rs.push(
|
||||
<div className="transaction-amount">
|
||||
{t('home.money', { value: <NumericFormat value={amount} thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amount || 0) })}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -566,7 +566,7 @@ export const ListItem = ({
|
||||
) {
|
||||
rs.push(
|
||||
<div className="transaction-amount">
|
||||
{t('home.money', { value: <NumericFormat value={amount} thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amount || 0) })}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -576,7 +576,7 @@ export const ListItem = ({
|
||||
key="payout-item-amount"
|
||||
className="transaction-amount"
|
||||
>
|
||||
{t('home.money', { value: <NumericFormat value={amount} thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amount || 0) })}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -588,7 +588,7 @@ export const ListItem = ({
|
||||
key="fund-account-transfer-amount"
|
||||
className="transaction-amount"
|
||||
>
|
||||
{t('home.money', { value: <NumericFormat value={amount} thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amount || 0) })}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -598,7 +598,7 @@ export const ListItem = ({
|
||||
key="payout-item-amount"
|
||||
className="transaction-amount"
|
||||
>
|
||||
{t('home.money', { value: <NumericFormat value={amount} thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amount || 0) })}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -71,7 +71,7 @@ export const BoxContainer1 = () => {
|
||||
<h3>{t('home.todaySales')}</h3>
|
||||
<div className="today-sales">
|
||||
<span className="won01">
|
||||
{t('home.money', { value: <NumericFormat value={ sales?.todayTotalAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(sales?.todayTotalAmount || 0) })}
|
||||
</span>
|
||||
<span className={ `per ${(increaseRate && increaseRate >= 0)? 'plus': 'minus'}` }>
|
||||
<NumericFormat
|
||||
@@ -119,7 +119,7 @@ export const BoxContainer1 = () => {
|
||||
<h3>{t('home.todaySettlement')}</h3>
|
||||
<div className="today-sales">
|
||||
<span className="won02">
|
||||
{t('home.money', { value: <NumericFormat value={ settlement?.todaySettlementAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(settlement?.todaySettlementAmount || 0) })}
|
||||
</span>
|
||||
<span className="per">{t('home.depositCompleted')}</span>
|
||||
<a className="arrow">
|
||||
@@ -150,7 +150,7 @@ export const BoxContainer1 = () => {
|
||||
<div className="remain-limit">
|
||||
<span>{t('home.remainingSettlementLimit')}</span>
|
||||
<strong style={{marginLeft: '4px'}}>
|
||||
{t('home.money', { value: <NumericFormat value={ settlement?.availableCredit } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(settlement?.availableCredit || 0) })}
|
||||
</strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -112,7 +112,7 @@ export const BoxContainer2 = () => {
|
||||
<h4>{t('home.totalSales')}</h4>
|
||||
<div className="today-sales mt-sty">
|
||||
<span className="won01">
|
||||
{t('home.money', { value: <NumericFormat value={ sales?.currentMonthAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(sales?.currentMonthAmount || 0) })}
|
||||
</span>
|
||||
<span className={ `per ${(salesIncrease && salesIncrease >= 0)? 'plus': 'minus'}` }>
|
||||
<NumericFormat
|
||||
@@ -136,7 +136,7 @@ export const BoxContainer2 = () => {
|
||||
<h4>{t('home.totalSettlement')}</h4>
|
||||
<div className="today-sales mt-sty">
|
||||
<span className="won02">
|
||||
{t('home.money', { value: <NumericFormat value={ settlement?.currentMonthSettlementAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(settlement?.currentMonthSettlementAmount || 0) })}
|
||||
</span>
|
||||
<span className={ `per ${(settlementIncrease && settlementIncrease >= 0)? 'plus': 'minus'}` }>
|
||||
<NumericFormat
|
||||
@@ -166,7 +166,7 @@ export const BoxContainer2 = () => {
|
||||
<h4>{t('home.averageTransactionAmount')}</h4>
|
||||
<div className="two-account">
|
||||
<span>
|
||||
{t('home.money', { value: <NumericFormat value={ averageTransactionAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(averageTransactionAmount || 0) })}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -174,7 +174,7 @@ export const BoxContainer2 = () => {
|
||||
<h4>{t('home.dailyAverageSalesAndCount')}</h4>
|
||||
<div className="two-account">
|
||||
<span>
|
||||
{t('home.money', { value: <NumericFormat value={ dailyAverageSales } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(dailyAverageSales || 0) })}
|
||||
(<NumericFormat
|
||||
value={ dailyAverageCount }
|
||||
thousandSeparator
|
||||
|
||||
@@ -103,7 +103,7 @@ export const NoInterestInfoBottomSheet = ({
|
||||
<div className="desc dot">
|
||||
<span>{t('payment.applicationAmount')} : </span>
|
||||
<span>
|
||||
{t('home.money', { value: <NumericFormat value={ value.applicationAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(value.applicationAmount || 0) })}
|
||||
</span>
|
||||
</div>
|
||||
</>
|
||||
|
||||
@@ -22,7 +22,7 @@ export const AmountInfoWrap = ({
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('settlement.totalTransactionAmount')}</span>
|
||||
<span className="v">
|
||||
{t('home.money', { value: <NumericFormat value={ amountInfo?.totalTransactionAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.totalTransactionAmount || 0) })}
|
||||
<NumericFormat
|
||||
value={ amountInfo?.totalTransactionCount }
|
||||
thousandSeparator
|
||||
@@ -35,7 +35,7 @@ export const AmountInfoWrap = ({
|
||||
<li>
|
||||
<span>· {t('settlement.creditCard')}</span>
|
||||
<span className="unset-child-span">
|
||||
{t('home.money', { value: <NumericFormat value={ amountInfo?.creditCardAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.creditCardAmount || 0) })}
|
||||
<NumericFormat
|
||||
value={ amountInfo?.creditCardCount }
|
||||
thousandSeparator
|
||||
@@ -48,7 +48,7 @@ export const AmountInfoWrap = ({
|
||||
<li>
|
||||
<span>· {t('settlement.accountTransfer')}</span>
|
||||
<span className="unset-child-span">
|
||||
{t('home.money', { value: <NumericFormat value={ amountInfo?.accountTransferAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.accountTransferAmount || 0) })}
|
||||
<NumericFormat
|
||||
value={ amountInfo?.accountTransferCount }
|
||||
thousandSeparator
|
||||
@@ -159,49 +159,49 @@ export const AmountInfoWrap = ({
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('settlement.transactionAmount')}</span>
|
||||
<span className="v">
|
||||
{t('home.money', { value: <NumericFormat value={ amountInfo?.transactionAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.transactionAmount || 0) })}
|
||||
</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('settlement.paymentFee')}</span>
|
||||
<span className="v">
|
||||
{t('home.money', { value: <NumericFormat value={ amountInfo?.paymentFee } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.paymentFee || 0) })}
|
||||
</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('settlement.escrowFee')}</span>
|
||||
<span className="v">
|
||||
{t('home.money', { value: <NumericFormat value={ amountInfo?.escrowFee } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.escrowFee || 0) })}
|
||||
</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('settlement.authFee')}</span>
|
||||
<span className="v">
|
||||
{t('home.money', { value: <NumericFormat value={ amountInfo?.authFee } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.authFee || 0) })}
|
||||
</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">VAT</span>
|
||||
<span className="v">
|
||||
{t('home.money', { value: <NumericFormat value={ amountInfo?.vatFee } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.vatFee || 0) })}
|
||||
</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('settlement.expectedSettlementAmount')}</span>
|
||||
<span className="v">
|
||||
{t('home.money', { value: <NumericFormat value={ amountInfo?.settlementAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.settlementAmount || 0) })}
|
||||
</span>
|
||||
</li>
|
||||
<li className="kv-row">
|
||||
<span className="k">{t('settlement.preSettlementCancelOffset')}</span>
|
||||
<span className="v">
|
||||
{t('home.money', { value: <NumericFormat value={ amountInfo?.preSettlementCancelOffset } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.preSettlementCancelOffset || 0) })}
|
||||
</span>
|
||||
</li>
|
||||
<li className="kv-row bolder">
|
||||
<span className="k">{t('settlement.settlementAmount')}</span>
|
||||
<span className="v">
|
||||
{t('home.money', { value: <NumericFormat value={ amountInfo?.finalSettlementAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amountInfo?.finalSettlementAmount || 0) })}
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
@@ -65,7 +65,7 @@ export const ListItem = ({
|
||||
}
|
||||
</div>
|
||||
<div className="transaction-amount">
|
||||
{t('home.money', { value: <NumericFormat value={ settlementAmount || transactionAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(settlementAmount || transactionAmount || 0) })}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
||||
@@ -391,7 +391,7 @@ export const ListWrap = ({
|
||||
<div className="summary-label label">{t('settlement.settlementAmount')}</div>
|
||||
<div className="summary-amount divTop">
|
||||
<span className="amount-text">
|
||||
{t('home.money', { value: <NumericFormat value={ settlementAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(settlementAmount || 0) })}
|
||||
</span>
|
||||
<button
|
||||
onClick={ () => setIsOpenSummary(!isOpenSummary) }
|
||||
|
||||
@@ -69,25 +69,25 @@ export const VatReturnListDetailBottomSheet = ({
|
||||
<div className="row">
|
||||
<div className="label desc dot">{t('vatReturn.transactionAmount')} :</div>
|
||||
<div className="value">
|
||||
{t('home.money', { value: <NumericFormat value={ transactionAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(transactionAmount || 0) })}
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="label desc dot">{t('vatReturn.supplyAmount')} :</div>
|
||||
<div className="value">
|
||||
{t('home.money', { value: <NumericFormat value={ supplyAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(supplyAmount || 0) })}
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="label desc dot">{t('vatReturn.vat')} :</div>
|
||||
<div className="value">
|
||||
{t('home.money', { value: <NumericFormat value={ vatAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(vatAmount || 0) })}
|
||||
</div>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="label desc dot">{t('vatReturn.totalAmount')} :</div>
|
||||
<div className="value">
|
||||
{t('home.money', { value: <NumericFormat value={ totalAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(totalAmount || 0) })}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -105,7 +105,7 @@ export const VatReturnListDetailBottomSheet = ({
|
||||
<span className="date">{ value.transactionDate? moment(value.transactionDate).format('YYYY-MM-DD'): '' }</span>
|
||||
<div className="amount">
|
||||
<span className="text">
|
||||
{t('home.money', { value: <NumericFormat value={ value.totalAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(value.totalAmount || 0) })}
|
||||
</span>
|
||||
<img
|
||||
className="arrow down"
|
||||
@@ -124,13 +124,13 @@ export const VatReturnListDetailBottomSheet = ({
|
||||
</div>
|
||||
<div className="values">
|
||||
<span>
|
||||
{t('home.money', { value: <NumericFormat value={ value.transactionAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(value.transactionAmount || 0) })}
|
||||
</span>
|
||||
<span>
|
||||
{t('home.money', { value: <NumericFormat value={ value.supplyAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(value.supplyAmount || 0) })}
|
||||
</span>
|
||||
<span>
|
||||
{t('home.money', { value: <NumericFormat value={ value.vatAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(value.vatAmount || 0) })}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -42,7 +42,7 @@ export const ListItem = ({
|
||||
</div>
|
||||
</div>
|
||||
<div className="transaction-amount">
|
||||
{t('home.money', { value: <NumericFormat value={ amount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(amount || 0) })}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
||||
@@ -37,7 +37,7 @@ export const AmountSection = ({
|
||||
<div className="txn-num-group">
|
||||
<div className="txn-amount">
|
||||
<div className="value">
|
||||
{t('home.money', { value: <NumericFormat value={ detail.totalAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(detail.totalAmount || 0) })}
|
||||
</div>
|
||||
<button
|
||||
className="chip-btn"
|
||||
@@ -54,13 +54,13 @@ export const AmountSection = ({
|
||||
<li className="amount-item">
|
||||
<span className="label">· {t('vatReturn.supplyAmount')}</span>
|
||||
<span className="value">
|
||||
{t('home.money', { value: <NumericFormat value={ detail.supplyAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(detail.supplyAmount || 0) })}
|
||||
</span>
|
||||
</li>
|
||||
<li className="amount-item">
|
||||
<span className="label">· {t('vatReturn.vat')}</span>
|
||||
<span className="value">
|
||||
{t('home.money', { value: <NumericFormat value={ detail.vatAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(detail.vatAmount || 0) })}
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
@@ -86,7 +86,7 @@ export const ArsDetailPage = () => {
|
||||
<div className="pay-top">
|
||||
<div className="num-amount">
|
||||
<span className="amount">
|
||||
{t('home.money', { value: <NumericFormat value={ detail?.amount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(detail?.amount || 0) })}
|
||||
</span>
|
||||
</div>
|
||||
<div className="num-store">{ detail?.corpName }</div>
|
||||
|
||||
@@ -86,7 +86,7 @@ export const FundAccountResultDetailPage = () => {
|
||||
<div className="pay-top">
|
||||
<div className="num-amount">
|
||||
<span className="amount">
|
||||
{t('home.money', { value: <NumericFormat value={detail?.amount} thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(detail?.amount || 0) })}
|
||||
</span>
|
||||
</div>
|
||||
<div className="num-store">{detail?.accountName}({detail?.accountNo})</div>
|
||||
|
||||
@@ -79,7 +79,7 @@ export const FundAccountTransferDetailPage = () => {
|
||||
<div className="pay-top">
|
||||
<div className="num-amount">
|
||||
<span className="amount">
|
||||
{t('home.money', { value: <NumericFormat value={detail?.amount} thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(detail?.amount || 0) })}
|
||||
</span>
|
||||
</div>
|
||||
<div className="num-store">{detail?.accountName}({detail?.accountNo})</div>
|
||||
|
||||
@@ -108,7 +108,7 @@ export const PayoutDetailPage = () => {
|
||||
<div className="pay-top">
|
||||
<div className="num-amount">
|
||||
<span className="amount">
|
||||
{t('home.money', { value: <NumericFormat value={ detail?.disbursementAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(detail?.disbursementAmount || 0) })}
|
||||
</span>
|
||||
</div>
|
||||
<div className="num-store">{detail?.companyName}</div>
|
||||
|
||||
@@ -231,7 +231,7 @@ export const AllTransactionListPage = () => {
|
||||
<div className="summary-label">{t('transaction.searchAmount')}</div>
|
||||
<div className="summary-amount">
|
||||
<span className="amount-text">
|
||||
{t('home.money', { value: <NumericFormat value={ totalAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(totalAmount || 0) })}
|
||||
</span>
|
||||
<div className="summary-actions">
|
||||
<button className="filter-btn">
|
||||
|
||||
@@ -218,7 +218,7 @@ export const CashReceiptListPage = () => {
|
||||
<div className="row">
|
||||
<span className="label">{ t('cashReceipt.approval') }</span>
|
||||
<strong className="amount22">
|
||||
{t('home.money', { value: <NumericFormat value={ approvalAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(approvalAmount || 0) })}
|
||||
</strong>
|
||||
<span className="count">
|
||||
<NumericFormat
|
||||
@@ -233,7 +233,7 @@ export const CashReceiptListPage = () => {
|
||||
<div className="row">
|
||||
<span className="label">{ t('common.cancel') }</span>
|
||||
<strong className="amount19">
|
||||
{t('home.money', { value: <NumericFormat value={ cancelAmount } thousandSeparator displayType="text" /> })}
|
||||
{t('home.money', { value: new Intl.NumberFormat('en-US').format(cancelAmount || 0) })}
|
||||
</strong>
|
||||
<span className="count">
|
||||
<NumericFormat
|
||||
|
||||
Reference in New Issue
Block a user