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.
441 lines
13 KiB
441 lines
13 KiB
<template>
|
|
<v-page>
|
|
<v-header>
|
|
<template #title>
|
|
<view>
|
|
{{ $t("common.c16") }}
|
|
<!-- <span class="color-theme-1">{{ coin }}</span> -->
|
|
</view>
|
|
</template>
|
|
<template #right>
|
|
<v-link :to="'/pages/assets/records?type='+type">
|
|
<van-icon class="fn-20 m-t-xs" name="todo-list-o" />
|
|
</v-link>
|
|
</template>
|
|
</v-header>
|
|
<view class="layout-main" style="background-color: #121212;padding: 20px;">
|
|
<el-steps direction="vertical" :active="active" style="min-height: 260px !important;width: 100%;box-sizing: border-box;">
|
|
<el-step :title="$t('common.c21')" style="flex-basis: 110px;">
|
|
<template slot="description">
|
|
<view class="d-flex justify-between m-t-md" @click="coinListShow=true" style="border: 1px solid #4e4e5d;padding: 10px;">
|
|
<view class="fn-20 color-light">{{ coin }}</view>
|
|
<view class="d-flex align-center">
|
|
{{ $t('recharge.a0') }}
|
|
<van-icon name="arrow"/>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
</el-step>
|
|
<el-step :title="$t('common.c17')">
|
|
<template slot="description">
|
|
<view style="margin: 10px 0px;width: 540rpx;">
|
|
<v-input @input="addressnum" v-model="form.address" class="bg-form-panel-3 color-light w-max fn-13 rounded-xs" :placeholder="$t('assets.b9')"></v-input>
|
|
<el-select v-model="form.addressType" @change="enteraddressType" style="margin-top: 10px;width: 100%;" class="addressType" v-if="coin=='USDT'" :placeholder="$t('common.select')">
|
|
<el-option v-for="(item, index) in network" :key="index" :label="item.name" :value="item.id">
|
|
<span>{{ item.name }}</span>
|
|
</el-option>
|
|
</el-select>
|
|
</view>
|
|
</template>
|
|
</el-step>
|
|
<el-step :title="$t('common.c18')" v-if="form.address">
|
|
<template slot="description">
|
|
<view style="margin: 10px 0px;color: #fff;width: 540rpx;">
|
|
<v-input @input="amountnum" v-model="form.amount" :min="withdrawFee.withdrawal_min" :max="withdrawFee.withdrawal_max" class="color-light fn-13" :placeholder="$t('assets.c2')"></v-input>
|
|
<view class="d-flex justify-between align-end" style="margin: 10px 0px;">
|
|
<view style="width: 100%;">{{ $t("assets.c1") }}：{{ withdrawFee.usable_balance }}{{ coin }}</view>
|
|
<view style="width: 100%;text-align: right;">{{$t('common.c23')}}：{{timeFormat}}</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
</el-step>
|
|
<el-step :title="$t('common.c13')" v-if="form.amount">
|
|
<template slot="description">
|
|
<view style="margin: 10px 0px;color: #fff;width: 540rpx;">
|
|
<v-input type="password" @input="withdrawalnum" v-model="form.withdrawal_psw" class="color-light w-max fn-13 rounded-xs" :placeholder="$t('common.c14')"></v-input>
|
|
</view>
|
|
</template>
|
|
</el-step>
|
|
<el-step :title="$t('safe.a5')" v-if="form.withdrawal_psw">
|
|
<template slot="description">
|
|
<view style="margin: 10px 0px;color: #fff;width: 540rpx;display: flex;">
|
|
<v-input type="text" v-model="form.emailcode" class="w-max color-light fn-13" :placeholder="$t('safe.a6')"></v-input>
|
|
<view class="d-flex" style="justify-content: space-between;align-items: center;">
|
|
<view style="width: 180rpx;text-align: center;" class="all color-light m-l-md flex-shrink fn-12 getCode" @click="getEmailCode">
|
|
<text v-if="!getEmailCodeLock">{{ $t("common.getCode") }}</text>
|
|
<text v-else>{{ daojishi }}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
</el-step>
|
|
</el-steps>
|
|
<view style="margin: 20px 32px;border-top: 2px solid #444;">
|
|
<view style="display: flex;align-items: center;padding-top: 10px;">{{$t('common.c24')}}<img src="@/assets/img/zhuanzan.png" alt width="20" style="margin-left: 5px;"/></view>
|
|
<view style="display: flex;justify-content: space-between;align-items: center;">
|
|
<view>
|
|
<view style="font-size: 30px;font-weight: bold;max-width: 540rpx;">
|
|
<span style="overflow-wrap: anywhere;">{{price1(quantity)}}</span>
|
|
</view>
|
|
<view>{{$t('assets.c4')}}: {{coin=='USDT'&&form.addressType==3?withdrawFee.trc20:withdrawFee.withdrawal_fee }} {{coin}}</view>
|
|
</view>
|
|
<view></view>
|
|
</view>
|
|
<view style="display: flex;margin-top: 10px;">
|
|
<view :class="!form.emailcode?'fontWithdrawal':'fontWithdrawal1'" @click="toDraw">
|
|
{{$t('common.c25')}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="form bg-panel-3 p-x-lg p-y-md" style="background-color: #121212;">
|
|
<ul class="fn-md rounded-md m-y-xs line-height-2">
|
|
<li>·{{ $t("assets.c5") }}{{lang=='zh-TW'||lang=='jp'?'。':'.'}}</li>
|
|
<li>·{{ $t("assets.c6") }}{{lang=='zh-TW'||lang=='jp'?'。':'.'}}</li>
|
|
<li>·{{ $t("assets.c7") }}{{lang=='zh-TW'||lang=='jp'?'。':'.'}}</li>
|
|
</ul>
|
|
</view>
|
|
</view>
|
|
<coin-list ref="coinList" v-model="coin" @close="coinListShow = false" v-show="coinListShow"/>
|
|
<view v-show="promptaddress" class="modal-overlay">
|
|
<view class="modal-content">
|
|
<view style="margin-top: 25px;padding: 0px 10px;">
|
|
<img src="@/assets/img/tishi.png" alt="" width="60" />
|
|
<view style="margin: 20px 0px;">{{$t('common.c29')}}</view>
|
|
<view class="losure" @click="closeModal">{{$t('common.c28')}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</v-page>
|
|
</template>
|
|
|
|
<script>
|
|
import coinList from "./coin-list";
|
|
import Wallet from "@/api/wallet";
|
|
import Member from "@/api/member";
|
|
import formData from "@/utils/class/date";
|
|
import Profile from "@/api/profile";
|
|
|
|
export default {
|
|
components: {
|
|
coinList,
|
|
},
|
|
data() {
|
|
return {
|
|
type: 'draw',
|
|
coin: "",
|
|
lang:"",
|
|
active:1,
|
|
JStime: 0,
|
|
tiemr: null,
|
|
indexshow:0,
|
|
quantity:"0.00",
|
|
timeFormat:"",
|
|
rechargeType: 2,
|
|
withdrawFee: {},
|
|
coinListShow: false,
|
|
promptaddress:false,
|
|
getEmailCodeLock: false,
|
|
lang: uni.getStorageSync('language'),
|
|
network:[{id:2,name:"ERC20"},{id:3,name:"TRC20"}],
|
|
form: {
|
|
coin_id: "",
|
|
amount: "",
|
|
withdrawal_psw:"",
|
|
address: "",
|
|
addressType: "",
|
|
code_type: 1,
|
|
code: '',
|
|
emailcode: '',
|
|
gr_code: '',//图形验证码Graphic verification code
|
|
},
|
|
}
|
|
},
|
|
created() {
|
|
this.lang = localStorage.getItem('lang')
|
|
this.updateTimeFormat()
|
|
this.timeUpdateInterval = setInterval(this.updateTimeFormat, 36000);
|
|
},
|
|
computed: {
|
|
activeCoin() {
|
|
if (!this.coin) return {};
|
|
return this.$refs.coinList.coinList.find(
|
|
(item) => item.coin_name == this.coin
|
|
);
|
|
},
|
|
daojishi(){
|
|
return '('+this.JStime + 's' + ')';
|
|
}
|
|
},
|
|
watch: {
|
|
coin(n) {
|
|
if (n) {
|
|
this.active = 2
|
|
this.form.address = "";
|
|
if (this.coin != "USDT") {
|
|
this.form.addressType = 1;
|
|
} else {
|
|
this.rechargeType = 2;
|
|
}
|
|
this.withdrawalBalance();
|
|
}
|
|
},
|
|
},
|
|
methods: {
|
|
price1(item){
|
|
if (item) {
|
|
let price = item.toString();
|
|
let parts = price.split(".");
|
|
parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
|
return parts.join(".");
|
|
}
|
|
},
|
|
addressnum(e){
|
|
if(e&&this.indexshow!==1){
|
|
this.indexshow++;
|
|
this.promptaddress = true;
|
|
this.active = 3
|
|
}
|
|
// console.log(e);
|
|
},
|
|
closeModal(){
|
|
this.promptaddress = false;
|
|
},
|
|
// 获取提币地址
|
|
withdrawalBalance() {
|
|
let address_type = 1
|
|
let data = {
|
|
coin_name: this.coin,
|
|
address_type: this.rechargeType
|
|
};
|
|
Wallet.withdrawalBalance(data).then((res) => {
|
|
// console.info(res)
|
|
this.withdrawFee = res.data;
|
|
});
|
|
},
|
|
enteraddressType(e){
|
|
if(e&&this.form.amount){
|
|
const num = this.coin=='USDT'&&this.form.addressType==3?this.withdrawFee.trc20:this.withdrawFee.withdrawal_fee
|
|
this.quantity = this.form.amount - num
|
|
}
|
|
},
|
|
// 獲取邮箱验证码
|
|
getEmailCode(){
|
|
if (!this.form.address) {
|
|
this.$toast(this.$t('assets.b9'))
|
|
return
|
|
}
|
|
if (!this.form.amount) {
|
|
this.$toast(this.$t('assets.c2'))
|
|
return
|
|
}
|
|
if (!this.form.withdrawal_psw) {
|
|
this.$toast(this.$t('common.c14'))
|
|
return
|
|
}
|
|
// if (!this.form.gr_code) {
|
|
// this.$toast(this.$t('common.GraphicValidation'))
|
|
// return
|
|
// }
|
|
if(this.getEmailCodeLock){return};
|
|
this.JStime = 300;
|
|
this.tiemr = setInterval(()=>{
|
|
if(this.JStime===0){
|
|
this.getEmailCodeLock = false;
|
|
clearInterval(this.tiemr);
|
|
return;
|
|
}
|
|
this.JStime--;
|
|
}, 1000)
|
|
this.getEmailCodeLock = true;
|
|
Member.getWdcode({bt:this.coin,baddr:this.form.address,bnum:this.form.amount}).then(res=>{
|
|
// console.log(res);
|
|
if(res.code=='4001'){
|
|
this.$toast(res.message);
|
|
}else{
|
|
this.$toast(this.$t('common.sendSuccess'));
|
|
}
|
|
})
|
|
},
|
|
// 发起提币
|
|
toDraw() {
|
|
if (!this.form.address) {
|
|
this.$toast(this.$t('assets.b9'))
|
|
return
|
|
}
|
|
if (!this.form.amount) {
|
|
this.$toast(this.$t('assets.c2'))
|
|
return
|
|
}
|
|
if(!this.form.withdrawal_psw){
|
|
this.$toast(this.$t('common.c14'))
|
|
return
|
|
}
|
|
if (!this.form.emailcode) {
|
|
this.$toast(this.$t('safe.a6'))
|
|
return
|
|
}
|
|
let data = this.withdrawFee
|
|
if (data.withdraw_switch == 1) {
|
|
this.secondaryShow = true
|
|
if (data.google_status == 1) {
|
|
this.form.code_type = 3;
|
|
} else if (data.phone_status == 1) {
|
|
this.form.code_type = 1;
|
|
this.$nextTick(() => {
|
|
this.$refs.mobileCode.send();
|
|
});
|
|
} else if (data.email_status == 1) {
|
|
this.form.code_type = 2;
|
|
this.$nextTick(() => {
|
|
this.$refs.emailCode.send();
|
|
});
|
|
}
|
|
} else {
|
|
this.draw()
|
|
}
|
|
},
|
|
draw() {
|
|
// if(this.status!=2){
|
|
// this.$toast(this.$t('common.withdrawal2'));
|
|
// }
|
|
// this.form.addressType = this.rechargeType;
|
|
this.form.coin_id = this.activeCoin.coin_id;
|
|
Wallet.withdraw(this.form, {btn: this.$refs.btn})
|
|
.then((res) => {
|
|
this.secondaryShow = false
|
|
this.form.code = ''
|
|
if (res.code == 4001) {
|
|
this.$toast(res.message);
|
|
// this.reGetGraphChe();//重新获取图形验证码；
|
|
} else {
|
|
this.$toast.success(this.$t("assets.d5") + "！");
|
|
this.form.amount = ''
|
|
setTimeout(()=>{
|
|
uni.navigateTo({
|
|
url:'/pages/assets/records?type='+this.type
|
|
})
|
|
}, 1500)
|
|
// setTimeout(()=>{
|
|
// this.getWithdrawRecords();
|
|
// }, 2000)
|
|
// setTimeout(()=>{
|
|
// this.getWithdrawRecords();
|
|
// }, 3000)
|
|
}
|
|
})
|
|
.catch(() => {
|
|
});
|
|
},
|
|
amountnum(){
|
|
if(this.form.amount){
|
|
this.active = 4
|
|
const num = this.coin=='USDT'&&this.form.addressType==3?this.withdrawFee.trc20:this.withdrawFee.withdrawal_fee
|
|
this.quantity = this.form.amount - num
|
|
if(this.quantity < 0){
|
|
this.quantity = "0.00"
|
|
}
|
|
}else{
|
|
this.quantity = "0.00"
|
|
}
|
|
},
|
|
withdrawalnum(){
|
|
this.active = 5
|
|
},
|
|
updateTimeFormat() {
|
|
// 这里调用获取时间格式的函数，并更新data中的timeFormat
|
|
this.timeFormat = this.getTimeFormat();
|
|
},
|
|
getCurrentUSTime() {
|
|
const now = new Date();
|
|
const offset = -4 * 60; // UTC-4小时（东部时间）
|
|
// 注意：getTimezoneOffset() 返回的是当前时区与UTC的分钟差（正值），需要反向调整
|
|
const usTime = new Date(now.getTime() + (now.getTimezoneOffset() * 60000) + (offset * 60000));
|
|
return usTime;
|
|
},
|
|
|
|
// 获取当前美国时间的星期几（0代表周日，1代表周一，...，6代表周六）
|
|
getDayOfWeek(date) {
|
|
return date.getDay();
|
|
},
|
|
|
|
// 根据当前是美国时间的哪一天来返回“12H”或“24H”
|
|
getTimeFormat() {
|
|
const usTime = this.getCurrentUSTime();
|
|
const dayOfWeek = this.getDayOfWeek(usTime);
|
|
return dayOfWeek >= 1 && dayOfWeek <= 5 ? '12H' : '24H';
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
|
|
</style>
|
|
<style scoped lang="scss">
|
|
.el-steps--vertical{
|
|
height: auto;
|
|
}
|
|
::v-deep .el-step__title.is-wait {
|
|
color: #303133 !important;
|
|
}
|
|
::v-deep .el-input__inner{
|
|
background-color: #242424;
|
|
}
|
|
::v-deep .is-process .el-step__icon.is-text{
|
|
border-color: #C0C4CC;
|
|
}
|
|
|
|
.modal-overlay {
|
|
z-index: 999999999999;
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
.modal-content {
|
|
background-color: #1f1f1f;
|
|
padding: 20px;
|
|
border-radius: 5px;
|
|
width: 550rpx;
|
|
text-align: center;
|
|
position: relative;
|
|
}
|
|
|
|
.losure{
|
|
color: #fff;
|
|
width: 100%;
|
|
height: 40px;
|
|
font-size: 16px;
|
|
line-height: 40px;
|
|
cursor: pointer;
|
|
border-radius: 5px;
|
|
background-color: #77abff;
|
|
}
|
|
.getCode{
|
|
color: #fff;
|
|
margin: 10px 0px;
|
|
padding: 5px 10px;
|
|
border-radius: 5px;
|
|
align-items: center;
|
|
border: 1px solid #4e4e5d;
|
|
}
|
|
.fontWithdrawal{
|
|
color: #737475;
|
|
cursor: pointer;
|
|
padding: 10px 40px;
|
|
border-radius: 5px;
|
|
background-color: #3f4651;
|
|
}
|
|
.fontWithdrawal1{
|
|
color: #fff;
|
|
cursor: pointer;
|
|
padding: 10px 40px;
|
|
border-radius: 5px;
|
|
background-color: #1c52bc;
|
|
}
|
|
</style>
|