add priceUtils -- formatter price
This commit is contained in:
parent
2c6c8ad6e1
commit
2cd5a9987d
3 changed files with 46 additions and 4 deletions
|
|
@ -1,5 +1,6 @@
|
|||
import React from 'react';
|
||||
import { ArrowDownCircle, ArrowDownIcon, ArrowUp, ArrowUpCircle } from 'lucide-react';
|
||||
import { formatPriceWithToman } from '@/lib/utils/priceUtils';
|
||||
|
||||
interface TransactionItemProps {
|
||||
amount: number;
|
||||
|
|
@ -20,8 +21,6 @@ const TransactionItem = ({
|
|||
const bgColor = isDeposit ? 'bg-[#2E7D3210]' : 'bg-[#D32F2F10]';
|
||||
const iconColor = isDeposit ? 'text-[#2E7D32]' : 'text-[#D32F2F]';
|
||||
|
||||
const formattedAmount = amount.toLocaleString('fa-IR');
|
||||
|
||||
return (
|
||||
<div
|
||||
className={`
|
||||
|
|
@ -38,7 +37,7 @@ const TransactionItem = ({
|
|||
|
||||
<div className="flex flex-col items-end gap-1">
|
||||
<span className={`text-sm font-medium ${amountColor}`}>
|
||||
{isDeposit ? '+' : '-'} {formattedAmount} تومان
|
||||
{isDeposit ? '+' : '-'} {formatPriceWithToman(amount)}
|
||||
</span>
|
||||
<span className="text-sm text-gray-500">۱۴۰۳/۰۸/۲۴</span>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
'use client';
|
||||
|
||||
import { formatPriceWithToman } from '@/lib/utils/priceUtils';
|
||||
import { LogOutIcon, PlusIcon } from 'lucide-react'
|
||||
import React from 'react'
|
||||
|
||||
|
|
@ -7,7 +8,7 @@ const WalletBlancCard = () => {
|
|||
return (
|
||||
<div className='w-full min-h-12 rounded-2xl my-6 py-6 px-6 flex flex-col justify-start bg-gradient-to-l from-[#004D4D] to-[#223D5D] shadow-[0_12px_24px_#006A6A40] border border-[#006A6A40]'>
|
||||
<h4 className='text-sm font-medium text-gray-200'>موجودی کیف پول</h4>
|
||||
<h1 className='text-2xl font-bold my-4 text-white'>35000000 تومان</h1>
|
||||
<h1 className='text-2xl font-bold my-4 text-white'>{formatPriceWithToman(35000000)}</h1>
|
||||
|
||||
<div className="flex w-full gap-4">
|
||||
<button className='w-full bg-white h-12 rounded-xl cursor-pointer flex items-center justify-center gap-2'
|
||||
|
|
|
|||
42
src/lib/utils/priceUtils.ts
Normal file
42
src/lib/utils/priceUtils.ts
Normal file
|
|
@ -0,0 +1,42 @@
|
|||
/**
|
||||
* Converts Rial to Toman (divides by 10)
|
||||
*/
|
||||
export const convertRialToToman = (rialAmount: number): number => {
|
||||
return Math.round(rialAmount / 10);
|
||||
};
|
||||
|
||||
/**
|
||||
* Formats number with comma separators (e.g., 3,000,000)
|
||||
*/
|
||||
export const formatNumberWithCommas = (amount: number): string => {
|
||||
return amount.toLocaleString('fa-IR'); // for Persian digits
|
||||
// Or for English digits: return amount.toLocaleString('en-US');
|
||||
};
|
||||
|
||||
/**
|
||||
* Main function: receives amount in Rial or Toman, returns formatted with comma separators and "Toman" label
|
||||
*
|
||||
* @param amount - input amount (in Rial or Toman)
|
||||
* @param inputIsRial - whether the input amount is in Rial (default: true)
|
||||
* @returns string - formatted amount with Toman label (e.g., "۳,۰۰۰,۰۰۰ تومان")
|
||||
*/
|
||||
export const formatPriceWithToman = (
|
||||
amount: number,
|
||||
inputIsRial: boolean = true
|
||||
): string => {
|
||||
// If amount is in Rial, convert to Toman first
|
||||
const tomanAmount = inputIsRial ? convertRialToToman(amount) : amount;
|
||||
|
||||
// Add comma separators
|
||||
const formatted = formatNumberWithCommas(tomanAmount);
|
||||
|
||||
// Return with Toman label
|
||||
return `${formatted} تومان`;
|
||||
};
|
||||
|
||||
/**
|
||||
* Simpler version: just take an amount in Toman and format it
|
||||
*/
|
||||
export const formatTomanPrice = (tomanAmount: number): string => {
|
||||
return `${formatNumberWithCommas(tomanAmount)} تومان`;
|
||||
};
|
||||
Loading…
Add table
Reference in a new issue