You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
515 lines
13 KiB
515 lines
13 KiB
<template>
|
|
<view class="main">
|
|
<!-- nav -->
|
|
<navigation>{{ i18n.Transfer }}</navigation>
|
|
<view class="body">
|
|
<!-- #ifdef APP-PLUS -->
|
|
<view class="form">
|
|
<!-- #endif -->
|
|
<!-- #ifdef H5 -->
|
|
<view class="form" style="margin-top: 150rpx;">
|
|
<!-- #endif -->
|
|
|
|
<!-- coin选择框 -->
|
|
<view class="text">{{ i18n.SelectCurrency }}</view>
|
|
<view class="input-item">
|
|
<u-input class="input" v-model="coinInfo.coinCode" color="#fff" fontSize="32rpx" border="none"
|
|
:placeholder="i18n.PleaseChooseCoin" :disabled="true">
|
|
</u-input>
|
|
<view class="downSelect" @click="USDTPopupShow = true"></view>
|
|
</view>
|
|
<!-- form地址选择框 -->
|
|
<view class="text">{{ i18n.From }}</view>
|
|
<view class="input-item">
|
|
<u-input class="input" v-model="transCoinInfo.fromWays" color="#fff" fontSize="32rpx" border="none"
|
|
:placeholder="i18n.OptionAccount" :disabled="true">
|
|
</u-input>
|
|
<view class="downSelect" @click="accountPopupShow = true"></view>
|
|
</view>
|
|
<!-- to地址选择框 -->
|
|
<view class="text">{{ i18n.To }}</view>
|
|
<view class="input-item">
|
|
<u-input class="input" v-model="transCoinInfo.toWays" color="#fff" fontSize="32rpx" border="none"
|
|
:placeholder="i18n.TradingAccount" :disabled="true">
|
|
</u-input>
|
|
<view class="downSelect" @click="accountPopupShowTo = true"></view>
|
|
</view>
|
|
<!-- 数量 -->
|
|
<view class="text">{{ i18n.TransferNumber }}</view>
|
|
<view class="input-item">
|
|
<u-input class="input" v-model="coinInfo.tranAmt" color="#fff" fontSize="32rpx" border="none"
|
|
:placeholder="i18n.pamount" >
|
|
</u-input>
|
|
<view class="numberDownSelect">{{coinInfo.coinCode||''}}
|
|
<view class="all" @click="coinInfo.tranAmt=coinWayInfo.userCapital?coinWayInfo.userCapital:info.userCapital">{{i18n.ALL}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="Usable">{{ i18n.Usable }}
|
|
|
|
<view class="number">{{coinWayInfo.userCapital>=0?coinWayInfo.userCapital:info.userCapital}}{{coinWayInfo.coinCode?coinWayInfo.coinCode:info.coinCode}}</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 按钮 -->
|
|
<u-button class="transferButton" color="#00E8A2" throttleTime="500" :disabled="!transferDis"
|
|
@click="transfer">{{
|
|
i18n.Transfer
|
|
}}</u-button>
|
|
|
|
<!-- USDT按钮通知弹出层 -->
|
|
<u-popup class="USDTPopup" :show="USDTPopupShow" round="40rpx" mode="bottom" @close="USDTPopupShow = false"
|
|
@open="USDTPopupShow = true" bgColor="#211F32">
|
|
<view class="content">
|
|
<view class="close" @click="USDTPopupShow = false"></view>
|
|
<scroll-view scroll-y="true" style="height: 432rpx;" scroll-with-animation="true"
|
|
@touchmove.stop.prevent="">
|
|
<radio-group class="radioGroup" @change="USDTRadioChange" v-model="USDTRadioValue">
|
|
<label class="checkBox" v-for="(item, index) in info.coinList" :key="index"
|
|
@click="radioChange(item)">
|
|
<view class="icon">
|
|
<u-icon :name="baseURL+'/coins/'+item.enname+'.png'" size="52rpx" width="52rpx">
|
|
</u-icon>
|
|
</view>
|
|
<view class="iconName">
|
|
<view class="top">{{item.enname}}</view>
|
|
<view class="bottom">{{item.useCapital}}{{" "}}{{item.code}}</view>
|
|
</view>
|
|
<radio color="#00E8A2" shape="square" :checked="coinInfo.coinCode==item.enname"></radio>
|
|
</label>
|
|
|
|
</radio-group>
|
|
</scroll-view>
|
|
|
|
<u-button class="button" color="#00E8A2" throttleTime="500" @click="getCoin">OK
|
|
</u-button>
|
|
</view>
|
|
</u-popup>
|
|
|
|
<!-- account账户按钮form通知弹出层 -->
|
|
<u-popup class="accountPopup" :show="accountPopupShow" round="40rpx" mode="bottom"
|
|
@close="accountPopupShow = false" @open="accountPopupShow = true" bgColor="#211F32">
|
|
<view class="content">
|
|
<view class="close" @click="accountPopupShow = false"></view>
|
|
<scroll-view scroll-y="true" style="height: 200rpx;" scroll-with-animation="true"
|
|
@touchmove.stop.prevent="">
|
|
<radio-group class="radioGroup" >
|
|
<!-- v-for="(item, index) in 3" :key="index" -->
|
|
<label class="checkBox" @click="getAccount('exchange','form')">
|
|
<view class="name">Balance account</view>
|
|
<radio color="#00E8A2" shape="square" :checked="transCoinInfo.fromWays=='Balance account'"></radio>
|
|
</label>
|
|
<label class="checkBox" @click="getAccount('contract','form')">
|
|
<view class="name">Contract account</view>
|
|
<radio color="#00E8A2" shape="square" :checked="transCoinInfo.fromWays=='Contract account'"></radio>
|
|
</label>
|
|
</radio-group>
|
|
</scroll-view>
|
|
|
|
<u-button class="button" color="#00E8A2" throttleTime="500" @click="getCoinOrAccount">OK
|
|
</u-button>
|
|
</view>
|
|
</u-popup>
|
|
|
|
<!-- account账户按钮to通知弹出层 -->
|
|
<u-popup class="accountPopup" :show="accountPopupShowTo" round="40rpx" mode="bottom"
|
|
@close="accountPopupShowTo = false" @open="accountPopupShowTo = true" bgColor="#211F32">
|
|
<view class="content">
|
|
<view class="close" @click="accountPopupShowTo = false"></view>
|
|
<scroll-view scroll-y="true" style="height: 200rpx;" scroll-with-animation="true"
|
|
@touchmove.stop.prevent="">
|
|
<radio-group class="radioGroup" >
|
|
<!-- v-for="(item, index) in 3" :key="index" -->
|
|
<label class="checkBox" @click="getAccount('contract','to')">
|
|
<view class="name">Contract account</view>
|
|
<radio color="#00E8A2" shape="square" :checked="transCoinInfo.toWays=='Contract account'"></radio>
|
|
</label>
|
|
<label class="checkBox" @click="getAccount('exchange','to')">
|
|
<view class="name">Balance account</view>
|
|
<radio color="#00E8A2" shape="square" :checked="transCoinInfo.toWays=='Balance account'"></radio>
|
|
</label>
|
|
|
|
</radio-group>
|
|
</scroll-view>
|
|
|
|
<u-button class="button" color="#00E8A2" throttleTime="500" @click="getCoinOrAccount">OK
|
|
</u-button>
|
|
</view>
|
|
</u-popup>
|
|
|
|
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import api from '@/utils/api'
|
|
import constant from '@/utils/constant.js';
|
|
export default {
|
|
name: "transfer",
|
|
data() {
|
|
return {
|
|
type:'',
|
|
coinWayInfo:{},
|
|
transCoinInfo:{
|
|
coinCode:null,
|
|
fromWays:null,
|
|
},
|
|
coinCode: null,
|
|
coinCode2: null,
|
|
coinInfo: {
|
|
coinCode: null,
|
|
fromWays: null,
|
|
toWays: null,
|
|
tranAmt: null,
|
|
},
|
|
baseURL: '',
|
|
info: {},
|
|
coin: '',
|
|
USDTPopupShow: false,
|
|
accountPopupShow: false,
|
|
accountPopupShowTo: false,
|
|
USDTRadioValue: '',
|
|
accountRadioValue: '',
|
|
};
|
|
},
|
|
computed: {
|
|
i18n() {
|
|
return this.$t("me");
|
|
},
|
|
transferDis() {
|
|
return this.coinInfo.coinCode && this.coinInfo.fromWays && this.coinInfo.toWays && this.coinInfo.tranAmt
|
|
},
|
|
|
|
},
|
|
onLoad() {
|
|
this.baseURL = constant.BASE_URL
|
|
this.getInfo()
|
|
},
|
|
onShow() {},
|
|
methods: {
|
|
// 重置 tranAmt: null,
|
|
reset(){
|
|
// this.type=''
|
|
// this.coinWayInfo={}
|
|
// this.transCoinInfo={
|
|
// coinCode:null,
|
|
// fromWays:null,
|
|
// }
|
|
// this.coinCode=null,
|
|
// this.coinCode2=null,
|
|
this.coinInfo={
|
|
// coinCode: null,
|
|
fromWays: null,
|
|
toWays: null,
|
|
}
|
|
},
|
|
getAccount(e,type){
|
|
this.type=type
|
|
if(type=='form'){
|
|
if(e=='exchange'){
|
|
this.transCoinInfo.fromWays='Balance account'
|
|
}else{
|
|
this.transCoinInfo.fromWays='Contract account'
|
|
}
|
|
this.coinInfo.fromWays=e
|
|
}else{
|
|
if(e=='exchange'){
|
|
this.transCoinInfo.toWays='Balance account'
|
|
}else{
|
|
this.transCoinInfo.toWays='Contract account'
|
|
}
|
|
this.coinInfo.toWays=e
|
|
}
|
|
this.$forceUpdate()
|
|
},
|
|
// 提交划转资金
|
|
transfer() {
|
|
api.transfer(this.coinInfo).then(res => {
|
|
uni.$u.toast(this.$t("login").Transfersucceeded)
|
|
setTimeout(() => {
|
|
this.getInfo(true)
|
|
// this.reset()
|
|
this.coinInfo.tranAmt=null
|
|
}, 1200)
|
|
})
|
|
},
|
|
// 获取币种
|
|
radioChange(e) {
|
|
this.coinCode = e.enname
|
|
this.coinCode2 = e.code
|
|
},
|
|
// 获取币种
|
|
getCoin() {
|
|
this.coinInfo.coinCode = this.coinCode
|
|
this.coinInfo.coinCode2 = this.coinCode2
|
|
this.USDTPopupShow = false
|
|
},
|
|
// 切换币种或转出账户
|
|
getCoinOrAccount() {
|
|
this.transCoinInfo.coinCode=this.coinInfo.coinCode2
|
|
// this.coinInfo.fromWays=this.transCoinInfo.fromWays
|
|
// this.coinInfo.toWays=this.transCoinInfo.toWays
|
|
if(this.type=='to'){
|
|
this.accountPopupShowTo = false
|
|
return;
|
|
}
|
|
api.changeCoinWays({
|
|
coinCode:this.transCoinInfo.coinCode,
|
|
fromWays:this.coinInfo.fromWays,
|
|
}).then(res => {
|
|
this.coinWayInfo=res
|
|
this.accountPopupShow = false
|
|
this.accountPopupShowTo = false
|
|
})
|
|
},
|
|
// 获取配置信息
|
|
getInfo(type) {
|
|
api.getTransferConfig({}).then(res => {
|
|
this.info = res
|
|
// 首次进来才默认选择
|
|
if(type){
|
|
return;
|
|
}
|
|
// 3个下拉框默认选中第一个,另外选项弹出框也默认第一个
|
|
this.coinInfo.coinCode=this.info.coinList[0].enname
|
|
this.coinCode = this.info.coinList[0].enname
|
|
this.coinCode2 = this.info.coinList[0].code
|
|
this.coinInfo.fromWays='exchange';
|
|
this.coinInfo.toWays='contract';
|
|
this.transCoinInfo.fromWays='Balance account';
|
|
this.transCoinInfo.toWays='Contract account';
|
|
})
|
|
},
|
|
USDTRadioChange(e) {},
|
|
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
/deep/ .u-input--square{
|
|
border-radius: 34rpx !important;
|
|
}
|
|
.main {
|
|
.body {
|
|
.form {
|
|
margin: 232rpx 32rpx 0;
|
|
background: #211F32;
|
|
border-radius: 32rpx;
|
|
padding: 0 32rpx;
|
|
overflow: hidden;
|
|
|
|
.text {
|
|
margin: 32rpx 0 20rpx;
|
|
font-size: 32rpx;
|
|
color: #A1A0A8;
|
|
}
|
|
|
|
.input-item {
|
|
position: relative;
|
|
background: #323045;
|
|
border-radius: 32rpx;
|
|
|
|
.input {
|
|
width: 400rpx;
|
|
height: 112rpx;
|
|
padding-left: 40rpx !important;
|
|
background: #323045 !important;
|
|
}
|
|
|
|
.downSelect {
|
|
position: absolute;
|
|
width: 32rpx;
|
|
height: 32rpx;
|
|
top: 36rpx;
|
|
right: 32rpx;
|
|
background-image: url(../../static/me/ic_input_arrow_down.png);
|
|
background-repeat: no-repeat;
|
|
background-size: 32rpx;
|
|
|
|
|
|
}
|
|
|
|
.numberDownSelect {
|
|
position: absolute;
|
|
height: 32rpx;
|
|
top: 36rpx;
|
|
right: 34rpx;
|
|
|
|
.all {
|
|
padding-left: 14rpx;
|
|
display: inline;
|
|
font-size: 28rpx;
|
|
color: #00E8A2;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
.Usable {
|
|
margin: 32rpx 0;
|
|
color: #FFFFFF;
|
|
font-size: 12px;
|
|
|
|
.number {
|
|
display: inline;
|
|
color: #00E8A2;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
.transferButton {
|
|
box-sizing: border-box;
|
|
margin: 64rpx 32rpx;
|
|
width: 686rpx;
|
|
height: 112rpx;
|
|
line-height: 112rpx;
|
|
border-radius: 32rpx;
|
|
font-size: 32rpx;
|
|
color: #15141F !important;
|
|
}
|
|
|
|
.USDTPopup {
|
|
.content {
|
|
height: 730rpx;
|
|
|
|
.close {
|
|
margin: 48rpx 346rpx;
|
|
width: 58rpx;
|
|
height: 20rpx;
|
|
background-image: url(../../static/charity/Turn.png);
|
|
background-repeat: no-repeat;
|
|
background-size: 58rpx 20rpx;
|
|
}
|
|
|
|
.radioGroup {
|
|
height: 432rpx;
|
|
|
|
.checkBox {
|
|
height: 84rpx;
|
|
width: 670rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 0 40rpx 32rpx;
|
|
|
|
.icon {
|
|
width: 84rpx;
|
|
height: 84rpx;
|
|
border-radius: 20rpx;
|
|
overflow: hidden;
|
|
display: inline-block;
|
|
box-sizing: border-box;
|
|
background: #323045;
|
|
padding: 16rpx;
|
|
margin-right: 20rpx;
|
|
}
|
|
|
|
.iconName {
|
|
width: 520rpx;
|
|
|
|
.top {
|
|
font-size: 32rpx;
|
|
color: #fff;
|
|
}
|
|
|
|
|
|
.bottom {
|
|
font-size: 24rpx;
|
|
color: #A1A0A8;
|
|
}
|
|
|
|
|
|
}
|
|
|
|
/deep/.uni-radio-input {
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
border-radius: 16rpx;
|
|
background: #323045;
|
|
}
|
|
|
|
/deep/.uni-radio-input-checked::before {
|
|
font-size: 36rpx;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
.button {
|
|
width: 654rpx;
|
|
margin: 40rpx 48rpx;
|
|
border-radius: 32rpx;
|
|
height: 112rpx;
|
|
line-height: 112rpx;
|
|
color: #15141F !important;
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
.accountPopup {
|
|
.content {
|
|
height: 484rpx;
|
|
|
|
.close {
|
|
margin: 48rpx 346rpx;
|
|
width: 58rpx;
|
|
height: 20rpx;
|
|
background-image: url(../../static/charity/Turn.png);
|
|
background-repeat: no-repeat;
|
|
background-size: 58rpx 20rpx;
|
|
}
|
|
|
|
.radioGroup {
|
|
height: 200rpx;
|
|
|
|
.checkBox {
|
|
height: 84rpx;
|
|
width: 670rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 0 40rpx 32rpx;
|
|
|
|
.name {
|
|
width: 600rpx;
|
|
font-size: 32rpx;
|
|
color: #fff;
|
|
}
|
|
|
|
/deep/.uni-radio-input {
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
border-radius: 16rpx;
|
|
background: #323045;
|
|
}
|
|
|
|
/deep/.uni-radio-input-checked::before {
|
|
font-size: 36rpx;
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
.button {
|
|
width: 654rpx;
|
|
margin: 20rpx 48rpx;
|
|
border-radius: 32rpx;
|
|
height: 112rpx;
|
|
line-height: 112rpx;
|
|
color: #15141F !important;
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
</style>
|
|
|