运行显示两个摄像头

agv_app/static/css/style.css

@@ -912,3 +912,11 @@ a:hover { text-decoration: underline; }
   0%, 100% { opacity: 1; }
   50% { opacity: 0.3; }
 }
+
+/* ========== 运行页双摄像头 ========== */
+.camera-dual {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 16px;
+  margin-top: 12px;
+}

agv_app/static/js/running.js

@@ -10,7 +10,8 @@ createApp({
       progress: 0,
       tasks: [],
       report: null,
-      previewUrl: API + '/api/camera/preview',
+      agvPreviewUrl: API + '/api/camera/preview',
+      armPreviewUrl: API + '/api/camera/arm_refresh',
       polling: null,
       logs: [],
       showQrModal: false,
@@ -123,7 +124,10 @@ createApp({
         body: JSON.stringify({ qr: 'SKIP' })
       })
     },
-    onPreviewError(e) {
+    onAgvPreviewError(e) {
+      e.target.style.display = 'none'
+    },
+    onArmPreviewError(e) {
       e.target.style.display = 'none'
     }
   }

agv_app/templates/running.html

@@ -85,8 +85,15 @@
       <!-- 实时预览 -->
       <section class="card">
         <h2>📷 摄像头预览</h2>
-        <div class="camera-full">
+        <div class="camera-dual">
-          <img :src="previewUrl" @error="onPreviewError">
+          <div class="camera-box">
+            <div class="camera-label">🎥 AGV 摄像头</div>
+            <img :src="agvPreviewUrl" @error="onAgvPreviewError" class="camera-img">
+          </div>
+          <div class="camera-box">
+            <div class="camera-label">🦾 机械臂摄像头</div>
+            <img :src="armPreviewUrl" @error="onArmPreviewError" class="camera-img">
+          </div>
         </div>
       </section>