优化物料编码无需点击

This commit is contained in:
zc
2026-03-19 11:30:10 +08:00
parent 7b57bb9b05
commit c4303b4d5f

View File

@@ -57,8 +57,9 @@
<div class="form-item">
<a-form-item label="物料编码">
<a-input
ref="materialCodeInput"
v-model="formData.inputMaterialCode"
placeholder="请点击此处确保光标闪烁,使用扫码枪扫描物料编码"
placeholder="请点击此处确保光标闪烁,且输入法为英文状态,使用扫码枪扫描物料编码"
@keydown="handleKeyDown"
@input="handleMaterialCodeChange"
/>
@@ -73,7 +74,7 @@
<div class="camera-section">
<!-- 图片展示 -->
<div class="image-placeholder square-image">
<img
<img
:src="imgData.imgUrl"
alt="图片展示"
style="width: 100%; height: 100%; object-fit: cover; border-radius: 4px;"
@@ -309,6 +310,8 @@ const cameraStatus = ref<'connected' | 'connecting' | 'disconnected' | 'error'>(
// 视频元素引用
const cameraVideo = ref<HTMLVideoElement | null>(null)
// 物料编码输入框引用
const materialCodeInput = ref<any>(null)
// FLV播放器实例
let player: any = null
@@ -546,12 +549,19 @@ let imageRefreshTimer: any = null
// 组件挂载时
onMounted(async () => {
await loadFlvJs()
// 启动图片自动刷新,每秒更新一次
imageRefreshTimer = setInterval(() => {
// 添加时间戳参数,避免浏览器缓存
imgData.imgUrl = `${imgData.baseUrl}?t=${Date.now()}`
}, 1000)
// 页面加载后自动聚焦到物料编码输入框
nextTick(() => {
if (materialCodeInput.value) {
materialCodeInput.value.focus()
}
})
})
// 组件卸载时
@@ -714,7 +724,7 @@ const handleKeyDown = (event: KeyboardEvent) => {
isScanning = true
// }
}
// 更新上次输入时间
lastInputTime = currentTime
}
@@ -872,6 +882,13 @@ const handleBackToFirst = () => {
// 离开称重页面时关闭WebSocket连接
closeWebSocket()
// 回到第一步后自动聚焦到物料编码输入框
nextTick(() => {
if (materialCodeInput.value) {
materialCodeInput.value.focus()
}
})
}
// 计算重量