feat(ops): 恢复仪表盘脉搏动画效果

- 将静态QPS历史折线图替换为动画脉搏线
- 使用SVG animate元素实现心跳效果（2秒循环动画）
- 增强流量可视化：通过脉冲跳动直观展示流量"活跃"状态
- 恢复重构前的视觉效果与用户体验

frontend/src/views/admin/ops/components/OpsDashboardHeader.vue

@@ -228,12 +228,14 @@ const durationP95Ms = computed(() => overview.value?.duration?.p95_ms ?? null)
 const durationP90Ms = computed(() => overview.value?.duration?.p90_ms ?? null)
 const durationP50Ms = computed(() => overview.value?.duration?.p50_ms ?? null)
 const durationAvgMs = computed(() => overview.value?.duration?.avg_ms ?? null)
+const durationMaxMs = computed(() => overview.value?.duration?.max_ms ?? null)
 
 const ttftP99Ms = computed(() => overview.value?.ttft?.p99_ms ?? null)
 const ttftP95Ms = computed(() => overview.value?.ttft?.p95_ms ?? null)
 const ttftP90Ms = computed(() => overview.value?.ttft?.p90_ms ?? null)
 const ttftP50Ms = computed(() => overview.value?.ttft?.p50_ms ?? null)
 const ttftAvgMs = computed(() => overview.value?.ttft?.avg_ms ?? null)
+const ttftMaxMs = computed(() => overview.value?.ttft?.max_ms ?? null)
 
 // --- WebSocket status ---
 
@@ -883,24 +885,37 @@ function openJobsDetails() {
                 </div>
               </div>
 
-              <!-- Average QPS/TPS -->
+              <!-- Average QPS/TPS with Animated Pulse Line -->
               <div class="col-span-2">
-                <!-- Sparkline -->
-                <svg v-if="qpsHistory.length > 1" class="mb-2 h-8 w-full" viewBox="0 0 200 32" preserveAspectRatio="none">
-                  <polyline
-                    :points="qpsHistory.map((v, i) => `${(i / (qpsHistory.length - 1)) * 200},${32 - (v / Math.max(...qpsHistory, 1)) * 28}`).join(' ')"
-                    fill="none"
-                    stroke="currentColor"
-                    stroke-width="2"
-                    class="text-blue-500"
-                  />
-                </svg>
                 <div class="text-[10px] font-bold uppercase text-gray-400">{{ t('admin.ops.average') }}</div>
                 <div class="mt-1 flex items-center gap-4 text-sm font-medium text-gray-600 dark:text-gray-400">
                   <span>QPS: <span class="font-bold">{{ qpsAvgLabel }}</span></span>
                   <span class="h-1 w-1 rounded-full bg-gray-300 dark:bg-gray-600"></span>
                   <span>TPS: <span class="font-bold">{{ tpsAvgLabel }}</span></span>
                 </div>
+
+                <!-- Animated Pulse Line (Heart Beat Animation) -->
+                <div class="mt-2 h-8 w-full overflow-hidden opacity-50">
+                  <svg class="h-full w-full" viewBox="0 0 280 32" preserveAspectRatio="none">
+                    <path
+                      d="M0 16 Q 20 16, 40 16 T 80 16 T 120 10 T 160 22 T 200 16 T 240 16 T 280 16"
+                      fill="none"
+                      stroke="#3b82f6"
+                      stroke-width="2"
+                      vector-effect="non-scaling-stroke"
+                    >
+                      <animate
+                        attributeName="d"
+                        dur="2s"
+                        repeatCount="indefinite"
+                        values="M0 16 Q 20 16, 40 16 T 80 16 T 120 10 T 160 22 T 200 16 T 240 16 T 280 16;
+                                M0 16 Q 20 16, 40 16 T 80 16 T 120 16 T 160 16 T 200 10 T 240 22 T 280 16;
+                                M0 16 Q 20 16, 40 16 T 80 16 T 120 16 T 160 16 T 200 16 T 240 16 T 280 16"
+                        keyTimes="0;0.5;1"
+                      />
+                    </path>
+                  </svg>
+                </div>
               </div>
             </div>
           </div>