Vue中监听USB扫码枪触发操作
/ docNum 查询单据号对应的审批信息并弹出,如果没有找到信息或者单号不符合规则 则不弹出。//console.log('触发时间', lastScanTime,now);console.log('扫描到的内容是:', scanContent);// 如果最后更新时间与上次时间一致则说明没有再此更新。console.log('扫描到的内容是:', docNum);// 查询单号在不在代办任务中
需求:用户需要扫二维码触发自动打开单据审核页面。
实现思路:
1.二维码内容由单据单号生成
2.USB扫码枪扫码输入时其实是模拟键盘快速输入 ,监听键盘输入
3.对内容进行拼接, 按实际触发间隔来拼接
代码如下
var scanContent = '';
var lastScanTime = Date.now();
var submitInterval = 200;
var cutomFunc=null;
function keydownTask(event) {
// 扫描事件正在进行中
const now = Date.now();
const interval = now - lastScanTime;
if( interval > submitInterval){
scanContent = '';
}
lastScanTime = Date.now();
if (event.keyCode >= 65) {
// 强制切换到英文输入法
// event.preventDefault();
// event.stopPropagation();
// document.activeElement.blur();
}
if (event.keyCode === 13) {
// 扫描事件已经结束
console.log('扫描到的内容是:', scanContent);
scanContent = '';
} else {
// 正常的键盘输入
scanContent += event.key;
setTimeout(() => {
// 如果最后更新时间与上次时间一致则说明没有再此更新
//let now = Date.now();
let interval =now - lastScanTime;
//console.log('触发时间', lastScanTime,now);
if( lastScanTime == now){
if(scanContent!=''){
// 提交内容
showTaskFlow(scanContent);
}
}
}, 200);
}
lastScanTime = now;
}
function showTaskFlow(docNum){
// Notification.info({
// duration: '4000',
// position: 'bottom-right',
// title: 'ToDoList',
// dangerouslyUseHTMLString: true,
// message: `打开任务 ${docNum}`
// });
// docNum 查询单据号对应的审批信息并弹出,如果没有找到信息或者单号不符合规则 则不弹出
// 查询单号在不在代办任务中,不在则提示没有权限
console.log('扫描到的内容是:', docNum);
if(cutomFunc){
cutomFunc(docNum);
}
}
/**
* 添加触发
*/
function addScanTrigger(func) {
cutomFunc = func;
window.addEventListener('keydown', keydownTask);
}
/**
* 移除触发
*/
function removeScanTrigger() {
window.removeEventListener('keydown', keydownTask);
}
更多推荐
所有评论(0)