南骏 池
2025-05-22 b1c0e9fea7c074aa823e45fa2dc50455e8f8106c
H5/Js/Config.js
@@ -3,17 +3,48 @@
    data: function () {
        return {
            isLoading: false,
            textInput:''
            textInput: '',
            scanWorkstation: '', // 新增:扫描工位绑定字段
            html5QrCode: null    // 新增:扫码器实例
        }
    },
    mounted() {
        var that = this;
    },
    methods: {
        sendMessage() {
      sendMessage(obj) {
            var detail = ["! 0 200 200 210 1\r\n" +
                "PAGE - WIDTH 700 \r\n" +
                "BOX 0 0 700 180 2 \r\n" +
                "T 16 0 200 10  条码1" + "\r\n" + // 添加字体名称
                "BARCODE 128 1 1 20 0 80 " + '123456' + "\r\n" +
                "TEXT 7 0 50 80 SIMSUN.GB2312 " + '123456' + "\r\n" + // 添加字体名称
                //"B QR 500 10 M 1 U 9 \r\n" +
                //"MA," + '001' + "\r\n" +
                "B QR 580 15 M 2 U 4" + "\r\n" +
                "MA,QR code ABC123" + "\r\n" +
                "ENDQR\r\n" +
                "FORM\r\n" +
                "PRINT\r\n",
                "! 0 200 200 210 1\r\n" +
                "PAGE - WIDTH 700 \r\n" +
                "BOX 0 0 700 180 2 \r\n" +
                "T 16 0 200 10 条码2" + "\r\n" + // 添加字体名称
                "BARCODE 128 1 1 20 0 80 " + '123456' + "\r\n" +
                "TEXT270 10 0 200 50 10#格式大小测试" + "\r\n" +
                "TEXT 7 0 50 80 SIMSUN.GB2312 " + '123456' + "\r\n" + // 添加字体名称
                "B QR 580 15 M 2 U 4" + "\r\n" +
                "MA,QR code ABC123" + "\r\n" +
                "ENDQR\r\n" +
                "FORM\r\n" +
                "PRINT\r\n" ];
            let sendData = {
                keyType: 'print',
                keyVal: '123',
                Type: 'Bar',
                Barcode: 'TM250304-000104-2',
            Detail: detail,
            Ip: '192.168.38.135',
            Port: '9100',
            }
            console.log('sendMessage 开始1:')
            console.log('sendMessage 开始2:' + JSON.stringify(sendData))
@@ -21,9 +52,112 @@
                data: JSON.stringify(sendData)
            })
        },
        // 修改sendScan方法为实际扫码功能
        sendScan() {
            var that = this;
            that.$toast.fail("暂时不能使用!");
            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');
        },
        startScan() {
            const qrScanner = new Html5Qrcode("qr-reader");
            const config = {
                fps: 10,
                qrbox: 250
            };
            qrScanner.start(
                { facingMode: "environment" },
                config,
                (decodedText) => {
                    // 扫码成功处理
                    this.scanWorkstation = decodedText;
                    qrScanner.stop();
                    document.getElementById('qr-reader').style.display = 'none';
                },
                (errorMessage) => {
                    // 错误处理
                    console.error(errorMessage);
                }
            ).catch(err => {
                alert('无法启动摄像头: ' + err);
            });
            // 显示扫码容器
            document.getElementById('qr-reader').style.display = 'block';
        }
    }
})
})