You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
576 lines
17 KiB
576 lines
17 KiB
<template>
|
|
<v-page>
|
|
<v-header :title="$t('base.d2')" :left-arrow="false"></v-header>
|
|
<!-- <view style="height: var(--status-bar-height)"></view> -->
|
|
<view
|
|
class="box-size head bg-panel-3 h-aut m-x-md d-flex justify-between flex-wrap align-center rounded-ms color-light"
|
|
:class="theme == 'light' ? 'bgb3-white' : ''" style="position: relative">
|
|
<view class="d-flex p-t-md w-max">
|
|
<text class="fn-16 color-default d-block">{{ $t("base.d6") }}(BTC)</text>
|
|
<view class="fn-18 m-l-md d-flex" @click="setHide(!hideMoney)">
|
|
<van-icon v-if="!hideMoney" name="eye-o" />
|
|
<van-icon v-else name="closed-eye" />
|
|
</view>
|
|
</view>
|
|
<view class="m-t-md d-flex flex-wrap justify-center w-max">
|
|
<text class="fn-28 w-max">{{ filterMoney(account.total_assets_btc,true) }}</text>
|
|
<text class="fn-sm w-max" style="color: #6FB58A;">
|
|
<!-- ≈{{ filterMoney(account.total_assets_usd) }} USD -->
|
|
≈{{ filterMoney(account.total_assets_usd,false) }} USDT
|
|
</text>
|
|
</view>
|
|
|
|
<!-- <view class="m-t-ms p-b-ms w-max" style="display: flex;justify-content: space-between;">
|
|
<v-link tag="view" to="/pages/assets/recharge" v-if="user_auth_level==1" @click="getAuthInfo"
|
|
class="manage_text">
|
|
<img src="@/assets/img/home/Make.png" alt="" class="h-25" />
|
|
<view class="color-light fn-middle fn-ms">{{$t("base.b5")}}</view>
|
|
</v-link>
|
|
<v-link tag="view" to="/pages/auth/primary" v-if="user_auth_level==0" @click="getAuthInfo"
|
|
class="manage_text">
|
|
<img src="@/assets/img/home/Make.png" alt="" class="h-25" />
|
|
<view class="color-light fn-middle fn-ms">{{$t("base.b5")}}</view>
|
|
</v-link>
|
|
<v-link tag="view" to="/pages/assets/draw" class="manage_text">
|
|
<img src="@/assets/img/home/currency.png" alt="" class="h-25" />
|
|
<view class="color-light fn-ms">{{$t("base.b6")}}</view>
|
|
</v-link>
|
|
<v-link tag="view" to="/pages/transfer/index" class="manage_text">
|
|
<img src="@/assets/img/home/transfer.png" alt="" class="h-25" />
|
|
<view class="color-light fn-ms">{{$t("base.d8")}}</view>
|
|
</v-link>
|
|
<v-link tag="view" :to="{path: '/pages/exchange/his',query: { symbol: symbol }}" class="manage_text">
|
|
<img src="@/assets/img/home/check.png" alt="" class="h-25" />
|
|
<view class="color-light fn-ms">{{$t("base.h1")}}</view>
|
|
</v-link>
|
|
</view> -->
|
|
|
|
<view class="m-t-ms p-b-ms w-max " style="margin-top: 10px">
|
|
<view class="d-flex justify-between align-center rounded-lg">
|
|
<v-link tag="view"
|
|
:to="ProfileDetail.primary_status!=1?'/pages/auth/index':'/pages/assets/recharge'"
|
|
class="d-flex bg-form-panel-3 align-center p-y-xxs rounded-xs w-33 justify-center">
|
|
<view class="m-r-xs d-flex align-center">
|
|
<img src="static/img/13.png" alt="" class="h-25" />
|
|
</view>
|
|
<text class="color-light fn-middle fn-ms">{{
|
|
$t("base.b5")
|
|
}}</text>
|
|
</v-link>
|
|
<v-link tag="view"
|
|
:to="ProfileDetail.status==1?'/pages/auth/index':(ProfileDetail.status==2?'/pages/assets/draw':'/pages/auth/senior')"
|
|
class="d-flex bg-form-panel-3 align-center p-y-xxs rounded-xs w-33 justify-center">
|
|
<view class="m-r-xs d-flex align-center">
|
|
<img src="static/img/5.png" alt="" class="h-25" />
|
|
</view>
|
|
<text class="color-light fn-ms">{{
|
|
$t("base.b6")
|
|
}}</text>
|
|
</v-link>
|
|
<v-link tag="view" to="/pages/transfer/index"
|
|
class="d-flex bg-form-panel-3 align-center p-y-xxs rounded-xs w-33 justify-center">
|
|
<view class="m-r-xs d-flex align-center">
|
|
<img src="static/img/hua.png" alt="" class="h-25" />
|
|
</view>
|
|
<text class="color-light fn-ms">{{
|
|
$t("base.d8")
|
|
}}</text>
|
|
</v-link>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="layout-main">
|
|
<scroll-view @refresherrefresh="onRefresh" :refresher-enabled="refresherEnabled&&scrollTop<50"
|
|
:refresher-triggered="refreshing" refresher-background="transparent" :refresher-threshold="50">
|
|
<!-- 头部 -->
|
|
<!-- <view class="tab m-x-md m-t-md rounded-ms d-flex justify-between bgb3 p-xs"
|
|
:class="theme == 'light' ? 'bgb3-white' : ''">
|
|
<view class="w-33 fn-center p-y-xxs"
|
|
:class="tabActive==0?'color-theme-1 bg-panel-3 rounded-xs shadow-panel-nei':''"
|
|
@click="tabActive=0">
|
|
{{$t('base.d7')}}
|
|
</view>
|
|
<view class="w-33 fn-center p-y-xxs m-l-xs"
|
|
:class="tabActive==1?'color-theme-1 bg-panel-3 rounded-xs shadow-panel-nei':''"
|
|
@click="tabActive=1">
|
|
{{$t('base.e4')}}
|
|
</view> -->
|
|
<!-- <view class="w-33 fn-center p-y-xxs m-l-xs" :class="tabActive==2?'color-theme-1 bg-panel-3 rounded-xs shadow-panel-nei':''"
|
|
@click="tabActive=2">
|
|
{{$t('otc.d5')}}
|
|
</view> -->
|
|
<!-- </view> -->
|
|
<view class="" style="display: flex;margin-top: 10px;">
|
|
<view class="w-33A fn-center p-y-xxs"
|
|
:class="tabActive==0?'rounded-xs col-fff':''"
|
|
@click="tabActive=0">
|
|
{{$t('base.d7')}}
|
|
</view>
|
|
<view class="w-33A fn-center p-y-xxs"
|
|
:class="tabActive==1?'rounded-xs col-fff':''"
|
|
@click="tabActive=1">
|
|
{{$t('base.e4')}}
|
|
</view>
|
|
</view>
|
|
|
|
<view class="top">
|
|
<!-- <van-tabs
|
|
:active="tabActive"
|
|
@change="changtTab"
|
|
:border="false"
|
|
v-if="show"
|
|
:line-width="30"
|
|
swipeable
|
|
animated
|
|
class="tabs-main d-flex justify-between align-center flex-col"
|
|
>
|
|
<van-tab :title="$t('base.d7')" :name="0"> -->
|
|
<view class="box-shadow p-t-ms wallet m-y-md" v-if="tabActive==0">
|
|
<view class="m-x-md m-b-xs m-t-sm">
|
|
<!--bgb3 :class="theme == 'light' ? 'bgb3-white' : ''" -->
|
|
<view class="p-xs p-x-md rounded-ms bg-form-panel-3"
|
|
style="position: relative;">
|
|
<text class="fn-20 d-block color-light m-t-xs">
|
|
<!-- ≈{{ filterMoney(account.funds_account_usd) }} -->
|
|
≈{{ (account.funds_account_usd).toFixed(2) }}
|
|
</text>
|
|
<text class="fn-sm d-block color-gray-6 m-t-xs">{{ $t("base.d6") }}(USDT)</text>
|
|
|
|
<!-- <text class="fn-20 d-block color-light m-t-md"
|
|
>{{ filterMoney(account.funds_account_btc) }} BTC</text
|
|
> -->
|
|
<!-- fn-sm d-block m-t-xs color-gray-6 -->
|
|
|
|
</view>
|
|
</view>
|
|
|
|
<view class="h-30 p-x-xs d-flex justify-between align-center">
|
|
<van-field :value="searchText" @input="searchText = $event.detail" left-icon="search"
|
|
:placeholder="$t('base.d9')" input-class="fn-12 "
|
|
class="flex-fill color-gray-6 rounded-md pos fn-12 m-r-lg" style="padding-left: 0" />
|
|
<van-checkbox :value="hide" @change="hide = !hide" icon-size="16">
|
|
<text class="color-gray-6 m-r-xs">{{ $t("base.e0") }} 0 {{ $t("base.e1") }}</text>
|
|
</van-checkbox>
|
|
</view>
|
|
<view class="title_Currency">
|
|
<view style="width: 190rpx;text-align: center;">{{ $t("base.h2") }}</view>
|
|
<view class="text_width text_align">{{ $t("base.b9") }}</view>
|
|
<view class="text_width text_align">{{ $t("base.e2") }}</view>
|
|
<view class="text_align">{{ $t("base.e3") }}(USD)</view>
|
|
</view>
|
|
<router-link :to="{
|
|
path: '/pages/assets/bill',
|
|
query: { coin_name: item.coin_name },
|
|
}" v-show="ifShow(item)" class="p-t-xs d-block rounded-md text-none" v-for="(item, index) in list"
|
|
:key="index">
|
|
<!-- <view class="m-x-md d-flex justify-between align-center p-b-xs">
|
|
<view>
|
|
<img :src="item.image" class="w-20 h-20 rounded-max fn-middle" />
|
|
<text class="fn-18 fn-bold color-light fn-middle p-l-sm">{{
|
|
item.coin_name
|
|
}}</text>
|
|
</view>
|
|
<view>
|
|
<text class="fn-lg color-light fn-middle">{{
|
|
add(
|
|
item.usable_balance,
|
|
item.freeze_balance,
|
|
item.priceDecimals
|
|
)
|
|
}}</text>
|
|
<van-icon
|
|
class="p-l-xs fn-middle"
|
|
name="arrow"
|
|
size="16"
|
|
color="#646566"
|
|
/>
|
|
</view>
|
|
</view> -->
|
|
<!-- <view class="p-x-md d-flex justify-between align-center">
|
|
<view class="w-4/12">
|
|
<p class="color-gray-6" style="padding: 5px 0">
|
|
{{ $t("base.b9") }}
|
|
</p>
|
|
<p class="fn-lg color-light overflow-scroll">{{ (item.usable_balance).toFixed(2) }}
|
|
</p>
|
|
</view>
|
|
<view class="w-4/12 fn-center">
|
|
<p class="color-gray-6" style="padding: 5px 0">
|
|
{{ $t("base.e2") }}
|
|
</p>
|
|
<p class="fn-lg color-light overflow-scroll">{{ item.freeze_balance }}</p>
|
|
</view>
|
|
<view class="w-4/12 fn-right">
|
|
<p class="color-gray-6" style="padding: 5px 0">
|
|
{{ $t("base.e3") }}(USD)
|
|
</p>
|
|
<p class="fn-lg color-light overflow-scroll">
|
|
{{ omitTo(item.usd_estimate, item.priceDecimals) | priceDecimals}}
|
|
</p>
|
|
</view>
|
|
</view> -->
|
|
<view class="Currency_content">
|
|
<view style="width: 200rpx;" class="m-title">
|
|
<img :src="item.image" class="w-20 h-20 rounded-max fn-middle"/>
|
|
<text class="fn-18 fn-bold color-light fn-middle p-l-sm">{{item.coin_name}}
|
|
</text>
|
|
</view>
|
|
<view class="text_width text_align m-title" style="color:#000">
|
|
{{ (item.usable_balance).toFixed(2) }}
|
|
</view>
|
|
<view class="text_width text_align m-title" style="color:#000">
|
|
{{ item.freeze_balance }}
|
|
</view>
|
|
<view class="text_width text_align m-title" style="color:#000">
|
|
{{ omitTo(item.usd_estimate, item.priceDecimals) | priceDecimals}}
|
|
</view>
|
|
</view>
|
|
<view class="h-4 m-t-xs"></view>
|
|
</router-link>
|
|
<van-empty class="bg-panel-3" v-if="filteredList.length === 0" :description="$t('contract.d0')"/>
|
|
</view>
|
|
<!-- </van-tab>
|
|
|
|
<van-tab :title="$t('base.e4')" :name="1" class="p-t-md"> -->
|
|
<view class="m-x-md" v-if="tabActive==1">
|
|
<view class="bgb3 p-x-md p-y-xs m-y-xs rounded-ms" :class="theme == 'light' ? 'bgb3-white' : ''"
|
|
style="position: relative">
|
|
<view class="fn-sm d-flex justify-between color-gray-6 m-t-xs">
|
|
<span> USDT </span>
|
|
<v-link class="color-buy" to="/pages/assets/account-bill">{{ $t("base.e4") }}
|
|
<van-icon class="fn-middle" name="arrow" size="16" /></v-link>
|
|
</view>
|
|
<span class="fn-20 d-block color-light m-t-md">{{ filterMoney(account.contract_account_usd)
|
|
}}{{ account.symbol }}</span>
|
|
<view class="d-flex justify-between m-t-xs">
|
|
<v-link to="/pages/transfer/index" class="d-flex">
|
|
<view class="m-r-xs align-center">
|
|
<img :src="$localImgUrl('fill4.png')" alt="" class="h-18" />
|
|
</view>
|
|
<!-- <van-icon class="color-theme-1 fn-26 fn-middle m-r-xs" name="exchange" /> -->
|
|
<text class="color-light fn-middle">{{
|
|
$t("base.d8")
|
|
}}</text>
|
|
</v-link>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="m-x-md" v-if="tabActive==2">
|
|
<view class="bgb3 p-x-md p-y-xs m-y-xs rounded-ms" :class="theme == 'light' ? 'bgb3-white' : ''"
|
|
style="position: relative">
|
|
<view class="fn-sm d-flex justify-between color-gray-6 m-t-xs">
|
|
<span> USDT </span>
|
|
<v-link class="color-buy" to="/pages/assets/currency-bill">{{ $t("otc.d5") }}
|
|
<van-icon class="fn-middle" name="arrow" size="16" /></v-link>
|
|
</view>
|
|
|
|
<text class="d-flex m-t-ms fn-12">
|
|
<span class="fn-20 color-light m-r-xs">{{ filterMoney(otc.otc_usable_balance)
|
|
}}{{ account.symbol }}</span>
|
|
({{$t('contract.e4')}})
|
|
</text>
|
|
<text class="d-flex m-t-ms fn-12">
|
|
<span class="fn-20 color-light m-r-xs">{{ filterMoney(otc.otc_freeze_balance)
|
|
}}{{ account.symbol }}</span>
|
|
({{$t('otc.d6')}})
|
|
</text>
|
|
<view class="d-flex justify-between m-t-xs">
|
|
<v-link to="/pages/transfer/index" class="d-flex">
|
|
<view class="m-r-xs align-center">
|
|
<img :src="$localImgUrl('fill4.png')" alt="" class="h-18" />
|
|
</view>
|
|
<!-- <van-icon class="color-theme-1 fn-26 fn-middle m-r-xs" name="exchange" /> -->
|
|
<text class="color-light fn-middle">{{
|
|
$t("base.d8")
|
|
}}</text>
|
|
</v-link>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- </van-tab>
|
|
</van-tabs> -->
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
</v-page>
|
|
</template>
|
|
<script>
|
|
import {
|
|
mapState,
|
|
mapActions
|
|
} from "vuex";
|
|
import Wallet from "@/api/wallet";
|
|
import math from "@/utils/class/math.js";
|
|
import Profile from "@/api/profile";
|
|
import Contract from "@/api/contract.js";
|
|
export default {
|
|
name: "mine",
|
|
data() {
|
|
return {
|
|
account: {},
|
|
list: [],
|
|
tabActive: 0, // 切换选择
|
|
searchText: "",
|
|
hide: false,
|
|
show: false,
|
|
accountDetail: {},
|
|
scrollTop: 0,
|
|
refreshing: false,
|
|
otc: {},
|
|
ProfileDetail: {},
|
|
user_auth_level: 0
|
|
};
|
|
},
|
|
computed: {
|
|
...mapState({
|
|
hideMoney: "hideMoney",
|
|
theme: "theme",
|
|
}),
|
|
filteredList() {
|
|
return this.list.filter(item => this.ifShow(item));
|
|
}
|
|
},
|
|
props: {
|
|
isShow: {
|
|
default: true,
|
|
type: Boolean,
|
|
required: false,
|
|
},
|
|
refresherEnabled: {
|
|
default: true,
|
|
required: false,
|
|
type: Boolean
|
|
},
|
|
},
|
|
watch: {
|
|
isShow(n, o) {
|
|
if (n) {
|
|
this.upDateData();
|
|
this.getAuthInfo();
|
|
}
|
|
},
|
|
tabActive() {
|
|
this.upDateData();
|
|
this.getAuthInfo();
|
|
}
|
|
},
|
|
filters: {
|
|
priceDecimals(val) {
|
|
// console.info(val)
|
|
return (parseFloat(val)).toFixed(2)
|
|
}
|
|
},
|
|
methods: {
|
|
onRefresh() {
|
|
if (this.refreshing) return;
|
|
this.refreshing = true;
|
|
this.fundAccount()
|
|
this.personalAssets()
|
|
this.getAuthInfo();
|
|
setTimeout(() => {
|
|
this.refreshing = false;
|
|
}, 1000)
|
|
},
|
|
scroll(event) {
|
|
this.scrollTop = event.detail.scrollTop
|
|
},
|
|
omitTo: math.omitTo,
|
|
// 计算和
|
|
add: math.add,
|
|
...mapActions({
|
|
setHide: "hideMoney",
|
|
}),
|
|
filterMoney(val, type) {
|
|
if (this.hideMoney) return "******";
|
|
if (type) {
|
|
return this.omitTo(val, 8);
|
|
} else {
|
|
return this.omitTo(val, 2);
|
|
}
|
|
|
|
},
|
|
|
|
ifShow(item) {
|
|
// 搜索过滤
|
|
let show =
|
|
item.coin_name
|
|
.toLocaleLowerCase()
|
|
.indexOf(this.searchText.toLocaleLowerCase()) != -1;
|
|
if (!this.hide) return true && show;
|
|
|
|
// 0余额资金过滤
|
|
let hasMoney =
|
|
this.add(item.usable_balance, item.freeze_balance, item.priceDecimals) *
|
|
1 !=
|
|
0;
|
|
return hasMoney && show;
|
|
},
|
|
fundAccount() {
|
|
Wallet.fundAccount().then((res) => {
|
|
this.list = res.data.list;
|
|
this.otc = res.data
|
|
});
|
|
},
|
|
personalAssets(e) {
|
|
Wallet.personalAssets().then((res) => {
|
|
this.account = res.data;
|
|
});
|
|
},
|
|
// 获取合约列表
|
|
accounts() {
|
|
Contract.contractAccount().then((res) => {
|
|
this.accountDetail = res.data;
|
|
});
|
|
},
|
|
changtTab($ev) {
|
|
this.tabActive = $ev.detail.name;
|
|
this.upDateData();
|
|
},
|
|
// 刷新数据
|
|
upDateData() {
|
|
if (this.tabActive == 1) {
|
|
this.accounts();
|
|
} else if (this.tabActive == 0) {
|
|
this.personalAssets();
|
|
this.fundAccount();
|
|
this.getAuthInfo();
|
|
} else {
|
|
this.fundAccount();
|
|
}
|
|
},
|
|
getAuthInfo() {
|
|
Profile.getAuthInfo().then(res => {
|
|
this.ProfileDetail = res.data;
|
|
this.user_auth_level = res.data.primary_status
|
|
// console.log(this.ProfileDetail, 11111);
|
|
})
|
|
},
|
|
},
|
|
mounted() {
|
|
this.show = true;
|
|
},
|
|
created() {
|
|
this.upDateData();
|
|
},
|
|
onShow() {
|
|
location.reload()
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.tabs-main {
|
|
::v-deep.van-tabs {
|
|
width: 100%;
|
|
}
|
|
|
|
::v-deep.van-tabs__wrap,
|
|
::v-deep.van-tabs__content {
|
|
// width: 100%;
|
|
}
|
|
|
|
::v-deep.van-tabs__content {
|
|
flex: 1;
|
|
overflow: hidden;
|
|
}
|
|
|
|
::v-deep.van-pull-refresh {
|
|
height: calc(100vh - 200px);
|
|
overflow-y: auto;
|
|
}
|
|
|
|
::v-deep.van-cell {
|
|
background: transparent;
|
|
|
|
&::after {
|
|
border-width: 0;
|
|
}
|
|
}
|
|
|
|
::v-deep .van-cell__left-icon {
|
|
color: $white;
|
|
}
|
|
}
|
|
|
|
.bgb3 {
|
|
background: url(../../static/img/bgb3.png) no-repeat;
|
|
background-size: 100% auto;
|
|
background-position: right bottom;
|
|
|
|
&.bgb3-white {
|
|
background-image: url(../../static/img/light/bgb3.png);
|
|
}
|
|
}
|
|
|
|
.bgb4 {
|
|
background: url(../../static/img/bgb4.png) no-repeat;
|
|
background-size: 100% auto;
|
|
background-position: right bottom;
|
|
}
|
|
|
|
.pos {
|
|
position: relative;
|
|
}
|
|
|
|
.posa {
|
|
position: absolute;
|
|
}
|
|
|
|
.rounded-ms {
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.p-y-xxs {
|
|
padding: 5px 0;
|
|
}
|
|
|
|
.w-33 {
|
|
width: 30%;
|
|
}
|
|
|
|
.w-50 {
|
|
width: 50%;
|
|
}
|
|
|
|
.wallet {
|
|
border-radius: 30px;
|
|
}
|
|
|
|
.text-none {
|
|
text-decoration: none;
|
|
}
|
|
|
|
::v-deep .van-cell {
|
|
background-color: $panel-3;
|
|
}
|
|
|
|
::v-deep .van-cell {
|
|
background-color: transparent;
|
|
padding: 0 10px;
|
|
}
|
|
.Currency_content{
|
|
display: flex;
|
|
justify-content: space-around;
|
|
margin: 0px 10px;
|
|
}
|
|
.text_width{
|
|
width: 150rpx;
|
|
}
|
|
.text_align{
|
|
text-align: right;
|
|
}
|
|
.title_Currency{
|
|
display: flex;
|
|
justify-content: space-around;
|
|
margin-top: 20px;
|
|
}
|
|
.w-33A {
|
|
width: auto;
|
|
padding: 5px 20px;
|
|
}
|
|
.col-fff{
|
|
// color: #1684fc;
|
|
color: #54B58F;
|
|
}
|
|
</style>
|