| <template> | 
|     <view> | 
|         <view class="code"> | 
|             <view class="item"> | 
|                 <view class="code-decs">拣货码:</view> | 
|                 <input type="text" placeholder=" 扫码 / 输入" v-model="pickCode" :focus="pickCodeFocus"  | 
|                     @input="pickCodeFn"  | 
|                     /> | 
|             </view> | 
|         </view> | 
|         <view class="mat-list-title"> | 
|             商品列表 | 
|         </view> | 
|         <scroll-view> | 
|             <view class="list" v-for="(item,i) in dataList" :key="i"> | 
|                 <view class="list-left"> | 
|                     <view class="list-left-item"> | 
|                         <view class="desc">No:</view> | 
|                         <view class="left-item">{{i + 1}}</view> | 
|                     </view> | 
|                     <view class="list-left-item"> | 
|                         <view class="desc">订单号:</view> | 
|                         <view class="left-item"> | 
|                             <uni-tag :text="item.orderNo" type="primary"></uni-tag> | 
|                         </view> | 
|                     </view> | 
|                     <view class="list-left-item"> | 
|                         <view class="desc">箱号:</view> | 
|                         <view class="left-item"> | 
|                             <uni-tag :text="item.containerCode" type="primary"></uni-tag> | 
|                         </view> | 
|                     </view> | 
|                     <view class="list-left-item"> | 
|                         <view class="desc">销售单:</view> | 
|                         <view class="left-item"> | 
|                             <uni-tag :text="item.csocode" type="primary"></uni-tag> | 
|                         </view> | 
|                     </view> | 
|                     <view class="list-left-item"> | 
|                         <view class="desc">行号:</view> | 
|                         <view class="left-item">{{item.isoseq}}</view> | 
|                     </view> | 
|                     <view class="list-left-item"> | 
|                         <view class="desc">料号:</view> | 
|                         <view class="left-item"> | 
|                             <uni-tag :text="item.matnr" type="primary"></uni-tag> | 
|                         </view> | 
|                     </view> | 
|                     <view class="list-left-item"> | 
|                         <view class="desc">名称:</view> | 
|                         <view class="left-item">{{item.maktx}}</view> | 
|                     </view> | 
|                     <view class="list-left-item"> | 
|                         <view class="desc">数量:</view> | 
|                         <view class="left-item">{{item.anfme}}</view> | 
|                     </view> | 
|                     <view class="list-left-item"> | 
|                         <view class="desc">库位号:</view> | 
|                         <view class="left-item">{{item.locNo}}</view> | 
|                     </view> | 
|                 </view> | 
|                 <view class="list-right"> | 
|                     <uni-icons type="compose" color="#9add8b" size="24" @click="revise(item,i)"></uni-icons> | 
|                     <uni-icons type="trash" color="#f58a8a" size="24" @click="remove(item,i,'warn')"></uni-icons> | 
|                 </view> | 
|             </view> | 
|         </scroll-view> | 
|         <!-- 底部操作按钮 --> | 
|         <view class="buttom"> | 
|             <button size="mini" @click="reset('warn')">重置</button> | 
|             <button size="mini" type="primary" @click="combConfirm('warn')">拣货</button> | 
|         </view> | 
|         <!-- 弹窗 --> | 
|         <!-- 修改数量 --> | 
|         <view> | 
|             <uni-popup ref="revise" type="dialog"> | 
|                 <view class="popup"> | 
|                     <!-- 标题 --> | 
|                     <view class="title">修改</view> | 
|                     <view class="popup-item"> | 
|                         <view class="popup-item-left">料号:</view> | 
|                         <view class="popup-item-right"> | 
|                             <input type="text" v-model="matnr1" disabled="true" | 
|                                 style="background-color: #f7f7f7;padding: 0;color: #d5d5d5;"> | 
|                         </view> | 
|                     </view> | 
|                     <!-- <view class="popup-item"> | 
|                         <view class="popup-item-left">批号:</view> | 
|                         <view class="popup-item-right"><input type="text" v-model="batch"></view> | 
|                     </view> --> | 
|                     <!-- <view class="popup-item"> | 
|                         <view class="popup-item-left">重量:</view> | 
|                         <view class="popup-item-right"><input type="text" v-model="weight"></view> | 
|                     </view> --> | 
|                     <view class="popup-item"> | 
|                         <view class="popup-item-left">数量:</view> | 
|                         <view class="popup-item-right" style="border: none;justify-content: center;"> | 
|                             <uni-number-box :value="count" :step='0.01' :max="9999999" color="#747474" @change="changeValue" /> | 
|                         </view> | 
|                     </view> | 
|                     <view class="btn"> | 
|                         <view class="btn-left" @click="reviseClose">取消</view> | 
|                         <view class="btn-right" @click="reviseConfirm()">修改</view> | 
|                     </view> | 
|                 </view> | 
|             </uni-popup> | 
|         </view> | 
|         <!-- 移除确认 --> | 
|         <view> | 
|             <!-- 提示窗示例 --> | 
|             <uni-popup ref="alertDialog" type="dialog"> | 
|                 <uni-popup-dialog :type="msgType" confirmText="移除" :title="title" :content="content" | 
|                     @confirm="removeConfirm" @close="removeClose"></uni-popup-dialog> | 
|             </uni-popup> | 
|         </view> | 
|         <view> | 
|             <!-- 提示信息弹窗 --> | 
|             <uni-popup ref="message" type="message"> | 
|                 <uni-popup-message :type="msgType1" :message="messageText" :duration="2000"></uni-popup-message> | 
|             </uni-popup> | 
|         </view> | 
|         <!-- 确认拣货 --> | 
|         <view> | 
|             <uni-popup ref="combConfirm" type="dialog"> | 
|                 <uni-popup-dialog :type="msgType" cancelText="取消" confirmText="确认" :title="title" :content="content" | 
|                     @confirm="comb" @close="combClose"></uni-popup-dialog> | 
|             </uni-popup> | 
|         </view> | 
|         <!-- 确认重置 --> | 
|         <view> | 
|             <uni-popup ref="resetConfirm" type="dialog"> | 
|                 <uni-popup-dialog :type="msgType" cancelText="取消" confirmText="确认" :title="title" :content="content" | 
|                     @confirm="resetConfirm" @close="resetClose"></uni-popup-dialog> | 
|             </uni-popup> | 
|         </view> | 
|         <view> | 
|             <!-- 提示信息弹窗 --> | 
|             <uni-popup ref="message" type="message"> | 
|                 <uni-popup-message :type="msgType1" :message="messageText" :duration="2000"></uni-popup-message> | 
|             </uni-popup> | 
|         </view> | 
|          | 
|         <view class="keyboard" :class="hidebg" mode="aspectFit" @click="hideKeyboard"> | 
|             <image src="@/static/img/keyboard1.png" style="height: 70%;width: 70%;"></image> | 
|         </view> | 
|     </view> | 
| </template> | 
|   | 
| <script> | 
|     export default { | 
|         data () { | 
|             return { | 
|                 baseUrl: '', | 
|                 token: '', | 
|                 order: '', | 
|                 barcode: '', | 
|                 pickCode: '', | 
|                 dataList: [], | 
|                 count: 0, | 
|                 rowNum: '', | 
|                 matnr: '', | 
|                 matnr1: '', | 
|                 batch: '', | 
|                 weight: '', | 
|                 msgType1: 'success', | 
|                 msgType: 'success', | 
|                 messageText: '', | 
|                 title: '', | 
|                 content: '', | 
|                 barcodeFocus: true, | 
|                 pickCodeFocus: true, | 
|                 matFocus: false, | 
|                 matData: '', | 
|                 removeNum: 0, | 
|                 pickData: '', | 
|                 hide: true, | 
|                 hidebg: 'kb-bgtr' | 
|             } | 
|         }, | 
|         onLoad() { | 
|             // #ifdef APP | 
|             setInterval(()=>{ | 
|                 if (this.hide) { | 
|                     uni.hideKeyboard() | 
|                 } else { | 
|                      | 
|                 } | 
|             },20) | 
|             // #endif | 
|         }, | 
|         onBackPress() { | 
|             this.hide = false | 
|         }, | 
|         onShow() { | 
|             this.baseUrl = uni.getStorageSync('baseUrl'); | 
|             this.token = uni.getStorageSync('token'); | 
|         }, | 
|         methods: { | 
|             hideKeyboard() { | 
|                 this.hide = this.hide ? false : true | 
|                 if (this.hide) { | 
|                     this.hidebg = 'kb-bgtr' | 
|                 } else { | 
|                     this.hidebg = 'kb-bgfa' | 
|                 } | 
|             }, | 
|             pickCodeFn() { | 
|                 let _this = this | 
|                 let pickCode = _this.pickCode.split(';') | 
|                 let orderMat = {} | 
|                 orderMat['orderNo'] = pickCode[0] | 
|                 orderMat['matnr'] = pickCode[1] | 
|                 orderMat['matxr'] = pickCode[2] | 
|                 orderMat['anfme'] = pickCode[3] | 
|                 orderMat['locNo'] = pickCode[4] | 
|                 orderMat['containerCode'] = pickCode[5] | 
|                 orderMat['csocode'] = pickCode[6] | 
|                 orderMat['isoseq'] = pickCode[7] | 
|                 orderMat['wrkNo'] = pickCode[8] | 
|                 _this.dataList.push(orderMat) | 
|                 _this.pickData = orderMat | 
|             }, | 
|             messageToggle(type) { | 
|                 this.msgType1 = type | 
|                 this.$refs.message.open() | 
|             }, | 
|             // 搜索物料 | 
|             findMat() { | 
|                 let that = this | 
|                 var matnr =  that.matnr.split(";") | 
|                 that.order = matnr[0] | 
|                 that.matnr = matnr[1] | 
|                 uni.request({ | 
|                     url: that.baseUrl + '/mat/auth', | 
|                     data: { | 
|                         matnr: that.matnr | 
|                     }, | 
|                     header: { | 
|                         'token': uni.getStorageSync('token') | 
|                     }, | 
|                     success(result) { | 
|                         result = result.data | 
|                         if (result.code === 200 && result.data) { | 
|                             that.matData = result.data | 
|                             that.matnr = '' | 
|                             that.matData['batch'] = '' | 
|                             // if (matnr[2] === null) { | 
|                             //     matnr[2] = '' | 
|                             // } | 
|                             result.data.batch = matnr[2] | 
|                             uni.navigateTo({ | 
|                                 url: "../mat/matSelected", | 
|                                 // 通过eventChannel向被打开页面传送数据 | 
|                                 success: function(res) { | 
|                                     res.eventChannel.emit('mat', { | 
|                                         data: result.data | 
|                                     }) | 
|                                 }, | 
|                                 // 为指定事件添加一个监听器,获取被打开页面传送到当前页面的数据 | 
|                                 events: { | 
|                                     matList: function(data) { | 
|                                         that.checkMat(data.data) | 
|                                     }, | 
|                                 }, | 
|                             }); | 
|                         } else if (result.code == 403) { | 
|                             uni.showToast({ | 
|                                 title: result.msg, | 
|                                 icon: "none", | 
|                                 position: 'top' | 
|                             }) | 
|                             setTimeout(() => { | 
|                                 uni.reLaunch({ | 
|                                     url: '../login/login' | 
|                                 }); | 
|                             }, 1000); | 
|                         } else { | 
|                             uni.showToast({ | 
|                                 title: result.msg, | 
|                                 icon: "none", | 
|                                 position: 'top' | 
|                             }) | 
|                         } | 
|              | 
|                     } | 
|                 }); | 
|              | 
|             }, | 
|             checkMat(mat) { | 
|                 mat['orderNo'] = this.order | 
|                 var len = this.dataList.length | 
|                 var add = true ,sameItem = false | 
|                 for (var i = 0; i < len; i++) { | 
|                     if (mat.orderNo != this.dataList[i].orderNo) { | 
|                         add = true | 
|                         break; | 
|                     } else { | 
|                         if (mat.matnr == this.dataList[i].matnr) { | 
|                             for (var j = 0; j < len; j++) { | 
|                                 if (mat.batch == this.dataList[j].batch) { | 
|                                     sameItem = true | 
|                                 } | 
|                             } | 
|                             // 相同物料 不同批号  新加列表 | 
|                             if (mat.batch != this.dataList[i].batch) { | 
|                                 this.$forceUpdate() // 强制刷新 | 
|                                 if (sameItem) { | 
|                                     add = false | 
|                                 } else { | 
|                                     add = true | 
|                                 } | 
|                                  | 
|                             } else { | 
|                                 // 相同物料相同批号 数量累加 | 
|                                 this.dataList[i].anfme += mat.anfme | 
|                                 this.$forceUpdate() // 强制刷新 | 
|                                 add = false | 
|                             } | 
|                         } | 
|                     } | 
|                      | 
|                 } | 
|                 if (add) { | 
|                     this.dataList.unshift(mat) | 
|                 } | 
|             }, | 
|             combConfirm(type) { | 
|                 this.msgType = type | 
|                 this.title = '警告' | 
|                 this.content = '是否现在拣货!' | 
|                 this.$refs.combConfirm.open() | 
|             }, | 
|             comb() { | 
|                 uni.vibrateShort(); | 
|                 let that = this; | 
|                 if (that.dataList.length === 0) { | 
|                     this.messageText = "请添加商品列表" | 
|                     this.messageToggle('error') | 
|                     return; | 
|                 } | 
|                 for (var i = 0; i < that.dataList.length; i++) { | 
|                     if (that.dataList[i].anfme == 0 || that.dataList[i].anfme == '') { | 
|                         this.messageText = that.dataList[i].matnr + '拣货数量不能为0' | 
|                         this.messageToggle('error') | 
|                         return; | 
|                     } | 
|                 } | 
|                 uni.request({ | 
|                     url: that.baseUrl + '/mobile/node/pakout', | 
|                     data: that.pickData, | 
|                     method: 'POST', | 
|                     header: { | 
|                         'token': uni.getStorageSync('token') | 
|                     }, | 
|                     success(result) { | 
|                         var res = result.data | 
|                         if (res.code === 200) { | 
|                             that.resst(); | 
|                             that.messageText = "拣货成功" | 
|                             that.messageToggle('success') | 
|                         } else if (res.code == 403) { | 
|                             that.messageText = res.msg | 
|                             that.messageToggle('error') | 
|                             setTimeout(() => { | 
|                                 uni.reLaunch({ | 
|                                     url: '../login/login' | 
|                                 }); | 
|                             }, 1000); | 
|                         } else { | 
|                             that.messageText = res.msg | 
|                             that.messageToggle('error') | 
|                         } | 
|                     } | 
|                 }); | 
|             }, | 
|             reset(type) { | 
|                 this.msgType = type | 
|                 this.title = '警告' | 
|                 this.content = '是否重置!' | 
|                 this.$refs.resetConfirm.open() | 
|             }, | 
|             // 确认重置 | 
|             resetConfirm() { | 
|                 this.dataList = [] | 
|                 this.order = '' | 
|                 this.barcode = '' | 
|                 this.matnr = '' | 
|                 this.messageText = "重置完成" | 
|                 this.messageToggle('success') | 
|             }, | 
|             // 取消重置 | 
|             resetClose() { | 
|              | 
|             }, | 
|             // 修改批号 | 
|             revise(item, i) { | 
|                 this.matnr1 = this.dataList[i].matnr | 
|                 this.count = this.dataList[i].anfme | 
|                 this.batch = this.dataList[i].batch | 
|                 this.weight = this.dataList[i].weight | 
|                 this.rowNum = i | 
|                 this.eject() | 
|             }, | 
|             eject(type) { | 
|                 this.type = type | 
|                 this.$refs.revise.open(type) | 
|             }, | 
|             // 列表移除按钮 | 
|             remove(item, i, type) { | 
|                 this.removeNum  = i | 
|                 this.msgType = type | 
|                 this.title = '警告' | 
|                 this.content = '是否移除当前商品!' | 
|                 this.$refs.alertDialog.open(i) | 
|             }, | 
|             // 确认移除 | 
|             removeConfirm(i) { | 
|                 this.messageText = "移除成功" | 
|                 this.messageToggle('success') | 
|                 this.dataList.splice(this.removeNum, 1) | 
|             }, | 
|             reviseConfirm() { | 
|                 this.dataList[this.rowNum].anfme = this.count | 
|                 this.dataList[this.rowNum].batch = this.batch | 
|                 this.dataList[this.rowNum].weight = this.weight | 
|                 this.messageText = "修改成功" | 
|                 this.messageToggle('success') | 
|                 this.$refs.revise.close() | 
|                 this.$forceUpdate() // 强制刷新 | 
|             }, | 
|             reviseClose() { | 
|                 this.$refs.revise.close() | 
|             }, | 
|             changeValue(value) { | 
|                 this.count = value | 
|             }, | 
|             // 清空 | 
|             resst() { | 
|                 this.dataList = [] | 
|                 this.pickCode = '' | 
|                 this.pickCodeFocus = false | 
|                 setTimeout(()=>{ | 
|                     this.pickCodeFocus = true | 
|                 },20) | 
|             }, | 
|             combClose() { | 
|                 this.$refs.combConfirm.close() | 
|             }, | 
|             // 取消移除 | 
|             removeClose() { | 
|                 this.$refs.alertDialog.close() | 
|             }, | 
|         } | 
|     } | 
| </script> | 
|   | 
| <style> | 
|     @import url('../../../static/css/wms.css/wms.css'); | 
|     .list { | 
|         display: flex; | 
|         min-height: 80rpx; | 
|         background-color: #FFF; | 
|         margin: auto 20rpx; | 
|         border-radius: 20rpx; | 
|         box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.2); | 
|     } | 
|     .list:first-child { | 
|         margin-top: 200rpx; | 
|     } | 
|     .list:last-child { | 
|         margin-bottom: 120rpx; | 
|     } | 
|     .code { | 
|         width: 100%; | 
|         position: fixed; | 
|         min-height: 70rpx; | 
|         background-color: #FFF; | 
|         z-index: 10; | 
|     } | 
|     .item { | 
|         display: flex; | 
|         align-items: center; | 
|         height: 70rpx; | 
|         margin-left: 20rpx; | 
|         border-bottom: 1px solid #DCDFE6; | 
|     } | 
|      | 
|     .item input { | 
|         height: 50rpx; | 
|         line-height: 50rpx; | 
|         /* font-family: PingFang SC; uniapp 默认字体不居中 */ | 
|         font-size: 36upx; | 
|         font-family: PingFang SC; | 
|         width: 55vw; | 
|      | 
|     } | 
|      | 
|     .code-decs { | 
|         width: 20vw; | 
|         font-size: 18px; | 
|         color: #303133; | 
|     } | 
|      | 
|     .item-right { | 
|         margin-left: auto; | 
|         margin-right: 20rpx; | 
|     } | 
|      | 
|     .mat-list-title { | 
|         height: 80rpx; | 
|         line-height: 80rpx; | 
|         width: 100%; | 
|         background-color: white; | 
|         position: fixed; | 
|         margin-top: 70rpx; | 
|         z-index: 9; | 
|         /* border-top: 1px solid #DCDFE6; */ | 
|         text-align: center; | 
|         box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.5); | 
|     } | 
| </style> |