From 227ab6fb84ef98144962ec9b4103b367679c3fef Mon Sep 17 00:00:00 2001
From: zzzz <690498789@qq.com>
Date: Fri, 29 Mar 2024 16:01:04 +0800
Subject: [PATCH] 注册页面的客服地址错误
---
src/page/assetsCenter/index.vue | 521 ++++++++++++++++++++++++++++++++++++++++++++-------------
1 files changed, 397 insertions(+), 124 deletions(-)
diff --git a/src/page/assetsCenter/index.vue b/src/page/assetsCenter/index.vue
index 6bd43cd..ae3bbef 100644
--- a/src/page/assetsCenter/index.vue
+++ b/src/page/assetsCenter/index.vue
@@ -1,157 +1,430 @@
<template>
- <div class="pb-120 assetsCenter">
- <div class="flex justify-between px-52 pt-31 box-border">
- <div class="flex-1 items-center text-center textColor1" v-for="(item, index) in typeList " :key="'type' + index"
- @click="onTabs(index)">
- <div class="font-32 text-center lh-53">{{ item.type }}</div>
+ <div class="assets-box">
+ <header>
+ <van-row class="title-box">
+ <van-col span="12"><span class="title">Total Assets</span></van-col>
+ <van-col
+ span="12"
+ class="right"
+ @click="goRouter('/exchange/exchangeHistory')"
+ >
+ <img
+ :src="require('@/assets/image/assets-center/Subtract.png')"
+ class="w-44 h-38"
+ />
+ </van-col>
+ <div class="pt">Total Assets Valuation</div>
+ <div class="pt">0</div>
+ <div class="pt">≈ 0.00USD</div>
+ </van-row>
+
+ <van-row gutter="20" class="but-box">
+ <van-col span="8" v-for="item in tabList1" :key="item.id">
+ <div class="but">{{ item.text }}</div>
+ </van-col>
+ <!-- <van-col span="8"><div class="but">withdraw</div></van-col>
+ <van-col span="8"><div class="but">Exchange</div></van-col>
+ <van-col span="8"><div class="but">Management</div></van-col>
+ <van-col span="8"><div class="but">Mining Pool</div></van-col> -->
+ </van-row>
+ </header>
+ <div class="tabs">
+ <div class="tabs-box">
+ <div
+ v-for="item in tabList"
+ :key="item.id"
+ :class="`${active === item.id ? 'active-tabls' : ''}`"
+ @click="activeCheng(item)"
+ >
+ {{ item.text }}
+ </div>
+ </div>
+
+ <div class="tabs-content">
+ <div>Spot Total Assets</div>
+ <div class="tabs-name">0 USDT ≈ 0.00 $</div>
</div>
</div>
- <div class="flex mx-52 mt-17">
- <span class="flex-1 border-b-color " :class="{ active_color: tab === 0 }"></span>
- <span class="flex-1 border-b-color" :class="{ active_color: tab === 1 }"></span>
- <span class="flex-1 border-b-color" :class="{ active_color: tab === 2 }"></span>
- <span class="flex-1 border-b-color" :class="{ active_color: tab === 3 }"></span>
- </div>
- <over-view v-if="tab === 0" :funds="funds" :key="tab"></over-view>
- <as-sets v-if="tab === 1" :funds="funds" :key="tab"></as-sets>
- <contract v-if="tab === 2" :funds="funds" :index="index" :key="tab"></contract>
- <financial v-if="tab === 3" :funds="funds" :index="index" :key="tab"></financial>
+ <main>
+ <div class="item-box" v-for="(item, index) in funds" :key="index">
+ <div class="title-main">{{ item.symbol.toUpperCase() }}/USDT</div>
+ <van-row>
+ <van-col span="8">
+ <div class="title">{{ $t("可用") }}</div>
+ <div class="text">
+ {{
+ item.usable.toFixed(
+ item.symbol.toUpperCase() === "USDT" ? 2 : 8
+ ) || "0.0"
+ }}
+ </div>
+ </van-col>
+ <van-col span="8">
+ <div class="title">{{ $t("锁仓") }}</div>
+ <div class="text">
+ {{
+ item.lock_amount.toFixed(
+ item.symbol.toUpperCase() === "USDT" ? 2 : 8
+ ) || "0.0"
+ }}
+ </div>
+ </van-col>
+ <van-col span="8">
+ <div class="title">{{ $t("冻结") }}</div>
+ <div class="text">
+ {{
+ (item.frozenAmount + item.freeze_amount).toFixed(
+ item.symbol.toUpperCase() === "USDT" ? 2 : 8
+ ) || "0.0"
+ }}
+ </div>
+ </van-col>
+ </van-row>
+ </div>
+ </main>
</div>
</template>
<script>
+import { _getAllWallet } from "@/API/fund.api";
-import AsSets from "@/components/assetsCenter/assets"
-import OverView from "@/components/assetsCenter/overview"
-import Contract from "@/components/assetsCenter/contract"
-import Financial from "@/components/assetsCenter/financial"
-import Axios from "@/API/assets"
export default {
- name: "assets-index",
- components: {
- AsSets,
- OverView,
- Contract,
- Financial
- },
data() {
return {
- type: 'left', //left 从左往右 right 从有王座
- list: [],
- timer: null,
- tab: 0,
- index: 0, // 每个组件的二级tab
- funds: {},
- typeList: [
+ active: 1,
+ active1: 1,
+ tabList1: [
+ { id: 1, text: this.$t("充币") },
+ { id: 2, text: this.$t("提币") },
+ { id: 4, text: this.$t("闪兑") },
+ { id: 5, text: this.$t("Management") },
+ { id: 6, text: this.$t("Mining Pool") },
+ ],
+ tabList: [
+ { id: 1, text: this.$t("Spot") },
+ { id: 2, text: this.$t("Contract Delivery") },
+ { id: 4, text: this.$t("Contract Account") },
+ { id: 5, text: this.$t("Financial") },
+ ],
+ funds: [
{
- type: this.$t('总览'),
+ volume: 0,
+ symbol: "usdt",
+ usable: 0,
+ freeze_amount: 0,
+ name: "USDT/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
},
{
- type: this.$t('现货账户'),
+ volume: 0,
+ symbol: "knc",
+ usable: 0,
+ freeze_amount: 0,
+ name: "KNC/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
},
{
- type: this.$t('合约'),
-
+ volume: 0,
+ symbol: "vet",
+ usable: 0,
+ freeze_amount: 0,
+ name: "VET/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
},
{
- type: this.$t('理财'),
+ volume: 0,
+ symbol: "doge",
+ usable: 0,
+ freeze_amount: 0,
+ name: "DOGE/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
},
- ]
- }
- },
- methods: {
- onTabs(val) {
- if (this.tab < val) {
- this.type = 'right'
- } else {
- this.type = 'left'
- }
- console.log(val)
- this.tab = val
- },
- getAssets() {
- Axios.GetAllAssets().then((res) => {
- const { code, data } = res
- if (code) {
- //console.log('总资产数据',data)
- this.funds = data
- }
- })
- },
+ {
+ volume: 0,
+ symbol: "usdc",
+ usable: 0,
+ freeze_amount: 0,
+ name: "USDC/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "dai",
+ usable: 0,
+ freeze_amount: 0,
+ name: "DAI/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "wld",
+ usable: 0,
+ freeze_amount: 0,
+ name: "WLD/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "mln",
+ usable: 0,
+ freeze_amount: 0,
+ name: "MLN/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "qtum",
+ usable: 0,
+ freeze_amount: 0,
+ name: "QTUM/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "btc",
+ usable: 0,
+ freeze_amount: 0,
+ name: null,
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "yfii",
+ usable: 0,
+ freeze_amount: 0,
+ name: "YFII/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "etc",
+ usable: 0,
+ freeze_amount: 0,
+ name: "ETC/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "wdc",
+ usable: 0,
+ freeze_amount: 0,
+ name: "WDC/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "xrp",
+ usable: 0,
+ freeze_amount: 0,
+ name: "XRP/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "icp",
+ usable: 0,
+ freeze_amount: 0,
+ name: "ICP/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "eth",
+ usable: 0,
+ freeze_amount: 0,
+ name: "ETH/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "ltc",
+ usable: 0,
+ freeze_amount: 0,
+ name: "LTC/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "shib",
+ usable: 0,
+ freeze_amount: 0,
+ name: "SHIB/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "yfi",
+ usable: 0,
+ freeze_amount: 0,
+ name: "YFI/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "xtz",
+ usable: 0,
+ freeze_amount: 0,
+ name: "XTZ/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ {
+ volume: 0,
+ symbol: "ada",
+ usable: 0,
+ freeze_amount: 0,
+ name: "ADA/USDT",
+ usdt: 0,
+ lock_amount: 0,
+ frozenAmount: 0,
+ },
+ ],
+ tabListData: {},
+ };
},
created() {
- this.getAssets()
- this.timer = setInterval(() => {
- this.getAssets()
- }, 5000)
- if (Object.hasOwnProperty.call(this.$route.query, 'tab')) {
- this.tab = this.$route.query.tab / 1
- this.index = this.$route.query.index ? this.$route.query.index * 1 : 0
- }
+ // this.getAssets();
},
- activated() {
- clearInterval(this.timer)
- this.timer = setInterval(() => {
- this.getAssets()
- }, 5000)
- this.index = 0
+ methods: {
+ // 切换
+ activeCheng(item) {
+ this.active = item.id;
+ },
+ getAssets() {
+ _getAllWallet().then((res) => {
+ this.tabListData = {
+ usdt: res.usdt,
+ lock_money: res.lock_money,
+ };
+ let list = res.extends;
+ this.funds = list;
+ console.log(list);
+ });
+ },
+ goRouter(parmas) {
+ if (parmas === "/exchange/exchangeHistory") {
+ this.$router.push({ path: parmas, query: { type: 1 } });
+ } else {
+ this.$router.push(parmas);
+ }
+ },
},
- deactivated() {
- clearInterval(this.timer)
- this.timer = null
- },
- beforeDestroy() {
- clearInterval(this.timer)
- this.timer = null
- }
-}
+};
</script>
<style lang="scss" scoped>
-.assetsCenter {
- width: 100%;
- box-sizing: border-box;
-}
-
-.active_color {
- @include themify() {
- border-bottom: 5px solid themed("color_main") !important;
+.assets-box {
+ header {
+ padding: 100px 0 0px;
+ color: #817cf6;
+ .title-box {
+ padding: 0 70px;
+ }
+ .but-box {
+ padding: 30px;
+ }
+ .title {
+ font-weight: bold;
+ }
+ .pt {
+ margin-top: 15px;
+ }
+ .but {
+ box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.05);
+ line-height: 80px;
+ text-align: center;
+ margin-bottom: 30px;
+ }
}
-
- border-radius: 2.208px;
+ .right {
+ text-align: right;
+ }
}
-.left-enter-active,
-.left-leave-active,
-.right-enter-active,
-.right-leave-active {
- will-change: transform;
- transition: all 500ms;
+.tabs {
+ box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.05);
+ margin: 0 15px;
+ padding: 30px 30px;
+ .tabs-content {
+ margin-top: 40px;
+ color: #363636;
+ .tabs-name {
+ margin-left: 10px;
+ color: #dedbe2;
+ }
+ }
+ .tabs-box {
+ display: flex;
+ color: #dedbe2;
+ font-weight: 400;
+ flex: 1;
+ justify-content: space-between;
+
+ .active-tabls {
+ color: #807cf7;
+ font-weight: 900;
+ }
+ }
}
-.left-leave-active,
-.right-leave-active {
- display: none;
+main {
+ .item-box {
+ box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.05);
+ margin: 0 15px;
+ padding: 30px 30px;
+ margin-top: 40px;
+ .title-main {
+ color: #807cf7;
+ font-weight: 900;
+ margin-bottom: 20px;
+ }
+ .title {
+ color: #dedbe2;
+ margin-bottom: 10px;
+ }
+ .text {
+ font-weight: 900;
+ }
+ }
}
-
-.left-enter {
- opacity: 0;
- transform: translate3d(-100%, 0, 0);
-}
-
-.left-leave {
- opacity: 0;
- transform: translate3d(100%, 0, 0)
-}
-
-.right-enter {
- opacity: 0;
- transform: translate3d(100%, 0, 0);
-}
-
-.right-leave {
- opacity: 0;
- transform: translate3d(-100%, 0, 0)
-}
-</style>
+</style>
\ No newline at end of file
--
Gitblit v1.9.3