ywb
134 lines
3.7 KiB
JavaScript
134 lines
3.7 KiB
JavaScript
const { createApp } = Vue
|
|
const API = ''
|
|
|
|
createApp({
|
|
delimiters: ['[[', ']]'],
|
|
|
|
data() {
|
|
return {
|
|
missionState: 'idle',
|
|
progress: 0,
|
|
tasks: [],
|
|
report: null,
|
|
agvPreviewUrl: API + '/api/camera/preview',
|
|
armPreviewUrl: API + '/api/camera/arm_refresh',
|
|
polling: null,
|
|
logs: [],
|
|
showQrModal: false,
|
|
qrValue: '',
|
|
}
|
|
},
|
|
computed: {
|
|
missionStateText() {
|
|
const map = {
|
|
idle: '空闲',
|
|
running: '任务运行中',
|
|
paused: '已暂停',
|
|
completed: '已完成',
|
|
waiting_qr: '等待输入二维码'
|
|
}
|
|
return map[this.missionState] || '未知'
|
|
},
|
|
},
|
|
mounted() {
|
|
this.poll()
|
|
},
|
|
beforeUnmount() {
|
|
if (this.polling) clearInterval(this.polling)
|
|
},
|
|
methods: {
|
|
poll() {
|
|
this.refresh()
|
|
this.pollLogs()
|
|
this.polling = setInterval(() => {
|
|
this.refresh()
|
|
this.pollLogs()
|
|
}, 2000)
|
|
},
|
|
async refresh() {
|
|
try {
|
|
const res = await fetch(API + '/api/mission/state')
|
|
const data = await res.json()
|
|
this.missionState = data.status || 'idle'
|
|
this.progress = data.progress || 0
|
|
if (data.tasks) this.tasks = data.tasks
|
|
|
|
// QR 弹窗
|
|
if (this.missionState === 'waiting_qr' && !this.showQrModal) {
|
|
this.showQrModal = true
|
|
this.qrValue = ''
|
|
}
|
|
|
|
// 完成后获取报告
|
|
if (this.missionState === 'idle' && this.tasks.length > 0) {
|
|
const reportRes = await fetch(API + '/api/mission/report')
|
|
const reportData = await reportRes.json()
|
|
this.report = reportData.report
|
|
}
|
|
} catch (e) {}
|
|
},
|
|
async pollLogs() {
|
|
if (this.missionState !== 'running' && this.missionState !== 'waiting_qr') return
|
|
try {
|
|
const res = await fetch(API + '/api/mission/log')
|
|
const data = await res.json()
|
|
if (data.log) this.logs = data.log
|
|
if (data.progress != null) this.progress = data.progress
|
|
if (data.tasks) this.tasks = data.tasks
|
|
// 自动滚到底
|
|
this.$nextTick(() => {
|
|
const box = this.$refs.logBox
|
|
if (box) box.scrollTop = box.scrollHeight
|
|
})
|
|
} catch (e) {}
|
|
},
|
|
async startMission() {
|
|
if (this.missionState !== 'idle') return
|
|
this.logs = []
|
|
this.progress = 0
|
|
this.report = null
|
|
this.showQrModal = false
|
|
await fetch(API + '/api/mission/start', { method: 'POST' })
|
|
this.missionState = 'running'
|
|
},
|
|
async pauseMission() {
|
|
await fetch(API + '/api/mission/pause', { method: 'POST' })
|
|
this.missionState = 'paused'
|
|
},
|
|
async resumeMission() {
|
|
await fetch(API + '/api/mission/resume', { method: 'POST' })
|
|
this.missionState = 'running'
|
|
this.showQrModal = false
|
|
},
|
|
async stopMission() {
|
|
await fetch(API + '/api/mission/stop', { method: 'POST' })
|
|
this.missionState = 'idle'
|
|
this.showQrModal = false
|
|
},
|
|
async submitQr() {
|
|
const val = this.qrValue.trim()
|
|
await fetch(API + '/api/mission/manual-qr', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ qr: val || ' ' })
|
|
})
|
|
this.showQrModal = false
|
|
this.qrValue = ''
|
|
},
|
|
cancelQr() {
|
|
this.showQrModal = false
|
|
this.qrValue = ''
|
|
fetch(API + '/api/mission/manual-qr', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ qr: 'SKIP' })
|
|
})
|
|
},
|
|
onAgvPreviewError(e) {
|
|
e.target.style.display = 'none'
|
|
},
|
|
onArmPreviewError(e) {
|
|
e.target.style.display = 'none'
|
|
}
|
|
}
|
|
}).mount('#app') |