可基本执行任务
This commit is contained in:
+76
-4
@@ -4,7 +4,7 @@
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>运行监控 - AGV 拍摄系统</title>
|
||||
<link rel="stylesheet" href="/static/css/style.css">
|
||||
<link rel="stylesheet" href="/static/css/style.css?v=20260527b">
|
||||
</head>
|
||||
<body>
|
||||
<div id="app">
|
||||
@@ -48,6 +48,46 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 任务步骤控制开关 -->
|
||||
<section class="card">
|
||||
<h2>🎛️ 任务步骤控制</h2>
|
||||
<p class="hint" style="margin-bottom:12px">关闭的步骤将在本次任务中跳过</p>
|
||||
<div class="toggle-grid">
|
||||
<div class="toggle-item">
|
||||
<label class="toggle-switch">
|
||||
<input type="checkbox" v-model="agvMoveEnabled">
|
||||
<span class="toggle-slider"></span>
|
||||
</label>
|
||||
<span class="toggle-label">🚗 AGV移动</span>
|
||||
<span class="toggle-hint">含机械臂初始化,按之字形路线移动到各点位</span>
|
||||
</div>
|
||||
<div class="toggle-item">
|
||||
<label class="toggle-switch">
|
||||
<input type="checkbox" v-model="qrScanEnabled">
|
||||
<span class="toggle-slider"></span>
|
||||
</label>
|
||||
<span class="toggle-label">📷 识别二维码</span>
|
||||
<span class="toggle-hint">调整机械臂姿态扫描二维码</span>
|
||||
</div>
|
||||
<div class="toggle-item">
|
||||
<label class="toggle-switch">
|
||||
<input type="checkbox" v-model="frontPhotoEnabled">
|
||||
<span class="toggle-slider"></span>
|
||||
</label>
|
||||
<span class="toggle-label">📸 拍正面照</span>
|
||||
<span class="toggle-hint">按机型正面姿态拍照</span>
|
||||
</div>
|
||||
<div class="toggle-item">
|
||||
<label class="toggle-switch">
|
||||
<input type="checkbox" v-model="backPhotoEnabled">
|
||||
<span class="toggle-slider"></span>
|
||||
</label>
|
||||
<span class="toggle-label">📸 拍背面照</span>
|
||||
<span class="toggle-hint">按机型背面姿态拍照</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 任务清单 -->
|
||||
<section class="card" v-if="tasks.length > 0">
|
||||
<h2>📋 任务清单 ([[ tasks.length ]] 台机器)</h2>
|
||||
@@ -85,8 +125,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>
|
||||
|
||||
@@ -113,10 +160,35 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 错误弹窗 -->
|
||||
<div class="modal-overlay" v-if="waitingError">
|
||||
<div class="modal">
|
||||
<h3>⚠️ 执行错误</h3>
|
||||
<p>[[ errorMsg ]]</p>
|
||||
<div class="modal-actions">
|
||||
<button class="btn btn-warning" @click="skipError">跳过</button>
|
||||
<button class="btn btn-error" @click="abortError">中断</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 步骤确认弹窗 -->
|
||||
<div class="modal-overlay" v-if="waitingStep">
|
||||
<div class="modal">
|
||||
<h3>🦶 单步执行确认</h3>
|
||||
<p>机器 [[ stepLabel ]] 执行完成,请确认结果是否正确:</p>
|
||||
<div class="modal-actions">
|
||||
<button class="btn btn-success" @click="confirmStep">✅ 正确,继续</button>
|
||||
<button class="btn btn-warning" @click="retryStep">🔄 不正确,重试</button>
|
||||
<button class="btn btn-error" @click="abortStep">⏹️ 中断</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
</div>
|
||||
|
||||
<script src="/static/js/vue3.global.prod.js"></script>
|
||||
<script src="/static/js/running.js"></script>
|
||||
<script src="/static/js/running.js?v=20260527b"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user