From f3bb7eaae4e153e217d8329ff888ee7675ff3997 Mon Sep 17 00:00:00 2001
From: Mock <mochangkang2022@email.szu.edu.cn>
Date: Thu, 2 Apr 2026 22:48:52 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=89=8D=E7=AB=AF=E6=98=BE=E7=A4=BA?=
 =?UTF-8?q?=E7=9C=9F=E5=AE=9E=E5=8F=91=E9=80=81=E9=A2=91=E7=8E=87=E5=92=8C?=
 =?UTF-8?q?=E6=B8=B2=E6=9F=93=E9=A2=91=E7=8E=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/components/VideoPanel.vue | 33 +++++++++++++++++++-------
 1 file changed, 25 insertions(+), 8 deletions(-)

diff --git a/frontend/src/components/VideoPanel.vue b/frontend/src/components/VideoPanel.vue
index 799e10e..654b53b 100644
--- a/frontend/src/components/VideoPanel.vue
+++ b/frontend/src/components/VideoPanel.vue
@@ -12,17 +12,21 @@ const streamUrl = ref('')
 const canRequestFrames = computed(() => props.video?.available === true)
 const streamFps = computed(() => Math.max(props.video?.fps ?? 0, 30))
 
-const modeLabel = computed(() => {
+const senderProfileLabel = computed(() => {
   if (!props.video) {
-    return '正在获取视频状态'
+    return '发送端 Profile: --'
   }
-  if (props.video.source_mode === 'omnisocket-jpeg-live') {
-    return `${props.video.fps} FPS 实时接收`
+  return `发送端 Profile: ${props.video.fps} FPS`
+})
+
+const displayModeLabel = computed(() => {
+  if (!props.video) {
+    return '前端显示: 等待状态'
   }
-  if (props.video.source_mode === 'omnisocket-waiting') {
-    return '尚未收到实时视频帧'
+  if (!canRequestFrames.value) {
+    return '前端显示: 等待新视频帧'
   }
-  return `${props.video.fps} FPS`
+  return `前端显示: MJPEG Stream (${streamFps.value} FPS 请求)`
 })
 
 const placeholderText = computed(() => {
@@ -77,7 +81,10 @@ watch([streamFps, canRequestFrames], refreshStreamUrl, { immediate: true })
       </div>
       <div class="stat-card">
         <span>当前模式</span>
-        <strong>{{ modeLabel }}</strong>
+        <div class="stat-lines">
+          <strong>{{ senderProfileLabel }}</strong>
+          <strong class="secondary">{{ displayModeLabel }}</strong>
+        </div>
       </div>
     </div>
 
@@ -186,6 +193,16 @@ h2 {
   font-size: 18px;
 }
 
+.stat-lines {
+  display: grid;
+  gap: 6px;
+}
+
+.stat-lines .secondary {
+  font-size: 15px;
+  color: #a8b4ce;
+}
+
 .hint {
   margin: 0;
   color: #8d99b3;