yzf/pages/index/orderDetail.vue

<template>
	<view class="container">
		<view class="recharge">
			<view class="example-title flex_item">
				<view class="titleTip"></view>
				<view class="">充值信息</view>
			</view>
			<view class="infoBox">
				<view class="tplAddr">收款地址<text>{{dataMoney.address}}</text></view>
			</view>
			<view class="flex btnBox">
				<!-- #ifdef APP -->
				<view class="btn margin-r-30" @click="domImage">保存相册</view>
				<!-- #endif -->
				<view class="btn" @click="copy">复制地址</view>
			</view>
		</view>
		<view class="login_text">
			<view class="login_input flex">
				<view class="login_img"><text>打款凭证</text></view>
				<view class="login_name" @click="scImg">
					<image :src="img"></image>
				</view>
			</view>
			<view class="login_input flex" style="padding-top: 45rpx;border-bottom: none;">
				<view class="login_img">备注</view>
				<view class="login_name"><input class="uni-input" type="text" v-model="remark"
						placeholder="例如：备注用户账号" /></view>
			</view>
			<view class="submission"><button class="golden" type="golden" hover-class="none"
					@click="submission">确认提交</button></view>
		</view>
	</view>
</template>
<script type="text/javascript">
	// import { show_cb,do_cb } from '@/api/recharge.js';
	// import { upload } from '@/api/real.js';
	import {
		qianBao
	} from '@/api/wallet.js';
	import {
		copyText
	} from '@/utils/rocessor.js';
	export default {
		data() {
			return {
				uid: '',
				list: '',
				account: '',
				money: '',
				address: '',
				er_code: '',
				remark: '',
				img: '/static/image/img19.png',
				dataMoney: {},
				uid: '',
				account: '',
				money: '',
				address: '',
				remark: '',
				img: '/static/image/img19.png',
				val: "", // 要生成的二维码值
				size: 200, // 二维码大小
				unit: 'upx', // 单位
				background: '#FFF', // 背景色
				foreground: '#000', // 前景色
				pdground: '#000', // 角标色
				icon: '', // 二维码图标
				iconsize: 40, // 二维码图标大小
				lv: 3, // 二维码容错级别 ， 一般不用设置，默认就行
				onval: true, // val值变化时自动重新生成二维码
				loadMake: true, // 组件加载完成后自动生成二维码
				src: '', // 二维码生成后的图片地址或base64
				codeShow: false,
				cid: '1',
				codeIcon: '', // 二维码图标
			};
		},
		onLoad() {
			this.uid = uni.getStorageSync('uid');
			this.qianBao();
		},
		methods: {
			//获取数据
			qianBao() {
				const that = this;
				qianBao({}).then(
					(res) => {
						that.dataMoney = res.data.back.USDT.money
						that.val = that.dataMoney.address;
						console.log(that.dataMoney, 'dataMoney');
					}
				).catch(
					(res) => {
						console.log(res,'err');
					}
				)
			},
			// 下载图片
			domImage() {
				uni.downloadFile({
					url: this.er_code,
					success(re) {
						console.log(re.tempFilePath, 're');
						uni.showToast({
							title: '下载成功'
						});
					}
				})
			},
			// 复制地址
			copy() {
				copyText(this.dataMoney.address)
			},
			// 二维码生成
			qrR(res) {
				this.er_code = res;
			},
			//确认提交
			submission() {
				let obj = this;
				uni.showLoading({
					title: '充币中...',
					mask: true
				});
				//确认充值调接口，成功跳转页面
				do_cb({
						uid: obj.uid,
						img: obj.img,
						address: obj.address,
						money: obj.money,
						bz: obj.remark,
					})
					.then(function(e) {
						uni.showToast({
							title: '请耐心等待系统审核通过',
							duration: 1500,
							mask: false,
							icon: 'none'
						});
						uni.hideLoading();
					})
					.catch(function(e) {
						console.log(e);
					});
			},
			//上传图片
			scImg() {
				upload({
					file: ''
				}).then((e) => {
					console.log(e, 55)
					this.img = e[0].url;
				});
			},
		}
	};
</script>

<style lang="scss">
	/* page {
	min-height: 100%;
	background: linear-gradient(-28deg, rgba(44, 45, 53, 1), rgba(59, 62, 74, 1));
} */
	.body_content {
		width: 100%;
		height: 100%;
	}

	.login_text {
		width: 100%;
		color: #fff !important;
		font-size: 28rpx !important;
		background-color: #1F2A4A;
		margin: 25rpx 0rpx;
		padding: 0rpx 25rpx;
		padding-bottom: 15rpx;
	}

	.recharge {
		text-align: center;
		color: #85858e;
		font-size: 30rpx;
		background-color: #1F2A4A;
	}

	.example-title {
		text-align: left !important;
		padding: 25rpx 25rpx;
		border-bottom: 2rpx solid #2F364E;
		color: #0C5AFA;

		.titleTip {
			width: 5rpx;
			height: 30rpx;
			background: linear-gradient(90deg, #0C5AFA, #1356FF);
			border-radius: 3rpx;
			margin-right: 15rpx;
		}
	}

	.infoBox {
		text-align: left;
		padding: 28rpx 51rpx;

		.tplName {
			font-family: PingFang SC;
			font-weight: bold;
			font-size: 32rpx;
			color: #FFFFFF;
			line-height: 24rpx;
		}

		.tplNum {
			margin: 30rpx 0rpx;
			padding: 15rpx 30rpx;
			border-radius: 10rpx;
			border: 1px solid #1356FF;
			font-family: PingFang SC;
			font-size: 26rpx;
			color: #1356FF;
			display: inline-block;
		}

		.tplAddr {
			color: #fff;
			font-size: 32rpx;

			text {
				padding-left: 15rpx;
				font-size: 26rpx;
				color: #FFFFFF;
			}
		}
	}

	.login_input {
		border-bottom: 1px solid #464755;
		padding: 35rpx;
	}

	.uni-input {
		width: 100%;
		text-align: left !important;
	}

	.code {
		width: 277rpx;
		height: 277rpx;
		margin: 25rpx auto;
		margin-bottom: 35rpx;
		background: #0C5AFA;
	}

	.code image {
		width: 100%;
		height: 100%;
	}

	.btnBox {
		justify-content: center;
		padding-bottom: 50rpx;
		padding-top: 30rpx;

		.btn {
			margin-right: 50rpx;
			font-family: PingFang SC;
			font-weight: bold;
			font-size: 26rpx;
			color: #0C5AFA;
			border: 1rpx solid #0C5AFA;
			padding: 15rpx 45rpx;
			border-radius: 15rpx;
		}
	}

	.submission {
		padding: 30rpx 25rpx;

		.golden {
			background: #0C5AFA;
			color: #fff;
		}
	}

	.login_name {
		width: 480rpx;
		color: #ffffff;
	}

	.login_name image {
		width: 100rpx;
		height: 100rpx;
	}

	.tip {
		padding: 29rpx 31rpx;
		line-height: 55rpx;
		font-size: 24rpx;
	}

	.select_img {
		width: 28rpx;
		height: 32rpx;
	}

	.select_img image {
		width: 100%;
		height: 100%;
	}

	.scann {
		margin-bottom: 35rpx;
		margin-top: 15rpx;
	}

	.scanning {
		background-color: #6f6f78;
		color: #ffffff;
		padding: 10rpx 30rpx;
		border-radius: 15rpx;
		font-size: 28rpx;
	}

	.address_code {
		padding: 25rpx 0rpx;
		color: #ffffff;
	}

	.input-placeholder {
		color: #fff !important;
	}
</style>