67 lines
2.1 KiB
TypeScript
67 lines
2.1 KiB
TypeScript
|
/**
|
||
|
|
* @file features/dashboard/utils/dashboard-format.ts
|
||
|
|
* @description 대시보드 숫자/색상 표현 유틸
|
||
|
|
*/
|
||
|
|
|
||
|
|
const KRW_FORMATTER = new Intl.NumberFormat("ko-KR");
|
||
|
|
const PERCENT_FORMATTER = new Intl.NumberFormat("ko-KR", {
|
||
|
|
minimumFractionDigits: 2,
|
||
|
|
maximumFractionDigits: 2,
|
||
|
|
});
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 원화 금액을 포맷합니다.
|
||
|
|
* @param value 숫자 값
|
||
|
|
* @returns 쉼표 포맷 문자열
|
||
|
|
* @see features/dashboard/components/StatusHeader.tsx 자산/손익 금액 표시
|
||
|
|
*/
|
||
|
|
export function formatCurrency(value: number) {
|
||
|
|
return KRW_FORMATTER.format(value);
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 퍼센트 값을 포맷합니다.
|
||
|
|
* @param value 숫자 값
|
||
|
|
* @returns 소수점 2자리 퍼센트 문자열
|
||
|
|
* @see features/dashboard/components/StatusHeader.tsx 수익률 표시
|
||
|
|
*/
|
||
|
|
export function formatPercent(value: number) {
|
||
|
|
return `${PERCENT_FORMATTER.format(value)}%`;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 값의 부호를 포함한 금액 문자열을 만듭니다.
|
||
|
|
* @param value 숫자 값
|
||
|
|
* @returns + 또는 - 부호가 포함된 금액 문자열
|
||
|
|
* @see features/dashboard/components/MarketSummary.tsx 전일 대비 수치 표시
|
||
|
|
*/
|
||
|
|
export function formatSignedCurrency(value: number) {
|
||
|
|
if (value > 0) return `+${formatCurrency(value)}`;
|
||
|
|
if (value < 0) return `-${formatCurrency(Math.abs(value))}`;
|
||
|
|
return "0";
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 값의 부호를 포함한 퍼센트 문자열을 만듭니다.
|
||
|
|
* @param value 숫자 값
|
||
|
|
* @returns + 또는 - 부호가 포함된 퍼센트 문자열
|
||
|
|
* @see features/dashboard/components/MarketSummary.tsx 전일 대비율 표시
|
||
|
|
*/
|
||
|
|
export function formatSignedPercent(value: number) {
|
||
|
|
if (value > 0) return `+${formatPercent(value)}`;
|
||
|
|
if (value < 0) return `-${formatPercent(Math.abs(value))}`;
|
||
|
|
return "0.00%";
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* 숫자 값의 상승/하락/보합 텍스트 색상을 반환합니다.
|
||
|
|
* @param value 숫자 값
|
||
|
|
* @returns Tailwind 텍스트 클래스
|
||
|
|
* @see features/dashboard/components/HoldingsList.tsx 수익률/손익 색상 적용
|
||
|
|
*/
|
||
|
|
export function getChangeToneClass(value: number) {
|
||
|
|
if (value > 0) return "text-red-600 dark:text-red-400";
|
||
|
|
if (value < 0) return "text-blue-600 dark:text-blue-400";
|
||
|
|
return "text-muted-foreground";
|
||
|
|
}
|