<template>
|
<view>
|
<view class="print-model" :style="style">
|
<view class="display" :style="">
|
<table>
|
<tr>
|
<td>料号</td>
|
<td>{{mat.matnr}}</td>
|
<td colspan="1" rowspan="2" style="width: 150px;">
|
<!-- 二维码 -->
|
<view class="qr-box">
|
<canvas canvas-id="qrcode" v-show="qrShow" style="width: 300rpx;margin: 0 auto;" />
|
</view>
|
</td>
|
</tr>
|
<tr>
|
<td>商品</td>
|
<td colspan="1">{{mat.maktx}}</td>
|
</tr>
|
<tr>
|
<td>日期</td>
|
<td colspan="2">{{time}}</td>
|
</tr>
|
</table>
|
</view>
|
</view>
|
<view>
|
<button @click="toPrint">打印</button>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import uQRCode from '@/static/js/uqrcode.js' //引入uqrcode.js
|
export default {
|
data() {
|
return {
|
style: {
|
height: '3px'
|
},
|
mat: {
|
matnr: '1200128-10055',
|
maktx: 'X5S-4-M03/333'
|
},
|
qrShow: false,
|
time: ''
|
}
|
},
|
onShow() {
|
let getWindowInfo = uni.getWindowInfo()
|
// console.log(getWindowInfo.screenHeight); //屏幕高度
|
// console.log(getWindowInfo.screenWidth); //屏幕宽度
|
// console.log(getWindowInfo.windowHeight); //可操作页面高度
|
// console.log(getWindowInfo.windowWidth); //可操作页面宽度
|
// console.log(getWindowInfo);
|
// console.log('获取窗口信息');
|
let height = (getWindowInfo.screenWidth + 10) * 48 / 74
|
// console.log(height);
|
this.style.height = height + 'px'
|
this.getDate()
|
|
},
|
onLoad(opt) {
|
let that = this
|
const eventChannel = this.getOpenerEventChannel();
|
eventChannel.on('data', function(data) {
|
that.mat = data.data
|
that.qrFun(that.mat.matnr)
|
})
|
|
},
|
methods: {
|
// 打印
|
toPrint() {
|
let that = this
|
uni.navigateTo({
|
url: "../print/printUNI",
|
success: function(res) {
|
// 通过eventChannel向被打开页面传送数据 向另外一个页面传递值的
|
res.eventChannel.emit('data1', {
|
data: that.mat,
|
time: that.time
|
})
|
},
|
events: {
|
// 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据 另外一个页面传过来的
|
acceptDataFromOpenedPage: function(data) {
|
that.matnr = data.data
|
},
|
},
|
|
|
});
|
},
|
//**生成二维码**//
|
qrFun(text) {
|
this.qrShow = true
|
uQRCode.make({
|
canvasId: 'qrcode',
|
componentInstance: this,
|
text: text,
|
size: 150,
|
margin: 0,
|
backgroundColor: '#ffffff',
|
foregroundColor: '#000000',
|
fileType: 'jpg',
|
errorCorrectLevel: uQRCode.errorCorrectLevel.H,
|
success: res => {}
|
})
|
},
|
// 日历
|
getDate() {
|
var dt = new Date();
|
var year,month,day,hours,minutes,seconds,weeks
|
year = dt.getFullYear();
|
month = (dt.getMonth()+1) < 10 ? '0'+ (dt.getMonth()+1) : (dt.getMonth()+1);
|
day = dt.getDate() < 10 ? '0'+dt.getDate() : dt.getDate();
|
hours = dt.getHours() < 10 ? '0' + dt.getHours() : dt.getHours();
|
minutes = dt.getMinutes() < 10 ? '0' + dt.getMinutes() : dt.getMinutes();
|
seconds = dt.getSeconds() < 10 ? '0' + dt.getSeconds() : dt.getSeconds();
|
weeks = dt.getDay();
|
switch (weeks) {
|
case 0: weeks = "星期日"; break;
|
case 1: weeks = "星期一"; break;
|
case 2: weeks = "星期二"; break;
|
case 3: weeks = "星期三"; break;
|
case 4: weeks = "星期四"; break;
|
case 5: weeks = "星期五"; break;
|
default : weeks = "星期六";
|
}
|
this.time = year + "年" + month + "月" + day + "日 " + hours + ":" + minutes + ":" + seconds + " "
|
},
|
}
|
}
|
</script>
|
|
<style>
|
.print-model {
|
width: 100%;
|
/* background-color: #555555; */
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
|
.display {
|
width: 96%;
|
height: 96%;
|
border-radius: 5px;
|
background-color: #FFF;
|
box-shadow: #bdbdbd;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
|
.display-pak {
|
margin: 2%;
|
height: 92%;
|
border: 1px solid #8a8a8a;
|
}
|
|
table {
|
width: 92%;
|
height: 92%;
|
border: 0;
|
border-collapse: collapse;
|
}
|
|
td {
|
border: 1px solid #8a8a8a;
|
text-align: center;
|
}
|
</style>
|
