qianniaoMp/pagesT/NewPartner/cash_detail.vue

<template>
	<!-- 提现明细 -->
	<view class="IncomeDetails">
		<view class="navbar">
			<view v-for="(item, index) in tabData" :key="index" class="nav-item" :class="{ current: tabIndex === index }" @click="tabChange(index)">
				{{ item.title }}
				<view class="current-line"></view>
			</view>
		</view>
		<scroll-view class="income-ul" @scrolltolower="scrollBootom" scroll-y="true" style="height:100%">
			<view class="income-li clearfix" @click="goPage('/pagesT/NewPartner/cash_info?id=' + item.id)" v-for="(item, index) in listData" :key="index">
				<view class="float_left income-label">
					<view class="income-label-text">提现到{{item.bank_type}}</view>
					<view class="income-time">{{ $_utils.formatDate(item.time) }}</view>
				</view>
				<view class="float_right">
					<view class="income-money">
						<text style="margin-left: 6upx;">{{ item.money }}</text>
					</view>
					<view class="status-text">
						{{ item.status === 1 ? '打款成功' : item.status === -1 ? '审核驳回' : item.status === 0 ? '处理中' : '' }}
					</view>
				</view>
			</view>
			<u-loadmore margin-top="20" v-if="listData.length" :status="loading_status" />
		</scroll-view>

	</view>
</template>

<script>
export default {
	data() {
		return {
			isLoding: false,
			loading_status: 'loadmore',
			tabData:[
				{title:"全部",status:"all"},
				{title:"处理中",status:"wait"},
				{title:"已打款",status:"ok"},
				{title:"已驳回",status:"no"},
			],
			tabIndex:0,
			listData:[],
			page: 1,
			pageSize: 10,
			
		};
	},
	onLoad() {
		
	},
	onShow() {
		this.getData();
	},
	methods: {
		scrollBootom() {
			if (this.pageTotal / this.pageSize > this.page) {
				this.page += 1;
				this.getData();
			}
		},
		tabChange(index) {
			this.tabIndex = index;
			this.page = 1;
			this.getData();
		},
		getData(){
			var that = this;
			let post={page: this.page,pageSize: this.pageSize,status:this.tabData[this.tabIndex].status}
			this.load_status = 'loading';
			this.$u.api.getPartnerCashApplyList(post).then(res=>{
				uni.stopPullDownRefresh();
				console.log(res);
				if (that.page === 1) {
					that.listData = res.data.data;
				} else {
					that.listData = that.listData.concat(res.data.data);
				}
				that.total = res.data.total;
				that.load_status = that.$_utils.loadStatus(that.page, that.pageSize, that.total);
			}).catch(err=>{
				uni.stopPullDownRefresh();
				that.load_status = 'nomore';
			})
		},
	}
};
</script>

<style lang="scss">
.income-ul {
	.income-li {
		background-color: #FFFFFF;
		padding: 20upx;
		border-bottom: 1upx solid #f5f5f5;
		.income-label {
			.income-time {
				font-size: 24upx;
				color: #999;
				padding-top: 10upx;
			}
		}
		.float_right {
			text-align: right;
			.income-money {
				color: #333;
				font-size: 32upx;
				font-weight: bold;
			}
			.status-text {
				font-size: 24upx;
				padding-top: 10upx;
				color: #fd463e;
			}
		}
	}
}

.navbar {
	display: flex;
	height: 88upx;
	background: #fff;
	position: relative;
	z-index: 10;
	border-bottom: 1upx solid #eee;

	.nav-item {
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100%;
		font-size: 28upx;
		color: #666666;
		position: relative;
		font-weight: 300;

		&.current {
			font-weight: 500;
			font-size: 32upx;
			color: #fd463e;
			.current-line {
				content: '';
				position: absolute;
				left: 50%;
				bottom: 10upx;
				transform: translateX(-50%);
				width: 40upx;
				height: 6upx;
				background: #fd463e;
				border-radius: 6upx;
			}
		}
	}
}
</style>