<template>
	<view>
		<view class="list">
			<view class="item" v-for="(item, index) in listData" :key="index">
				<view class="item-top">
					<view class="">
						<view class="f26 gray3 flex-1  mb16">{{item.pickTypeVal}}</view>
						<view class="d-b-c">
							<view>{{item.pickOrder}}</view>
							<view class="gray9">x<text class="fb">{{item.pickQuantity}}</text></view>
						</view>
					</view>
				</view>
				<view class="border-t d-s-c item-bottom "><text class="f24 gray9">{{item.pickTime}}</text></view>
			</view>
			<view class="d-c-c p30" v-if="listData.length == 0 && !loading">
				<text class="iconfont icon-wushuju"></text>
				<text class="cont">{{$t('w_0405')}}</text>
			</view>
			<uni-load-more v-else :loadingType="loadingType"></uni-load-more>
		</view>
	</view>
</template>

<script>
import uniLoadMore from '@/components/uni-load-more.vue';
export default {
	components: {
		uniLoadMore
	},
	data() {
		return {
			show: false,
			listData: [],
			/*有没有等多*/
			no_more: false,
			/*是否正在加载*/
			loading: true,
			form: {
				pageNum: 1,
				pageSize: 10
			},
			total: 0
		};
	},
	onShow() {
		/*获取数据*/
		this.listData = [];
		this.form.pageNum = 1;
		this.getData();
	},
	onReachBottom() {
		let self = this;
		if (self.form.pageNum * self.form.pageSize < self.total) {
			self.form.pageNum++;
			self.getData();
		}
		self.no_more = true;
	},
	computed: {
		/*加载中状态*/
		loadingType() {
			if (this.loading) {
				return 1;
			} else {
				if (this.listData.length != 0 && this.no_more) {
					return 2;
				} else {
					return 0;
				}
			}
		}
	},
	methods: {
		getData() {
			let self = this;
			self.loading = true;
			self._get(
				'activity/api/pick/pick-log',
				{
					pageNum: self.pageNum,
					pageSize: 10
				},
				res => {
					self.loading = false;
					self.listData = self.listData.concat(res.rows);

					self.total = res.total;
					if (self.total < self.form.pageNum * self.form.pageSize) {
						self.no_more = true;
					}
				}
			);
		},
		open() {
			// console.log('open');
		},
		close() {
			this.show = false;
			// console.log('close');
		}
	}
};
</script>

<style lang="scss">
.list {
	.item {
		width: 750rpx;
		margin-bottom: 26rpx;
		background: #ffffff;
		padding: 0 20rpx;
		box-sizing: border-box;
		.item-top {
			padding: 28rpx 0 20rpx 0;
		}
		.item-bottom {
			line-height: 76rpx;
		}
	}
}
</style>
