| <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' </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="cu-list det menu sm-border  padding">  | 
|             <block v-for="(item, index) in list" :key="index">  | 
|                 <view class="cu-bar bg-white solid-bottom margin-top-sm">  | 
|                     <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.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">  | 
|                         <view class="cu-form-group padding-lr-0">  | 
|                             <view class="title text-blue">收货数量:</view>  | 
|                             <input type="number" placeholder="请输入收货数量" v-model="item.receiptQty"></input>  | 
|                         </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" @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: '',  | 
|                 list: [],  | 
|                 range: [],  | 
|                 isconfirm: false  | 
|             }  | 
|         },  | 
|         computed: {  | 
|             ...mapState('user', ['dynamicFields']),  | 
|             allCount() {  | 
|                 return this.list.reduce((acc, row) => +row.qty + acc, 0) || 0  | 
|             }  | 
|         },  | 
|         mounted() {},  | 
|         methods: {  | 
|             async search() {  | 
|                 const {  | 
|                     code,  | 
|                     data,  | 
|                     msg  | 
|                 } = await request('/asnOrderItem/trackCode/' + this.barcode, {}, "get")  | 
|                 if (code === 200) {  | 
|                     const find = this.list.find(el => el.id === data.id);  | 
|                     !find && this.list.push(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() {  | 
|                 const {  | 
|                     code,  | 
|                     data,  | 
|                     msg  | 
|                 } = await request('/waitPakin/unbind', {  | 
|                     items: this.list,  | 
|                     barcode: this.container  | 
|                 })  | 
|                 if (code === 200) {  | 
|                     uni.showToast({  | 
|                         title: '解绑成功'  | 
|                     })  | 
|                     this.list = []  | 
|                     this.barcode = ''  | 
|                     this.isconfirm = false  | 
|                 } else {  | 
|                     uni.showToast({  | 
|                         title: msg,  | 
|                         icon: "none",  | 
|                         position: 'top'  | 
|                     })  | 
|                 }  | 
|   | 
|   | 
|             },  | 
|   | 
|         }  | 
|     }  | 
| </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;  | 
|   | 
|     }  | 
|   | 
|     .item {  | 
|         position: relative;  | 
|         display: flex;  | 
|         min-height: 80upx;  | 
|         align-items: center;  | 
|     }  | 
| </style> |