From 383c19d0da1390f8d82e7b23fb2d62f87d544d56 Mon Sep 17 00:00:00 2001
From: PC-20250623MANY\Administrator <344137771@qq.com>
Date: Wed, 17 Sep 2025 14:08:01 +0800
Subject: [PATCH] 2
---
src/views/account/account.vue | 423 +++++++---------------------------------------------
1 files changed, 60 insertions(+), 363 deletions(-)
diff --git a/src/views/account/account.vue b/src/views/account/account.vue
index 66b2f59..2323c3e 100644
--- a/src/views/account/account.vue
+++ b/src/views/account/account.vue
@@ -5,14 +5,14 @@
<div class="overview-header">
<div class="title">
<!-- <i class="el-icon-lock"></i> -->
- <img src="@/assets/images/fund-icon_b.png" alt="Account" />
+ <img src="@/assets/images/account-icon.png" alt="Account" />
<span>{{ $t("ao1") }}</span>
</div>
</div>
<div class="flex-between" style="width: 100%">
<div class="action-buttons">
- <el-button
+ <!-- <el-button
type="success"
class="deposit-btn"
@click="trasferireVisible = true"
@@ -21,18 +21,14 @@
<img src="@/assets/images/account_hz.png" alt="Deposit" />
{{ $t("劃轉") }}
</div>
- </el-button>
- <el-button
- type="success"
- class="deposit-btn"
- @click="depositDialogVisible = true"
- >
+ </el-button> -->
+ <el-button type="primary" class="deposit-btn" @click="depositTip">
<div class="flex-center">
<img src="@/assets/images/account_rec.png" alt="Deposit" />
{{ $t("dep") }}
</div>
</el-button>
- <el-button class="withdraw-btn" @click="withdrawVisible = true">
+ <el-button type="primary" class="withdraw-btn" @click="withdrawVisible = true">
<div class="flex-center">
<img src="@/assets/images/account_ret.png" alt="Withdraw" />
{{ $t("hj177") }}
@@ -81,12 +77,7 @@
<h3>{{ $t("美国") }}</h3>
</div>
- <div
- class="overview-content"
- v-for="i in moneyData"
- :key="i.id"
- v-show="i.accectType == 'US'"
- >
+ <div class="overview-content" v-for="i in moneyData" :key="i.id" v-show="i.accectType == 'US'">
<div class="overview-item">
<div class="item-label">{{ $t("hj49") }}</div>
<div class="item-value">{{ i.symbol }} {{ i.totalMoney }}</div>
@@ -104,38 +95,6 @@
</div>
<div class="market-content">
- <div class="market-row">
- <div class="market-label">
- <span class="market-tag sc_c">US</span>
- <span>{{ $t("mv1") }}</span>
- </div>
- <div class="market-value">{{ positionData.usMarketValue }} USD</div>
- </div>
- <div class="market-row">
- <div class="market-label">
- <span class="market-tag sc_c">US</span>
- <span>{{ $t("upl1") }}</span>
- </div>
- <div
- class="market-value flex-center"
- :class="`${positionData.usPositionEarnings < 0 ? 'r_c' : ''} ${
- positionData.usPositionEarnings > 0 ? 'lc_c' : ''
- }`"
- >
- <img
- src="@/assets/images/up.png"
- alt=""
- v-if="positionData.usPositionEarnings > 0"
- />
- <img
- src="@/assets/images/down.png"
- alt=""
- v-else-if="positionData.usPositionEarnings < 0"
- />
- {{ positionData.usPositionEarnings }}
- ({{ positionData.usPositionEarningsParent }})
- </div>
- </div>
<div class="market-footer">
<div class="position-btn sc_c" @click="positionOpen('US')">
{{ $t("hj2") }}
@@ -146,298 +105,56 @@
</div>
</div>
</div>
-
- <div class="market-section sb_b">
- <div class="market-header">
- <h3>{{ $t("hk1") }}</h3>
- </div>
-
- <div
- class="overview-content"
- v-for="i in moneyData"
- :key="i.id"
- v-show="i.accectType == 'HK'"
- >
- <div class="overview-item">
- <div class="item-label">{{ $t("hj49") }}</div>
- <div class="item-value">{{ i.symbol }} {{ i.totalMoney }}</div>
- </div>
- <div class="overview-item">
- <div class="item-label">{{ $t("hj48") }}</div>
- <div class="item-value">
- {{ i.symbol }} {{ i.availableBalance }}
- </div>
- </div>
- <div class="overview-item">
- <div class="item-label">{{ $t("ff1") }}</div>
- <div class="item-value">{{ i.symbol }} {{ i.freezeMoney }}</div>
- </div>
- </div>
-
- <div class="market-content">
- <div class="market-row">
- <div class="market-label">
- <el-tag type="success" size="small" style="margin-right: 8px">
- HK
- </el-tag>
- <span>{{ $t("mv1") }}</span>
- </div>
- <div class="market-value">{{ positionData.hkMarketValue }} HKD</div>
- </div>
- <div class="market-row">
- <div class="market-label">
- <el-tag type="success" size="small" style="margin-right: 8px"
- >HK</el-tag
- >
- <span>{{ $t("upl1") }}</span>
- </div>
- <div
- class="market-value flex-center"
- :class="`${positionData.hkPositionEarnings < 0 ? 'r_c' : ''} ${
- positionData.hkPositionEarnings > 0 ? 'lc_c' : ''
- }`"
- >
- <img
- src="@/assets/images/up.png"
- alt=""
- v-if="positionData.hkPositionEarnings > 0"
- />
- <img
- src="@/assets/images/down.png"
- alt=""
- v-else-if="positionData.hkPositionEarnings < 0"
- />
- {{ positionData.hkPositionEarnings }}
- ({{ positionData.hkPositionEarningsParent }})
- </div>
- </div>
- <div class="market-footer">
- <div class="position-btn sc_c" @click="positionOpen('HK')">
- {{ $t("hj2") }}
- </div>
- <div class="trade-log-btn lc_c" @click="tradeLogOpen('HK')">
- {{ $t("hj121") }}
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="market-data page-w a_card" style="padding-top: 0">
- <div class="market-section sb_b">
- <div class="market-header">
- <h3>{{ $t("tw") }}</h3>
- </div>
-
- <div
- class="overview-content"
- v-for="i in moneyData"
- :key="i.id"
- v-show="i.accectType == 'TW'"
- >
- <div class="overview-item">
- <div class="item-label">{{ $t("hj49") }}</div>
- <div class="item-value">{{ i.symbol }} {{ i.totalMoney }}</div>
- </div>
- <div class="overview-item">
- <div class="item-label">{{ $t("hj48") }}</div>
- <div class="item-value">
- {{ i.symbol }} {{ i.availableBalance }}
- </div>
- </div>
- <div class="overview-item">
- <div class="item-label">{{ $t("ff1") }}</div>
- <div class="item-value">{{ i.symbol }} {{ i.freezeMoney }}</div>
- </div>
- </div>
-
- <div class="market-content">
- <div class="market-row">
- <div class="market-label">
- <el-tag type="success" size="small" style="margin-right: 8px">
- TW
- </el-tag>
- <span>{{ $t("mv1") }}</span>
- </div>
- <div class="market-value">{{ positionData.twMarketValue }} TWD</div>
- </div>
- <div class="market-row">
- <div class="market-label">
- <el-tag type="success" size="small" style="margin-right: 8px"
- >TW</el-tag
- >
- <span>{{ $t("upl1") }}</span>
- </div>
- <div
- class="market-value flex-center"
- :class="`${positionData.twPositionEarnings < 0 ? 'r_c' : ''} ${
- positionData.twPositionEarnings > 0 ? 'lc_c' : ''
- }`"
- >
- <img
- src="@/assets/images/up.png"
- alt=""
- v-if="positionData.twPositionEarnings > 0"
- />
- <img
- src="@/assets/images/down.png"
- alt=""
- v-else-if="positionData.twPositionEarnings < 0"
- />
- {{ positionData.twPositionEarnings }}
- ({{ positionData.twPositionEarningsParent }})
- </div>
- </div>
- <div class="market-footer">
- <div class="position-btn sc_c" @click="positionOpen('TW')">
- {{ $t("hj2") }}
- </div>
- <div class="trade-log-btn lc_c" @click="tradeLogOpen('TW')">
- {{ $t("hj121") }}
- </div>
- </div>
- </div>
- </div>
-
- <div class="market-section sb_b">
- <div class="market-header">
- <h3>{{ $t("id1") }}</h3>
- </div>
-
- <div
- class="overview-content"
- v-for="i in moneyData"
- :key="i.id"
- v-show="i.accectType == 'IN'"
- >
- <div class="overview-item">
- <div class="item-label">{{ $t("hj49") }}</div>
- <div class="item-value">{{ i.symbol }} {{ i.totalMoney }}</div>
- </div>
- <div class="overview-item">
- <div class="item-label">{{ $t("hj48") }}</div>
- <div class="item-value">
- {{ i.symbol }} {{ i.availableBalance }}
- </div>
- </div>
- <div class="overview-item">
- <div class="item-label">{{ $t("ff1") }}</div>
- <div class="item-value">{{ i.symbol }} {{ i.freezeMoney }}</div>
- </div>
- </div>
-
- <div class="market-content">
- <div class="market-row">
- <div class="market-label">
- <el-tag type="success" size="small" style="margin-right: 8px">
- IN
- </el-tag>
- <span>{{ $t("mv1") }}</span>
- </div>
- <div class="market-value">{{ positionData.inMarketValue }} INR</div>
- </div>
- <div class="market-row">
- <div class="market-label">
- <el-tag type="success" size="small" style="margin-right: 8px"
- >IN</el-tag
- >
- <span>{{ $t("upl1") }}</span>
- </div>
- <div
- class="market-value flex-center"
- :class="`${positionData.inPositionEarnings < 0 ? 'r_c' : ''} ${
- positionData.inPositionEarnings > 0 ? 'lc_c' : ''
- }`"
- >
- <img
- src="@/assets/images/up.png"
- alt=""
- v-if="positionData.inPositionEarnings > 0"
- />
- <img
- src="@/assets/images/down.png"
- alt=""
- v-else-if="positionData.inPositionEarnings < 0"
- />
- {{ positionData.inPositionEarnings }}
- ({{ positionData.inPositionEarningsParent }})
- </div>
- </div>
- <div class="market-footer">
- <div class="position-btn sc_c" @click="positionOpen('IN')">
- {{ $t("hj2") }}
- </div>
- <div class="trade-log-btn lc_c" @click="tradeLogOpen('IN')">
- {{ $t("hj121") }}
- </div>
- </div>
- </div>
- </div>
</div>
<!-- 账户变更详情 -->
<div class="account-details page-w a_card">
<div class="account-details-left">
- <div
+ <!-- <div
class="nav_item"
:class="`${nav == 1 ? 'active' : ''}`"
@click="navChange(1)"
>
{{ $t("账户变动记录") }}
- </div>
- <div
- class="nav_item"
- :class="`${nav == 2 ? 'active' : ''}`"
- @click="navChange(2)"
- >
+ </div> -->
+ <div class="nav_item" :class="`${nav == 2 ? 'active' : ''}`" @click="navChange(2)">
{{ $t("dawr") }}
</div>
- <div
+ <!-- <div
class="nav_item"
:class="`${nav == 3 ? 'active' : ''}`"
@click="navChange(3)"
>
{{ $t("aqt1") }}
- </div>
- <div
+ </div> -->
+ <!-- <div
class="nav_item"
:class="`${nav == 4 ? 'active' : ''}`"
@click="navChange(4)"
>
{{ $t("大宗交易订单") }}
- </div>
- <div
+ </div> -->
+ <!-- <div
class="nav_item"
:class="`${nav == 5 ? 'active' : ''}`"
@click="navChange(5)"
>
{{ $t("io1") }}
- </div>
- <div
+ </div> -->
+ <!-- <div
class="nav_item"
:class="`${nav == 6 ? 'active' : ''}`"
@click="navChange(6)"
>
{{ $t("基金订单") }}
- </div>
- <div
- class="nav_item"
- :class="`${nav == 7 ? 'active' : ''}`"
- @click="navChange(7)"
- >
+ </div> -->
+ <div class="nav_item" :class="`${nav == 7 ? 'active' : ''}`" @click="navChange(7)">
{{ $t("fnv") }}
</div>
- <div
- class="nav_item"
- :class="`${nav == 8 ? 'active' : ''}`"
- @click="navChange(8)"
- >
+ <div class="nav_item" :class="`${nav == 8 ? 'active' : ''}`" @click="navChange(8)">
{{ $t("bc") }}
</div>
- <div
- class="nav_item"
- :class="`${nav == 9 ? 'active' : ''}`"
- @click="navChange(9)"
- >
+ <div class="nav_item" :class="`${nav == 9 ? 'active' : ''}`" @click="navChange(9)">
{{ $t("hj10") }}
</div>
</div>
@@ -455,56 +172,32 @@
</div>
<!-- 划转弹窗 -->
- <Trasferire
- :dialogVisible.sync="trasferireVisible"
- v-if="trasferireVisible"
- @onClose="getMoney"
- :moneyData="moneyData"
- ></Trasferire>
+ <Trasferire :dialogVisible.sync="trasferireVisible" v-if="trasferireVisible" @onClose="getMoney"
+ :moneyData="moneyData"></Trasferire>
<!-- 充值弹窗 -->
- <Deposit
- :dialogVisible.sync="depositDialogVisible"
- v-if="depositDialogVisible"
- @onClose="getMoney"
- ></Deposit>
+ <Deposit :dialogVisible.sync="depositDialogVisible" v-if="depositDialogVisible" @onClose="getMoney"></Deposit>
<!-- 提现弹窗 -->
- <Withdraw
- :dialogVisible.sync="withdrawVisible"
- v-if="withdrawVisible"
- @onClose="getMoney"
- :moneyData="moneyData"
- ></Withdraw>
+ <Withdraw :dialogVisible.sync="withdrawVisible" v-if="withdrawVisible" @onClose="getMoney" :moneyData="moneyData">
+ </Withdraw>
<!-- 贷款申请弹窗 -->
- <loan-application
- :dialogVisible.sync="applicationVisible"
- v-if="applicationVisible"
- ></loan-application>
+ <loan-application :dialogVisible.sync="applicationVisible" v-if="applicationVisible"></loan-application>
<!-- 贷款记录弹窗 -->
- <loan-records
- :dialogVisible.sync="recordsVisible"
- v-if="recordsVisible"
- ></loan-records>
+ <loan-records :dialogVisible.sync="recordsVisible" v-if="recordsVisible"></loan-records>
<!-- 交易列表弹窗(包括us和mx的) -->
- <Position
- :dialogVisible.sync="positionVisible"
- v-if="positionVisible"
- :type="positionType"
- ></Position>
+ <Position :dialogVisible.sync="positionVisible" v-if="positionVisible" :type="positionType" :moneyData="moneyData"
+ @pc="pc"></Position>
<!-- 交易记录弹窗(包括us和mx的) -->
- <trade-log
- :dialogVisible.sync="tradelogVisible"
- v-if="tradelogVisible"
- :type="positionType"
- ></trade-log>
+ <trade-log :dialogVisible.sync="tradelogVisible" v-if="tradelogVisible" :type="positionType"></trade-log>
</div>
</template>
<script>
+let teimss = null;
import * as api from "@/axios/api";
import dawr from "./components/dawr.vue";
import acd from "./components/acd.vue";
@@ -544,10 +237,9 @@
},
data() {
return {
- nav: 1,
+ nav: 2,
moneyData: [], // 账户金额
userInfo: {}, // 用户信息
- positionData: {}, // 账户持仓数据
depositAmount: "", // 存款金额
depositMethod: "Bank Transfer", // 存款方式
depositDialogVisible: false, // 存款弹窗显示状态
@@ -569,12 +261,19 @@
this.init();
},
+ beforeDestroy() {
+ clearInterval(teimss);
+ },
methods: {
// 初始化
init() {
this.getMoney();
this.getInfo();
- this.getMyPositionProfitAndLose();
+
+ clearInterval(teimss);
+ teimss = setInterval(() => {
+ this.getMoney();
+ }, 10000);
},
// 获取账户金额
async getMoney() {
@@ -587,13 +286,6 @@
async getInfo() {
let data = await api.getUserInfo();
this.userInfo = data.data;
- },
- // 获取账户持仓数据
- async getMyPositionProfitAndLose() {
- let data = await api.getMyPositionProfitAndLose();
- if (data.data) {
- this.positionData = data.data;
- }
},
// 交易列表弹窗打开
positionOpen(type) {
@@ -611,15 +303,28 @@
this.nav = val;
}
},
+ // 存款提示
+ depositTip() {
+ this.$message({
+ message: this.$t("充值提示"),
+ type: "warning",
+ });
+ },
+ // 持仓列表关闭,打开平仓列表
+ pc() {
+ this.positionVisible = false;
+ this.tradelogVisible = true;
+ },
},
};
</script>
<style lang="scss" scoped>
-$s_c: #c4d600;
+$s_c: #287dff;
$l_c: #07c160;
+
// .account-container {}
-::v-deep .el-drawer__header > :first-child {
+::v-deep .el-drawer__header> :first-child {
font-size: 18px;
font-weight: 700;
color: #333;
@@ -673,7 +378,7 @@
}
.item-label {
- color: #666;
+ color: #ccc;
font-size: 14px;
margin-bottom: 10px;
}
@@ -681,7 +386,7 @@
.item-value {
font-size: 20px;
font-weight: bold;
- color: #333;
+ color: #eee;
}
.action-buttons {
@@ -697,8 +402,6 @@
}
.deposit-btn {
- background-color: $l_c !important;
- border-color: $l_c !important;
margin-right: 10px;
height: 40px;
padding: 0 20px;
@@ -710,11 +413,6 @@
color: #fff !important;
height: 40px;
padding: 0 20px;
-}
-
-.deposit-btn:hover,
-.withdraw-btn:hover {
- opacity: 0.5;
}
.loan-info {
@@ -782,10 +480,9 @@
.market-section {
flex: 1;
- background-color: #fff;
border-radius: 16px;
overflow: hidden;
- border: 1px solid #e1e1e1;
+ border: 1px solid #777;
}
.market-header {
@@ -861,12 +558,12 @@
/* 账户变更详情样式 */
.account-details {
- background-color: #fff;
+ // background-color: #fff;
border-radius: 8px;
display: flex;
gap: 24px;
padding: 32px;
- border-top: 1px solid #f5f5f5;
+ border-top: 1px solid #555;
.account-details-right {
flex: 3;
--
Gitblit v1.9.3