emis-app/pages/print/courierNote.vue
2024-06-04 16:19:30 +08:00

255 lines
7.7 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<tpx-page>
<tpx-layout>
<template v-slot:body>
<view class="pos-abt-all">
<tpx-scroll-view v-model:resObject="resData" :searchParam="searchParam" :getListFun="getListFun"
ref="listRef"
>
<view class="blcok-white-noradius" style="margin-top: 0;">
<u-row justify="between">
<view style="width: 140rpx;" class="font-weight">运单号</view>
<view style="flex:1;">
<tpx-scan-input v-model:value="searchParam.billCode" placeholder="请输入或扫码"
@change="handleScanValChange" iconPos="right"></tpx-scan-input>
</view>
</u-row>
<u-row justify="between" custom-style="margin-top:20rpx;">
<view style="width: 140rpx;" class="font-weight">下单时间</view>
<view style="flex:1;">
<tpx-date-input v-model:value="searchParam._date" placeholder="请选择时间"></tpx-date-input>
</view>
</u-row>
<u-row custom-style="margin-top:20rpx;" justify="end">
<u-row>
<text class="pr-30">是否已打印</text>
<u-switch v-model="searchParam.printFlag" activeValue="1" inactiveValue="0"
active-color="#B12D29" size="34"></u-switch>
</u-row>
</u-row>
<view class="mt-30">
<u-button type="primary" size="large" shape="square" plain="true" @click="handleSearch"
custom-style="height:80rpx;font-size: 30rpx;border-radius: 14rpx;">查询</u-button>
</view>
</view>
<view class="blcok-white-noradius">
<u-row justify="between" custom-style="padding-top:20rpx;">
<view class="com-section">打印配置</view>
<view>
<u-button shape="square" plain="true" @click="handlePreview"
custom-style="width: 200rpx;height:60rpx;font-size: 30rpx;border-radius: 14rpx;">打印预览</u-button>
</view>
</u-row>
<view class="clr-prm mt-20">注意:当打印出来寄件分拨或未端分拨返回为空时,请等待5分钟后再补 打印</view>
<view class="mt-20">
<u-checkbox-group v-model="submitParam.printType" placement="column">
<u-row custom-style="flex-wrap: wrap;">
<u-col span="6" v-for="(item, index) in dicData.emis_print_type">
<u-checkbox size="30" labelSize="30" label-color=":#999" activeColor="#B12D29"
:customStyle="{marginBottom: '20rpx'}"
:label="item.title" :name="item.val"
></u-checkbox>
</u-col>
</u-row>
</u-checkbox-group>
</view>
<u-row custom-style="margin-top:30rpx;">
<view style="width: 200rpx;" class="">子单打印区间</view>
<u-row>
<tpx-input customStyle="width:60rpx;" v-model:value="submitParam.subBillCodeRange[0]" :isWhite="true" placeholder="" type="number"></tpx-input>
<text class="pl-10 pr-10">到</text>
<tpx-input customStyle="width:60rpx;" v-model:value="submitParam.subBillCodeRange[1]" :isWhite="true" placeholder="" type="number"></tpx-input>
</u-row>
</u-row>
</view>
<view class="blcok-white-noradius">
<view class="pb-20 com-section">运单列表</view>
<view class="pb-20">
<u-row>
<u-col span="8">
<u-row @click="handleSelAll">
<view class="com-chk-icon">
<u-checkbox-group>
<u-checkbox size="26" labelSize="26" label-color=":#999" activeColor="#B12D29"
label="" :checked="resData.list.length > 0 && submitParam.billCode.length == resData.list.length"
></u-checkbox>
</u-checkbox-group>
</view>
<text class="font-weight pl-10">运单号</text>
</u-row>
</u-col>
<u-col span="4">
<text class="font-weight">下单时间</text>
</u-col>
</u-row>
</view>
<tpx-checkitems :list="resData.list" v-model:value="submitParam.billCode" v-slot="dlCurrent" type="multiple"
vdataType="array"
>
<view slot class="yditem">
<u-row>
<u-col span="8">
<u-row>
<view class="com-chk-icon">
<u-checkbox-group>
<u-checkbox size="26" labelSize="26" label-color=":#999" activeColor="#B12D29"
label="" :checked="dlCurrent.checked"
></u-checkbox>
</u-checkbox-group>
</view>
<text class="">{{dlCurrent.item.billCode}}</text>
</u-row>
</u-col>
<u-col span="4">
<text class="clr-sub">{{dlCurrent.item.sendDate}}</text>
</u-col>
</u-row>
</view>
</tpx-checkitems>
</view>
</tpx-scroll-view>
</view>
</template>
<template v-slot:footer>
<view class="blcok-white-noradius">
<u-row>
<u-button @click="handleSubmit()" type="primary" size="large" shape="square"
custom-style="height:80rpx;font-size: 30rpx;border-radius: 14rpx;margin: 0 10rpx;">打印</u-button>
</u-row>
</view>
</template>
</tpx-layout>
<tpx-bluetooth-print ref="curPrint"></tpx-bluetooth-print>
</tpx-page>
</template>
<script>
import { debounce } from "@/common/util"
import dayjs from "dayjs"
import * as apiService from "@/common/api"
export default {
props: {
// hasLeftWin: {
// type: Boolean
// }
},
computed: {
dicData() {
return this.$store.getters.dicData
},
},
data() {
let { dicData } = this.$store.getters
return {
submitParam: {
lang: 'zh',
printType: [],
billCode: [],
subBillCodeRange: []
},
yinlTypeList: [
{ title: '中文', val: 'zh' },
{ title: '英文', val: 'en' },
],
searchParam: {
printFlag: '0',
billCode: '',
_date: [],
},
resData: { list: [] }
}
},
onShareAppMessage() {
return {
}
},
onLoad() {
this.initData();
},
onUnload() {
},
methods: {
async getListFun(param){
let cpParam = JSON.parse(JSON.stringify(param))
cpParam['params.beginSendDate'] = cpParam._date[0]
cpParam['params.endSendDate'] = cpParam._date[1]
let res = await apiService.queryPrintListSimple(cpParam)
// list增加新字段
res.rows.map(t=> {
t.val = t.billCode
})
return res
},
initData() {
},
handleScanValChange: debounce(function(val){
}),
handleSearch(){
},
async handleSubmit() {
const imgUrls = await this.getPrintImages()
this.$refs.curPrint.startPrint({
imageUrl: imgUrls.filter(v=> !!v),
paperWidth: 480,
})
},
handleSelAll() {
if(this.submitParam.billCode.length == this.resData.list.length) {
this.submitParam.billCode = []
} else {
this.submitParam.billCode = this.resData.list.map(item=> item.val)
}
},
async getRealGetWaybillPrintData() {
// 请求后端接口
let param = JSON.parse(JSON.stringify(this.submitParam))
param.printType = param.printType.join(',')
param.billCode = param.billCode.join(',')
param.subBillCodeRange = param.subBillCodeRange.join(',')
let res = await apiService.getRealGetWaybillPrintData({ ...param, _loading: true })
return res
},
async getPrintImages() {
let res = await this.getRealGetWaybillPrintData()
const imgUrls = res?.data?.map(t=> t.imageUrl) || []
return imgUrls
},
async handlePreview(){
const imgUrls = await this.getPrintImages()
uni.previewImage({
urls: imgUrls
})
}
}
}
</script>
<style lang="scss">
@import '@/common/uni-nvue.scss';
page {
background-color: #F6F6F6;
height: 100% !important;
}
</style>
<style scoped lang="scss">
.ddhao {
}
.yditem{
padding: 20rpx 0;
border-top: 2px solid #F6F6F6;
}
</style>