#

whycq

2022-09-22 295c9eb2c051406c89dcf975abe7eb9dd2a28c4b

 pages/basics/pickOffLines.vue

@@ -1,8 +1,357 @@
<template>
   <view>
      <scroll-view scroll-y class="scroll-Y">
      <view class="square-2">
         <view class="square-title">
            <view class="title-sign"><view class="sign"></view></view>
            <view class="title-text"><text>拣货单条码</text></view>
         </view>
         <view class="square-content">
            <view class="content-input">
               <input readonly="value" v-model="doc_num" type="text" placeholder="扫码 / 输入" 
               :focus="barcodeFocus" @input="nextInput">
               <uni-icons type="closeempty" size="20" color="#dadada" @click="removeBarcode()"></uni-icons>
            </view>
         </view>
      </view>
      <view class="square-1">
         <view class="square-title">
            <view class="title-sign"><view class="sign"></view></view>
            <view class="title-text"><text>商品列表</text></view>
         </view>
      </view>
      <view class="square-none"  v-show="matList.length === 0">
         <view class="v-show">暂无更多数据...</view>
      </view>
      <view v-for="(item,index) in matList" :key="index" class="data-list bg-false" :class="'bg-'+item.checked" >
         <view class="number indent">
            <text class="text-key">No:</text>
            <text class="text-value">{{index + 1}}</text>
         </view>
			
         <view class="column indent">
            <view class="text-key">
               <text class="text-key">库位号：</text>
               <text class="text-value">{{item.locNo}}</text>
            </view>
            <view class="matkx indent" >
               <text class="text-key">商品名称：</text>
               <text class="text-value">{{item.maktx}}</text>
            </view>
         </view>
			
         <view class="column indent">
            <view class="anfme">
               <text class="text-key">数量：</text>
               <text class="text-value">{{item.anfme}}</text></view>
            <view>
               <button :type="item.btnType" @click="open(index)">{{item.btnText}}</button>
            </view>
         </view>
      </view>
      </scroll-view>
		
      <view class="footer flex justify-around">
         <view>
            <button class="cu-btn lg" @click="resst()">重置</button>
         </view>
         <!-- <view>
            <button class="cu-btn lg pakin-btn bg-blue" @click="comb()">确认</button>
         </view> -->
      </view>
      <!-- 弹出层 -->
      <view class="popup-mask" v-if="popShow">
         <view class="popup">
            <view class="title">拣货信息</view>
            <view class="column">
               <view class="popup-text-key">拣货单号：</view>
               <view>{{doc_num}}</view>
            </view>
            <!-- <view class="column">
               <view class="popup-text-key">货架号：</view>
               <input type="text">
            </view> -->
            <view class="column">
               <view class="popup-text-key">库位号：</view>
               <input type="text" v-model="locNo">
            </view>
            <view class="column event">
               <view class="close" @click="close">取消</view>
               <view class="confirm" @click="confirm()">确认</view>
            </view>
         </view>
      </view>
   </view>
</template>

<script>
   export default {
      data() {
         return {
            commonUrl:null,
            doc_num: '',
            barcodeFocus:true,
            matList:[],
            btnType:"primary", // default
            btnText: '已出库', // 未确认
            popShow:false,
            index:0,
            locNo: ''
				
				
				
         }
      },
      mounted(){
         const UIP = uni.getStorageSync('UIP');
         this.baseIP = UIP;
         const UPORT = uni.getStorageSync('UPORT');
         this.basePORT = UPORT
         const PROJ = uni.getStorageSync('UPROJ');
         this.baseUrl = PROJ
         this.getUrl()
      },
      onLoad() {
         // #ifdef APP
         setInterval(()=>{
            uni.hideKeyboard()
         },20)
         // #endif
      },
      methods: {
         // 获取url
         getUrl() {
            this.commonUrl = this.baseHttp + this.baseIP + ':' +this.basePORT + "/" +this.baseUrl
         },
         nextInput() {
            let that = this
            uni.request({
               url: that.commonUrl + '/ManPakOut/list/auth',
               data:{doc_num:that.doc_num},
               header: { 'token':uni.getStorageSync('token'),},
               method:'GET',
               success(result) {
                  console.log(result);
                  let res = result.data
                  if (res.code === 200) {
                     let records = res.data.records
                     for(var i = 0; i < records.length; i++) {
                        if (records[i].status == 0) {
                           records[i]['btnType'] = 'default'
                           records[i]['btnText'] = '未确认'
                        } else if (records[i].status == 1) {
                           records[i]['btnType'] = 'primary'
                           records[i]['btnText'] = '已出库'
                        }
								
                     }
                     that.matList = res.data.records
                  } else if (res.code === 403) {
                     uni.showToast({title: res.msg, icon: "none", position: 'top'})
                        setTimeout(() => {
                           uni.reLaunch({
                              url: '../login/login'
                           });
                     }, 1000);
                  } else {
                     uni.showToast({title: res.msg, icon: "none",position: 'top'})
                  }
               }
            })
         },
         open(index) {
            this.popShow = true
            this.index = index
         },
         close() {
            this.popShow = false
         },
         removeBarcode() {
            this.doc_num = ''
         },
         confirm() {
            let that = this
            if(!that.matList[that.index].locNo == that.locNo) {
               uni.showToast({title: '请确认库位号是否正确', icon: "none", position: 'top'});
               return
            }
            this.matList[this.index].status= 1
            uni.request({
               url: that.commonUrl + '/manPakOut/finish',
               data:JSON.stringify(that.matList[that.index]),
               method:'POST',
               success(result) {
                  var res = result.data
                  if(res.code === 200) {
                     that.popShow = false
                     that.matList[that.index].btnText= '已出库'
                     that.matList[that.index].btnType = 'primary'
                  } else if (res.code === 403) {
                     uni.showToast({title: res.msg, icon: "none", position: 'top'})
                        setTimeout(() => {
                           uni.reLaunch({
                              url: '../login/login'
                           });
                     }, 1000);
                  } else {
                     uni.showToast({title: res.msg, icon: "none",position: 'top'})
                  }
               }
            })
				
         },
         resst() {
            this.matList = []
            this.doc_num = ''
         }
			
      }
   }
</script>

<style>
   .bg-false {
      background-color: #FFFFFF;
   }
   .bg-true {
      background-color: #ebebeb;
   }
   .data-list {
      display: flex;
      flex-direction:column;
      border-bottom: 1px solid #d8d8d8;
      min-height: 100rpx;
      /* height: 130rpx; */
      margin: 25rpx;
      border-radius: 20rpx;
      font-size: 32rpx;
   }
   .data-list:first-child {
      margin-top: 20rpx;
   }
   .data-list:last-child {
      margin-bottom: 200rpx;
   }
   .number {
      width: 100%;
      height: 50rpx;
      line-height: 50rpx;
      font-size: 32rpx;
      font-weight: bold;
   }
   .column {
      display: flex;
      min-height: 70rpx;
      line-height: 70rpx;
   }
   .indent {
      text-indent: 24rpx;
   }
   .column button {
      width: 150rpx;
      font-size: 24rpx;
      height: 60rpx;
      line-height:60rpx;
      margin-left: 170rpx;
      text-indent: 0;
   }
   /* .data-list-left {
      display: inline-block;
      float: left;
      text-align: center;
      width: 100rpx;
      height: 180rpx;
      line-height: 180rpx;
   } */
   .data-list-left {
      display: inline-block;
      float: left;
      margin-left: 6%;
      height: 130rpx;
      /* line-height: 100rpx; */
      color: #676767;
   }
   .matnr {
      font-size: 14px;
      font-weight: 700;
      /* padding-top: 15rpx; */
      padding-top: 15rpx;
   }
   .data-list-right {
      display: inline-block;
      float: right;
      height: 130rpx;
      line-height: 130rpx;
      margin-right: 10%;
   }
   .text-key {
      width: 260rpx;
      font-weight: 700;
      color: #303133;
   }
   .text-value {
      color: #606266;
      font-weight: 500;
   }
   .anfme {
      width: 260rpx;
      font-weight: 700;
      color: #303133;
   }
   .popup-mask {
      position: fixed;
      width: 100%;
      min-height: 100%;
      background-color: rgba(0, 0, 0, 0.5);
      z-index: 999;
      left: 0;
      top: 0;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      align-items:center;
      justify-content:center
   }
   .popup {
      background-color: #fff;
      width: 90%;
      min-height: 200rpx;
      border-radius: 14rpx;
   }
   .popup .title {
      text-align: center;
      font-weight: bold;
      font-size: 36rpx;
      height: 100rpx;
      line-height: 120rpx;
      color: #909399;
   }
   .popup-text-key {
      width: 180rpx;
      text-indent: 20rpx;
   }
   .popup input {
      border: 1rpx solid #C0C4CC;border-radius: 5rpx;
   }
   .close {
      width: 50%;
      border-right: 1rpx solid #ccc;
      text-align: center;
      letter-spacing: 8px;
      font-weight: 700
   }
   .confirm {
      width: 50%;
      text-align: center;
      letter-spacing: 8px;
      color: #409EFF;
      font-weight: 700;
   }
   /* 事件 */
   .event { 
      border-top: 1rpx solid #ccc;
      height: 100rpx;
      line-height: 100rpx;
   }
</style>