skyouc
1 天以前 a232dcf6d4a59c7c47e06b6619eb7566163f95b4
pages/check/checkOrder.vue
New file
@@ -0,0 +1,283 @@
<template>
   <view class="has-foot">
      <form >
         <view class="cu-form-group " v-show="!isconfirm">
            <view class="title">盘点单</view>
            <input placeholder="请扫描盘点单号" v-model="barcode" @input="search()" focus></input>
            <text class='cuIcon-close text-gray margin-right-xs' v-show="barcode!==''" @click="clearCode"></text>
         </view>
      </form>
      <view class="cu-list det menu sm-border  padding">
         <block  v-for="(item, index) in list" :key="index">
            <view  class="cu-list det menu  "  @click="clickTaskItem(index)">
            <view class="cu-bar bg-white solid-bottom margin-top-sm">
               <view class="action">
                  <view class="index">
                     {{index+1}}
                  </view>
               </view>
               <view class="content2">
                  <text class="text-gray"><text class="text-black ">{{item.exceStatus$}}</text></text>
               </view>
            </view>
            <view class="cu-item">
               <view class="content">
                  <text class="text-gray">盘点差异单:<text class="text-black ">{{item.orderCode}}</text></text>
               </view>
            </view>
            <view class="cu-item">
               <view class="content">
                  <text class="text-gray">创建时间:<text class="text-black ">{{item.createTime$}}</text></text>
               </view>
            </view>
            <view class="cu-item">
               <view class="content">
                  <text class="text-gray">库存数量:<text class="text-black ">{{item.anfme}}</text></text>
               </view>
               <view class="content">
                  <text class="text-gray">盘点数量:<text class="text-black ">{{item.checkQty}}</text></text>
               </view>
            </view>
            <view class="cu-item">
               <view class="content">
                  <text class="text-gray">盘点类型:<text class="text-black ">{{item.checkType$}}</text></text>
               </view>
            </view>
            <view class="cu-item">
               <view class="content">
                  <progress :percent="Math.trunc((item.checkQty/item.anfme)*100) " show-info stroke-width="3" />
               </view>
            </view>
            </view>
         </block>
      </view>
      <view class="text-blue text-right padding-lr" v-show="isconfirm">
         本次收货总数量:{{allCount}}
      </view>
      <view class="cu-form-group " v-show="isconfirm">
         <view class="title">收货区</view>
         <uni-data-select v-model="whAreaId" :localdata="range" placement="top"
            @change="selChange"></uni-data-select>
      </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>
</template>
<script>
   import {
      request
   } from '../../common/request.js'
   import {
      mapState,
      mapMutations,
      mapActions,
      mapGetters
   } from 'vuex';
   export default {
      data() {
         return {
            isClickItem:false,
            clickItem:'',
            QRbarcode:null,
            barcode: '',
            whAreaId: '',
            list: [],
            range: [],
            isconfirm: false,
            itemStyle: {
                    backgroundColor: '#42b983',
                    borderColor: '#42b983'
            },
         }
      },
      computed: {
         ...mapState('user', ['dynamicFields']),
         allCount() {
            return this.list.reduce((acc, row) => +row.receiptQty + acc, 0)
         }
      },
      mounted() {
         this.search()
      },
      methods: {
         clickTaskItem(index){
            let that = this
            uni.navigateTo({
               url: "./checkOrderItem",
               // 通过eventChannel向被打开页面传送数据
               success: function(res) {
                  res.eventChannel.emit('checkItem', {
                     data: that.list[index]
                  })
               }
            });
         },
         typeChange(e){
            this.typeSelect = e.value
            this.search()
         },
         async search() {
            this.list = []
            // if(this.barcode === '' || this.barcode ===null){
            //    return ;
            // }
            const {
               code,
               data,
               msg
            } = await request('/getCheckList',{
               code:this.barcode
            }
            )
            if (code === 200) {
               if (Object.keys(data).length === 0){
                  uni.showToast({
                     title: "未查询到波次数据",
                     icon: "none",
                     position: 'top'
                  })
               }
               this.list.push(...data)
            }else if(code == 401){
               setTimeout(() => {
                  uni.removeStorageSync('token');
                  uni.reLaunch({
                     url: "/pages/login/login"
                  });
               }, 1000);
            }else {
               uni.showToast({
                  title: msg,
                  icon: "none",
                  position: 'top'
               })
            }
         },
         clearCode() {
            this.barcode = ''
         },
         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
         },
         selChange(val) {
            uni.setStorageSync('whAreaId', val)
         },
         async confirm() {
            const newArr = this.list.map(item => {
               return {
                  ...item,
                  receiptQty: item.receiptQty === null ? 0 : +item.receiptQty
               };
            });
            if (this.whAreaId === '') {
               uni.showToast({
                  icon: "none",
                  title: '请选择收货区'
               })
            } else {
               const {
                  code,
                  data,
                  msg
               } = await request('/orders/confirm', {
                  receipts: newArr,
                  whAreaId: this.whAreaId
               })
               if (code === 200) {
                  uni.showToast({
                     title: '收货成功'
                  })
                  this.list = []
                  this.barcode = ''
                  this.isconfirm = false
               } else {
                  uni.showToast({
                     title: msg,
                     icon: "none",
                     position: 'top'
                  })
               }
            }
         },
         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;
   }
   .text-blue {
      color: #0081ff !important;
   }
   .item {
      position: relative;
      display: flex;
      min-height: 80upx;
      align-items: center;
   }
   .content2 {
      /* background-color: coral; */
      width: 100%;
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: flex-end;
      margin-right: 10px;
      color: #0081ff;
   }
</style>