运行显示两个摄像头
This commit is contained in:
@@ -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;
|
||||
}
|
||||
|
||||
@@ -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'
|
||||
}
|
||||
}
|
||||
|
||||
@@ -85,8 +85,15 @@
|
||||
<!-- 实时预览 -->
|
||||
<section class="card">
|
||||
<h2>📷 摄像头预览</h2>
|
||||
<div class="camera-full">
|
||||
<img :src="previewUrl" @error="onPreviewError">
|
||||
<div class="camera-dual">
|
||||
<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>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user