<template>
	<view class="userManage" :style="{height: contentHeight,}">
		<view style="padding: 10px 0; background: #fff;">
			<u-tabs :list="AuditStatusList" :is-scroll="false" :current="current" name="Name" @change="change"
				:active-color="mainColor" bg-color="#FFF" height="80" bar-width="100"></u-tabs>
		</view>
		<view style="height: calc(100vh - 50px); background: #fff;" v-if="dataList.length == 0">
			<u-empty text="暂无相关数据" mode="order"></u-empty>
		</view>
		<view v-if="dataList.length>0"
			style="height: calc(100vh - 50px);width: calc(100vw);overflow: hidden;padding: 25rpx;background-color: #F7F7F7;">
			<scroll-view :scroll-y="true" :enable-back-to-top="true" :enable-flex="true" @scrolltolower="lowerTwo"
				:style="{ height: '100%' }">
				<view class="userList" v-for="(item,index) in dataList">
					<view class="user_Top">
						<view class="user_Header">
							<img style="width:100%;height:100%;" :src="item.Photo" alt="">
						</view>
						<view>
							<view class="userName">{{item.UserName}}</view>
							<view class="tixianLevel">提现金额：{{item.AppliedMoney}}</view>
							<view class="tixianLevel">手续费：{{item.Fee}}</view>
							<view class="tixianLevel">打款金额：{{item.RemitMoney}}</view>
						</view>
					</view>
					<view style="display: flex;justify-content:flex-end;margin-top: 20rpx;">
						<u-button size="mini" class="ucustomStyle" shape="circle" @click="getTixianWay(item)">提现详情
						</u-button>
						<u-button size="mini" v-if="item.AuditStatus==1 || item.AuditStatus==2" class="ucustomStyle" shape="circle" @click="openReason(item,3)">拒绝
						</u-button>
						<u-button size="mini" v-if="item.AuditStatus==1" shape="circle" @click="openReason(item,1)">通过</u-button>
						<u-button size="mini" v-if="item.AuditStatus==2" shape="circle" @click="openReason(item,2)">打款</u-button>
					</view>
				</view>
				<u-loadmore :status="status" :load-text="loadText" :font-size="24" :margin-top="20"
					:margin-bottom="20" bg-color="#f3f4f6" />
			</scroll-view>
		</view>
		<u-modal v-model="isShowTixianWay" :show-cancel-button="false" title="提现方式" contentSlot @confirm="SaveTixian">
			<view style="margin:40rpx;font-size:28rpx;">提现方式：{{tixianWay}}</view>
		</u-modal>
		<u-modal v-model="isShowAgree" :show-cancel-button="true" :title="commonTitle" contentSlot @confirm="SaveAgree">
			<textarea style="height: 120px;" class="replayRemark" v-model="addMsg.Remark" />
		</u-modal>
	</view>
</template>

<script>
	export default {
		components: {

		},
		data() {
			return {
				pageTitle: "提现申请",
				current: 0,
				contentHeight: 0,
				mainColor: "",
				page_count: 1,
				dataList: [],
				u: {},
				msg:{
					pageIndex:1,
					pageSize:15,
					AuditStatus:0,
					UserId:0,
				},
				
				status: "loadmore",
				loadText: {
					loadmore: "轻轻上拉，加载更多",
					loading: "努力加载中",
					nomore: "没有更多了",
				},
				AuditStatusList:[], //流程list
				isShowTixianWay:false,
				tixianWay:'',
				addMsg:{
					RemitId:0,
					Type:1,
					Remark:'',
					ErpEmpId:0
				},
				isShowAgree:false,
				commonTitle:'', //申请标题
			};
		},
		created() {
			this.contentHeight = this.$utils.calcContentHeight(-40) + "px";
			this.mainColor = this.$uiConfig.mainColor;
		},
		mounted() {
			uni.setNavigationBarTitle({
				title: this.pageTitle,
			});
		},
		onLoad: function(option) {
			this.GetAuditStatus();
			this.getList();
		},
		methods: {
			change(index) {
				this.current = index;
				this.dataList = [];
				this.msg.AuditStatus = index;
				this.msg.pageIndex = 1;
				this.getList();
			},
			getList(type) {
				this.dataList = [];
				uni.showLoading({
					title: '加载中'
				});
				this.requestAdmin(
					"/api/user/GetDistributorRemitPageList",
					this.msg,
					(res) => {
						uni.hideLoading();
						if (res.resultCode == 1) {
							this.dataList = this.dataList.concat(res.data.pageData);
							this.page_count = res.data.pageCount;
						}
					}
				);
			},
			lower(e) {
				if (this.msg.pageIndex < this.page_count) {
					this.msg.pageIndex++;
					this.status = "loading";
					this.getList();
				} else {
					this.status = "nomore";
				}
			},
			//获取顶部条件
		    GetAuditStatus(){
				this.requestAdmin("/api/user/GetDistributorRemitAuditStatusEnumList",{}, res => {
					if(res.resultCode==1){
						this.AuditStatusList=res.data;
						let obj={
							Name:'全部',
							Id:0
						}
						this.AuditStatusList.unshift(obj);
					}
				})
			},
			//弹出提现详情
			getTixianWay(item){
				this.isShowTixianWay=true;
				this.tixianWay = item.WithdrawalWayName;
			},
			SaveTixian(){
				this.isShowTixianWay=false;
			},
			openReason(item,type){
				this.isShowAgree=true;
				this.addMsg.Remark='';
				this.addMsg.Type=type;
				this.addMsg.RemitId=item.Id;
				if(type==1){
					this.commonTitle='通过申请'
				}else if(type==3){
					this.commonTitle='拒绝申请'
				}else{
					this.commonTitle='打款申请'
				}
			},
			//保存同意拒绝
			SaveAgree(){
				this.requestAdmin("/api/user/SetDistributorRemitAudit",this.addMsg, res => {
					if(res.resultCode==1){
					   uni.showToast({
						title: '操作成功',
						icon: 'none',
					   })
					   this.getList();
					   this.isShowAgree=false;
					}else{
						uni.showToast({
							title: res.message,
							icon: 'none',
						})
					}
				})
			}
		}
	};
</script>
<style>
	.userManage {
		width: 100%;
		height: 100%;
		background: #f3f4f6;
	}

	.userManage .userList {
		width: 100%;
		background-color: #fff;
		padding: 20rpx;
		margin-bottom: 25rpx;
	}

	.user_Top {
		display: flex;
	}

	.userName {
		font-size: 30rpx;
		color: #000;
	}

	.tixianLevel {
		font-size: 26rpx;
		color: #999999;
		margin-top:10rpx;
	}

	.user_Header {
		width: 100rpx;
		height: 100rpx;
		border-radius: 10rpx;
		overflow: hidden;
		margin-right: 20rpx;
	}

	.user_Header img {
		border-radius: 10rpx;
	}
	
	.ucustomStyle {
		margin-right: 20rpx;
	}
	.replayRemark {
		border: 1px solid #d1d1d1;
		margin: 40rpx 0 40rpx 28rpx;
		padding:20rpx;
		width:500rpx;
	}
</style>
