<template>
  <view class="sh-content">
    <view class="sh-search">
      <u-form labelPosition="left" :model="dataForm" class="sh-form">
        <u-form-item  prop="barCode">
          <u-input v-model="dataForm.containerCode"  border input-align="left" height="70" style="background-color: #ffffff;height: 38px;line-height: 38px;"   placeholder="请扫描台车编号"
            @confirm="inputQuery()" :focus="firstFocus">
			</u-input>
        </u-form-item>
      </u-form>
 
    </view>
<!-- 	<view class="" style="font-size: 36px;margin: 20rpx 20rpx 20rpx 20rpx;">
		<text>{{dataForm.containerCode1}}</text>
	</view> -->
	<view class='recommend'>
	  <text class='recommend-title'>待出库物料信息</text>
	</view>
    <!-- {{dataList}} -->
	<view class="all-card">
	<!-- class="sh-card" -->
	<view  v-for="(item, index) in dataList" :keys="item.id" :index="item.id" v-if="dataList.length > 0"
		       style="border-radius: 20rpx;">
					<!--<view  class="sh-card-title"   style="border-radius: 20rpx;">
				   <image src="@/static/icon/edit.png" @click="editBtn(index)" style="width: 2.5vh;height: 2.5vh;position: absolute;right: 1vh;margin-top: 1vh;" />
		      <view class="card-content">
			
		        <view class="card-content-item" width="60%" style="margin-top: 1vh;">
		          <text class="item-title" >物料编号:</text>
		          <text class="item-value">{{item.goodNo}}</text>
		        </view>
		      </view>
		     <view class="card-content">
		       <view class="card-content-item">
		         <text class="item-title">物料信息:</text>
		         <text class="item-value">{{item.goodName}}--{{item.specifications}}</text>
		       </view>
		
		     </view>

		     <view class="card-content">
		       <view class="card-content-item">
		         <text class="item-title">缴库数量:</text>
		         <text class="item-value">{{item.qty}}</text>
		       </view>     
		    
		     </view> 
			
		    
		    </view> -->
			<u-card :title="title" :thumb="thumb" :show-foot="false" :sub-title="subTitle" >
					<view class="" slot="body">
						<!-- <view class="u-body-item u-flex u-border-bottom u-col-between u-p-t-0">
							<view class="u-body-item-title u-line-2">瓶身描绘的牡丹一如你初妆，冉冉檀香透过窗心事我了然，宣纸上走笔至此搁一半</view>
						</view> -->
						
					</view>
					<view class="" slot="foot"><u-icon name="chat-fill" size="34" color="" label="30评论"></u-icon></view>
			</u-card>
			<u-popup v-model="show" width='90%' height="220px" :mask-close-able="false" :mask="true" @close="close"  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="item.qty" 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 class="loadmore-data">
      <u-loadmore :status="loadStatus"></u-loadmore>
    </view> -->
    <!-- <button @click="open">测试</button> -->
	<view class="bottom">
		<button @click="pickUp()" >完成出库</button>
	</view>
    
  </view>
</template>

<script>
  export default {
    data() {
      return {
		  show:false,
        showDiv:false,
		focusFlag:true,
        queryFlag: '',
		thumb:'@/static/icon/edit.png',
        dataForm: {
          containerCode: null,
          keywords: "",
          pageNum: 1,
          pageSize: 10
        },
		
		pickUpObj:{
			pointNo:'',
			taskCode:'',
			taskId:'',
			containerId:'',
			dtlAddBos:[]
		},
        dataList: [
			 {
			            "id": 3,
			            "orderNo": "FL20240306002",
			            "waveCode": "BC120240300606",
			            "lineId": 0,   
			            "goodId": 14,
			            "locationId": 172,
			            "qty": 10.0000,       
			            "packageId": 14,
			            "taskType": "1",        
			            "sourceOrderNo": "FL20240306002",
			            "sourceLineId": "",
			            "upperOrderNo": "FL20240306002",          
			            "goodNo": "L010002",
			            "locationCode": "20-18-0",
			            "specifications": "件",
			            "containerCode": "P10000002",
			            "goodName": "铝合金规格2",          
			            "batchNo": "07144961"         
			        }
		],
        query: {
          current: 1,
          size: 20
        },
		isActive:0,
        loadStatus: 'loadmore',
        dicOptions: [],
		timer:0,
		//模拟数据列表
		datalist3: [],
		//模拟初始数据
		tval3: "myvalue1",
		firstFocus:false
      }
    },
    onLoad() {
      this.loadList();
	 //  this.$u.api.waitOutPlan(this.dataForm).then(res=>console.log(
	 // this.dataList=res.rows
	 //  ))
		  // uni.setNavigationBarTitle({
		  // 		title:this.$i18nMsg().nav.outStore
		  // 	})
	// this.$u.api.mouldStorage.queryMouldStorage({pageNum: 1,pageSize:9999,type:'out'}).then(res=>{
	// 	console.log(res);
	// })
    },
    //上拉刷新(当数据距离底部100时触发，距离在pages.json配置)
    onReachBottom() {
      this.loadStatus = "loading";
      setTimeout(() => {
        this.dataForm.pageNum += 1;
        this.loadList();
      }, 100);
    },
	 onPullDownRefresh () {
	    this.list = []
	    //调用获取数据方法
	    this.getData()
	    setTimeout(() => {
			// onLoad()
			// this.$u.api.waitOutPlan(this.dataForm).then(res=>this.dataList=res.rows)}
			// console.log(111);
	        //结束下拉刷新
	      uni.stopPullDownRefresh ();
	    }, 800);
	},
		onReady() {
			
			},
    methods: {
		 getData(){
			 this.$u.api.waitOutPlan(this.dataForm).then(res=>console.log(
			 this.dataList=res.rows
			  ))
		 },
		//点击变色
		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} )
			
		},
		editBtn(){
			this.show=true
		},
		queryList(index,item){
			console.log(index,item);
		this.dataForm.containerCode=item.containerCode
		},
			
		enterUp(item){
			console.log(item);
			 this.show=false
			
			 
		// this.$u.api.replaceCar.upateBusinItemInDataForQty(item).then(res=>{
		// 	console.log(res);
		// })
		},
      /**搜索框查询*/
      inputQuery() {
        // if (this.queryFlag !== '') {
        //   clearTimeout(this.queryFlag);
        //    this.loadList()
        // }
        if (this.dataForm.containerCode == '' || this.dataForm.containerCode == null || this.dataForm.containerCode ==
          undefined) {
          return
        }
        // this.queryFlag = setTimeout(() => {
          this.loadList()
        // }, 500)
      },
	  onNavigationBarButtonTap(e){
		  // console.log(e);
		  this.$u.route({
		  	url: 'pages/BusinPickup/index2',
		  	type: 'navigateTo',	
		  })
	  },
		  
	  close(){
	  },
	  noEnter(){
		  this.show=false
	  },
      loadList() {
		  //防抖
		  clearInterval(this.timer)
		  // console.log(this.dataForm);
		  this.timer =setTimeout(()=>{
		  	//节流
		  	let flag = true
		  	if(flag===false) return
			if (this.dataForm.containerCode == '' || this.dataForm.containerCode == null || this.dataForm.containerCode ==
			  undefined) {
			  return
			}
		  	flag=false
		  	setTimeout(()=>{
		  		flag = true
				this.firstFocus=false
				
				this.$u.api.pickBy.pickByContainerCode(this.dataForm).then(res=>{
					if(!res.data || res.data.length == 0){
					// console.log(res);
					this.$u.toast("当前托盘不存在");		
					}else if(res.code == '200'){
							// console.log(res);
							res.data.forEach((item)=>{
								item.containerId=item.id
							})
							this.dataList=res.data
							setTimeout(()=>{
								this.dataForm.containerCode=this.dataForm.containerCode
								// this.dataForm.containerTypeLabel=this.dataForm.containerCode
								// this.dataForm.containerCode=''
							},0)
					
							this.$nextTick(()=>{
								this.firstFocus = true
							})
						}
				})	
			}
			,500)
			
		  },400)
      },
	  
	  pickUp(){
		  if(this.dataForm.containerCode == null
		  || this.dataForm.containerCode === '' 
		  || this.dataForm.containerCode === 0
		  || this.dataForm.containerCode === undefined
		  || this.dataForm.containerCode ==='undefined'){
		  	this.$u.toast("请扫描台车编号");
		  	return; 
		  }  
		  var obj ={
			  containerCode:'',
			  detailBoList:[]
		  }
		  obj.containerCode=this.dataForm.containerCode
		  this.dataList.forEach(item=>{	
				obj.detailBoList.push(
				{
					id:item.id,
					qty:item.qty
				})
		  })
		  
		  // console.log(obj);
	  	this.$u.api.pickBy.pickAGV(obj).then(res=>{
	  		obj={}
			this.dataList=[]
			this.dataForm.containerCode=''
	  	})
	  },
	// 下一个界面
	enterNext(item,index){
		this.$u.route({
			url: 'pages/BusinPickup/index1',
			type: 'navigateTo',
			params:{
				containerCode:item.containerCode
			} 			
		})
	},
	
	
      // 任务查看
      searchClick() {
        this.dataList = [];
        this.dataForm.pageNum = 1;
        this.loadList();
      },
    },
	filters: {
	  formatType(value) {
	    switch (Number(value)) {
	      case 0:
	        return "type1";
	      case 1:
	        return "type2";
	      case 2:
	        return "type3";
	      default:
	        return "";
	    }
	  }}
  }
</script>

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