<template>
	<view class="content" v-if="nowData">
		 <view class="productInfo">
			 <view><u-image :src="nowData.images" border-radius="16" width="160" height="160" bg-color="#EBEBEB"></u-image></view>
			 <view style="display: block;"><text class="item-no">{{ nowData.shelfPlaceCode }}</text><text>{{ nowData.code }}</text></view>
			 <view class="item-name">
			 	<text>{{ nowData.name }}</text>
			 </view>
		 </view>
		 <view class="number-input flex flex_column align_center justify_center">
		 	<view class="u-ninput">
		 		<u-number-box :min="1" :max="nowData.currentInven" v-model="qty" color="#000" bg-color="#fff" size="36" :input-height="80" :input-width="180"></u-number-box>
		 	</view>
		 	<view class="kucun flex justify_center">
				<view class="pcode" v-if="nowData.showPrice">
					<view>
						价格:<text class="item-price">{{nowData.showPrice||0}}</text>
					</view>
				</view>
				<view>
					可用库存:<text>{{nowData.currentInven}}</text>{{nowData.unit}}
				</view>
			</view>
		 </view>
		 <view class="buttons">
			 <u-button :throttle-time="100" :loading="loading" @click="onSubmit" :custom-style="{ background: '#066cff', color: '#fff',width:'400rpx' }" shape="circle" type="info">
			 	确认拿货
			 </u-button>
		 </view>
	</view>
</template>

<script>
	import { shelfOrderOnceCreate } from '@/api/shelf'
	export default {
		data() {
			return {
				 loading:false,
				 nowData: null,
				 qty: 1,
			}
		},
		onLoad(options) {
			 this.nowData = this.$store.state.vuex_tempData
		},
		computed: {
			userInfo(){
				return this.$store.state.vuex_userInfo
			},
			isAdmin(){
				return this.userInfo.superAdmin == 1
			}
		},
		methods: {
			onSubmit(){
				const _this = this
				uni.showModal({
					title: '提示',
					content: '拿货后扣减库存,确认拿货吗?',
					confirmText: '确定',
					success(res) {
						if(res.confirm){
							_this.outShelfOrder()
						}
					}
				})
			},
			toDetail(data){
				uni.$emit("updateQueryByCodeList")
				// 提交成功
				uni.redirectTo({
					url:"/pagesA/digitalShelf/choosePartResult?data="+encodeURIComponent(JSON.stringify({shelfOrder:data}))+"&state=1"
				})
			},
			// 确认拿货
			 outShelfOrder(){
				 const _this = this
				 this.loading = true
				 shelfOrderOnceCreate({
					 billSource: this.nowData.billSource,
					 shelfOrderDetailList: [{
							"productSn": this.nowData.productSn,
							"totalQty": this.qty
						}]
				 }).then(res => {
					 if(res.status == 200){
						 this.toDetail(res.data)
					 }else{
						 uni.showModal({
						 	title: res.errCode == 'VALIDATE_STOCK_LACK' ? '以下产品库存不足' : '提示',
						 	content: res.message,
						 	confirmText: '知道了',
						 	showCancel: false
						 })
					 }
					this.loading = false
				 })
			 }
		}
	}
</script>

<style lang="less">
.content{
	background-color: #fff;
	width: 100%;
	padding: 50rpx 30rpx;
	height: 100vh;
	.productInfo{
		> view{
			text-align: center;
			display: flex;
			justify-content: center;
			font-size: 32rpx;
			.item-no{
				font-weight: normal;
				margin-right: 6rpx;
				padding: 0 10rpx;
				background: rgba(3, 54, 146, 0.15);
				border-radius: 20rpx;
				color: #033692;
				font-size: 24rpx;
			}
			padding: 10rpx;
		}
		.item-name{
			margin-top: 20rpx;
			font-size: 28rpx;
		}
	}
	.number-input{
		padding: 30rpx 30rpx 10rpx;
		> view{
			padding: 20rpx 0;
		}
		.kucun{
			color: #999;
			text{
				color: #333;
			}
			.pcode{
				margin-right: 20upx;
			}
		}
		.u-ninput{
			border: 2rpx solid #eee;
			border-radius: 50rpx;
			padding: 0 12rpx;
		}
		/deep/ .u-icon-disabled{
			background: #fff!important;
		}
		/deep/ .u-number-input{
			margin: 0 2rpx;
			border: 2rpx solid #eee;
			border-top: 0;
			border-bottom: 0;
		}
		/deep/ .u-icon-plus, /deep/ .u-icon-minus{
			border-radius: 50rpx;
		}
	}
	  
	.buttons{
		padding: 50rpx 0;
		> view{
			width: 80%;
			margin: 0 2%;
		}
	}
}
</style>