<template>
  <view class="sh-content">
    <view class="sh-search">
      <u-form labelPosition="left" :model="dataForm" class="sh-form">
       <!-- <u-form-item label="容器" prop="containerCode" labelWidth="150rpx">
					<u-input v-model="dataForm.containerCode" border style="background-color: #ffffff;"
						placeholder="请输入或扫描容器号"></u-input>
				</u-form-item> -->
        <u-form-item  prop="barCode">
			
          <u-input v-model="dataForm.containerCode" border height="70" style="background-color: #ffffff;" placeholder="请扫描托盘编号"
            @confirm="inputQuery()" :focus="firstFocus"></u-input>
        </u-form-item>
      </u-form>
 
    </view>
	<view class='recommend'>
	  <text class='recommend-title'>待盘点物料信息</text>
	</view>
    <!-- {{dataList}} -->
	<view class="all-card">
		<view class="sh-card" v-for="(item, index) in dataList" :key="item.id" :index="item.id" v-if="dataList.length > 0"
		       style="border-radius: 20rpx;">
		<!-- <view  :class="isActive===index? 'sh-card-title-two':'sh-card-title'" @click="btn(index,item)"  style="border-radius: 20rpx;"><!--:class="{'borderBottom':!item.businInShelfDVoList.length}"-->
		      <view  class="sh-card-title"   style="border-radius: 20rpx;" @click="qtyEnter(item)">
			  <!-- <button class="sh-button" @click="delBtn(index)">X</button> -->
			  <view class="card-content" >
		       <view class="card-content-item">
		           <text class="item-title">物料编号:</text>
		           <text class="item-value">{{item.ptPart}}</text>
		         </view>
		       </view>
		    
		  <view class="card-content">
		    <view class="card-content-item">
		      <text class="item-title">台车编码:</text>
		      <text class="item-value">{{item.containerCode }}</text>
		    </view>
		  </view>
		
		  <view class="card-content">
		    <view class="card-content-item">
		      <text class="item-title">物料名称:</text>
		      <text class="item-value">{{item.ptName}}</text>
		    </view>
		  </view> 

		  <view class="card-content">
		    <view class="card-content-item">
		      <text class="item-title" style="width: 80px;">物料数量:</text>
		      <text class="item-value">{{item.qty}}</text>
		    </view> 
			<view class="card-content-item">
		      <text class="item-title" style="width: 80px;">盘点数量:</text>
		      <text class="item-value">{{item.invQty}}</text>
		    </view>
		  		
		  </view>
		  <u-popup v-model="show" width='90%' height="260px" :mask="true" @close="close" @open="open" mode="center">
		  		<view style="height: 44px;text-align: center;line-height: 44px;font-size: 18px;margin-bottom: 18px;">
		  		<text>物料修改</text>	
		  		</view>
				<view style="width: 100%;display: flex;align-items: baseline;">
					<text style="margin: 0px 20px 0px;">物料编码:</text> <input  v-model="form.ptPart" placeholder="请扫描物料编码"  style="border:1px solid #000;padding-right: 20px;"></u-input>
					
				</view>
				<view style="width: 100%;display: flex;align-items: baseline;">
					<text style="margin: 10px 20px 10px;">批次日期:</text>
					
					<u-input v-model="form.batch" style="padding-right: 30px;" type="select" placeholder="请选择批次日期" prop="batch" class="u-input"
						placeholder-style="color:#000000" @click="selShow = true" />
					<u-select :mask-close-able="false"  :safe-area-inset-bottom="true" v-model="selShow"
						mode="single-column" :list="lockstockBatch" @confirm="confirm" />
					 <!-- <u-select v-model="selShow"  placeholder="请选择批次日期" mode="single-column" :list="batchList" @confirm="confirm"></u-select> -->
					 <!-- <input  v-model="selShow" placeholder="请选择批次日期"  style="border:1px solid #000;padding-right: 20px;"></u-input> -->
					
				</view>
		  		<view style="width: 100%;display: flex;align-items: baseline;">
		  			<text style="margin: 0px 20px 0px;">缴库数量:</text> <input  v-model="form.invQty" style="border:1px solid #000;padding-right: 20px;"></u-input>
		  			
		  		</view>
		  	<view style="width: 100%; display: flex;margin-top: 40px;font-size: 14px;">
		  			    <button style="width: 30%; font-size: 16px;line-height: 44px;" class="btn1" type="default" @click="noEnter()">取消</button>
		  			    <button  style="width: 30%;font-size: 16px;line-height: 44px;;" type="default"  @click="enterUp(item)">确认</button>
		  		    </view>
		  
		  	</u-popup>
		    </view>
		
		     </view>
	</view>

   <!-- <view class="loadmore-data">
      <u-loadmore :status="loadStatus"></u-loadmore>
    </view> -->
    <!-- <button @click="open">测试</button> -->

	<view class="bottom">
		<button @click="pickUp()" >确认无误</button>
		<!-- <p class="foot" style="width: 100%; text-align: center;margin-top: 8px;color: gray;">盘点完成后当前托盘自动回库</p> -->
	</view>

  </view>
</template>

<script>
  export default {
    data() {
      return {
        showDiv:false,
		show:false,
		selShow:false,
        queryFlag: '',
        dataForm: {
          // containerCode: null,
          containerCode: "",
          pageNum: 1,
          pageSize: 10
        },
		lockstockBatch: [],
		pickUpObj:{
			pointNo:'',
			taskCode:'',
			taskId:'',
			containerId:'',
			dtlAddBos:[]
		},
        dataList: [],
        query: {
          current: 1,
          size: 20
        },
		form:{
			ptPart:'',
			batch:'',
			invQty:''
		},
		isActive:0,
        loadStatus: 'loadmore',
        dicOptions: [],
		timer:0,
		invQty:0,
		invid:0,
		completeArr:[],
		firstFocus:false
      }
    },
    onLoad() {
      // this.getDic(); //获取字典
      // this.loadList();
	// uni.setNavigationBarTitle({
	// 	  		title:this.$i18nMsg().nav.checkAction
	// 	  	})
	  // this.$u.api.invPlan.queryInvLocation(this.dataForm).then(res=>{
		 //  res.rows.forEach(item=>{
		 //  	 item.invQty=item.qty
		 //  })
		 //  this.dataList=res.rows
		 //  // console.log(res);
	  // })
	this.$u.api.getLockstockBatch({ pageSize: 999, pageNum: 1 }).then((response) => {
		// console.log(response);
		this.lockstockBatch=response.data.map((item,index)=>{
			return {
				label:item,
				value:item,
			}
		})
		// console.log(response.data);
	 //    this.lockstockBatch = response.data
		
	  })	
    },
    //上拉刷新(当数据距离底部100时触发，距离在pages.json配置)
    // onReachBottom() {
    //   this.loadStatus = "loading";
    //   setTimeout(() => {
    //     this.dataForm.pageNum += 1;
    //     this.loadList();
    //   }, 100);
    // },
	
	
	 onPullDownRefresh () {
	    this.list = []
	    //调用获取数据方法
	    // this.getData()
	    setTimeout(() => {
	        //结束下拉刷新
	      uni.stopPullDownRefresh ();
	    }, 1000);
	},
	filters: {
	  formatType(value) {
		console.log(value);
	    switch (Number(value)) {
	      case 0:
	        return "type1";
	      case 1:
	        return "type2";
	      case 2:
	        return "type3";
	      default:
	        return "";
	    }
	  }},
    methods: {
		close() {
				this.show = false
			},
		    open() {
		        this.show = true
				
		    },
			qtyEnter(item){
			this.show=true	
			this.form.batch=item.batchNo
			this.form.ptPart=item.ptPart
			this.form.invQty=item.qty
			this.form.invOrderNo=item.invOrderNo
			this.form.containerCode=item.containerCode
			this.invQty=item.qty
			this.invid=item.id
			},
			noEnter(){
			this.show=false
			},
		//点击变色
		btn(index,item){
			this.pickUpObj.dtlAddBos=[]
			this.isActive = index
			this.pickUpObj.pointNo=item.endLocation
			this.pickUpObj.taskCode=item.taskCode
			this.pickUpObj.taskId=item.taskId
			this.pickUpObj.taskType=item.taskType
			this.pickUpObj.containerId=item.containerId
			this.pickUpObj.dtlAddBos.push({qrCode:item.qrCode} )
			// console.log(JSON.stringify(this.pickUpObj));
		},
      /**搜索框查询*/
      inputQuery() {
   
        if (this.dataForm.containerCode == '' || this.dataForm.containerCode == null || this.dataForm.containerCode ==
          undefined) {
          return
        }
        // this.queryFlag = setTimeout(() => {
          this.loadList()
        // }, 500)
      },
	  onNavigationBarButtonTap(e){
		  console.log(e);
	  },
	  //删除单个
	  delBtn(index){
	  		  // console.log(JSON.stringify(this.pickUpObj));
	  	this.dataList.splice(index,1)
	  	this.pickUpObj.moldBarcodeList.splice(index,1)
	  		console.log(JSON.stringify(this.pickUpObj));
	  },
      loadList() {
		  
		  //防抖
		  // clearInterval(this.timer)
		  this.timer =setTimeout(()=>{
		  	//节流
		  	let flag = true
		  	if(flag===false) return
		  	flag=false
		  	setTimeout(()=>{
		  		flag = true
				this.firstFocus=false
				// this.$u.api.inv.pdaInvByContainerCode(this.dataForm).then(res=>{
				// 	console.log(res);
				// 	if(!res.rows || res.rows.length == 0){
				// 	// console.log(res);
				// 	// this.$u.toast("当前商品不存在");		
				// 	}else if(res.code == '200'){
				// 			console.log(res);
				// 			this.dataList=res.rows
				// 			setTimeout(()=>{
				// 				this.dataForm.containerCode=''
				// 			},0)
				// 			this.$nextTick(()=>{
				// 				this.firstFocus = true
				// 			})
				// 		}
				
				
				// })	
				this.$u.api.invPlan.pdaInvByContainerCode(this.dataForm).then(res=>{
							if(!res.rows || res.rows.length == 0){
							// console.log(res);
							this.$u.toast("当前台车内物料不存在");		
							}else if(res.code == '200'){
									// console.log(res);
									this.dataList=res.rows
									setTimeout(()=>{
										this.dataForm.containerCode=''
									},0)
									this.$nextTick(()=>{
										this.firstFocus = true
									})
								}
				})
			}
			,500)
			
		  },400)
      },
	  enterUp(){
		  // this.$u.api.inv.entrySave(this.)
		  // item.qty=this.invQty
		  // console.log(item);
		if(this.form.ptPart === null
		|| this.form.ptPart === '' 
		|| this.form.ptPart === 0
		|| this.form.ptPart === undefined
		|| this.form.ptPart ==='undefined'){
			this.$u.toast("请扫描物料编码");
			return; 
		}	
		if(this.form.batch === null
		|| this.form.batch === '' 
		|| this.form.batch === 0
		|| this.form.batch === undefined
		|| this.form.batch ==='undefined'){
			this.$u.toast("请选择批次");
			return; 
		}	
		if(this.form.invQty === null
		|| this.form.invQty === '' 
		|| this.form.invQty === 0
		|| this.form.invQty === undefined
		|| this.form.invQty ==='undefined'){
			this.$u.toast("请输入数量");
			return; 
		}
		this.$u.api.invPlan.entrySave(this.form).then(res=>{
			 // console.log(res);
			 if(res.code==200){
				 this.$u.toast("修改完成");
					 setTimeout(()=>{
					 	// this.$router.go(0)
						this.$u.api.invPlan.pdaInvByContainerCode({containerCode:this.form.containerCode}).then(res=>{
									if(!res.rows || res.rows.length == 0){
									// console.log(res);
									this.$u.toast("当前台车内物料不存在");		
									}else if(res.code == '200'){
											// console.log(res);
											this.dataList=res.rows
											setTimeout(()=>{
												this.dataForm.containerCode=''
											},0)
											this.$nextTick(()=>{
												this.firstFocus = true
											})
										}
						})
						this.form={}
						this.show=false
					 },400)
			 }
	
		 })

	  },
	  confirm(e){
		  // console.log(val);
		this.form.batch=e[0].label;
	  },
	  pickUp(){
		  this.ompleteArr=[]
		  // this.dataList.forEach(item=>{		  
			 //  this.completeArr.push({
				//   id:item.invOrderNo,
				//   ptPart:item.ptPart,
				//   invQty:item.invQty,
				//   batch:item.batch
			 //  })
			  
			  
		  // })
		 this.$u.api.invPlan.confirm({ invOrderNo:this.dataList[0].invOrderNo,ptPart:this.dataList[0].ptPart,batch:this.dataList[0].batchNo,containerCode:this.dataList[0].containerCode}).then(res=>{
			 // console.log(res);
			 if(res.code==200){
				 this.$u.toast("盘点完成");
					 setTimeout(()=>{
						 this.form={}
						 this.dataList=[]
					 	this.$router.go(0)
					 },400)
			 }
		 })
	  },
      // 任务查看
      searchClick() {
        this.dataList = [];
        this.dataForm.pageNum = 1;
        this.loadList();
      },
    }
  }
</script>

<style lang="scss">
  @import "index.scss";
  .footer {
    display: flex;
    padding: 20rpx 0;
  }
</style>
