hailin
/
rwadurian
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(admin-web): 仪表板预种统计改为方块卡片样式 

- 预种待合并/已合并从深色条形卡片改为与认种统计一致的 StatCard
- 统计网格从 4 列调整为 3 列（3+3 布局更工整）
- 骨架屏占位从 4 个调整为 6 个

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
hailin 2026-03-02 05:24:00 -08:00
parent 19753a8639
commit 1bfeece109
2 changed files with 16 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/admin-web/src/app/(dashboard)/dashboard/dashboard.module.scss
View File

@ -8,7 +8,7 @@
&__stats {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-template-columns: repeat(3, 1fr);
gap: $spacing-lg;
@include respond-below(xl) {

46
frontend/admin-web/src/app/(dashboard)/dashboard/page.tsx
View File

@ -137,6 +137,20 @@ export default function DashboardPage() {
change: { value: 0, trend: 'up' as const },
color: '#8b5cf6',
},
{
title: '预种待合并',
value: prePlantingStats?.pendingMergePortions ?? 0,
suffix: '份',
change: { value: 0, trend: 'up' as const },
color: '#ef4444',
},
{
title: '预种已合并',
value: prePlantingStats?.totalTreesMerged ?? 0,
suffix: '棵',
change: { value: 0, trend: 'up' as const },
color: '#06b6d4',
},
] : [];
const headerActions = (
@ -165,7 +179,7 @@ export default function DashboardPage() {
{statsLoading ? (
// 加载状态显示骨架屏
<>
{[1, 2, 3, 4].map((i) => (
{[1, 2, 3, 4, 5, 6].map((i) => (
<StatCardSkeleton key={i} />
))}
</>
@ -226,36 +240,6 @@ export default function DashboardPage() {
</div>
</div>
{/* 预种统计区域 */}
<div className={styles.dashboard__walletBalance}>
<div className={styles.dashboard__walletCard}>
<div className={styles.dashboard__walletLabel}>预种待合并</div>
<div className={styles.dashboard__walletValue}>
{prePlantingStatsLoading ? (
<span className={styles.dashboard__walletLoading}>加载中...</span>
) : (
<span className={styles.dashboard__walletAmount}>
{(prePlantingStats?.pendingMergePortions ?? 0).toLocaleString()}
<span style={{ fontSize: '0.5em', marginLeft: 4, opacity: 0.7 }}>份</span>
</span>
)}
</div>
</div>
<div className={styles.dashboard__walletCard}>
<div className={styles.dashboard__walletLabel}>预种已合并</div>
<div className={styles.dashboard__walletValue}>
{prePlantingStatsLoading ? (
<span className={styles.dashboard__walletLoading}>加载中...</span>
) : (
<span className={styles.dashboard__walletAmount}>
{(prePlantingStats?.totalTreesMerged ?? 0).toLocaleString()}
<span style={{ fontSize: '0.5em', marginLeft: 4, opacity: 0.7 }}>棵</span>
</span>
)}
</div>
</div>
</div>
{/* 图表区 - [2026-01-06] 使用 planting-service 数据 */}
<div className={styles.dashboard__charts}>
<div className={styles.dashboard__mainChart}>