From eeb8f18b48989bac5eb5847a51359496956c5339 Mon Sep 17 00:00:00 2001
From: 李 <344137771@qq.com>
Date: Thu, 30 Apr 2026 18:32:45 +0800
Subject: [PATCH] 1
---
src/page/user/account.vue | 276 ++++++++++++++++++++++++++++++++++++++----------------
1 files changed, 192 insertions(+), 84 deletions(-)
diff --git a/src/page/user/account.vue b/src/page/user/account.vue
index fc10e16..fcb5cf9 100644
--- a/src/page/user/account.vue
+++ b/src/page/user/account.vue
@@ -12,26 +12,11 @@
</template>
</tab-head>
- <div class="wallet">
+ <!-- <div class="wallet">
<div class="wallet_title flex-start">
<img src="@/assets/img/钱袋.png" alt="" />
<span>{{ $t("hj244") }}</span>
</div>
-
- <!-- <div class="wallet_price_name flex-between">
- <span>{{ $t("hometips") }}</span>
- <span>{{ $t("hj48") }}</span>
- </div>
-
- <div v-for="i in moneyData" :key="i.id">
- <div class="wallet_i_title flex-center">
- {{ i.accectType }} {{ $t("Account") }}
- </div>
- <div class="wallet_price flex-between">
- <span>{{ i.symbol }} {{ i.totalMoney }}</span>
- <span>{{ i.symbol }} {{ i.availableBalance }}</span>
- </div>
- </div> -->
<div class="wallet_record flex-center" @click="toPage('/wallet')">
<span>{{ $t("我的钱包") }}</span>
@@ -42,7 +27,7 @@
<span>{{ $t("账户变动记录") }}</span>
<van-icon name="play" size=".5em" />
</div>
- </div>
+ </div> -->
<div class="account_tabs flex-between">
<div class="tab flex-center" @click="czts()">
@@ -53,13 +38,61 @@
<img src="@/assets/img/tx.png" alt="" />
<span>{{ $t("subdka") }}</span>
</div>
- <div class="tab flex-center" @click="toPage('/rechargelist')">
+ <div class="tab flex-center" @click="toPage('/wallet')">
+ <div class="qb_icon flex-center">
+ <img src="@/assets/img/qb.png" alt="" />
+ </div>
+ <span>{{ $t("hj244") }}</span>
+ </div>
+ <div class="tab flex-center" @click="toPage('/moneyRecord')">
<img src="@/assets/img/jl.png" alt="" />
- <span>{{ $t("jl") }}</span>
+ <span>{{ $t("资金记录") }}</span>
</div>
</div>
- <div class="account_loan flex-between" @click="toPage('/loan')">
+ <div class="wallet">
+ <div class="wallet_item" v-for="i in moneyData" :key="i.id">
+ <div class="wallet_item_title flex-start">
+ <img src="@/assets/img/qz_r.png" v-if="i.accectType == 'JP'" />
+ <img src="@/assets/img/qz_m.png" v-else-if="i.accectType == 'US'" />
+ <span>{{ i.accectType }} {{ $t("Account") }}</span>
+ </div>
+
+ <div class="wallet_item_content flex-between">
+ <div>
+ <div class="wic_title">{{ $t("hometips") }}</div>
+ <div class="wic_money">{{ i.symbol }} {{ i.totalMoney }}</div>
+ </div>
+ <div>
+ <div class="wic_title" style="text-align: end;">{{ $t("hj48") }}</div>
+ <div class="wic_money" style="text-align: end;">
+ {{ i.symbol }} {{ i.availableBalance }}
+ </div>
+ </div>
+ </div>
+
+ <div class="wallet_item_content flex-between" style="padding-top: 0;">
+ <div>
+ <div class="wic_title">{{ $t("冻结资金") }}</div>
+ <div class="wic_money">{{ i.symbol }} {{ i.freezeMoney }}</div>
+ </div>
+ </div>
+
+ <div class="wallet_item_but flex-between">
+ <div class="flex-center" @click="czts()">
+ <span>{{ $t("hj172") }}</span>
+ </div>
+ <div class="flex-center" @click="toPage('/RechargeSure')">
+ <span>{{ $t("subdka") }}</span>
+ </div>
+ <div class="flex-center" @click="toPage('/transferNew')">
+ <span>{{ $t("划转") }}</span>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <!-- <div class="account_loan flex-between" @click="toPage('/loan')">
<div class="loan_left">
<p class="loan_left_title">{{ $t("待还款金额") }}</p>
<p>$ {{ userInfo.refundAmount || 0 }}</p>
@@ -68,7 +101,7 @@
{{ $t("我的贷款") }}
<van-icon name="play" style="margin-left:.5em" />
</div>
- </div>
+ </div> -->
<div class="account_card">
<div class="held_head flex-between">
@@ -97,28 +130,43 @@
<span class="held_icon">US</span>
<p>{{ $t("持仓收益") }}</p>
</div>
- <div
- class="item_right flex-end"
- :class="{
- descend: positionData.usPositionEarnings < 0,
- rise: positionData.usPositionEarnings > 0
- }"
- >
- <img
- src="@/assets/img/rise.png"
- v-if="positionData.usPositionEarnings > 0"
- />
- <img
- src="@/assets/img/descend.png"
- alt=""
- v-else-if="positionData.usPositionEarnings < 0"
- />
+ <div class="item_right flex-end" :class="{
+ descend: positionData.usPositionEarnings < 0,
+ rise: positionData.usPositionEarnings > 0
+ }">
+ <img src="@/assets/img/rise.png" v-if="positionData.usPositionEarnings > 0" />
+ <img src="@/assets/img/descend.png" alt="" v-else-if="positionData.usPositionEarnings < 0" />
{{ positionData.usPositionEarnings }}
({{ positionData.usPositionEarningsParent }})
</div>
</div>
+ <!-- <div class="held_item flex-between">
+ <div class="item_left flex-start">
+ <span class="held_icon2">JP</span>
+ <p>{{ $t("Worth") }}</p>
+ </div>
+ <div class="item_right flex-end">
+ {{ positionData.jpMarketValue }} JPY
+ </div>
+ </div>
+
<div class="held_item flex-between">
+ <div class="item_left flex-start">
+ <span class="held_icon2">JP</span>
+ <p>{{ $t("持仓收益") }}</p>
+ </div>
+ <div class="item_right flex-end" :class="{
+ descend: positionData.jpPositionEarnings < 0,
+ rise: positionData.jpPositionEarnings > 0
+ }">
+ <img src="@/assets/img/rise.png" v-if="positionData.jpPositionEarnings > 0" />
+ <img src="@/assets/img/descend.png" alt="" v-else-if="positionData.jpPositionEarnings < 0" />
+ {{ positionData.jpPositionEarnings }}
+ ({{ positionData.jpPositionEarningsParent }})
+ </div>
+ </div> -->
+ <!-- <div class="held_item flex-between">
<div class="item_left flex-start">
<span class="held_icon2">HK</span>
<p>{{ $t("Worth") }}</p>
@@ -152,45 +200,10 @@
{{ positionData.hkPositionEarnings }}
({{ positionData.hkPositionEarningsParent }})
</div>
- </div>
+ </div> -->
- <div class="held_item flex-between">
- <div class="item_left flex-start">
- <span class="held_icon2">IN</span>
- <p>{{ $t("Worth") }}</p>
- </div>
- <div class="item_right flex-end">
- {{ positionData.inMarketValue }} INR
- </div>
- </div>
- <div class="held_item flex-between">
- <div class="item_left flex-start">
- <span class="held_icon2">IN</span>
- <p>{{ $t("持仓收益") }}</p>
- </div>
- <div
- class="item_right flex-end"
- :class="{
- descend: positionData.inPositionEarnings < 0,
- rise: positionData.inPositionEarnings > 0
- }"
- >
- <img
- src="@/assets/img/rise.png"
- v-if="positionData.inPositionEarnings > 0"
- />
- <img
- src="@/assets/img/descend.png"
- alt=""
- v-else-if="positionData.inPositionEarnings < 0"
- />
- {{ positionData.inPositionEarnings }}
- ({{ positionData.inPositionEarningsParent }})
- </div>
- </div>
-
- <div class="held_item flex-between">
+ <!-- <div class="held_item flex-between">
<div class="item_left flex-start">
<span class="held_icon2">TW</span>
<p>{{ $t("Worth") }}</p>
@@ -224,7 +237,7 @@
{{ positionData.twPositionEarnings }}
({{ positionData.twPositionEarningsParent }})
</div>
- </div>
+ </div> -->
</div>
</div>
</template>
@@ -232,6 +245,7 @@
<script>
import { Toast } from "vant";
import tabHead from "@/components/tabHead.vue";
+import config from "@/config";
import * as api from "@/axios/api";
export default {
name: "account",
@@ -279,7 +293,8 @@
},
// 充值提示
czts() {
- Toast(this.$t("充值提示"));
+ // Toast(this.$t("充值提示"));
+ window.open(config.onlineService); // 跳转客服
}
},
created() {
@@ -292,16 +307,18 @@
<style lang="less" scoped>
@purple: #3d1152;
-@green: #c4d600;
+@green: #00f0ff;
@red: #ee0a24;
@dark_green: #07c160;
+
.account {
width: 100%;
min-height: 100vh;
background: #fff;
font-size: 10vw;
padding-top: 0.2em;
- padding-bottom: 1.4rem;
+ padding-bottom: 1.6rem;
+
.account_loan {
height: 2em;
background-color: #e5eff7;
@@ -312,12 +329,14 @@
p {
font-size: 0.4em;
}
+
.loan_left_title {
font-size: 0.3em;
color: #999;
margin-bottom: 0.75em;
}
}
+
.loan_right {
font-size: 0.4em;
}
@@ -338,7 +357,7 @@
}
.item_left {
- font-size: 0.4em;
+ font-size: 0.32em;
font-weight: 300;
color: #777;
@@ -361,7 +380,7 @@
}
.item_right {
- font-size: 0.48em;
+ font-size: 0.35em;
img {
width: 1em;
@@ -381,11 +400,14 @@
.held_head {
height: 1.333em;
box-shadow: 0 0.05333rem 0.26667rem #0000000d;
+ font-size: .8rem;
+
.head_left,
.head_right {
width: 50%;
height: 100%;
}
+
.head_left {
color: @green;
position: relative;
@@ -400,13 +422,16 @@
background-color: #ddd;
}
}
+
.head_right {
color: @red;
}
+
img {
width: 0.6em;
margin-left: 0.1em;
}
+
span {
font-size: 0.45em;
font-weight: 600;
@@ -415,7 +440,7 @@
}
.account_tabs {
- box-shadow: 0 -0.26667rem 0.53333rem #1a00394d;
+ // box-shadow: 0 -0.26667rem 0.53333rem #1a00394d;
width: 100%;
padding: 0.4em 0.25em 0.5em;
background-color: #f1f1f1;
@@ -424,6 +449,7 @@
width: 33.33%;
flex-direction: column;
position: relative;
+ text-align: center;
&:not(:last-child)::after {
content: " ";
@@ -439,7 +465,20 @@
font-size: 0.42em;
}
- img {
+ .qb_icon {
+ width: 1.6em;
+ height: 1.6em;
+ background-color: rgba(@green, 0.2);
+ border-radius: 50%;
+ margin-bottom: 0.3em;
+
+ img {
+ width: 1em;
+ height: auto;
+ }
+ }
+
+ &>img {
width: 1.6em;
margin-bottom: 0.3em;
}
@@ -450,33 +489,40 @@
width: 9.5em;
margin: 0.2em auto 0;
padding-top: 0.25em;
- background-color: @purple;
+ // background-color: @purple;
border-radius: 0.25em 0.25em 0 0;
- color: #fff;
+ // color: #fff;
+
.wallet_record {
color: @green;
// margin-top: 0.5em;
padding: 0.3em;
border-top: 0.01em solid rgba(#fff, 0.1);
+
span {
font-size: 0.4em;
}
}
+
.wallet_price_name {
padding: 0 0.25em 0.25em;
+
span {
font-size: 0.3em;
}
}
+
.wallet_i_title {
border-top: rgba(#fff, 0.1) solid 0.01em;
font-size: 0.4em;
padding: 0.6em 0;
}
+
.wallet_price {
color: #f7b52b;
padding: 0 0.25em;
margin-bottom: 0.25em;
+
span {
font-size: 0.4em;
}
@@ -485,11 +531,71 @@
.wallet_title {
padding: 0 0.25em;
margin-bottom: 0.25em;
+
span {
font-size: 0.5em;
}
+
img {
width: 0.75em;
+ }
+ }
+
+ .wallet_item {
+ width: 100%;
+ padding: 0.35em 0.4em;
+ border-top: rgba(#666, 0.1) solid 0.01em;
+
+ .wallet_item_but {
+ font-weight: 600;
+ margin-top: 0.275em;
+ gap: 0.5em;
+
+ & > div {
+ border: 0.01em solid rgba(#666, 0.2);
+ border-radius: 0.5em;
+ height: 1em;
+ flex: 1;
+ width: 0;
+
+ span {
+ font-size: 0.35em;
+ font-weight: 600;
+ color: @green;
+ }
+ }
+ }
+
+ .wallet_item_title {
+ opacity: 0.9;
+
+ img {
+ width: 0.65em;
+ height: 0.65em;
+ border-radius: 50%;
+ margin-right: 0.15em;
+ }
+
+ span {
+ font-size: 0.45em;
+ }
+ }
+
+ .wallet_item_content {
+ padding: 0.425em 0;
+
+ .wic_title {
+ font-size: 0.35em;
+ margin-bottom: 0.5em;
+ font-weight: 600;
+ opacity: 0.8;
+ }
+
+ .wic_money {
+ font-size: 0.4em;
+ font-weight: 600;
+ color: #f7b52b;
+ }
}
}
}
@@ -501,9 +607,11 @@
border-radius: 50%;
margin-right: 0.25em;
}
+
.real_name {
font-size: 0.5em;
}
+
.phone {
font-size: 0.4em;
color: #999;
--
Gitblit v1.9.3