<template>
		<!-- //后续要能直接点击 进行还款操作 -->
	<view class="debtMoneypage">
		<view v-show="pageInfo.total==0">
			<view class='empty cuIcon-info'></view>
			<view class='empty-text text-gray'>暂无数据</view>
		</view>
		<view class="debtMoney  bg-white " v-for="(item,index) in pageInfo.debtMoneyList" :key='index'>
			<navigator :url="'../account/account-detail/account-detail?debtMoney='+JSON.stringify(item)">
				
				<view>
					<view class="debtMoney-t">
						<view class="debtMoney-title">
							项目名称
						</view>
						<text class="debtMoney-content projectname">{{item.tradeName}}</text>
					</view>
					<view class="debtMoney-t">
						<view class="debtMoney-title">
							交易时间
						</view>
						<text class="debtMoney-content projectname">{{item.docDate}}</text>
					</view>
					<view class="debtMoney-t">
						<view class="debtMoney-title">
							交易类型
						</view>
						<text class="debtMoney-content">{{item.docType=='card_recharge'?'充值':'买疗程'}}</text>
						<view class="debtMoney-title">
							交易金额
						</view>
						<text class="debtMoney-content">{{item.tradeMoney}}</text>
						
					</view>
					<view class="debtMoney-t">
						<view class="debtMoney-title">
							待支付
						</view>
						<text class="debtMoney-content text-red text-price">{{item.debtMoney}}</text>
					</view>
				</view>
			</navigator> 
		</view>
		<text class="margin-left">共 {{pageInfo.total}} 条数据</text>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo: null,
				pageInfo: {
					total: 0,
					pageNum: 1,
					pageSize: 5,
					debtMoneyList: []
				},
			}
		},
		methods: {
			debtPage() {
				var page = {
					memberId: this.userInfo.id,
					storeId: this.userInfo.storeId,
					pageNum: this.pageInfo.pageNum,
					pageSize: this.pageInfo.pageSize
				}
				this.$api.debtPage(page).then(res => {
					if (res.code == '000000') {
						res.pageInfo.list.forEach(item => {
							item.editOrder = true
						})
						res.pageInfo.debtMoneyList = res.pageInfo.list
						this.pageInfo = res.pageInfo
					} else if(res.code=='510002'||res.code=='502001'){
					}else{
						uni.showModal({
							title: '提示',
							content: res.message,
							showCancel: false,
							success: function(res) {}
						})
						
					}
				})
			}
		},
		onShow: function() {
			this.userInfo = uni.getStorageSync('userInfo')
			this.debtPage()
		},
		onReachBottom: function() {
			this.pageInfo.pageSize = this.pageInfo.pageSize + 5
			this.debtPage()
		},
		onPullDownRefresh: function() {
			setTimeout(function() {
				uni.redirectTo({
					url:'./debtMoney'
				})
				uni.showToast({
					title: '刷新成功',
					icon: 'success',
					duration: 2000
				});
				uni.stopPullDownRefresh();
			}, 1000);
		}
	}
</script>

<style>
	.debtMoneypage {
		padding-top: 50upx;
	}

	.debtMoney {
		width: 94%;
		height: 240upx;
		border: #dddddd 1upx solid;
		box-shadow: 2upx 2upx 2upx #d0d0d0;
		border-radius: 10upx;
		margin: 20upx 3%;
		padding: 20upx 0;

	}
	.debtMoney-title {
		padding-top: 10upx;
		padding-left: 30upx;
		font-size: 28upx;
		font-weight: 700;
		display: inline-block;
	}
	.projectname{
	/* 	overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap; */
	}

	.debtMoney text {
		font-size: 26upx;
		font-weight: normal;
		padding-left: 20upx;
	}
	.debtMoney-content{
		width: 500upx;
	}
</style>
