- 引入、注册组件
<view class="prient_box"> <view class="content"> <view class="btn-wrap"> <te-Printer ref="tePrinter" :bufferDataBe="bufferDataBe" @onPrintBeG="onPrintBeG"></te-Printer> </view> </view> </view> import tePrinter from '@/components/btPrinter/btPrinter.vue' components: { tePrinter },
-
传递打印参数给子组件
var str ='CLL\r\n';
str += 'NASC "GB18030"\r\n';
str += 'FT "MHeiGB18030C-Medium" \r\n';
str += 'FONTSIZE 8\r\n';
str += 'FONTSLANT 0\r\n';
str += 'PP50,293:AN7\r\n';
str += 'PP50,290:PT "VIN:"\r\n';
str += 'FONTSIZE 10\r\n';
str += `PP99,293:PT "${PamrsData.vin}" \r\n`;
str += 'FONTSIZE 8\r\n';
str += 'PP50,219:PT "车型:"\r\n';
str += `PP110,219:PT "${PamrsData.modelName}" \r\n`;
str += 'PP300,219:PT "外饰:"\r\n';
str += `PP360,219:PT "${PamrsData.exColorName}" \r\n`;
str += 'PP50,145:PT "目标库位:"\r\n';
str += `PP155,145:PT "${PamrsData.binCode}" \r\n`;
str += 'PP300,145:PT "方向:"\r\n';
// str += `PP355,145:PT "${PamrsData.warehouseCode}" \r\n`;
str += 'PP50,71:PT "打印时间:"\r\n';
str += `PP155,71:PT "${nowtime}"\r\n`;
str += 'PP470,175:BARSET "QRCODE",1,1,6,2,1\r\n';
str += `PB"${PamrsData.vin}" \r\n`;
str += 'PF\r\n';
this.bufferDataBe = str;
3.子组件方法
<template>
<view class="bg_box">
<!-- 默认文字按钮 -->
<view class="kk-printer-btn" @click="handlePrintTap">
{{defaultText}}
</view>
<uni-popup ref="popup" type="bottom" background-color="#fff">
<view class="con_box" v-if="deviceList.length >0 ">
<view class="con_box_title">
<text>已配对蓝牙设备</text>
<text @click="SearchBtlist">
<uni-icons type="refresh" size="18" color="#e1e1e1"></uni-icons>
</text>
</view>
<view class="con_box_item_box" v-for="(device,index) in deviceList" :key="index">
<view class="con_box_item">
<text>设备名称:</text>
<text>{{device.name?device.name:'未命名'}}</text>
</view>
<view class="con_box_item">
<text>设备地址:</text>
<text>{{device.address?device.address:'未命名'}}</text>
</view>
<view class="con_box_item">
<button style="width: 100%;" type="default" plain size="mini"
@click="printSomething(device)">打印标签</button>
</view>
</view>
</view>
<view class="no_con_box" v-else>
<view class="empty-icon"></view>
<view class="empty-text">~ 配对设备为空 ~</view>
<view class="refef">
<uni-icons type="refresh" size="30" @click="SearchBtlist" color="#e1e1e1"></uni-icons>
</view>
</view>
</uni-popup>
</view>
</template>
<script>
export default {
name: "btPrinter",
data() {
return {
deviceList: []
};
},
props: {
//按钮默认文字
defaultText: {
type: String,
default: '打印'
},
bufferDataBe: {
type: String,
default: ''
}
},
methods: {
// 更新配对蓝牙列表
SearchBtlist() {
this.initializeBtPrint()
},
/**
* 初始化并显示已绑定的蓝牙设备列表
*/
initializeBtPrint() {
uni.showLoading({
title: '搜索中...',
})
var that = this;
that.deviceList = [];
var main = plus.android.runtimeMainActivity();
var Context = plus.android.importClass("android.content.Context");
var BManager = main.getSystemService(Context.BLUETOOTH_SERVICE);
plus.android.importClass(BManager);
var BAdapter = BManager.getAdapter();
plus.android.importClass(BAdapter);
var lists = BAdapter.getBondedDevices();
plus.android.importClass(lists);
var iterator = lists.iterator();
plus.android.importClass(iterator);
console.log(iterator.hasNext(),'iterator.hasNext()');
// 判断是否存在配对的元素、存在进行无限循环添加、不存在提示用户
if (iterator.hasNext()) {
while (iterator.hasNext()) {
var d = iterator.next();
plus.android.importClass(d);
var temp = {
name: d.getName(),
address: d.getAddress(),
status: d.getBondState(),
uuids: d.getUuids(),
op: d
};
that.deviceList.push(temp);
uni.hideLoading()
}
}else{
uni.showToast({
title:'暂无配对的打印机,请手动到蓝牙,进行连接配对,连接时,听到打印机发出 ‘叮’的声音 或看到打印机中的蓝牙指示灯亮起,请手动按一下打印机上的进纸按钮,以便配对成功 ~',
duration:10000,
icon:'none'
})
uni.hideLoading()
}
},
/**
* 实现向指定蓝牙设备(dev)发送数据进行打印的功能
* @param {Object} dev蓝牙相关参数
*/
printSomething(dev) {
uni.showLoading({
mask: true,
title: '打印中...',
})
var that = this;
var main = plus.android.runtimeMainActivity();
var BluetoothAdapter = plus.android.importClass("android.bluetooth.BluetoothAdapter");
var UUID = plus.android.importClass("java.util.UUID");
var uuid = UUID.fromString("00001101-0000-1000-8000-00805F9B34FB");
var BAdapter = BluetoothAdapter.getDefaultAdapter();
var device = BAdapter.getRemoteDevice(dev.address);
plus.android.importClass(device);
var bluetoothSocket = device.createInsecureRfcommSocketToServiceRecord(uuid);
plus.android.importClass(bluetoothSocket);
if (!bluetoothSocket.isConnected()) {
bluetoothSocket.connect();
if (bluetoothSocket.isConnected()) {
var outputStream = bluetoothSocket.getOutputStream();
plus.android.importClass(outputStream);
that.printTest(outputStream, bluetoothSocket)
} else {
uni.showToast({
title: '打印设备连接失败,请重新连接蓝牙,并重新进入!',
icon: 'none',
duration: 2000
});
uni.hideLoading()
}
} else {
uni.showToast({
title: '打印设备设备已关闭,请重新启动打印机!',
icon: 'none',
duration: 2000
});
uni.hideLoading()
}
},
/**
* 传递写入数据 调用传统BT蓝牙进行写入操作
* @param {Object} outputStream
* @param {Object} bluetoothSocket
*/
printTest(outputStream, bluetoothSocket) {
let dp = this;
if (this.bufferDataBe != '') {
var arrayBuffer = plus.android.invoke(this.bufferDataBe, "getBytes", "gbk");
outputStream.write(arrayBuffer);
outputStream.flush();
uni.hideLoading()
dp.$refs.popup.close()
bluetoothSocket.close();
uni.$emit('onPrintBeG', 'Y')
} else {
uni.showToast({
icon: 'none',
duration: 2000,
title: '暂无对应参数 请重新扫描!'
})
dp.$refs.popup.close()
}
},
/**
* 初始化 蓝牙状态的检查
*/
initializeBluetooth() {
let dp = this;
const BluetoothAdapter = plus.android.importClass('android.bluetooth.BluetoothAdapter'); // 引入Java 蓝牙类
const blueadapter = BluetoothAdapter.getDefaultAdapter(); //拿到默认蓝牙适配器方法
if (blueadapter) {
// 判断蓝牙是否开启
if (!blueadapter.isEnabled()) {
// 未开启弹出提示框
uni.showModal({
title: '提示',
content: '蓝牙未打开,打开蓝牙获取已连接设备列表,若没有对应的设备请手动到蓝牙列表进行连接蓝牙,在进行打印~',
showCancel: false,
confirmText: '打开蓝牙',
success(res) {
// 点击确定后通过系统打开蓝牙
if (res.confirm) {
const blueadapter = BluetoothAdapter.getDefaultAdapter();
if (blueadapter != null) {
blueadapter.enable();
setTimeout(()=>{
dp.initializeBtPrint()
},2000)
}
}
}
})
}else{
dp.initializeBtPrint()
}
}
},
mySleep: async function(time) {
await this.mypromise(time);
},
mypromise(time) {
return new Promise((resolve) => setTimeout(resolve, time));
},
handlePrintTap() {
this.$refs.popup.open()
//#ifdef APP-PLUS
this.initializeBluetooth()
//#endif
}
}
}
</script>
<style lang="scss">
.bg_box {
width: 95%;
.kk-printer-btn {
width: 100%;
height: 100%;
margin: 0 auto;
padding: 10rpx 0;
text-align: center;
}
.uni-popup {
border-radius: 20rpx !important;
.con_box {
width: 90%;
height: 80vh;
border-radius: 20rpx;
background: #ffffff;
overflow-y: scroll;
.con_box_title {
width: 100%;
display: flex;
justify-content: center;
padding: 20rpx 0 14rpx 0;
position: sticky;
top: 0;
background-color: #ffffff;
z-index: 9;
text {
font-size: 32rpx;
font-weight: 600;
color: #000;
display: flex;
align-items: center;
}
}
.con_box_item_box {
width: 95%;
margin: 8rpx auto;
border-radius: 15rpx;
padding: 8rpx;
border: 1px solid #e1e1e1;
.con_box_item {
width: 100%;
margin-top: 6rpx;
text {
color: #000;
font-size: 28rpx;
font-weight: 600;
}
}
}
}
.no_con_box {
width: 100%;
height: 80vh;
border-radius: 20rpx;
background: #ffffff;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
.empty-icon {
width: 268rpx;
height: 240rpx;
background: url('./img/empty-icon.png') no-repeat;
background-size: 100% 100%;
margin-bottom: 26rpx;
}
.empty-text {
line-height: 50rpx;
font-size: 30rpx;
text-align: center;
color: #999999;
}
.refef {
display: flex;
justify-content: center;
}
}
}
}
</style>