<template> <view class="sendOutGoods-wrap"> <view class="sendOutGoods-con"> <!-- <view class="barCode" id="barcode"></view> --> <view class="info-body"> <view class="info partList"> <!-- 补货产品 --> <partList :list="partList" title="补货产品" model="view" fromPage="sendOutGoods" ref="partList" noDataText="暂无产品"></partList> </view> </view> </view> <view class="sendOutGoods-footer"> <u-button v-if="!isAll" @click="scanCode" type="success" :custom-style="customStyle" hover-class="none" shape="circle"> <u-icon name="scan" size="34"></u-icon> 点击扫码 </u-button> <u-button v-else @click="handleOutGoods" :loading="loading" type="success" :custom-style="customStyle" hover-class="none" shape="circle">立即出库</u-button> </view> <!-- 确认弹框 --> <common-modal v-if="confirmModal" :openModal="confirmModal" :title="contTitle?'扫码成功':'扫码失败'" :content="contModal" confirmText="继续扫码" @confirm="modalConfirm" @close="confirmModal=false" /> <!-- 出库确认弹框 --> <common-modal v-if="confirmOutModal" :openModal="confirmOutModal" title="出库" content="此补货单产品已经全部扫描完成,确认出库吗?" confirmText="确认出库" @confirm="modalOutConfirm" @close="confirmOutModal=false" /> <!-- 选择配送方式弹框 --> <choose-type-modal v-if="chooseModal" :openModal="chooseModal" @confirm="modalChooseType" @close="closeChooseType" /> </view> </template> <script> import partList from '@/pages/common/partList.vue' import chooseTypeModal from './chooseTypeModal.vue' import commonModal from '@/pages/common/commonModal.vue' import { getQueryString } from '@/libs/tools' import { shelfReplenishDetailList, shelfReplenishDetailOutScan, shelfReplenishOutStock, shelfReplenishDetail } from '@/api/shelfReplenish' export default { components: { partList, commonModal, chooseTypeModal }, data() { return { loading: false, barcode:null, replenishBillSn: null, shelfSn: null, partList: [], confirmModal: false, customStyle: { borderRadius:'100rpx', fontSize:'30rpx', background: this.$config('primaryColor') }, isAll: false, contTitle: '', contModal: '', confirmOutModal: false, chooseModal: false, mpaasScanModule: null } }, onReady() { // 初始化摄像头 // this.init() }, onLoad(options) { this.replenishBillSn = options.sn this.shelfSn = options.shelfSn this.getPartList() this.getDetail() }, methods: { // 扫码 scanCode(){ // this.mpaasScanModule = uni.requireNativePlugin("Mpaas-Scan-Module") // this.mpaasScanModule.mpaasScan({ // // 扫码识别类型,参数可多选,qrCode、barCode,不设置,默认识别所有 // 'scanType': ['qrCode','barCode'], // // 是否隐藏相册,默认false不隐藏 // 'hideAlbum': false // }, // (ret) => { // // 返回值中,resp_code 表示返回结果值,10:用户取消,11:其他错误,1000:成功 // // 返回值中,resp_message 表示返回结果信息 // // 返回值中,resp_result 表示扫码结果,只有成功才会有返回 // if(ret.resp_code == '1000'){ // this.scanResult(ret.resp_result) // } // }) this.mpaasScanModule = uni.requireNativePlugin("wss-scan") this.mpaasScanModule.scan( { "scanType":["QRCODE","DATAMATRIX"], "scanMode":"Customized", "scanStyle":{ "scanFrameSizePlus":{"width":200,"height":200}, "scanFrameSize":200, "scanLight":"visible", "scanText":"对准物品二维码", "scanTitle":"扫码发货出库", } }, (result) => { console.log(result) if(result.scanStatus == 1){ this.scanResult(result.scanValue) } }) }, // 详情 getDetail(){ shelfReplenishDetail({ sn: this.replenishBillSn }).then(res => { console.log(res) if(res.status == 200 && res.data){ if(res.data.totalQty && res.data.totalScanQty && res.data.totalQty == res.data.totalScanQty){ this.isAll = true }else{ this.isAll = false } }else{ this.isAll = false } }) }, // 立即出库 handleOutGoods(){ if(this.isAll){ this.confirmOutModal = true }else{ this.toashMsg("请全部扫描完成后,再进行出库操作") } }, // 选择配送方式 modalChooseType(data){ const _this = this const arr = [] _this.partList.map((item, index) => { arr.push({ productSn: item.productSn, confirmQty: item.qty, replenishBillDetailSn: item.replenishBillDetailSn, id:item.id }) }) const params = { replenishBillSn: _this.replenishBillSn, detailList: arr, dispatchType: data.dispatchType, remarks: data.remarks, shelfSn: _this.shelfSn } console.log(params) this.loading = true shelfReplenishOutStock(params).then(res => { console.log(res) if (res.status == 200) { _this.toashMsg(res.message) _this.chooseModal = false uni.$emit('refreshBL') uni.$emit("refreshBhList",'WAIT_CHECK') uni.navigateBack({ delta:2 }) }else{ _this.toashMsg(res.message) } this.loading = false }) }, // 确认出库 modalOutConfirm(){ this.confirmOutModal = false this.chooseModal = true }, closeChooseType(){ this.confirmOutModal = false this.chooseModal = false }, // 查询列表 getPartList(){ const _this = this shelfReplenishDetailList({ replenishBillSn: this.replenishBillSn }).then(res => { if(res.status == 200 && res.data){ res.data.map(item =>{ item.confirmQty = item.confirmQty ? Number(item.confirmQty) : 0 }) this.partList = res.data || [] }else{ this.partList = [] } }) }, // 扫码结果 scanResult(qrCode){ const _this = this const pa = qrCode.split("&") console.log(qrCode,pa) shelfReplenishDetailOutScan({ replenishBillSn: _this.replenishBillSn, shelfSn: pa[0], shelfPlaceSn: pa[3], productSn: pa[2] }).then(res => { console.log(res) if(res.status == 200){ // 刷新列表 _this.getPartList() if(res.data && res.data.totalQty && res.data.totalScanQty && res.data.totalQty == res.data.totalScanQty){ _this.isAll = true _this.handleOutGoods() }else{ this.contTitle = 1 this.contModal = '是否继续扫码' this.confirmModal = true } }else{ this.contTitle = 0 this.contModal = res.message this.confirmModal = true } }) }, modalConfirm(){ this.confirmModal = false this.scanCode() }, init(){ // const _this = this // // 初始化 // this.barcode = plus.barcode.create('barcode', [], { // top:'0px', // left:'0px', // width: '100%', // height: '28%', // position: 'static', // frameColor: '#00aaff', // scanbarColor: '#00aaff' // }) // // 设置高度 // const query = uni.createSelectorQuery().in(this); // query.select('#barcode').boundingClientRect(data => { // this.barcode.setStyle({ // height: data.height + 'px' // 调整扫码控件的位置 // }) // }).exec() // // 扫码成功后 // this.barcode.onmarked = function(type, result) { // console.log(type,result) // _this.scanResult(result) // } // // 扫码识别出错 // this.barcode.onerror = function(error){ // console.log(error) // _this.toashMsg("条形码错误!") // _this.barcode.start() // } // const currentWebview = this.$mp.page.$getAppWebview() // currentWebview.append(this.barcode) // this.barcode.start() } } } </script> <style lang="less"> page{ height: 100vh; } .sendOutGoods-wrap{ position: relative; width: 100%; height: 100%; overflow: hidden; padding-bottom: 136upx; .sendOutGoods-con{ width: 100%; height: 100%; overflow: auto; display: flex; flex-direction: column; .barCode{ height: 33%; margin-bottom: 10%; } .info-body{ flex-flow: 1; overflow: auto; height: 100%; } .info{ background-color: #FFFFFF; padding: 10rpx 30upx; font-size: 32rpx; margin-top: 20rpx; } } .sendOutGoods-footer{ padding: 26upx 32upx 30upx; background-color: #fff; position: fixed; left: 0; bottom: 0; width: 100%; box-shadow: 3px 1px 7px #eee; } } </style>