You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
585 lines
14 KiB
585 lines
14 KiB
<template>
|
|
<!-- 采购上架对应的采购收货打印页面-->
|
|
<view class="content" style="padding:0rpx 20rpx 100rpx;min-height: calc(100vh - 120rpx);">
|
|
<view class="tabs-box" v-if="isHaveOn && data1 && data1.inspectDTOList && data1.inspectDTOList.length>0">
|
|
<view @click="tabIndex = 1" :class="tabIndex == 1?'active1' :''" style="padding: 10rpx 0px;">检验指引单</view>
|
|
<view @click="tabIndex = 2" :class="tabIndex == 2?'active1' :''" style="padding: 10rpx 0px;">上架指引单</view>
|
|
</view>
|
|
<view class="" :style="{'paddingTop':isHaveOn && data1 && data1.inspectDTOList && data1.inspectDTOList.length>0?'100rpx': '30rpx'}">
|
|
<view class="box" style="page-break-before:always;" v-if="tabIndex == 1">
|
|
<view class="relative" v-for="(item,index) in showTableInspectDTOList" :key='index'>
|
|
<view class="q">Q</view>
|
|
<table border='1'>
|
|
<thead>
|
|
<tr class='top1'>
|
|
<th>物料代码:</th>
|
|
<th colspan='3'>{{item.itemCode}}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>物料名称</td>
|
|
<td>{{item.itemName}}</td>
|
|
<td>发货单号</td>
|
|
<td>{{data1.asnNumber}}</td>
|
|
</tr>
|
|
<tr>
|
|
<td>供应商</td>
|
|
<td>{{item.supplierCode}}</td>
|
|
<td>供应商批次</td>
|
|
<td>{{item.supplierBatch}}</td>
|
|
</tr>
|
|
<tr>
|
|
<td>到货数量</td>
|
|
<td>{{item.quantityQty}}</td>
|
|
<td>抽检数量</td>
|
|
<td>{{item.sampleQty}}</td>
|
|
</tr>
|
|
<tr>
|
|
<td>到货数量</td>
|
|
<td>{{item.quantityQty}}</td>
|
|
<td>抽检数量</td>
|
|
<td>{{item.sampleQty}}</td>
|
|
</tr>
|
|
<!-- <tr v-if="!item.haveInspectionRequest">
|
|
<td colspan='4' style="color:#ff0000;font-weight: bold;font-size: 15px;">未生成检验申请</td>
|
|
</tr> -->
|
|
</tbody>
|
|
</table>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<com-empty-view v-if="data.length==0"></com-empty-view>
|
|
<!-- 只用于展示页面 -->
|
|
<view class="" v-if="tabIndex == 2">
|
|
<view class="box1" style="margin-bottom: 20rpx;" v-for='(item,index) in showTableSubList' :key='index'>
|
|
<view class="top">
|
|
<view class="mb-kw">
|
|
目标库位：<view>{{item.toLocationCode}}</view>
|
|
</view>
|
|
<view class="mb-bo">
|
|
<view class="mb-left">
|
|
<view class="mb-text">
|
|
物料号：<view>{{item.itemCode}}</view>
|
|
</view>
|
|
<view class="mb-text">
|
|
托包装号：<view>{{item.packingNumber}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="mb-right">
|
|
<view class="mb-text">
|
|
数量：<view>{{item.qty}}{{item.uom}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="" style="position: fixed;width: 100%;bottom: 0rpx;left: 0px;">
|
|
<button @click="printImage" v-if="tabIndex == 1 && data1.inspectDTOList && data1.inspectDTOList.length>0"
|
|
style='background:rgb(60, 156, 255) !important ;color: white;margin-top: 80rpx;'> 打印检验指引单
|
|
</button>
|
|
<button @click="printImage" v-if="tabIndex == 2&&isHaveOn && data.sublist && data.sublist.length>0"
|
|
style='background:rgb(60, 156, 255) !important ;color: white;margin-top: 80rpx;'> 打印上架指引单
|
|
</button>
|
|
</view>
|
|
|
|
<comMessage ref="comMessage"></comMessage>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
getJimuPutawayJobDetail,
|
|
queryInspectionFreeFlag
|
|
} from '@/api/request2.js';
|
|
import {
|
|
dateFormat
|
|
} from '@/common/basic.js';
|
|
// 打印页面的模板
|
|
const htmlFileUrl = '/hybrid/html/pointPutawayJob.html';
|
|
// 打印页面的模板
|
|
const htmlFileUrl1 = '/hybrid/html/purchaseReceiptJob.html';
|
|
import {
|
|
pathToBase64
|
|
} from "../../api/img-to-base64.js" //引入解压后的js文件，这里我重新命名了文件名
|
|
// #ifdef APP
|
|
var testModule = uni.requireNativePlugin("TestModule")
|
|
// #endif
|
|
|
|
export default {
|
|
name: 'pointPutawayJob',
|
|
data() {
|
|
return {
|
|
data: {
|
|
sublist: []
|
|
},
|
|
newHtmlContent: '', //打印传入的html
|
|
newHtmlContent1: '', //打印传入的html
|
|
isLoadFinish: false,
|
|
ids: '',
|
|
tabIndex: 1,
|
|
data1: '',
|
|
currentPage: 1,
|
|
pageSize: 3,
|
|
showTableSubList: [],
|
|
showTableInspectDTOList: [],
|
|
|
|
currentPage1: 1,
|
|
pageSize1: 20,
|
|
number: '',
|
|
isHaveOn: false,//显示上架指引单
|
|
// isHaveInspect:false,//显示检验指引单
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
// #ifdef APP
|
|
// 打印
|
|
printImage() {
|
|
if (this.tabIndex == 1) {
|
|
testModule.doHTMLPrint(this.newHtmlContent1)
|
|
} else {
|
|
testModule.doHTMLPrint(this.newHtmlContent)
|
|
}
|
|
},
|
|
// 读取html文件
|
|
readFile(path, callback) {
|
|
plus.io.resolveLocalFileSystemURL(path, function(entry) {
|
|
entry.file(function(file) {
|
|
var reader = new plus.io.FileReader();
|
|
reader.onloadend = function(e) {
|
|
callback(e.target.result);
|
|
};
|
|
reader.readAsText(file);
|
|
}, function(e) {
|
|
console.log("读取文件失败：" + e.message);
|
|
});
|
|
}, function(e) {
|
|
console.log("获取图片资源失败：" + e.message);
|
|
});
|
|
},
|
|
// #endif
|
|
formatDate(val) {
|
|
return dateFormat(val)
|
|
},
|
|
// 获取采购上架检验html
|
|
getPointPutawayJobHtml() {
|
|
this.$nextTick(async () => {
|
|
let str = ''
|
|
this.readFile(htmlFileUrl, (htmlContent) => {
|
|
this.newHtmlContent = htmlContent
|
|
this.data.sublist.forEach(item => {
|
|
str += `<div class="box" style="page-break-before:always;" ><br />
|
|
<div class="top">
|
|
<div class="mb-kw">
|
|
目标库位：<div>${item.toLocationCode}</div>
|
|
</div>
|
|
<div class="mb-bo">
|
|
<div class="mb-left">
|
|
<div class="mb-text">
|
|
物料号：<div>${item.itemCode}asjkdhfksjahfkljashfklsdh</div>
|
|
</div>
|
|
<div class="mb-text">
|
|
托包装号：<div>${item.packingNumber}</div>
|
|
</div>
|
|
</div>
|
|
<div class="mb-right">
|
|
<div class="mb-text">
|
|
数量：<div>${item.qty}${item.uom}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`
|
|
})
|
|
this.newHtmlContent = this.newHtmlContent.replace(
|
|
"mainBody", str); //替换物品代码
|
|
});
|
|
|
|
})
|
|
},
|
|
// 获取采购收货指引单html
|
|
getPurchaseReceiptJobHtml() {
|
|
this.$nextTick(async () => {
|
|
let str = ''
|
|
this.readFile(htmlFileUrl1, (htmlContent) => {
|
|
this.newHtmlContent1 = htmlContent
|
|
this.data1.inspectDTOList.forEach(item => {
|
|
// if(!item.haveInspectionRequest){
|
|
// str += `
|
|
// <div class="box" style="page-break-before:always;"><br />
|
|
// <div class="relative" >
|
|
// <div class="q">Q</div>
|
|
// <table border='1'>
|
|
// <thead>
|
|
// <tr class='top1'>
|
|
// <th>物料代码:</th>
|
|
// <th colspan='3'>${item.itemCode}</th>
|
|
// </tr>
|
|
// </thead>
|
|
// <tbody>
|
|
// <tr>
|
|
// <td>物料名称</td>
|
|
// <td>${item.itemName}</td>
|
|
// <td>发货单号</td>
|
|
// <td>${this.data1.asnNumber}</td>
|
|
// </tr>
|
|
// <tr>
|
|
// <td>供应商</td>
|
|
// <td>${item.supplierCode}</td>
|
|
// <td>供应商批次</td>
|
|
// <td>${item.supplierBatch}</td>
|
|
// </tr>
|
|
// <tr>
|
|
// <td>到货数量</td>
|
|
// <td>${item.quantityQty}</td>
|
|
// <td>抽检数量</td>
|
|
// <td>${item.sampleQty}</td>
|
|
// </tr>
|
|
// <tr>
|
|
// <td colspan='4' style="color:#ff0000;font-weight: bold;font-size: 15px;">未生成检验申请</td>
|
|
// </tr>
|
|
// </tbody>
|
|
// </table>
|
|
// </div>
|
|
// </div>
|
|
// `
|
|
// }else{
|
|
str += `
|
|
<div class="box" style="page-break-before:always;"><br />
|
|
<div class="relative" >
|
|
<div class="q">Q</div>
|
|
<table border='1'>
|
|
<thead>
|
|
<tr class='top1'>
|
|
<th>物料代码:</th>
|
|
<th colspan='3'>${item.itemCode}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>物料名称</td>
|
|
<td>${item.itemName}</td>
|
|
<td>发货单号</td>
|
|
<td>${this.data1.asnNumber}</td>
|
|
</tr>
|
|
<tr>
|
|
<td>供应商</td>
|
|
<td>${item.supplierCode}</td>
|
|
<td>供应商批次</td>
|
|
<td>${item.supplierBatch}</td>
|
|
</tr>
|
|
<tr>
|
|
<td>到货数量</td>
|
|
<td>${item.quantityQty}</td>
|
|
<td>抽检数量</td>
|
|
<td>${item.sampleQty}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
`
|
|
// }
|
|
|
|
})
|
|
this.newHtmlContent1 = this.newHtmlContent1.replace(
|
|
"mainBody", str); //替换物品代码
|
|
});
|
|
|
|
})
|
|
},
|
|
getTableSubList() {
|
|
if (this.data.sublist.length > this.pageSize) {
|
|
const array = this.data.sublist.slice(
|
|
(this.currentPage - 1) * this.pageSize,
|
|
this.currentPage * this.pageSize
|
|
)
|
|
if (array.length > 0) {
|
|
this.showTableSubList = [...this.showTableSubList, ...array]
|
|
this.currentPage += 1
|
|
}
|
|
} else {
|
|
this.showTableSubList = this.data.sublist
|
|
}
|
|
// console.log(233,this.showTableSubList)
|
|
},
|
|
getTableInspectDTOList() {
|
|
if (this.data1.inspectDTOList.length > this.pageSize1) {
|
|
const array = this.data1.inspectDTOList.slice(
|
|
(this.currentPage1 - 1) * this.pageSize1,
|
|
this.currentPage1 * this.pageSize1
|
|
)
|
|
if (array.length > 0) {
|
|
this.showTableInspectDTOList = [...this.showTableInspectDTOList, ...array]
|
|
this.currentPage1 += 1
|
|
}
|
|
} else {
|
|
this.showTableInspectDTOList = this.data1.inspectDTOList
|
|
}
|
|
console.log(233, this.showTableInspectDTOList)
|
|
},
|
|
showMessage(message) {
|
|
this.$refs.comMessage.showMessage(message, res => {
|
|
if (res) {
|
|
|
|
}
|
|
});
|
|
},
|
|
},
|
|
watch: {
|
|
isLoadFinish: {
|
|
handler(newVal, oldVal) {
|
|
if (newVal == true) {
|
|
// 读取html文件将文件中的内容图换成当前页面的数据
|
|
}
|
|
},
|
|
immediate: true
|
|
|
|
}
|
|
},
|
|
|
|
onLoad(option) {
|
|
if (option.data) {
|
|
this.data = JSON.parse(decodeURIComponent(option.data));
|
|
this.isHaveOn = true
|
|
}
|
|
if (option.number) {
|
|
this.number = option.number;
|
|
}
|
|
},
|
|
async onShow() {
|
|
// 获取上架指引单
|
|
if(this.data.ids){
|
|
await getJimuPutawayJobDetail({
|
|
masterIds: this.data.ids
|
|
}).then(res => {
|
|
this.data.sublist = res.data
|
|
this.getTableSubList()
|
|
})
|
|
}
|
|
// 获取采购收货指引单
|
|
if(this.number){
|
|
await queryInspectionFreeFlag({
|
|
number: this.number
|
|
}).then(async res1 => {
|
|
console.log(444,res1)
|
|
this.data1 = res1.data
|
|
this.data1.inspectDTOList = this.data1.inspectDTOList.filter(item=>item.sampleQty>0)
|
|
if(this.data1&&this.data1.inspectDTOList&&this.data1.inspectDTOList.length == 0){
|
|
this.tabIndex =2
|
|
}
|
|
this.getTableInspectDTOList()
|
|
})
|
|
// .catch(error=>{
|
|
// this.$refs.comMessage.showMessage(error, res => {
|
|
// if (res) {
|
|
|
|
// }
|
|
// });
|
|
// })
|
|
}
|
|
|
|
this.getPointPutawayJobHtml()
|
|
this.getPurchaseReceiptJobHtml()
|
|
},
|
|
onReachBottom() {
|
|
if (this.tabIndex == 1) {
|
|
if (this.showTableInspectDTOList != this.data1.inspectDTOList.length) {
|
|
this.getTableInspectDTOList()
|
|
}
|
|
} else {
|
|
if (this.showTableSubList.length != this.data.sublist.length) {
|
|
this.getTableSubList()
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.box1 {
|
|
font-size: 26rpx;
|
|
/* display: flex; */
|
|
/* padding: 20rpx; */
|
|
border: 1px solid #dedede;
|
|
|
|
}
|
|
|
|
.left {
|
|
border-top: 1px solid #b1b1b1;
|
|
border-left: 1px solid #b1b1b1;
|
|
flex: 1;
|
|
}
|
|
|
|
.left-item {
|
|
display: flex;
|
|
}
|
|
|
|
.label {
|
|
border-bottom: 1px solid #b1b1b1;
|
|
border-right: 1px solid #b1b1b1;
|
|
width: 140rpx;
|
|
padding: 0px 10rpx;
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
}
|
|
|
|
.value {
|
|
border-bottom: 1px solid #b1b1b1;
|
|
border-right: 1px solid #b1b1b1;
|
|
padding: 0px 5px;
|
|
height: 60rpx;
|
|
flex: 1;
|
|
width: 0px;
|
|
display: flex;
|
|
align-items: center;
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
.right {
|
|
width: 50%;
|
|
|
|
border-top: 1px solid #b1b1b1;
|
|
}
|
|
|
|
.image {
|
|
width: 100%;
|
|
height: 301rpx;
|
|
border-bottom: 1px solid #b1b1b1;
|
|
border-top: 1px solid #b1b1b1;
|
|
border-right: 1px solid #b1b1b1;
|
|
}
|
|
|
|
.image img {
|
|
width: calc(100% - 4px);
|
|
height: calc(100% - 4px);
|
|
margin: 4rpx;
|
|
}
|
|
|
|
.mb-kw {
|
|
border-bottom: 1px solid #dedede;
|
|
padding: 20rpx;
|
|
font-size: 30rpx;
|
|
|
|
}
|
|
|
|
.mb-kw view {
|
|
font-weight: bold;
|
|
font-size: 46rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.mb-bo {
|
|
display: flex;
|
|
}
|
|
|
|
.mb-bo .mb-left {
|
|
flex: 1
|
|
}
|
|
|
|
.mb-bo .mb-left .mb-text {
|
|
padding: 20rpx;
|
|
}
|
|
|
|
.mb-bo .mb-left .mb-text:nth-child(1) {
|
|
border-bottom: 1px solid #dedede;
|
|
}
|
|
|
|
.mb-bo .mb-left .mb-text view {
|
|
font-weight: bold;
|
|
font-size: 32rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.mb-bo .mb-right {
|
|
padding: 20rpx;
|
|
width: 260rpx;
|
|
border-left: 1px solid #dedede;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.mb-bo .mb-right .mb-text {
|
|
|
|
width: 100%;
|
|
}
|
|
|
|
.mb-bo .mb-right .mb-text view {
|
|
font-weight: bold;
|
|
font-size: 40rpx;
|
|
text-align: center;
|
|
width: 100%;
|
|
}
|
|
|
|
.top1 th {
|
|
font-weight: bold;
|
|
font-size: 13px;
|
|
padding: 10px;
|
|
}
|
|
|
|
|
|
table {
|
|
border-collapse: collapse;
|
|
border: 1px solid #dedede;
|
|
/* 设置表格的边框 */
|
|
width: 100%
|
|
}
|
|
|
|
th {
|
|
text-align: left;
|
|
padding: 10px;
|
|
}
|
|
|
|
td {
|
|
padding: 10px;
|
|
&:nth-child(2n){
|
|
width:290rpx;
|
|
}
|
|
&:nth-child(2n+1){
|
|
width:160rpx;
|
|
}
|
|
|
|
}
|
|
|
|
.tabs-box {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: 20rpx;
|
|
border-bottom: 2rpx solid rgb(188, 188, 188);
|
|
position: fixed;
|
|
background: white;
|
|
width: 100%;
|
|
left: 0px;
|
|
|
|
view {
|
|
flex: 1;
|
|
text-align: center;
|
|
line-height: 60rpx;
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.active1 {
|
|
color: rgb(60, 156, 255) !important;
|
|
font-weight: bold;
|
|
border-bottom: 4rpx solid rgb(60, 156, 255);
|
|
}
|
|
}
|
|
.relative{
|
|
margin-bottom: 20rpx;
|
|
position: relative;
|
|
}
|
|
|
|
.q{
|
|
position: absolute;
|
|
left: 50%;
|
|
top:50%;
|
|
font-size: 400rpx;
|
|
transform: translate(-50% ,-50%);
|
|
color: rgba(0, 0, 0, 0.1);
|
|
}
|
|
</style>
|