<template>
	<view class="page-container">
		<view class="page-container">
			<!-- 		<tui-sel-cascade :lvlLeaf="2" title="选择仓位" dotColor="#26ae7e" :selLeaf="false" v-model="eareId" :postKey="[]"  
				keyId="id"  :rootData="repData" keyLabel="name" @change="getAreaPosition">
				<template slot-scope="{ selData }">
					<uni-list-item showArrow title="选择仓位" :note="selData.fulltext" borderRight="0rpx" rightText="选择仓位">
					</uni-list-item>
				</template>
			</tui-sel-cascade> -->
			<!-- 			<uni-forms  labelWidth="100px">
				<uni-forms-item required name="hobby" label="请选择仓位">
					
				</uni-forms-item>
			</uni-forms> -->
			<tui-load-list ref="list" v-model="scaleList" apiUrl="/product/whse/list" :postData={type:orderType}
				:limit="100">
				<view v-for="(item,index) in scaleList " :key="index">
					<uni-list-item :showArrow="false">
						<!-- 	<template v-slot:header>
							<checkbox @tap="selchange(item)" style="margin-right: 10px;align-content: center;"
								value="item.id" :checked="item.ispick" />
						</template> -->
						<template v-slot:body>
							<div class="flex-1 flex">
								<div class="flex-1 ">
									<div class="font-24">PO号:<span class="font-28">{{item.poNum}}</span><uni-tag :circle="true" size="mini" :text="item.status==0?'草稿':'确认'" type="warning" /></div>
									<div class="font-24">{{'指令号：'+item.manuNum}}</div>
									<div class="font-24">{{'双数：'+item.entQty}} &nbsp;&nbsp;&nbsp;&nbsp;
										{{'件数：'+item.entPcsQty}}
									</div>
									<div class="font-24"></div>
								</div>
							</div>
						</template>
						<template v-slot:footer>
							<div></div>
							<div @click="popupShow(item)" v-if="item.posName"  class="font-32"
								style="align-content: center;text-align: right;color:blue;">
								{{item.posName}} >	
								<!-- 	<uni-data-picker ref="picker" v-model="item.repid" :localdata="repData" popup-title="仓位"
									@change="onchange($event,item)"></uni-data-picker> -->
							</div>
							<div v-else style="align-content: center;text-align: right;color:blue;">

								<!-- 	<uni-data-picker ref="picker" v-model="item.repid" :localdata="repData" popup-title="仓位"
									@change="onchange($event,item)"></uni-data-picker> --><tui-button :size="22" @click="popupShow(item)"
									width="70px" height="28px">选择仓位</tui-button>
							</div>

						</template>
						<template></template>
					</uni-list-item>
				</view>
			</tui-load-list>
			<view style="height:100px"></view>
			<view class="fixedbombtn flex">
				<!-- 	<tui-button style="margin-right: 10rpx;" type="danger" class=" flex-1 margin-right-sm "
					@click="deleteBtn">清空</tui-button> -->
				<!-- <tui-button class=" flex-2 " @click="entry">{{butText}}</tui-button> -->
			</view>
		</view>
		<!-- <uni-fab ref="fab" :pattern="pattern" :horizontal="horizontal" :vertical="vertical" @fabClick="scan" /> -->
		<!-- <tui-tabbar :tabBar="tabBar" :current="current" v-if="current>=0"></tui-tabbar> -->
		<!-- 	<uni-popup ref="popup" type="center" :animation="false" style="width: 95%;">
			<view style="width: 380px;background-color: white;padding: 30rpx; font-size: 26rpx;">
				<uni-forms labelWidth="100px">
					<uni-forms-item required name="hobby" label="请选择仓位">
						<uni-data-picker ref="picker" v-model="repid" :localdata="repData" popup-title="仓位"
							@change="onchange($event)"></uni-data-picker>
							
						
					</uni-forms-item>
				</uni-forms>
				
				<tui-button height="46px" class=" flex-2 " @click="entry">确认</tui-button>
			</view>
		</uni-popup> -->
		<tui-bottom-popup :show="bottomPopup" :radius="false" @close="hideModal">
			<scroll-view class="tui-scroll-box" scroll-y scroll-with-animation :scroll-top="scrollTop">
				<view class="padding-30">
					<view class="font-bold font-30" style="color: #bb5159;">请选择仓位</view>
					<view class="back-f4 padding-30 mt-10" style="border-radius: 10rpx;">
						<view class="df jc-space-between mt-20 ">
							<view @click="setcutday(item,index)" :class="item.issel?'cur':''"
								v-for="(item,index) in repData" :key="index" class="font-30 seldata">
								{{item.parent.name}}
							</view>
						</view>
					</view>
					<view>
						<view style="margin-left: -20rpx;flex-wrap: wrap;" class=" flex  ">
							<view @click="selRep(item) " v-for="(item,index) in curRep.children" :key="index"
								:class="item.issel?'cur':''" class="seltime font-28 ml-20 mt-20" style="">
								{{item.name}}
								<!-- <view class="font-18">{{obj.data}}</view> -->
							</view>
						</view>
					</view>
					<!-- 	<view v-if="first&&last" class="pt-10 pb-10 seltiembox">
						已选择时段：{{first.data|setJtime}} {{first.time_name}}至{{last.data|setJtime}}
						{{last.time_name}},共{{(seldata.length-1)/2}}小时
					</view>
					<view v-if="packageList.length>0" class="mt-20">
						<view class="font-30 color-333">套餐选择</view>
						
					</view> -->

				</view>
			</scroll-view>
			<view style="height: 140rpx;"></view>
			<view class="bombox df sure">
				<tui-button @click="cancelAll()" type="green" style="flex: 1;" :plain="true">取消</tui-button>
				<tui-button @click="entry" class="ml-20" style="flex: 2;" backColor="#3f9f81">确定<text
						class="font-24"></text> 
				</tui-button>
			</view>
		</tui-bottom-popup>
	</view>
</template>
<script>
	import scaleListCom from '../scaleListCom.vue';
	import {
		parseAdd,
		whseAdd,
		whseTeam,
		whseRemove,
		whseRetAdd,
		whseInfolist,
		setRepId
	} from '@/api/whse.js'
	export default {
		components: {
			scaleListCom
		},
		data() {
			return {
				repData: [],
				setItemData: null,
				selRepData: null,
				scrollTop: 0,
				curRep: 0,
				bottomPopup: false,
				orderType: null,
				gcCode: '',
				gcName: '',
				is_color_type: false,
				scaleList: [],
				current: 1,
				proTeamid: [],
				butText: '设置仓位',
				repid: '',
				selReplist: []
			}
		},
		created() {
			this.getRepData()
		},
		onLoad(option) {
			// console.log(option, 'option')
			this.orderType = option.type
			var pageTitle = ''
			if (this.orderType == 'PRO') {
				pageTitle = '生产入库'
				this.butText = '入库'
			} else if (this.orderType == 'OQC') {
				pageTitle = '品检入库'
				this.butText = '入库'
			} else if (this.orderType == 'FTB') {
				pageTitle = '翻箱入库'
				this.butText = '入库'
			} else if (this.orderType == 'OQCRET') {
				pageTitle = '品检退库'
				this.butText = '退库'
			} else if (this.orderType == 'FTBRET') {
				pageTitle = '翻箱退库'
				this.butText = '退库'
			} else {
				this.butText = '设置仓位'
				pageTitle = '生产入库'
			}
			uni.setNavigationBarTitle({
				title: pageTitle
			})
		},
		onPullDownRefresh() {
			uni.stopPullDownRefresh();
			this.$refs.list.loadData("rush")
		},
		onReachBottom() {
			this.$refs.list.loadData()
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		methods: {
			popupShow(item) {
				if(item.status==0){
					this.bottomPopup=true
					this.setItemData = item
				}
			},
			setcutday(item, index) {
				this.repData.forEach(v => {
					v.issel = 0
				})
				item.issel = 1
				this.curRep = item
				this.dayindex = index
			},
			selRep(item) {
				this.$set(item, 'issel', !item.issel)
				this.$nextTick(()=>{
					if (item.issel === true) {
						this.selReplist.push(item)
					} else {
						const index = this.selReplist.indexOf(item)
						if (index > -1) {
							this.selReplist.splice(index, 1)
						}
					}
				})
		
			},
			cancelAll() {
				this.bottomPopup = false
				this.curday = 0
				this.dayindex = 0
				this.selReplist = []
				this.repData.forEach(v=>{
					v.children.map(v=>{
						this.$set(v, 'issel', false)
					})
				})
			},
			whseSucss() {
				this.$refs.list.loadData("rush")
				uni.hideLoading()
				this.$qsk.modal({
					title: this.butText + "成功",
					content: '',
					showCancel: false,
					confirmText: '确定'
				})
			},
		
			entry(rep, item) {
				// console.log(this.selReplist, len, this.setItemData, 'text')
				if(this.selReplist.length<1){
					this.$qsk.toast('请选择仓位')
					return false
				}
				const selId=[]
				var selName=''
				this.selReplist.forEach((v,index)=>{
					selId.push(v.id)
					selName+=v.name+'、'
				})
				// console.log(selId,selName,this.setItemData,'selName')
				this.$qsk.modal({
					title: "确认入库到" +selName + "？",
					content: '',
					showCancel: true,
					confirmText: '确定'
				}).then(res2 => {
					setRepId({
						id: this.setItemData.id,
						posIds: selId
					}).then(res => {
						this.cancelAll()
						this.$refs.list.loadData("rush")
					}).catch(error => {
						uni.hideLoading()
					})
				}).catch(() => {})
			},

			onchange(e, item) {
				console.log('onchange:', e);
				this.selRepData = e.detail
				// this.entry(e, item)
			},
			getRepData() {
				whseInfolist().then(res => {
					this.repData = res.data
					if (this.repData && this.repData.length > 0) {
						this.curRep = this.repData[0]
					this.$set(this.curRep,'issel','true')
					}
				}).catch(err => {

				})
			},
			deleteBtn(item) {
				let ids = []
				let text = '清空'
				if (item) {
					ids.push(item.id)
					text = "删除"
				}
				this.$qsk.modal({
					title: "您是否确认" + text + "数据？",
					content: '',
					showCancel: false,
					confirmText: '确定'
				}).then(res2 => {
					whseRemove({
						ids: ids,
						type: this.orderType
					}).then(res => {
						this.$refs.list.loadData("rush")
					})
				})
			},
			onnodeclick(node) {},
			changeValue() {},
			dialogOpend() {
				this.$refs.alertDialog.open()
			},
			dialogClosed() {
				this.$refs.alertDialog.close()
			},
			getUpQMImg(val) {
				this.picList.forEach((v, index) => {
					if (v.categ == val.categ) {
						this.picList.splice(index, 1)
						return
					}
				})
				this.picList.push(val)
			},
			clecKListkHasItem(list, objName) {
				return list.some(item => item.categ == objName)
			},
			addAssetsBtn() {
				this.$tab.navigateTo('/pages/takestock/addAssets/index')
			},
			selectAssetsBtn() {
				this.$tab.navigateTo('/pages/takestock/assetsList/index')
			},
		}
	}
</script>
<style lang="scss" scoped>
	.page-container {
		width: 100%;
		min-height: 100%;
		background-color: $uni-bg-color;
		overflow: hidden;

		.bombox {
			height: 108rpx;
			padding: 18rpx 30rpx;
			background-color: #fff;
			position: fixed;
			bottom: constant(safe-area-inset-bottom);
			bottom: env(safe-area-inset-bottom);
			left: 0;
			right: 0;
			z-index: 22;

			&.sure {
				z-index: 9999;
			}
		}

		.tui-scroll-box {
			width: 100%;
			height: 80vh;
			box-sizing: border-box;
			position: relative;
			z-index: 99;
			color: #fff;
			font-size: 30rpx;
			word-break: break-all;
		}

		.seldata {
			background: #f4f4f4;
			color: #999;
			border-radius: 10rpx;
			padding: 14rpx  60rpx;
			text-align: center;

			&.cur {
				background: #3f9f81;
				color: #fff
			}
		}

		.seltime {
			background: #f4f4f4;
			color: #999;
			border-radius: 6rpx;
			width: 120rpx;
			text-align: center;
			padding: 14rpx 0;

			&.cur {
				background: #3f9f81;
				color: #fff
			}

			&.used {
				background: #ee7875;
				color: #fff
			}
		}

		.tc {
			background: #f4f4f4;
			border: #f4f4f4 2rpx solid;
			border-radius: 10rpx;
			line-height: 1.5;
			margin-top: 16rpx;

			&.selecd {
				background: #b6dacf;
				border: #3f9f81 2rpx solid;
			}
		}

		.seltiembox {
			border-bottom: 0.5px solid #d5d5d5;
			margin-top: 10px;
			background: #fdeded;
			font-size: 28rpx;
			color: #ee7875;
			border-radius: 6rpx;
		}
	}
</style>