From aca1e58f536b17b26fa949b184b4fa7d13408c20 Mon Sep 17 00:00:00 2001
From: john <cynell@139.com>
Date: Fri, 31 Jul 2026 17:30:14 +0800
Subject: [PATCH] fix(billing): show user balance and correct all-records
 summary scope

When the usage overview has no date filter, show only all-time totals instead
of a misleading 30-day range block; surface current balance in user analysis.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 src/admin/pages/BillingPage.tsx | 20 ++++++++++++++------
 src/index.css                   | 23 +++++++++++++++++++++++
 2 files changed, 37 insertions(+), 6 deletions(-)

diff --git a/src/admin/pages/BillingPage.tsx b/src/admin/pages/BillingPage.tsx
index 960b5c0..41797af 100644
--- a/src/admin/pages/BillingPage.tsx
+++ b/src/admin/pages/BillingPage.tsx
@@ -432,11 +432,9 @@ function UsageOverviewPanel() {
     setLoadingSummary(true);
     setError(null);
     try {
-      const chartRange = start && end
-        ? { startDate: start, endDate: end }
-        : presetDateRange(30);
-      const { startAt, endAt } = dateRangeToUnix(chartRange.startDate, chartRange.endDate);
-      const data = await getAdminUsageSummary({ startAt, endAt });
+      const data = start && end
+        ? await getAdminUsageSummary(dateRangeToUnix(start, end))
+        : await getAdminUsageSummary();
       setSummary(data);
     } catch (err) {
       setError(err instanceof Error ? err.message : '汇总加载失败');
@@ -476,7 +474,7 @@ function UsageOverviewPanel() {
 
   const rangeSummaryLabel = hasDateFilter
     ? `区间汇总（${startDate} 至 ${endDate}）`
-    : '区间汇总（近 30 天）';
+    : '';
 
   return (
     <>
@@ -690,6 +688,16 @@ function UsageQueryPanel() {
         <p className="muted billing-empty">请选择用户，将自动加载用量与趋势图</p>
       )}
       {userId && loading && !result && !stats && <p className="muted">加载中…</p>}
+      {userId && selectedUser && (
+        <div className="usage-user-balance-bar">
+          <span className="usage-user-balance-name">
+            {selectedUser.displayName}
+            <span className="muted"> @{selectedUser.username}</span>
+          </span>
+          <span className="usage-user-balance-label muted">当前余额</span>
+          <span className="usage-user-balance-value">¥{formatYuan(selectedUser.balanceCents)}</span>
+        </div>
+      )}
       {userId && (
         <UsageSummaryPanel
           summary={summary}
diff --git a/src/index.css b/src/index.css
index 55fbe30..f7d20e3 100644
--- a/src/index.css
+++ b/src/index.css
@@ -2135,6 +2135,29 @@ body,
   margin-bottom: 16px;
 }
 
+.usage-user-balance-bar {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: baseline;
+  gap: 8px 16px;
+  margin-bottom: 16px;
+  padding: 12px 16px;
+  border: 1px solid var(--color-border-subtle);
+  border-radius: var(--radius-md);
+  background: var(--color-bg-subtle);
+}
+
+.usage-user-balance-name {
+  font-weight: 600;
+  margin-right: auto;
+}
+
+.usage-user-balance-value {
+  font-size: 20px;
+  font-weight: 600;
+  font-variant-numeric: tabular-nums;
+}
+
 .usage-summary-panel {
   display: flex;
   flex-direction: column;