skyouc
2025-11-05 a232dcf6d4a59c7c47e06b6619eb7566163f95b4
pages/listing/matnrPalletising.vue
New file
@@ -0,0 +1,402 @@
<template>
   <view class="has-foot">
      <view>
      <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="matnrCode"></input>
            <text class='cuIcon-search text-blue' @click="search"></text>
         </view>
         <view class="cu-form-group">
            <view class="title">ASN单号</view>
            <input placeholder="请输入ASN单号" v-model="asnCode"></input>
         </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>
      <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 " :class="[item.trackCode===barcode&&'act']"
               :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.matnrCode}`}}
                     </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">物料编码:</text>
                     <text class="text-grey ">{{item.maktx}}</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 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.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 - item.qty}}</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%;" :min="0" :max="max" :decimal="2" :step="0.01" v-model="item.receiptQty"
                           ></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: [],
            asnCode: '',
            repeatClick: false,
            isconfirm: false,
            matnrCode:'',
            max: 99999999,
         }
      },
      computed: {
         ...mapState('user', ['dynamicFields']),
         allCount() {
            return this.list.reduce((acc, row) => +row.anfme + acc, 0) || 0
         }
      },
      mounted() {},
      methods: {
         async search() {
            const find = this.list.find(el => el.trackCode === this.barcode);
            find ? this.scrollTo() : this.getDet();
         },
         getDet() {
            let that = this;
            uni.navigateTo({
               url: "../listing/itemSelect",
               success: function(res) {
                  // 通过eventChannel向被打开页面传送数据   向另外一个页面传递值的
                  res.eventChannel.emit('data', {
                     matnrCode: that.matnrCode,
                     asnCode: that.asnCode
                  })
               },
               events: {
                  // 为指定事件添加一个监听器,获取被打开页面传送到当前页面的数据  另外一个页面传过来的
                  backData: function(data) {
                     that.showBackData(data.data)
                  },
               },
            });
         },
         // async getDet() {
         //    let that = this;
         //    const {
         //       code,
         //       data,
         //       msg
         //    } = await request('/asnOrderItem/trackCode', {
         //       matnrCode: that.matnrCode,
         //       asnCode: that.asnCode
         //    }, "post")
         //    if (code === 200) {
         //       data.map(item => {
         //          item.receiptQty = 0;
         //          item.selected = false;
         //       })
         //       // for (var i = 0; i < data.length; i++) {
         //       //    data[i].receiptQty =1;
         //       //    data[i].selected = false;
         //       // }
         //       if(data !== [] || data !== null){
         //       uni.navigateTo({
         //             url: "../listing/itemSelect",
         //             success: function(res) {
         //                // 通过eventChannel向被打开页面传送数据   向另外一个页面传递值的
         //                res.eventChannel.emit('data', {
         //                   item: data
         //                })
         //             },
         //             events: {
         //                // 为指定事件添加一个监听器,获取被打开页面传送到当前页面的数据  另外一个页面传过来的
         //                backData: function(data) {
         //                   that.showBackData(data.data)
         //                },
         //             },
         //          });
         //       }
         //       // this.list = data
         //    } else {
         //       uni.showToast({
         //          title: msg,
         //          icon: "none",
         //          position: 'top'
         //       })
         //    }
         // },
         async getList() {
            if(this.container === '' || this.container === null){
               uni.showToast({
                  title: "容器码为空",
                  icon: "none",
                  position: 'top'
               })
               return ;
            }
            const {
               code,
               data,
               msg
            } = await request('/asnOrderItem/container', {
               barcode: this.container
            })
            if (code === 200) {
               uni.showToast({
                  title: msg,
                  icon: "success",
                  position: 'top'
               })
            } else {
               uni.showToast({
                  title: msg,
                  icon: "none",
                  position: 'top'
               })
            }
         },
         showBackData(data){
            let status ;
            data.map(item => {
               this.list.push(item)
            })
            let oldLength = this.list.length
            this.list = this.list.filter((item, index, self) =>
               self.findIndex(i => (
                  i.id === item.id // 根据id去重
               )) === index && item.isptResult === self[0].isptResult
            );
            let newLength = this.list.length
            if(oldLength > newLength){
               this.showMsg("新明细被过滤,请检查状态")
            }
         },
         showMsg(msg){
            setTimeout(function() {
             uni.showToast({
                icon: "none",
                position: 'top',
                title: msg,
                duration:2000,
             })
            }, 200);
         },
         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() {
            if(this.container === '' || this.container === null){
               uni.showToast({
                  title: "容器码为空",
                  icon: "none",
                  position: 'top'
               })
               return ;
            }
            if(this.list.length ===0 || this.list === null){
               uni.showToast({
                  title: "未添加明细",
                  icon: "none",
                  position: 'top'
               })
               return ;
            }
            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>