<template>
	<view class="container">
		<view class="contentBox" v-if="!depotMoneyother">
			<!-- <image mode='widthFix' src="https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/images/xiaopaycard (31).png"></image> -->
			<view class="contentDiv">
				<view class="headview">
					<view class="schoolname">{{PersonalInfo.schoolname}}</view>
					<view class="IconCls">电子校园卡</view>
				</view>
				<!-- 卡号显示 -->
				<view class="cardNum">
					<view class="cardNumleft"><span>账户：</span> **** **** **** 3925 <span>(平安III类户)</span></view>
					<view class="cardNumright" id="cardNumright" @click="CopyCardNumber">复制</view>
				</view>
				<view class="HidenText">
					<view class="userName">姓名：<span>张三</span></view>
					<view class="StudentCls" v-if="PersonalInfo.usertype=='1'">班级：高一(63班)</view>
					<view class='TeacherCls' v-else>教职工</view>
				</view>
				<view class="Balance">
					<view class="cardBalanceTx">余额：￥<span>0.00</span></view>
					<view @click="ToWalletTx">
						<span style="display: inline-block;padding-right: 10rpx;">余额提现</span>
						<image style="position: relative;width: 13rpx;height: 20rpx;" class='ImgIcon1' mode='widthFix'
							:src="ImgUrl+'images/xiaopaycard (17).png'" alt=""></image>
					</view>
				</view>
			</view>
			<!-- 充值明细 -->
			<view class="RechargeDetailed" @click="BackToMini('purchaseDetail')">
				账户明细
			</view>
			<!-- 充值账户 -->
			<view class="Recharge">
				<span></span>
				<span>账户充值</span>
			</view>
			<!--  充值的金额 -->
			<view class="MoneyBox">
				<view class="depotMoney" @click="depotMoney(item.value,index)"
					v-bind:class="(MoneyIndex==index)?'choiceClass':''" :data-money="item.value||0"
					v-for="(item,index) in MoneyList" :key="index">
					<span class="value">
						{{item.value}}
					</span>
					<span style="font-size: 28rpx;font-weight: 600;margin-left: 7rpx;">{{item.lable}}</span>
					<!-- <span class="tips" v-show="item.tips">
						{{item.tips}}
					</span> -->
				</view>
			</view>
			<!-- 充值限额提示 -->
			<view class="depositbox">
				<image mode='widthFix' class="depositImg" src="../../../static/img/depositIcon.png"></image>
				<span style="vertical-align:middle;font-size: 28rpx;color: #333333;font-weight: 500;">最大可充值金额：<span
						style="color:red;">￥<span class="canDepositTx">200000</span></span></span>
			</view>
			<!-- 充值其它金额 -->
			<view class="OtherMoney" v-if="isOtherMoney">
				<span>￥</span>
				<input v-model="inputOtherM" @input="inputControl" @blur="ReturnToTop" placeholder="请输入其他金额，最低3元"
					placeholder-class="placeholderinputOtherM" type="text" maxlength="6" />
			</view>
			<!-- 支付方式 -->
			<view class="payType" @click="queryBindCardList">
				<view>付款方式</view>
				<view>招商银行(5947) <span class="arrow"></span></view>
			</view>
			<!-- <view class="" style="height: 1rpx;background-color: #DFDFDF;"></view> -->
			<!-- 充值生活费 -->
			<view class="bottomdiv">
				<view class="DepositID" @click="toDeposit(0)"
					v-bind:style="Money!=''?'':'background: #e6e6e6 !important;'">
					<span>充值生活费</span>
				</view>
				<!--  -->
				<view class="switchbankCard" @click="BackToMini('AssignAddCard')">我要换银行卡支付</view>
			</view>

		</view>
		<!-- 其他充值金额 -->
		<view class="contentBox" v-if="depotMoneyother">
			<view class="OtherTitle">充值金额</view>
			<view class="inputOtherM">
				<span>￥</span>
				<input @focus="openKeyBoard('number')" v-model="inputOtherM" @input="inputControl"
					placeholder-class="placeholderinputOtherM" type="text" maxlength="6" />
			</view>
			<view class="OtherLine"></view>
			<!-- 充值范围 -->
			<view class="Recharge_">
				<!-- <image mode="widthFix" class="depositImg" src="../../static/img/depositIcon.png"></image> -->
				<span>最大可充值金额：</span>
				<span>￥<span>3.00 ~ 2000.00</span></span>
			</view>
		</view>
		<!-- 弹出层 -->
		<uni-popup ref="popup" :mask-click="false">
			<!-- 充值确认 -->
			<view class="RechargeConfirmationBox">
				<view class="RechargeInfo">
					<view class="closePhoneBox" @click="close()">
						<image src="../../../static/img/close.png" mode="aspectFit"></image>
					</view>
					<view class="RechargeInfo1">
						充值生活费
					</view>
					<view style="width: 520rpx;height: 1rpx;background: #EEEEEE;"></view>
					<view class="ContenInfo">
						<view class="">
							充值金额:50元
						</view>
						<view class="">
							付款账户：浦发银行(6926)
						</view>
					</view>
					<view style="width: 520rpx;height: 1rpx;background: #EEEEEE;"></view>
					<!-- 取消 确认充值按钮 -->
					<view class="BtngGoup">
						<view class="">
							取消
						</view>
						<view class="">
							确认充值
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
		<!-- 数字键盘 -->
		<keyboard-package ref="number" @onInput="onInput" @onDelete="onDelete" @onConfirm="onConfirm"
			:disableDot="false" />
	</view>
</template>

<script>
	import {
		Dialog
	} from 'vant';
	import keyboardPackage from "@/components/keyboard-package/keyboard-package.vue"
	import cityData from "@/common/js/city.js"
	var gHost = "https://" + window.location.host;
	if (window.location.protocol != "https:") {
		gHost = "https://fpdev.xiaopay.net";
	}
	let times = 0;
	var limitClick = false; //禁止重复点击
	var sessionID = '',
		userID = '';
	var payCardNumber = ''; //一类卡号
	var orderSerialNo = ''; //提现结果查询 指令号
	var businessNo = '',
		otpOrderNo = '',
		mobileNo = '';
	var msCount = 60; //定时器
	var MyTimer = null;
	var fromType = 0; //0转账  1提现
	var opeType = 0; //0充值  1提现   手机号验证
	var bankInfo = {
		acctNoArray: '',
		idNo: '',
		schoolId: '',
		trueName: '',
		userId: '',
		sessionid: '',
		wechattype: 1
	}
	export default {
		components: {
			keyboardPackage
		},
		name: "Recharge",
		data() {
			return {
				// 输入其它金额
				isOtherMoney: false,
				inputOtherM: '',
				RechargeException: false,
				depotMoneyother: false, //其他充值
				Money: '', //选择金额
				MoneyIndex: -1,
				RechargeMax: '2000', //最大充值限制
				ReflectMoney: '', //提现金额
				VerifyCode: '', //验证码
				cardBalanceTx: '0', //余额
				CodeMsg: "获取验证码",
				type: 'number',
				PersonalInfo: {
					schoolname: "微微学测试",
					name: "李智书",
					usertype: "1"
				},
				ImgUrl: this.$ImgUrl,
				MoneyList: Array(6).fill(1).map((v, index) => {
					return {
						lable: index == 5 ? '其他金额' : '元',
						value: index == 5 ? '' : 50 * (index + 1),
						tips: index == 1 ? "推荐充值" : null
					}
				}),
				numberList: [],
				tempFiles1: '../../static/img/idCardBg1.png', //上传身份证临时选择文件
				tempFiles2: '../../static/img/idCardBg0.png'
			}
		},
		onLoad: function(options) {
			console.log(options);
			// 初始化
			userID = options['userID'] || '';
			sessionID = options['seesionID'] || '';
			fromType = options['fromType'] || '';
			bankInfo.sessionid = sessionID || '';

			this.queryUserBankInfo()
			this.QueryUserInfo()
			this.queryBankInfo()
		},
		created: function() {

		},
		mounted: function() {

		},
		methods: {
			// 输入限制
			inputControl(e) {
				let this_ = this
				let obj = e.detail
				this.$nextTick(function() {
					obj.value = obj.value.replace(/[^\d.]/g, ""); //清除"数字"和"."以外的字符
					obj.value = obj.value.replace(/^\./g, ""); //验证第一个字符是数字而不是.
					obj.value = obj.value.replace(/\.{2,}/g, "."); //只保留第一个. 清除多余的.
					obj.value = obj.value.replace(".", "$#$").replace(/\./g, "").replace("$#$", "."); //只允许输入一个小数点
					obj.value = obj.value.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); //只能输入两个小数
					obj.value = obj.value * 1 > 2000 ? 2000 : obj.value;
					if (obj.value == '' || obj.value * 1 < 3) {
						$('.DepositID').attr('style', 'background: rgb(230, 230, 230) !important;');
					} else {
						$('.DepositID').removeAttr('style');
					}
					this_.inputOtherM = obj.value
				})
			},
			//input键盘弹起不会弹
			ReturnToTop() {
				this.$nextTick(function() {
					document.scrollingElement.scrollTo(0, this.scrollTop);
				})
			},
			// 复制我卡号
			async CopyCardNumber() {
				let value = "sdfsdf"
				Dialog({
					title: '系统提示',
					message: '复制成功！'
				});
				this.$nextTick(function() {
					let clipboard = new ClipboardJS('#cardNumright', {
						text: function() {
							return value
						}
					})
				})
			},
			//选择输入其他金额
			OtherMoney() {
				this.depotMoneyother = true
			},
			// 快捷选择金额
			async depotMoney(value, MoneyIndex) {
				console.log(value)
				if (!value) {
					this.isOtherMoney = true
					this.Money = ''
					this.MoneyIndex = MoneyIndex
					return
				}
				this.isOtherMoney = false
				this.Money = parseInt(value)
				this.MoneyIndex = MoneyIndex
			},
			//按钮操作
			HideHTML(dom, type) {
				if (type == 0) {
					$('.' + dom).css('display', 'none');
				} else {
					$('.' + dom).css('display', 'block');
				}
			},
			//返回小程序 跳转指定页面
			BackToMini(page) {
				if (page == 'UserMain' || page == 'personalCenter') {
					wx.miniProgram.switchTab({
						url: `/pages/${page}/main`,
					});
				} else {
					wx.miniProgram.redirectTo({
						url: `/pages/${page}/main`,
					});
				}
			},
			//换绑卡
			ChangeCardPay(bankName, bindCard) {
				let this_ = this;
				if (bindCard == payCardNumber) {
					return
				}
				var loading = weui.loading('请稍后');
				$.ajax({
					url: gHost + '/bank-wechat/user/bank/change/bind',
					type: "POST",
					contentType: "application/x-www-form-urlencoded",
					data: {
						schoolId: bankInfo.schoolId,
						userId: userID,
						sessionid: sessionID,
						wechattype: 1,
						accountName: bankName,
						accountNo: bindCard,
					},
					success: function(res5) {
						loading.hide();
						if (res5.code == "10000") {
							this_.HideHTML('showBindCardList', 0);
							this_.queryUserBankInfo();
						} else {
							weui.topTips(res5.message)
						}
					},
					error: function(err) {
						loading.hide();
					},
				});
			},
			//查询一类卡绑定列表
			queryBindCardList() {
				let this_ = this;
				let loading = weui.loading('请稍后');
				$.ajax({
					url: gHost + '/bank-wechat/query/account',
					type: "POST",
					contentType: "application/x-www-form-urlencoded",
					data: {
						schoolId: bankInfo.schoolId,
						userId: userID,
						sessionid: sessionID,
						wechattype: 1
					},
					success: function(res4) {
						loading.hide();
						if (res4.code == "10000") {
							var divList = '';
							var choiceIndex = 0;
							for (let i = 0; i < res4.results.accountList[0].bindcardList.length; i++) {
								divList += `<div onclick=ChangeCardPay('${res4.results.accountList[0].bindcardList[i].bankName}','${res4.results.accountList[0].bindcardList[i].bindCardNo}')>
			                    <p>${res4.results.accountList[0].bindcardList[i].bankName}</p>
			                    <p>${res4.results.accountList[0].bindcardList[i].bindCardNo.substr(0,4)+" **** **** "+res4.results.accountList[0].bindcardList[i].bindCardNo.substr(-4)}</p>
			                    <img class='myImg${i} BankListImg' src='img/choiceBank.png'>
			                    </div>`
								if (res4.results.accountList[0].bindcardList[i].bindCardNo == payCardNumber) {
									choiceIndex = i;
								}
							}
							$('.hideListCover').html(divList);
							$(`.myImg${choiceIndex}`).css('display', 'block');
							$('.showBindCardList').css('display', 'block');
						} else {
							weui.topTips(res4.message)
						}
					},
					error: function(err) {
						loading.hide();
					},
				});
			},
			//获取银行余额
			queryBankInfo() {
				let this_ = this;
				let loading = weui.loading('请稍后');
				$.ajax({
					url: gHost + '/bank-wechat/query/balance',
					type: "POST",
					timeout: 8000,
					contentType: "application/x-www-form-urlencoded",
					data: bankInfo,
					success: function(res3) {
						loading.hide();
						if (res3.code == "10000") {
							if (res3.results.acctInfoList == null) {
								weui.topTips("账户信息为空，余额查询失败");
							} else {
								this_.cardBalanceTx = ((res3.results.acctInfoList[0].hqBalanceDTOList[0]
									.balance *
									1).toFixed(2));
								$('.TxClsTx').attr('placeholder',
									`可提现金额${(res3.results.acctInfoList[0].hqBalanceDTOList[0].balance*1).toFixed(2)}元`
								)
								this_.RechargeMax = ((2000 - ((res3.results.acctInfoList[0]
									.hqBalanceDTOList[0]
									.balance * 1).toFixed(2) * 1)).toFixed(2));
							}
						} else {
							weui.topTips(res3.message)
						}
					},
					error: function(err) {
						loading.hide();
					},
					complete: function(XMLHttpRequest, status) {
						loading.hide();
						if (status == 'timeout') {
							weui.topTips("请求超时，余额查询失败");
						}
					}
				})
			},
			//获取用户已填写银行信息
			queryUserBankInfo() {
				let this_ = this;
				let loading = weui.loading('请稍后');
				$.ajax({
					url: gHost + '/bank-wechat/user/bank/get',
					type: "POST",
					contentType: "application/x-www-form-urlencoded",
					data: {
						schoolId: bankInfo.schoolId,
						userId: userID,
						sessionid: sessionID,
						wechattype: 1
					},
					success: function(res2) {
						if (res2.code == "10000") {
							bankInfo = res2.results;
							this_.queryBankInfo();
						} else {
							weui.topTips(res2.message)
						}
					},
					error: function(err) {
						loading.hide();
					},
				});
			},
			//查询用户信息
			QueryUserInfo() {
				let this_ = this;
				let loading = weui.loading('请稍后');
				$.ajax({
					url: gHost + '/wechat/svweapp/QueryPersonalInfo',
					type: "POST",
					contentType: "application/x-www-form-urlencoded",
					data: {
						userid: userID,
						sessionid: sessionID,
						wechattype: 1
					},
					success: function(res1) {
						loading.hide();
						if (res1.code == "10000") {
							bankInfo.schoolId = res1.results.schoolid;
							bankInfo.userId = res1.results.id;
							$('.userNameTx').html(res1.results.name);
							$('.schoolNameTx').html(res1.results.schoolname);
							$('.ClsNameTx').html(res1.results.gradename + res1.results.classname);
							if (res1.results.usertype == 1) {
								$('.StudentCls').css('display', 'block');
								$('.TeacherCls').css('display', 'none');
							} else {
								$('.StudentCls').css('display', 'none');
								$('.TeacherCls').css('display', 'block');
							}
							this_.queryUserBankInfo();
						} else {
							weui.topTips(res1.message);
							setTimeout(() => {
								this_.BackToMini('UserMain');
							}, 1500)
						}
					},
					error: function(err) {
						loading.hide();
					},
				});
			},
		}
	}
</script>

<style scoped lang="scss">
	html,
	body,
	page {
		width: 750rpx;
		background: linear-gradient(180deg, #FFFFFF 0%, #FAFAFA 100%);
	}

	.cardNum {
		width: 574rpx;
		margin: 0 auto;
		display: flex;
		justify-content: space-between;
		padding-top: 36rpx;
		font-size: 24rpx;

		.cardNumleft {
			font-family: PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
		}

		.cardNumright {
			font-family: PingFang SC;
			font-weight: 500;
			text-decoration: underline;
			color: #FFFFFF;
		}

	}

	.RechargeDetailed {
		text-align: center;
		// width: 118rpx;
		height: 32rpx;
		margin: 0 auto;
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: 500;
		text-decoration: underline;
		color: #36A8FF;
		margin-top: 50rpx;
	}


	.contentBox {
		width: 670rpx;
		height: 376rpx;
		margin: 0 auto;
	}

	.contentDiv {
		height: 100%;
		// margin-top: 36rpx;
		border-radius: 15rpx;
		background-image: url('https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/images/xiaopaycard (31).png');
		background-repeat: no-repeat;
		background-size: 100% 100%;

		position: relative;
		top: 36rpx;
	}

	.HidenText {
		width: 574rpx;
		margin: 0 auto;
		padding-top: 88rpx;

	}

	.HidenText,
	.Balance {
		padding-left: 46rpx;
		padding-right: 40rpx;
		display: flex;
		justify-content: space-between;

		font-size: 28rpx;
		color: #FFFFFF;
	}

	.Balance {
		width: 574rpx;
		margin: 0 auto;
		margin-top: 20rpx;

		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
	}

	.Recharge {
		// height: 30rpx;
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #333333;
		margin-top: 58rpx;

		span:nth-child(1) {
			width: 4rpx;
			height: 30rpx;
			background: #23D6A3;
			border-radius: 2rpx;
			display: inline-block;
			position: relative;
			top: 5rpx;
		}

		span:nth-child(2) {
			display: inline-block;
			margin-left: 16rpx;

		}
	}


	.headview {
		display: flex;
		justify-content: space-between;
		// padding-left: 40rpx;
		// padding-right: 40rpx;

		padding-top: 36rpx;
		width: 574rpx;
		margin: 0 auto;
	}

	.headview .schoolname {
		width: 252rpx;
		height: 50rpx;
		font-size: 36rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
		line-height: 50rpx;
	}

	.headview .IconCls {
		width: 170rpx;
		height: 48rpx;
		background: #20946D;
		border-radius: 25rpx;

		font-size: 24rpx;
		font-weight: 400;
		color: #FFFFFF;
		line-height: 48rpx;
		text-align: center;
	}

	.MoneyBox {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		height: auto;
		color: #888888;
		width: 686rpx;
		margin: 0 auto;
	}

	.choiceClass {
		background: rgba(39, 266, 148, 0.1) !important;
		color: #28D79C;
	}

	.MoneyBox view {
		width: 220rpx;
		height: 120rpx;
		background: #FFFFFF;
		border-radius: 8rpx;
		border: 1rpx solid #EEEEEE;
		margin-top: 16rpx;
		text-align: center;
		position: relative;
		box-shadow: 0px 9rpx 23rpx 0rpx rgba(25, 26, 88, 0.07);
	}

	.depotMoney .value {
		font-size: 45rpx;
		font-family: PingFangSC-Semibold, PingFang SC;
		font-weight: 600;
		line-height: 120rpx;
		text-align: center;
	}

	.depotMoney .tips {
		// width: 79rpx;
		// height: 33rpx;
		// background: linear-gradient(180deg, #FA6400 0%, #FD9D00 100%);
		// border-radius: 4rpx;
		// font-size: 18rpx;
		// font-weight: 500;
		// padding: 4rpx;
		// text-align: center;
		// float: right;
		// position: absolute;
		// right: 0rpx;
		// line-height: 33rpx;
	}

	.OtherMoney {
		display: flex;
		justify-content: flex-start;
		// color: #999999;
		// font-size: 28rpx;
		// font-family: PingFangSC-Regular, PingFang SC;
		// font-weight: 400;
		// color: #999999;
		// line-height: 40rpx;
		width: 686rpx;
		height: 100rpx;
		background: #F7F6FB;
		border-radius: 10rpx;
		margin: 0 auto;
		line-height: 100rpx;
		margin-top: 32rpx;
		padding-left: 26rpx;

		span {
			display: inline-block;
			font-size: 40rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #000000;
		}

		input {
			height: 100%;
		}
	}

	.OtherMoney view:nth-child(2) {
		// width: 30rpx;
		// height: 30rpx;
		// background: #F0F0F0;
		// border-radius: 50%;
		// text-align: center;
		// line-height: 30rpx;
		// margin-top: 7rpx;
		// margin-left: 5rpx;
	}

	.payType {
		height: 98rpx;
		line-height: 98rpx;
		display: flex;
		justify-content: space-between;
	}

	.payType view:nth-child(1) {
		// width: 120rpx;
		height: 42rpx;
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #888888;
		line-height: 98rpx;
	}

	.payType view::nth-child(2) {
		width: 225rpx;
		height: 45rpx;
		font-size: 32rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #333333;
		line-height: 45rpx;
	}



	.arrow {
		transform: rotate(-45deg);
		top: -3rpx;
		border: solid #999999;
		border-width: 0 1rpx 1rpx 0;
		display: inline-block;
		padding: 8rpx;
		position: relative;

	}


	.bottomdiv {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 30rpx;
	}

	.DepositID {
		width: 630rpx;
		height: 92rpx;
		background: #04BA73;
		border-radius: 8rpx;
		margin: 0 auto;
		text-align: center;
		bottom: 30rpx;

	}

	.DepositID span {
		height: 50rpx;
		font-size: 36rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
		line-height: 92rpx;
	}

	.switchbankCard {
		text-align: center;
		/* width: 205px; */
		// height: 28rpx;
		font-size: 26rpx;
		font-family: PingFang SC;
		font-weight: 500;
		text-decoration: underline;
		color: #268EF8;
		margin-top: 23rpx;
	}

	.RechargeConfirmationBox {
		position: fixed;
		left: 0;
		right: 0;
		top: 460rpx;
		width: 618rpx;
		height: 478rpx;
		background: #FFFFFF;
		border-radius: 8rpx;
		margin: 0 auto;

		.RechargeInfo {
			width: 520rpx;
			height: 100%;
			margin: 0 auto;

			.RechargeInfo1 {
				height: 124rpx;
				line-height: 124rpx;
				font-size: 36rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #000000;
				text-align: center;
			}

			.ContenInfo {
				width: 383rpx;
				height: 159rpx;
				margin: 0 auto;


				font-size: 32rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #010101;
				line-height: 60rpx;
			}

			.BtngGoup {
				justify-content: space-between;
				display: flex;
				margin-top: 40rpx;

				view {
					width: 250rpx;
					height: 88rpx;
					border-radius: 8rpx;
					text-align: center;
					line-height: 88rpx;
				}

				view:nth-child(1) {
					background: #EBEBEB;
					font-size: 36rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #1CC48B;
				}

				view:nth-child(2) {
					background: #1CC48B;
					font-size: 36rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #FFFFFF;
				}

			}

		}
	}

	.closePhoneBox {
		// width: 35rpx;
		height: 35rpx;
		position: relative;
		right: -20rpx;
		top: 20rpx;
		text-align: right;

		image {
			width: 40rpx;
			height: 40rpx;
			position: relative;
		}

	}

	.doBtnTx {
		width: 506rpx;
		height: 92rpx;
		background: #04BA73;
		border-radius: 8rpx;
		color: #FFFFFF;

		position: absolute;
		left: 0;
		right: 0;
		margin: 0 auto;
		bottom: 38rpx;
	}

	.PhoneNum,
	.VerifyCode {
		width: 506rpx;
		height: 80rpx;
		line-height: 60rpx;
		background: #F7F6FB;
		margin: 0 auto;
		margin-top: 20rpx;
	}

	.VerifyCode {
		display: flex;
		justify-content: space-between;
	}

	.VerifyCode input {
		width: 200rpx;
	}

	.CodeMsg {
		color: #01BC73;
		background: #F7F6FB;
		font-size: 32rpx;
		font-weight: 600;
		line-height: 80rpx;
		letter-spacing: 3rpx;
	}

	.placeholderInput {
		color: #AAAAAA;
		font-size: 42rpx;
		font-weight: 500;
		letter-spacing: 3rpx;
		// padding-left: 50rpx;
		height: 80rpx;
	}

	.OtherTitle {
		height: 67rpx;
		font-size: 48rpx;
		font-family: PingFangSC-Semibold, PingFang SC;
		font-weight: 600;
		color: #010101;
		line-height: 67rpx;

		padding-top: 60rpx;
	}

	.inputOtherM {
		display: flex;
		height: 100rpx;
		margin-top: 40rpx;
	}

	.inputOtherM input {
		border: none;
		outline: none;
		height: 50rpx;
		padding-left: 16rpx;
		font-size: 72rpx;
		font-weight: 600;
	}

	.inputOtherM span:nth-child(1) {
		width: 72rpx;
		font-size: 80rpx;
		font-family: PingFangSC-Semibold, PingFang SC;
		font-weight: 600;
		color: #010101;
		line-height: 100rpx;
	}

	.OtherLine {
		width: 631rpx;
		height: 1rpx;
		background-color: #CCCCCC;
		margin-top: 19rpx;
	}

	.depositbox {
		margin-top: 31rpx;
		height: 30rpx;
		line-height: 30rpx;
	}

	.depositImg {
		width: 24rpx;
		height: 24rpx;
		vertical-align: middle;
		margin-right: 8rpx;
		position: relative;
		top: -2rpx;
	}

	.Recharge_ {
		height: 40rpx;
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
		line-height: 40rpx;
		margin-top: 40rpx;
	}

	.Recharge_ span:nth-child(2) {
		font-size: 28rpx;
		font-family: PingFangSC-Semibold, PingFang SC;
		font-weight: 600;
		color: #FA6400;
	}

	.placeholderinputOtherM {
		height: 50rpx;
		// font-family: PingFangSC-Semibold, PingFang SC;
		// font-weight: 600;
		// color: #010101;
		line-height: 50rpx;
		width: 323rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #888888;
	}

	// 异常处理
	.RechargeException {
		padding-top: 20rpx;
	}

	.weui-label {
		// width: 118rpx;
		height: 42rpx;
		font-size: 30rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #3D3D3D;
		line-height: 42rpx;
		font-weight: bold;
		margin-left: 30rpx;
	}

	.tiptext {
		height: 1.06rem;
		font-size: 0.75rem;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #03BC73;
		line-height: 1.06rem;
		margin-bottom: 0.625rem;
		text-align: center;
	}

	.bottomDetail {
		width: 628rpx;
		height: 88rpx;
		color: white;
		// position: fixed;
		// left: 0;
		// right: 0;
		margin: 0 auto;
		background-color: #03BC73;
		text-align: center;
		line-height: 88rpx;


		margin-top: 84rpx;
	}


	.RechargeException input::placeholder {
		color: #A1A4A8;
	}

	.RechargeException .weui-cell {
		height: 4rem;
		padding: 0 !important;
	}

	.idCardPhoto1,
	.idCardPhoto2 {
		width: 388rpx;
		height: 224rpx;
		margin: 0 auto;
		margin-top: 20rpx;
	}

	.idCardPhoto1 image,
	.idCardPhoto2 image {
		width: 100%;
		height: 100%;
		position: relative;
	}

	.weui-toptips_success {
		background-color: #03BC73 !important
	}

	.positionCam {
		height: 32rpx;
		font-size: 22rpx;
		font-family: PingFang-SC-Medium, PingFang-SC;
		font-weight: 500;
		color: #6D7278;
		line-height: 32rpx;
		text-align: center;
		position: relative;
		top: -29px;
	}
</style>
