| | |
| | | <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 id="1">沙特账户转石油黄金账户</mt-tab-item> |
| | | <mt-tab-item 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="可转金额" |
| | | :label="$t('可转金额')" |
| | | :placeholder="$t('可转金额')" |
| | | type="text" |
| | | disabled |
| | | v-model="myMoney[0].availableBalance" |
| | |
| | | </div> |
| | | <div class="form-block"> |
| | | <mt-field |
| | | label="转账金额" |
| | | :label="$t('转账金额')" |
| | | name="amt" |
| | | v-model="form.account1" |
| | | placeholder="请输入转账金额" |
| | | :placeholder="$t('请输入转账金额')" |
| | | type="text" |
| | | > |
| | | <span @click="selectAll1">全部</span> |
| | | <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="可转金额" |
| | | :label="$t('可转金额')" |
| | | :placeholder="$t('可转金额')" |
| | | type="text" |
| | | disabled |
| | | v-model="myMoney[1].availableBalance" |
| | | ></mt-field> |
| | | </div> |
| | | <div class="form-block"> |
| | | </div> --> |
| | | <!-- <div class="form-block"> |
| | | <mt-field |
| | | label="转账金额" |
| | | :label="$t('转账金额')" |
| | | v-model="form.account2" |
| | | placeholder="请输入转账金额" |
| | | :placeholder="$t('请输入转账金额')" |
| | | type="text" |
| | | > |
| | | <span @click="selectAll2">全部</span> |
| | | <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> |
| | |
| | | </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> |
| | |
| | | </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> |
| | | |
| | |
| | | userInfo: { |
| | | realName: "" |
| | | }, |
| | | myMoney: "" |
| | | 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: {}, |
| | | computed: {}, |
| | | watch: { |
| | | fromAmount() { |
| | | this.calculateAmount(); |
| | | }, |
| | | fromCurrency() { |
| | | this.calculateAmount(); |
| | | }, |
| | | toCurrency() { |
| | | this.calculateAmount(); |
| | | } |
| | | }, |
| | | computed: { |
| | | toCurrencyDisabled() { |
| | | return this.currencyOptions.length <= 1; |
| | | } |
| | | }, |
| | | created() { |
| | | this.getProductSetting(); |
| | | this.getMoney(); |
| | |
| | | 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(); |
| | | if (data.status === 0) { |
| | |
| | | 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, |
| | | amt: this.fromAmount, |
| | | // type: this.selected, // 1 融资转指数 2 指数转融资 |
| | | userId: this.$store.state.userInfo.id, // 用户id |
| | | disbursementAccount: this.selected === "1" ? "ST" : "USDT", // 划出账户 |
| | | depositAccount: this.selected === "2" ? "ST" : "USDT" // 划入账户 |
| | | disbursementAccount: this.fromCurrency, // 划出账户 |
| | | depositAccount: this.toCurrency // 划入账户 |
| | | }; |
| | | let data = await api.transfer(opt); |
| | | if (data.status === 0) { |
| | |
| | | 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 { |
| | |
| | | /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> |