381 lines
12 KiB
Vue
381 lines
12 KiB
Vue
|
<template>
|
|||
|
|
<view>
|
|||
|
|
<u-navbar back-text="返回" title="拆分" :background="background"></u-navbar>
|
|||
|
|
|
|||
|
|
<u-form class="firstform">
|
|||
|
|
<u-form-item>
|
|||
|
|
<p>原条码:</p>
|
|||
|
|
<u-input placeholder="请扫描原条码" :border="true" :focus="focusBarCode" v-model="barCode"
|
|||
|
|
@confirm="searchBarCodeInFo" />
|
|||
|
|
</u-form-item>
|
|||
|
|
|
|||
|
|
<u-form-item>
|
|||
|
|
<p>物料名称:</p>
|
|||
|
|
<u-input placeholder="物料名称" :border="true" disabeled="true" :disabled="true" v-model="materialName" />
|
|||
|
|
</u-form-item>
|
|||
|
|
|
|||
|
|
<u-form-item class="item2">
|
|||
|
|
<p>物料编码:</p>
|
|||
|
|
<u-input class="input1" placeholder="物料编码" disabeled="true" :disabled="true" v-model="materialSpc" />
|
|||
|
|
<p>原条码数量:</p>
|
|||
|
|
<u-input placeholder="原条码数量" disabeled="true" :border="true" :disabled="true" v-model="oldQty" />
|
|||
|
|
</u-form-item>
|
|||
|
|
|
|||
|
|
<u-form-item class="item">
|
|||
|
|
<view>打印机:</view>
|
|||
|
|
<picker @change="bindPickerChange" :value="index" mode="selector" :range="rangedata"
|
|||
|
|
:range-key="'DESCRIPTION'">
|
|||
|
|
<view class="uni-input" v-if="show">
|
|||
|
|
{{rangedata[index].DESCRIPTION}}
|
|||
|
|
</view>
|
|||
|
|
</picker>
|
|||
|
|
</u-form-item>
|
|||
|
|
<u-form-item>
|
|||
|
|
物料数拆:
|
|||
|
|
<u-input placeholder="物料数量" :border="true" :focus="focusMaterialQty" v-model="Qty" type="number"
|
|||
|
|
style="width: 170px;" />
|
|||
|
|
</u-form-item>
|
|||
|
|
|
|||
|
|
<u-form-item>
|
|||
|
|
<button type="primary" size="mini" @click="GetSplict">拆分</button>
|
|||
|
|
<button type="warn" size="mini" @click="PrintBarCode">打印</button>
|
|||
|
|
<button type="warn" size="mini" @click="testprint">测试打印</button>
|
|||
|
|
</u-form-item>
|
|||
|
|
</u-form>
|
|||
|
|
<uni-segmented-control :current="current" :values="items" :style-type="styleType" :active-color="activeColor" />
|
|||
|
|
|
|||
|
|
<view v-if="current === 0">
|
|||
|
|
<uni-z-table :style="{'height': tabH+'px'}" :tableData="matData" :columns="matColumns" :showBottomSum="true"
|
|||
|
|
:rowNumbers="true" :pagination="true">
|
|||
|
|
</uni-z-table>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import {
|
|||
|
|
print
|
|||
|
|
} from '../../../../common/BluetoothPrint.js'
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
items: ['拆分履历'], //'材料列表',
|
|||
|
|
current: 0,
|
|||
|
|
activeColor: '#007aff', //分栏器的颜色
|
|||
|
|
styleType: 'button',
|
|||
|
|
tabH: 800,
|
|||
|
|
matColumns: [{
|
|||
|
|
title: '条码',
|
|||
|
|
field: "materialPackingName",
|
|||
|
|
width: 300,
|
|||
|
|
sort: true,
|
|||
|
|
align: "center"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '物料编码',
|
|||
|
|
field: "materialSpecName",
|
|||
|
|
width: 220,
|
|||
|
|
sort: true,
|
|||
|
|
align: "right"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
title: '数量',
|
|||
|
|
field: "qty",
|
|||
|
|
width: 180,
|
|||
|
|
sort: true,
|
|||
|
|
align: "right"
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
background: {
|
|||
|
|
backgroundImage: 'linear-gradient(45deg, rgb(28, 187, 180), rgb(141, 198, 63))'
|
|||
|
|
}, //返回按钮的样式
|
|||
|
|
//-----------------------------------上面是样式需要的数据,下面是真正需要的数据
|
|||
|
|
index: 0,
|
|||
|
|
printData: [], //要打印的内容
|
|||
|
|
matData: [], //后端传回来的绑定表格的数据
|
|||
|
|
rangedata: [], //后端传回来的下拉框数据，一个对象数组
|
|||
|
|
//printer: "", //下拉框选择的具体打印机
|
|||
|
|
//焦点和其他的一些数据
|
|||
|
|
ischecked: false, //开关的初始状态
|
|||
|
|
focusBarCode: true, //原条码
|
|||
|
|
focusMaterialQty: false, //物料数拆
|
|||
|
|
//双向绑定的数据
|
|||
|
|
siteName: "", //数据库表的主键需要工厂
|
|||
|
|
barCode: "", //条码
|
|||
|
|
materialName: "", //物料名称
|
|||
|
|
materialSpc: "", //物料编码
|
|||
|
|
oldQty: "", //原条码数量
|
|||
|
|
userId: "",
|
|||
|
|
Qty: "", //物料数拆对应的数量onReady
|
|||
|
|
show: false, //必须要使用这个v-if判断，因为template标签渲染完模板的时候，从后端取的打印机数据rangedata获取了
|
|||
|
|
//但是没法获取rangedata[index].DESCRIPTION这个里面的DESCRIPTION，加了这个判断后后端返回的数据rangedata取到以后再操作dom树渲染picker组件
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
created() {
|
|||
|
|
//挂载页面的时候就查询下拉框的数据,这是无参请求所以没参数
|
|||
|
|
this.$MyRequest('/split/getbluetoothprinter', {}, 'GET').then(res => {
|
|||
|
|
if (res.data.success) {
|
|||
|
|
this.rangedata = res.data.resultObj //接数据，是一个对象数组
|
|||
|
|
this.show = true //设置为true展示picker组件
|
|||
|
|
} else {
|
|||
|
|
console.log(this.data.message)
|
|||
|
|
}
|
|||
|
|
}).catch(err => {
|
|||
|
|
this.$showMessage(err)
|
|||
|
|
});
|
|||
|
|
let that = this
|
|||
|
|
uni.getStorage({
|
|||
|
|
key: "sitename",
|
|||
|
|
success(res) {
|
|||
|
|
that.siteName = res.data
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
uni.getStorage({
|
|||
|
|
key: "userid",
|
|||
|
|
success(res) {
|
|||
|
|
that.userId = res.data
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
methods: {
|
|||
|
|
//picker选择器选择时
|
|||
|
|
bindPickerChange(e) {
|
|||
|
|
this.index = e.detail.value //获取到当前选择的index
|
|||
|
|
//console.log(this.index)
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
//焦点初始化，让页面所有的焦点同时只能存在一个
|
|||
|
|
initfocus() {
|
|||
|
|
this.focusBarCode = false
|
|||
|
|
this.focusMaterialQty = false
|
|||
|
|
},
|
|||
|
|
//获取焦点的公共方法
|
|||
|
|
getfocus(nextfocus) {
|
|||
|
|
this.initfocus()
|
|||
|
|
this[nextfocus]
|
|||
|
|
this.$nextTick(() => { //vue是数据全部修改后才进行的视图更新，使用nextTick函数就是为了拿到最新的dom节点数据，还不懂的可以去百度
|
|||
|
|
this[nextfocus] = true
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
//回车事件，获取条码的信息
|
|||
|
|
searchBarCodeInFo() {
|
|||
|
|
if (this.barCode == "") {
|
|||
|
|
this.$showMessage("条码不能为空")
|
|||
|
|
this.getfocus('focusBarCode') //重新聚焦到条码输入框
|
|||
|
|
} else {
|
|||
|
|
this.getBarCodeInFo() //获取条码信息
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
//获取条码信息的请求
|
|||
|
|
getBarCodeInFo() {
|
|||
|
|
this.$MyRequest('/split/getlist', {
|
|||
|
|
materialPackingName: this.barCode
|
|||
|
|
}).then(res => {
|
|||
|
|
if (res.data.success) {
|
|||
|
|
this.materialName = res.data.resultObj[0]["DESCRIPTION"] //获取物料名称
|
|||
|
|
this.materialSpc = res.data.resultObj[0]["MATERIALSPECNAME"] //获取物料编码
|
|||
|
|
this.oldQty = res.data.resultObj[0]["MATERIALQUANTITY"] //获取物料原数量
|
|||
|
|
this.siteName = res.data.resultObj[0]["SITENAME"] //获取工厂名称，后续传回去
|
|||
|
|
this.getfocus('focusMaterialQty') //焦点移动到拆分数量的输入框
|
|||
|
|
} else {
|
|||
|
|
this.$showMessage(res.data.message)
|
|||
|
|
}
|
|||
|
|
}).catch(err => {
|
|||
|
|
this.$showMessage(err)
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
//拆分回车按钮
|
|||
|
|
GetSplict() {
|
|||
|
|
if (this.Qty >= this.oldQty) {
|
|||
|
|
this.$showMessage("拆分数量不能大于原条码数量")
|
|||
|
|
this.Qty = "" //清空数量
|
|||
|
|
this.getfocus('focusMaterialQty') //重聚焦
|
|||
|
|
} else {
|
|||
|
|
this.splict()
|
|||
|
|
setTimeout(() => {
|
|||
|
|
this.save() //2s后保存拆分后的条码
|
|||
|
|
}, 2000)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
|
|||
|
|
//拆分请求
|
|||
|
|
splict() {
|
|||
|
|
this.$MyRequest('/split/getsplitbarcode', {
|
|||
|
|
materialPackingName: this.barCode, //条码编号
|
|||
|
|
materialQuantity: this.oldQty, //旧条码的数量
|
|||
|
|
siteName: this.siteName, //工厂名
|
|||
|
|
newMaterialQuantity: this.Qty, //新条码的数量
|
|||
|
|
materialSpecName: this.materialSpc, //物料编号
|
|||
|
|
}).then(res => {
|
|||
|
|
console.log(res)
|
|||
|
|
if (res.data.success) {
|
|||
|
|
this.matData = res.data.resultObj //接后端的数据
|
|||
|
|
console.log(this.matData)
|
|||
|
|
} else {
|
|||
|
|
this.$showMessage(res.data.message)
|
|||
|
|
}
|
|||
|
|
}).catch(err => {
|
|||
|
|
this.$showMessage(err)
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
//拆分后的条码保存请求
|
|||
|
|
save() {
|
|||
|
|
this.$MyRequest('/split/splitsave', {
|
|||
|
|
siteName: this.siteName, //工厂
|
|||
|
|
sourcePackingName: this.barCode, //老条码
|
|||
|
|
sourceNewQty: this.matData[0]["qty"], //老条码的新数量
|
|||
|
|
splitPackingName: this.matData[1]["materialPackingName"], //新条码的数量
|
|||
|
|
splitQty: this.matData[1]["qty"], //新条码数量
|
|||
|
|
userid: this.userId //操作人
|
|||
|
|
}).then(res => {
|
|||
|
|
if (res.data.success) {
|
|||
|
|
console.log(res)
|
|||
|
|
this.$showMessage(res.data.message)
|
|||
|
|
this.printData = res.data.resultObj //接后端的数据
|
|||
|
|
} else {
|
|||
|
|
this.$showMessage(res.data.message)
|
|||
|
|
//console.log(this.userid)
|
|||
|
|
}
|
|||
|
|
}).catch(err => {
|
|||
|
|
this.$showMessage(err)
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
//打印请求
|
|||
|
|
PrintBarCode() {
|
|||
|
|
let macaddress = this.rangedata[this.index].ENUMVALUE //mac地址，可以在打印机上看
|
|||
|
|
console.log(macaddress)
|
|||
|
|
//先打印原条码
|
|||
|
|
let printStr1 = '! 0 200 200 400 1\n' +
|
|||
|
|
'PAGE-WIDTH 560\n' +
|
|||
|
|
'PW 848\n' +
|
|||
|
|
'TONE 0\n' +
|
|||
|
|
'SPEED 0\n' +
|
|||
|
|
'GAP-SENSE\n' +
|
|||
|
|
'NO-PACE\n' +
|
|||
|
|
'POSTFEED 0\n' +
|
|||
|
|
'LEFT\n' +
|
|||
|
|
'T 65 1 20 20 物料编码：\n' +
|
|||
|
|
'SETBOLD 2\n' +
|
|||
|
|
'T 65 1 135 20 ' + this.materialSpc + '\n' +
|
|||
|
|
'SETBOLD 0\n' +
|
|||
|
|
'T 65 0 20 50 物料描述：\n' +
|
|||
|
|
'T 65 1 135 50 ' + this.materialName + '\n' +
|
|||
|
|
// 'T 65 1 20 80 供应商代码：\n' +
|
|||
|
|
// 'T 65 1 190 80 ' + this.printData[0]["SUPPLYCODE"] + '\n' +
|
|||
|
|
'T 65 0 20 110 供应商：\n' +
|
|||
|
|
'T 65 1 135 110 ' + this.printData[0]["SUPPLIERNAME"] + '\n' +
|
|||
|
|
'T 65 0 20 140 制造日期：\n' +
|
|||
|
|
'T 65 1 135 140' + this.printData[0]["MAKEDATE"] + '\n' +
|
|||
|
|
'T 65 0 20 170 有效期至：\n' +
|
|||
|
|
'T 65 1 135 170 ' + this.printData[0]["EXPIRINGDATE"] + '\n' +
|
|||
|
|
'T 65 0 20 200 批次：\n' +
|
|||
|
|
'T 65 1 135 200 ' + this.printData[0]["CHARGE"] + '\n' +
|
|||
|
|
'T 65 0 20 230 数量：\n' +
|
|||
|
|
'T 65 1 135 230 ' + this.printData[0]["MATERIALQUANTITY"] + '\n' +
|
|||
|
|
'T 65 0 20 260 SN：\n' +
|
|||
|
|
'T 65 1 135 260 ' + this.barCode + '\n' +
|
|||
|
|
'SETBOLD 2\n' +
|
|||
|
|
'SETBOLD 0\n' +
|
|||
|
|
'B QR 400 200 M 5 U 2\n' +
|
|||
|
|
'MA,' + this.barCode + '\n' +
|
|||
|
|
'ENDQR\n' +
|
|||
|
|
/* 'B 128 2 1 50 50 560 ' + this.barCode + '\n' +
|
|||
|
|
'T 65 1 200 620 ' + this.barCode + '\n' + */
|
|||
|
|
'FORM\n' +
|
|||
|
|
'PRINT\n';
|
|||
|
|
print(macaddress, printStr1);
|
|||
|
|
|
|||
|
|
//新条码
|
|||
|
|
let printStr2 = '! 0 200 200 640 1\n' +
|
|||
|
|
'PAGE-WIDTH 640\n' +
|
|||
|
|
'PW 848\n' +
|
|||
|
|
'TONE 0\n' +
|
|||
|
|
'SPEED 0\n' +
|
|||
|
|
'GAP-SENSE\n' +
|
|||
|
|
'NO-PACE\n' +
|
|||
|
|
'POSTFEED 0\n' +
|
|||
|
|
'LEFT\n' +
|
|||
|
|
'T 65 1 20 20 物料编码：\n' +
|
|||
|
|
'SETBOLD 2\n' +
|
|||
|
|
'T 65 1 135 20 ' + this.materialSpc + '\n' +
|
|||
|
|
'SETBOLD 0\n' +
|
|||
|
|
'T 65 0 20 50 物料描述：\n' +
|
|||
|
|
'T 65 1 135 50 ' + this.materialName + '\n' +
|
|||
|
|
'T 65 1 20 80 供应商代码：\n' +
|
|||
|
|
'T 65 1 190 80 ' + this.printData[1]["SUPPLYCODE"] + '\n' +
|
|||
|
|
'T 65 0 20 110 供应商：\n' +
|
|||
|
|
'T 65 1 135 110 ' + this.printData[1]["SUPPLIERNAME"] + '\n' +
|
|||
|
|
'T 65 0 20 140 制造日期：\n' +
|
|||
|
|
'T 65 1 135 140' + this.printData[1]["MAKEDATE"] + '\n' +
|
|||
|
|
'T 65 0 20 170 有效期至：\n' +
|
|||
|
|
'T 65 1 135 170 ' + this.printData[1]["EXPIRINGDATE"] + '\n' +
|
|||
|
|
'T 65 0 20 200 批次：\n' +
|
|||
|
|
'T 65 1 135 200 ' + this.printData[1]["CHARGE"] + '\n' +
|
|||
|
|
'T 65 0 20 230 数量：\n' +
|
|||
|
|
'T 65 1 135 230 300' + this.printData[1]["MATERIALQUANTITY"] + '\n' +
|
|||
|
|
'T 65 0 20 260 SN：\n' +
|
|||
|
|
'T 65 1 135 260 ' + this.printData[1]["MATERIALQUANTITY"] + '\n' +
|
|||
|
|
'SETBOLD 2\n' +
|
|||
|
|
'SETBOLD 0\n' +
|
|||
|
|
'B QR 20 290 M 12 H 4\n' +
|
|||
|
|
'MA,' + this.printData[1]["MATERIALQUANTITY"] + '\n' +
|
|||
|
|
'ENDQR\n' +
|
|||
|
|
'B 128 2 1 50 50 560 ' + this.printData[1]["MATERIALQUANTITY"] + '\n' +
|
|||
|
|
'T 65 1 200 620 ' + this.printData[1]["MATERIALQUANTITY"] + '\n' +
|
|||
|
|
'FORM\n' +
|
|||
|
|
'PRINT\n';
|
|||
|
|
//print(macaddress, printStr2) //mac地址，可以在打印机上看;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
//测试打印
|
|||
|
|
testprint() {
|
|||
|
|
let macaddress = this.rangedata[this.index].ENUMVALUE
|
|||
|
|
let printStr4 = '! 0 200 200 760 1\n' +
|
|||
|
|
'PAGE-WIDTH 760\n' +
|
|||
|
|
'SPEED 0\n' +
|
|||
|
|
'GAP-SENSE\n' +
|
|||
|
|
'POSTFEED 0\n' +
|
|||
|
|
'CENTER\n'+
|
|||
|
|
'SETBOLD 3\n' +
|
|||
|
|
'T 65 1 0 30 标签测试\n'+
|
|||
|
|
'LEFT\n'+
|
|||
|
|
'B QR 300 50 M 3 U 6\n'+
|
|||
|
|
'MA,QR B10001001\n'+
|
|||
|
|
'ENDQR\n'+
|
|||
|
|
'FORM\n'+
|
|||
|
|
'PRINT\n';
|
|||
|
|
print(macaddress, printStr4) //mac地址，可以在打印机上看;
|
|||
|
|
}//2维码的Y轴位置在350到500,X轴在500到600
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style>
|
|||
|
|
.input1 {
|
|||
|
|
border: 1px solid;
|
|||
|
|
display: inline;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.item {
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
border-bottom: solid 1rpx blue;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.item2 {
|
|||
|
|
border-bottom: solid 1rpx blue;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
p {
|
|||
|
|
font-size: 12px;
|
|||
|
|
}
|
|||
|
|
</style>
|