2882 lines
83 KiB
Vue
2882 lines
83 KiB
Vue
|
<template>
|
||
|
|
<div class="jurisdictionPage">
|
||
|
|
|
||
|
|
|
||
|
|
<section v-if="$isMobile" v-loading="jurisdictionLoading" :element-loading-text="loadingText">
|
||
|
|
|
||
|
|
<div class="accountInformation">
|
||
|
|
<img :src="jurisdiction.img" alt="coin" loading="lazy"/>
|
||
|
|
<span class="coin">{{ jurisdiction.coin }} </span>
|
||
|
|
<i class="iconfont icon-youjiantou"></i>
|
||
|
|
<span class="ma"> {{ jurisdiction.account }}</span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="profitTop">
|
||
|
|
<div class="box">
|
||
|
|
<span
|
||
|
|
>{{ $t(`mining.totalRevenue`) }}
|
||
|
|
<div class="boxTitle" :data-title="$t(`mining.totalRevenueTips`)">
|
||
|
|
<img src="../../assets/img/profit.svg" alt="profit" loading="lazy"/>
|
||
|
|
</div>
|
||
|
|
</span>
|
||
|
|
<span class="text">{{ MinerAccountData.totalProfit }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="box">
|
||
|
|
<span
|
||
|
|
>{{ $t(`mining.totalExpenditure`) }}
|
||
|
|
|
||
|
|
<div
|
||
|
|
class="boxTitle"
|
||
|
|
:data-title="$t(`mining.totalExpenditureTips`)"
|
||
|
|
>
|
||
|
|
<img src="../../assets/img/profit.svg" alt="profit" loading="lazy"/>
|
||
|
|
</div>
|
||
|
|
</span>
|
||
|
|
<span class="text">{{ MinerAccountData.expend }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="box">
|
||
|
|
<span
|
||
|
|
>{{ $t(`mining.yesterdaySEarnings`) }}
|
||
|
|
|
||
|
|
<div
|
||
|
|
class="boxTitle"
|
||
|
|
:data-title="$t(`mining.yesterdaySEarningsTips`)"
|
||
|
|
>
|
||
|
|
<img src="../../assets/img/profit.svg" alt="profit" loading="lazy"/>
|
||
|
|
</div>
|
||
|
|
</span>
|
||
|
|
<span class="text">{{ MinerAccountData.preProfit }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="box">
|
||
|
|
<span
|
||
|
|
>{{ $t(`mining.diggedToday`) }}
|
||
|
|
<div class="boxTitle" :data-title="$t(`mining.diggedTodayTips`)">
|
||
|
|
<img src="../../assets/img/profit.svg" alt="profit" loading="lazy"/>
|
||
|
|
</div>
|
||
|
|
</span>
|
||
|
|
<span class="text">{{ MinerAccountData.todayPorfit }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="accountBalance">
|
||
|
|
<div class="box2">
|
||
|
|
<span class="paymentSettings"
|
||
|
|
>{{ $t(`mining.accountBalance`) }}
|
||
|
|
|
||
|
|
<div class="boxTitle" :data-title="$t(`mining.balanceReminder`)">
|
||
|
|
<img src="../../assets/img/profit.svg" alt="profit" loading="lazy"/>
|
||
|
|
</div>
|
||
|
|
</span>
|
||
|
|
<span class="text">{{ MinerAccountData.balance }}</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="profitBtm2" v-loading="powerChartLoading">
|
||
|
|
<div class="right">
|
||
|
|
<div class="intervalBox">
|
||
|
|
<div class="title">{{ $t(`mining.algorithmicDiagram`) }}</div>
|
||
|
|
<div class="times">
|
||
|
|
<span
|
||
|
|
:class="{ timeActive: timeActive == item.value }"
|
||
|
|
@click="handleInterval(item.value)"
|
||
|
|
v-for="item in intervalList"
|
||
|
|
:key="item.value"
|
||
|
|
>{{ $t(item.label) }}</span
|
||
|
|
>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div
|
||
|
|
id="powerChart"
|
||
|
|
style="width: 100%; height: 100%; padding: 0"
|
||
|
|
></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="barBox" v-loading="barChartLoading">
|
||
|
|
<div class="lineBOX">
|
||
|
|
<div class="intervalBox">
|
||
|
|
<div class="title">{{ $t(`mining.computingPower`) }}</div>
|
||
|
|
<div class="timesBox">
|
||
|
|
<div class="times2">
|
||
|
|
<span
|
||
|
|
:class="{ timeActive: barActive == item.value }"
|
||
|
|
@click="distributionInterval(item.value)"
|
||
|
|
v-for="item in AccountPowerDistributionintervalList"
|
||
|
|
:key="item.value"
|
||
|
|
>{{ $t(item.label) }}</span
|
||
|
|
>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<div id="barChart" style="width: 100%; height: 90%; padding: 0"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="searchBox">
|
||
|
|
<input
|
||
|
|
type="text"
|
||
|
|
class="inout"
|
||
|
|
v-model="search"
|
||
|
|
:placeholder="$t(`personal.pleaseEnter2`)"
|
||
|
|
/>
|
||
|
|
<i @click="handelSearch" class="el-icon-search"></i>
|
||
|
|
</div>
|
||
|
|
<div class="top3Box">
|
||
|
|
<section class="tabPageBox">
|
||
|
|
<div class="tabPageTitle">
|
||
|
|
<div class="TitleS minerTitle" @click="handleClick2(`power`)">
|
||
|
|
<span
|
||
|
|
class="trapezoid"
|
||
|
|
:class="{ activeHeadlines: activeName2 == `power` }"
|
||
|
|
>
|
||
|
|
<span>{{ $t(`mining.miner`) }}</span></span
|
||
|
|
>
|
||
|
|
</div>
|
||
|
|
<div
|
||
|
|
class="TitleS profitTitle"
|
||
|
|
@click="handleClick2(`miningMachine`)"
|
||
|
|
v-show="profitShow"
|
||
|
|
>
|
||
|
|
<span
|
||
|
|
class="trapezoid"
|
||
|
|
:class="{ activeHeadlines: activeName2 == `miningMachine` }"
|
||
|
|
>
|
||
|
|
<span>{{ $t(`mining.profit`) }}</span></span
|
||
|
|
>
|
||
|
|
</div>
|
||
|
|
<div class="TitleS paymentTitle" v-show="paymentShow" @click="handleClick2(`payment`)">
|
||
|
|
<span
|
||
|
|
class="trapezoid"
|
||
|
|
:class="{ activeHeadlines: activeName2 == `payment` }"
|
||
|
|
>
|
||
|
|
<span>{{ $t(`mining.payment`) }}</span></span
|
||
|
|
>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<section
|
||
|
|
v-if="activeName2 == `power`"
|
||
|
|
class="page"
|
||
|
|
v-loading="MinerListLoading"
|
||
|
|
>
|
||
|
|
<div class="minerTitleBox">
|
||
|
|
<div class="TitleOnLine">
|
||
|
|
<span @click="onlineStatus(`all`)"
|
||
|
|
><span
|
||
|
|
class="circularDots3"
|
||
|
|
:class="{ activeCircular: sunTabActiveName == `all` }"
|
||
|
|
></span>
|
||
|
|
{{ $t(`mining.all`) }} {{ MinerListData.all }}</span
|
||
|
|
>
|
||
|
|
<span @click="onlineStatus(`onLine`)"
|
||
|
|
><div
|
||
|
|
class="circularDots2"
|
||
|
|
:class="{ activeCircular: sunTabActiveName == `onLine` }"
|
||
|
|
></div>
|
||
|
|
{{ $t(`mining.onLine`) }} {{ MinerListData.online }}</span
|
||
|
|
>
|
||
|
|
<span @click="onlineStatus(`off-line`)">
|
||
|
|
<div
|
||
|
|
class="circularDots2"
|
||
|
|
:class="{ activeCircular: sunTabActiveName == `off-line` }"
|
||
|
|
></div>
|
||
|
|
{{ $t(`mining.offLine`) }} {{ MinerListData.offline }}</span
|
||
|
|
>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="publicBox all" v-if="sunTabActiveName == `all`">
|
||
|
|
<div class="TitleAll" style="font-weight: 600">
|
||
|
|
<span> {{ $t(`mining.miner`) }}</span>
|
||
|
|
<span>
|
||
|
|
{{ $t(`mining.Minutes`) }} MH/s
|
||
|
|
<i
|
||
|
|
@click="handleSort(`30m`)"
|
||
|
|
class="iconfont icon-paixu sort"
|
||
|
|
></i
|
||
|
|
></span>
|
||
|
|
<span
|
||
|
|
>{{ $t(`mining.dayPower`) }} MH/s
|
||
|
|
<i
|
||
|
|
@click="handleSort(`24h`)"
|
||
|
|
class="iconfont icon-paixu sort"
|
||
|
|
></i
|
||
|
|
></span>
|
||
|
|
<!-- <span>{{ $t(`mining.submitTime`) }}</span>
|
||
|
|
<span>{{ $t(`mining.state`) }}</span> -->
|
||
|
|
</div>
|
||
|
|
<div class="totalTitleAll">
|
||
|
|
<span
|
||
|
|
><div class="circularDots"></div>
|
||
|
|
{{ $t(`mining.total`) }}</span
|
||
|
|
>
|
||
|
|
<span>{{ this.formatNumber(MinerListData.rate) }} </span>
|
||
|
|
<span>{{ MinerListData.dailyRate }} </span>
|
||
|
|
<!-- <span> --- </span> -->
|
||
|
|
<!-- <span></span> -->
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<el-collapse
|
||
|
|
v-model="Accordion"
|
||
|
|
accordion
|
||
|
|
style="max-height: 800px; overflow: auto"
|
||
|
|
>
|
||
|
|
<div
|
||
|
|
v-for="(item, index) in MinerListTableData"
|
||
|
|
:key="item.miner"
|
||
|
|
:class="`item-${index % 2 === 0 ? 'even' : 'odd'}`"
|
||
|
|
>
|
||
|
|
<el-collapse-item
|
||
|
|
:name="item.id"
|
||
|
|
@click.native="handelMiniOffLine(item.id, item.miner)"
|
||
|
|
>
|
||
|
|
<template slot="title">
|
||
|
|
<div class="accordionTitleAll">
|
||
|
|
<span :class="{ activeState: item.status == `2` }">
|
||
|
|
<div
|
||
|
|
v-if="item.status == `1`"
|
||
|
|
class="circularDotsOnLine"
|
||
|
|
></div>
|
||
|
|
<div
|
||
|
|
v-if="item.status == `2`"
|
||
|
|
class="circularDotsOffLine"
|
||
|
|
></div>
|
||
|
|
{{ item.miner }}</span
|
||
|
|
>
|
||
|
|
<span>{{ item.rate }}</span>
|
||
|
|
<span>{{ item.dailyRate }}</span>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<div class="table-item">
|
||
|
|
<div>
|
||
|
|
<p>{{ $t(`mining.submitTime`) }}</p>
|
||
|
|
<p> <span
|
||
|
|
:title="item.submit"
|
||
|
|
class="offlineTime"
|
||
|
|
:class="{ activeState: item.status == `2` }"
|
||
|
|
>
|
||
|
|
<span>{{ item.submit }} </span>
|
||
|
|
<span
|
||
|
|
:title="handelTimeInterval(item.offline)"
|
||
|
|
v-if="item.status == `2`"
|
||
|
|
class="timeTips"
|
||
|
|
>{{ handelTimeInterval(item.offline) }}</span
|
||
|
|
>
|
||
|
|
</span></p>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<p>{{ $t(`mining.state`) }}</p>
|
||
|
|
<p> <span
|
||
|
|
:title="$t(handelStateList(item.status))"
|
||
|
|
:class="{ activeState: item.status == `2` }"
|
||
|
|
>{{ $t(handelStateList(item.status)) }}
|
||
|
|
</span></p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<p class="chartTitle">
|
||
|
|
{{ $t(`mining.miner`) }}{{ item.miner }}
|
||
|
|
{{ $t(`mining.power24H`) }}
|
||
|
|
</p>
|
||
|
|
<div
|
||
|
|
:id="'SmallOff' + item.id"
|
||
|
|
v-loading="miniLoading"
|
||
|
|
style="width: 100%; height: 300px"
|
||
|
|
></div>
|
||
|
|
</el-collapse-item>
|
||
|
|
</div>
|
||
|
|
</el-collapse>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div
|
||
|
|
class="publicBox onLine"
|
||
|
|
v-else-if="sunTabActiveName == `onLine`"
|
||
|
|
>
|
||
|
|
<div class="TitleAll" style="font-weight: 600">
|
||
|
|
<span> {{ $t(`mining.miner`) }}</span>
|
||
|
|
<span
|
||
|
|
>{{ $t(`mining.Minutes`) }} MH/s
|
||
|
|
<i
|
||
|
|
@click="handleSort(`30m`)"
|
||
|
|
class="iconfont icon-paixu sort"
|
||
|
|
></i
|
||
|
|
></span>
|
||
|
|
<span
|
||
|
|
>{{ $t(`mining.dayPower`) }} MH/s
|
||
|
|
<i
|
||
|
|
@click="handleSort(`24h`)"
|
||
|
|
class="iconfont icon-paixu sort"
|
||
|
|
></i
|
||
|
|
></span>
|
||
|
|
<!-- <span>{{ $t(`mining.submitTime`) }}</span> -->
|
||
|
|
</div>
|
||
|
|
<div class="totalTitleAll">
|
||
|
|
<span
|
||
|
|
><div class="circularDots"></div>
|
||
|
|
{{ $t(`mining.total`) }}
|
||
|
|
</span>
|
||
|
|
<span>{{ MinerListData.rate }} </span>
|
||
|
|
<span>{{ MinerListData.dailyRate }} </span>
|
||
|
|
<!-- <span> --- </span> -->
|
||
|
|
</div>
|
||
|
|
<el-collapse
|
||
|
|
v-model="Accordion"
|
||
|
|
accordion
|
||
|
|
style="max-height: 800px; overflow: auto"
|
||
|
|
>
|
||
|
|
<div
|
||
|
|
v-for="(item, index) in MinerListTableData"
|
||
|
|
:key="sunTabActiveName + item.miner"
|
||
|
|
:class="`item-${index % 2 == 0 ? 'even' : 'odd'}`"
|
||
|
|
>
|
||
|
|
<el-collapse-item
|
||
|
|
:name="item.id"
|
||
|
|
@click.native="handelOnLineMiniChart(item.id, item.miner)"
|
||
|
|
>
|
||
|
|
<template slot="title">
|
||
|
|
<div class="accordionTitleAll">
|
||
|
|
<span
|
||
|
|
><div class="circularDotsOnLine"></div>
|
||
|
|
{{ item.miner }}</span
|
||
|
|
>
|
||
|
|
<span>{{ item.rate }}</span>
|
||
|
|
<span>{{ item.dailyRate }}</span>
|
||
|
|
<!-- <span>{{ item.submit }}</span> -->
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<div class="table-itemOn" >
|
||
|
|
<div>
|
||
|
|
<p>{{ $t(`mining.submitTime`) }}</p>
|
||
|
|
<p> <span
|
||
|
|
:title="item.submit"
|
||
|
|
class="offlineTime"
|
||
|
|
:class="{ activeState: item.status == `2` }"
|
||
|
|
>
|
||
|
|
<span>{{ item.submit }} </span>
|
||
|
|
<span
|
||
|
|
:title="handelTimeInterval(item.offline)"
|
||
|
|
v-if="item.status == `2`"
|
||
|
|
class="timeTips"
|
||
|
|
>{{ handelTimeInterval(item.offline) }}</span
|
||
|
|
>
|
||
|
|
</span></p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<p class="chartTitle">
|
||
|
|
{{ $t(`mining.miner`) }}{{ item.miner }} {{
|
||
|
|
$t(`mining.power24H`)
|
||
|
|
}}
|
||
|
|
</p>
|
||
|
|
<div
|
||
|
|
:id="'Small' + item.id"
|
||
|
|
v-loading="miniLoading"
|
||
|
|
style="width: 100%; height: 300px"
|
||
|
|
></div>
|
||
|
|
</el-collapse-item>
|
||
|
|
</div>
|
||
|
|
</el-collapse>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div
|
||
|
|
class="publicBox off-line"
|
||
|
|
v-else-if="sunTabActiveName == `off-line`"
|
||
|
|
>
|
||
|
|
<div class="TitleAll" style="font-weight: 600">
|
||
|
|
<span> {{ $t(`mining.miner`) }}</span>
|
||
|
|
<span
|
||
|
|
>{{ $t(`mining.Minutes`) }} MH/s
|
||
|
|
<i
|
||
|
|
@click="handleSort(`30m`)"
|
||
|
|
class="iconfont icon-paixu sort"
|
||
|
|
></i
|
||
|
|
></span>
|
||
|
|
<span
|
||
|
|
>{{ $t(`mining.dayPower`) }} MH/s
|
||
|
|
<i
|
||
|
|
@click="handleSort(`24h`)"
|
||
|
|
class="iconfont icon-paixu sort"
|
||
|
|
></i
|
||
|
|
></span>
|
||
|
|
<!-- <span>{{ $t(`mining.submitTime`) }}</span> -->
|
||
|
|
</div>
|
||
|
|
<div class="totalTitleAll">
|
||
|
|
<span
|
||
|
|
><div class="circularDots"></div>
|
||
|
|
{{ $t(`mining.total`) }}
|
||
|
|
</span>
|
||
|
|
<span>{{ MinerListData.rate }} </span>
|
||
|
|
<span>{{ MinerListData.dailyRate }} </span>
|
||
|
|
<!-- <span> --- </span> -->
|
||
|
|
</div>
|
||
|
|
<el-collapse
|
||
|
|
v-model="Accordion"
|
||
|
|
accordion
|
||
|
|
style="max-height: 800px; overflow: auto"
|
||
|
|
>
|
||
|
|
<div
|
||
|
|
v-for="(item, index) in MinerListTableData"
|
||
|
|
:key="item.miner"
|
||
|
|
:class="`item-${index % 2 === 0 ? 'even' : 'odd'}`"
|
||
|
|
>
|
||
|
|
<el-collapse-item
|
||
|
|
:name="item.id"
|
||
|
|
@click.native="handelMiniOffLine(item.id, item.miner)"
|
||
|
|
>
|
||
|
|
<template slot="title">
|
||
|
|
<div class="accordionTitleAll">
|
||
|
|
<span :class="{ activeState: item.status == `2` }"
|
||
|
|
><div class="circularDotsOffLine"></div>
|
||
|
|
{{ item.miner }}</span
|
||
|
|
>
|
||
|
|
<span>{{ item.rate }}</span>
|
||
|
|
<span>{{ item.dailyRate }}</span>
|
||
|
|
|
||
|
|
<!-- <span
|
||
|
|
:title="item.submit"
|
||
|
|
class="offlineTime"
|
||
|
|
:class="{ activeState: item.status == `2` }"
|
||
|
|
>
|
||
|
|
<span>{{ item.submit }} </span>
|
||
|
|
<span
|
||
|
|
:title="handelTimeInterval(item.offline)"
|
||
|
|
v-if="item.status == `2`"
|
||
|
|
class="timeTips"
|
||
|
|
>{{ handelTimeInterval(item.offline) }}</span
|
||
|
|
>
|
||
|
|
</span> -->
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<div class="table-itemOn" >
|
||
|
|
<div>
|
||
|
|
<p>{{ $t(`mining.submitTime`) }}</p>
|
||
|
|
<p> <span
|
||
|
|
:title="item.submit"
|
||
|
|
class="offlineTime"
|
||
|
|
:class="{ activeState: item.status == `2` }"
|
||
|
|
>
|
||
|
|
<span>{{ item.submit }} </span>
|
||
|
|
<span
|
||
|
|
:title="handelTimeInterval(item.offline)"
|
||
|
|
v-if="item.status == `2`"
|
||
|
|
class="timeTips"
|
||
|
|
>{{ handelTimeInterval(item.offline) }}</span
|
||
|
|
>
|
||
|
|
</span></p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<p class="chartTitle">
|
||
|
|
{{ $t(`mining.miner`) }}{{ item.miner }} {{
|
||
|
|
$t(`mining.power24H`)
|
||
|
|
}}
|
||
|
|
</p>
|
||
|
|
<div
|
||
|
|
:id="'SmallOff' + item.id"
|
||
|
|
v-loading="miniLoading"
|
||
|
|
style="width: 100%; height: 300px"
|
||
|
|
></div>
|
||
|
|
</el-collapse-item>
|
||
|
|
</div>
|
||
|
|
</el-collapse>
|
||
|
|
</div>
|
||
|
|
<!-- <el-pagination
|
||
|
|
class="minerPagination"
|
||
|
|
@size-change="handleSizeMiner"
|
||
|
|
@current-change="handleCurrentMiner"
|
||
|
|
:current-page.sync="currentPageMiner"
|
||
|
|
:page-sizes="[50, 100, 200, 400]"
|
||
|
|
:page-size="MinerListParams.limit"
|
||
|
|
layout="total, sizes, prev, pager, next, jumper"
|
||
|
|
:total="minerTotal"
|
||
|
|
>
|
||
|
|
</el-pagination> -->
|
||
|
|
|
||
|
|
<el-pagination
|
||
|
|
style="margin-top: 10px;margin-bottom: 10px;"
|
||
|
|
@size-change="handleSizeMiner"
|
||
|
|
@current-change="handleCurrentMiner"
|
||
|
|
:current-page.sync="currentPageMiner"
|
||
|
|
:page-sizes="[50, 100, 200, 400]"
|
||
|
|
:page-size="MinerListParams.limit"
|
||
|
|
layout="sizes, prev, pager, next"
|
||
|
|
:total="minerTotal">
|
||
|
|
</el-pagination>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="miningMachine" v-if="activeName2 == `miningMachine`">
|
||
|
|
<div class="belowTable">
|
||
|
|
<ul>
|
||
|
|
<li class="table-title">
|
||
|
|
<span :title="$t(`mining.settlementDate`)">{{
|
||
|
|
$t(`mining.settlementDate`)
|
||
|
|
}}</span>
|
||
|
|
<span>{{ $t(`mining.dayPower`) }} MH/s</span>
|
||
|
|
<span :title="$t(`mining.profit`)">{{
|
||
|
|
$t(`mining.profit`)
|
||
|
|
}}</span>
|
||
|
|
<!-- <span >{{$t(`mining.remarks`)}}
|
||
|
|
|
||
|
|
<div class="boxTitle" :data-title="$t(`mining.mature`)">
|
||
|
|
<i style="font-size:1.3em" class="iconfont icon-kongxinwenhao"></i>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</span> -->
|
||
|
|
</li>
|
||
|
|
|
||
|
|
<li
|
||
|
|
class="currency-list"
|
||
|
|
v-for="(item, index) in HistoryIncomeData"
|
||
|
|
:key="index"
|
||
|
|
>
|
||
|
|
<span :title="item.date">{{ item.date }}</span>
|
||
|
|
<span :title="item.mhs">{{ item.mhs }} </span>
|
||
|
|
<span :title="item.amount"
|
||
|
|
>{{ item.amount }}
|
||
|
|
<span
|
||
|
|
style="
|
||
|
|
color: rgba(0, 0, 0, 0.5);
|
||
|
|
text-transform: capitalize;
|
||
|
|
"
|
||
|
|
>{{ accountItem.coin }}</span
|
||
|
|
></span
|
||
|
|
>
|
||
|
|
<!-- <span :title="item.comment">{{item.comment }}</span> -->
|
||
|
|
</li>
|
||
|
|
</ul>
|
||
|
|
<!-- <el-pagination
|
||
|
|
@size-change="handleSizeChangeIncome"
|
||
|
|
@current-change="handleCurrentChangeIncome"
|
||
|
|
:current-page.sync="currentPageIncome"
|
||
|
|
:page-sizes="[10, 50, 100, 400]"
|
||
|
|
:page-size="IncomeParams.limit"
|
||
|
|
layout="total, sizes, prev, pager, next, jumper"
|
||
|
|
:total="HistoryIncomeTotal"
|
||
|
|
>
|
||
|
|
</el-pagination> -->
|
||
|
|
|
||
|
|
<el-pagination
|
||
|
|
class="pageBox"
|
||
|
|
@size-change="handleSizeChangeIncome"
|
||
|
|
@current-change="handleCurrentChangeIncome"
|
||
|
|
:current-page.sync="currentPageIncome"
|
||
|
|
:page-sizes="[10, 50, 100, 400]"
|
||
|
|
:page-size="IncomeParams.limit"
|
||
|
|
layout="sizes, prev, pager, next"
|
||
|
|
:total="HistoryIncomeTotal"
|
||
|
|
>
|
||
|
|
</el-pagination>
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="payment" v-if="activeName2 == `payment`">
|
||
|
|
<div class="belowTable">
|
||
|
|
|
||
|
|
<div class="table-title">
|
||
|
|
<span :title="$t(`mining.withdrawalTime`)">{{
|
||
|
|
$t(`mining.withdrawalTime`)
|
||
|
|
}}</span>
|
||
|
|
<!-- <span :title="$t(`mining.withdrawalAddress`)">{{
|
||
|
|
$t(`mining.withdrawalAddress`)
|
||
|
|
}}</span> -->
|
||
|
|
<span :title="$t(`mining.withdrawalAmount`)">{{
|
||
|
|
$t(`mining.withdrawalAmount`)
|
||
|
|
}}</span>
|
||
|
|
<span :title="$t(`mining.paymentStatus`)">{{
|
||
|
|
$t(`mining.paymentStatus`)
|
||
|
|
}}</span>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<el-collapse >
|
||
|
|
<el-collapse-item class="collapseItem" :name="index" v-for="(item,index) in HistoryOutcomeData" :key="item.txid">
|
||
|
|
<template slot="title">
|
||
|
|
<div class="paymentCollapseTitle">
|
||
|
|
<span >{{ item.date }}</span>
|
||
|
|
<span>{{ item.amount }}</span>
|
||
|
|
<span>{{ $t(handelPayment(item.status)) }}</span>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<div class="dropDownContent">
|
||
|
|
<div v-if="item.address">
|
||
|
|
<p>{{$t(`mining.withdrawalAddress`) }}</p>
|
||
|
|
|
||
|
|
|
||
|
|
<p >{{item.address}} <span class="copy" @click="clickCopy(item.address)">{{$t(`personal.copy`)}}</span></p>
|
||
|
|
</div>
|
||
|
|
<div v-if="item.txid">
|
||
|
|
<p>Txid</p>
|
||
|
|
<p > <span style="cursor: pointer;text-decoration:underline;color:#433278" @click="handelTxid(item.txid)"> {{item.txid}} </span> <span @click="clickCopy(item.txid)" class="copy">{{$t(`personal.copy`)}}</span></p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
</el-collapse-item>
|
||
|
|
|
||
|
|
</el-collapse>
|
||
|
|
|
||
|
|
<el-pagination
|
||
|
|
style="margin-top: 10px;margin-bottom: 10px;"
|
||
|
|
@size-change="handleSizeChange"
|
||
|
|
@current-change="handleCurrentChange"
|
||
|
|
:current-page.sync="currentPage"
|
||
|
|
:page-sizes="[10, 50, 100, 400]"
|
||
|
|
:page-size="OutcomeParams.limit"
|
||
|
|
layout="sizes, prev, pager, next"
|
||
|
|
:total="HistoryOutcomeTotal">
|
||
|
|
</el-pagination>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
</section>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</section>
|
||
|
|
|
||
|
|
|
||
|
|
<section class="miningAccount" v-else v-loading="jurisdictionLoading" :element-loading-text="loadingText">
|
||
|
|
<div class="accountInformation">
|
||
|
|
<img :src="jurisdiction.img" alt="coin" loading="lazy">
|
||
|
|
<span class="coin">{{jurisdiction.coin}} </span>
|
||
|
|
<i class="iconfont icon-youjiantou"></i>
|
||
|
|
<span class="ma"> {{jurisdiction.account}}</span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="profitBox">
|
||
|
|
<div class="profitTop">
|
||
|
|
<div class="box">
|
||
|
|
|
||
|
|
<span>{{$t(`mining.totalRevenue`)}}
|
||
|
|
<!-- <div class="boxTitle" :data-title="$t(`mining.totalRevenueTips`)">
|
||
|
|
<img src="../../assets/img/profit.svg" alt="">
|
||
|
|
</div> -->
|
||
|
|
|
||
|
|
</span>
|
||
|
|
<span class="text">{{ MinerAccountData.totalProfit }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="box">
|
||
|
|
<span>{{$t(`mining.totalExpenditure`)}}
|
||
|
|
|
||
|
|
<!-- <div class="boxTitle" :data-title="$t(`mining.totalExpenditureTips`)">
|
||
|
|
<img src="../../assets/img/profit.svg" alt="">
|
||
|
|
</div> -->
|
||
|
|
</span>
|
||
|
|
<span class="text">{{ MinerAccountData.expend }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="box">
|
||
|
|
<span>{{$t(`mining.yesterdaySEarnings`)}}
|
||
|
|
|
||
|
|
<!-- <div class="boxTitle" :data-title="$t(`mining.yesterdaySEarningsTips`)">
|
||
|
|
<img src="../../assets/img/profit.svg" alt="">
|
||
|
|
</div> -->
|
||
|
|
</span>
|
||
|
|
<span class="text">{{ MinerAccountData.preProfit }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="box">
|
||
|
|
<span>{{$t(`mining.diggedToday`)}}
|
||
|
|
<div class="boxTitle" :data-title="$t(`mining.diggedTodayTips`)">
|
||
|
|
<img src="../../assets/img/profit.svg" alt="profit" loading="lazy">
|
||
|
|
</div>
|
||
|
|
</span>
|
||
|
|
<span class="text">{{ MinerAccountData.todayPorfit }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="box">
|
||
|
|
<!-- ({{$t(`mining.Withdrawable`)}}) -->
|
||
|
|
<span class="paymentSettings">{{$t(`mining.accountBalance`)}}
|
||
|
|
|
||
|
|
<div class="boxTitle" :data-title="$t(`mining.balanceReminder`)">
|
||
|
|
<img src="../../assets/img/profit.svg" alt="profit" loading="lazy">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</span>
|
||
|
|
<!-- ({{ MinerAccountData.withdrawable ||0 }}) -->
|
||
|
|
<span class="text">{{ MinerAccountData.balance }} </span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="profitBtm" v-loading="powerChartLoading">
|
||
|
|
<!-- <div class="left">
|
||
|
|
<div class="box">
|
||
|
|
<span>帐户余额 (SC)</span>
|
||
|
|
<span class="text">{{ MinerAccountData.balance }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="bth">
|
||
|
|
<el-button>付款设置</el-button>
|
||
|
|
</div>
|
||
|
|
</div> -->
|
||
|
|
<div class="right">
|
||
|
|
<div class="intervalBox">
|
||
|
|
<div class="title">{{$t(`mining.algorithmicDiagram`)}}</div>
|
||
|
|
<div class="times">
|
||
|
|
<span :class="{ 'timeActive': timeActive== item.value}" @click="handleInterval(item.value)" v-for="item in intervalList" :key="item.value">{{ $t(item.label) }}</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div id="powerChart" style="width:100%; height: 100%;padding: 0;"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<div class="top2Box" v-loading="barChartLoading">
|
||
|
|
<div class="lineBOX">
|
||
|
|
<div class="intervalBox">
|
||
|
|
<div class="title">{{$t(`mining.computingPower`)}}</div>
|
||
|
|
<div class="times">
|
||
|
|
<span :class="{ 'timeActive': barActive== item.value}" @click="distributionInterval(item.value)" v-for="item in AccountPowerDistributionintervalList" :key="item.value">{{ $t(item.label) }}</span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div id="barChart" style="width: 100%; height: 90%;padding: 0;"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<div class="top3Box">
|
||
|
|
<section class="tabPageBox">
|
||
|
|
<div class="tabPageTitle">
|
||
|
|
<div class="TitleS minerTitle " @click="handleClick2(`power`)"><span class="trapezoid " :class="{ 'activeHeadlines': activeName2 == `power` }"> <span>{{ $t(`mining.miner`) }}</span></span></div>
|
||
|
|
<div class="TitleS profitTitle" v-show="profitShow" @click="handleClick2(`miningMachine`)"><span class="trapezoid " :class="{ 'activeHeadlines': activeName2 == `miningMachine` }"> <span>{{ $t(`mining.profit`) }}</span></span></div>
|
||
|
|
<div class="TitleS paymentTitle" v-show="paymentShow" @click="handleClick2(`payment`)"><span class="trapezoid " :class="{ 'activeHeadlines': activeName2 == `payment` }"> <span>{{ $t(`mining.payment`) }}</span></span></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<section v-if="activeName2 == `power`" class="page" v-loading="MinerListLoading" >
|
||
|
|
<div class="minerTitleBox">
|
||
|
|
<div class="TitleOnLine">
|
||
|
|
<span @click="onlineStatus(`all`)"><span class="circularDots3 " :class="{ 'activeCircular': sunTabActiveName == `all` }" ></span> {{$t(`mining.all`)}} {{ MinerListData.all }}</span>
|
||
|
|
<span @click="onlineStatus(`onLine`)"><div class="circularDots2" :class="{ 'activeCircular': sunTabActiveName == `onLine` }"></div> {{$t(`mining.onLine`)}} {{ MinerListData.online }}</span>
|
||
|
|
<span @click="onlineStatus(`off-line`)"> <div class="circularDots2" :class="{ 'activeCircular': sunTabActiveName == `off-line` }"></div> {{$t(`mining.offLine`)}} {{ MinerListData.offline }}</span>
|
||
|
|
</div>
|
||
|
|
<div class="searchBox">
|
||
|
|
<input type="text" class="inout" v-model="search" :placeholder="$t(`personal.pleaseEnter2`)">
|
||
|
|
<i @click="handelSearch" class="el-icon-search"></i>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<div class="publicBox all" v-if="sunTabActiveName == `all`">
|
||
|
|
<div class="TitleAll" style="font-weight: 600;">
|
||
|
|
<span> {{$t(`mining.miner`)}}</span>
|
||
|
|
<span>{{$t(`mining.Minutes`)}} MH/s <i @click="handleSort(`30m`)" class="iconfont icon-paixu sort"></i></span>
|
||
|
|
<span>{{$t(`mining.dayPower`)}} MH/s <i @click="handleSort(`24h`)" class="iconfont icon-paixu sort"></i></span>
|
||
|
|
<!-- <span>{{$t(`mining.refusalRate`)}}</span> -->
|
||
|
|
<span>{{$t(`mining.submitTime`)}}</span>
|
||
|
|
<span>{{$t(`mining.state`)}}</span>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<div class="totalTitleAll">
|
||
|
|
<span><div class="circularDots"></div> {{ $t(`mining.total`) }}</span>
|
||
|
|
<span>{{MinerListData.rate}} </span>
|
||
|
|
<span>{{MinerListData.dailyRate}} </span>
|
||
|
|
<span>{{MinerListData.submit}} </span>
|
||
|
|
<span></span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<el-collapse v-model="Accordion" accordion style=" max-height:800PX;overflow: auto;">
|
||
|
|
|
||
|
|
<div v-for="(item, index) in sortedMinerListTableData" :key="item.miner" :class="`item-${index % 2 === 0 ? 'even' : 'odd'}`">
|
||
|
|
<el-collapse-item :name="item.id" @click.native="handelMiniOffLine(item.id, item.miner)" >
|
||
|
|
<template slot="title">
|
||
|
|
<div class="accordionTitleAll">
|
||
|
|
<span :class="{ 'activeState' :item.status ==`2` }"> <div v-if="item.status ==`1`" class="circularDotsOnLine"></div> <div v-if="item.status ==`2`" class="circularDotsOffLine" ></div> {{item.miner}}</span>
|
||
|
|
<span>{{item.rate}}</span>
|
||
|
|
<span>{{item.dailyRate}}</span>
|
||
|
|
<!-- <span>{{item.reject}}</span> -->
|
||
|
|
<span :title="item.submit" class="offlineTime" :class="{ 'activeState' :item.status ==`2` }"> <span>{{item.submit}} </span> <span :title="handelTimeInterval(item.offline)" v-if="item.status ==`2`" class="timeTips">{{ handelTimeInterval(item.offline) }}</span> </span>
|
||
|
|
<span :class="{ 'activeState' :item.status ==`2` }">{{ $t(handelStateList(item.status)) }} </span>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<p class="chartTitle">{{$t(`mining.miner`)}}{{item.miner }} {{$t(`mining.power24H`)}}</p>
|
||
|
|
<div :id="'SmallOff' + item.id" v-loading ="miniLoading" style="width:100%; height: 300PX;"></div>
|
||
|
|
</el-collapse-item>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</el-collapse>
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="publicBox onLine" v-else-if="sunTabActiveName == `onLine`" >
|
||
|
|
<div class="Title" style="font-weight: 600;">
|
||
|
|
<span> {{$t(`mining.miner`)}}</span>
|
||
|
|
<span>{{$t(`mining.Minutes`)}} MH/s <i @click="handleSort(`30m`)" class="iconfont icon-paixu sort"></i></span>
|
||
|
|
<span>{{$t(`mining.dayPower`)}} MH/s <i @click="handleSort(`24h`)" class="iconfont icon-paixu sort"></i></span>
|
||
|
|
<!-- <span>{{$t(`mining.refusalRate`)}}</span> -->
|
||
|
|
<span>{{$t(`mining.submitTime`)}}</span>
|
||
|
|
</div>
|
||
|
|
<div class="totalTitle">
|
||
|
|
<span><div class="circularDots"></div> {{ $t(`mining.total`) }} </span>
|
||
|
|
<span>{{MinerListData.rate}} </span>
|
||
|
|
<span>{{MinerListData.dailyRate}} </span>
|
||
|
|
<span>{{MinerListData.submit}} </span>
|
||
|
|
</div>
|
||
|
|
<el-collapse v-model="Accordion" accordion style=" max-height:800PX;overflow: auto;">
|
||
|
|
<div v-for="(item, index) in MinerListTableData" :key="sunTabActiveName+item.miner" :class="`item-${index % 2 == 0 ? 'even' : 'odd'}`">
|
||
|
|
<el-collapse-item :name="item.id" @click.native="handelOnLineMiniChart(item.id, item.miner)" >
|
||
|
|
<template slot="title">
|
||
|
|
<div class="accordionTitle">
|
||
|
|
<span><div class="circularDotsOnLine"></div> {{item.miner}}</span>
|
||
|
|
<span>{{item.rate}}</span>
|
||
|
|
<span>{{item.dailyRate}}</span>
|
||
|
|
<!-- <span>{{item.reject}}</span> -->
|
||
|
|
<span>{{item.submit}}</span>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<p class="chartTitle"> {{$t(`mining.miner`)}}{{item.miner }} {{$t(`mining.power24H`)}}</p>
|
||
|
|
<div :id="'Small' + item.id" v-loading ="miniLoading" style="width:100%; height: 300PX;"></div>
|
||
|
|
</el-collapse-item>
|
||
|
|
</div>
|
||
|
|
</el-collapse>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="publicBox off-line" v-else-if="sunTabActiveName == `off-line`">
|
||
|
|
<div class="Title" style="font-weight: 600;">
|
||
|
|
|
||
|
|
<span> {{$t(`mining.miner`)}}</span>
|
||
|
|
<span>{{$t(`mining.Minutes`)}} MH/s <i @click="handleSort(`30m`)" class="iconfont icon-paixu sort"></i></span>
|
||
|
|
<span>{{$t(`mining.dayPower`)}} MH/s <i @click="handleSort(`24h`)" class="iconfont icon-paixu sort"></i></span>
|
||
|
|
<!-- <span>{{$t(`mining.refusalRate`)}}</span> -->
|
||
|
|
<span>{{$t(`mining.submitTime`)}}</span>
|
||
|
|
</div>
|
||
|
|
<div class="totalTitle">
|
||
|
|
<span><div class="circularDots"></div> {{ $t(`mining.total`) }} </span>
|
||
|
|
<span>{{MinerListData.rate}} </span>
|
||
|
|
<span>{{MinerListData.dailyRate}} </span>
|
||
|
|
<span>{{MinerListData.submit}} </span>
|
||
|
|
</div>
|
||
|
|
<el-collapse v-model="Accordion" accordion style=" max-height:800PX;overflow: auto;">
|
||
|
|
<div v-for="(item, index) in MinerListTableData" :key="item.miner" :class="`item-${index % 2 === 0 ? 'even' : 'odd'}`">
|
||
|
|
<el-collapse-item :name="item.id" @click.native="handelMiniOffLine(item.id, item.miner)" >
|
||
|
|
|
||
|
|
<template slot="title">
|
||
|
|
<div class="accordionTitle">
|
||
|
|
<span :class="{ 'activeState' :item.status ==`2` }"><div class="circularDotsOffLine"></div> {{item.miner}}</span>
|
||
|
|
<span>{{item.rate}}</span>
|
||
|
|
<span>{{item.dailyRate}}</span>
|
||
|
|
<!-- <span>{{item.reject}}</span> -->
|
||
|
|
<span :title="item.submit" class="offlineTime" :class="{ 'activeState' :item.status ==`2` }"> <span>{{item.submit}} </span> <span :title="handelTimeInterval(item.offline)" v-if="item.status ==`2`" class="timeTips">{{ handelTimeInterval(item.offline) }}</span> </span>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<p class="chartTitle">{{$t(`mining.miner`)}}{{item.miner }} {{$t(`mining.power24H`)}}</p>
|
||
|
|
<div :id="'SmallOff' + item.id" v-loading ="miniLoading" style="width:100%; height: 300PX;"></div>
|
||
|
|
</el-collapse-item>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</el-collapse>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<el-pagination
|
||
|
|
class="minerPagination"
|
||
|
|
@size-change="handleSizeMiner"
|
||
|
|
@current-change="handleCurrentMiner"
|
||
|
|
:current-page.sync="currentPageMiner"
|
||
|
|
:page-sizes="[50, 100, 200, 400]"
|
||
|
|
:page-size=MinerListParams.limit
|
||
|
|
layout="total, sizes, prev, pager, next, jumper"
|
||
|
|
:total="minerTotal"
|
||
|
|
>
|
||
|
|
</el-pagination>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="miningMachine" v-if="activeName2 == `miningMachine`">
|
||
|
|
<div class="belowTable">
|
||
|
|
<ul>
|
||
|
|
<li class="table-title">
|
||
|
|
<span :title="$t(`mining.settlementDate`)">{{$t(`mining.settlementDate`)}}</span>
|
||
|
|
<span>{{$t(`mining.dayPower`)}} MH/s</span>
|
||
|
|
<span :title="$t(`mining.profit`)">{{$t(`mining.profit`)}}</span>
|
||
|
|
<!-- <span >{{$t(`mining.remarks`)}}
|
||
|
|
|
||
|
|
<div class="boxTitle" :data-title="$t(`mining.mature`)">
|
||
|
|
<i style="font-size:1.3em" class="iconfont icon-kongxinwenhao"></i>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</span> -->
|
||
|
|
</li>
|
||
|
|
|
||
|
|
<li class="currency-list" v-for="(item,index) in HistoryIncomeData" :key="index">
|
||
|
|
|
||
|
|
<span :title="item.date">{{item.date }}</span>
|
||
|
|
<span :title="item.mhs">{{item.mhs }} </span>
|
||
|
|
<span :title="item.amount">{{item.amount }} <span style="color: rgba(0,0,0,0.5);text-transform: capitalize;">{{jurisdiction.coin.includes(`dgb`)?`dgb`:jurisdiction.coin}}</span></span>
|
||
|
|
<!-- <span :title="item.comment">{{item.comment }}</span> -->
|
||
|
|
</li>
|
||
|
|
|
||
|
|
|
||
|
|
</ul>
|
||
|
|
<el-pagination
|
||
|
|
@size-change="handleSizeChangeIncome"
|
||
|
|
@current-change="handleCurrentChangeIncome"
|
||
|
|
:current-page.sync="currentPageIncome"
|
||
|
|
:page-sizes="[10, 50, 100, 400]"
|
||
|
|
:page-size=IncomeParams.limit
|
||
|
|
layout="total, sizes, prev, pager, next, jumper"
|
||
|
|
:total="HistoryIncomeTotal"
|
||
|
|
>
|
||
|
|
</el-pagination>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="payment" v-if="activeName2 == `payment`">
|
||
|
|
<div class="belowTable">
|
||
|
|
<ul>
|
||
|
|
<li class="table-title">
|
||
|
|
<span :title="$t(`mining.withdrawalTime`)">{{$t(`mining.withdrawalTime`)}}</span>
|
||
|
|
<span :title="$t(`mining.withdrawalAddress`)">{{$t(`mining.withdrawalAddress`)}}</span>
|
||
|
|
<!-- <span :title="$t(`mining.currency`)">{{$t(`mining.currency`)}}</span> -->
|
||
|
|
<span :title="$t(`mining.withdrawalAmount`)">{{$t(`mining.withdrawalAmount`)}}</span>
|
||
|
|
<span :title="$t(`mining.paymentStatus`)">{{$t(`mining.paymentStatus`)}}</span>
|
||
|
|
</li>
|
||
|
|
<li class="currency-list" v-for="item in HistoryOutcomeData" :key="item.txid">
|
||
|
|
<span :title=" item.date">{{ item.date }}</span>
|
||
|
|
<span style="text-align: left;" :title=" item.address">{{ item.address }}</span>
|
||
|
|
<!-- <span :title=" item.coin">{{ item.coin }}</span> -->
|
||
|
|
<span :title=" item.amount">{{ item.amount }} <span style="color: rgba(0,0,0,0.5);text-transform: capitalize;">{{jurisdiction.coin.includes(`dgb`)?`dgb`:jurisdiction.coin}}</span></span>
|
||
|
|
|
||
|
|
<span class="txidBox">
|
||
|
|
<span style="font-size: 0.8rem;">{{$t(handelPayment(item.status)) }} </span>
|
||
|
|
<span class="txid" v-if="item.status !== 0">
|
||
|
|
|
||
|
|
<el-popover placement="top" width="300" trigger="hover">
|
||
|
|
|
||
|
|
<span :id="`id${item.txid}`" ref="txidRef">{{ item.txid }}</span>
|
||
|
|
<div style="text-align: right; margin: 0">
|
||
|
|
<el-button size="mini" style="border-radius:5PX" @click="copyTxid(item.txid)">{{$t(`personal.copy`)}}</el-button>
|
||
|
|
</div>
|
||
|
|
<div slot="reference" @click="handelTxid(item.txid)" >Txid</div>
|
||
|
|
</el-popover>
|
||
|
|
</span>
|
||
|
|
|
||
|
|
</span>
|
||
|
|
</li>
|
||
|
|
|
||
|
|
</ul>
|
||
|
|
<el-pagination
|
||
|
|
@size-change="handleSizeChange"
|
||
|
|
@current-change="handleCurrentChange"
|
||
|
|
:current-page.sync="currentPage"
|
||
|
|
:page-sizes="[10, 50, 100, 400]"
|
||
|
|
:page-size=OutcomeParams.limit
|
||
|
|
layout="total, sizes, prev, pager, next, jumper"
|
||
|
|
:total="HistoryOutcomeTotal"
|
||
|
|
>
|
||
|
|
</el-pagination>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</section>
|
||
|
|
|
||
|
|
</section>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
</section>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import Index from "./index";
|
||
|
|
import Tooltip from "../../components/promptBox.vue";//引入组件
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
Tooltip,
|
||
|
|
},
|
||
|
|
mixins: [Index],
|
||
|
|
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
<style scoped lang="scss">
|
||
|
|
|
||
|
|
// 手机端适配
|
||
|
|
@media screen and (min-width: 220px) and (max-width: 1279px) {
|
||
|
|
// 隐藏滚动条
|
||
|
|
::-webkit-scrollbar {
|
||
|
|
width: 0PX !important; /* 宽度 */
|
||
|
|
height: 0px; /* 高度 */
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
/* 滚动条滑块 */
|
||
|
|
::-webkit-scrollbar-thumb {
|
||
|
|
background-color: #D2C3E9; /* 滑块颜色 */
|
||
|
|
border-radius: 20PX; /* 圆角 */
|
||
|
|
}
|
||
|
|
|
||
|
|
/* 滚动条轨道 */
|
||
|
|
::-webkit-scrollbar-track {
|
||
|
|
background-color: #f0f0f0; /* 轨道颜色 */
|
||
|
|
}
|
||
|
|
|
||
|
|
.accountInformation {
|
||
|
|
|
||
|
|
width: 100% !important;
|
||
|
|
height: 33px !important;
|
||
|
|
background: rgba(0, 0, 0, 0.5);
|
||
|
|
position: fixed;
|
||
|
|
top: 61px !important;
|
||
|
|
left: 0;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
padding: 1% 5%;
|
||
|
|
z-index: 2001;
|
||
|
|
line-height: 33px !important;
|
||
|
|
|
||
|
|
img {
|
||
|
|
width: 18px !important;
|
||
|
|
}
|
||
|
|
i {
|
||
|
|
color: #fff;
|
||
|
|
font-size: 0.95rem !important;
|
||
|
|
margin-left: 10px;
|
||
|
|
}
|
||
|
|
.coin {
|
||
|
|
margin-left: 5px;
|
||
|
|
font-weight: 600;
|
||
|
|
color: #fff;
|
||
|
|
text-transform: capitalize;
|
||
|
|
font-size: 0.8rem !important;
|
||
|
|
}
|
||
|
|
.ma {
|
||
|
|
font-weight: normal !important;
|
||
|
|
color: #fff;
|
||
|
|
margin-left: 10px;
|
||
|
|
font-size: 0.9rem !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.profitTop {
|
||
|
|
width: 100%;
|
||
|
|
height: auto;
|
||
|
|
display: flex;
|
||
|
|
flex-wrap: wrap;
|
||
|
|
justify-content: space-around;
|
||
|
|
padding-top: 40px;
|
||
|
|
.box {
|
||
|
|
width: 45%;
|
||
|
|
height: 80px;
|
||
|
|
background: #fff;
|
||
|
|
margin-top: 10px;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: left;
|
||
|
|
justify-content: space-around;
|
||
|
|
padding: 8px;
|
||
|
|
font-size: 0.9rem;
|
||
|
|
border-radius: 5px;
|
||
|
|
box-shadow: 0px 0px 3px 1px #ccc;
|
||
|
|
}
|
||
|
|
.accountBalance {
|
||
|
|
width: 95%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
padding: 15px 15px;
|
||
|
|
|
||
|
|
background: #fff;
|
||
|
|
margin: 0 auto;
|
||
|
|
margin-top: 18px;
|
||
|
|
border-radius: 5px;
|
||
|
|
box-shadow: 0px 0px 3px 1px #ccc;
|
||
|
|
|
||
|
|
.box2 {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: left;
|
||
|
|
font-size: 0.9rem;
|
||
|
|
}
|
||
|
|
.el-button {
|
||
|
|
background: #661fff;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.profitBtm2 {
|
||
|
|
width: 95%;
|
||
|
|
height: 400px;
|
||
|
|
margin: 0 auto;
|
||
|
|
margin-top: 18px;
|
||
|
|
border-radius: 5px;
|
||
|
|
box-shadow: 0px 0px 3px 1px #ccc;
|
||
|
|
padding: 8px;
|
||
|
|
font-size: 0.95rem;
|
||
|
|
background: #fff;
|
||
|
|
.right {
|
||
|
|
width: 100%;
|
||
|
|
height: 95%;
|
||
|
|
background: #fff;
|
||
|
|
// padding: 10px 10px;
|
||
|
|
transition: all 0.2s linear;
|
||
|
|
.intervalBox {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
padding: 5px 10px;
|
||
|
|
|
||
|
|
.title {
|
||
|
|
// width: 10%;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 0.95rem;
|
||
|
|
color: rgba(0, 0, 0, 0.8);
|
||
|
|
}
|
||
|
|
.times {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
border-radius: 20px;
|
||
|
|
padding: 1px 1px;
|
||
|
|
border: 1px solid #5721e4;
|
||
|
|
cursor: pointer;
|
||
|
|
font-size: 0.8rem;
|
||
|
|
margin-top: 5px;
|
||
|
|
span {
|
||
|
|
min-width: 55px;
|
||
|
|
text-align: center;
|
||
|
|
|
||
|
|
border-radius: 20px;
|
||
|
|
margin: 0;
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.timeActive {
|
||
|
|
background: #7245e8;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.barBox{
|
||
|
|
width: 95%;
|
||
|
|
height: 400px;
|
||
|
|
margin: 0 auto;
|
||
|
|
margin-top: 18px;
|
||
|
|
border-radius: 5px;
|
||
|
|
box-shadow: 0px 0px 3px 1px #ccc;
|
||
|
|
// padding: 8px;
|
||
|
|
font-size: 0.95rem;
|
||
|
|
background: #fff;
|
||
|
|
.lineBOX {
|
||
|
|
// background: #0BB7BF;
|
||
|
|
width: 100%;
|
||
|
|
height: 98%;
|
||
|
|
padding: 10px 20px;
|
||
|
|
// box-shadow: 0px 0px 10px 3px #ccc;
|
||
|
|
transition: all 0.2s linear;
|
||
|
|
|
||
|
|
|
||
|
|
.intervalBox {
|
||
|
|
// display: flex;
|
||
|
|
// align-items: center;
|
||
|
|
// justify-content: space-between;
|
||
|
|
|
||
|
|
font-size: 0.9rem;
|
||
|
|
.title {
|
||
|
|
// width: 10%;
|
||
|
|
text-align: left;
|
||
|
|
font-size: 0.95rem;
|
||
|
|
color: rgba(0, 0, 0, 0.8);
|
||
|
|
|
||
|
|
}
|
||
|
|
.timesBox{
|
||
|
|
width: 100%;
|
||
|
|
text-align: right;
|
||
|
|
display: flex;
|
||
|
|
justify-content: right;
|
||
|
|
.times2 {
|
||
|
|
max-width: 47%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
border-radius: 20px;
|
||
|
|
padding: 1px 1px;
|
||
|
|
border: 1px solid #5721e4;
|
||
|
|
font-size: 0.8rem;
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
span {
|
||
|
|
// width: 49%;
|
||
|
|
text-align: center;
|
||
|
|
padding: 0px 15px;
|
||
|
|
border-radius: 20px;
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.timeActive {
|
||
|
|
background: #7245e8;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.searchBox {
|
||
|
|
width: 92%;
|
||
|
|
// position: absolute;
|
||
|
|
// right: 0;
|
||
|
|
// top: 0PX;
|
||
|
|
border: 2px solid #641fff;
|
||
|
|
height: 30px;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
border-radius: 25px;
|
||
|
|
overflow: hidden;
|
||
|
|
margin: 0 auto;
|
||
|
|
margin-top: 25px;
|
||
|
|
.inout {
|
||
|
|
border: none;
|
||
|
|
outline: none;
|
||
|
|
padding: 0px 10px;
|
||
|
|
background: transparent;
|
||
|
|
}
|
||
|
|
i {
|
||
|
|
width: 15%;
|
||
|
|
height: 101%;
|
||
|
|
background: #641fff;
|
||
|
|
color: #fff;
|
||
|
|
font-size: 1.2em;
|
||
|
|
line-height: 25px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.top3Box {
|
||
|
|
margin-top: 8px !important;
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
// margin-bottom: 1%;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
|
||
|
|
padding: 0px 1%;
|
||
|
|
padding-bottom: 5%;
|
||
|
|
font-size: 0.95rem;
|
||
|
|
|
||
|
|
.tabPageBox {
|
||
|
|
width: 98% !important;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
flex-direction: column;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
|
||
|
|
|
||
|
|
.activeHeadlines {
|
||
|
|
background: #651efe !important;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.tabPageTitle {
|
||
|
|
width: 100% !important;
|
||
|
|
height: 60px;
|
||
|
|
|
||
|
|
display: flex;
|
||
|
|
align-items: end;
|
||
|
|
position: relative;
|
||
|
|
padding: 0 !important;
|
||
|
|
font-weight: 600;
|
||
|
|
.TitleS {
|
||
|
|
position: relative;
|
||
|
|
// border-radius: 300PX 260PX 0PX 0PX;
|
||
|
|
// overflow: hidden;
|
||
|
|
// clip-path: polygon(22% 0%, 79% 0%, 94% 100%, 10% 100%);
|
||
|
|
display: inline-block;
|
||
|
|
filter: drop-shadow(0px -5px 10px rgba(0, 0, 0, 0.3)); /* 添加阴影 */
|
||
|
|
// background: #0BB7BF !important;
|
||
|
|
cursor: pointer;
|
||
|
|
margin: 0;
|
||
|
|
|
||
|
|
background: transparent;
|
||
|
|
.trapezoid {
|
||
|
|
display: inline-block;
|
||
|
|
|
||
|
|
width: 130px !important;
|
||
|
|
height: 40px;
|
||
|
|
background: #f9bbd0;
|
||
|
|
clip-path: polygon(22% 0%, 79% 0%, 94% 100%, 10% 100%);
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.TitleS:hover {
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
.ces {
|
||
|
|
width: 10%;
|
||
|
|
height: 60px;
|
||
|
|
position: absolute;
|
||
|
|
left: 50%;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
clip-path: polygon(22% 0%, 79% 0%, 94% 100%, 10% 100%);
|
||
|
|
filter: drop-shadow(20px 20px 10px 10px rgba(0, 0, 0, 0.6)) !important;
|
||
|
|
}
|
||
|
|
.minerTitle {
|
||
|
|
z-index: 99;
|
||
|
|
}
|
||
|
|
.profitTitle {
|
||
|
|
position: absolute;
|
||
|
|
left: -37px !important;
|
||
|
|
z-index: 98;
|
||
|
|
margin: 0 !important;
|
||
|
|
|
||
|
|
}
|
||
|
|
.paymentTitle {
|
||
|
|
position: absolute;
|
||
|
|
left: -72px !important;
|
||
|
|
z-index: 97;
|
||
|
|
margin: 0 !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.page {
|
||
|
|
width: 100%;
|
||
|
|
min-height: 380px !important;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
box-shadow: 0px 0px 3px 3px rgba(0, 0, 0, 0.1) !important;
|
||
|
|
z-index: 999;
|
||
|
|
margin-top: -3px;
|
||
|
|
border-radius: 20px;
|
||
|
|
overflow: hidden;
|
||
|
|
background: #fff;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
.publicBox {
|
||
|
|
min-height: 300px !important;
|
||
|
|
}
|
||
|
|
.minerPagination {
|
||
|
|
margin: 0 auto;
|
||
|
|
margin-top: 30px;
|
||
|
|
margin-bottom: 30px;
|
||
|
|
}
|
||
|
|
.minerTitleBox {
|
||
|
|
width: 100%;
|
||
|
|
height: 40px;
|
||
|
|
background: #efefef;
|
||
|
|
padding: 0px !important;
|
||
|
|
|
||
|
|
|
||
|
|
.TitleOnLine {
|
||
|
|
width: 100% !important;
|
||
|
|
font-weight: 600;
|
||
|
|
display: flex;
|
||
|
|
justify-content:left;
|
||
|
|
span {
|
||
|
|
// width: 20%;
|
||
|
|
display: inline-block;
|
||
|
|
cursor: pointer;
|
||
|
|
margin-left: 18 !important;
|
||
|
|
padding: 0 !important;
|
||
|
|
font-size: 0.9rem;
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
.TitleAll{
|
||
|
|
display:flex;
|
||
|
|
width: 100% !important;
|
||
|
|
padding: 0px !important;
|
||
|
|
padding-left: 5px !important;
|
||
|
|
border-radius: 0px !important;
|
||
|
|
span:nth-of-type(1){
|
||
|
|
width: 19% !important;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
span:nth-of-type(2){
|
||
|
|
width: 38% !important;
|
||
|
|
}
|
||
|
|
span:nth-of-type(3){
|
||
|
|
width: 43% !important;
|
||
|
|
}
|
||
|
|
span{
|
||
|
|
|
||
|
|
font-size: 0.8rem;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.elTabs3 {
|
||
|
|
width: 70%;
|
||
|
|
// font-size: 1em;
|
||
|
|
position: relative;
|
||
|
|
.searchBox {
|
||
|
|
width: 25%;
|
||
|
|
position: absolute;
|
||
|
|
right: 0;
|
||
|
|
top: -5px;
|
||
|
|
z-index: 99999;
|
||
|
|
border: 2px solid #641fff;
|
||
|
|
height: 30px;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
border-radius: 25px;
|
||
|
|
overflow: hidden;
|
||
|
|
.ipt {
|
||
|
|
border: none;
|
||
|
|
outline: none;
|
||
|
|
padding: 0px 10px;
|
||
|
|
}
|
||
|
|
i {
|
||
|
|
width: 15%;
|
||
|
|
height: 101%;
|
||
|
|
background: #641fff;
|
||
|
|
color: #fff;
|
||
|
|
font-size: 1.2em;
|
||
|
|
line-height: 25px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.minerTabs {
|
||
|
|
width: 98%;
|
||
|
|
margin-left: 2%;
|
||
|
|
margin-top: 1%;
|
||
|
|
min-height: 600px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.accordionTitle {
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0px 20px;
|
||
|
|
|
||
|
|
span {
|
||
|
|
width: calc(100% / 4);
|
||
|
|
// background: #0BB7BF;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.accordionTitleAll {
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0px !important;
|
||
|
|
padding-left: 5px !important;
|
||
|
|
span:nth-of-type(1){
|
||
|
|
width: 25% !important;
|
||
|
|
}
|
||
|
|
span:nth-of-type(2){
|
||
|
|
width: 35% !important;
|
||
|
|
}
|
||
|
|
span:nth-of-type(3){
|
||
|
|
width: 40% !important;
|
||
|
|
}
|
||
|
|
span{
|
||
|
|
|
||
|
|
font-size: 0.8rem;
|
||
|
|
text-align: center;
|
||
|
|
padding-left: 5px !important;
|
||
|
|
overflow: hidden;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.Title {
|
||
|
|
height: 60px;
|
||
|
|
background: #d2c3ea;
|
||
|
|
border-radius: 5px;
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0px 30px;
|
||
|
|
span {
|
||
|
|
width: 24.5%;
|
||
|
|
color: #433278;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.TitleAll {
|
||
|
|
height: 60px;
|
||
|
|
background: #d2c3ea;
|
||
|
|
border-radius: 5px;
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0px 35px;
|
||
|
|
span {
|
||
|
|
width: calc(100% / 5);
|
||
|
|
color: #433278;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.totalTitleAll {
|
||
|
|
height: 40px !important;
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0px !important;
|
||
|
|
background: #efefef;
|
||
|
|
padding-left: 5px !important;
|
||
|
|
span:nth-of-type(1){
|
||
|
|
width: 25% !important;
|
||
|
|
}
|
||
|
|
span:nth-of-type(2){
|
||
|
|
width: 35% !important;
|
||
|
|
}
|
||
|
|
span:nth-of-type(3){
|
||
|
|
width: 40% !important;
|
||
|
|
}
|
||
|
|
span{
|
||
|
|
|
||
|
|
font-size: 0.8rem;
|
||
|
|
text-align: center;
|
||
|
|
padding-left: 5px !important;
|
||
|
|
overflow: hidden;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
white-space: nowrap;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.totalTitle {
|
||
|
|
height: 60px;
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0px 20px;
|
||
|
|
background: #efefef;
|
||
|
|
span {
|
||
|
|
width: calc(97% / 4);
|
||
|
|
|
||
|
|
text-align: left;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.miningMachine{
|
||
|
|
background: #fff;
|
||
|
|
box-shadow: 0px 0px 3px 1px #ccc;
|
||
|
|
overflow: hidden;
|
||
|
|
border-radius: 5px;
|
||
|
|
.belowTable{
|
||
|
|
border-radius: 5px !important;
|
||
|
|
width: 100% !important;
|
||
|
|
margin-bottom: 20px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.payment{
|
||
|
|
.belowTable{
|
||
|
|
box-shadow: 0px 0px 3px 1px #ccc;
|
||
|
|
|
||
|
|
|
||
|
|
.table-title{
|
||
|
|
height: 50px;
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-around;
|
||
|
|
align-items: center;
|
||
|
|
background: #D2C3EA;
|
||
|
|
color: #433278;
|
||
|
|
font-weight: 600;
|
||
|
|
width: 100%;
|
||
|
|
font-size: 0.8rem !important;
|
||
|
|
span{
|
||
|
|
display: inline-block;
|
||
|
|
}
|
||
|
|
span:nth-of-type(1){
|
||
|
|
width: 35%;
|
||
|
|
padding-left: 10px;
|
||
|
|
}
|
||
|
|
span:nth-of-type(2){
|
||
|
|
width: 35%;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
span:nth-of-type(3){
|
||
|
|
width: 27%;
|
||
|
|
text-align: center;
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.el-collapse{
|
||
|
|
width: 100%;
|
||
|
|
max-height: 500px;
|
||
|
|
overflow-y: auto;
|
||
|
|
}
|
||
|
|
.paymentCollapseTitle{
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
width: 100%;
|
||
|
|
span{
|
||
|
|
display: inline-block;
|
||
|
|
}
|
||
|
|
span:nth-of-type(1){
|
||
|
|
width: 35%;
|
||
|
|
padding-left: 10px;
|
||
|
|
}
|
||
|
|
span:nth-of-type(2){
|
||
|
|
width: 32%;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
span:nth-of-type(3){
|
||
|
|
width: 27%;
|
||
|
|
text-align:right;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.dropDownContent{
|
||
|
|
width: 100%;
|
||
|
|
padding: 0px 10px;
|
||
|
|
word-wrap: break-word;
|
||
|
|
div{
|
||
|
|
margin-top: 8px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.copy{
|
||
|
|
padding: 0px 5px;
|
||
|
|
display: inline-block;
|
||
|
|
cursor: pointer;
|
||
|
|
border:1px solid #D1C2E9;
|
||
|
|
border-radius: 5px;
|
||
|
|
margin-left: 10px;
|
||
|
|
font-size: 0.8rem;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.el-collapse{
|
||
|
|
max-height: 500px !important;
|
||
|
|
overflow-y: auto;
|
||
|
|
}
|
||
|
|
.table-item{
|
||
|
|
display: flex;
|
||
|
|
height: 59px;
|
||
|
|
width: 100%;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-around;
|
||
|
|
// background: palegoldenrod;
|
||
|
|
padding: 8px;
|
||
|
|
div{
|
||
|
|
width: 50%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
flex-direction: column;
|
||
|
|
justify-content: space-around;
|
||
|
|
height: 100%;
|
||
|
|
p{
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.table-itemOn{
|
||
|
|
display: flex;
|
||
|
|
height: 59px;
|
||
|
|
width: 100%;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: left;
|
||
|
|
// background: palegoldenrod;
|
||
|
|
padding: 8px;
|
||
|
|
div{
|
||
|
|
width: 50%;
|
||
|
|
display: flex;
|
||
|
|
align-items: left;
|
||
|
|
flex-direction: column;
|
||
|
|
justify-content: space-around;
|
||
|
|
height: 100%;
|
||
|
|
p{
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.chartTitle {
|
||
|
|
padding-left: 3%;
|
||
|
|
font-weight: 600;
|
||
|
|
color: #7245e8;
|
||
|
|
color: rgba(0, 0, 0, 0.6);
|
||
|
|
|
||
|
|
font-size: 0.9rem !important;
|
||
|
|
}
|
||
|
|
::v-deep .el-collapse-item__header{
|
||
|
|
height: 45px !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.belowTable {
|
||
|
|
width: 99%;
|
||
|
|
display: flex;
|
||
|
|
// justify-content: center;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
border-radius: 10px;
|
||
|
|
overflow: hidden;
|
||
|
|
margin: 0 auto;
|
||
|
|
padding: 0;
|
||
|
|
margin-top: -1px;
|
||
|
|
margin-bottom: 50px;
|
||
|
|
|
||
|
|
ul {
|
||
|
|
width: 100%;
|
||
|
|
min-height: 200px;
|
||
|
|
max-height: 690px;
|
||
|
|
padding: 0;
|
||
|
|
overflow: hidden;
|
||
|
|
overflow-y: auto;
|
||
|
|
margin: 0;
|
||
|
|
margin-bottom: 50px;
|
||
|
|
|
||
|
|
|
||
|
|
.table-title {
|
||
|
|
position: sticky;
|
||
|
|
top: 0px;
|
||
|
|
background: #d2c3ea;
|
||
|
|
padding: 0px 5px !important;
|
||
|
|
color: #433278;
|
||
|
|
font-weight: 600;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
height: 50px !important;
|
||
|
|
}
|
||
|
|
li {
|
||
|
|
width: 100%;
|
||
|
|
list-style: none;
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-around;
|
||
|
|
align-items: center;
|
||
|
|
height: 40px !important;
|
||
|
|
background: #f8f8fa;
|
||
|
|
span {
|
||
|
|
width: calc(100% / 3) !important;
|
||
|
|
font-size: 0.8rem !important;
|
||
|
|
text-align: center;
|
||
|
|
word-wrap: break-word; /* 允许在单词内换行 */
|
||
|
|
overflow-wrap: break-word; /* 同上，现代浏览器推荐使用 */
|
||
|
|
white-space: normal; /* 允许换行 */
|
||
|
|
}
|
||
|
|
}
|
||
|
|
li:nth-child(even) {
|
||
|
|
background-color: #ffff; /* 甚至可以是你想要的任何颜色 */
|
||
|
|
background: #f8f8fa;
|
||
|
|
}
|
||
|
|
|
||
|
|
.currency-list {
|
||
|
|
background: #efefef;
|
||
|
|
// box-shadow: 0PX 0PX 2PX 1PX rgba(0, 0, 0, 0.02);
|
||
|
|
// margin-top: 1%;
|
||
|
|
padding: 0 !important;
|
||
|
|
background: #f8f8fa;
|
||
|
|
margin-top: 5px !important;
|
||
|
|
border: 1px solid #efefef;
|
||
|
|
color: rgba(0, 0, 0, 0.9);
|
||
|
|
.txidBox {
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
box-sizing: border-box;
|
||
|
|
// padding-right: 35px;
|
||
|
|
span:nth-of-type(1) {
|
||
|
|
width: 50%;
|
||
|
|
text-align: right;
|
||
|
|
display: inline-block;
|
||
|
|
box-sizing: border-box;
|
||
|
|
margin-right: 10px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.txid {
|
||
|
|
border-left: 2px solid rgba(0, 0, 0, 0.1);
|
||
|
|
margin-left: 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.txid:hover {
|
||
|
|
cursor: pointer;
|
||
|
|
color: #2889fc;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
::v-deep .el-pager li{
|
||
|
|
min-width: 19px;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
::v-deep .el-pagination .el-select .el-input{
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
::v-deep .el-pagination .btn-next{
|
||
|
|
padding: 0px !important;
|
||
|
|
min-width: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
.activeState{
|
||
|
|
color: red !important;
|
||
|
|
}
|
||
|
|
/*修改提示框*/
|
||
|
|
.boxTitle[data-title] {
|
||
|
|
position: relative;
|
||
|
|
display: inline-block;
|
||
|
|
// 样式：
|
||
|
|
&:hover:after {
|
||
|
|
opacity: 1;
|
||
|
|
transition: all 0.1s ease 0.5s;
|
||
|
|
visibility: visible;
|
||
|
|
}
|
||
|
|
// 背景的样式 位置 字体等
|
||
|
|
&:after {
|
||
|
|
min-width: 180PX;
|
||
|
|
max-width: 300PX;
|
||
|
|
content: attr(data-title);
|
||
|
|
position: absolute;
|
||
|
|
padding: 5PX 10PX;
|
||
|
|
right: 28PX;
|
||
|
|
// bottom: -1.5em;
|
||
|
|
border-radius: 4PX;
|
||
|
|
color: rgba(255,255,255,0.8);
|
||
|
|
background-color: rgba(80, 79, 79, 0.8);
|
||
|
|
box-shadow: 0 0 4PX rgba(0, 0, 0, 0.16);
|
||
|
|
font-size: 0.8rem;
|
||
|
|
// white-space: nowrap;
|
||
|
|
visibility: hidden;
|
||
|
|
opacity: 0;
|
||
|
|
text-align: center;
|
||
|
|
z-index: 999;
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
::v-deep .el-collapse-item__header{
|
||
|
|
background: transparent;
|
||
|
|
height: 60PX;
|
||
|
|
}
|
||
|
|
|
||
|
|
.item-even {
|
||
|
|
background-color: #fff; /* 偶数行背景色 */
|
||
|
|
}
|
||
|
|
.item-odd {
|
||
|
|
background-color: #EFEFEF; /* 奇数行背景色 */
|
||
|
|
}
|
||
|
|
// .el-collapse-item:nth-child(even){
|
||
|
|
// background: #0BB7BF;
|
||
|
|
// }
|
||
|
|
// ::v-deep .el-collapse-item__header{
|
||
|
|
// background: #0BB7BF !important;
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .el-collapse-item__header:nth-child(odd) {
|
||
|
|
// background-color: #ff0000; /* 奇数项背景色 */
|
||
|
|
// }
|
||
|
|
|
||
|
|
|
||
|
|
.miningAccount{
|
||
|
|
width: 100%;
|
||
|
|
margin: 0 auto;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
// background: #F5F9FD;
|
||
|
|
background: #fff;
|
||
|
|
background-image: url(../../assets/img/miningAccount/top.png);
|
||
|
|
background-size: 100% 30%;
|
||
|
|
background-repeat: no-repeat;
|
||
|
|
background-position: 0% -8%;
|
||
|
|
// background-position: 30% -9%;
|
||
|
|
padding-top: 60PX;
|
||
|
|
}
|
||
|
|
|
||
|
|
.accountInformation{
|
||
|
|
width: 100%;
|
||
|
|
height: 30PX;
|
||
|
|
background: rgba(0, 0, 0, 0.5);
|
||
|
|
position: fixed;
|
||
|
|
top: 8%;
|
||
|
|
left: 0;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
padding: 1% 5%;
|
||
|
|
z-index: 2001;
|
||
|
|
|
||
|
|
img{
|
||
|
|
width: 23PX;
|
||
|
|
}
|
||
|
|
i{
|
||
|
|
color: #fff;
|
||
|
|
font-size: 0.9rem;
|
||
|
|
margin-left: 10PX;
|
||
|
|
|
||
|
|
}
|
||
|
|
.coin{
|
||
|
|
margin-left: 5PX;
|
||
|
|
font-weight: 600;
|
||
|
|
color: #fff;
|
||
|
|
text-transform: capitalize;
|
||
|
|
}
|
||
|
|
.ma{
|
||
|
|
font-weight: 600;
|
||
|
|
color: #fff;
|
||
|
|
margin-left: 10PX;
|
||
|
|
font-size: 0.9rem;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.DropDownChart{
|
||
|
|
width: 100%;
|
||
|
|
height: 500PX;
|
||
|
|
}
|
||
|
|
.circularDots2{
|
||
|
|
width: 11PX !important;
|
||
|
|
height: 11PX !important;
|
||
|
|
border-radius: 50%;
|
||
|
|
display: inline-block;
|
||
|
|
border:2PX solid #ccc;
|
||
|
|
}
|
||
|
|
.circularDots3.circularDots3{
|
||
|
|
display: inline-block;
|
||
|
|
width: 11PX !important;
|
||
|
|
height: 11PX !important;
|
||
|
|
margin: 0;
|
||
|
|
padding: 0 !important;
|
||
|
|
border-radius: 50%;
|
||
|
|
display: inline-block;
|
||
|
|
border:2PX solid #ccc;
|
||
|
|
}
|
||
|
|
.activeCircular{
|
||
|
|
width: 11PX !important;
|
||
|
|
height: 11PX !important;
|
||
|
|
border-radius: 50%;
|
||
|
|
border: none !important;
|
||
|
|
background: radial-gradient(circle at center, #EBACE3, #9754F1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.chartTitle{
|
||
|
|
padding-left: 3%;
|
||
|
|
font-size: 1.3em;
|
||
|
|
font-weight: 600;
|
||
|
|
color: #7245E8;
|
||
|
|
color: rgba(0,0,0,0.6);
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
.circularDots{
|
||
|
|
display: inline-block;
|
||
|
|
width: 10PX;
|
||
|
|
// background: #7592e9;
|
||
|
|
// border:2PX solid #CCC;
|
||
|
|
height: 10PX;
|
||
|
|
border-radius: 50%;
|
||
|
|
background: radial-gradient(circle at center, #EBACE3, #9754F1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.circularDotsOnLine{
|
||
|
|
display: inline-block;
|
||
|
|
width: 8PX;
|
||
|
|
background: #17CAC7;
|
||
|
|
height: 8PX;
|
||
|
|
border-radius: 50%;
|
||
|
|
}
|
||
|
|
.circularDotsOffLine{
|
||
|
|
display: inline-block;
|
||
|
|
width: 8PX;
|
||
|
|
background: #FF6565;
|
||
|
|
height: 8PX;
|
||
|
|
border-radius: 50%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.profitBox{
|
||
|
|
width: 70%;
|
||
|
|
min-height: 650PX;
|
||
|
|
// background: #8484BF;
|
||
|
|
padding: 20PX 1%;
|
||
|
|
.paymentSettingBth{
|
||
|
|
width: 100%;
|
||
|
|
text-align: right;
|
||
|
|
.el-button{
|
||
|
|
background: #7245E8;
|
||
|
|
color: #fff;
|
||
|
|
padding: 13PX 40PX;
|
||
|
|
border-radius: 8PX;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
.profitTop{
|
||
|
|
// background: paleturquoise;
|
||
|
|
display: flex;
|
||
|
|
min-height: 20%;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
margin: 0 auto ;
|
||
|
|
flex-wrap: wrap;
|
||
|
|
|
||
|
|
.box{
|
||
|
|
width: 230px;
|
||
|
|
height: 100px;
|
||
|
|
background: #fff;
|
||
|
|
box-shadow: 0PX 0PX 10PX 1PX #CCC;
|
||
|
|
border-radius: 3%;
|
||
|
|
transition: all 0.2s linear;
|
||
|
|
padding:0;
|
||
|
|
font-size: 0.95rem;
|
||
|
|
margin: 5px;
|
||
|
|
|
||
|
|
|
||
|
|
.paymentSettings{
|
||
|
|
display: flex;
|
||
|
|
// justify-content: space-between;
|
||
|
|
|
||
|
|
// background: gold;
|
||
|
|
span{
|
||
|
|
width: 45%;
|
||
|
|
background: #661FFF;
|
||
|
|
text-align: center;
|
||
|
|
color: #fff;
|
||
|
|
border-radius: 5PX;
|
||
|
|
cursor: pointer;
|
||
|
|
font-size: 0.8em;
|
||
|
|
text-align: center;
|
||
|
|
// padding: 0PX 2PX;
|
||
|
|
padding: 0;
|
||
|
|
display: inline-block;
|
||
|
|
line-height: 25PX;
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
span:hover{
|
||
|
|
background: #7A50E7;
|
||
|
|
color: #FFF;
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
span{
|
||
|
|
display: inline-block;
|
||
|
|
width: 100%;
|
||
|
|
height: 50%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0PX 20PX;
|
||
|
|
span{
|
||
|
|
width: 8%;
|
||
|
|
|
||
|
|
}
|
||
|
|
img{
|
||
|
|
width: 18PX;
|
||
|
|
margin-left: 5PX;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
.text{
|
||
|
|
justify-content: right;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
.box:hover{
|
||
|
|
box-shadow: 10PX 5PX 10PX 3PX #E4DBF3;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.profitBtm{
|
||
|
|
height: 600px;
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
|
||
|
|
.left{
|
||
|
|
width: 23%;
|
||
|
|
height: 90%;
|
||
|
|
background: #fff;
|
||
|
|
box-shadow: 0PX 0PX 5PX 2PX #CCC;
|
||
|
|
border-radius: 3%;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
.box{
|
||
|
|
width: 100%;
|
||
|
|
height: 80%;
|
||
|
|
background: #fff;
|
||
|
|
|
||
|
|
border-radius: 3%;
|
||
|
|
span{
|
||
|
|
display: inline-block;
|
||
|
|
width: 100%;
|
||
|
|
height: 50%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0PX 25PX;
|
||
|
|
}
|
||
|
|
.text{
|
||
|
|
justify-content: right;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.bth{
|
||
|
|
width: 100%;
|
||
|
|
text-align: center;
|
||
|
|
.el-button{
|
||
|
|
width: 60%;
|
||
|
|
background: #661FFF;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.right{
|
||
|
|
width: 100%;
|
||
|
|
height: 90%;
|
||
|
|
background: #fff;
|
||
|
|
box-shadow: 0PX 0PX 10PX 3PX #CCC;
|
||
|
|
border-radius: 15PX;
|
||
|
|
padding: 10PX 10PX;
|
||
|
|
transition: all 0.2s linear;
|
||
|
|
.intervalBox{
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
padding: 10PX 20PX;
|
||
|
|
font-size: 0.95rem;
|
||
|
|
|
||
|
|
.title{
|
||
|
|
// width: 10%;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 1.1em;
|
||
|
|
|
||
|
|
}
|
||
|
|
.times{
|
||
|
|
// width: 10%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
border-radius: 20PX;
|
||
|
|
padding: 1PX 1PX;
|
||
|
|
border:1PX solid #5721E4;
|
||
|
|
cursor: pointer;
|
||
|
|
|
||
|
|
span{
|
||
|
|
min-width: 55px;
|
||
|
|
text-align: center;
|
||
|
|
|
||
|
|
border-radius: 20PX;
|
||
|
|
margin: 0;
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
.timeActive{
|
||
|
|
background: #7245E8;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.right:hover{
|
||
|
|
box-shadow: 0PX 0PX 20PX 3PX #E4DBF3;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
.top1Box{
|
||
|
|
width: 90%;
|
||
|
|
height: 400PX;
|
||
|
|
background-image: linear-gradient(to right, #1E52E8 0%, #1E52E8 80%, #0BB7BF 100%);
|
||
|
|
border-radius: 10PX;
|
||
|
|
color: #fff;
|
||
|
|
font-size: 1.3em;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
|
||
|
|
.top1BoxOne{
|
||
|
|
height: 12%;
|
||
|
|
background: rgba(0,0,0,0.3);
|
||
|
|
border-radius: 28PX 1PX 100PX 1PX;
|
||
|
|
width:800PX;
|
||
|
|
padding: 5PX 20PX;
|
||
|
|
line-height: 40PX;
|
||
|
|
}
|
||
|
|
.top1BoxTwo{
|
||
|
|
flex: 1;
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
flex-wrap: wrap;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0PX 100PX;
|
||
|
|
div{
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
|
||
|
|
.income{
|
||
|
|
margin-top: 20PX;
|
||
|
|
font-size: 1.5em;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
.content{
|
||
|
|
position: relative;
|
||
|
|
padding: 0PX 50PX;
|
||
|
|
width:calc(100% / 4)
|
||
|
|
}
|
||
|
|
.iconLine{
|
||
|
|
|
||
|
|
width: 1PX;
|
||
|
|
background: rgba(255,255,255,0.6);
|
||
|
|
height: 50%;
|
||
|
|
position: absolute;
|
||
|
|
right: 0PX;
|
||
|
|
top: 25% ;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
.top1BoxThree{
|
||
|
|
height: 13%;
|
||
|
|
background: rgba(0,0,0,0.4);
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
.onlineSituation{
|
||
|
|
width: 50%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
font-size: 0.8em;
|
||
|
|
div{
|
||
|
|
width: calc(100% / 3);
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.whole{
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.onLine{
|
||
|
|
color: #04C904;
|
||
|
|
}
|
||
|
|
.off-line{
|
||
|
|
color: #EF6565
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
.top2Box{
|
||
|
|
margin-top: 1%;
|
||
|
|
width: 70%;
|
||
|
|
height: 500PX;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
margin-bottom: 2%;
|
||
|
|
padding: 0PX 1%;
|
||
|
|
|
||
|
|
.lineBOX{
|
||
|
|
// background: #0BB7BF;
|
||
|
|
width: 100%;
|
||
|
|
padding: 10PX 20PX;
|
||
|
|
border-radius: 15PX;
|
||
|
|
box-shadow: 0PX 0PX 10PX 3PX #CCC;
|
||
|
|
transition: all 0.2s linear;
|
||
|
|
background: #fff;
|
||
|
|
|
||
|
|
.intervalBox{
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
padding: 10PX 20PX;
|
||
|
|
font-size: 0.95rem;
|
||
|
|
.title{
|
||
|
|
// width: 10%;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 1.1em;
|
||
|
|
|
||
|
|
}
|
||
|
|
.times{
|
||
|
|
// width: 10%;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
border-radius: 20PX;
|
||
|
|
padding: 1PX 1PX;
|
||
|
|
border:1PX solid #5721E4;
|
||
|
|
|
||
|
|
span{
|
||
|
|
// width: 49%;
|
||
|
|
text-align: center;
|
||
|
|
padding: 0PX 15PX;
|
||
|
|
border-radius: 20PX;
|
||
|
|
margin: 0;
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.timeActive{
|
||
|
|
background: #7245E8;
|
||
|
|
color: #FFF;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.lineBOX:hover{
|
||
|
|
box-shadow: 0PX 0PX 20PX 3PX #E4DBF3;
|
||
|
|
}
|
||
|
|
.elTabs{
|
||
|
|
width: 100%;
|
||
|
|
font-size: 1em;
|
||
|
|
}
|
||
|
|
.intervalBox{
|
||
|
|
display: flex;
|
||
|
|
width: 100%;
|
||
|
|
// background: #04C904;
|
||
|
|
justify-content: right;
|
||
|
|
span{
|
||
|
|
margin-left: 1%;
|
||
|
|
cursor: pointer;
|
||
|
|
}
|
||
|
|
span:hover{
|
||
|
|
color: #7245E8;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.top3Box{
|
||
|
|
margin-top: 1%;
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
// margin-bottom: 1%;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
|
||
|
|
// background-image: url(../../assets/img/miningAccount/btm.png);
|
||
|
|
// background-size: 100% 40%;
|
||
|
|
// background-repeat: no-repeat;
|
||
|
|
// background-position: 30% 125%;
|
||
|
|
|
||
|
|
padding: 0PX 1%;
|
||
|
|
padding-bottom: 5%;
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
.tabPageBox{
|
||
|
|
width: 70%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
flex-direction: column;
|
||
|
|
margin-bottom: 10PX;
|
||
|
|
|
||
|
|
.activeHeadlines{
|
||
|
|
background: #651EFE !important;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
.tabPageTitle{
|
||
|
|
width: 70%;
|
||
|
|
height: 60PX;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
display: flex;
|
||
|
|
align-items: end;
|
||
|
|
position: relative;
|
||
|
|
// z-index: 99;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
padding: 0;
|
||
|
|
padding-left: 1%;
|
||
|
|
font-weight: 600;
|
||
|
|
.TitleS{
|
||
|
|
position: relative;
|
||
|
|
// border-radius: 300PX 260PX 0PX 0PX;
|
||
|
|
// overflow: hidden;
|
||
|
|
// clip-path: polygon(22% 0%, 79% 0%, 94% 100%, 10% 100%);
|
||
|
|
display: inline-block;
|
||
|
|
filter: drop-shadow(0PX -5PX 10PX rgba(0, 0, 0, 0.3)); /* 添加阴影 */
|
||
|
|
// background: #0BB7BF !important;
|
||
|
|
cursor: pointer;
|
||
|
|
margin: 0;
|
||
|
|
|
||
|
|
background: transparent;
|
||
|
|
.trapezoid{
|
||
|
|
display: inline-block;
|
||
|
|
width: 150PX;
|
||
|
|
height: 40PX;
|
||
|
|
background: #F9BBD0;
|
||
|
|
clip-path: polygon(22% 0%, 79% 0%, 94% 100%, 10% 100%);
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
// span{
|
||
|
|
// position: absolute;
|
||
|
|
// top:10PX;
|
||
|
|
// left: 40%;
|
||
|
|
// }
|
||
|
|
font-size: 0.95rem;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
.TitleS:hover{
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
.ces{
|
||
|
|
width: 10% ;
|
||
|
|
height: 60PX;
|
||
|
|
position: absolute;
|
||
|
|
left: 50%;
|
||
|
|
clip-path: polygon(22% 0%, 79% 0%, 94% 100%, 10% 100%);
|
||
|
|
filter: drop-shadow(20PX 20PX 10PX 10PX rgba(0,0,0,.6)) !important;
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
.minerTitle{
|
||
|
|
z-index: 99;
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
.profitTitle{
|
||
|
|
|
||
|
|
// position: absolute;
|
||
|
|
// left: 120PX;
|
||
|
|
z-index: 98;
|
||
|
|
margin-left: -40PX;
|
||
|
|
|
||
|
|
}
|
||
|
|
.paymentTitle{
|
||
|
|
// position: absolute;
|
||
|
|
// left: 230PX;
|
||
|
|
z-index: 97;
|
||
|
|
margin-left: -45PX;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
.page{
|
||
|
|
width: 100%;
|
||
|
|
min-height: 730PX;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
box-shadow: 5PX 4PX 8PX 5PX rgba(0, 0, 0, 0.1);
|
||
|
|
z-index: 999;
|
||
|
|
margin-top: -3PX;
|
||
|
|
border-radius: 20PX;
|
||
|
|
overflow: hidden;
|
||
|
|
background: #fff;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
|
||
|
|
.publicBox{
|
||
|
|
min-height: 600PX;
|
||
|
|
}
|
||
|
|
.minerPagination{
|
||
|
|
|
||
|
|
margin: 0 auto;
|
||
|
|
margin-top: 30PX;
|
||
|
|
margin-bottom: 30PX;
|
||
|
|
}
|
||
|
|
.minerTitleBox{
|
||
|
|
width: 100%;
|
||
|
|
height: 40PX;
|
||
|
|
background: #EFEFEF;
|
||
|
|
padding: 0PX 30PX;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
font-size: 0.9rem;
|
||
|
|
.TitleOnLine{
|
||
|
|
width: 60%;
|
||
|
|
font-weight: 600;
|
||
|
|
span{
|
||
|
|
// width: 20%;
|
||
|
|
display: inline-block;
|
||
|
|
cursor: pointer;
|
||
|
|
margin-left: 20PX;
|
||
|
|
padding: 0PX 5PX;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.searchBox{
|
||
|
|
width: 260px;
|
||
|
|
// position: absolute;
|
||
|
|
// right: 0;
|
||
|
|
// top: 0PX;
|
||
|
|
border:2PX solid #641FFF;
|
||
|
|
height: 30PX;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
border-radius: 25PX;
|
||
|
|
overflow: hidden;
|
||
|
|
|
||
|
|
margin: 0;
|
||
|
|
margin-right: 10px;
|
||
|
|
.inout{
|
||
|
|
border:none;
|
||
|
|
outline: none;
|
||
|
|
padding: 0PX 10PX;
|
||
|
|
background: transparent;
|
||
|
|
}
|
||
|
|
i{
|
||
|
|
width: 35px;
|
||
|
|
height: 29px;
|
||
|
|
background:#641FFF ;
|
||
|
|
color: #fff;
|
||
|
|
font-size: 1.2em;
|
||
|
|
line-height: 29PX;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
.elTabs3{
|
||
|
|
width: 70%;
|
||
|
|
font-size: 1em;
|
||
|
|
position: relative;
|
||
|
|
.searchBox{
|
||
|
|
width: 25%;
|
||
|
|
position: absolute;
|
||
|
|
right: 0;
|
||
|
|
top: -5PX;
|
||
|
|
z-index: 99999;
|
||
|
|
border:2PX solid #641FFF;
|
||
|
|
height: 30PX;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
border-radius: 25PX;
|
||
|
|
overflow: hidden;
|
||
|
|
.ipt{
|
||
|
|
border:none;
|
||
|
|
outline: none;
|
||
|
|
padding: 0PX 10PX;
|
||
|
|
}
|
||
|
|
i{
|
||
|
|
width: 15%;
|
||
|
|
height: 101%;
|
||
|
|
background:#641FFF ;
|
||
|
|
color: #fff;
|
||
|
|
font-size: 1.2em;
|
||
|
|
line-height: 25PX;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.minerTabs{
|
||
|
|
width: 98%;
|
||
|
|
margin-left: 2%;
|
||
|
|
margin-top: 1%;
|
||
|
|
min-height: 600PX;
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.accordionTitle{
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0PX 20PX;
|
||
|
|
span{
|
||
|
|
width: calc(100% / 4);
|
||
|
|
// background: #0BB7BF;
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.accordionTitleAll{
|
||
|
|
width: 100%;
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0PX 20PX;
|
||
|
|
|
||
|
|
span{
|
||
|
|
// width: calc(100% / 4) !important;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
width: 24%;
|
||
|
|
text-align: left;
|
||
|
|
padding-left: 1.5%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
.Title{
|
||
|
|
height: 60PX;
|
||
|
|
background: #D2C3EA;
|
||
|
|
border-radius: 5PX;
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0PX 30PX;
|
||
|
|
|
||
|
|
span{
|
||
|
|
width:24.5%;
|
||
|
|
color: #433278;
|
||
|
|
text-align: left;
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.TitleAll{
|
||
|
|
height: 60PX;
|
||
|
|
background: #D2C3EA;
|
||
|
|
border-radius: 5PX;
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0PX 35PX;
|
||
|
|
font-size: 0.95rem;
|
||
|
|
span{
|
||
|
|
width:calc(100% /5);
|
||
|
|
color: #433278;
|
||
|
|
text-align: left;
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.totalTitleAll{
|
||
|
|
height: 60PX;
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0PX 35PX;
|
||
|
|
background: #EFEFEF;
|
||
|
|
font-size: 0.95rem;
|
||
|
|
span{
|
||
|
|
width:calc(100% /5);
|
||
|
|
|
||
|
|
text-align: left;
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.totalTitle{
|
||
|
|
height: 60PX;
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
align-items: center;
|
||
|
|
padding: 0PX 20PX;
|
||
|
|
background: #EFEFEF;
|
||
|
|
font-size: 0.95rem;
|
||
|
|
span{
|
||
|
|
width:calc(97% /4);
|
||
|
|
|
||
|
|
text-align: left;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
.belowTable {
|
||
|
|
width: 99%;
|
||
|
|
// max-height: 750PX;
|
||
|
|
|
||
|
|
display: flex;
|
||
|
|
// justify-content: center;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
border-radius: 10PX;
|
||
|
|
// box-shadow: 0PX 0PX 10PX 3PX #CCC;
|
||
|
|
// background: goldenrod;
|
||
|
|
overflow: hidden;
|
||
|
|
// border: 1PX solid #CCC;
|
||
|
|
// background: #1E52E8;
|
||
|
|
margin: 0 auto;
|
||
|
|
padding: 0;
|
||
|
|
margin-top: -1PX;
|
||
|
|
margin-bottom: 50PX;
|
||
|
|
// z-index: 9999999;
|
||
|
|
|
||
|
|
font-size: 0.95rem;
|
||
|
|
ul {
|
||
|
|
width: 100%;
|
||
|
|
min-height: 200PX;
|
||
|
|
max-height:690PX;
|
||
|
|
padding: 0;
|
||
|
|
overflow: hidden;
|
||
|
|
overflow-y: auto;
|
||
|
|
margin: 0;
|
||
|
|
margin-bottom: 50PX;
|
||
|
|
//隐藏滚动条
|
||
|
|
// scrollbar-width: none;
|
||
|
|
// -ms-overflow-style: none;
|
||
|
|
// border-right: none;
|
||
|
|
|
||
|
|
.table-title {
|
||
|
|
position: sticky;
|
||
|
|
top: 0PX;
|
||
|
|
background: #D2C3EA;
|
||
|
|
padding: 0PX 10PX;
|
||
|
|
color: #433278;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
li {
|
||
|
|
width: 100%;
|
||
|
|
list-style: none;
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-around;
|
||
|
|
align-items: center;
|
||
|
|
height: 60PX;
|
||
|
|
background:#F8F8FA ;
|
||
|
|
span {
|
||
|
|
width: calc(100% / 4);
|
||
|
|
font-size: 0.95rem;
|
||
|
|
text-align: center;
|
||
|
|
word-wrap: break-word; /* 允许在单词内换行 */
|
||
|
|
overflow-wrap: break-word; /* 同上，现代浏览器推荐使用 */
|
||
|
|
white-space: normal; /* 允许换行 */
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
li:nth-child(even) {
|
||
|
|
background-color: #ffff; /* 甚至可以是你想要的任何颜色 */
|
||
|
|
background:#F8F8FA ;
|
||
|
|
}
|
||
|
|
|
||
|
|
.currency-list {
|
||
|
|
background: #EFEFEF;
|
||
|
|
// box-shadow: 0PX 0PX 2PX 1PX rgba(0, 0, 0, 0.02);
|
||
|
|
// margin-top: 1%;
|
||
|
|
padding: 10PX 10PX;
|
||
|
|
background:#F8F8FA ;
|
||
|
|
margin-top: 10PX;
|
||
|
|
border:1PX solid #EFEFEF;
|
||
|
|
color: rgba(0,0,0,0.9);
|
||
|
|
.txidBox{
|
||
|
|
display: flex;
|
||
|
|
justify-content: left;
|
||
|
|
box-sizing: border-box;
|
||
|
|
// padding-right: 35px;
|
||
|
|
span:nth-of-type(1){
|
||
|
|
width: 50%;
|
||
|
|
text-align: right;
|
||
|
|
display: inline-block;
|
||
|
|
box-sizing: border-box;
|
||
|
|
margin-right: 10px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.txid{
|
||
|
|
border-left:2px solid rgba(0, 0, 0, 0.1);
|
||
|
|
margin-left: 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.txid:hover{
|
||
|
|
cursor: pointer;
|
||
|
|
color: #2889FC;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.currency-list2.currency-list2.currency-list2{
|
||
|
|
|
||
|
|
background: #EFEFEF;
|
||
|
|
padding: 10PX 10PX;
|
||
|
|
}
|
||
|
|
.el-input-group__append button.el-button, .el-input-group__append div.el-select .el-input__inner, .el-input-group__append div.el-select:hover .el-input__inner, .el-input-group__prepend button.el-button, .el-input-group__prepend div.el-select .el-input__inner, .el-input-group__prepend div.el-select:hover .el-input__inner{
|
||
|
|
background: #631FFC;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.offlineTime{
|
||
|
|
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
justify-content: center;
|
||
|
|
// align-items: center;
|
||
|
|
// background: #04C904;
|
||
|
|
span{
|
||
|
|
width: 100% !important;
|
||
|
|
display:inline-block ;
|
||
|
|
line-height: 15PX !important;
|
||
|
|
}
|
||
|
|
// .timeTips{
|
||
|
|
// display:inline-block ;
|
||
|
|
// text-align: right !important;
|
||
|
|
// background: #0BB7BF;
|
||
|
|
// margin-top: 1%;
|
||
|
|
// padding-right: 45% !important;
|
||
|
|
// }
|
||
|
|
|
||
|
|
}
|
||
|
|
.sort{
|
||
|
|
font-size: 1.3em;
|
||
|
|
cursor: pointer;
|
||
|
|
color: #1E52E8;
|
||
|
|
}
|
||
|
|
.sort:hover{
|
||
|
|
color: #433299;
|
||
|
|
}
|
||
|
|
::v-deep .el-loading-spinner{
|
||
|
|
top: 25% !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
</style>
|
||
|
|
|
||
|
|
<style >
|
||
|
|
/* .el-collapse-item{
|
||
|
|
min-height: 70PX;
|
||
|
|
} */
|
||
|
|
</style>
|