Merge pull request #615 from AAEE86/main

feat: 健康监控仪表盘与关联下钻优化，完善使用记录展示

frontend/src/features/usage/components/UsageRecordsTable.vue

@@ -338,7 +338,22 @@
           </template>
         </div>
 
-        <!-- 第三行：性能指标 -->
+        <!-- 第三行：用户 + 提供商 -->
+        <div
+          v-if="isAdmin"
+          class="mt-1 flex min-w-0 items-center gap-1.5 text-[10px] leading-3.5 text-muted-foreground"
+        >
+          <span
+            class="min-w-0 truncate"
+            :title="formatRecordUserProviderLine(record)"
+          >
+            {{ formatRecordUserSegment(record) }}
+          </span>
+          <span class="shrink-0 text-muted-foreground/40">·</span>
+          <span class="min-w-0 truncate">{{ formatRecordProviderSegment(record) }}</span>
+        </div>
+
+        <!-- 第四行：性能指标 -->
         <div class="mt-1.5 flex min-w-0 flex-wrap items-center gap-x-1.5 gap-y-1 text-[10px] leading-3.5 text-muted-foreground">
           <span
             class="min-w-0 truncate whitespace-nowrap tabular-nums text-foreground"
@@ -1389,6 +1404,22 @@ function formatRecordTime(dateStr: string): string {
   return `${hours}:${minutes}:${seconds}`
 }
 
+function getRecordUserName(record: UsageRecord): string {
+  return record.username || record.user_email || (record.user_id ? `User ${record.user_id}` : '已删除用户')
+}
+
+function formatRecordUserProviderLine(record: UsageRecord): string {
+  return `${formatRecordUserSegment(record)} · ${formatRecordProviderSegment(record)}`
+}
+
+function formatRecordUserSegment(record: UsageRecord): string {
+  return `${getRecordUserName(record)} / ${record.api_key?.name || '-'}`
+}
+
+function formatRecordProviderSegment(record: UsageRecord): string {
+  return `${record.provider || '-'} / ${record.provider_key_name || '-'}`
+}
+
 watch(() => props.filterSearch, (value) => {
   if (value !== localSearch.value) {
     localSearch.value = value