<template>
	<view class="page">
		<ul style="height:100%;overflow: scroll;">
			<li v-for="(item,index ) in list" :key="index">
				<uni-card :title="'店铺名称:'+item.shopName" :sub-title="'扣减金额：'+ item.workerFixedAmount ">
					<view class="uni-body">
						<text class="cardText">扣减后余额：{{item.workerAfterDepoBal}}</text>
					</view>
					<view class="uni-body">
						<text class="cardText">扣减时间：</text>
						<text class="priceText">{{item.createTime}}</text>
					</view>
				</uni-card>
			</li>
		</ul>
		<uni-load-more :status="status"></uni-load-more>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [],
				workerId:'',
				pages:1,
				status: 'more',
				totalPages:0,
				statusTypes: [{
					value: 'more',
					text: '加载前',
					checked: true
				}, {
					value: 'loading',
					text: '加载中',
					checked: false
				}, {
					value: 'noMore',
					text: '没有更多',
					checked: false
				}],
			}
		},
		onReachBottom() {
			if (this.pages >= this.totalPages) return;
			this.status = 'loading';
			this.pages = ++this.pages;
			this.getlist();
		},
		onLoad() {
			this.workerId = uni.getStorageSync('workerId');
			this.getlist()
		},
		methods: {
			onChange(e) {
				this.status = e.detail.value
			},
			clickLoadMore(e) {
				uni.showToast({
					icon: 'none',
					title: "当前状态：" + e.detail.status
				})
			},
			getlist() {
				var that = this
				this.status = 'loading';
				this.NB.sendRequest("/app/deductlog/getWorkerLogById", {
					workerId: that.workerId,
					pageNum:that.pages,
					pageSize:10

				}, false,"POST",'application/json').then(function(data) {
					that.status = 'noMore';
					if(data.code == 200){
						if (that.pages == 1) {
							that.list = data.result.records
						} else {
							that.list = [...that.list, ...data.result.records]
						}
						that.totalPages = res.result.pages
					}
				})
			},
			onChange(e) {
				this.status = e.detail.value
			},
			clickLoadMore(e) {
				uni.showToast({
					icon: 'none',
					title: "当前状态：" + e.detail.status
				})
			}
		}
	}
</script>

<style>
	.page {
		width: 100%;
		height: 100%;
		overflow: hidden;
		background-color: #F2F2F2;
	}
	
	page {
		width: 100%;
		height: 100%;
		overflow: hidden;
	}
	.item-wrapper {
		background-color: #fff;
		overflow: hidden;
	}
</style>
