From 2114880e479d31a09bbd90212f83ff3e42548fed Mon Sep 17 00:00:00 2001
From: "DESKTOP-72TV0V4\\caoxiaozhu" <leocaoxiaozhu@163.com>
Date: Sat, 21 Mar 2026 11:46:29 +0800
Subject: [PATCH] fix: add 4-column grid for conversations and ensure chart
 visibility

---
 frontend/src/views/StatsView.vue | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/frontend/src/views/StatsView.vue b/frontend/src/views/StatsView.vue
index e6685b3..2960b38 100644
--- a/frontend/src/views/StatsView.vue
+++ b/frontend/src/views/StatsView.vue
@@ -137,7 +137,7 @@ const hourlyActivityData = computed(() =>
       <!-- CONVERSATIONS -->
       <section class="stats-section">
         <SectionHeader title="沟通系统" tag="cyan" />
-        <div class="stats-metrics-row">
+        <div class="stats-metrics-grid-4">
           <div class="stat-bar-item">
             <div class="stat-bar-label">对话数</div>
             <div class="stat-bar-value">{{ formatNumber(conversationStats?.totals?.conversations || 0) }}</div>
@@ -330,6 +330,12 @@ const hourlyActivityData = computed(() =>
   gap: 16px;
 }
 
+.stats-metrics-grid-4 {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 16px;
+}
+
 .stat-bar-item {
   background: var(--bg-card);
   border: 1px solid var(--border-dim);
@@ -356,6 +362,7 @@ const hourlyActivityData = computed(() =>
 
 .stat-bar-chart {
   margin-top: 8px;
+  min-height: 30px;
 }
 
 .stats-section {