单号调整

chen.lin

13 小时以前 3e4321e342c1b009dbeea6b186d148148529756a

 pages/rece/other.vue

@@ -1,385 +1,385 @@
<template>

   <view class="has-foot">

      <form>

         <view class="cu-form-group margin-top" v-show="!isconfirm">

            <view class="title">ASN单号</view>

            <input placeholder="请扫描ASN单号" v-model="asncode" focus></input>

            <text class='cuIcon-close text-gray margin-right-xs' v-show="asncode!==''" @click="clearCode"></text>

            <!-- <text class='cuIcon-search text-blue' @click="search"></text> -->

         </view>

         <view class="cu-form-group" v-show="!isconfirm">

            <view class="title">物料编码</view>

            <input placeholder="请扫描物料编码" v-model="barcode"></input>

            <text class='cuIcon-close text-gray margin-right-xs' v-show="barcode!==''" @click="clearBarcode"></text>

            <text class='cuIcon-search text-blue' @click="search"></text>

         </view>

      </form>

      <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.barcode===barcode&&'act']"

               :ref="item.barcode+'ref'">

               <view class="cu-bar bg-white solid-bottom ">

                  <view class="action">

                     <view class="index">

                        {{index+1}}

                     </view>

                     <view class="text-blue">

                        编码:

                        {{`${item.matnr}`}}

                     </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>

                     <text class="text-grey ">{{item.asnCode}}</text>

                  </view>

                  <view class="action">



                  </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">供应商批次:</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.maxQty}}</text></text>

                  </view>

                  <view class="content">

                     <text class="text-black">实时库存: <text class="text-grey ">{{item.stockQty}}</text></text>

                  </view>

               </view> -->

               <view class="cu-item">

                  <view class="content">

                     <text class="text-black">行号: <text class="text-grey ">{{item.platItemId}}</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.purUnit}}</text></text>

                  </view>

         <!--          <view class="content">

                     <text class="text-black">库存单位: <text class="text-grey ">{{item.stockUnit}}</text></text>

                  </view> -->

               </view>

               <view class="cu-item">

                  <view class="content">

                     <text class="black">计划收货数量:<text class="text-grey ">{{item.anfme}}</text></text>

                  </view>



                  <view class="content">

                     <text class="black">已收货数量:<text class="text-grey ">{{item.qty}}</text></text>

                  </view>

               </view>

               <view class="cu-item">

                  <view class="content" v-if="!isconfirm">

                     <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 class="content" v-else>

                     <text class="text-black">收货数量:<text class="text-grey ">{{item.receiptQty}}</text></text>

                  </view>

               </view>

               <view class="cu-item">



                  <view class="content">

                     <text class="text-black">批次:<text class="text-grey ">{{item.splrBatch}}</text></text>

                  </view>

               </view>



               <view class="cu-item">

                  <view class="content" v-if="!isconfirm">

                     <view class="cu-form-group padding-lr-0">

                        <view class="title text-blue">生产日期:</view>

                        <picker mode="date" v-model="item.prodTime" @change="DateChange($event,item)"

                           placeholder="请输入生产日期">

                           <view class="picker text-left">

                              {{item.prodTime|| '请选择日期'}}

                           </view>

                        </picker>

                     </view>

                  </view>

                  <view class="content" v-else>

                     <text class="text-black">生产日期:<text class="text-grey ">{{item.prodTime}}</text></text>

                  </view>

               </view>

               <!-- <view class="cu-item grid  col-1" v-if="!isconfirm">

                  <view v-for="el in dynamicFields" :key="el.id">

                     <view class="cu-form-group padding-lr-0">

                        <view class="title text-blue">{{el.fieldsAlise}}:</view>

                        <input :placeholder='`请输入${el.fieldsAlise}`' v-model="item[el.fields]"></input>

                     </view>

                  </view>

               </view> -->

               <view class="cu-item grid  col-2" v-if="item.extendFields">

                  <view class="item" v-for="el in dynamicFields" :key="el.id">

                     <text class="text-black">{{el.fieldsAlise}}:

                        <text class="text-grey ">{{item.extendFields[el.fields]}}</text></text>

                  </view>

               </view>

            </view>

         </block>

      </view>



      <view class="text-blue text-right padding-lr " v-show="isconfirm">

         本次收货总数量:{{allCount}}

      </view>



      <view class="cu-form-group margin-bottom">

         <view class="title">收货区</view>

         <view style="width: 80%;">

            <uni-data-select style="min-width: 90%; max-width: 90%;" v-model="whAreaId" :localdata="range"

               placement="top" @change="selChange"></uni-data-select>

         </view>

      </view>



      <view class="cu-bar btn-group foot" v-show="!isconfirm">

         <button class="cu-btn text-blue line-blue shadow" @click="clear">清空</button>

         <button class="cu-btn bg-blue shadow-blur" @click="next">下一步</button>

      </view>



      <view class="cu-bar btn-group foot" v-show="isconfirm">

         <button class="cu-btn text-blue line-blue shadow" @click="prev">上一步</button>

         <button class="cu-btn bg-blue shadow-blur" :disabled="repeatClick" @click="confirm(false)">收货</button>

      </view>



   </view>

</template>



<script>

   import {

      request

   } from '../../common/request.js'

   import {

      mapState,

      mapMutations,

      mapActions,

      mapGetters

   } from 'vuex';

   export default {

      data() {

         return {

            asncode: '',

            barcode: '',

            whAreaId: '',

            list: [],

            range: [],

            repeatClick: false,

            isconfirm: false,

            max: 99999999,

         }

      },

      computed: {

         ...mapState('user', ['dynamicFields']),

         ...mapState('user', {

            dynFields: state => state.dynamicFields

         }),

         allCount() {

            return this.list.reduce((acc, row) => +row.receiptQty + acc, 0)

         }



      },

      mounted() {

         this.getRece()

         this.whAreaId = uni.getStorageSync('whAreaId')

      },

      methods: {

         async search() {

            const {

               code,

               data,

               msg

            } = await request('/orders/other', {

               asnCode: this.asncode,

               matnrCode: this.barcode

            })

            if (code === 200) {

               this.list = data

            } else {

               uni.showToast({

                  title: msg,

                  icon: "none",

                  position: 'top'

               })

            }

         },



         clearCode() {

            this.asncode = ''

         },

         clearBarcode() {

            this.barcode = ''

         },

         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 = ''

            this.asncode = ''

            this.whAreaId = ''

            this.range = []

         },

         next() {

            if (this.list.length) {

               this.isconfirm = true

            } else {

               uni.showToast({

                  icon: "none",

                  title: '未选物料标签'

               })

            }

         },

         prev() {

            this.isconfirm = false

         },

         selChange(val) {

            uni.setStorageSync('whAreaId', val)

         },

         async complete(id) {

            this.repeatClick = true

            const {

               code,

               data,

               msg

            } = await request('/complete/' + id)

            if (code === 200) {

               uni.showToast({

                  title: msg,

                  icon: "none",

               })

            } else {

               uni.showToast({

                  title: msg,

                  icon: "none",

               })

            }

            this.repeatClick = false

         },

         async confirm(isCom) {

            if (this.whAreaId === '') {

               uni.showToast({

                  icon: "none",

                  title: '请选择收货区'

               })

            } else {

               console.log(this.dynFields)

               const newArr = this.list.map(item => {

                  return {

                     ...item,

                     receiptQty: item.receiptQty === null ? 0 : +item.receiptQty,

                     // extendFields: this.dynFields.filter(el => el.unique == 1).map(exf => {

                     //    return {

                     //       [`${exf.fields}`]: item[exf.fields]

                     //    }

                     // }).filter(field => Object.values(field)[0] != undefined)

                  };

               }).filter(el => el.receiptQty !== 0);



               const {

                  code,

                  data,

                  msg

               } = await request('/orders/confirm', {

                  receipts: newArr,

                  whAreaId: this.whAreaId

               })

               if (code === 200) {

                  uni.showToast({

                     title: msg,

                     icon: "none",

                  })

                  this.list = []

                  this.barcode = ''

                  this.isconfirm = false

                  isCom && this.complete(data.id)

               } else {

                  uni.showToast({

                     title: msg,

                     icon: "none",

                  })

               }

            }

         },

         async getRece() {				
            const {

               code,

               data,

               msg

            } = await request('/areas/receipt', {}, 'get')

            if (code === 200) {

               this.range = data.map(item => ({

                  value: item.id,

                  text: item.warehouseId$ + "-- " + item.name

               }));

            }

         },

         DateChange(e, item) {

            item.prodTime = e.detail.value

         }

      }

   }

</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;

   }



   .act {

      border: 1px solid #e54d42;

   }



   .text-blue {

      color: #0081ff !important;



   }



   .item {

      position: relative;

      display: flex;

      min-height: 80upx;

      align-items: center;

   }

<template>
   <view class="has-foot">
      <form>
         <view class="cu-form-group margin-top" v-show="!isconfirm">
            <view class="title">WMS单号</view>
            <input placeholder="请扫描WMS单号" v-model="asncode" focus></input>
            <text class='cuIcon-close text-gray margin-right-xs' v-show="asncode!==''" @click="clearCode"></text>
            <!-- <text class='cuIcon-search text-blue' @click="search"></text> -->
         </view>
         <view class="cu-form-group" v-show="!isconfirm">
            <view class="title">物料编码</view>
            <input placeholder="请扫描物料编码" v-model="barcode"></input>
            <text class='cuIcon-close text-gray margin-right-xs' v-show="barcode!==''" @click="clearBarcode"></text>
            <text class='cuIcon-search text-blue' @click="search"></text>
         </view>
      </form>
      <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.barcode===barcode&&'act']"
               :ref="item.barcode+'ref'">
               <view class="cu-bar bg-white solid-bottom ">
                  <view class="action">
                     <view class="index">
                        {{index+1}}
                     </view>
                     <view class="text-blue">
                        编码:
                        {{`${item.matnr}`}}
                     </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>
                     <text class="text-grey ">{{item.asnCode}}</text>
                  </view>
                  <view class="action">

                  </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">供应商批次:</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.maxQty}}</text></text>
                  </view>
                  <view class="content">
                     <text class="text-black">实时库存: <text class="text-grey ">{{item.stockQty}}</text></text>
                  </view>
               </view> -->
               <view class="cu-item">
                  <view class="content">
                     <text class="text-black">行号: <text class="text-grey ">{{item.platItemId}}</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.purUnit}}</text></text>
                  </view>
         <!--          <view class="content">
                     <text class="text-black">库存单位: <text class="text-grey ">{{item.stockUnit}}</text></text>
                  </view> -->
               </view>
               <view class="cu-item">
                  <view class="content">
                     <text class="black">计划收货数量:<text class="text-grey ">{{item.anfme}}</text></text>
                  </view>

                  <view class="content">
                     <text class="black">已收货数量:<text class="text-grey ">{{item.qty}}</text></text>
                  </view>
               </view>
               <view class="cu-item">
                  <view class="content" v-if="!isconfirm">
                     <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 class="content" v-else>
                     <text class="text-black">收货数量:<text class="text-grey ">{{item.receiptQty}}</text></text>
                  </view>
               </view>
               <view class="cu-item">

                  <view class="content">
                     <text class="text-black">批次:<text class="text-grey ">{{item.splrBatch}}</text></text>
                  </view>
               </view>

               <view class="cu-item">
                  <view class="content" v-if="!isconfirm">
                     <view class="cu-form-group padding-lr-0">
                        <view class="title text-blue">生产日期:</view>
                        <picker mode="date" v-model="item.prodTime" @change="DateChange($event,item)"
                           placeholder="请输入生产日期">
                           <view class="picker text-left">
                              {{item.prodTime|| '请选择日期'}}
                           </view>
                        </picker>
                     </view>
                  </view>
                  <view class="content" v-else>
                     <text class="text-black">生产日期:<text class="text-grey ">{{item.prodTime}}</text></text>
                  </view>
               </view>
               <!-- <view class="cu-item grid  col-1" v-if="!isconfirm">
                  <view v-for="el in dynamicFields" :key="el.id">
                     <view class="cu-form-group padding-lr-0">
                        <view class="title text-blue">{{el.fieldsAlise}}:</view>
                        <input :placeholder='`请输入${el.fieldsAlise}`' v-model="item[el.fields]"></input>
                     </view>
                  </view>
               </view> -->
               <view class="cu-item grid  col-2" v-if="item.extendFields">
                  <view class="item" v-for="el in dynamicFields" :key="el.id">
                     <text class="text-black">{{el.fieldsAlise}}:
                        <text class="text-grey ">{{item.extendFields[el.fields]}}</text></text>
                  </view>
               </view>
            </view>
         </block>
      </view>

      <view class="text-blue text-right padding-lr " v-show="isconfirm">
         本次收货总数量:{{allCount}}
      </view>

      <view class="cu-form-group margin-bottom">
         <view class="title">收货区</view>
         <view style="width: 80%;">
            <uni-data-select style="min-width: 90%; max-width: 90%;" v-model="whAreaId" :localdata="range"
               placement="top" @change="selChange"></uni-data-select>
         </view>
      </view>

      <view class="cu-bar btn-group foot" v-show="!isconfirm">
         <button class="cu-btn text-blue line-blue shadow" @click="clear">清空</button>
         <button class="cu-btn bg-blue shadow-blur" @click="next">下一步</button>
      </view>

      <view class="cu-bar btn-group foot" v-show="isconfirm">
         <button class="cu-btn text-blue line-blue shadow" @click="prev">上一步</button>
         <button class="cu-btn bg-blue shadow-blur" :disabled="repeatClick" @click="confirm(false)">收货</button>
      </view>

   </view>
</template>

<script>
   import {
      request
   } from '../../common/request.js'
   import {
      mapState,
      mapMutations,
      mapActions,
      mapGetters
   } from 'vuex';
   export default {
      data() {
         return {
            asncode: '',
            barcode: '',
            whAreaId: '',
            list: [],
            range: [],
            repeatClick: false,
            isconfirm: false,
            max: 99999999,
         }
      },
      computed: {
         ...mapState('user', ['dynamicFields']),
         ...mapState('user', {
            dynFields: state => state.dynamicFields
         }),
         allCount() {
            return this.list.reduce((acc, row) => +row.receiptQty + acc, 0)
         }

      },
      mounted() {
         this.getRece()
         this.whAreaId = uni.getStorageSync('whAreaId')
      },
      methods: {
         async search() {
            const {
               code,
               data,
               msg
            } = await request('/orders/other', {
               asnCode: this.asncode,
               matnrCode: this.barcode
            })
            if (code === 200) {
               this.list = data
            } else {
               uni.showToast({
                  title: msg,
                  icon: "none",
                  position: 'top'
               })
            }
         },

         clearCode() {
            this.asncode = ''
         },
         clearBarcode() {
            this.barcode = ''
         },
         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 = ''
            this.asncode = ''
            this.whAreaId = ''
            this.range = []
         },
         next() {
            if (this.list.length) {
               this.isconfirm = true
            } else {
               uni.showToast({
                  icon: "none",
                  title: '未选物料标签'
               })
            }
         },
         prev() {
            this.isconfirm = false
         },
         selChange(val) {
            uni.setStorageSync('whAreaId', val)
         },
         async complete(id) {
            this.repeatClick = true
            const {
               code,
               data,
               msg
            } = await request('/complete/' + id)
            if (code === 200) {
               uni.showToast({
                  title: msg,
                  icon: "none",
               })
            } else {
               uni.showToast({
                  title: msg,
                  icon: "none",
               })
            }
            this.repeatClick = false
         },
         async confirm(isCom) {
            if (this.whAreaId === '') {
               uni.showToast({
                  icon: "none",
                  title: '请选择收货区'
               })
            } else {
               console.log(this.dynFields)
               const newArr = this.list.map(item => {
                  return {
                     ...item,
                     receiptQty: item.receiptQty === null ? 0 : +item.receiptQty,
                     // extendFields: this.dynFields.filter(el => el.unique == 1).map(exf => {
                     //    return {
                     //       [`${exf.fields}`]: item[exf.fields]
                     //    }
                     // }).filter(field => Object.values(field)[0] != undefined)
                  };
               }).filter(el => el.receiptQty !== 0);

               const {
                  code,
                  data,
                  msg
               } = await request('/orders/confirm', {
                  receipts: newArr,
                  whAreaId: this.whAreaId
               })
               if (code === 200) {
                  uni.showToast({
                     title: msg,
                     icon: "none",
                  })
                  this.list = []
                  this.barcode = ''
                  this.isconfirm = false
                  isCom && this.complete(data.id)
               } else {
                  uni.showToast({
                     title: msg,
                     icon: "none",
                  })
               }
            }
         },
         async getRece() {				
            const {
               code,
               data,
               msg
            } = await request('/areas/receipt', {}, 'get')
            if (code === 200) {
               this.range = data.map(item => ({
                  value: item.id,
                  text: item.warehouseId$ + "-- " + item.name
               }));
            }
         },
         DateChange(e, item) {
            item.prodTime = e.detail.value
         }
      }
   }
</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;
   }

   .act {
      border: 1px solid #e54d42;
   }

   .text-blue {
      color: #0081ff !important;

   }

   .item {
      position: relative;
      display: flex;
      min-height: 80upx;
      align-items: center;
   }
</style>