优化动画

src/views/Dashboard.vue

@@ -21,10 +21,6 @@ const statusDuration = ref('0s')
 const connectSince = ref<number | null>(null)
 const connectDuration = ref('')
 
-const deviceName = ref('')
-const deviceWifi = ref('')
-const deviceMqtt = ref('')
-
 let clockTimer: ReturnType<typeof setInterval> | null = null
 let durationTimer: ReturnType<typeof setInterval> | null = null
 
@@ -241,7 +237,6 @@ onMounted(() => {
   }, 1000)
   durationTimer = setInterval(updateDurations, 1000)
 
-  fetchDeviceConfig()
   fetchHistory()
 
   if (pieChartRef.value) {
@@ -269,20 +264,6 @@ function handleResize() {
   timelineChart?.resize()
 }
 
-async function fetchDeviceConfig() {
-  try {
-    const res = await http.get('/device/config')
-    const data = res.data
-    if (data.code === 0 && data.data?.length > 0) {
-      const cfg = data.data[0]
-      deviceName.value = cfg.device_name || ''
-      deviceWifi.value = cfg.wifi_ssid || ''
-      deviceMqtt.value = cfg.mqtt_broker || ''
-    }
-  } catch {
-  }
-}
-
 async function fetchHistory() {
   try {
     const res = await getHistory(100)
@@ -360,6 +341,19 @@ async function sendCode(code: string) {
       </div>
     </div>
 
+    <div class="stats-row">
+      <div class="stats-section">
+        <div class="section-title">今日统计</div>
+        <div v-if="todayStats.length === 0" class="stats-empty">暂无数据</div>
+        <div v-else class="stats-grid">
+          <div v-for="item in todayStats" :key="item.code" class="stats-item">
+            <a-tag :color="item.color" size="small">{{ item.label }}</a-tag>
+            <span class="stats-count">{{ item.count }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
     <div class="chart-row">
       <div class="chart-card">
         <div class="section-title">状态分布</div>
@@ -377,38 +371,6 @@ async function sendCode(code: string) {
       </div>
     </div>
 
-    <div class="info-row">
-      <div class="stats-section">
-        <div class="section-title">今日统计</div>
-        <div v-if="todayStats.length === 0" class="stats-empty">暂无数据</div>
-        <div v-else class="stats-grid">
-          <div v-for="item in todayStats" :key="item.code" class="stats-item">
-            <a-tag :color="item.color" size="small">{{ item.label }}</a-tag>
-            <span class="stats-count">{{ item.count }}</span>
-          </div>
-        </div>
-      </div>
-
-      <div class="device-section">
-        <div class="section-title">设备配置</div>
-        <div v-if="!deviceName && !deviceWifi && !deviceMqtt" class="device-empty">未找到设备配置</div>
-        <div v-else class="device-info">
-          <div v-if="deviceName" class="device-row">
-            <span class="device-label">设备</span>
-            <span class="device-value">{{ deviceName }}</span>
-          </div>
-          <div v-if="deviceWifi" class="device-row">
-            <span class="device-label">WiFi</span>
-            <a-tag color="success" size="small">{{ deviceWifi }}</a-tag>
-          </div>
-          <div v-if="deviceMqtt" class="device-row">
-            <span class="device-label">MQTT</span>
-            <a-tag color="processing" size="small">{{ deviceMqtt }}</a-tag>
-          </div>
-        </div>
-      </div>
-    </div>
-
     <div class="log-section">
       <div class="section-title">最近事件</div>
       <div v-if="eventLog.length === 0" class="log-empty">等待事件推送...</div>
@@ -596,7 +558,7 @@ async function sendCode(code: string) {
   pointer-events: none;
 }
 
-.info-row {
+.stats-row {
   display: flex;
   gap: 10px;
 }
@@ -635,45 +597,6 @@ async function sendCode(code: string) {
   font-size: 13px;
 }
 
-.device-section {
-  width: 320px;
-  flex-shrink: 0;
-  padding: 16px 20px;
-  background: var(--card-bg);
-  border: 1px solid var(--border-color);
-  border-radius: 8px;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
-}
-
-.device-info {
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-}
-
-.device-row {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  font-size: 13px;
-}
-
-.device-label {
-  color: var(--text-secondary);
-  width: 40px;
-  flex-shrink: 0;
-}
-
-.device-value {
-  color: var(--text-color);
-  font-weight: 500;
-}
-
-.device-empty {
-  color: var(--text-secondary);
-  font-size: 13px;
-}
-
 .log-section {
   padding: 20px 24px;
   background: var(--card-bg);
@@ -765,14 +688,6 @@ async function sendCode(code: string) {
     flex-direction: column;
   }
 
-  .info-row {
-    flex-direction: column;
-  }
-
-  .device-section {
-    width: 100%;
-  }
-
   .log-section {
     padding: 16px;
     max-height: 240px;