1
jhzh
2025-03-28 aa984cdc5180ffd8fe49a517f0fe23171b470b89
1
1 files modified
1 files added
368 ■■■■■ changed files
src/page/transfer.vue 361 ●●●●● patch | view | raw | blame | history
src/router/router.js 7 ●●●●● patch | view | raw | blame | history
src/page/transfer.vue
New file
@@ -0,0 +1,361 @@
<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);
                this.amount = this.amount.replace(/[^0-9]/g, '');
            },
            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>
src/router/router.js
@@ -27,6 +27,13 @@
      component: () =>
        import(/* webpackChunkName: "Home" */ /* webpackPrefetch: true */ "@/page/quotes.vue"),
    },
    {
      path: "/transfer",
      name: "Transfer",
      meta: { index: 2, footer: true, keepAlive: true },
      component: () =>
        import(/* webpackChunkName: "Home" */ /* webpackPrefetch: true */ "@/page/transfer.vue"),
    },
    {
      path: "/funds",
      name: "Funds",