| <template> | 
|     <view > | 
|         <scroll-view scroll-y catch:touchmove="touchmove"> | 
|             <view class="square-2"> | 
|                 <view class="square-title"> | 
|                     <view class="title-sign"><view class="sign"></view></view> | 
|                     <view class="title-text"><text>托盘条码</text></view> | 
|                 </view> | 
|                 <view class="square-content"> | 
|                     <view class="content-input"> | 
|                         <input v-model="barcode" type="text" placeholder="扫码 / 输入" maxlength="8"  | 
|                         @input="findBarcode()" :focus="barcodeFocus" @focus="focuss" > | 
|                         <uni-icons type="closeempty" size="20" color="#dadada" @click="removeBarcode()"></uni-icons> | 
|                     </view> | 
|                 </view> | 
|             </view> | 
|             <view class="square-2"> | 
|                 <view class="square-title"> | 
|                     <view class="title-sign"><view class="sign"></view></view> | 
|                     <view class="title-text"><text>货品条码</text></view> | 
|                 </view> | 
|                 <view class="square-content"> | 
|                     <view class="content-input-combox" style="width: 94%;"> | 
|                         <input style="width: 90%;" type="text" v-model="matnr" placeholder="扫码 / 输入" @input="findMat()":focus="focus" | 
|                          @focus="focuss"> | 
|                         <!-- @focus="focuss" --> | 
|                         <uni-icons type="closeempty" size="20" color="#dadada" @click="removeMatnr()"></uni-icons> | 
|                     </view> | 
|                 </view> | 
|             </view> | 
|              | 
|             <view class="square-1"> | 
|                 <view class="square-title"> | 
|                     <view class="title-sign"><view class="sign"></view></view> | 
|                     <view class="title-text"><text>商品列表</text></view> | 
|                 </view> | 
|             </view> | 
|             <view class="square-none" v-show="matList.length === 0"> | 
|                 <view class="v-show">暂无更多数据...</view> | 
|             </view> | 
|             <checkbox-group @change="checkbox"> | 
|                 <view v-for="(item,index) in matList" :key="index" class="data-list bg-false" :class="'bg-'+item.checked" > | 
|                     <view class="data-list-left"> | 
|                         <view class="matnr" :style="item.color">No:{{listLen-index}}</view> | 
|                         <view class="matnr" :style="item.color">{{item.matnr}}-{{item.batch}}</view> | 
|                     </view> | 
|                     <view class="data-list-right"> | 
|                         <uni-icons type="trash" size="20" color="#a5a5a5" @click="remove(item,index)"></uni-icons> | 
|                     </view> | 
|                 </view> | 
|             </checkbox-group> | 
|         </scroll-view> | 
|         <view class="footer flex justify-around"> | 
|             <view> | 
|                 <button class="cu-btn lg" @click="resst()">重置</button> | 
|             </view> | 
|             <view> | 
|                 <button class="cu-btn lg pakin-btn bg-blue" @click="comb()">确认</button> | 
|             </view> | 
|         </view> | 
|         <view> | 
|             <!-- 提示信息弹窗 --> | 
|             <uni-popup ref="message" type="message"> | 
|                 <uni-popup-message :type="msgType" :message="messageText" :duration="2000"></uni-popup-message> | 
|             </uni-popup> | 
|         </view> | 
|     </view> | 
| </template> | 
|   | 
| <script> | 
|     import permision from "@/common/permission.js" | 
|     export default { | 
|         data() { | 
|             return { | 
|                 barcode: '', | 
|                 barcodeFocus:true, | 
|                 focus:false, | 
|                 type: 'center', | 
|                 searchBox: 'hide', | 
|                 pick:'hide', | 
|                 matnr:'', | 
|                 matList:[{matnr:'1101842-10000',batch:'22047515999',color:{color:'red'}}], | 
|                 // matList:[], | 
|                 result: '', | 
|                 siteList:[], | 
|                 desc:'', | 
|                 staNoList:[], | 
|                 satNo:'', | 
|                 listLen:0, | 
|                 msgType: 'success', | 
|                 messageText: '这是一条成功提示', | 
|                 fontColor:{color:'red'} | 
|             } | 
|         }, | 
|         onReady() { | 
|             setInterval(function(){ | 
|                 // console.log(this.matList) | 
|                 // this.getMatListLen() | 
|             },1000) | 
|         }, | 
|         mounted(){ | 
|             const UIP = uni.getStorageSync('UIP'); | 
|             this.baseIP = UIP; | 
|             const UPORT = uni.getStorageSync('UPORT'); | 
|             this.basePORT = UPORT | 
|             this.getOutBound(); | 
|              | 
|         }, | 
|         methods: { | 
|             messageToggle(type) { | 
|                 this.msgType = type | 
|                 this.messageText = `这是一条${type}消息提示` | 
|                 this.$refs.message.open() | 
|             }, | 
|             choseStaNo() { | 
|                 for (var i = 0;i < this.staNoList.length; i++) { | 
|                     if (this.desc == this.staNoList[i].desc) { | 
|                         this.staNo = this.staNoList[i].siteId | 
|                     }  | 
|                 } | 
|             }, | 
|             getMatListLen() { | 
|                 // this.listLen = this.matList.length; | 
|             }, | 
|             focuss() { | 
|                 // uni.hideKeyboard() | 
|             }, | 
|             resst() { | 
|                 this.matList = [] | 
|                 this.barcode = '' | 
|                 this.matnr = '' | 
|                 this.desc = '' | 
|                 uni.vibrateShort(); | 
|             }, | 
|             removeBarcode() { | 
|                 this.barcode = '' | 
|                 uni.vibrateShort();     | 
|                 this.barcodeFocus = false; | 
|                 this.$nextTick(function() { | 
|                     this.barcodeFocus = true; | 
|                 }); | 
|             }, | 
|             removeMatnr() { | 
|                 this.matnr = '' | 
|                 uni.vibrateShort(); | 
|                 this.focus = false; | 
|                 this.$nextTick(function() { | 
|                     this.focus = true; | 
|                 }); | 
|             }, | 
|             remove(item,index) { | 
|                 this.matList.splice(index,1); | 
|                 this.listLen = this.matList.length | 
|                 this.messageToggle('success') | 
|                 this.messageText = '删除成功' | 
|                 uni.vibrateShort(); | 
|             }, | 
|             comb() { | 
|                 uni.vibrateShort(); | 
|                 let that = this; | 
|                 uni.showLoading(); | 
|                 uni.request({ | 
|                     url: that.baseHttp + that.baseIP + ':' +that.basePORT + that.baseUrl + '/mobile/pakout/confirm/auth', | 
|                     data: that.matList, | 
|                     method: 'POST', | 
|                     header: { | 
|                         'token':uni.getStorageSync('token') | 
|                     }, | 
|                     success(result) { | 
|                         uni.showLoading(); | 
|                         var res = result.data | 
|                         if (res.code === 200) { | 
|                             uni.showToast({ | 
|                                 title: res.msg, | 
|                                 position: 'bottom', | 
|                                 duration: 1000 | 
|                             }); | 
|                             that.matList = [] | 
|                             that.barcode = '' | 
|                             that.matnr = '' | 
|                             that.desc = '' | 
|                         } else if (res.code == 403) { | 
|                             uni.showToast({title: res.msg, icon: "none", position: 'top'}) | 
|                             setTimeout(() => { | 
|                                 uni.reLaunch({ | 
|                                     url: '../login/login' | 
|                                 }); | 
|                             }, 1000); | 
|                         } else { | 
|                             uni.showToast({title: res.msg, icon: "none",position: 'top'}) | 
|                         } | 
|                     } | 
|                 }); | 
|             }, | 
|             selectMat() { | 
|                 let that = this | 
|                 uni.vibrateShort(); | 
|                 uni.showLoading(); | 
|                 uni.navigateTo({ | 
|                     url: "matSelect", | 
|                     events: { | 
|                         // 为指定事件添加一个监听器,获取被打开页面传送到当前页面的数据 | 
|                         acceptDataFromOpenedPage: function(data) { | 
|                             that.matnr = data.data | 
|                             that.findMat(that.matnr) | 
|                         }, | 
|                       }, | 
|                       success: function(res) { | 
|                         // 通过eventChannel向被打开页面传送数据 | 
|                         res.eventChannel.emit('acceptDataFromOpenerPage', {baseIP:that.baseIP, basePORT:that.basePORT }) | 
|                       } | 
|                 }); | 
|                 that.matnr = '' | 
|             }, | 
|             findMat() { | 
|                 let that = this | 
|                 uni.request({ | 
|                     url: that.baseHttp + that.baseIP + ':' +that.basePORT + that.baseUrl + '/mobile/pakout/query/auth/v2', | 
|                     data: { | 
|                         staNo:that.staNo, | 
|                         matnr:that.matnr | 
|                     }, | 
|                     header: { | 
|                         'token':uni.getStorageSync('token') | 
|                     }, | 
|                     success(result) { | 
|                         var res = result.data; | 
|                         if(res.code === 200 ) { | 
|                             if(res.data) { | 
|                                 for(let i = 0;i<that.matList.length;i++) { | 
|                                     for (let j = 0;j < res.data.length; j++) { | 
|                                         if(JSON.stringify(that.matList[i]) === JSON.stringify(res.data[j])) { | 
|                                             res.data.splice(j,1) | 
|                                         } | 
|                                     } | 
|                                 } | 
|                                 that.matList = res.data.concat(that.matList) | 
|                                 that.listLen = that.matList.length; | 
|                                 that.focus = false; | 
|                                 that.$nextTick(function() { | 
|                                     that.focus = true; | 
|                                 }); | 
|                                 that.matnr = '' | 
|                             } | 
|                         } else if (res.code == 403) { | 
|                             uni.showToast({title: res.msg, icon: "none", position: 'top'}) | 
|                             setTimeout(() => { | 
|                                 uni.reLaunch({ | 
|                                     url: '../login/login' | 
|                                 }); | 
|                             }, 1000); | 
|                         } else { | 
|                             uni.showToast({title: res.msg, icon: "none",position: 'top'}) | 
|                         } | 
|                          | 
|                     } | 
|                 }); | 
|             }, | 
|             addMatList(mat) { | 
|                 console.log(mat) | 
|                 if (this.matList.length == 0){ | 
|                      | 
|                     // this.matList.push(mat[0]) | 
|                     // this.matList.prototype.push.apply(mat) | 
|                 } else { | 
|                      | 
|                     let toUnshift = true | 
|                     for (var i = 0; i < this.matList.length; i++) { | 
|                         let matnr = this.matList[i].matnr | 
|                         if (matnr == this.matList[i].matnr) { | 
|                             // this.messageToggle('warn') | 
|                             // this.messageText = matnr + '已经扫描,请勿重复扫描' | 
|                             toUnshift = false | 
|                         } | 
|                     } | 
|                     if (toUnshift) { | 
|                         this.matList.unshift(mat[0]) | 
|                     } | 
|                      | 
|                 } | 
|                 console.log(this.matList) | 
|             }, | 
|             findBarcode() { | 
|                 let that = this | 
|                 uni.request({ | 
|                     url: that.baseHttp + that.baseIP + ':' +that.basePORT + that.baseUrl + '/mobile/pakout/query/auth', | 
|                     data: { | 
|                         barcode:that.barcode | 
|                     }, | 
|                     header: { | 
|                         'token':uni.getStorageSync('token'), | 
|                          | 
|                     }, | 
|                     success(result) { | 
|                         var res = result.data; | 
|                         if(res.data) { | 
|                             for(let i = 0;i<that.matList.length;i++) { | 
|                                 for (let j = 0;j < res.data.length; j++) { | 
|                                     if(JSON.stringify(that.matList[i]) === JSON.stringify(res.data[j])) { | 
|                                         res.data.splice(j,1) | 
|                                     } | 
|                                 } | 
|                             } | 
|                             that.matList = res.data.concat(that.matList) | 
|                         } | 
|                         that.listLen = that.matList.length; | 
|                     } | 
|                 }); | 
|                  | 
|             }, | 
|             getOutBound() {         // 获取出库口 | 
|                 let that = this | 
|                 uni.request({ | 
|                     url: that.baseHttp + that.baseIP + ':' +that.basePORT + that.baseUrl + '/available/take/site', | 
|                     method: 'POST', | 
|                     header: { | 
|                         'token':uni.getStorageSync('token') | 
|                     }, | 
|                     success(result) { | 
|                         var res = result.data | 
|                         if (res.code === 200) { | 
|                             for (var i = 0; i < res.data.length; i++){ | 
|                                 that.siteList.push(res.data[i].desc) | 
|                             } | 
|                             that.staNoList = res.data | 
|                         } else if (res.code == 403) { | 
|                             uni.showToast({title: res.msg, icon: "none", position: 'top'}) | 
|                             setTimeout(() => { | 
|                                 uni.reLaunch({ | 
|                                     url: '../login/login' | 
|                                 }); | 
|                             }, 1000); | 
|                         } else { | 
|                             uni.showToast({title: res.msg, icon: "none",position: 'top'}) | 
|                         } | 
|                     }, | 
|                 }); | 
|             }, // getOutBound | 
|             getCheckDetl() {   // 获取出库口货物信息 | 
|                 let that = this | 
|                  | 
|             }, // getCheckDetl | 
|             change(e) { | 
|             }, | 
|             toggle(type) { | 
|                 this.type = type | 
|                 // open 方法传入参数 等同在 uni-popup 组件上绑定 type属性 | 
|                 this.$refs.goodsSearch.open(type) | 
|             }, | 
|             checkbox: function (e) { | 
|                 var items = this.data, | 
|                     values = e.detail.value; | 
|                 for (var i = 0, lenI = items.length; i < lenI; ++i) { | 
|                     const item = items[i] | 
|                     item.id = item.id + '' | 
|                     if(values.indexOf(item.id) >= 0){ | 
|                         this.$set(item,'checked',true) | 
|                     }else{ | 
|                         this.$set(item,'checked',false) | 
|                     } | 
|                 } | 
|                 if (values.length == items.length) { | 
|                     this.check = true | 
|                     this.checkText = "取消全选" | 
|                 } else { | 
|                     this.check = false | 
|                     this.checkText = "全选" | 
|                 } | 
|                 uni.vibrateShort(); | 
|             }, | 
|         } | 
|     } | 
| </script> | 
|   | 
| <style> | 
|     /* @import "../../colorui/main.css"; | 
|     @import "../../colorui/icon.css"; */ | 
|      | 
|     .pak-seach-box { | 
|         background-color: #FFFFFF; | 
|         margin: 15rpx 15rpx 0rpx 15rpx; | 
|         width: 96%; | 
|         height: 150rpx; | 
|         border-radius: 20rpx; | 
|     } | 
|     .box-top{ | 
|         display: block; | 
|         height: 60rpx; | 
|         width: 720rpx; | 
|     } | 
|     .color-block-blue { | 
|         background-color: #1E9FFF; | 
|         display: inline-block; | 
|         float: left; | 
|         margin: 15rpx 15rpx 0 15rpx; | 
|         width: 12rpx; | 
|         height: 40rpx; | 
|         border: 5rpx solid #1E9FFF; | 
|         border-radius: 20rpx; | 
|     } | 
|     .title { | 
|         display: inline-block; | 
|         float: left; | 
|         font-size: 34rpx; | 
|         font-weight: 700; | 
|         height: 50rpx; | 
|         line-height: 50rpx; | 
|         margin-top: 10rpx; | 
|     } | 
|     .box-buttom { | 
|         display: inline-block; | 
|         background-color: #f0f0f0; | 
|         width: 65%; | 
|         height: 60rpx; | 
|         border-radius: 20rpx; | 
|         margin: 15rpx 15rpx 0rpx 15rpx; | 
|     } | 
|     .box-buttom input { | 
|         width: 75%; | 
|         float: left; | 
|         margin: 8rpx 10rpx 0rpx 25rpx; | 
|     } | 
|     .box-buttom .search-icon{ | 
|         width: 60rpx; | 
|         height: 60rpx; | 
|         float: right; | 
|         margin-top: 5rpx; | 
|         margin-right: 10rpx; | 
|     } | 
|      | 
|     /* .pak-seach-box input { | 
|         background-color: #ededed; | 
|         border: 1rpx solid #d8d8d8; | 
|         display: inline-block; | 
|         border-radius: 20rpx; | 
|         float: left; | 
|         width: 70%; | 
|         height: 60rpx; | 
|         line-height: 60rpx; | 
|         margin: 15rpx 15rpx 0rpx 15rpx; | 
|         padding-left: 20rpx; | 
|     } */ | 
|     .pak-seach-box button { | 
|         background-color: #1E9FFF; | 
|         color: #ffffff; | 
|         display: inline-block; | 
|         float: right; | 
|         width: 180rpx; | 
|         height: 60rpx; | 
|         margin: 15rpx 15rpx 0rpx 15rpx; | 
|         line-height: 60rpx; | 
|     } | 
|     .pakin-btn { | 
|         background-color: #1E9FFF; | 
|     } | 
|     .pak-data-box { | 
|         background-color: #F1F1F1; | 
|         margin: 15rpx 15rpx 0rpx 15rpx; | 
|         width: 96%; | 
|         height: 70rpx; | 
|         border-radius: 20rpx; | 
|     } | 
|     .pak-data-box .box-top { | 
|         background-color: #FFFFFF; | 
|         height: 70rpx; | 
|         border-radius: 20rpx 20rpx 20rpx 20rpx; | 
|     } | 
|     .bg-false { | 
|         background-color: #FFFFFF; | 
|     } | 
|     .bg-true { | 
|         background-color: #ebebeb; | 
|     } | 
|     .data-list { | 
|         border-bottom: 1px solid #d8d8d8; | 
|         height: 130rpx; | 
|         margin: 15rpx; | 
|         border-radius: 20rpx; | 
|     } | 
|     .data-list:first-child { | 
|         margin-top: 20rpx; | 
|     } | 
|     .data-list:last-child { | 
|         margin-bottom: 200rpx; | 
|     } | 
|     /* .data-list-left { | 
|         display: inline-block; | 
|         float: left; | 
|         text-align: center; | 
|         width: 100rpx; | 
|         height: 180rpx; | 
|         line-height: 180rpx; | 
|     } */ | 
|     .data-list-left { | 
|         width: 550rpx; | 
|         /* background-color: #007AFF; */ | 
|         display: inline-block; | 
|         float: left; | 
|         margin-left: 4%; | 
|         height: 130rpx; | 
|         color: #676767; | 
|     } | 
|     .matnr { | 
|         display: inline-block; | 
|         width: 100%; | 
|         font-size: 14px; | 
|         font-weight: 700; | 
|         padding-top: 15rpx; | 
|         /* height: 130rpx; | 
|         line-height: 130rpx; */ | 
|     } | 
|     .data-list-right { | 
|         /* background-color: #6739B6; */ | 
|         display: inline-block; | 
|         float: right; | 
|         width: 100rpx; | 
|         height: 130rpx; | 
|         line-height: 130rpx; | 
|     } | 
| </style> |