<template>
|
<div class="exchange-page">
|
<van-nav-bar left-arrow @click-left="onClickLeft">
|
<!-- <template #right>
|
<van-icon class="exchange-icon" @click="$router.push('/exchange/exchangeHistory')" name="clock-o" />
|
</template> -->
|
<template #title>
|
<div class="flex items-center" >
|
{{ $t("划转") }}
|
<div class="fee ex-bg">{{ $t("0手续费") }}</div>
|
</div>
|
</template>
|
</van-nav-bar>
|
<!-- <list-account show class="mt-94" type="exchange" @exchange="onPopup" ref="exchange" /> -->
|
<div class="pages">
|
<div class="pages_box">
|
<!-- <div class="pages_box_txt">{{$t('从')}}</div> -->
|
|
<div class="pages_bot_top">
|
{{toptitle}}
|
</div>
|
|
<div class="flex ex-bg justify-center my-42 items-center w-100 ml-20 mr-20" @click="onSwitch">
|
<img src="@/assets/image/exchange/icon_3.png" alt="" class="w-25 h-25" />
|
</div>
|
<!-- <div class="pages_box_txt">{{$t('至')}}</div> -->
|
|
<div class="pages_bot_top">
|
{{buttitle}}
|
</div>
|
</div>
|
<div style="width: 100%;">
|
<input v-model="amount" :placeholder="$t('请输入数量')" type="number" style="width: 83%;" class="h-100 border-none inputBackground textColor mt-20 pl-20 ml-23"
|
@input="onInput" :disabled="disabled" />
|
<span @click="clickall">{{$t('全部')}}</span>
|
</div>
|
<div class="pages_bot_tps">
|
{{$t('可用数量')}}：{{usdcMoney}} {{bzlist[typeindex]}}
|
</div>
|
<div class="pages_list" >
|
<div @click="clicktype(index)" :class="typeindex==index?'pages_list_boxa':'pages_list_box'" v-for="(item,index) in bzlist" :key="index">{{item}}</div>
|
</div>
|
</div>
|
<div class="exchange-btn w-full flex justify-center mt-20">
|
<p class="h-100 btnMain mx-auto flex justify-center items-center text-white w-768" @click="ceshi">
|
{{ $t('划转') }}
|
</p>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import assetsHead from "@/components/assets-head";
|
import ListAccount from "@/components/mining-account";
|
import {
|
_initExchange,
|
_exchange,
|
walletGrther,
|
walletGrthertransfer,
|
getwalletGrther
|
} from "@/API/fund.api";
|
// import walletGrther from "@/API/fund.api";
|
import {
|
Popup
|
} from "vant";
|
import {
|
HOST_URL
|
} from "@/config";
|
export default {
|
components: {
|
assetsHead,
|
ListAccount,
|
[Popup.name]: Popup,
|
},
|
data() {
|
return {
|
show: false,
|
session_token: "",
|
detail: {},
|
interval: null,
|
count: 5,
|
HOST_URL,
|
disabled:false,
|
fromTo:1,
|
typeindex:0,
|
amount:'',
|
bzlist:['USDT','BTC','ETH','USDC'],
|
usdcMoney:'',
|
toptitle:this.$t('资金')+this.$t('账户'),
|
buttitle:this.$t('交易')+this.$t('账户'),
|
};
|
},
|
created() {
|
this.getwallet()
|
},
|
methods: {
|
clickall(){
|
this.amount=this.usdcMoney
|
},
|
async onSwitch(){
|
var a = this.toptitle
|
var b = this.buttitle
|
this.toptitle = b
|
this.buttitle = a
|
var newcurrency = ''
|
if(this.typeindex==0){
|
newcurrency = 'usdt'
|
}else if (this.typeindex == 1){
|
newcurrency = 'btc'
|
}else if (this.typeindex == 2){
|
newcurrency = 'eth'
|
}else if (this.typeindex == 3){
|
newcurrency = 'usdc'
|
}
|
var data = {
|
currency: newcurrency,
|
fromTo: this.toptitle==(this.$t('资金')+this.$t('账户'))?'1':'2',
|
}
|
await getwalletGrther(data).then((res) => {
|
console.log(res);
|
}).catch((err)=>{
|
console.log(err);
|
this.usdcMoney = err.data
|
});
|
},
|
onInput(e){
|
console.log(e);
|
},
|
async clicktype(e){
|
this.typeindex = e
|
|
var newcurrency = ''
|
if(this.typeindex==0){
|
newcurrency = 'usdt'
|
}else if (this.typeindex == 1){
|
newcurrency = 'btc'
|
}else if (this.typeindex == 2){
|
newcurrency = 'eth'
|
}else if (this.typeindex == 3){
|
newcurrency = 'usdc'
|
}
|
var data = {
|
currency: newcurrency,
|
fromTo: this.toptitle==(this.$t('资金')+this.$t('账户'))?'1':'2',
|
}
|
await getwalletGrther(data).then((res) => {
|
console.log(res);
|
}).catch((err)=>{
|
console.log(err);
|
this.usdcMoney = err.data
|
});
|
},
|
async ceshi() {
|
|
var newcurrency = ''
|
if(this.typeindex==0){
|
newcurrency = 'usdt'
|
}else if (this.typeindex == 1){
|
newcurrency = 'btc'
|
}else if (this.typeindex == 2){
|
newcurrency = 'eth'
|
}else if (this.typeindex == 3){
|
newcurrency = 'usdc'
|
}
|
this.$router.push({
|
path: "/Fundverification",
|
query: {
|
currency: newcurrency,
|
fromTo: this.toptitle==(this.$t('资金')+this.$t('账户'))?'1':'2',
|
amount: this.amount
|
},
|
});
|
// return
|
// var data = {
|
// currency: newcurrency,
|
// fromTo: this.toptitle==(this.$t('资金')+this.$t('账户'))?'1':'2',
|
// amount: this.amount
|
// }
|
// await walletGrthertransfer(data).then((res) => {
|
// console.log(res);
|
// });
|
},
|
async getwallet() {
|
await walletGrther().then((data) => {
|
console.log(data.id);
|
}).catch((err)=>{
|
console.log(err.id);
|
this.usdcMoney = err.usdtMoney
|
});
|
},
|
onClickLeft() {
|
this.$router.go(-1);
|
},
|
},
|
// beforeRouteLeave(to, from, next) {
|
// this.clearInterval();
|
// next();
|
// },
|
};
|
</script>
|
<style>
|
.van-popup.van-popup--bottom {
|
border-top-left-radius: 30px;
|
border-top-right-radius: 30px;
|
}
|
</style>
|
<style lang="scss" scoped>
|
.pages_list_boxa{
|
width: 20%;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
height: 6.25rem;
|
border-radius: 8px;
|
border: 1px solid #38aeea;
|
color:#38aeea;
|
}
|
.pages_list_box{
|
width: 20%;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
height: 6.25rem;
|
border-radius: 8px;
|
border: 1px solid #c8cad2;
|
}
|
.pages_list{
|
margin-top: 20px;
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
width: 48rem;
|
}
|
.pages_box_txt{
|
display: flex;
|
flex-direction: row;
|
width: 48rem;
|
}
|
.pages_bot_tps{
|
margin-top: 20px;
|
display: flex;
|
|
}
|
.pages_bot_top{
|
// padding-left: 20px;
|
display: flex;
|
justify-content: center;
|
margin-top: 20px;
|
background-color: #F5F5F5;
|
width: 43%;
|
height: 6.25rem;
|
align-items: center;
|
}
|
.pages_box{
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
width: 100%;
|
// flex-direction: column;
|
}
|
.pages{
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
width: 100%;
|
flex-direction: column;
|
}
|
.exchange-page {
|
height: 100vh - 6vh;
|
|
@include themify() {
|
background: themed("main_background");
|
}
|
|
::v-deep .van-tab--active {
|
@include themify() {
|
background: themed("main_background");
|
color: themed("active_line");
|
}
|
}
|
|
::v-deep .van-nav-bar {
|
@include themify() {
|
background: themed("main_background");
|
}
|
}
|
|
::v-deep .van-tabs__nav {
|
@include themify() {
|
background: themed("main_background");
|
}
|
}
|
|
::v-deep .van-nav-bar__title {
|
@include themify() {
|
color: themed("text_color");
|
}
|
}
|
|
::v-deep .van-hairline--bottom::after {
|
border-bottom-width: 0px;
|
}
|
|
::v-deep .van-nav-bar .van-icon {
|
@include themify() {
|
color: themed("text_color");
|
}
|
|
font-size: 40px;
|
}
|
}
|
|
.bg-grey-light {
|
background: #f5f5f5;
|
}
|
|
.bg-grey-dark {
|
background: #c8cad2;
|
}
|
|
.fee {
|
// background: #21353A;
|
border-radius: 4px;
|
color: #00b087;
|
font-size: 24px;
|
padding: 5px 10px;
|
margin-left: 10px;
|
}
|
|
.tab_background {
|
@include themify() {
|
background: themed("tab_background");
|
}
|
|
box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.21);
|
border-radius: 24px;
|
}
|
|
.bgDark {
|
@include themify() {
|
background: themed("tab_background2");
|
}
|
}
|
|
.btnMain {
|
background: linear-gradient(90deg, #2c64d4 0%, #38aeea 100%);
|
}
|
|
.color-green {
|
color: #00b087;
|
}
|
|
.exchange-icon {
|
margin-left: 10px;
|
|
@include themify() {
|
color: themed("text_color");
|
}
|
}
|
</style>
|
