yunshan/pages/finance/index.vue

<template>
	<view class="container">
		<view class="list-box">
			<view class="info-box">
				<view class="flex" v-show="show == true">
					<view class="info">
						<view class="list-title">总资产合计(USDT）</view>
						<view class="list-name clamp">{{ like_usdt * 1 }}</view>
						<view class="ustd">≈ {{ like_rmb * 1 }}RMB</view>
					</view>
					<image class="image" src="../../static/img/img29.png" @click="showPick(false)"></image>
				</view>
				<view class="flex" v-show="show == false">
					<view class="info">
						<view class="list-title">总资产合计(USDT）</view>
						<view class="list-name clamp">****</view>
						<view class="ustd">≈ ****RMB</view>
					</view>
					<image class="image" src="../../static/img/img43.png" @click="showPick(true)"></image>
				</view>
			</view>
			<view class="list-tpl flex">
				<view class="tpl" @click="navTo('/pages/finance/transfer')">
					<image class="zhuanz" src="../../static/img/img10.png"></image>
					<view class="tpl-name">转账</view>
				</view>
				<view class="tpl" @click="navTo('/pages/finance/recharge')">
					<!-- @click="recharge" -->
					<image src="../../static/img/img08.png"></image>
					<view class="tpl-name">充币</view>
				</view>
				<view class="tpl" @click="navTo('/pages/finance/withdraw')">
					<image src="../../static/img/img09.png"></image>
					<view class="tpl-name">提币</view>
				</view>
			</view>
			<!-- <view class="list-tips flex_item">
				<image src="../../static/img/img07.png"></image>
				<view>资产正在保护中</view>
			</view> -->
		</view>
		<view class="list-cell" v-for="(ls, index) in list" :key="index" @click="toDateils(ls)">
			<view class="cell flex">
				<view class="cell-title">{{ ls.name }}</view>
				<image src="../../static/img/img16.png"></image>
			</view>
			<view class="flex cell-list">
				<view class="cell-tpl tips">
					<view class="name">可用</view>
					<view class="tpl">{{ ls.money.money * 1 }}</view>
				</view>
				<view class="cell-tpl tip-tpl">
					<view class="name">冻结</view>
					<view class="tpl">{{ ls.lock_moeny }}</view>
				</view>
				<view class="cell-tpl tip-box">
					<view class="name">折合(USDT）</view>
					<view class="tpl clamp">{{ ls.usdt * 1 ||0}}</view>
				</view>
			</view>
		</view>
		<uni-popup ref="popup" type="center">
			<view class="popup">
				<view class="cancel flex" @click="close">
					<view></view>
					<view class="tip">x</view>
				</view>
				<view class="list-boxs">
					<view class="popup-text">购买数量：</view>
					<view class="password"><input type="number" v-model="num" placeholder="请输入算力数量" /></view>
					<view class="popup-text">币种选择：</view>
					<view class="content" @click="useOutClickSide">
						<easy-select ref="easySelect" :options="moneyTypeList" :value="money" @selectOne="selectOne"></easy-select>
					</view>
					<view class="confirm-btn" @click="pay"><text>确认充币</text></view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>
<script>
import { moneyType } from '@/api/index.js';
import { recharge, wallet } from '@/api/finance.js';
import easyselect from '@/components/easy-select/easy-select.vue';
export default {
	components: {
		easyselect
	},
	data() {
		return {
			num: '',
			money: '',
			type: '',
			moneyTypeList: [],
			list: '',
			show: true,
			like_rmb: '',
			like_usdt: ''
		};
	},
	onLoad(option) {
		this.moneyType();
		console.log('this.moneyTypeList',this.moneyTypeList)
		this.loadData();
	},
	onShow() {
		this.loadData();
		let show = uni.getStorageSync('showPick');
		if (show == false) {
			this.show = false;
		}
		if (show == true) {
			this.show = true;
		}
	},
	//下拉刷新
	onPullDownRefresh() {
		this.loadData();
		this.moneyType();
		setTimeout(function() {
			uni.stopPullDownRefresh();
		}, 1000);
	},
	methods: {
		// 所有币种
		async moneyType() {
			let obj = this;
			moneyType({}).then(({ data }) => {
				obj.moneyTypeList = data;
			});
		},
		// 请求载入数据
		loadData() {
			let obj = this;
			wallet({}).then(({ data }) => {
				obj.like_rmb = data.like_rmb;
				obj.like_usdt = data.like_usdt;
				obj.list = data.back;
			});
		},
		showPick(item) {
			this.show = item;
			uni.setStorage({
				key: 'showPick',
				data: item,
				success: function() {}
			});
		},
		recharge() {
			this.$refs.popup.open();
		},
		selectOne(options) {
			this.money = options.name;
			this.type = options.code;
		},
		useOutClickSide() {
			this.$refs.easySelect.hideOptions && this.$refs.easySelect.hideOptions();
		},
		// pay(){
		// 	let obj = this;
		// 	recharge({
		// 		num:obj.num,
		// 		money_type:obj.type
		// 	},obj.buyId).then(({ data }) => {
		// 		console.log(data)
		// 		obj.$api.msg(data.msg);
		// 		obj.$refs.popup.close();
		// 		obj.num='';
		// 		obj.type = '';
		// 		uni.navigateTo({
		// 			url:'/pages/finance/recharge?LOGO='+data._address_qr+'&order_id='+data.order_id+'&ddress='+data.__money_address+'&id='+data.id
		// 		})
		// 	}).catch(e => {
		// 		obj.$refs.popup.close();
		// 	});
		// },
		close() {
			this.$refs.popup.close();
		},
		navTo(url) {
			uni.navigateTo({
				url
			});
		},
		toDateils(ls) {
			// console.log(ls, 88);
			// let way = ls.way.split(",")
			// console.log(way[0],'money-----------',ls.money)
			// let path = 'address_'+way[0]
			// console.log(path)
			// console.log(path === 'address_TRC20')
			// let address = ls.money[path]
			// console.log(address,"index")
			// let wayaddress = {}
			// way.forEach((item) => {
			// 	let path = 'address_'+ item
			// 	wayaddress[item] = ls.money[path]
			// })
			// let waypath = JSON.stringify(wayaddress)
			// console.log('waypath++++++++++',waypath)
			uni.navigateTo({
				url:
					'/pages/finance/details?code=' + ls.code +
					'&name=' + ls.name +
					'&logo=' + ls.LOGO +
					'&price=' + ls.money.money +
					'&_address_qr=' + ls._address_qr +
					'&__money_address=' + ls.__money_address +
					'&mark=' + ls.mark +
					'&ids=' + ls.money.id +
					'&keysAddr=' + ls.money.address + 
					'&charge=' + ls.charge + 
					// '&address=' + address + 
					'&way=' + ls.way  
					// '&waypath=' + waypath
			});
		}
	}
};
</script>

<style lang="scss">
page {
	min-height: 100%;
	background-color: #ffffff;
	.container {
		width: 100%;
		padding: 25rpx 40rpx;
	}
}
.list-tips {
	position: absolute;
	right: 0;
	top: 25rpx;
	font-size: 24rpx;
	background-color: #f4ca1c;
	padding: 14rpx 27rpx;
	border-bottom-left-radius: 50rpx;
	border-top-left-radius: 50rpx;
	color: #5771df;
	image {
		width: 30rpx;
		height: 31rpx;
		margin-right: 12rpx;
	}
}
.list-box {
	background: #141E47;
	position: relative;
	color: #ffffff;
	border-radius: 20rpx;
	margin-bottom: 60rpx;
	.info-box {
		padding: 31rpx 43rpx;
		.image {
			width: 44rpx !important;
			height: 30rpx !important;
		}
		.info {
			width: 80%;
			.list-title {
				font-size: 30rpx;
				font-weight: 500;
				color: #ffffff;
			}
			.list-name {
				width: 100%;
				font-size: 64rpx;
				font-weight: bold;
				padding: 25rpx 0rpx;
			}
			.ustd {
				font-size: 30rpx;
				font-weight: normal;
			}
		}
	}
	.list-tpl {
		padding: 30rpx 100rpx;
		background-color: #FF6600;
		.tpl {
			text-align: center;
			image {
				width: 45rpx;
				height: 42rpx;
			}
			.zhuanz {
				width: 45rpx;
				height: 42rpx;
			}
			.tpl-name {
				font-size: 27rpx;
				font-weight: bold;
				padding-left: 10rpx;
			}
		}
	}
}
.list-cell {
	padding-bottom: 58rpx;
	.cell {
		padding-bottom: 31rpx;
		image {
			width: 12rpx;
			height: 24rpx;
		}
		.cell-title {
			font-size: 34rpx;
			font-weight: 500;
			color: #FF6600;
			font-weight: 500;
		}
	}
	.cell-list {
		width: 100%;
		.cell-tpl {
			text-align: left;
			.name {
				font-size: 24rpx;
				font-weight: 500;
				color: #999999;
				padding-bottom: 15rpx;
			}
		}
		.tip-box {
			text-align: right;
			width: 40%;
		}
		.tip-tpl {
			text-align: center;
			width: 30%;
		}
		.tips {
			width: 30%;
		}
	}
}
//弹窗
.popup {
	background-color: #ffffff;
	border-radius: 25rpx;
	font-size: 30rpx;
	.cancel {
		text-align: center;
		width: 100%;
		line-height: 60rpx;
		.tip {
			background-color: #5771df;
			color: #ffffff;
			width: 70rpx;
			height: 70rpx;
			border-top-right-radius: 25rpx;
		}
	}
	.list-boxs {
		padding: 0rpx 80rpx;
		.password {
			padding: 50rpx 0rpx;
			width: 100%;
			input {
				width: 70%;
				height: 80rpx;
				border: 2rpx solid #999999;
				padding-left: 25rpx;
				box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.27);
				border-radius: 11rpx;
			}
		}
		.confirm-btn {
			padding-bottom: 120rpx;
			padding-top: 30rpx;
			text {
				background-color: #5771df;
				color: #ffffff;
				width: 70%;
				text-align: center;
				padding: 25rpx 90rpx;
				border-radius: 15rpx;
			}
		}
	}
}
</style>
<!--  -->