<template>
	<view>
		<StickyNavBar>
			<NavBar :title="$t('销售出库')"></NavBar>
			<view class="btn">
				<uni-easyinput
					prefixIcon="search"
					:disabled="isDisabled"
					v-model="wxparams"
					:focus="isFocus"
					:placeholder="$t('请扫描单号')"
					@confirm="handleConfirm"
				></uni-easyinput>
			</view>
		</StickyNavBar>
		<view class="cardBox">
			<text class="cardBoxTip">{{$t('步骤一    扫描单号')}}</text>
			<u-image class='cardBoxImg' :src="bgSrc" width="560rpx" height="400rpx"></u-image>
			<view class="cardBoxTip2">{{$t('摄像头对准')}}</view>
			<view class="cardBoxTip3">{{$t('出货通知单号二维码')}}</view>
			<view class="cardBoxTip2">
				<text class="tipLeft">{{$t('点击扫描或')}}</text>
				<text class="tipRight">{{$t('点选单号')}}</text>
			</view>
		</view>
	</view>
</template>

<script>
import i18n from '../../lang/index'

import StickyNavBar from '@/components/StickyNavBar/index.vue';
import ContentLoadingMore from '@/components/ContentLoadingMore/index.vue';
export default {
	components: {
		StickyNavBar,
		ContentLoadingMore
	},
	data() {
		return {
			bgSrc: require('@/static/images/qrcode.png'),
			wxparams: '',
			isFocus: false,
			isDisabled: false,
			pendingRefocus: false
		};
	},
	onLoad() {
		uni.$on('saleckSubmitSuccess', this.onSaleckSubmitSuccess);
	},
	onUnload() {
		uni.$off('saleckSubmitSuccess', this.onSaleckSubmitSuccess);
	},
	onShow() {
		if (this.pendingRefocus) {
			this.pendingRefocus = false;
			this.wxparams = '';
			this.focusScanInput();
		}
	},
	created() {
		this.focusScanInput();
	},
	methods: {
		onSaleckSubmitSuccess() {
			this.pendingRefocus = true;
		},
		focusScanInput() {
			this.isFocus = false;
			this.$nextTick(() => {
				setTimeout(() => {
					this.isFocus = true;
				}, 200);
			});
		},
		handleConfirm(e) {
			e && this.getPlnr(e);
            // uni.navigateTo({
            //     url: `/pages/saleck/saleckList?order=${e}`
            // });
		},
		getPlnr(VBELN) {
			this.$u.api
				.stockSaleOutList({
					saleOutNo: VBELN
				})
				.then(({data, errorMessage}) => {
					if (data && data.applyNo) {
						this.isFocus = false;
						uni.navigateTo({
							url: `/pages/saleck/saleckList?order=${VBELN}`
						});
					} else {
						this.$u.toast(errorMessage);
					}
					this.loading = false;
				});
		}
	}
};
</script>

<style lang="scss" scoped>
page {
	background: #f8f8f8;
}
.btn {
	padding: 20rpx;
	background: #fff;
	.topSearch {
		margin-bottom: 20rpx;
	}
}
.cardBox {
	min-height: calc(100vh - 400rpx);
	padding: 0rpx 20rpx;
	margin-top: 20rpx;
}
::v-deep .u-sticky {
	top: 0 !important;
	background: #fff;
}
.cardBoxTip{
	color: #000;
	font-size: 28rpx;
}
.cardBoxTip2{
	color: #000;
	font-size: 28rpx;
	text-align: center;
}
.cardBoxTip3{
	color: #3f9dcc;
	font-size: 28rpx;
	text-align: center;
}
.tipRight{
	color: #ff9900;
}
</style>