| <template>  | 
|     <view class="has-foot">  | 
|         <form>  | 
|             <view class="cu-form-group margin-top">  | 
|                 <view class="title">容器号</view>  | 
|                 <input placeholder="请扫描容器号" v-model="container" focus></input>  | 
|                 <text class='cuIcon-search text-blue' @click="getList"></text>  | 
|             </view>              | 
|             <view class="cu-form-group">  | 
|                 <view class="title">物料标签</view>  | 
|                 <input placeholder="请扫描物料标签" v-model="barcode"></input>  | 
|                 <text class='cuIcon-search text-blue' @click="search"></text>  | 
|             </view>  | 
|         </form>  | 
|   | 
|         <view class="flex solid-bottom padding-sm justify-between">  | 
|             <view class="text-blue">物料总类:{{list.length}}</view>  | 
|             <view class="text-blue">组盘总数:{{allCount}}</view>  | 
|         </view>  | 
|   | 
|         <view class="padding-lr margin-top-sm">  | 
|             <block v-for="(item, index) in list" :key="index">  | 
|                 <view class="cu-list det menu sm-border margin-bottom-sm "  | 
|                     :ref="item.trackCode+'ref'">  | 
|                     <view class="cu-bar bg-white solid-bottom ">  | 
|                         <view class="action">  | 
|                             <view class="index">  | 
|                                 {{index+1}}  | 
|                             </view>  | 
|                             <view class="text-blue">  | 
|                                 {{`${item.maktx}`}}  | 
|                             </view>  | 
|                         </view>  | 
|                         <view class="action" v-if="!isconfirm">  | 
|                             <text @click="remove(index)" class="cuIcon-close text-red" style="font-size: 24px;"></text>  | 
|                         </view>  | 
|                     </view>  | 
|                     <view class="cu-item">  | 
|                         <view class="content">  | 
|                             <text class="text-black">ASN:</text>  | 
|                         </view>  | 
|                         <view class="action">  | 
|                             <text class="text-grey ">{{item.asnCode}}</text>  | 
|                         </view>  | 
|                     </view>  | 
|                     <view class="cu-item">  | 
|                         <view class="content">  | 
|                             <text class="text-black">物料条码:</text>  | 
|                         </view>  | 
|                         <view class="action">  | 
|                             <text class="text-grey ">{{item.trackCode}}</text>  | 
|                         </view>  | 
|                     </view>  | 
|                     <view class="cu-item">  | 
|                         <view class="content">  | 
|                             <text class="text-black">供应商批次:</text>  | 
|                         </view>  | 
|                         <view class="action">  | 
|                             <text class="text-grey ">{{item.splrBatch}}</text>  | 
|                         </view>  | 
|                     </view>  | 
|                     <view class="cu-item">  | 
|                         <view class="content">  | 
|                             <text class="text-black">库存批次:</text>  | 
|                         </view>  | 
|                         <view class="action">  | 
|                             <text class="text-grey ">{{item.batch}}</text>  | 
|                         </view>  | 
|                     </view>  | 
|                     <view class="cu-item">  | 
|                         <view class="content">  | 
|                             <text class="text-black">平台行号: <text class="text-grey ">{{item.platformId}}</text></text>  | 
|                         </view>  | 
|                         <view class="content">  | 
|                             <text class="text-black">质检结果: <text class="text-grey ">{{item.inspect}}</text></text>  | 
|                         </view>  | 
|                     </view>  | 
|   | 
|                     <view class="cu-item">  | 
|                         <view class="content">  | 
|                             <text class="text-black">库存单位: <text class="text-grey ">{{item.stockUnit}}</text></text>  | 
|                         </view>  | 
|                         <view class="content">  | 
|                             <text class="text-black">收货数量: <text class="text-grey ">{{item.anfme}}</text></text>  | 
|                         </view>  | 
|                         <view class="content">  | 
|                             <text class="text-black">已上架数量: <text  | 
|                                     class="text-grey ">{{item.workQty + item.qty}}</text></text>  | 
|                         </view>  | 
|                     </view>  | 
|                     <view class="cu-item">  | 
|                         <view class="content">  | 
|                             <text class="text-black">可组盘数量: <text  | 
|                                     class="text-grey ">{{item.anfme - item.workQty}}</text></text>  | 
|                         </view>                          | 
|                     </view>  | 
|                     <view class="cu-item">  | 
|                         <view class="content">  | 
|                             <view class="cu-form-group padding-lr-0">  | 
|                                 <view class="title text-blue"><text  | 
|                                         class="text-red text-xl vertical-middle">*</text>组盘数量:  | 
|                                 </view>  | 
|                                 <uni-number-box style="width: 70%;" :max="max" v-model="item.receiptQty"  | 
|                                     :step='1'></uni-number-box>  | 
|                             </view>  | 
|                         </view>  | 
|                     </view>  | 
|                 </view>  | 
|             </block>  | 
|         </view>  | 
|         <view class="cu-bar btn-group foot">  | 
|             <button class="cu-btn text-blue line-blue shadow" @click="clear">清空</button>  | 
|             <button class="cu-btn bg-blue shadow-blur" :disabled="repeatClick" @click="confirm">组盘</button>  | 
|         </view>  | 
|     </view>  | 
| </template>  | 
|   | 
| <script>  | 
|     import {  | 
|         request  | 
|     } from '../../common/request.js'  | 
|     import {  | 
|         mapState,  | 
|         mapMutations,  | 
|         mapActions,  | 
|         mapGetters  | 
|     } from 'vuex';  | 
|     export default {  | 
|         data() {  | 
|             return {  | 
|                 barcode: '',  | 
|                 container: '',  | 
|                 megreQty: '',  | 
|                 list: [],  | 
|                 range: [],  | 
|                 repeatClick: false,  | 
|                 isconfirm: false,  | 
|                 max: 99999999,  | 
|                   | 
|             }  | 
|         },  | 
|         computed: {  | 
|             ...mapState('user', ['dynamicFields']),  | 
|             allCount() {  | 
|                 return this.list.reduce((acc, row) => +row.anfme + acc, 0) || 0  | 
|             }  | 
|         },  | 
|         mounted() {},  | 
|         methods: {  | 
|             async search() {  | 
|                 if (this.barcode == undefined || this.barcode == '') { | 
|                     uni.showToast({ | 
|                         icon: "none", | 
|                         title: '物料标签不能为空!!' | 
|                     }) | 
|                     return | 
|                 } | 
|                 this.getDet();  | 
|             },  | 
|             async getDet() {  | 
|                 const {  | 
|                     code,  | 
|                     data,  | 
|                     msg  | 
|                 } = await request('/asnOrderItem/trackCode', {  | 
|                     code: this.barcode,  | 
|                 }, "post")  | 
|                 if (code === 200) {  | 
|                     for (var i = 0; i < data.length; i++) {  | 
|                         data[i].receiptQty =1;  | 
|                         data[i].selected = false;                              | 
|                     }  | 
|                     this.list = data  | 
|                 } else {  | 
|                     uni.showToast({  | 
|                         title: msg,  | 
|                         icon: "none",  | 
|                         position: 'top'  | 
|                     })  | 
|                 }  | 
|             },  | 
|             async getList() { | 
|                 if (this.container == undefined || this.container == '') { | 
|                     uni.showToast({ | 
|                         icon: "none", | 
|                         title: '容器号不能为空!!' | 
|                     }) | 
|                     return | 
|                 }  | 
|                 const {  | 
|                     code,  | 
|                     data,  | 
|                     msg  | 
|                 } = await request('/asnOrderItem/container', {  | 
|                     barcode: this.container  | 
|                 })  | 
|                 if (code === 200) {  | 
|                     this.list = data  | 
|                 } else {  | 
|                     uni.showToast({  | 
|                         title: msg,  | 
|                         icon: "none",  | 
|                         position: 'top'  | 
|                     })  | 
|                 }  | 
|             },  | 
|             scrollTo() {  | 
|                 const ref = this.$refs[`${this.barcode}ref`][0];  | 
|                 uni.pageScrollTo({  | 
|                     scrollTop: ref.$el.offsetTop,  | 
|                     duration: 300  | 
|                 })  | 
|             },  | 
|             remove(index) {  | 
|                 this.list.splice(index, 1);  | 
|             },  | 
|             clear() {  | 
|                 this.list = []  | 
|                 this.barcode = ''  | 
|             },  | 
|             next() {  | 
|                 if (this.list.length) {  | 
|                     this.isconfirm = true  | 
|                 } else {  | 
|                     uni.showToast({  | 
|                         icon: "none",  | 
|                         title: '未选物料标签'  | 
|                     })  | 
|                 }  | 
|             },  | 
|             prev() {  | 
|                 this.isconfirm = false  | 
|             },  | 
|             async confirm() {  | 
|                 this.repeatClick = true  | 
|                 const newArr = this.list.map(item => {  | 
|                     return {  | 
|                         ...item,  | 
|                         anfme: item.anfme === null ? 0 : +item.anfme,                          | 
|                     };  | 
|                 });  | 
|   | 
|                 const {  | 
|                     code,  | 
|                     data,  | 
|                     msg  | 
|                 } = await request('/waitPakin/merge', {  | 
|                     items: newArr,  | 
|                     barcode: this.container,  | 
|                 })  | 
|                 if (code === 200) {  | 
|                     uni.showToast({  | 
|                         title: '组盘成功'  | 
|                     })  | 
|                     this.list = []  | 
|                     this.barcode = ''  | 
|                     this.container = ''  | 
|                     this.isconfirm = false  | 
|                 } else {  | 
|                     uni.showToast({  | 
|                         title: msg,  | 
|                         icon: "none",  | 
|                         position: 'top'  | 
|                     })  | 
|                 }  | 
|                 this.repeatClick = false  | 
|             },  | 
|         }  | 
|     }  | 
| </script>  | 
|   | 
| <style>  | 
|     .index {  | 
|         border: 1px solid #e54d42;  | 
|         color: #e54d42;  | 
|         border-radius: 50%;  | 
|         display: block;  | 
|         width: 50rpx;  | 
|         height: 50rpx;  | 
|         line-height: 48rpx;  | 
|         text-align: center;  | 
|         margin-right: 20rpx;  | 
|         font-size: 30rpx;  | 
|     }  | 
|   | 
|     .text-blue {  | 
|         color: #0081ff !important;  | 
|   | 
|     }  | 
|   | 
|     .act {  | 
|         border: 1px solid #e54d42;  | 
|     }  | 
|   | 
|     .item {  | 
|         position: relative;  | 
|         display: flex;  | 
|         min-height: 80upx;  | 
|         align-items: center;  | 
|     }  | 
| </style> |