From 4d2ee4be461972f828b71fd7753f472297c44fb6 Mon Sep 17 00:00:00 2001
From: jhzh <1628036192@qq.com>
Date: Tue, 01 Apr 2025 17:36:01 +0800
Subject: [PATCH] 1
---
src/page/assetsCenter/index.vue | 498 +++++++++++++++++++++++++++++++++++--------------
src/request/http.js | 5
src/components/assetsCenter/overview.vue | 25 +
src/page/transfer.vue | 2
src/API/assets.js | 10
src/components/assetsCenter/assets.vue | 30 ---
6 files changed, 384 insertions(+), 186 deletions(-)
diff --git a/src/API/assets.js b/src/API/assets.js
index 9a4dc38..2ba3f66 100644
--- a/src/API/assets.js
+++ b/src/API/assets.js
@@ -16,5 +16,13 @@
isLoading: false
}, params)
};
+const GetWalletzj = () => {
+ return httpJson({
+ url: "api/walletGrther!get.action",
+ method: "get",
+ isLoading: false
+ })
+};
-export default { GetAllAssets, GetWallet }
+
+export default { GetAllAssets, GetWallet , GetWalletzj }
diff --git a/src/components/assetsCenter/assets.vue b/src/components/assetsCenter/assets.vue
index 5447886..2e1ee2f 100644
--- a/src/components/assetsCenter/assets.vue
+++ b/src/components/assetsCenter/assets.vue
@@ -53,38 +53,9 @@
style="margin-bottom: 0;border-bottom: #f1f1f1 2px solid;padding: 10px" :key="index">
<div class="flex justify-between">
<div class="flex items-center">
- <!-- <img :src="item.symbol-->
- <!-- ? `${HOST_URL}/symbol/${item.symbol}.png`-->
- <!-- : require('@/assets/loading-default.png')-->
- <!-- " class="w-72 h-72 rounded-full" />-->
<div class="symbol-name " style="color: rgb(25, 118, 210,0.8);font-size:18px;font-weight: bold">
{{ item.symbol.toUpperCase() }}
- <!-- /USDT-->
</div>
- </div>
- <div class="flex-col font-30 text-right" v-if="!eyetel">
- <!-- <div class="textColor" v-if="item.symbol == 'btc'">-->
- <!-- {{ item.volume.toFixed(8) || '0.0' }}-->
- <!-- </div>-->
- <!-- <div class="textColor" v-else-if="item.symbol == 'eth'">-->
- <!-- {{ item.volume.toFixed(8) || '0.0' }}-->
- <!-- </div>-->
- <!-- <div class="textColor" v-else-if="item.symbol == 'usdt'">-->
- <!-- {{ item.volume.toFixed(2) || '0.0' }}-->
- <!-- </div>-->
- <!-- <div class="textColor" v-else>-->
- <!-- {{ item.volume.toFixed(8) || '0.0' }}-->
- <!-- </div>-->
- <!-- <div class="text-grey font-30 font-400 mb-0">-->
- <!-- ≈{{ currency.currency_symbol }}-->
- <!-- {{ item.usdt ? item.usdt.toFixed(2) : '0.0' }}-->
- <!-- </div>-->
- </div>
- <div class="flex-col font-30 text-right" v-else>
- <!-- <div class="textColor">******** USDT</div>-->
- <!-- <div class="text-grey">-->
- <!-- ≈{{ currency.currency_symbol }} ********-->
- <!-- </div>-->
</div>
</div>
<div class="flex justify-between mt-40" style="margin: 15px 10px 0 10px;font-weight: normal">
@@ -213,7 +184,6 @@
compare(p, type) {
//这是比较函数
return function (m, n) {
- console.log(m);
var a = m[p];
var b = n[p];
if (a == b) {
diff --git a/src/components/assetsCenter/overview.vue b/src/components/assetsCenter/overview.vue
index 1d6c427..d7c0a39 100644
--- a/src/components/assetsCenter/overview.vue
+++ b/src/components/assetsCenter/overview.vue
@@ -25,18 +25,28 @@
<div class="font-70 font-66 mt-18 textColor" v-else>********</div>
</div>
<div class="pl-33 pr-33 btn-box flex justify-between" style="border-bottom: #f0f0f0 1px solid;padding: 12px 10px;margin-top: 0">
- <div class="font-25 button" @click="goRouter('/recharge/rechargeList')">
+ <!-- <div class="font-25 button" @click="goRouter('/recharge/rechargeList')">
<div class="word-wrap">
-<!-- <img :src="require(`@/assets/theme/${theme}/image/assets/up.png`)" alt="">-->
<span> {{ $t('充币') }}</span>
</div>
</div>
<div class="ont-25 button" @click="withdrawBtn">
<div class="word-wrap">
-<!-- <img :src="require(`@/assets/theme/${theme}/image/assets/down.png`)" alt="">-->
<span>{{ $t('提币') }}</span>
</div>
- </div>
+ </div> -->
+ <div class="font-25 button" @click="goRouter('/financialHistory?type=0')">
+ <div class="word-wrap">
+ <!-- <img :src="require(`@/assets/theme/${theme}/image/assets/l_r.png`)" alt="">-->
+ <span>{{ $t('货币理财') }}</span>
+ </div>
+ </div>
+ <div class="font-25 button" @click="goRouter('/financialHistory?type=1')">
+ <div class="word-wrap">
+ <!-- <img :src="require(`@/assets/theme/${theme}/image/assets/l_r.png`)" alt="">-->
+ <span>{{ $t('矿池理财') }}</span>
+ </div>
+ </div>
<div class="font-25 button" @click="goRouter('/exchange/exchangePage')">
<div class="word-wrap">
<!-- <img :src="require(`@/assets/theme/${theme}/image/assets/l_r.png`)" alt="">-->
@@ -44,26 +54,23 @@
</div>
</div>
</div>
- <div class="pl-33 pr-33 btn-box flex justify-between" style="border-bottom: #f0f0f0 1px solid;padding: 12px 10px;margin-top: 0">
+ <!-- <div class="pl-33 pr-33 btn-box flex justify-between" style="border-bottom: #f0f0f0 1px solid;padding: 12px 10px;margin-top: 0">
<div class="font-25 button" @click="goRouter('/financialHistory?type=0')">
<div class="word-wrap">
- <!-- <img :src="require(`@/assets/theme/${theme}/image/assets/l_r.png`)" alt="">-->
<span>{{ $t('货币理财') }}</span>
</div>
</div>
<div class="font-25 button" @click="goRouter('/financialHistory?type=1')">
<div class="word-wrap">
- <!-- <img :src="require(`@/assets/theme/${theme}/image/assets/l_r.png`)" alt="">-->
<span>{{ $t('矿池理财') }}</span>
</div>
</div>
<div class="font-25 button" @click="goRouter('/transfer')">
<div class="word-wrap">
- <!-- <img :src="require(`@/assets/theme/${theme}/image/assets/l_r.png`)" alt="">-->
<span>{{ $t('划转') }}</span>
</div>
</div>
- </div>
+ </div> -->
<!-- <div class="divider-line"></div>-->
<div style="border-bottom: #f1f1f1 1px solid">
<!-- <div class="assets-content-title font-35 titleColor">{{ $t('投资组合') }}</div>-->
diff --git a/src/page/assetsCenter/index.vue b/src/page/assetsCenter/index.vue
index 1f16446..97088b0 100644
--- a/src/page/assetsCenter/index.vue
+++ b/src/page/assetsCenter/index.vue
@@ -1,157 +1,375 @@
<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>-->
-<!-- </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 :funds="funds" ></over-view>
- <as-sets :funds="funds" ></as-sets>
-<!-- <contract :funds="funds" :index="index"></contract>-->
-<!-- <financial :funds="funds" :index="index" ></financial>-->
+ <div class="pb-120 assetsCenter">
+ <div class="flex justify-between px-52 pt-31 pb-31 box-border">
+ <div class="flex items-center text-center textColor1" style="flex-direction: column;width: 50%;"
+ v-for="(item, index) in typeList " :key="'type' + index" @click="onTabs(index)">
+ <div class="font-32 text-center lh-53">{{ item.type }}</div>
+ <div v-if="index == tab"
+ style="width: 20px;background-color: #1976D2;height: 4px;display: flex;justify-content: center;align-items: center;">
+ </div>
+ </div>
+ </div>
+ <div v-if="tab==0">
+ <over-view :funds="funds"></over-view>
+ <as-sets :funds="funds"></as-sets>
+ </div>
+ <div v-if="tab==1">
+ <div class="" style="background:rgb(25, 118, 210);padding: 15px">
+ <div class="flex justify-between text-white relative">
+ <div class="flex">
+ <span class="text-white font-40">{{ $t('总资产') }}</span>
+ <div @click.stop="changeEyes">
+ <img :src="require('../../assets/image/assets-center/eye-open1.png')" style="height: 26px"
+ v-show="!eyetel" />
+ <img :src="require('../../assets/image/assets-center/eye-close1.png')" style="height: 26px"
+ v-show="eyetel" />
+ </div>
+ </div>
+ <div class="right-clock" @click="goRouter('/exchange/exchangeHistory')">
+ <img :src="require('../../assets/image/assets-center/Subtract.png')" class="w-44 h-38" />
+ </div>
+ </div>
+ <div style="margin-top: 10px;color: white">
+ {{$t("总资产估值")}}
+ </div>
+ <div class="font-700 font-50 mt-18 text-white" v-if="!eyetel">
+ {{ fundsdata.totalMoney}}
+ </div>
- </div>
+ <div class="font-70 font-66 mt-18 textColor" v-else>********</div>
+ </div>
+ <div class="pl-33 pr-33 btn-box flex justify-between"
+ style="border-bottom: #f0f0f0 1px solid;padding: 12px 10px;margin-top: 0">
+ <div class="font-25 button" @click="goRouter('/recharge/rechargeList')">
+ <div class="word-wrap">
+ <!-- <img :src="require(`@/assets/theme/${theme}/image/assets/up.png`)" alt="">-->
+ <span> {{ $t('充币') }}</span>
+ </div>
+ </div>
+ <div class="ont-25 button" @click="goRouter('/withdraw/withdrawPage')">
+ <div class="word-wrap">
+ <!-- <img :src="require(`@/assets/theme/${theme}/image/assets/down.png`)" alt="">-->
+ <span>{{ $t('提币') }}</span>
+ </div>
+ </div>
+ <div class="font-25 button" @click="goRouter('/transfer')">
+ <div class="word-wrap">
+ <!-- <img :src="require(`@/assets/theme/${theme}/image/assets/l_r.png`)" alt="">-->
+ <span>{{ $t('划转') }}</span>
+ </div>
+ </div>
+ </div>
+ <div
+ style="display: flex;margin-bottom: 0px;flex-direction: column;border-bottom: 2px solid rgb(241, 241, 241); padding: 10px;">
+ <div style="margin: 20px;color: rgba(25, 118, 210, 0.8);font-size: 18px;font-weight: bold;">USDT</div>
+ <div style="display: flex;justify-content: space-between;margin: 0 20px 20px 20px;">
+ <div style="display: flex;justify-content: space-between;flex-direction: column;">
+ <div class="text-grey" style="font-weight: normal">{{ $t('可用') }}</div>
+ <div class="textColor" style="font-weight: normal;font-size: 16px;color: #999999">
+ {{fundsdata.usdtMoney}}
+ </div>
+ </div>
+ <div style="display: flex;justify-content: space-between;flex-direction: column;">
+ <div class="text-grey" style="font-weight: normal">{{ $t('锁仓') }}</div>
+ <div class="textColor" style="font-weight: normal;font-size: 16px;color: #999999">
+ 0.00
+ </div>
+ </div>
+ <div style="display: flex;justify-content: space-between;flex-direction: column;">
+ <div class="text-grey" style="font-weight: normal">{{ $t('冻结') }}</div>
+ <div class="textColor" style="font-weight: normal;font-size: 16px;color: #999999">
+ 0.00
+ </div>
+ </div>
+ </div>
+ </div>
+ <div
+ style="display: flex;margin-bottom: 0px;flex-direction: column;border-bottom: 2px solid rgb(241, 241, 241); padding: 10px;">
+ <div style="margin: 20px;color: rgba(25, 118, 210, 0.8);font-size: 18px;font-weight: bold;">ETH</div>
+ <div style="display: flex;justify-content: space-between;margin: 0 20px 20px 20px;">
+ <div style="display: flex;justify-content: space-between;flex-direction: column;">
+ <div class="text-grey" style="font-weight: normal">{{ $t('可用') }}</div>
+ <div class="textColor" style="font-weight: normal;font-size: 16px;color: #999999">
+ {{fundsdata.ethMoney}}
+ </div>
+ </div>
+ <div style="display: flex;justify-content: space-between;flex-direction: column;">
+ <div class="text-grey" style="font-weight: normal">{{ $t('锁仓') }}</div>
+ <div class="textColor" style="font-weight: normal;font-size: 16px;color: #999999">
+ 0.00
+ </div>
+ </div>
+ <div style="display: flex;justify-content: space-between;flex-direction: column;">
+ <div class="text-grey" style="font-weight: normal">{{ $t('冻结') }}</div>
+ <div class="textColor" style="font-weight: normal;font-size: 16px;color: #999999">
+ 0.00
+ </div>
+ </div>
+ </div>
+ </div>
+ <div
+ style="display: flex;margin-bottom: 0px;flex-direction: column;border-bottom: 2px solid rgb(241, 241, 241); padding: 10px;">
+ <div style="margin: 20px;color: rgba(25, 118, 210, 0.8);font-size: 18px;font-weight: bold;">BTC</div>
+ <div style="display: flex;justify-content: space-between;margin: 0 20px 20px 20px;">
+ <div style="display: flex;justify-content: space-between;flex-direction: column;">
+ <div class="text-grey" style="font-weight: normal">{{ $t('可用') }}</div>
+ <div class="textColor" style="font-weight: normal;font-size: 16px;color: #999999">
+ {{fundsdata.btcMoney}}
+ </div>
+ </div>
+ <div style="display: flex;justify-content: space-between;flex-direction: column;">
+ <div class="text-grey" style="font-weight: normal">{{ $t('锁仓') }}</div>
+ <div class="textColor" style="font-weight: normal;font-size: 16px;color: #999999">
+ 0.00
+ </div>
+ </div>
+ <div style="display: flex;justify-content: space-between;flex-direction: column;">
+ <div class="text-grey" style="font-weight: normal">{{ $t('冻结') }}</div>
+ <div class="textColor" style="font-weight: normal;font-size: 16px;color: #999999">
+ 0.00
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+
+
+ </div>
</template>
<script>
+ 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: [],
+ eyetel: false,
+ timer: null,
+ zjlist: [],
+ tab: 1,
+ index: 0, // 每个组件的二级tab
+ funds: {},
+ fundsdata: {},
+ typeList: [{
+ type: this.$t('交易账户'),
+ },
+ {
+ type: this.$t('资金账户'),
+ },
+ ]
+ }
+ },
+ methods: {
+ goRouter(parmas) {
+ if (parmas === '/exchange/exchangeHistory') {
+ this.$router.push({ path: parmas, query: { type: 0 } })
+ } else {
+ this.$router.push(parmas);
+ }
+ },
+ changeEyes() {
+ this.eyetel = !this.eyetel;
+ },
+ onTabs(val) {
+ console.log('111',val);
+ this.tab = val
+ },
+ getAssetszj() {
+ Axios.GetWalletzj().then((res) => {
+ this.fundsdata = res.data
+ })
-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: [
- {
- type: this.$t('总览'),
- },
- {
- type: this.$t('现货账户'),
- },
- {
- type: this.$t('合约'),
-
- },
- {
- type: this.$t('理财'),
- },
- ]
- }
- },
- 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
- }
- })
- },
- },
- 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
- }
- },
- activated() {
- clearInterval(this.timer)
- this.timer = setInterval(() => {
- this.getAssets()
- }, 5000)
- this.index = 0
- },
- deactivated() {
- clearInterval(this.timer)
- this.timer = null
- },
- beforeDestroy() {
- clearInterval(this.timer)
- this.timer = null
- }
-}
+ },
+ getAssets() {
+ Axios.GetAllAssets().then((res) => {
+ const {
+ code,
+ data
+ } = res
+ if (code) {
+ //console.log('总资产数据',data)
+ this.funds = data
+ }
+ })
+ },
+ },
+ created() {
+ this.getAssets()
+ this.getAssetszj()
+ 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
+ }
+ },
+ activated() {
+ clearInterval(this.timer)
+ this.timer = setInterval(() => {
+ this.getAssets()
+ }, 5000)
+ this.index = 0
+ },
+ 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;
-}
+ .tabBackground {
+ background: white;
+ }
-.active_color {
- @include themify() {
- border-bottom: 5px solid themed("color_main") !important;
- }
+ .button {
+ border: 1px solid rgb(25, 118, 210);
+ background: white !important;
+ border-radius: 3px;
+ height: 60px;
+ color: rgb(25, 118, 210) !important;
+ }
- border-radius: 2.208px;
-}
+ .right-clock {
+ position: absolute;
+ top: 0;
+ right: -3px;
+ }
-.left-enter-active,
-.left-leave-active,
-.right-enter-active,
-.right-leave-active {
- will-change: transform;
- transition: all 500ms;
-}
+ .total_wrap {
+ margin-top: 44px;
+ }
-.left-leave-active,
-.right-leave-active {
- display: none;
-}
+ .asset-title-box {
+ margin: 40px 0;
+ }
-.left-enter {
- opacity: 0;
- transform: translate3d(-100%, 0, 0);
-}
+ .btn-box {
+ margin-top: 44px;
+ }
-.left-leave {
- opacity: 0;
- transform: translate3d(100%, 0, 0)
-}
+ .btn-box>div {
+ width: 234px;
+ padding: 20px 15px;
+ box-sizing: border-box;
+ text-align: center;
+ border-radius: 8.8px;
+ font-size: 26.5px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
-.right-enter {
- opacity: 0;
- transform: translate3d(100%, 0, 0);
-}
+ .word-wrap {
+ display: flex;
+ align-items: center;
+ justify-content: center;
-.right-leave {
- opacity: 0;
- transform: translate3d(-100%, 0, 0)
-}
-</style>
+ img {
+ width: 40px;
+ height: 40px;
+ margin-right: 22px;
+ }
+
+ span {
+ font-size: 26.5px;
+ }
+ }
+ }
+
+ .mr60 {
+ margin-right: 60px;
+ }
+
+ .divider-line {
+ border-bottom: 1px solid #E5E7ED;
+ padding-bottom: 80px;
+ }
+
+ .assets-content-title {
+ margin-top: 60px;
+ margin-bottom: 55px;
+ }
+
+ .assets-list {
+ margin-bottom: 35px;
+ }
+
+ .assets-list>div {
+ display: flex;
+ }
+
+ .assets-list>div:nth-child(2) div:nth-child(1) {
+ margin-bottom: 16px;
+ font-size: 30px;
+ font-weight: 700;
+ }
+
+ .symbol-name {
+ margin-left: 17px;
+ //margin-top:10px;
+ }
+
+ .assetsCenter {
+ width: 100%;
+ box-sizing: border-box;
+ }
+
+ .active_color {
+ @include themify() {
+ border-bottom: 5px solid themed("color_main") !important;
+ }
+
+ border-radius: 2.208px;
+ }
+
+ .left-enter-active,
+ .left-leave-active,
+ .right-enter-active,
+ .right-leave-active {
+ will-change: transform;
+ transition: all 500ms;
+ }
+
+ .left-leave-active,
+ .right-leave-active {
+ display: none;
+ }
+
+ .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>
\ No newline at end of file
diff --git a/src/page/transfer.vue b/src/page/transfer.vue
index aace8ec..27ed46c 100644
--- a/src/page/transfer.vue
+++ b/src/page/transfer.vue
@@ -81,7 +81,7 @@
fromTo:1,
typeindex:0,
amount:'',
- bzlist:['USDT','BTC','ETH','USDC'],
+ bzlist:['USDT','BTC','ETH'],
usdcMoney:'',
toptitle:this.$t('资金')+this.$t('账户'),
buttitle:this.$t('交易')+this.$t('账户'),
diff --git a/src/request/http.js b/src/request/http.js
index 8a4aa2e..9dd581a 100644
--- a/src/request/http.js
+++ b/src/request/http.js
@@ -89,11 +89,6 @@
const createAxios = (axiosType, { url, method, isLoading }, params) => {
const axios = axiosType(isLoading);
if (method.toLocaleLowerCase() === "get") {
- // var token;
- // if(local.get('token')){
- // token=local.get('token')
- // console.log('token',token)
- // }
return axios.request({
url,
params: params ? params : {},
--
Gitblit v1.9.3