diff --git a/frontend/src/types/index.ts b/frontend/src/types/index.ts
index 715b7e4e..715c36d2 100644
--- a/frontend/src/types/index.ts
+++ b/frontend/src/types/index.ts
@@ -541,7 +541,7 @@ export interface ModelStat {
 export interface UserUsageTrendPoint {
   date: string;
   user_id: number;
-  username: string;
+  email: string;
   requests: number;
   tokens: number;
   cost: number;        // 标准计费
diff --git a/frontend/src/views/admin/DashboardView.vue b/frontend/src/views/admin/DashboardView.vue
index 2985a9f4..29b2f6b1 100644
--- a/frontend/src/views/admin/DashboardView.vue
+++ b/frontend/src/views/admin/DashboardView.vue
@@ -462,13 +462,21 @@ const trendChartData = computed(() => {
 const userTrendChartData = computed(() => {
   if (!userTrend.value?.length) return null
 
+  // Extract display name from email (part before @)
+  const getDisplayName = (email: string, userId: number): string => {
+    if (email && email.includes('@')) {
+      return email.split('@')[0]
+    }
+    return `User #${userId}`
+  }
+
   // Group by user
   const userGroups = new Map<string, { name: string; data: Map<string, number> }>()
   const allDates = new Set<string>()
 
   userTrend.value.forEach(point => {
     allDates.add(point.date)
-    const key = point.username || `User #${point.user_id}`
+    const key = getDisplayName(point.email, point.user_id)
     if (!userGroups.has(key)) {
       userGroups.set(key, { name: key, data: new Map() })
     }