<template>
	<view class="settlementrecord-pages">
		<view class="jsList">
			<view v-for="item in list" :key="item.id" class="flex align_center justify_between" @click="viewDetail(item)">
				<view>
					<view>{{item.payDate}}</view>
					<view class="payType">{{ filterpayType(item.payWay) }}</view>
				</view>
				<view>
					<text>￥{{item.settleAmount}}</text>
					<uni-font-icons color="#999" size="12" type="icon-xiangyoujiantou"></uni-font-icons>
				</view>
			</view>
			<view style="padding-top: 50%;border:0" v-if="list.length==0 && status!='loading'">
				<u-empty :src="`/static/nodata.png`" icon-size="240" :text="noDataText" img-width="120" mode="list"></u-empty>
			</view>
			<view style="padding: 20upx;border:0" v-if="(total>=list.length&&list.length)||status=='loading'">
				<u-loadmore load-text="正在加载..." :status="status" />
			</view>
		</view>
	</view>
</template>

<script>
	import {getShelfSettleBillList} from "@/api/shelf.js"
	export default {
		data() {
			return {
				list: [],
				pageNo: 1,
				pageSize: 20,
				total: 0,
				noDataText: '暂无数据',
				status: 'loadimg'
			}
		},
		onLoad() {
			this.getSettleBillList()
		},
		methods: {
			filterpayType(val) {
				let dataList = this.$store.state.vuex_paymentTypeList;
				let _value = '';
				for (let i = 0; i < dataList.length; i++) {
					if (val == dataList[i].code) {
						_value = dataList[i].dispName;
						break;
					}
				}
				return _value;
			},
			getSettleBillList(){
				let params = {
				  pageNo: this.pageNo,
				  pageSize: this.pageSize
				}
				const _this = this
				this.status = "loading"
				getShelfSettleBillList(params).then(res => {
					console.log(res)
					if (res.status == 200) {
					  if(_this.pageNo>1){
						  _this.list = _this.list.concat(res.data.list || [])
					  }else{
						  _this.list = res.data.list || []
					  }
					  _this.total = res.data.count || 0
					} else {
					  _this.list = []
					  _this.total = 0
					  _this.noDataText = res.message
					}
					 
					_this.status = _this.total>=_this.list.length ? "nomore" : 'loadmore'
				})
			},
			viewDetail(item){
				item.payTypeVal = this.filterpayType(item.payWay)
				this.$u.vuex('vuex_settleRecordDetail', item)
				uni.navigateTo({
					url: "/pages/digitalShelf/settlementRecord/settlementDetail"
				})
			}
		},
		onReachBottom() {
			if(this.list.length < this.total){
				this.pageNo += 1
				this.getSettleBillList()
			}else{
				this.status = "nomore"
			}
		}
	}
</script>

<style lang="less">
	.settlementrecord-pages{
		background-color: #fff;
		padding: 10rpx 30rpx;
		min-height: 100vh;
		.jsList{
				> view{
					border-bottom: 2rpx solid #eee;
					padding: 30rpx 10rpx;
					color: #666;
					text{
						margin-left: 10rpx;
						color: #222;
					}
					.payType{
						color: #999;
						margin-top: 10rpx;
					}
				}
			}
	}

</style>
