var vm = new Vue({
|
el: '#app',
|
data: function () {
|
return {
|
isLoading: false,
|
textInput: '',
|
scanWorkstation: '', // 新增：扫描工位绑定字段
|
html5QrCode: null // 新增：扫码器实例
|
}
|
},
|
mounted() {
|
var that = this;
|
},
|
methods: {
|
sendMessage(obj) {
|
var detail = ["第一组指令"+
|
"! 0 203 203 480 1\r\n" +
|
"PREFEED 0\n\r" +
|
"POSTFEED 0\n\r" +
|
"PAGE - WIDTH 640\r\n" +
|
|
// 右上角放置一个方型二维码（80*80），扫描后的值为“123456”
|
"BOX 560 10 640 90 2\r\n" + // 绘制二维码的方框
|
"TEXT 570 20 5 \"条码\"\r\n" + // 在方框中上方显示“条码”
|
"QRCODE 570 40 M 4 U 0 \"" + obj.qrcode+"\"\r\n" + // 创建二维码
|
|
// 右下角显示一个条形码，最左在320位置，长度为100，同时这个条形码将其扫描的值显示在条形码下侧，条形码的值为“987654”
|
"BARCODE 320 350 100 50 1 \"987654\"\r\n" + // 显示条形码的位置和大小
|
"TEXT 320 410 5 \"987654\"\r\n" + //
|
"GAP-SENSE\r\n" +
|
"ENDQR\r\n" +
|
"FORM\r\n" +
|
"PRINT\r\n",
|
"第二组指令" + "! 0 400 400 480 1\r\n" +
|
"PREFEED 0\n\r" +
|
"POSTFEED 0\n\r" +
|
"PAGE - WIDTH 640\r\n" +
|
"GAP-SENSE\r\n" +
|
"BOX 5 10 620 450 2\r\n" +
|
"LINE 5 60 620 60 1\r\n" + // 横线1
|
"LINE 5 110 620 110 1\r\n" + // 横线2
|
"LINE 5 160 620 160 1\r\n" + // 横线3
|
"LINE 5 210 620 210 1\r\n" + // 横线4
|
"LINE 5 260 620 260 1\r\n" + // 横线5
|
"LINE 120 10 120 260 1\r\n" + // 字段名称右侧竖线
|
"LINE 240 260 240 450 1\r\n" + // 规格型号左侧竖线
|
"LINE 285 210 285 450 1\r\n" + // 规格型号右侧竖线
|
"LINE 410 210 410 260 1\r\n" + // 到货日期右侧竖线
|
"ENDQR\r\n" +
|
"FORM\r\n" +
|
"PRINT\r\n" ];
|
|
let sendData = {
|
Type: 'Bar',
|
Barcode: 'TM250304-000104-2',
|
Detail: detail,
|
Ip: '192.168.38.25',
|
Port: '9100',
|
}
|
console.log('sendMessage 开始1:')
|
console.log('sendMessage 开始2:' + JSON.stringify(sendData))
|
uni.webView.postMessage({
|
data: JSON.stringify(sendData)
|
})
|
},
|
// 修改sendScan方法为实际扫码功能
|
sendScan() {
|
const that = this;
|
if (!this.html5QrCode) {
|
// 鸿蒙设备需要使用特定设备ID
|
this.html5QrCode = new Html5Qrcode("qr-reader", {
|
experimentalFeatures: {
|
useBarCodeDetectorIfSupported: true
|
},
|
formatsToSupport: [ Html5QrcodeSupportedFormats.QR_CODE ]
|
});
|
}
|
|
const config = {
|
fps: 10,
|
qrbox: 250,
|
// 鸿蒙需要明确指定视频输入设备
|
videoConstraints: {
|
deviceId: 'default' // 使用默认摄像头
|
}
|
};
|
|
// 修改摄像头调用方式
|
this.html5QrCode.start(
|
config,
|
qrCodeMessage => {
|
that.scanWorkstation = qrCodeMessage;
|
that.stopScan();
|
that.$toast.success("扫码成功！");
|
},
|
errorMessage => {
|
console.error("扫码失败:", errorMessage);
|
that.$toast.fail("扫码失败");
|
}
|
).catch(err => {
|
console.error("摄像头错误:", err);
|
// 增加鸿蒙设备错误处理
|
const errMsg = err.message || err.name || '摄像头不可用';
|
that.$toast.fail("无法启动摄像头: " + errMsg);
|
|
// 原生扫码备用方案
|
if(window.plus && plus.barcode){
|
plus.barcode.scan(
|
'qr',
|
(type, result) => {
|
that.scanWorkstation = result;
|
that.$toast.success("扫码成功！");
|
},
|
(error) => {
|
that.$toast.fail("扫码失败: "+error.code);
|
}
|
);
|
}
|
});
|
|
// 显示扫码框（需在ASPX中添加<div id="qr-reader"></div>）
|
document.getElementById('qr-reader').style.display = 'block';
|
},
|
|
// 新增：停止扫码方法
|
stopScan() {
|
if (this.html5QrCode && this.html5QrCode.isScanning) {
|
this.html5QrCode.stop().then(() => {
|
document.getElementById('qr-reader').style.display = 'none';
|
}).catch(err => {
|
console.error("关闭摄像头失败:", err);
|
});
|
}
|
},
|
|
testSuccessSound() {
|
this.$playSound('success');
|
},
|
|
testErrorSound() {
|
this.$playSound('error');
|
}
|
}
|
})
|
