From 7087b96611573e4a1239cf4afaa8faf1b590c8de Mon Sep 17 00:00:00 2001
From: lxf <1371462558@qq.com>
Date: Mon, 28 Apr 2025 18:33:49 +0800
Subject: [PATCH] style: 修改usdt 为 usd
---
src/page/user/transfer.vue | 397 ++++++++++++++++++++++++++++++++++++++++++++++---------
1 files changed, 328 insertions(+), 69 deletions(-)
diff --git a/src/page/user/transfer.vue b/src/page/user/transfer.vue
index 6efca9f..117e305 100644
--- a/src/page/user/transfer.vue
+++ b/src/page/user/transfer.vue
@@ -1,52 +1,100 @@
<template>
<div class="wrapper">
- <div class="header">
- <mt-header title="账户资金互转">
+ <!-- <div class="header">
+ <mt-header :title="$t('账户资金互转')">
<router-link to="/user" slot="left">
- <mt-button icon="back">我的</mt-button>
+ <mt-button icon="back"></mt-button>
</router-link>
</mt-header>
- </div>
+ </div> -->
+ <!-- <van-nav-bar
+ :placeholder="true"
+ :safe-area-inset-top="true"
+ :title="$t('账户资金互转')"
+ left-arrow
+ @click-left="onClickLeft"
+ >
+ </van-nav-bar>
<mt-navbar v-model="selected">
- <mt-tab-item v-if="this.$store.state.settingForm.indexDisplay" id="1">融资转指数</mt-tab-item>
- <mt-tab-item v-if="this.$store.state.settingForm.indexDisplay" id="2">指数转融资</mt-tab-item>
- <mt-tab-item v-if="this.$store.state.settingForm.futuresDisplay" id="3">融资转期货</mt-tab-item>
- <mt-tab-item v-if="this.$store.state.settingForm.futuresDisplay" id="4">期货转融资</mt-tab-item>
- </mt-navbar>
+ <mt-tab-item id="1">{{ $t("沙特账户转黄金原油账户") }}</mt-tab-item>
+ <mt-tab-item id="2">{{ $t("黄金原油账户转沙特账户") }}</mt-tab-item> -->
+ <!-- <mt-tab-item v-if="this.$store.state.settingForm.futuresDisplay" id="3">融资转期货</mt-tab-item> -->
+ <!-- <mt-tab-item v-if="this.$store.state.settingForm.futuresDisplay" id="4">期货转融资</mt-tab-item> -->
+ <!-- </mt-navbar>
<mt-tab-container class="order-list" v-model="selected">
<mt-tab-container-item id="1">
<div class="form-block">
- <mt-field label="可转金额" placeholder="可转金额" type="text" disabled v-model="this.$store.state.userInfo.enableAmt">
+ <mt-field
+ :label="$t('可转金额')"
+ :placeholder="$t('可转金额')"
+ type="text"
+ disabled
+ v-model="myMoney[0].availableBalance"
+ >
</mt-field>
</div>
<div class="form-block">
- <mt-field label="转账金额" name="amt" v-model="form.account1" placeholder="请输入转账金额" type="text">
- <span @click="selectAll1">全部</span>
+ <mt-field
+ :label="$t('转账金额')"
+ name="amt"
+ v-model="form.account1"
+ :placeholder="$t('请输入转账金额')"
+ type="text"
+ >
+ <span @click="selectAll1">{{ $t("hj60") }}</span>
</mt-field>
</div>
<!-- <div class="form-block">
<mt-field label="资金密码" placeholder="资金密码" type="password" v-model="form.password"></mt-field>
</div>
<p class="prompt">资金密码默认为登录密码</p> -->
- <div class="btnbox">
- <span class="text-center btnok loginout" @click="tosubmit">确认转入指数账户</span>
- </div>
+ <!-- <div class="btnbox">
+ <span class="text-center btnok loginout" @click="tosubmit">{{
+ $t("确认转入黄金原油账户")
+ }}</span>
+ </div> -->
+ <!-- <van-button
+ class="but"
+ type="primary"
+ style="margin-top: 1.04rem; margin-bottom: 1.04rem"
+ @click="tosubmit"
+ >{{ $t("确认") }}</van-button
+ >
</mt-tab-container-item>
<mt-tab-container-item id="2">
<div class="form-block">
- <mt-field label="可转金额" placeholder="可转金额" type="text" disabled
- v-model="this.$store.state.userInfo.enableIndexAmt"></mt-field>
- </div>
- <div class="form-block">
- <mt-field label="转账金额" v-model="form.account2" placeholder="请输入转账金额" type="text">
- <span @click="selectAll2">全部</span>
+ <mt-field
+ :label="$t('可转金额')"
+ :placeholder="$t('可转金额')"
+ type="text"
+ disabled
+ v-model="myMoney[1].availableBalance"
+ ></mt-field>
+ </div> -->
+ <!-- <div class="form-block">
+ <mt-field
+ :label="$t('转账金额')"
+ v-model="form.account2"
+ :placeholder="$t('请输入转账金额')"
+ type="text"
+ >
+ <span @click="selectAll2">{{ $t("hj60") }}</span>
</mt-field>
- </div>
- <div class="btnbox">
- <span class="text-center btnok loginout" @click="tosubmit">确认转入融资账户</span>
- </div>
- </mt-tab-container-item>
- <mt-tab-container-item id="3">
+ </div> -->
+ <!-- <div class="btnbox">
+ <span class="text-center btnok loginout" @click="tosubmit">{{
+ $t("确认转入沙特账户")
+ }}</span>
+ </div> -->
+ <!-- <van-button
+ class="but"
+ type="primary"
+ style="margin-top: 1.04rem; margin-bottom: 1.04rem"
+ @click="tosubmit"
+ >{{ $t("确认") }}</van-button
+ >
+ </mt-tab-container-item> -->
+ <!-- <mt-tab-container-item id="3">
<div class="form-block">
<mt-field label="可转金额" placeholder="可转金额" type="text" disabled v-model="this.$store.state.userInfo.enableAmt">
</mt-field>
@@ -57,10 +105,11 @@
</mt-field>
</div>
<div class="btnbox">
- <span class="text-center btnok loginout" @click="tosubmit">确认转入期货账户</span>
+ <span class="text-center btnok loginout" @click="tosubmit">确认转入黄金原油账户</span>
</div>
</mt-tab-container-item>
- <mt-tab-container-item id="4">
+ -->
+ <!-- <mt-tab-container-item id="4">
<div class="form-block">
<mt-field label="可转金额" placeholder="可转金额" type="text" disabled
v-model="this.$store.state.userInfo.enableFuturesAmt"></mt-field>
@@ -71,108 +120,290 @@
</mt-field>
</div>
<div class="btnbox">
- <span class="text-center btnok loginout" @click="tosubmit">确认转入融资账户</span>
+ <span class="text-center btnok loginout" @click="tosubmit">确认转入沙特账户</span>
</div>
</mt-tab-container-item>
- </mt-tab-container>
+ -->
+ <!-- </mt-tab-container> -->
+
+ <div class="exchange-wrapper">
+ <van-nav-bar
+ :title="$t('账户资金互转')"
+ left-arrow
+ @click-left="$router.go(-1)"
+ />
+
+ <van-form @submit="onSubmit">
+ <!-- 从货币 -->
+ <van-cell-group>
+ <van-field
+ v-model="fromAmount"
+ type="number"
+ :label="$t('转出金额')"
+ :placeholder="$t('请输入转出金额')"
+ :rules="[{ required: true, message: $t('请输入转出金额') }]"
+ >
+ <template #button>
+ <van-dropdown-menu active-color="#1989fa">
+ <van-dropdown-item
+ v-model="fromCurrency"
+ :options="currencyOptions"
+ disabled
+ />
+ </van-dropdown-menu>
+ </template>
+ </van-field>
+ <van-field
+ v-model="myMoney[my_availableBalance].availableBalance"
+ :label="$t('可用余额')"
+ disabled
+ />
+ </van-cell-group>
+
+ <!-- 兑换箭头 -->
+ <div class="exchange-icon">
+ <van-icon name="exchange" size="24" @click="switchCurrency" />
+ </div>
+
+ <!-- 到货币 -->
+ <van-cell-group>
+ <van-field
+ v-model="toAmount"
+ type="number"
+ :label="$t('转入金额')"
+ :placeholder="$t('转入金额')"
+ disabled
+ >
+ <template #button>
+ <van-dropdown-menu active-color="#1989fa">
+ <van-dropdown-item
+ v-model="toCurrency"
+ :options="currencyOptions"
+ disabled
+ />
+ </van-dropdown-menu>
+ </template>
+ </van-field>
+ </van-cell-group>
+
+ <!-- 汇率显示 -->
+ <!-- <van-cell title="汇率" :value="exchangeRate" /> -->
+
+ <!-- 提交按钮 -->
+ <div style="margin: 16px;">
+ <van-button
+ class="but"
+ type="primary"
+ style="margin-top: 1.04rem; margin-bottom: 1.04rem"
+ native-type="submit"
+ >
+ {{ $t("确认兑换") }}
+ </van-button>
+ </div>
+ </van-form>
+ </div>
</div>
</template>
<script>
// import '@/assets/style/common.less'
-import * as api from '@/axios/api'
-import { Toast } from 'mint-ui'
+import * as api from "@/axios/api";
+import { Toast } from "mint-ui";
export default {
- components: {
- },
+ components: {},
data() {
return {
- selected: '1', // 选中
+ selected: "1", // 选中
+
form: {
- account1: '',
- account2: '',
- account3: '',
- account4: '',
- password: ''
+ account1: "",
+ account2: "",
+ account3: "",
+ account4: "",
+ password: ""
},
userInfo: {
- realName: ''
- }
+ realName: ""
+ },
+ myMoney: "",
+ my_availableBalance: 0,
+ fromCurrency: "USD",
+ toCurrency: "ST",
+ fromAmount: "",
+ toAmount: "",
+ fromBalance: "1000.00",
+ exchangeRate: "1 USD = 100 ST",
+ currencyOptions: [
+ { text: "USD", value: "USD" },
+ { text: "ST", value: "ST" }
+ // { text: "欧元(EUR)", value: "EUR" },
+ // { text: "英镑(GBP)", value: "GBP" }
+ ]
+ };
+ },
+ watch: {
+ fromAmount() {
+ this.calculateAmount();
+ },
+ fromCurrency() {
+ this.calculateAmount();
+ },
+ toCurrency() {
+ this.calculateAmount();
}
},
- watch: {},
- computed: {},
+ computed: {
+ toCurrencyDisabled() {
+ return this.currencyOptions.length <= 1;
+ }
+ },
created() {
- this.getProductSetting()
+ this.getProductSetting();
+ this.getMoney();
},
mounted() {
if (this.$route.query.type) {
- this.selected = this.$route.query.type + ''
+ this.selected = this.$route.query.type + "";
}
- this.getUserInfo()
+ this.getUserInfo();
},
methods: {
+ onSubmit() {
+ // 处理兑换逻辑
+ console.log(
+ "提交兑换:",
+ this.fromAmount,
+ this.fromCurrency,
+ "->",
+ this.toAmount,
+ this.toCurrency
+ );
+
+ this.tosubmit();
+ },
+ switchCurrency() {
+ // 切换货币方向
+ const temp = this.fromCurrency;
+ this.fromCurrency = this.toCurrency;
+ this.toCurrency = temp;
+
+ if (this.fromCurrency === "ST") {
+ this.my_availableBalance = 0;
+ } else if (this.fromCurrency === "USD" || this.fromCurrency === "USD") {
+ this.my_availableBalance = 1;
+ }
+ console.log(this.myMoney[this.my_availableBalance].availableBalance);
+ this.calculateAmount();
+ },
+ calculateAmount() {
+ // 这里应该调用汇率API计算金额
+ // 示例简单计算
+ if (this.fromAmount && this.fromCurrency && this.toCurrency) {
+ const rate =
+ this.fromCurrency === "USD" && this.toCurrency === "ST" ? 100 : 1;
+ this.toAmount = (this.fromAmount * rate).toFixed(2);
+ }
+ },
+ onClickLeft() {
+ this.$router.push("/user");
+ },
async getProductSetting() {
- let data = await api.getProductSetting()
+ let data = await api.getProductSetting();
if (data.status === 0) {
- this.$store.state.settingForm = data.data
+ this.$store.state.settingForm = data.data;
if (!this.$store.state.settingForm.indexDisplay) {
- this.selected = '3'
+ this.selected = "3";
}
} else {
- this.$message.error(data.msg)
+ this.$message.error(data.msg);
}
},
selectAll1() {
// 选择全部
- this.form.account1 = this.$store.state.userInfo.enableAmt
+ this.form.account1 = this.myMoney[0].availableBalance;
},
selectAll2() {
// 选择全部
- this.form.account2 = this.$store.state.userInfo.enableIndexAmt
+ this.form.account2 = this.myMoney[1].availableBalance;
},
selectAll3() {
// 选择全部
- this.form.account3 = this.$store.state.userInfo.enableAmt
+ this.form.account3 = this.$store.state.userInfo.enableAmt;
},
selectAll4() {
// 选择全部
- this.form.account4 = this.$store.state.userInfo.enableFuturesAmt
+ this.form.account4 = this.$store.state.userInfo.enableFuturesAmt;
},
async tosubmit() {
// 融资转指数
let opt = {
- amt: this.selected === '1' ? this.form.account1 : this.selected === '2' ? this.form.account2 : this.selected === '3' ? this.form.account3 : this.form.account4,
- type: this.selected // 1 融资转指数 2 指数转融资
- }
- let data = await api.AmtChange(opt)
+ amt: this.fromAmount,
+ // type: this.selected, // 1 融资转指数 2 指数转融资
+ userId: this.$store.state.userInfo.id, // 用户id
+ disbursementAccount: this.fromCurrency, // 划出账户
+ depositAccount: this.toCurrency // 划入账户
+ };
+ let data = await api.transfer(opt);
if (data.status === 0) {
- Toast(data.msg)
- this.$router.push('/user')
+ Toast(data.msg);
+ this.$router.push("/user");
} else {
- Toast(data.msg)
+ Toast(data.msg);
}
},
async getUserInfo() {
// 获取用户信息
- let data = await api.getUserInfo()
+ let data = await api.getUserInfo();
if (data.status === 0) {
- this.$store.state.userInfo = data.data
+ this.$store.state.userInfo = data.data;
} else {
- Toast(data.msg)
+ Toast(data.msg);
+ }
+ },
+ async getMoney() {
+ let data = await api.getMoney();
+ if (data.status === 0) {
+ this.myMoney = data.data;
+ if (this.fromCurrency === "ST") {
+ this.my_availableBalance = 0;
+ } else if (this.fromCurrency === "USD") {
+ this.my_availableBalance = 1;
+ }
+ } else {
+ Toast(data.msg);
}
}
}
-}
+};
</script>
<style lang="less" scoped>
+.payclass {
+ width: 150px;
+ height: 40px;
+ border-radius: 5px;
+ border: 1px solid #e5e8ed;
+ text-align: center;
+ line-height: 40px;
+}
+.but {
+ width: 95%;
+ color: #ffffff;
+ background-color: #1989fa;
+ border-radius: 8px;
+ height: 66px;
+ font-size: 22px;
+ margin-left: 2.5%;
+}
.is-selected .mint-tab-item-label:hover {
text-decoration: none;
}
-.wrapper /deep/ .mint-tab-item-label {
- font-size: 0.264rem;
+.wrapper /deep/ .van-nav-bar__title {
+ font-size: 0.4rem !important;
+}
+.wrapper /deep/ .van-cell {
+ font-size: 0.31rem !important;
}
.mint-navbar .mint-tab-item.is-selected {
@@ -182,7 +413,35 @@
margin-bottom: 0;
}
+.order-list {
+ /deep/ .mint-cell {
+ background: initial !important;
+ }
+ /deep/ .mint-cell .mint-cell-text {
+ color: #000 !important;
+ }
+ /deep/ .mint-cell-wrapper {
+ line-height: 1 !important;
+ }
+}
+
.prompt {
padding: 0.3rem 0 0.2rem 0.7rem;
}
+
+.exchange-wrapper {
+ padding-bottom: 20px;
+}
+
+.exchange-icon {
+ display: flex;
+ justify-content: center;
+ margin: 15px 0;
+ color: #1989fa;
+}
+
+.van-dropdown-menu {
+ width: 120px;
+ height: 44px;
+}
</style>
--
Gitblit v1.9.3