其他人改的版本

李凌

2025-10-15 7fc6bfe900790ec7c92bce85d5b20a95fbc06e65

 src/views/my/transfer.vue

@@ -1,165 +1,168 @@
<template>
    <div class="transfer">
        <fx-header :title="$t('划转')">
            <template v-slot:title>
                <div>{{ $t('划转') }}</div>
            </template>
        </fx-header>

        <div style="position: relative;">
            <div class="card">
                <!-- <van-field v-model="startValue" :label="$t('从')" type="digit" @blur="getassets" /> -->
                <div>{{ $t('从') }}</div>
                <div class="mt-3">{{ swapValue ? $t('资金账户') : $t('交易账户') }}</div>
            </div>

            <div class="card mt-5">
                <!-- <van-field v-model="endValue" :label="$t('至')" type="digit" @blur="getassets" /> -->
                <div>{{ $t('至') }}</div>
                <div class="mt-3">{{ swapValue ? $t('交易账户') : $t('资金账户') }}</div>
            </div>

            <img src="@/assets/imgs/my/交换.png" class="swap" @click="onSwap">
  <div class="transfer flexY" style="height: 100%">
    <fx-header :title="$t('划转')">
      <template v-slot:title>
        <div>{{ $t('划转') }}</div>
      </template>
    </fx-header>
    <div class="card flex-centerY">
      <div style="position: relative;flex:1">
        <div class="card flex-centerY" style="padding:10px">
          <!-- <van-field v-model="startValue" :label="$t('从')" type="digit" @blur="getassets" /> -->
          <div style="color: #999">{{ $t('从') }}</div>
          <div style="margin-left: 20px">{{ swapValue ? $t('资金账户') : $t('交易账户') }}</div>
        </div>

        <div class="mt-10 transfer_label">{{ $t('资产') }}</div>
        <div class="card mt-3">
            <span>USDT</span>
        <div class="card flex-centerY" style="padding:10px">
          <!-- <van-field v-model="endValue" :label="$t('至')" type="digit" @blur="getassets" /> -->
          <div style="color: #999">{{ $t('至') }}</div>
          <div style="margin-left: 20px">{{ swapValue ? $t('交易账户') : $t('资金账户') }}</div>
        </div>

        <div class="mt-10 transfer_label">{{ $t('数量') }}</div>
        <div class="card mt-3 flex juc-between items-center">
            <van-field v-model="moneyRevise" type="number" :placeholder="$t('输入金额')">
                <template #button>
                    <div class="label_but flex flex-end items-center">
                        <span class="mr-3">USDT</span>
                        <van-button type="default" size="small" round @click="Maximum">{{ $t('最大') }}</van-button>
                    </div>
                </template>
            </van-field>
        </div>
        <div class="hint">
            <span>{{ $t('最多可转') }}</span>
            {{ maxMoneyRevise }} USDT
        </div>

        <van-button type="primary" round color="#f7b600" @click="submit" size="large" :disabled="!submitThrough">
            {{ $t('确认') }}
        </van-button>
      </div>
      <img src="@/assets/imgs/my/交换.png" class="swap" style="position: relative;margin-right: 15px" @click="onSwap">
    </div>

    <div class="mt-10 transfer_label">{{ $t('资产') }}</div>
    <div class="flex-centerY card mt-3" style="padding:5px 10px">
      <img src="@/assets/img/img_6.png" style="width:25px;height: 25px;margin-right: 10px">
      <div style="font-size: 12px">
        <div>USDT</div>
        <div style="color: #999">USDT</div>
      </div>
    </div>

    <div class="mt-10 transfer_label">{{ $t('数量') }}</div>
    <div class="card mt-3 flex juc-between items-center">
      <van-field v-model="moneyRevise" type="number" :placeholder="$t('输入金额')">
        <template #button>
          <div class="label_but flex flex-end items-center">
            <span class="mr-3">USDT</span>
            <van-button type="default" size="small" round @click="Maximum">{{ $t('最大') }}</van-button>
          </div>
        </template>
      </van-field>
    </div>
    <div class="hint">
      <span>{{ $t('最多可转') }}</span>
      {{ maxMoneyRevise }} USDT
    </div>
    <div style="position: absolute;bottom: 15px;width: 100%">
      <div style="width: 100%" class="flex-center">
        <van-button type="primary" style="width: 90%;margin-left: -20px" color="#111" @click="submit" size="large" :disabled="!submitThrough">
          {{ $t('确认') }}
        </van-button>
      </div>
    </div>
  </div>
</template>

<script setup>
import { ref, computed } from "vue";
import { useI18n } from "vue-i18n";
import { _transfer, _getassets } from "@/service/user.api.js";
import { showToast } from 'vant'
import {ref, computed} from "vue";
import {useI18n} from "vue-i18n";
import {_transfer, _getassets} from "@/service/user.api.js";
import {showToast} from 'vant'

const { t } = useI18n()
const {t} = useI18n()

const moneyRevise = ref(0); // 划转金额
const maxMoneyRevise = ref(0); // 最大划转金额
const swapValue = ref(true) // 上下是否有交换

const Maximum = () => { // 数量选择最大
    moneyRevise.value = maxMoneyRevise.value
  moneyRevise.value = maxMoneyRevise.value
}

const submitThrough = computed(() => { // 判断是否可以提交
    return moneyRevise.value > 0
  return moneyRevise.value > 0
})

const submit = () => { // 提交
    _transfer({
        deductAccount: swapValue.value ? 'capital' : 'contract', // 划转账户
        receiveAccount: swapValue.value ? 'contract' : 'capital', // 接收账户
        moneyRevise: moneyRevise.value,
    }).then(res => {
        showToast({
            message: t('操作成功'),
            forbidClick: true,
            duration: 2000
        })
        getassets()
  _transfer({
    deductAccount: swapValue.value ? 'capital' : 'contract', // 划转账户
    receiveAccount: swapValue.value ? 'contract' : 'capital', // 接收账户
    moneyRevise: moneyRevise.value,
  }).then(res => {
    showToast({
      message: t('操作成功'),
      forbidClick: true,
      duration: 2000
    })
    getassets()
  })
}

const getassets = () => { // 获取资产
    _getassets().then(res => {
        swapValue.value ? maxMoneyRevise.value = res.capitalUSDT : maxMoneyRevise.value = res.contract // 根据上下是否颠倒来判断取的哪个值
    })
  _getassets().then(res => {
    swapValue.value ? maxMoneyRevise.value = res.capitalUSDT : maxMoneyRevise.value = res.contract // 根据上下是否颠倒来判断取的哪个值
  })
}
getassets()

const onSwap = () => { // 交换
    swapValue.value = !swapValue.value
    getassets()
  swapValue.value = !swapValue.value
  getassets()
}

</script>

<style lang="scss" scoped>
.transfer {
    padding: 0rem 1.2rem 2rem 1.2rem;
  padding: 0rem 1.2rem 2rem 1.2rem;

    :deep(.van-cell) {
        background: none;
        padding: 0;
  :deep(.van-cell) {
    background: none;
    padding: 0;
  }

  :deep(.van-cell::after) {
    display: none;
  }

  :deep(.van-dropdown-menu__bar) {
    background-color: rgba($color: #000000, $alpha: 0);
    box-shadow: none;
  }

  :deep(.van-dropdown-menu__title:after) {
    border-color: transparent transparent #000 #000;
    right: 10px;
  }

  :deep(.van-dropdown-menu__title) {
    width: 100%;
  }

  :deep(.van-dropdown-item__content) {
    padding: 8px 16px;
  }

  .card {
    background: $input_background;
    padding: 2rem 1.2rem;
    border-radius: 0.5rem;
    font-size: 16px;
  }

  .swap {
    width: 4rem;
  }

  .hint {
    font-size: 12px;
    margin-bottom: 150px;

    span {
      color: $text_color5;
    }
  }

    :deep(.van-cell::after) {
        display: none;
    }
  .label_but {
    color: $text_color4;
  }

    :deep(.van-dropdown-menu__bar) {
        background-color: rgba($color: #000000, $alpha: 0);
        box-shadow: none;
    }
  .transfer_label {
    font-size: 16px;

    :deep(.van-dropdown-menu__title:after) {
        border-color: transparent transparent #000 #000;
        right: 10px;
    }

    :deep(.van-dropdown-menu__title) {
        width: 100%;
    }

    :deep(.van-dropdown-item__content) {
        padding: 8px 16px;
    }

    .card {
        background: $input_background;
        padding: 2rem 1.2rem;
        border-radius: 0.5rem;
        font-size: 16px;
    }

    .swap {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 4rem;
    }

    .hint {
        font-size: 12px;
        margin-bottom: 150px;

        span {
            color: $text_color5;
        }
    }

    .label_but {
        color: $text_color4;
    }

    .transfer_label {
        font-size: 16px;

    }
  }
}
</style>
</style>