506 lines
14 KiB
Vue
506 lines
14 KiB
Vue
|
<template>
|
|||
|
<!-- <view class="content">
|
|||
|
<view class="body"> --><!--
|
|||
|
<view>
|
|||
|
<textarea class="result" v-model="returnResult"></textarea>
|
|||
|
</view>
|
|||
|
<textarea class="input" @input="inputEvent" />
|
|||
|
<button type="primary" @tap="sendData">发送(票据可使用)</button>
|
|||
|
|
|||
|
<view style='margin-top:4%;display: flex;flex-direction: row;'> -->
|
|||
|
<button type='primary' @tap='receiptTest' :loading='isReceiptSend' :disabled='isReceiptSend'>票据测试</button>
|
|||
|
<!-- <button type='primary' @tap='labelTest' :loading='isLabelSend' :disabled='isLabelSend'>标签测试</button>
|
|||
|
</view>
|
|||
|
|
|||
|
<view style='margin-top:4%;display: flex;flex-direction: row;'>
|
|||
|
hidden='true' -->
|
|||
|
<!--<canvas canvas-id='edit_area_canvas' :style="{width:canvasWidth+'px',height:canvasHeight+'px'}"></canvas>
|
|||
|
</view>
|
|||
|
|
|||
|
<picker style='margin:20px' mode='selector' :range='buffSize' :value='buffIndex' @change='buffBindChange'>
|
|||
|
当前每次发送字节数为(点击可更换):{{buffSize[buffIndex]}}
|
|||
|
</picker>
|
|||
|
|
|||
|
<picker style='margin:20px' mode='selector' :range='printNum' :value='printNumIndex' @change='printNumBindChange'>
|
|||
|
当前打印份数(点击可更换):{{printNum[printNumIndex]}}
|
|||
|
</picker>
|
|||
|
|
|||
|
</view>
|
|||
|
|
|||
|
<view>
|
|||
|
<h1>订单详情</h1>
|
|||
|
<view v-if="orderInfo">
|
|||
|
<p>ID: {{ orderInfo.id }}</p>
|
|||
|
<p>创建时间: {{ orderInfo.createTime }}</p>
|
|||
|
<p>手机号: {{ orderInfo.phone }}</p>
|
|||
|
<p>总价: ¥{{ orderInfo.totalPrice }}</p>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view> -->
|
|||
|
|
|||
|
</template>
|
|||
|
|
|||
|
<script>
|
|||
|
var tsc = require("../../util/ble/tsc.js");
|
|||
|
var esc = require("../../util/ble/esc.js");
|
|||
|
var encode = require("../../util/ble/encoding.js");
|
|||
|
import {
|
|||
|
mapState
|
|||
|
} from 'vuex';
|
|||
|
export default {
|
|||
|
data() {
|
|||
|
return {
|
|||
|
sendContent: "",
|
|||
|
looptime: 0,
|
|||
|
currentTime: 1,
|
|||
|
lastData: 0,
|
|||
|
oneTimeData: 0,
|
|||
|
returnResult: "",
|
|||
|
canvasWidth: 180,
|
|||
|
canvasHeight: 180,
|
|||
|
imageSrc: '../../static/logo.png',
|
|||
|
buffSize: [],
|
|||
|
buffIndex: 0,
|
|||
|
printNum: [],
|
|||
|
printNumIndex: 0,
|
|||
|
printerNum: 1,
|
|||
|
currentPrint: 1,
|
|||
|
isReceiptSend: false,
|
|||
|
isLabelSend: false,
|
|||
|
orderInfo: null,
|
|||
|
phoneNumber: "",
|
|||
|
businessName:""
|
|||
|
};
|
|||
|
},
|
|||
|
computed: mapState(['sysinfo', 'Bluetooth']),
|
|||
|
onLoad(options) {
|
|||
|
if (options.orderInfo) {
|
|||
|
// 解码并解析订单信息
|
|||
|
const orderInfo = decodeURIComponent(options.orderInfo);
|
|||
|
this.orderInfo = JSON.parse(orderInfo);
|
|||
|
|
|||
|
// 从 orderInfo 中提取手机号
|
|||
|
if (this.orderInfo && this.orderInfo.phone) {
|
|||
|
this.phoneNumber = this.orderInfo.phone;
|
|||
|
} else {
|
|||
|
|
|||
|
this.phoneNumber = '未提供手机号';
|
|||
|
console.warn('没有从 orderInfo 中获取到 phoneNumber');
|
|||
|
}
|
|||
|
|
|||
|
if (this.orderInfo && this.orderInfo.businessName) {
|
|||
|
this.businessName = this.orderInfo.businessName;
|
|||
|
} else {
|
|||
|
|
|||
|
this.businessName = '未提供商户名称';
|
|||
|
console.warn('没有从 orderInfo 中获取到 .businessName');
|
|||
|
}
|
|||
|
|
|||
|
|
|||
|
} else {
|
|||
|
|
|||
|
this.phoneNumber = '未提供手机号';
|
|||
|
console.warn('没有从 URL 参数中获取到 orderInfo');
|
|||
|
}
|
|||
|
|
|||
|
|
|||
|
let that = this;
|
|||
|
let {
|
|||
|
BLEInformation
|
|||
|
} = that.Bluetooth;
|
|||
|
// uni.notifyBLECharacteristicValueChange({
|
|||
|
// deviceId: BLEInformation.deviceId,
|
|||
|
// serviceId: BLEInformation.notifyServiceId,
|
|||
|
// characteristicId: BLEInformation.notifyCharaterId,
|
|||
|
// state: true,
|
|||
|
// success(res) {
|
|||
|
// uni.onBLECharacteristicValueChange(function(r) {
|
|||
|
// console.log(`characteristic ${r.characteristicId} has changed, now is ${r}`)
|
|||
|
// })
|
|||
|
// },
|
|||
|
// fail: function(e) {
|
|||
|
// console.log(e)
|
|||
|
// },
|
|||
|
// complete: function(e) {
|
|||
|
// console.log(e)
|
|||
|
// }
|
|||
|
// })
|
|||
|
},
|
|||
|
onReady(){
|
|||
|
let list = []
|
|||
|
let numList = []
|
|||
|
let j = 0
|
|||
|
for (let i = 20; i < 200; i += 10) {
|
|||
|
list[j] = i;
|
|||
|
j++
|
|||
|
}
|
|||
|
for (let i = 1; i < 10; i++) {
|
|||
|
numList[i - 1] = i
|
|||
|
}
|
|||
|
this.buffSize = list;
|
|||
|
this.oneTimeData = list[0];
|
|||
|
this.printNum = numList;
|
|||
|
this.printerNum = numList[0];
|
|||
|
},
|
|||
|
onShow(){
|
|||
|
let that = this;
|
|||
|
let width;
|
|||
|
let height;
|
|||
|
uni.getImageInfo({
|
|||
|
src: that.imageSrc,
|
|||
|
success(res) {
|
|||
|
console.log(res.width)
|
|||
|
console.log(res.height)
|
|||
|
width = res.width
|
|||
|
height = res.height
|
|||
|
that.canvasWidth = res.width;
|
|||
|
that.canvasHeight = res.height;
|
|||
|
}
|
|||
|
})
|
|||
|
const ctx = uni.createCanvasContext("edit_area_canvas", this);
|
|||
|
// if (app.globalData.platform == "android") {
|
|||
|
// ctx.translate(width, height)
|
|||
|
// ctx.rotate(180 * Math.PI / 180)
|
|||
|
// }
|
|||
|
ctx.drawImage(this.imageSrc, 0, 0, width, height);
|
|||
|
ctx.draw();
|
|||
|
},
|
|||
|
onUnload() {
|
|||
|
let that = this;
|
|||
|
let {
|
|||
|
BLEInformation
|
|||
|
} = that.Bluetooth;
|
|||
|
// uni.closeBLEConnection({
|
|||
|
// deviceId: BLEInformation.deviceId,
|
|||
|
// success: function(res) {
|
|||
|
// console.log("关闭蓝牙成功")
|
|||
|
// },
|
|||
|
// })
|
|||
|
},
|
|||
|
methods:{
|
|||
|
inputEvent(e){
|
|||
|
this.sendContent = e.detail.value;
|
|||
|
},
|
|||
|
sendData(){
|
|||
|
let data = this.sendContent + "\n"
|
|||
|
this.looptime = 0;
|
|||
|
var content = new encode.TextEncoder(
|
|||
|
'gb18030', {
|
|||
|
NONSTANDARD_allowLegacyEncoding: true
|
|||
|
}).encode(data);
|
|||
|
|
|||
|
this.prepareSend(content);
|
|||
|
},
|
|||
|
labelTest(){
|
|||
|
let that = this;
|
|||
|
let canvasWidth = that.canvasWidth
|
|||
|
let canvasHeight = that.canvasHeight
|
|||
|
let command = tsc.jpPrinter.createNew()
|
|||
|
command.setSize(48, 40)
|
|||
|
command.setGap(0)
|
|||
|
command.setCls()
|
|||
|
command.setText(0, 30, "TSS24.BF2", 1, 1, "图片")
|
|||
|
command.setQR(40, 120, "L", 5, "A", "www.smarnet.cc佳博智汇")
|
|||
|
command.setText(60, 90, "TSS24.BF2", 1, 1, "佳博智汇")
|
|||
|
command.setText(170, 50, "TSS24.BF2", 1, 1, "小程序测试")
|
|||
|
command.setText(170, 90, "TSS24.BF2", 1, 1, "测试数字12345678")
|
|||
|
command.setText(170, 120, "TSS24.BF2", 1, 1, "测试英文abcdefg")
|
|||
|
command.setText(170, 150, "TSS24.BF2", 1, 1, "测试符号/*-+!@#$")
|
|||
|
command.setBarCode(170, 180, "EAN8", 64, 1, 3, 3, "1234567")
|
|||
|
uni.canvasGetImageData({
|
|||
|
canvasId: 'edit_area_canvas',
|
|||
|
x: 0,
|
|||
|
y: 0,
|
|||
|
width: canvasWidth,
|
|||
|
height: canvasHeight,
|
|||
|
success: function(res) {
|
|||
|
command.setBitmap(60, 0, 1, res)
|
|||
|
},
|
|||
|
complete: function() {
|
|||
|
command.setPagePrint()
|
|||
|
that.isLabelSend = true;
|
|||
|
that.prepareSend(command.getData())
|
|||
|
}
|
|||
|
})
|
|||
|
},
|
|||
|
|
|||
|
//票据测试
|
|||
|
receiptTest(){
|
|||
|
var that = this;
|
|||
|
var canvasWidth = that.canvasWidth
|
|||
|
var canvasHeight = that.canvasHeight
|
|||
|
var command = esc.jpPrinter.createNew()
|
|||
|
command.init()
|
|||
|
//取餐码
|
|||
|
command.bold(1);//加粗
|
|||
|
command.setFontSize(17);//字体大小
|
|||
|
command.setSelectJustification(0)//居左
|
|||
|
command.rowSpace(100);
|
|||
|
//command.setText(`手机号: ${this.phoneNumber}`);
|
|||
|
command.setText(`# ${this.orderInfo.id}`);
|
|||
|
// command.setText(`# ${this.orderInfo.pickupCode.slice(-4)}`);
|
|||
|
command.setPrint();
|
|||
|
command.rowSpace(60);
|
|||
|
|
|||
|
command.bold(0);//取消加粗
|
|||
|
command.setFontSize(0);//正常字体
|
|||
|
|
|||
|
// 标题
|
|||
|
command.bold(1);//加粗
|
|||
|
command.setFontSize(16);//字体大小
|
|||
|
command.setSelectJustification(1)//居中
|
|||
|
command.rowSpace(100);
|
|||
|
//command.setText(`手机号: ${this.phoneNumber}`);
|
|||
|
command.setText(` ${this.orderInfo.businessVO.businessName}`);
|
|||
|
command.setPrint();
|
|||
|
command.rowSpace(60);
|
|||
|
|
|||
|
command.bold(0);//取消加粗
|
|||
|
command.setFontSize(0);//正常字体
|
|||
|
|
|||
|
const formattedCreateTime = this.formatCreateTime(this.orderInfo.createTime);
|
|||
|
//食堂地址
|
|||
|
command.setSelectJustification(0);//居左
|
|||
|
command.setText(`哈尔滨华德学院:${this.orderInfo.businessVO.address}`);
|
|||
|
command.setPrint();
|
|||
|
//时间
|
|||
|
command.setSelectJustification(0);//居左
|
|||
|
command.setText(`创建时间: ${this.orderInfo.updateTime.slice(0, 19).replace('T', ' ')}`);
|
|||
|
command.setPrint();
|
|||
|
//编号
|
|||
|
command.setSelectJustification(0);//居左
|
|||
|
command.setText(`订单编号: ${this.orderInfo.pickupCode}`);
|
|||
|
command.setPrintAndFeed(80);//打印并走纸feed个单位
|
|||
|
//列表
|
|||
|
command.rowSpace(80);//间距
|
|||
|
command.bold(5);//加粗
|
|||
|
command.setText("菜品");
|
|||
|
command.setAbsolutePrintPosition(100);
|
|||
|
// command.setText("大小");
|
|||
|
// command.setAbsolutePrintPosition(180);
|
|||
|
/* command.setText("口味");
|
|||
|
command.setAbsolutePrintPosition(180); */
|
|||
|
command.setText("单价");
|
|||
|
command.setAbsolutePrintPosition(180);
|
|||
|
command.setText("数量");
|
|||
|
command.setAbsolutePrintPosition(270);
|
|||
|
command.setText("金额");
|
|||
|
command.setPrint()
|
|||
|
command.bold(0);//加粗
|
|||
|
// -------1
|
|||
|
for (let item of this.orderInfo.orderDetailsVOList) {
|
|||
|
command.setText(item.dishesVO?.dishesName);
|
|||
|
command.setAbsolutePrintPosition(100);
|
|||
|
// command.setText("大碗");
|
|||
|
// command.setAbsolutePrintPosition(180);
|
|||
|
/* command.setText("麻辣");
|
|||
|
command.setAbsolutePrintPosition(180); */
|
|||
|
command.setText(item.price);
|
|||
|
command.setAbsolutePrintPosition(180);
|
|||
|
command.setText(item.quantity);
|
|||
|
command.setAbsolutePrintPosition(270);
|
|||
|
command.setText(item.subtotal);
|
|||
|
command.setPrint()
|
|||
|
}
|
|||
|
|
|||
|
//合计
|
|||
|
command.bold(5);//加粗
|
|||
|
command.setAbsolutePrintPosition(0);
|
|||
|
command.setText(`总数:${this.orderInfo.number}`);
|
|||
|
command.setAbsolutePrintPosition(150);
|
|||
|
command.setText(`合计:${this.orderInfo.totalPrice}`);
|
|||
|
command.setPrint();
|
|||
|
|
|||
|
command.setPrint();
|
|||
|
|
|||
|
|
|||
|
//提示
|
|||
|
command.rowSpace(80);//间距
|
|||
|
command.bold(2);//加粗
|
|||
|
command.setSelectJustification(0);//居中
|
|||
|
command.setText("用户需要餐具");
|
|||
|
command.setPrint();
|
|||
|
command.setText(`备注:${this.orderInfo.notes}`);
|
|||
|
command.setPrint();
|
|||
|
|
|||
|
//电话
|
|||
|
command.setSelectJustification(0);//居左
|
|||
|
command.setText(`联系电话: ${this.orderInfo.phone}`);
|
|||
|
command.setPrint();
|
|||
|
|
|||
|
command.setPrintAndFeedRow(3);
|
|||
|
|
|||
|
that.isReceiptSend = true;
|
|||
|
that.prepareSend(command.getData());
|
|||
|
|
|||
|
|
|||
|
},
|
|||
|
|
|||
|
formatCreateTime(createTime) {
|
|||
|
const dateObj = new Date(createTime);
|
|||
|
const year = dateObj.getFullYear();
|
|||
|
const month = String(dateObj.getMonth() + 1).padStart(2, '0'); // 月份从 0 开始,需要加 1
|
|||
|
const day = String(dateObj.getDate()).padStart(2, '0');
|
|||
|
const hours = String(dateObj.getHours()).padStart(2, '0');
|
|||
|
const minutes = String(dateObj.getMinutes()).padStart(2, '0');
|
|||
|
const seconds = String(dateObj.getSeconds()).padStart(2, '0');
|
|||
|
|
|||
|
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
|
|||
|
},
|
|||
|
|
|||
|
|
|||
|
prepareSend(buff){
|
|||
|
console.log(buff);
|
|||
|
let that = this
|
|||
|
let time = that.oneTimeData
|
|||
|
let looptime = parseInt(buff.length / time);
|
|||
|
let lastData = parseInt(buff.length % time);
|
|||
|
console.log(looptime + "---" + lastData)
|
|||
|
this.looptime = looptime + 1;
|
|||
|
this.lastData = lastData;
|
|||
|
this.currentTime = 1;
|
|||
|
that.Send(buff)
|
|||
|
},
|
|||
|
//查询打印机状态
|
|||
|
queryStatus(){
|
|||
|
let command = esc.jpPrinter.Query();
|
|||
|
command.getRealtimeStatusTransmission(1);
|
|||
|
},
|
|||
|
//分包发送
|
|||
|
Send(buff){
|
|||
|
let that = this
|
|||
|
let {currentTime,looptime:loopTime,lastData,oneTimeData:onTimeData,printerNum:printNum,currentPrint}=that;
|
|||
|
let buf;
|
|||
|
let dataView;
|
|||
|
if (currentTime < loopTime) {
|
|||
|
buf = new ArrayBuffer(onTimeData)
|
|||
|
dataView = new DataView(buf)
|
|||
|
for (var i = 0; i < onTimeData; ++i) {
|
|||
|
dataView.setUint8(i, buff[(currentTime - 1) * onTimeData + i])
|
|||
|
}
|
|||
|
} else {
|
|||
|
buf = new ArrayBuffer(lastData)
|
|||
|
dataView = new DataView(buf)
|
|||
|
for (var i = 0; i < lastData; ++i) {
|
|||
|
dataView.setUint8(i, buff[(currentTime - 1) * onTimeData + i])
|
|||
|
}
|
|||
|
}
|
|||
|
console.log("第" + currentTime + "次发送数据大小为:" + buf.byteLength)
|
|||
|
let {
|
|||
|
BLEInformation
|
|||
|
} = that.Bluetooth;
|
|||
|
|
|||
|
plus.bluetooth.writeBLECharacteristicValue({
|
|||
|
deviceId: BLEInformation.deviceId,
|
|||
|
serviceId: BLEInformation.writeServiceId,
|
|||
|
characteristicId: BLEInformation.writeCharaterId,
|
|||
|
value: buf,
|
|||
|
success: function(res) {
|
|||
|
console.log(res)
|
|||
|
},
|
|||
|
fail: function(e) {
|
|||
|
console.log(e)
|
|||
|
},
|
|||
|
complete: function() {
|
|||
|
currentTime++
|
|||
|
if (currentTime <= loopTime) {
|
|||
|
that.currentTime = currentTime;
|
|||
|
that.Send(buff)
|
|||
|
} else {
|
|||
|
uni.showToast({
|
|||
|
title: '已打印第' + currentPrint + '张',
|
|||
|
})
|
|||
|
if (currentPrint == printNum) {
|
|||
|
that.looptime = 0;
|
|||
|
that.lastData = 0;
|
|||
|
that.currentTime = 1;
|
|||
|
that.isReceiptSend = false;
|
|||
|
that.isLabelSend = false;
|
|||
|
that.currentPrint = 1;
|
|||
|
} else {
|
|||
|
currentPrint++;
|
|||
|
that.currentPrint = currentPrint;
|
|||
|
that.currentTime = 1;
|
|||
|
that.Send(buff)
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
})
|
|||
|
},
|
|||
|
buffBindChange: function(res) { //更改打印字节数
|
|||
|
let index = res.detail.value
|
|||
|
let time = this.buffSize[index]
|
|||
|
this.buffIndex = index;
|
|||
|
this.oneTimeData = time;
|
|||
|
},
|
|||
|
printNumBindChange: function(res) { //更改打印份数
|
|||
|
let index = res.detail.value
|
|||
|
let num = this.printNum[index]
|
|||
|
this.printNumIndex = index;
|
|||
|
this.printerNum = num;
|
|||
|
},
|
|||
|
}
|
|||
|
}
|
|||
|
</script>
|
|||
|
|
|||
|
<style lang="less">
|
|||
|
.input{
|
|||
|
text-align: top;
|
|||
|
width: 90%;
|
|||
|
height: 150px;
|
|||
|
margin-left: 4%;
|
|||
|
margin-right: 4%;
|
|||
|
margin-top: 10px;
|
|||
|
margin-bottom: 12px;
|
|||
|
border: 1px solid slategray;
|
|||
|
}
|
|||
|
.receiver_info_scroll_view{
|
|||
|
width: 90%;
|
|||
|
height: 200px;
|
|||
|
margin-left: 4%;
|
|||
|
margin-right: 4%;
|
|||
|
margin-top: 10px;
|
|||
|
margin-bottom: 25px;
|
|||
|
border: 1px solid black;
|
|||
|
}
|
|||
|
.result{
|
|||
|
width: 90%;
|
|||
|
height: 150px;
|
|||
|
border: 1px solid black;
|
|||
|
margin-left: 4%;
|
|||
|
margin-bottom: 4%;
|
|||
|
margin-top: 5%;
|
|||
|
}
|
|||
|
button{
|
|||
|
width: 90%;
|
|||
|
margin-left: 5%;
|
|||
|
margin-right: 5%;
|
|||
|
}
|
|||
|
.switch{
|
|||
|
float: right;
|
|||
|
margin-right: 20px;
|
|||
|
margin-bottom: 16px;
|
|||
|
}
|
|||
|
text{
|
|||
|
color: #fff;
|
|||
|
display: block;
|
|||
|
}
|
|||
|
input{
|
|||
|
color: gainsboro;
|
|||
|
float: left;
|
|||
|
}
|
|||
|
.v_net_ssid{
|
|||
|
width: 100%;
|
|||
|
background: #fff;
|
|||
|
}
|
|||
|
.v_net_passw{
|
|||
|
width: 100%;
|
|||
|
background: antiquewhite;
|
|||
|
}
|
|||
|
.swiper{
|
|||
|
width: 100%;
|
|||
|
height: 100%;
|
|||
|
}
|
|||
|
|
|||
|
</style>
|