diff --git a/src/pages/Home/Home.css b/src/pages/Home/Home.css index b681990..52bc7c9 100644 --- a/src/pages/Home/Home.css +++ b/src/pages/Home/Home.css @@ -323,6 +323,16 @@ border: 1px solid rgba(255, 255, 255, 0.2); } +/* 金额单位后缀样式 (万/亿) */ +.card-value-suffix { + font-size: 1.5rem; + font-weight: 600; + margin-left: 4px; + opacity: 0.9; + align-self: flex-end; + padding-bottom: 4px; +} + /* Secondary Cards */ .assets-card, .liabilities-card { diff --git a/src/pages/Home/Home.tsx b/src/pages/Home/Home.tsx index 07697a6..44170df 100644 --- a/src/pages/Home/Home.tsx +++ b/src/pages/Home/Home.tsx @@ -166,13 +166,47 @@ function Home() { const totalLiabilities = calculateTotalLiabilities(accounts); const netWorth = totalAssets - totalLiabilities; + // 标准金额格式化(带完整小数) const formatCurrency = (amount: number): string => { return new Intl.NumberFormat('zh-CN', { style: 'currency', currency: 'CNY', + minimumFractionDigits: 0, + maximumFractionDigits: amount % 1 === 0 ? 0 : 2, // 整数不显示小数 }).format(amount); }; + // 大数字简洁显示(用于净资产等主要展示) + const formatLargeNumber = (amount: number): { value: string; suffix: string } => { + const absAmount = Math.abs(amount); + const sign = amount < 0 ? '-' : ''; + + if (absAmount >= 100000000) { + // 亿 + const value = absAmount / 100000000; + return { + value: sign + value.toLocaleString('zh-CN', { maximumFractionDigits: 2 }), + suffix: '亿' + }; + } else if (absAmount >= 10000) { + // 万 + const value = absAmount / 10000; + return { + value: sign + value.toLocaleString('zh-CN', { maximumFractionDigits: 2 }), + suffix: '万' + }; + } else { + // 直接显示 + return { + value: sign + absAmount.toLocaleString('zh-CN', { + minimumFractionDigits: 0, + maximumFractionDigits: absAmount % 1 === 0 ? 0 : 2 + }), + suffix: '' + }; + } + }; + // Lock body scroll when modal is open useEffect(() => { if (showAccountForm) { @@ -367,9 +401,14 @@ function Home() {