feat: 新增首页,提供账户概览、交易趋势、快速记账、AI记账和贡献图等功能。

This commit is contained in:
2026-01-28 16:36:47 +08:00
parent d122d11ad5
commit 40ef947d53
2 changed files with 51 additions and 2 deletions

View File

@@ -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() {
<div className="dashboard-card home-net-worth-card">
<div className="card-content">
<span className="card-label"></span>
<div className="card-value-group">
<div className="card-value-group" title={`¥${netWorth.toLocaleString('zh-CN', { minimumFractionDigits: 2 })}`}>
<span className="currency-symbol">¥</span>
<span className="card-value-main privacy-mask">{formatCurrency(netWorth).replace(/[^0-9.,-]/g, '')}</span>
<span className="card-value-main privacy-mask">
{formatLargeNumber(netWorth).value}
</span>
{formatLargeNumber(netWorth).suffix && (
<span className="card-value-suffix">{formatLargeNumber(netWorth).suffix}</span>
)}
</div>
<div className="card-footer">
<span className="trend-neutral"></span>