NFT/pages/assets/recharge.vue

<template>
	<view class="center">
		<view class="top">
			<view class="title flex">
				<view class="xian"></view>
				<view class="title-font">充币二维码TRC20</view>
			</view>
			<view class="erweima-box">
				<view class="erweima-font">请转入USDT</view>
				<view class="erweima">
					<tki-qrcode
						:cid="cid"
						ref="qrcode"
						:val="num"
						:size="size"
						:unit="unit"
						:background="background"
						:foreground="foreground"
						:pdground="pdground"
						:iconSize="iconSize"
						:lv="lv"
						:onval="onval"
						:loadMake="loadMake"
						:usingComponents="usingComponents"
						@result="qrR"
					/>
				</view>
				
			</view>
			<view class="btn" @click="domFile">保存二维码</view>
		</view>
		<view class="top">
			<view class="title flex">
				<view class="xian"></view>
				<view class="title-font">充币地址</view>
			</view>
			<view class="address">{{ num }}</view>
			<view class="btn" style="margin-top: 50rpx;" @click="setData">复制充币地址</view>
		</view>
		<view class="top info">
			请勿向上述地址充值人任何非USDT资产，否则资产将不可追回。
			<br />
			USDT冲币仅支持TRC2.0波场上的资产，其他USDT将无法上帐，请您谅解。
			<br />
			您充值至上述地址后，需要整个网络节点确认，1次网络确认后到账，2次网络确认后即可提币。
			<br />
			最小充值金额：10USDT,小于最小金额的充值将不会上帐且无法退回。
		</view>
	</view>
</template>

<script>
import { wallet } from '@/api/finance.js';
import tkiQrcode from '@/components/tki-qrcode/tki-qrcode.vue';
export default {
	data() {
		return {
			num: '',
			image: '../../static/re/re1.png',
			cid: 'cid',
			size: 150,
			unit: '150',
			background: '#FFFFFF',
			foreground: '#000000',
			pdground: '#000000',
			icon: '',
			iconSize: 40,
			lv: 3,
			onval: true,
			loadMake: true,
			usingComponents: true,
		};
	},
	onLoad() {
		this.loadData();
	},
	methods: {
		async loadData() {
			wallet().then(({ data }) => {
				console.log(data);
				const arr = Object.keys(data.back);
				console.log(arr);
				let ar = [];
				arr.forEach(e => {
					console.log(e)
					ar.push(data.back[e]);
				});
				console.log(ar)
				this.num = ar[0].money.address
			});
		},
		domFile() {
			uni.downloadFile({
				url: this.image,
				success: e => {
					console.log(e);
					uni.showToast({
						title: '下载成功！'
					});
				},
				fail(e) {
					uni.showToast({
						title: '复制失败',
						icon: false
					});
					console.log(e);
				}
			});
		},
		qrR(res) {
			this.src = res;
		},
		setData() {
			// #ifdef APP-PLUS
			uni.setClipboardData({
				data: this.num,
				success: e => {
					uni.showToast({
						title: '复制成功！'
					});
				},
				fail(e) {
					uni.showToast({
						title: '复制失败',
						icon: false
					});
					console.log(e);
				}
			});
			// #endif
		}
	}
};
</script>

<style lang="scss">
.center,
page {
	height: 100%;
	background: #f3f3f3;
}
.top:first-child {
	margin-top: 0;
}
.top {
	margin-top: 20rpx;
	width: 100%;
	height: auto;
	background: #ffffff;
	padding: 26rpx 30rpx 50rpx;
	.erweima-box {
		margin-top: 77rpx;
		.erweima-font {
			text-align: center;
			font-size: 30rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #333333;
		}
		.erweima {
			margin: 16rpx auto 0;
			width: 300rpx;
			height: 300rpx;
			image {
				width: 100%;
				height: 100%;
			}
		}
	}
	.address {
		margin-top: 86rpx;
		text-align: center;
	}
}
.title {
	justify-content: flex-start;
	align-items: center;
	.xian {
		width: 2rpx;
		height: 30rpx;
		background: linear-gradient(90deg, #f95b2f, #60bab0, #45969b);
	}
	.title-font {
		padding-left: 16rpx;
		font-size: 30rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #333333;
	}
}
.btn {
	margin: 36rpx auto 0;
	width: 500rpx;
	height: 60rpx;
	background: linear-gradient(90deg, #60bab0, #60bab0, #45969b);
	border-radius: 30px;
	line-height: 60rpx;
	text-align: center;
	font-size: 26rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #ffffff;
}
.info {
	font-size: 24rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #333333;
	line-height: 42rpx;
}
</style>