<template>
	<view class="content">
		<nav-bar title="入库"></nav-bar>
		<view class="search-confirm-wrap">
			<view class="zd-row">
				<view class="zd-col-11 zd-row">
					<search-box
					v-model="val1"
					/>
					<button class="confirm-button" @tap="toDelect">查询</button>
				</view>
				<view class="zd-col-11 zd-row jcflexend">
					<button class="confirm-button" :class="{'confirm-button_disabled': !val1 || dataList.length === 0}" :disabled="disabled" @tap="toSure">单据审核</button>
				</view>
			</view>
		</view>
		<view class="zd-row jcflexstart table-title_wraper">
			<text>采购入库</text>
		</view>
		<view class="grid-wrap">
			<view class="table-wrap">
				<view class="zd-row zd-th-wraper">
					<view class="zd-col-2 zd-th"><text>序号</text></view>
					<view class="zd-col-2 zd-th"><view class="zd-checkbox"></view></view>
					<view class="zd-col-3 zd-th"><text>入库单号</text></view>
					<view class="zd-col-3 zd-th"><text>EAS单号</text></view>
					<view class="zd-col-2 zd-th"><text>状态</text></view>
					<view class="zd-col-3 zd-th"><text>去向</text></view>
					<view class="zd-col-3 zd-th"><text>入库日期</text></view>
					<view class="zd-col-3 zd-th"><text>领料人</text></view>
					<view class="zd-col-3 zd-th"><text>制单人</text></view>
				</view>
				<view class="allwidth" v-for="(e, i) in dataList" :key="i">
					<view class="zd-row">
						<view class="zd-col-2 zd-td"><text>{{i+1}}</text></view>
						<view class="zd-col-2 zd-td"><view class="zd-checkbox zd-checkbox_active"></view></view>
						<view class="zd-col-3 zd-td fontcol1"><text>{{e.a}}</text></view>
						<view class="zd-col-3 zd-td"><text>{{e.b}}</text></view>
						<view class="zd-col-2 zd-td"><text class="fontbg1">{{e.c}}</text></view>
						<view class="zd-col-3 zd-td"><text>{{e.d}}</text></view>
						<view class="zd-col-3 zd-td"><text>{{e.e}}</text></view>
						<view class="zd-col-3 zd-td"><text>{{e.f}}</text></view>
						<view class="zd-col-3 zd-td"><text>{{e.g}}</text></view>
					</view>
					<view v-show="e.checked" class="zd-row zd-sec-table">
						<view class="zd-col-2 zd-sec-th"><text>序号</text></view>
						<view class="zd-col-2 zd-sec-th"><view class="zd-checkbox"></view></view>
						<view class="zd-col-3 zd-sec-th"><text>入库单号</text></view>
						<view class="zd-col-3 zd-sec-th"><text>EAS单号</text></view>
						<view class="zd-col-2 zd-sec-th"><text>状态</text></view>
						<view class="zd-col-3 zd-sec-th"><text>去向</text></view>
						<view class="zd-col-3 zd-sec-th"><text>入库日期</text></view>
						<view class="zd-col-3 zd-sec-th"><text>领料人</text></view>
						<view class="zd-col-3 zd-sec-th"><text>制单人</text></view>
					</view>
				</view>
			</view>
			<pagination :total="total" :page-size="queryParams.pageSize" :current-page="queryParams.pageNum" @page-change="handlePageChange" />
		</view>
	</view>
</template>

<script>
	import NavBar from '@/components/NavBar.vue'
	import SearchBox from '@/components/SearchBox.vue'
	import Pagination from '@/components/Pagination.vue'
	import {easOutInBillPage} from '@/utils/getData2.js'
	export default {
		components: {
			NavBar,
			SearchBox,
			Pagination
		},
		data() {
			return {
				id: '',
				val1: '',
				dataList: [],
				pkId: '',
				disabled: false,
				total: 0,
				queryParams:{
					pageSize: 0,
					pageNum: 0
				}
			};
		},
		onShow() {
			if (this.$store.getters.publicArr) {
				this.dataList = this.$store.getters.publicArr
			}
		},
		destroyed () {
			this.$store.dispatch('setPublicArr', '')
		},
		onLoad (options) {
			this.id = options.id
		},
		created () {
			this._easOutInBillPage()
		},
		methods: {
			async _easOutInBillPage () {
				let res = await easOutInBillPage(this.id)
				res.result.map(el => {
					this.$set(el, 'checked', false)
				})
				this.dataList = [...res.result]
				this.total = Number(res.totalElements)
				this.queryParams.pageSize = Number(res.pageSize)
				this.queryParams.pageNum = Number(res.pageNum)
			},
			handlePageChange(page) {
				this.queryParams.pageNum = page;
			},
			toDelect () {
			  this.dataList = []
			  this.pkId = ''
			  this.$store.dispatch('setPublicArr', '')
			},
			async toSure () {
			  this.disabled = true
			  if (!this.index1) {
				uni.showToast({
					title: '请选择入库点',
					icon: 'none'
				})
				this.disabled = false
				return
			  }
			  if (!this.val1) {
				uni.showToast({
					title: '请输入载具号',
					icon: 'none'
				})
				this.disabled = false
				return  
			  }
			  if (this.dataList.length === 0) {
				uni.showToast({
					title: '请选择订单信息',
					icon: 'none'
				})
				this.disabled = false
				return  
			  }
			  try {
				let res = await InstoreOrder(this.index1, this.val1, this.dataList) 
				this.disabled = false
				this.index1 = ''
				this.val1 = ''
				this.toDelect()
				uni.showToast({
					title: res.message,
					icon: 'none'
				})
			  } catch (e) {
				this.disabled = false
			  }
			},
			toSelect () {
				uni.navigateTo({
					url: '/pages/management/MaterList'
				})
			}
		}
	}
</script>

<style lang="stylus" scoped>
@import '../../common/style/mixin.styl';
</style>
