2025-04-11 02:31:26 +00:00
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<section v-if="$isMobile">
|
|
|
|
|
|
|
|
|
|
<div class="imgTop">
|
|
|
|
|
<!-- <img src="../../assets/mobile/home/home.png" alt="mining" loading="lazy" /> -->
|
|
|
|
|
|
|
|
|
|
<img v-if="lang == 'zh'" src="../../assets/img/enx推广.png" alt="mining" loading="lazy"/>
|
|
|
|
|
<img v-else src="../../assets/img/enx英文推广.png" alt="mining" loading="lazy"/>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="currencySelect">
|
|
|
|
|
<el-menu class="el-menu-demo" mode="horizontal">
|
|
|
|
|
<el-submenu index="1" style="background: transparent">
|
|
|
|
|
<template slot="title">
|
|
|
|
|
<span ref="coinSelect" class="coinSelect">
|
|
|
|
|
<img :src="currencyPath" alt="coin" />
|
|
|
|
|
<span>{{handelLabel(params.coin)}}</span>
|
|
|
|
|
</span>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<ul class="moveCurrencyBox" >
|
|
|
|
|
<li @click="clickCurrency(item)" v-for="item in currencyList" :key="item.value">
|
|
|
|
|
<img :src="item.img" alt="coin" loading="lazy"/>
|
|
|
|
|
<p>{{ item.label }}</p>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</el-submenu>
|
|
|
|
|
</el-menu>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="miningPoolLeft" v-loading="minerChartLoading">
|
|
|
|
|
<div class="interval">
|
|
|
|
|
|
|
|
|
|
<div class="chartBth">
|
|
|
|
|
<div class="slideBox">
|
|
|
|
|
<span
|
|
|
|
|
@click="handelPower"
|
|
|
|
|
:class="{ slideActive: powerActive }"
|
|
|
|
|
>{{ $t(`home.CurrencyPower`) }}</span
|
|
|
|
|
>
|
|
|
|
|
<span
|
|
|
|
|
@click="handelMiner"
|
|
|
|
|
:class="{ slideActive: !powerActive }"
|
|
|
|
|
>{{ $t(`home.networkPower`) }}</span
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="timeBox">
|
|
|
|
|
<span
|
|
|
|
|
:class="{ timeActive: timeActive == item.value }"
|
|
|
|
|
class="times"
|
|
|
|
|
@click="intervalChange(item.value)"
|
|
|
|
|
v-for="item in intervalList"
|
|
|
|
|
:key="item.value"
|
|
|
|
|
>{{ $t(item.label) }}</span
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
|
|
id="chart"
|
|
|
|
|
v-if="powerActive"
|
|
|
|
|
style="width: 100%; height: 100%; min-width: 200px"
|
|
|
|
|
></div>
|
|
|
|
|
<div
|
|
|
|
|
id="minerChart"
|
|
|
|
|
v-if="!powerActive"
|
|
|
|
|
style="width: 100%; height: 100%;min-width: 200px;min-height: 380px;"
|
|
|
|
|
></div>
|
|
|
|
|
</div>
|
|
|
|
|
<section class="describeBox2">
|
|
|
|
|
<p> <i class="iconfont icon-tishishuoming "></i><span class="describeTitle">{{ $t(`home.describeTitle`) }}</span>{{ $t(`home.describe`) }} <span class="view" @click="handelJump(`/allocationExplanation`)"> {{ $t(`home.view`) }} </span> </p>
|
|
|
|
|
</section>
|
|
|
|
|
<div class="miningPoolRight">
|
|
|
|
|
<ul class="dataBlockBox">
|
|
|
|
|
<li class="dataBlock">
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.power`)">{{ $t(`home.power`) }}</p>
|
|
|
|
|
<p class="content" :title="CoinData.poolPower">
|
|
|
|
|
{{ CoinData.poolPower }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/power1.svg" alt="power" loading="lazy"/>
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="dataBlock" v-if="this.params.coin !== 'enx'">
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.networkPower`)">
|
|
|
|
|
{{ $t(`home.networkPower`) }}
|
|
|
|
|
</p>
|
|
|
|
|
<p class="content" :title="CoinData.totalPower">
|
|
|
|
|
{{ CoinData.totalPower }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/算力.svg" alt="Computing power" loading="lazy"/>
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="dataBlock" v-if="this.params.coin !== 'enx'">
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.networkDifficulty`)">
|
|
|
|
|
{{ $t(`home.networkDifficulty`) }}
|
|
|
|
|
</p>
|
|
|
|
|
<p :title="CoinData.totalDifficulty" class="content">
|
|
|
|
|
{{ CoinData.totalDifficulty }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/难度.svg" alt="difficulty" loading="lazy"/>
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<!-- <li>
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.miner`)">{{ $t(`home.miner`) }}</p>
|
|
|
|
|
<p :title="CoinData.poolMc" class="content">
|
|
|
|
|
{{ CoinData.poolMc }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/矿工数资源 22.svg" alt="" />
|
|
|
|
|
</div>
|
|
|
|
|
</li> -->
|
|
|
|
|
<li>
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.algorithm`)">
|
|
|
|
|
{{ $t(`home.algorithm`) }}
|
|
|
|
|
</p>
|
|
|
|
|
<p :title="CoinData.algorithm" class="content">
|
|
|
|
|
{{ CoinData.algorithm }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/算法资源 24.svg" alt="algorithm" />
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li v-if="this.params.coin !== 'enx'">
|
|
|
|
|
<div class="text" >
|
|
|
|
|
<p :title="$t(`home.height`)">{{ $t(`home.height`) }}</p>
|
|
|
|
|
<p :title="CoinData.height" class="content">
|
|
|
|
|
{{ CoinData.height }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/高度资源 26.svg" alt="height" loading="lazy"/>
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
<li v-if="this.params.coin !== 'enx'">
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.coinValue`)">
|
|
|
|
|
{{ $t(`home.coinValue`) }}
|
|
|
|
|
</p>
|
|
|
|
|
<p :title="CoinData.price" class="content">
|
|
|
|
|
{{ CoinData.price }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/币价资源 19.svg" alt="Currency price" loading="lazy"/>
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.mode`)">
|
|
|
|
|
{{ $t(`home.mode`) }}
|
|
|
|
|
</p>
|
|
|
|
|
<p :title="CoinData.model" class="content">
|
|
|
|
|
{{ CoinData.model }} / {{ CoinData.fee }}%
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/费率.svg" alt="Currency price" loading="lazy"/>
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li
|
|
|
|
|
id="myDiv"
|
|
|
|
|
class="profitCalculation"
|
|
|
|
|
@click="handelProfitCalculation"
|
|
|
|
|
>
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.profitCalculation`)">
|
|
|
|
|
{{ $t(`home.profitCalculation`) }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/计算器.svg" alt="Profit Calculator" loading="lazy"/>
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li
|
|
|
|
|
class="ConnectMiningPool"
|
|
|
|
|
@click="handelJump(`/AccessMiningPool`)"
|
|
|
|
|
>
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.ConnectMiningPool`)">
|
|
|
|
|
{{ $t(`home.ConnectMiningPool`) }}
|
|
|
|
|
</p>
|
|
|
|
|
<p class="content"></p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/接入矿池.svg" alt="Connect to the mining pool" loading="lazy"/>
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="reportBlock">
|
|
|
|
|
<div class="reportBlockBox" v-loading="reportBlockLoading">
|
|
|
|
|
<div class="belowTable">
|
|
|
|
|
<ul>
|
|
|
|
|
<li class="table-title2">
|
|
|
|
|
<span class="block-Height" :title="$t(`home.blockHeight`)">{{
|
|
|
|
|
$t(`home.blockHeight`)
|
|
|
|
|
}}</span>
|
|
|
|
|
<span class="block-Time" :title="$t(`home.blockingTime`)">{{
|
|
|
|
|
$t(`home.blockingTime`)
|
|
|
|
|
}}</span>
|
|
|
|
|
</li>
|
|
|
|
|
<li
|
|
|
|
|
@click="clickReportBlock"
|
|
|
|
|
class="currency-list2"
|
|
|
|
|
v-for="item in newBlockInfoData"
|
|
|
|
|
:key="item.hash"
|
|
|
|
|
>
|
|
|
|
|
<span class="block-height">{{ item.height }}</span>
|
|
|
|
|
<span class="block-time">{{ item.date }}</span>
|
|
|
|
|
<!-- <span class="hash" :title="item.hash">{{ item.hash }}</span>
|
|
|
|
|
<span>{{ item.reward }}</span>
|
|
|
|
|
<span>{{ item.fees }}</span> -->
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 收益计算器 -->
|
|
|
|
|
<section class="Calculator" v-show="showCalculator">
|
|
|
|
|
<div class="prop">
|
|
|
|
|
<div class="titleBox">
|
|
|
|
|
<span>{{ $t(`home.profitCalculation`) }}</span>
|
|
|
|
|
<i class="iconfont icon-guanbi close" @click="handelClose"></i>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="cautionBox">
|
|
|
|
|
<span>{{ $t(`home.caution`) }}</span>
|
|
|
|
|
{{ $t(`home.calculatorTips`) }}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="selectCurrency">
|
|
|
|
|
<div class="Currency2">
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="value"
|
|
|
|
|
ref="select"
|
|
|
|
|
@change="changeSelection(value)"
|
|
|
|
|
>
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in currencyList"
|
|
|
|
|
:key="item.value"
|
|
|
|
|
:label="item.label"
|
|
|
|
|
:value="item.value"
|
|
|
|
|
>
|
|
|
|
|
<div style="display: flex; align-items: center">
|
|
|
|
|
<img :src="item.imgUrl" style="float: left; width: 20px" />
|
|
|
|
|
<span style="float: left; margin-left: 5px">
|
|
|
|
|
{{ item.label }}</span
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
</el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="content2">
|
|
|
|
|
|
|
|
|
|
<div class="item">
|
|
|
|
|
<p class="power">{{ $t(`home.Power`) }}: </p>
|
|
|
|
|
<el-input
|
|
|
|
|
@change="handelCalculation"
|
|
|
|
|
style="width: 90%; height: 30px"
|
|
|
|
|
v-model="inputPower"
|
|
|
|
|
class="input-with-select"
|
|
|
|
|
>
|
|
|
|
|
<el-select
|
|
|
|
|
style="width: 100px"
|
|
|
|
|
@change="handelCalculation"
|
|
|
|
|
v-model="select"
|
|
|
|
|
slot="append"
|
|
|
|
|
>
|
|
|
|
|
<el-option label="MH/s" value="MH/s"></el-option>
|
|
|
|
|
<el-option label="GH/s" value="GH/s"></el-option>
|
|
|
|
|
<el-option label="TH/s" value="TH/s"></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-input>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
<div class="item">
|
|
|
|
|
<p class="time">{{ $t(`home.time`) }}: </p>
|
|
|
|
|
<el-select
|
|
|
|
|
@change="handelCalculation"
|
|
|
|
|
style="width: 90%"
|
|
|
|
|
v-model="time"
|
|
|
|
|
>
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in selectTime"
|
|
|
|
|
:key="item.value"
|
|
|
|
|
:label="$t(item.label)"
|
|
|
|
|
:value="item.value"
|
|
|
|
|
></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="item">
|
|
|
|
|
<p class="profit">{{ $t(`home.profit`) }}: </p>
|
|
|
|
|
<el-input
|
|
|
|
|
v-model="profit"
|
|
|
|
|
style="width: 90%; height: 20px"
|
|
|
|
|
disabled
|
|
|
|
|
:placeholder="$t(`mining.profit`)"
|
|
|
|
|
></el-input>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</section>
|
|
|
|
|
<div class="content" v-else v-loading="minerChartLoading">
|
|
|
|
|
<div class="bgBox">
|
|
|
|
|
|
|
|
|
|
<img v-if="lang == 'zh'" class="bgBoxImg2Img" src="../../assets/img/enx推广.png" alt="mining" loading="lazy"/>
|
|
|
|
|
<img v-else class="bgBoxImg2Img" src="../../assets/img/enx英文推广.png" alt="mining" loading="lazy"/>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- <img class="bgBoxImg" src="../../assets/img/enx推广.png" style="width: 100%;height: 100%;" alt="mining" loading="lazy"/> -->
|
|
|
|
|
</div>
|
|
|
|
|
<el-row>
|
|
|
|
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
|
|
|
|
<el-card>
|
|
|
|
|
<div class="monitor-list">
|
|
|
|
|
<div class="btn left" @click="scrollLeft">
|
|
|
|
|
<i class="iconfont icon-icon-prev" />
|
|
|
|
|
</div>
|
|
|
|
|
<div id="list-box" class="list-box">
|
|
|
|
|
<div id="list" class="list">
|
|
|
|
|
<div
|
|
|
|
|
v-for="item in currencyList"
|
|
|
|
|
:key="item.value"
|
|
|
|
|
@click="clickCurrency(item)"
|
|
|
|
|
class="list-item"
|
|
|
|
|
>
|
|
|
|
|
<img :src="item.img" alt="coin" />
|
|
|
|
|
<span :class="{ active: itemActive === item.value }">
|
|
|
|
|
{{ item.label }}</span
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="btn right" @click="scrollRight">
|
|
|
|
|
<i class="iconfont icon-zuoyoujiantou1" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-card>
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-row>
|
|
|
|
|
<section class="describeBox">
|
|
|
|
|
<p> <i class="iconfont icon-tishishuoming "></i><span class="describeTitle">{{ $t(`home.describeTitle`) }}</span>{{ $t(`home.describe`) }} <span class="view" @click="handelJump(`/allocationExplanation`)"> {{ $t(`home.view`) }} </span> </p>
|
|
|
|
|
</section>
|
|
|
|
|
<div class="contentBox">
|
|
|
|
|
<!-- 算力图 -->
|
|
|
|
|
<el-row>
|
|
|
|
|
<div class="currencyDescription2">
|
|
|
|
|
<section class="miningPoolBox">
|
|
|
|
|
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
|
2025-04-18 06:45:39 +00:00
|
|
|
<div class="miningPoolLeft" v-loading="minerChartLoading" v-loading-recovery="{ loading: 'minerChartLoading', recovery: ['getPoolPowerData', 'fetchNetPower'] }">
|
2025-04-11 02:31:26 +00:00
|
|
|
<div class="interval">
|
|
|
|
|
<div class="chartBth">
|
|
|
|
|
|
|
|
|
|
<div class="slideBox">
|
|
|
|
|
<span
|
|
|
|
|
@click="handelPower"
|
|
|
|
|
:class="{ slideActive: powerActive }"
|
|
|
|
|
>{{ $t(`home.CurrencyPower`) }}</span
|
|
|
|
|
>
|
|
|
|
|
<span
|
|
|
|
|
@click="handelMiner"
|
|
|
|
|
:class="{ slideActive: !powerActive }"
|
|
|
|
|
>{{ $t(`home.networkPower`) }}</span
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
<div class="timeBox" style="text-align: right;padding-right: 35px;margin-bottom: 8px;">
|
|
|
|
|
<span
|
|
|
|
|
:class="{ timeActive: timeActive == item.value }"
|
|
|
|
|
class="times"
|
|
|
|
|
@click="intervalChange(item.value)"
|
|
|
|
|
v-for="item in intervalList"
|
|
|
|
|
:key="item.value"
|
|
|
|
|
>{{ $t(item.label) }}</span
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
|
|
id="chart"
|
|
|
|
|
v-if="powerActive"
|
|
|
|
|
style="width: 100%; height: 100%; min-width: 200px"
|
|
|
|
|
></div>
|
|
|
|
|
<div
|
|
|
|
|
id="minerChart"
|
|
|
|
|
v-if="!powerActive"
|
|
|
|
|
style="width: 100%; height: 100%"
|
|
|
|
|
></div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-col>
|
|
|
|
|
|
|
|
|
|
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12">
|
|
|
|
|
<div class="miningPoolRight">
|
|
|
|
|
<ul class="dataBlockBox">
|
|
|
|
|
<li :class="{'dataBlock': this.params.coin !== 'enx'}">
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.power`)">{{ $t(`home.power`) }}</p>
|
|
|
|
|
<p class="content" :title="CoinData.poolPower">
|
|
|
|
|
{{ CoinData.poolPower }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/power1.svg" alt="power" />
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="dataBlock" v-if="this.params.coin !== 'enx'">
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.networkPower`)">
|
|
|
|
|
{{ $t(`home.networkPower`) }}
|
|
|
|
|
</p>
|
|
|
|
|
<p class="content" :title="CoinData.totalPower">
|
|
|
|
|
{{ CoinData.totalPower }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/算力.svg" alt="Computing power" />
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="dataBlock" v-if="this.params.coin !== 'enx'">
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.networkDifficulty`)">
|
|
|
|
|
{{ $t(`home.networkDifficulty`) }}
|
|
|
|
|
</p>
|
|
|
|
|
<p :title="CoinData.totalDifficulty" class="content">
|
|
|
|
|
{{ CoinData.totalDifficulty }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/难度.svg" alt="difficulty" />
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<!-- <li>
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.miner`)">{{ $t(`home.miner`) }}</p>
|
|
|
|
|
<p :title="CoinData.poolMc" class="content">
|
|
|
|
|
{{ CoinData.poolMc }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/矿工数资源 22.svg" alt="" />
|
|
|
|
|
</div>
|
|
|
|
|
</li> -->
|
|
|
|
|
<li>
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.algorithm`)">
|
|
|
|
|
{{ $t(`home.algorithm`) }}
|
|
|
|
|
</p>
|
|
|
|
|
<p :title="CoinData.algorithm" class="content">
|
|
|
|
|
{{ CoinData.algorithm }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/算法资源 24.svg" alt="algorithm" />
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li v-if="this.params.coin !== 'enx'">
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.height`)">
|
|
|
|
|
{{ $t(`home.height`) }}
|
|
|
|
|
</p>
|
|
|
|
|
<p :title="CoinData.height" class="content">
|
|
|
|
|
{{ CoinData.height }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/高度资源 26.svg" alt="height" />
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
<li v-if="this.params.coin !== 'enx'">
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.coinValue`)">
|
|
|
|
|
{{ $t(`home.coinValue`) }}
|
|
|
|
|
</p>
|
|
|
|
|
<p :title="CoinData.price" class="content">
|
|
|
|
|
{{ CoinData.price }} </p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/币价资源 19.svg" alt="Currency price" />
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li >
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.mode`)">
|
|
|
|
|
{{ $t(`home.mode`) }}
|
|
|
|
|
</p>
|
|
|
|
|
<p :title="CoinData.price" class="content" style="font-size: 0.8rem;margin-right: 5px;">
|
|
|
|
|
{{ CoinData.model }} / {{ CoinData.fee }}%</p>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/费率.svg" alt="Profit Calculator" />
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li
|
|
|
|
|
id="myDiv"
|
|
|
|
|
class="profitCalculation"
|
|
|
|
|
@click="handelProfitCalculation"
|
|
|
|
|
>
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.profitCalculation`)">
|
|
|
|
|
{{ $t(`home.profitCalculation`) }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/计算器.svg" alt="Profit Calculator" />
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li
|
|
|
|
|
class="ConnectMiningPool"
|
|
|
|
|
@click="handelJump(`/AccessMiningPool`)"
|
|
|
|
|
>
|
|
|
|
|
<div class="text">
|
|
|
|
|
<p :title="$t(`home.ConnectMiningPool`)">
|
|
|
|
|
{{ $t(`home.ConnectMiningPool`) }}
|
|
|
|
|
</p>
|
|
|
|
|
<p class="content"></p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="imgIcon">
|
|
|
|
|
<img src="../../assets/img/接入矿池.svg" alt="Connect to the mining pool" />
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
|
|
|
|
</el-col>
|
|
|
|
|
</section>
|
|
|
|
|
</div>
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
<!-- <el-row>
|
|
|
|
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
|
|
|
|
<div class="reportBlock">
|
|
|
|
|
<div class="reportBlockBox" v-loading="reportBlockLoading">
|
|
|
|
|
|
|
|
|
|
<div class="belowTable">
|
|
|
|
|
<ul>
|
|
|
|
|
<li class="table-title">
|
|
|
|
|
<span :title="$t(`home.blockHeight`)">{{$t(`home.blockHeight`)}}</span>
|
|
|
|
|
<span :title="$t(`home.blockingTime`)">{{$t(`home.blockingTime`)}}</span>
|
|
|
|
|
<span class="hash" :title="$t(`home.blockHash`)">{{$t(`home.blockHash`)}}</span>
|
|
|
|
|
<div class="blockRewards" :title="$t(`home.blockRewards`)">{{$t(`home.blockRewards`)}} ({{params.coin}})
|
|
|
|
|
<div id="boxTitle2" class="reward" :data-title="$t(`mining.blockRewards`)">
|
|
|
|
|
<img style="width:18PX" src="../../assets/img/profit.svg" alt="">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="transactionFee" :title="$t(`home.transactionFee`)">{{$t(`home.transactionFee`)}} ({{params.coin}})
|
|
|
|
|
<div id="boxTitle2" :data-title="$t(`mining.transactionFeeExplanation`)">
|
|
|
|
|
<img style="width:18PX" src="../../assets/img/profit.svg" alt="">
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
<li @click="clickReportBlock" class="currency-list" v-for="item in newBlockInfoData" :key="item.hash">
|
|
|
|
|
<span>{{ item.height }}</span>
|
|
|
|
|
<span>{{ item.date }}</span>
|
|
|
|
|
<span class="hash" :title="item.hash">{{ item.hash }}</span>
|
|
|
|
|
<span>{{ item.reward }}</span>
|
|
|
|
|
<span>{{ item.fees }}</span>
|
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-row> -->
|
|
|
|
|
</div>
|
|
|
|
|
<el-row>
|
|
|
|
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
|
|
|
|
<div class="reportBlock">
|
2025-04-18 06:45:39 +00:00
|
|
|
<div class="reportBlockBox" v-loading="reportBlockLoading" v-loading-recovery="{ loading: 'reportBlockLoading', recovery: ['getBlockInfoData'] }">
|
2025-04-11 02:31:26 +00:00
|
|
|
<div class="belowTable">
|
|
|
|
|
<ul>
|
|
|
|
|
<li class="table-title">
|
|
|
|
|
<span :title="$t(`home.blockHeight`)">{{
|
|
|
|
|
$t(`home.blockHeight`)
|
|
|
|
|
}}</span>
|
|
|
|
|
<span :title="$t(`home.blockingTime`)">{{
|
|
|
|
|
$t(`home.blockingTime`)
|
|
|
|
|
}}</span>
|
|
|
|
|
<span class="hash" :title="$t(`home.blockHash`)">{{
|
|
|
|
|
$t(`home.blockHash`)
|
|
|
|
|
}}</span>
|
|
|
|
|
<div class="blockRewards" :title="$t(`home.blockRewards`)">
|
|
|
|
|
{{ $t(`home.blockRewards`) }} ({{ handelLabel2(params.coin) }})
|
|
|
|
|
<!-- <div
|
|
|
|
|
id="boxTitle2"
|
|
|
|
|
class="reward"
|
|
|
|
|
:data-title="$t(`mining.blockRewards`)"
|
|
|
|
|
>
|
|
|
|
|
<img
|
|
|
|
|
style="width: 18px"
|
|
|
|
|
src="../../assets/img/profit.svg"
|
|
|
|
|
alt=""
|
|
|
|
|
/>
|
|
|
|
|
</div> -->
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <div
|
|
|
|
|
v-show="FeeShow"
|
|
|
|
|
class="transactionFee"
|
|
|
|
|
:title="$t(`home.transactionFee`)"
|
|
|
|
|
>
|
|
|
|
|
{{ $t(`home.transactionFee`) }} ({{ handelLabel2(params.coin) }})
|
|
|
|
|
|
|
|
|
|
</div> -->
|
|
|
|
|
</li>
|
|
|
|
|
<li
|
|
|
|
|
@click="clickReportBlock"
|
|
|
|
|
class="currency-list"
|
|
|
|
|
v-for="item in newBlockInfoData"
|
|
|
|
|
:key="item.hash"
|
|
|
|
|
>
|
|
|
|
|
<span>{{ item.height }}</span>
|
|
|
|
|
<span>{{ item.date }}</span>
|
|
|
|
|
<span class="hash" :title="item.hash">{{ item.hash }}</span>
|
|
|
|
|
<span :title="item.reward" class="reward">{{ item.reward }}</span>
|
|
|
|
|
<!-- <span v-show="FeeShow">{{ item.fees }}</span> -->
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
<!-- 收益计算器 -->
|
|
|
|
|
<section class="Calculator" v-show="showCalculator">
|
|
|
|
|
<div class="prop">
|
|
|
|
|
<div class="titleBox">
|
|
|
|
|
<span>{{ $t(`home.profitCalculation`) }}</span>
|
|
|
|
|
<i class="iconfont icon-guanbi close" @click="handelClose"></i>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="cautionBox">
|
|
|
|
|
<span>{{ $t(`home.caution`) }}</span>
|
|
|
|
|
{{ $t(`home.calculatorTips`) }}
|
|
|
|
|
</div>
|
|
|
|
|
<div class="selectCurrency">
|
|
|
|
|
<div class="Currency2">
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="value"
|
|
|
|
|
ref="select"
|
|
|
|
|
@change="changeSelection(value)"
|
|
|
|
|
>
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in currencyList"
|
|
|
|
|
:key="item.value"
|
|
|
|
|
:label="item.label"
|
|
|
|
|
:value="item.value"
|
|
|
|
|
>
|
|
|
|
|
<div style="display: flex; align-items: center">
|
|
|
|
|
<img :src="item.imgUrl" style="float: left; width: 20px" />
|
|
|
|
|
<span style="float: left; margin-left: 5px">
|
|
|
|
|
{{ item.label }}</span
|
|
|
|
|
>
|
|
|
|
|
</div>
|
|
|
|
|
</el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="content2">
|
|
|
|
|
<div class="titleS">
|
|
|
|
|
<span class="power">{{ $t(`home.Power`) }}</span>
|
|
|
|
|
<span class="time">{{ $t(`home.time`) }}</span>
|
|
|
|
|
<span class="profit">{{ $t(`home.profit`) }}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="computingPower">
|
|
|
|
|
<el-input
|
|
|
|
|
@change="handelCalculation"
|
|
|
|
|
style="width: 40%; height: 50px"
|
|
|
|
|
v-model="inputPower"
|
|
|
|
|
class="input-with-select"
|
|
|
|
|
>
|
|
|
|
|
<el-select
|
|
|
|
|
style="width: 100px"
|
|
|
|
|
@change="handelCalculation"
|
|
|
|
|
v-model="select"
|
|
|
|
|
slot="append"
|
|
|
|
|
>
|
|
|
|
|
<el-option label="MH/s" value="MH/s"></el-option>
|
|
|
|
|
<el-option label="GH/s" value="GH/s"></el-option>
|
|
|
|
|
<el-option label="TH/s" value="TH/s"></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-input>
|
|
|
|
|
<el-select
|
|
|
|
|
@change="handelCalculation"
|
|
|
|
|
style="width: 15%"
|
|
|
|
|
v-model="time"
|
|
|
|
|
>
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in selectTime"
|
|
|
|
|
:key="item.value"
|
|
|
|
|
:label="$t(item.label)"
|
|
|
|
|
:value="item.value"
|
|
|
|
|
></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
<el-input
|
|
|
|
|
v-model="profit"
|
|
|
|
|
style="width: 40%; height: 50px"
|
|
|
|
|
disabled
|
|
|
|
|
:placeholder="$t(`mining.profit`)"
|
|
|
|
|
></el-input>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</section>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import IndexJs from "./index";
|
|
|
|
|
export default {
|
|
|
|
|
metaInfo: {
|
|
|
|
|
meta: [
|
|
|
|
|
{
|
|
|
|
|
name: 'keywords',
|
|
|
|
|
content: 'M2Pool 矿池,首页,热门币种挖矿,稳定收益,Home,Popular Coins Mining,Stable Income Permission Levels,Account Privileges,Member Level Rates'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: 'description',
|
|
|
|
|
content:window.vm.$t(`seo.Home`)
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
mixins: [IndexJs],
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
|
|
// 手机端适配
|
|
|
|
|
@media screen and (min-width: 220px) and (max-width: 800px) {
|
|
|
|
|
.imgTop {
|
|
|
|
|
width: 100%;
|
|
|
|
|
// padding-left: 10%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
width: 100%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
#chart {
|
|
|
|
|
height: 400px !important;
|
|
|
|
|
}
|
|
|
|
|
.describeBox2{
|
|
|
|
|
width: 100%;
|
|
|
|
|
font-size: 0.9rem;
|
|
|
|
|
padding: 8px;
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
p{
|
|
|
|
|
width: 100% ;
|
|
|
|
|
background: transparent ;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
i{
|
|
|
|
|
color: #5721e4;
|
|
|
|
|
margin-right: 5px;
|
|
|
|
|
}
|
|
|
|
|
.describeTitle{
|
|
|
|
|
color: #5721e4;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
font-size: 0.95rem;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.view{
|
|
|
|
|
color: #5721e4;
|
|
|
|
|
margin-left: 5px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.moveCurrencyBox {
|
|
|
|
|
margin: 0;
|
|
|
|
|
padding: 0;
|
|
|
|
|
width: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
min-height: 200px;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
padding: 10px 18px;
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
background: #fff;
|
|
|
|
|
|
|
|
|
|
li {
|
|
|
|
|
list-style: none;
|
|
|
|
|
// width: calc(100% / 5);
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center !important;
|
|
|
|
|
margin-left: 10px;
|
|
|
|
|
// background: #D2C4E8;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// overflow: hidden;
|
|
|
|
|
padding: 5px 5px;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
// background: palegoldenrod;
|
|
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
width: 25px;
|
|
|
|
|
}
|
|
|
|
|
p {
|
|
|
|
|
min-width: 50px;
|
|
|
|
|
margin-top: 8px;
|
|
|
|
|
font-size: 0.85rem;
|
|
|
|
|
word-wrap: break-word;
|
|
|
|
|
word-break: break-all;
|
|
|
|
|
text-align: center;
|
|
|
|
|
text-transform: capitalize;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.currencySelect{
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
padding-left: 8px;
|
|
|
|
|
font-size: 0.85rem;
|
|
|
|
|
.el-menu-demo {
|
|
|
|
|
flex: 1;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.el-menu{
|
|
|
|
|
background: transparent;
|
|
|
|
|
}
|
|
|
|
|
// .title{
|
|
|
|
|
// width: 30%;
|
|
|
|
|
// }
|
|
|
|
|
.coinSelect{
|
|
|
|
|
img{
|
|
|
|
|
width: 25px;
|
|
|
|
|
}
|
|
|
|
|
span{
|
|
|
|
|
text-transform: capitalize;
|
|
|
|
|
margin-left: 5px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.miningPoolLeft {
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
width: 95%;
|
|
|
|
|
min-height: 300px;
|
|
|
|
|
box-shadow: 0px 0px 1px 1px #ccc;
|
|
|
|
|
padding-top: 18px;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
background: #fff;
|
|
|
|
|
|
|
|
|
|
.interval {
|
|
|
|
|
|
|
|
|
|
padding: 0px 8px;
|
|
|
|
|
font-size: 0.7rem;
|
|
|
|
|
width: 100%;
|
|
|
|
|
display:block;
|
|
|
|
|
.timeBox {
|
|
|
|
|
|
|
|
|
|
padding: 0px 10px;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
.times {
|
|
|
|
|
// background: #D2C3E9;
|
|
|
|
|
width: 15%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
// padding: 0PX 20PX;
|
|
|
|
|
line-height: 30px;
|
|
|
|
|
}
|
|
|
|
|
.times:hover {
|
|
|
|
|
color: #5721e4;
|
|
|
|
|
}
|
|
|
|
|
.timeActive {
|
|
|
|
|
color: #5721e4;
|
|
|
|
|
}
|
|
|
|
|
.chartBth {
|
|
|
|
|
|
|
|
|
|
.slideBox {
|
|
|
|
|
// width: 30%;
|
|
|
|
|
|
|
|
|
|
background-image: linear-gradient(to right, #b6e6f1 0%, #f8bbd0 100%);
|
|
|
|
|
padding: 0px 2px;
|
|
|
|
|
border-radius: 20px;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: left;
|
|
|
|
|
height: 30px;
|
|
|
|
|
width:auto;
|
|
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
// width: 50%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
border-radius: 20px;
|
|
|
|
|
height: 80%;
|
|
|
|
|
line-height: 25px;
|
|
|
|
|
// background: palegreen;
|
|
|
|
|
margin: 0;
|
|
|
|
|
transition: all 0.3s linear;
|
|
|
|
|
padding: 0px 5px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.slideActive {
|
|
|
|
|
background: #5721e4;
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.timeBox{
|
|
|
|
|
width: 100%;
|
|
|
|
|
text-align: right;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.miningPoolRight {
|
|
|
|
|
// width: 45%;
|
|
|
|
|
// width: 100%;
|
|
|
|
|
// height: 80%;
|
|
|
|
|
// margin-left: 55PX;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
// background: #2EAEFF;
|
|
|
|
|
min-width: 300px;
|
|
|
|
|
ul {
|
|
|
|
|
padding: 0;
|
|
|
|
|
padding: 0px 2%;
|
|
|
|
|
margin: 0;
|
|
|
|
|
height: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
// justify-content: end;
|
|
|
|
|
align-items: center;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
// padding-right: 10px;
|
|
|
|
|
// .dataBlock {
|
|
|
|
|
// margin: 0;
|
|
|
|
|
// margin-left: 3%;
|
|
|
|
|
// }
|
|
|
|
|
li {
|
|
|
|
|
list-style: none;
|
|
|
|
|
width:160px;
|
|
|
|
|
height: 80px;
|
|
|
|
|
background: #fff;
|
|
|
|
|
border-radius: 5%;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
box-shadow: 3px 3px 5px 2px #ccc;
|
|
|
|
|
margin-top: 18px;
|
|
|
|
|
transition: all 0.2s linear;
|
|
|
|
|
|
|
|
|
|
// margin-left: 3%;
|
|
|
|
|
// margin-left: 2%;
|
|
|
|
|
.text {
|
|
|
|
|
height: 90%;
|
|
|
|
|
width: 70%;
|
|
|
|
|
padding-left: 5%;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
|
|
|
|
p {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
// white-space: nowrap;
|
|
|
|
|
font-size: 0.9rem;
|
|
|
|
|
}
|
|
|
|
|
.content {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
font-size: 0.8rem;
|
|
|
|
|
margin-top: 23%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.imgIcon {
|
|
|
|
|
height: 90%;
|
|
|
|
|
width: 30%;
|
|
|
|
|
padding-top: 5%;
|
|
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
width: 80%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
li:hover {
|
|
|
|
|
box-shadow: 0px 0px 5px 2px #d2c3ea;
|
|
|
|
|
}
|
|
|
|
|
.profitCalculation {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
.ConnectMiningPool {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.reportBlock {
|
|
|
|
|
width: 100%;
|
|
|
|
|
// height: 900%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
max-height: 700px;
|
|
|
|
|
margin-top: 3%;
|
|
|
|
|
// margin-bottom: 1%;
|
|
|
|
|
padding-bottom: 2%;
|
|
|
|
|
// background: #fff;
|
|
|
|
|
// background-image: url(../../assets/img/miningAccount/btm.png);
|
|
|
|
|
// background-size: 100% 20%;
|
|
|
|
|
// background-repeat: no-repeat;
|
|
|
|
|
// background-position: 0% 109%;
|
|
|
|
|
background: transparent !important;
|
|
|
|
|
.reportBlockBox {
|
|
|
|
|
width: 96% !important;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
// padding: 10PX 10PX;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
transition: all 0.2s linear;
|
|
|
|
|
// background: palegoldenrod !important;
|
|
|
|
|
padding: 0 !important;
|
|
|
|
|
height: auto !important;
|
|
|
|
|
margin-top: 20px;
|
|
|
|
|
.belowTable {
|
|
|
|
|
width: 100%;
|
|
|
|
|
// height: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
margin-bottom: 100px;
|
|
|
|
|
|
|
|
|
|
ul {
|
|
|
|
|
width: 100%;
|
|
|
|
|
max-height: 650px;
|
|
|
|
|
min-height: 200px;
|
|
|
|
|
|
|
|
|
|
padding: 0;
|
|
|
|
|
margin: 0;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
|
|
|
|
border-radius: 10px !important;
|
|
|
|
|
border: 1px solid #ccc !important;
|
|
|
|
|
|
|
|
|
|
li {
|
|
|
|
|
margin: 0 !important;
|
|
|
|
|
border: none !important;
|
|
|
|
|
// background: #fff !important;
|
|
|
|
|
}
|
|
|
|
|
.table-title2 {
|
|
|
|
|
position: sticky;
|
|
|
|
|
top: 0px;
|
|
|
|
|
background: #d2c3ea !important;
|
|
|
|
|
// padding: 0px 10px;
|
|
|
|
|
color: #433278;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
height: 40px;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
// padding: 0px 30px;
|
|
|
|
|
padding-right: 10px !important;
|
|
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
font-size: 0.9rem;
|
|
|
|
|
line-height: 40px;
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
.block-Height{
|
|
|
|
|
width: 50%;
|
|
|
|
|
}
|
|
|
|
|
.block-Time{
|
|
|
|
|
width: 50%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
li:nth-child(even) {
|
|
|
|
|
background-color: #ffff;
|
|
|
|
|
background: #f8f8fa !important;
|
|
|
|
|
}
|
|
|
|
|
.currency-list2 {
|
|
|
|
|
width: 100%;
|
|
|
|
|
list-style: none;
|
|
|
|
|
display: flex;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
align-items: center;
|
|
|
|
|
height: 40px;
|
|
|
|
|
padding-right: 20px !important;
|
|
|
|
|
|
|
|
|
|
// background: rgba(0, 0, 0, 0.05);
|
|
|
|
|
span {
|
|
|
|
|
height: 100%;
|
|
|
|
|
width: 50%;
|
|
|
|
|
// line-height: 40px;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
text-align: center;
|
|
|
|
|
font-size: 0.85rem;
|
|
|
|
|
line-height: 40px;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.currency-list2 {
|
|
|
|
|
background: #efefef;
|
|
|
|
|
box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.02);
|
|
|
|
|
// margin-top: 0.5%;
|
|
|
|
|
padding: 0px 10px;
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
background: #f8f8fa;
|
|
|
|
|
border: 1px solid #efefef;
|
|
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
}
|
|
|
|
|
// .block-height{
|
|
|
|
|
// width: 50%;
|
|
|
|
|
// }
|
|
|
|
|
// .block-time{
|
|
|
|
|
// width: 50%;
|
|
|
|
|
// }
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.reportBlockBox:hover {
|
|
|
|
|
box-shadow: 3px 3px 10px 4px #d2c3e9;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.Calculator {
|
|
|
|
|
width: 100%;
|
|
|
|
|
min-height:400px;
|
|
|
|
|
background: rgba(0, 0, 0, 0.5);
|
|
|
|
|
position: fixed;
|
|
|
|
|
padding: 20px;
|
|
|
|
|
top: 10%;
|
|
|
|
|
left: 0;
|
|
|
|
|
z-index: 2001;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.prop {
|
|
|
|
|
width: 98%;
|
|
|
|
|
height: 98%;
|
|
|
|
|
background: #fafbff;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
padding: 20px;
|
|
|
|
|
padding-bottom: 50px;
|
|
|
|
|
|
|
|
|
|
.titleBox {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
// background: #2eaeff;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 35px;
|
|
|
|
|
position: relative;
|
|
|
|
|
span {
|
|
|
|
|
width: 100%;
|
|
|
|
|
text-align: left;
|
|
|
|
|
font-size: 0.95rem;
|
|
|
|
|
color: rgba(0, 0, 0, 0.7);
|
|
|
|
|
padding-left: 3%;
|
|
|
|
|
}
|
|
|
|
|
.close {
|
|
|
|
|
font-size: 1.5rem;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 1px;
|
|
|
|
|
right: 10px;
|
|
|
|
|
}
|
|
|
|
|
.close:hover {
|
|
|
|
|
color: #6e3edb;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.selectCurrency {
|
|
|
|
|
width: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
.Currency2 {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
padding: 5px;
|
|
|
|
|
margin-top: 3%;
|
|
|
|
|
img {
|
|
|
|
|
width: 28px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.cautionBox {
|
|
|
|
|
padding: 10px 10px;
|
|
|
|
|
margin-left: 3%;
|
|
|
|
|
font-size: 0.85rem;
|
|
|
|
|
color: rgba(0, 0, 0, 0.7);
|
|
|
|
|
span {
|
|
|
|
|
color: #8d72db;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.content2 {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
align-items: center;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
width: 100%;
|
|
|
|
|
.item{
|
|
|
|
|
width: 100%;
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
p{
|
|
|
|
|
margin-bottom: 8px;
|
|
|
|
|
font-size: 0.9rem;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// .el-card{
|
|
|
|
|
// padding: 0 !important;
|
|
|
|
|
// }
|
|
|
|
|
// ::v-deep .el-card__body, .el-main{
|
|
|
|
|
// padding: 10px !important;
|
|
|
|
|
// }
|
|
|
|
|
// .monitor-list{
|
|
|
|
|
// width: 100% !important;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// .left{
|
|
|
|
|
// width: 25px !important;
|
|
|
|
|
// }
|
|
|
|
|
// .right{
|
|
|
|
|
// width: 25px !important;
|
|
|
|
|
// }
|
|
|
|
|
// i{
|
|
|
|
|
// font-size: 14px !important;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// .list-item{
|
|
|
|
|
// img{
|
|
|
|
|
// width: 25px !important;
|
|
|
|
|
// }
|
|
|
|
|
// span{
|
|
|
|
|
// font-size: 0.75rem !important;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
@media screen and (min-width:800px) and (max-width: 1279px) {
|
|
|
|
|
.imgTop {
|
|
|
|
|
width: 100%;
|
|
|
|
|
// padding-left: 10%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
width: 100%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
#chart {
|
|
|
|
|
height: 400px !important;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.moveCurrencyBox {
|
|
|
|
|
margin: 0;
|
|
|
|
|
padding: 0;
|
|
|
|
|
width: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
min-height: 200px;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
padding: 10px 18px;
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
background: #fff;
|
|
|
|
|
|
|
|
|
|
li {
|
|
|
|
|
list-style: none;
|
|
|
|
|
// width: calc(100% / 5);
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center !important;
|
|
|
|
|
margin-left: 10px;
|
|
|
|
|
// background: #D2C4E8;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// overflow: hidden;
|
|
|
|
|
padding: 5px 5px;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
// background: palegoldenrod;
|
|
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
width: 25px;
|
|
|
|
|
}
|
|
|
|
|
p {
|
|
|
|
|
min-width: 50px;
|
|
|
|
|
margin-top: 8px;
|
|
|
|
|
font-size: 0.85rem;
|
|
|
|
|
word-wrap: break-word;
|
|
|
|
|
word-break: break-all;
|
|
|
|
|
text-align: center;
|
|
|
|
|
text-transform: capitalize;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.currencySelect{
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
padding-left: 8px;
|
|
|
|
|
font-size: 0.85rem;
|
|
|
|
|
.el-menu-demo {
|
|
|
|
|
flex: 1;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.el-menu{
|
|
|
|
|
background: transparent;
|
|
|
|
|
}
|
|
|
|
|
// .title{
|
|
|
|
|
// width: 30%;
|
|
|
|
|
// }
|
|
|
|
|
.coinSelect{
|
|
|
|
|
img{
|
|
|
|
|
width: 25px;
|
|
|
|
|
}
|
|
|
|
|
span{
|
|
|
|
|
text-transform: capitalize;
|
|
|
|
|
margin-left: 5px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
.miningPoolLeft {
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
width: 95%;
|
|
|
|
|
min-height: 300px;
|
|
|
|
|
box-shadow: 0px 0px 1px 1px #ccc;
|
|
|
|
|
padding-top: 18px;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
background: #fff;
|
|
|
|
|
|
|
|
|
|
.interval {
|
|
|
|
|
|
|
|
|
|
padding: 0px 8px;
|
|
|
|
|
font-size: 0.7rem;
|
|
|
|
|
width: 100%;
|
|
|
|
|
display:block;
|
|
|
|
|
.timeBox {
|
|
|
|
|
padding: 0px 10px;
|
|
|
|
|
}
|
|
|
|
|
.times {
|
|
|
|
|
// background: #D2C3E9;
|
|
|
|
|
width: 15%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
// padding: 0PX 20PX;
|
|
|
|
|
line-height: 30px;
|
|
|
|
|
}
|
|
|
|
|
.times:hover {
|
|
|
|
|
color: #5721e4;
|
|
|
|
|
}
|
|
|
|
|
.timeActive {
|
|
|
|
|
color: #5721e4;
|
|
|
|
|
}
|
|
|
|
|
.chartBth {
|
|
|
|
|
|
|
|
|
|
.slideBox {
|
|
|
|
|
// width: 30%;
|
|
|
|
|
|
|
|
|
|
background-image: linear-gradient(to right, #b6e6f1 0%, #f8bbd0 100%);
|
|
|
|
|
padding: 0px 2px;
|
|
|
|
|
border-radius: 20px;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: left;
|
|
|
|
|
height: 30px;
|
|
|
|
|
width:auto;
|
|
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
// width: 50%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
border-radius: 20px;
|
|
|
|
|
height: 80%;
|
|
|
|
|
line-height: 25px;
|
|
|
|
|
// background: palegreen;
|
|
|
|
|
margin: 0;
|
|
|
|
|
transition: all 0.3s linear;
|
|
|
|
|
padding: 0px 5px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.slideActive {
|
|
|
|
|
background: #5721e4;
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.timeBox{
|
|
|
|
|
width: 100%;
|
|
|
|
|
text-align: right;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.miningPoolRight {
|
|
|
|
|
// width: 45%;
|
|
|
|
|
// width: 100%;
|
|
|
|
|
// height: 80%;
|
|
|
|
|
// margin-left: 55PX;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
// background: #2EAEFF;
|
|
|
|
|
min-width: 300px;
|
|
|
|
|
ul {
|
|
|
|
|
padding: 0;
|
|
|
|
|
padding: 0px 2%;
|
|
|
|
|
margin: 0;
|
|
|
|
|
height: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
// justify-content: end;
|
|
|
|
|
align-items: center;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
justify-content: left;
|
|
|
|
|
// padding-right: 10px;
|
|
|
|
|
// .dataBlock {
|
|
|
|
|
// margin: 0;
|
|
|
|
|
// margin-left: 3%;
|
|
|
|
|
// }
|
|
|
|
|
li {
|
|
|
|
|
list-style: none;
|
|
|
|
|
width:160px;
|
|
|
|
|
height: 80px;
|
|
|
|
|
background: #fff;
|
|
|
|
|
border-radius: 5%;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
box-shadow: 3px 3px 5px 2px #ccc;
|
|
|
|
|
margin-top: 18px;
|
|
|
|
|
transition: all 0.2s linear;
|
|
|
|
|
// margin-left: 3%;
|
|
|
|
|
margin-left: 2%;
|
|
|
|
|
.text {
|
|
|
|
|
height: 90%;
|
|
|
|
|
width: 70%;
|
|
|
|
|
padding-left: 5%;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
|
|
|
|
p {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
// white-space: nowrap;
|
|
|
|
|
font-size: 0.9rem;
|
|
|
|
|
}
|
|
|
|
|
.content {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
font-size: 0.8rem;
|
|
|
|
|
margin-top: 23%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.imgIcon {
|
|
|
|
|
height: 90%;
|
|
|
|
|
width: 30%;
|
|
|
|
|
padding-top: 5%;
|
|
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
width: 80%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
li:hover {
|
|
|
|
|
box-shadow: 0px 0px 5px 2px #d2c3ea;
|
|
|
|
|
}
|
|
|
|
|
.profitCalculation {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
.ConnectMiningPool {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.reportBlock {
|
|
|
|
|
width: 100%;
|
|
|
|
|
// height: 900%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
max-height: 700px;
|
|
|
|
|
margin-top: 3%;
|
|
|
|
|
// margin-bottom: 1%;
|
|
|
|
|
padding-bottom: 2%;
|
|
|
|
|
// background: #fff;
|
|
|
|
|
// background-image: url(../../assets/img/miningAccount/btm.png);
|
|
|
|
|
// background-size: 100% 20%;
|
|
|
|
|
// background-repeat: no-repeat;
|
|
|
|
|
// background-position: 0% 109%;
|
|
|
|
|
background: transparent !important;
|
|
|
|
|
.reportBlockBox {
|
|
|
|
|
width: 96% !important;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
// padding: 10PX 10PX;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
transition: all 0.2s linear;
|
|
|
|
|
// background: palegoldenrod !important;
|
|
|
|
|
padding: 0 !important;
|
|
|
|
|
height: auto !important;
|
|
|
|
|
margin-top: 20px;
|
|
|
|
|
.belowTable {
|
|
|
|
|
width: 100%;
|
|
|
|
|
// height: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
margin-bottom: 100px;
|
|
|
|
|
|
|
|
|
|
ul {
|
|
|
|
|
width: 100%;
|
|
|
|
|
max-height: 650px;
|
|
|
|
|
min-height: 200px;
|
|
|
|
|
|
|
|
|
|
padding: 0;
|
|
|
|
|
margin: 0;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
|
|
|
|
border-radius: 10px !important;
|
|
|
|
|
border: 1px solid #ccc !important;
|
|
|
|
|
|
|
|
|
|
li {
|
|
|
|
|
margin: 0 !important;
|
|
|
|
|
border: none !important;
|
|
|
|
|
// background: #fff !important;
|
|
|
|
|
}
|
|
|
|
|
.table-title2 {
|
|
|
|
|
position: sticky;
|
|
|
|
|
top: 0px;
|
|
|
|
|
background: #d2c3ea !important;
|
|
|
|
|
// padding: 0px 10px;
|
|
|
|
|
color: #433278;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
height: 40px;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
// padding: 0px 30px;
|
|
|
|
|
padding-right: 10px !important;
|
|
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
font-size: 0.9rem;
|
|
|
|
|
line-height: 40px;
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
.block-Height{
|
|
|
|
|
width: 50%;
|
|
|
|
|
}
|
|
|
|
|
.block-Time{
|
|
|
|
|
width: 50%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
li:nth-child(even) {
|
|
|
|
|
background-color: #ffff;
|
|
|
|
|
background: #f8f8fa !important;
|
|
|
|
|
}
|
|
|
|
|
.currency-list2 {
|
|
|
|
|
width: 100%;
|
|
|
|
|
list-style: none;
|
|
|
|
|
display: flex;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
align-items: center;
|
|
|
|
|
height: 40px;
|
|
|
|
|
padding-right: 20px !important;
|
|
|
|
|
|
|
|
|
|
// background: rgba(0, 0, 0, 0.05);
|
|
|
|
|
span {
|
|
|
|
|
height: 100%;
|
|
|
|
|
width: 50%;
|
|
|
|
|
// line-height: 40px;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
text-align: center;
|
|
|
|
|
font-size: 0.85rem;
|
|
|
|
|
line-height: 40px;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.currency-list2 {
|
|
|
|
|
background: #efefef;
|
|
|
|
|
box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.02);
|
|
|
|
|
// margin-top: 0.5%;
|
|
|
|
|
padding: 0px 10px;
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
background: #f8f8fa;
|
|
|
|
|
border: 1px solid #efefef;
|
|
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
}
|
|
|
|
|
// .block-height{
|
|
|
|
|
// width: 50%;
|
|
|
|
|
// }
|
|
|
|
|
// .block-time{
|
|
|
|
|
// width: 50%;
|
|
|
|
|
// }
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.reportBlockBox:hover {
|
|
|
|
|
box-shadow: 3px 3px 10px 4px #d2c3e9;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.Calculator {
|
|
|
|
|
width: 100%;
|
|
|
|
|
min-height:400px;
|
|
|
|
|
background: rgba(0, 0, 0, 0.5);
|
|
|
|
|
position: fixed;
|
|
|
|
|
padding: 20px;
|
|
|
|
|
top: 10%;
|
|
|
|
|
left: 0;
|
|
|
|
|
z-index: 2001;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.prop {
|
|
|
|
|
width: 98%;
|
|
|
|
|
height: 98%;
|
|
|
|
|
background: #fafbff;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
padding: 20px;
|
|
|
|
|
padding-bottom: 50px;
|
|
|
|
|
|
|
|
|
|
.titleBox {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
// background: #2eaeff;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 35px;
|
|
|
|
|
position: relative;
|
|
|
|
|
span {
|
|
|
|
|
width: 100%;
|
|
|
|
|
text-align: left;
|
|
|
|
|
font-size: 0.95rem;
|
|
|
|
|
color: rgba(0, 0, 0, 0.7);
|
|
|
|
|
padding-left: 3%;
|
|
|
|
|
}
|
|
|
|
|
.close {
|
|
|
|
|
font-size: 1.5rem;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 1px;
|
|
|
|
|
right: 10px;
|
|
|
|
|
}
|
|
|
|
|
.close:hover {
|
|
|
|
|
color: #6e3edb;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.selectCurrency {
|
|
|
|
|
width: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
.Currency2 {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
padding: 5px;
|
|
|
|
|
margin-top: 3%;
|
|
|
|
|
img {
|
|
|
|
|
width: 28px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.cautionBox {
|
|
|
|
|
padding: 10px 10px;
|
|
|
|
|
margin-left: 3%;
|
|
|
|
|
font-size: 0.85rem;
|
|
|
|
|
color: rgba(0, 0, 0, 0.7);
|
|
|
|
|
span {
|
|
|
|
|
color: #8d72db;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.content2 {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
align-items: center;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
width: 100%;
|
|
|
|
|
.item{
|
|
|
|
|
width: 100%;
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
p{
|
|
|
|
|
margin-bottom: 8px;
|
|
|
|
|
font-size: 0.9rem;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// .el-card{
|
|
|
|
|
// padding: 0 !important;
|
|
|
|
|
// }
|
|
|
|
|
// ::v-deep .el-card__body, .el-main{
|
|
|
|
|
// padding: 10px !important;
|
|
|
|
|
// }
|
|
|
|
|
// .monitor-list{
|
|
|
|
|
// width: 100% !important;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// .left{
|
|
|
|
|
// width: 25px !important;
|
|
|
|
|
// }
|
|
|
|
|
// .right{
|
|
|
|
|
// width: 25px !important;
|
|
|
|
|
// }
|
|
|
|
|
// i{
|
|
|
|
|
// font-size: 14px !important;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// .list-item{
|
|
|
|
|
// img{
|
|
|
|
|
// width: 25px !important;
|
|
|
|
|
// }
|
|
|
|
|
// span{
|
|
|
|
|
// font-size: 0.75rem !important;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@media screen and (min-width: 500px) and (max-width: 800px) {
|
|
|
|
|
|
|
|
|
|
.Calculator {
|
|
|
|
|
width: 100%;
|
|
|
|
|
min-height:400px;
|
|
|
|
|
padding: 20px;
|
|
|
|
|
background: rgba(0, 0, 0, 0.5);
|
|
|
|
|
position: fixed;
|
|
|
|
|
top: 25%;
|
|
|
|
|
left: 0;
|
|
|
|
|
z-index: 2001;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.prop {
|
|
|
|
|
width: 80%;
|
|
|
|
|
background: #fafbff;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
padding: 20px;
|
|
|
|
|
padding-bottom: 50px;
|
|
|
|
|
|
|
|
|
|
.titleBox {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
// background: #2eaeff;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 35px;
|
|
|
|
|
position: relative;
|
|
|
|
|
span {
|
|
|
|
|
width: 100%;
|
|
|
|
|
text-align: left;
|
|
|
|
|
font-size: 0.95rem;
|
|
|
|
|
color: rgba(0, 0, 0, 0.7);
|
|
|
|
|
padding-left: 3%;
|
|
|
|
|
}
|
|
|
|
|
.close {
|
|
|
|
|
font-size: 1.5rem;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 1px;
|
|
|
|
|
right: 10px;
|
|
|
|
|
}
|
|
|
|
|
.close:hover {
|
|
|
|
|
color: #6e3edb;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.selectCurrency {
|
|
|
|
|
width: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
.Currency2 {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
padding: 5px;
|
|
|
|
|
margin-top: 3%;
|
|
|
|
|
img {
|
|
|
|
|
width: 28px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.cautionBox {
|
|
|
|
|
padding: 10px 10px;
|
|
|
|
|
margin-left: 3%;
|
|
|
|
|
font-size: 0.85rem;
|
|
|
|
|
color: rgba(0, 0, 0, 0.7);
|
|
|
|
|
span {
|
|
|
|
|
color: #8d72db;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.content2 {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
align-items: center;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
width: 100%;
|
|
|
|
|
.item{
|
|
|
|
|
width: 100%;
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
p{
|
|
|
|
|
margin-bottom: 8px;
|
|
|
|
|
font-size: 0.9rem;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/*修改提示框*/
|
|
|
|
|
#boxTitle2[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.8em;
|
|
|
|
|
// white-space: nowrap;
|
|
|
|
|
visibility: hidden;
|
|
|
|
|
opacity: 0;
|
|
|
|
|
text-align: center;
|
|
|
|
|
overflow-wrap: break-word !important;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.content {
|
|
|
|
|
width: 100%;
|
|
|
|
|
// min-height: 100vh;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// flex-direction: column;
|
|
|
|
|
overflow-y: auto;
|
|
|
|
|
.Calculator {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100vh;
|
|
|
|
|
background: rgba(0, 0, 0, 0.5);
|
|
|
|
|
position: fixed;
|
|
|
|
|
top: 0;
|
|
|
|
|
left: 0;
|
|
|
|
|
z-index: 2001;
|
|
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
|
|
|
|
.prop {
|
|
|
|
|
width: 52%;
|
|
|
|
|
height: 45%;
|
|
|
|
|
background: #fafbff;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
padding: 20px 5px;
|
|
|
|
|
|
|
|
|
|
.titleBox {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
// background: #2eaeff;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 35px;
|
|
|
|
|
position: relative;
|
|
|
|
|
span {
|
|
|
|
|
width: 100%;
|
|
|
|
|
text-align: left;
|
|
|
|
|
font-size: 1.8em;
|
|
|
|
|
color: rgba(0, 0, 0, 0.7);
|
|
|
|
|
padding-left: 3%;
|
|
|
|
|
}
|
|
|
|
|
.close {
|
|
|
|
|
font-size: 2em;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 1px;
|
|
|
|
|
right: 10px;
|
|
|
|
|
}
|
|
|
|
|
.close:hover {
|
|
|
|
|
color: #6e3edb;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.selectCurrency {
|
|
|
|
|
width: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
.Currency2 {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
padding: 5px;
|
|
|
|
|
margin-top: 3%;
|
|
|
|
|
img {
|
|
|
|
|
width: 28px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.cautionBox {
|
|
|
|
|
padding: 10px 10px;
|
|
|
|
|
margin-left: 3%;
|
|
|
|
|
font-size: 1.2em;
|
|
|
|
|
color: rgba(0, 0, 0, 0.7);
|
|
|
|
|
span {
|
|
|
|
|
color: #8d72db;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.content2 {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
align-items: center;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
.titleS {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
width: 90%;
|
|
|
|
|
margin-top: 5%;
|
|
|
|
|
span {
|
|
|
|
|
text-align: left;
|
|
|
|
|
font-size: 1.2em;
|
|
|
|
|
color: rgba(0, 0, 0, 0.7);
|
|
|
|
|
}
|
|
|
|
|
.power {
|
|
|
|
|
width: 40%;
|
|
|
|
|
}
|
|
|
|
|
.time {
|
|
|
|
|
width: 15%;
|
|
|
|
|
}
|
|
|
|
|
.profit {
|
|
|
|
|
width: 40%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.computingPower {
|
|
|
|
|
display: flex;
|
|
|
|
|
height: 50px;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
width: 90%;
|
|
|
|
|
margin-top: 1%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.bgBox {
|
|
|
|
|
// background: gold;
|
|
|
|
|
width: 100%;
|
|
|
|
|
// height: 380px;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
// background-position: 50% 28%;
|
|
|
|
|
// background-size: cover;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
position: relative;
|
|
|
|
|
// background: palegoldenrod;
|
|
|
|
|
// background-image: url(../../assets/img/enx推广.png) !important;
|
|
|
|
|
// background-size: 73vw auto !important;
|
|
|
|
|
// background-position: 13.2vw 0 ;
|
|
|
|
|
// background-repeat: no-repeat;
|
|
|
|
|
// margin-top: 50px;
|
|
|
|
|
margin: 30px 0px;
|
|
|
|
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
|
|
.bgBoxImg {
|
|
|
|
|
height: 100%;
|
|
|
|
|
position: absolute;
|
|
|
|
|
left: 23%;
|
|
|
|
|
transition: all 0.3s linear;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.bgBoxImg2Img{
|
|
|
|
|
width:73vw;
|
|
|
|
|
height: 40vh;
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
// background-image: url(../../assets/img/enx推广.png) !important;
|
|
|
|
|
// background-size: cover;
|
|
|
|
|
// background-position: 13.2vw 0 ;
|
|
|
|
|
// background-repeat: no-repeat;
|
|
|
|
|
// background: palegreen;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
}
|
|
|
|
|
// .bgBoxImg2 .bgBoxImg2Img{
|
|
|
|
|
// width:73vw;
|
|
|
|
|
|
|
|
|
|
// // object-fit: cover;
|
|
|
|
|
// }
|
|
|
|
|
.bgBoxImg:hover {
|
|
|
|
|
height: 98%;
|
|
|
|
|
position: absolute;
|
|
|
|
|
left: 23%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.container {
|
|
|
|
|
width: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
height: 80px;
|
|
|
|
|
.containerBox {
|
|
|
|
|
width: 80%;
|
|
|
|
|
display: flex;
|
|
|
|
|
background: palevioletred;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
.image-list {
|
|
|
|
|
display: flex;
|
|
|
|
|
padding: 0px 20px;
|
|
|
|
|
|
|
|
|
|
.imageBOX {
|
|
|
|
|
margin-left: 10px;
|
|
|
|
|
background: green;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;
|
|
|
|
|
padding: 8px 10px;
|
|
|
|
|
}
|
|
|
|
|
img {
|
|
|
|
|
width: 30px;
|
|
|
|
|
}
|
|
|
|
|
span {
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.contentBox {
|
|
|
|
|
width: 100%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// ::v-deep.el-color-picker__icon,.el-input,.el-textarea{
|
|
|
|
|
// width: 50% !important;
|
|
|
|
|
// }
|
|
|
|
|
.Currency2 .el-select {
|
|
|
|
|
width: 80% !important;
|
|
|
|
|
}
|
|
|
|
|
::v-deep .el-input__inner {
|
|
|
|
|
height: 50px ;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@media screen and (min-width: 220px) and (max-width: 1279px) {
|
|
|
|
|
|
|
|
|
|
::v-deep .el-input__inner {
|
|
|
|
|
height: 40px ;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// ::v-deep .el-select-dropdown .el-popper{
|
|
|
|
|
// min-width: inherit;
|
|
|
|
|
// }
|
|
|
|
|
.contentBox {
|
|
|
|
|
width: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: start;
|
|
|
|
|
align-items: center;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
// background: #2EAEFF;
|
|
|
|
|
|
|
|
|
|
// .currencyBox {
|
|
|
|
|
// width: 75%;
|
|
|
|
|
// // background: palegoldenrod;
|
|
|
|
|
// // background: gold;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// boRder:1PX solid #ccc;
|
|
|
|
|
// box-shadow: 5PX 5PX 10PX 2PX #ccc;
|
|
|
|
|
// padding: 5PX 40PX;
|
|
|
|
|
// position: relative;
|
|
|
|
|
// border-radius:10PX;
|
|
|
|
|
// // overflow: auto;
|
|
|
|
|
// // background: #B6E6F1;
|
|
|
|
|
|
|
|
|
|
// .list-box{
|
|
|
|
|
// width: calc(100vw - 100PX);
|
|
|
|
|
|
|
|
|
|
// // overflow: hidden;
|
|
|
|
|
// // background: #5721E4;
|
|
|
|
|
// }
|
|
|
|
|
// .rollingBox{
|
|
|
|
|
// display: flex;
|
|
|
|
|
// width: calc(100vw - 100PX);
|
|
|
|
|
// // background: #433278;
|
|
|
|
|
// // min-width: 130%;
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
// transform: all 2s;
|
|
|
|
|
// position: relative;
|
|
|
|
|
// left: 0;
|
|
|
|
|
// transition: left 1s;
|
|
|
|
|
// }
|
|
|
|
|
// .leftSliding{
|
|
|
|
|
// position:absolute;
|
|
|
|
|
// left: 0;
|
|
|
|
|
// top: 0;
|
|
|
|
|
// width: 3%;
|
|
|
|
|
// height: 100%;
|
|
|
|
|
// background: #D2C3E9;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
// z-index: 99;
|
|
|
|
|
// i{
|
|
|
|
|
// font-size: 1.5em;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// .rightSliding{
|
|
|
|
|
// position:absolute;
|
|
|
|
|
// top: 0;
|
|
|
|
|
// right: 0;
|
|
|
|
|
// width: 3%;
|
|
|
|
|
// height: 100%;
|
|
|
|
|
// background: #D2C3E9;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
// i{
|
|
|
|
|
// font-size: 1.5em;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// .sunCurrency {
|
|
|
|
|
// width: 7%;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// justify-content: space-between;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// flex-direction: column;
|
|
|
|
|
// padding: 5PX 2PX;
|
|
|
|
|
// border-radius: 22PX;
|
|
|
|
|
// // border: 1PX solid rgba(223, 83, 52, 0.3);
|
|
|
|
|
// cursor: pointer;
|
|
|
|
|
// font-weight: 600;
|
|
|
|
|
// margin-left: 5PX;
|
|
|
|
|
// // width: 9%;
|
|
|
|
|
// // background: rgba(223, 83, 52, 0.05);
|
|
|
|
|
// height: 70PX;
|
|
|
|
|
// font-size: 0.7em;
|
|
|
|
|
// transition: all 0.2s linear;
|
|
|
|
|
// // background: #433278;
|
|
|
|
|
|
|
|
|
|
// img {
|
|
|
|
|
// width: 35PX;
|
|
|
|
|
// margin-left: 5%;
|
|
|
|
|
// }
|
|
|
|
|
// span{
|
|
|
|
|
// text-transform: uppercase;
|
|
|
|
|
// // margin-top: 5PX;
|
|
|
|
|
// // background: gold;
|
|
|
|
|
// width:90%;
|
|
|
|
|
// text-align: center;
|
|
|
|
|
// // height: 25PX;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
// padding: 5PX 3PX;
|
|
|
|
|
// border-radius: 5PX;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// .sunCurrency:hover {
|
|
|
|
|
// // background: rgba(223, 83, 52, 0.05);
|
|
|
|
|
// // background: #D2C3E9;
|
|
|
|
|
// // font-size: 0.8em;
|
|
|
|
|
// span{
|
|
|
|
|
// background: #6E3EDB;
|
|
|
|
|
// color: #fff;
|
|
|
|
|
// }
|
|
|
|
|
// img {
|
|
|
|
|
// width: 30PX;
|
|
|
|
|
// margin-left: 5%;
|
|
|
|
|
// }
|
|
|
|
|
// // box-shadow: 0PX 0PX 5PX 3PX rgba(223, 83, 52, 0.05);
|
|
|
|
|
// // span{
|
|
|
|
|
// // background: #621BFF;
|
|
|
|
|
// // color: #fff;
|
|
|
|
|
// // border-radius: 10%;
|
|
|
|
|
|
|
|
|
|
// // }
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
.currencyDescription2 {
|
|
|
|
|
width: 100%;
|
|
|
|
|
// height: 900%;
|
|
|
|
|
// background: gold;
|
|
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;
|
|
|
|
|
// margin-top: 2%;
|
|
|
|
|
// background: #433278;
|
|
|
|
|
|
|
|
|
|
.miningPoolBox {
|
|
|
|
|
width: 75%;
|
|
|
|
|
// height: 430PX;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
padding: 0px 20px;
|
|
|
|
|
// background: #2EAEFF;
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
font-size: 0.9rem;
|
|
|
|
|
.miningPoolLeft {
|
|
|
|
|
// width: 50%;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 80%;
|
|
|
|
|
box-shadow: 0px 0px 10px 3px #ccc;
|
|
|
|
|
padding: 20px 10px;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
transition: all 0.3s linear;
|
|
|
|
|
// background: #433278;
|
|
|
|
|
height: 380px;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
min-width: 300px;
|
|
|
|
|
.interval {//111
|
|
|
|
|
// background: fuchsia;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
padding: 2px 10px;
|
|
|
|
|
|
|
|
|
|
.chartBth {
|
|
|
|
|
// width: 75%;
|
|
|
|
|
|
|
|
|
|
.slideBox {
|
|
|
|
|
// width: 30%;
|
|
|
|
|
background-image: linear-gradient(
|
|
|
|
|
to right,
|
|
|
|
|
#b6e6f1 0%,
|
|
|
|
|
#f8bbd0 100%
|
|
|
|
|
);
|
|
|
|
|
padding: 0px 2px;
|
|
|
|
|
border-radius: 20px;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
height: 30px;
|
|
|
|
|
span {
|
|
|
|
|
// width: 50%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
border-radius: 20px;
|
|
|
|
|
height: 80%;
|
|
|
|
|
line-height: 25px;
|
|
|
|
|
// background: palegreen;
|
|
|
|
|
margin: 0;
|
|
|
|
|
transition: all 0.3s linear;
|
|
|
|
|
padding: 0px 5px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
// white-space: nowrap;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.slideActive {
|
|
|
|
|
background: #5721e4;
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.timeBox {
|
|
|
|
|
padding: 0px 10px;
|
|
|
|
|
|
|
|
|
|
span{
|
|
|
|
|
margin-left: 8px;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.times {
|
|
|
|
|
|
|
|
|
|
// background: #D2C3E9;
|
|
|
|
|
|
|
|
|
|
width: 15%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
font-size: 0.9rem;
|
|
|
|
|
// padding: 0PX 20PX;
|
|
|
|
|
line-height: 30px;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
.times:hover {
|
|
|
|
|
color: #5721e4;
|
|
|
|
|
}
|
|
|
|
|
.timeActive {
|
|
|
|
|
color: #5721e4;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.miningPoolLeft:hover {
|
|
|
|
|
box-shadow: 3px 3px 10px 5px #d2c3e9;
|
|
|
|
|
}
|
|
|
|
|
.miningPoolRight {
|
|
|
|
|
// width: 45%;
|
|
|
|
|
width: 100%;
|
|
|
|
|
// height: 80%;
|
|
|
|
|
// margin-left: 55PX;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
// background: #2EAEFF;
|
|
|
|
|
min-width: 300px;
|
|
|
|
|
ul {
|
|
|
|
|
padding: 0;
|
|
|
|
|
padding: 0px 10px;
|
|
|
|
|
margin: 0;
|
|
|
|
|
height: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
// justify-content: end;
|
|
|
|
|
align-items: center;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
|
|
|
|
|
.dataBlock {
|
|
|
|
|
margin: 0;
|
|
|
|
|
margin-left: 3%;
|
|
|
|
|
}
|
|
|
|
|
li {
|
|
|
|
|
list-style: none;
|
|
|
|
|
width: calc(90% / 3);
|
|
|
|
|
height: 110px;
|
|
|
|
|
background: #fff;
|
|
|
|
|
border-radius: 5%;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
box-shadow: 3px 3px 5px 2px #ccc;
|
|
|
|
|
margin-top: 3%;
|
|
|
|
|
transition: all 0.2s linear;
|
|
|
|
|
margin-left: 3%;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
|
|
|
|
.text {
|
|
|
|
|
height: 90%;
|
|
|
|
|
width: 70%;
|
|
|
|
|
padding-left: 5%;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
p {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
// white-space: nowrap;
|
|
|
|
|
font-size: 0.85rem;
|
|
|
|
|
margin-top: 5px;
|
|
|
|
|
}
|
|
|
|
|
.content {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
word-wrap:break-word;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
// white-space: nowrap;
|
|
|
|
|
margin-top: 5px;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.imgIcon {
|
|
|
|
|
height: 90%;
|
|
|
|
|
width: 30%;
|
|
|
|
|
padding-top: 5%;
|
|
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
width: 80%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
li:hover {
|
|
|
|
|
box-shadow: 0px 0px 5px 2px #d2c3ea;
|
|
|
|
|
}
|
|
|
|
|
.profitCalculation {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
.ConnectMiningPool {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.currencyDescriptionBox {
|
|
|
|
|
width: 90%;
|
|
|
|
|
height: 600px;
|
|
|
|
|
|
|
|
|
|
// background: palevioletred;
|
|
|
|
|
// border: 1PX solid rgba(0,0,0,0.1);
|
|
|
|
|
box-shadow: 0px 0px 3px 1px #ccc;
|
|
|
|
|
margin-top: 2%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: start;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
position: relative;
|
|
|
|
|
.titleBOX {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
align-items: center;
|
|
|
|
|
padding: 20px 10px;
|
|
|
|
|
width: 100%;
|
|
|
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
|
|
|
h3 {
|
|
|
|
|
width: 90%;
|
|
|
|
|
font-size: 1rem;
|
|
|
|
|
// background: #ccc;
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.titleCurrency:hover {
|
|
|
|
|
background: rgba(223, 83, 52, 0.05);
|
|
|
|
|
font-size: 13px;
|
|
|
|
|
box-shadow: 0px 0px 5px 3px rgba(223, 83, 52, 0.05);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.titleCurrency {
|
|
|
|
|
// width: 7%;
|
|
|
|
|
// background: paleturquoise;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
align-items: center;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
padding: 8px 10px;
|
|
|
|
|
border-radius: 22px;
|
|
|
|
|
// border: 1PX solid rgba(223, 83, 52, 0.3);
|
|
|
|
|
// cursor: pointer;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
margin-left: 30px;
|
|
|
|
|
font-size: 1.1em;
|
|
|
|
|
margin-right: 1%;
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 10px;
|
|
|
|
|
right: 60px;
|
|
|
|
|
transition: all 0.2s linear;
|
|
|
|
|
img {
|
|
|
|
|
width: 35px;
|
|
|
|
|
margin-left: 1%;
|
|
|
|
|
}
|
|
|
|
|
span {
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
text-transform: uppercase;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.computationalPower {
|
|
|
|
|
height: 15%;
|
|
|
|
|
width: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
align-items: center;
|
|
|
|
|
font-size: 1.3em;
|
|
|
|
|
margin: 10px 10px;
|
|
|
|
|
.PowerBox {
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-content: center;
|
|
|
|
|
}
|
|
|
|
|
span {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
width: 100%;
|
|
|
|
|
// background: forestgreen;
|
|
|
|
|
text-align: center;
|
|
|
|
|
transition: all 0.2s linear;
|
|
|
|
|
}
|
|
|
|
|
span:hover {
|
|
|
|
|
// color: rgba(0, 0, 0, 0.9);
|
|
|
|
|
color: #df5334;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
}
|
|
|
|
|
.Power {
|
|
|
|
|
font-size: 1.5em;
|
|
|
|
|
}
|
|
|
|
|
// background: red;
|
|
|
|
|
}
|
|
|
|
|
p {
|
|
|
|
|
width: 80%;
|
|
|
|
|
margin: 0;
|
|
|
|
|
font-size: 1em;
|
|
|
|
|
margin-top: 3px;
|
|
|
|
|
margin-left: 5%;
|
|
|
|
|
// background: rgba(255,192,203,0.5);
|
|
|
|
|
text-align: left;
|
|
|
|
|
height: 8%;
|
|
|
|
|
padding: 0px 10px;
|
|
|
|
|
line-height: 50px;
|
|
|
|
|
box-shadow: 0px 0px 2px 1px #ccc;
|
|
|
|
|
margin-top: 1%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.reportBlock {
|
|
|
|
|
width: 100%;
|
|
|
|
|
// height: 900%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
max-height: 700px;
|
|
|
|
|
margin-top: 1%;
|
|
|
|
|
// margin-bottom: 1%;
|
|
|
|
|
padding-bottom: 2%;
|
|
|
|
|
|
|
|
|
|
// background-image: url(../../assets/img/miningAccount/btm.png);
|
|
|
|
|
// background-size: 100% 20%;
|
|
|
|
|
// background-repeat: no-repeat;
|
|
|
|
|
// background-position: 0% 109%;
|
|
|
|
|
background: #433278;
|
|
|
|
|
.reportBlockBox {
|
|
|
|
|
width: 75%;
|
|
|
|
|
// height: 90%;
|
|
|
|
|
// background: papayawhip;
|
|
|
|
|
// box-shadow: 0PX 0PX 10PX 3PX #ccc;
|
|
|
|
|
// background: #f5f9fd;
|
|
|
|
|
// background: #fff;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
// padding: 10PX 10PX;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
transition: all 0.2s linear;
|
|
|
|
|
|
|
|
|
|
// .top {
|
|
|
|
|
// width: 100%;
|
|
|
|
|
// height: 28%;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
// border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
|
|
|
// padding: 20px 0px;
|
|
|
|
|
// color: #fff;
|
|
|
|
|
// font-weight: 600;
|
|
|
|
|
// font-size: 1.2em;
|
|
|
|
|
// .lucky {
|
|
|
|
|
// display: flex;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// flex-direction: column;
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
// .luckyNum {
|
|
|
|
|
// font-size: 1.8em;
|
|
|
|
|
// }
|
|
|
|
|
// .luckyText {
|
|
|
|
|
// font-size: 1em;
|
|
|
|
|
// margin-top: 5%;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// div {
|
|
|
|
|
// width: 20%;
|
|
|
|
|
// background: #2eaeff;
|
|
|
|
|
// height: 100%;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// justify-content: space-around;
|
|
|
|
|
// margin-left: 3%;
|
|
|
|
|
// border-radius: 15px;
|
|
|
|
|
// box-shadow: 0px 8px 20px 0px rgba(46, 174, 255, 0.5);
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// .belowTable {
|
|
|
|
|
// width: 100%;
|
|
|
|
|
// // height: 100%;
|
|
|
|
|
|
|
|
|
|
// display: flex;
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
// flex-direction: column;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// margin-bottom: 100px;
|
|
|
|
|
// ul {
|
|
|
|
|
// width: 100%;
|
|
|
|
|
// max-height: 650px;
|
|
|
|
|
// min-height: 200px;
|
|
|
|
|
// // height: 100%;
|
|
|
|
|
// // background: #2EAEFF;
|
|
|
|
|
// // padding: 20PX 0PX;
|
|
|
|
|
// padding: 0;
|
|
|
|
|
// margin: 0;
|
|
|
|
|
// overflow: hidden;
|
|
|
|
|
// // overflow-y: auto;
|
|
|
|
|
|
|
|
|
|
// .table-title {
|
|
|
|
|
// position: sticky;
|
|
|
|
|
// top: 0px;
|
|
|
|
|
// background: #d2c3ea;
|
|
|
|
|
// padding: 0px 10px;
|
|
|
|
|
// color: #433278;
|
|
|
|
|
// .hash {
|
|
|
|
|
// width: 50%;
|
|
|
|
|
// }
|
|
|
|
|
// .blockRewards {
|
|
|
|
|
// width: 18%;
|
|
|
|
|
// font-weight: 600;
|
|
|
|
|
// font-size: 1.1em;
|
|
|
|
|
// }
|
|
|
|
|
// .transactionFee {
|
|
|
|
|
// width: 18%;
|
|
|
|
|
// font-weight: 600;
|
|
|
|
|
// font-size: 1.1em;
|
|
|
|
|
// }
|
|
|
|
|
// span {
|
|
|
|
|
// overflow: hidden;
|
|
|
|
|
// text-overflow: ellipsis;
|
|
|
|
|
// white-space: nowrap;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// li:nth-child(even) {
|
|
|
|
|
// background-color: #ffff;
|
|
|
|
|
// background: #f8f8fa;
|
|
|
|
|
// }
|
|
|
|
|
// li {
|
|
|
|
|
// width: 100%;
|
|
|
|
|
// list-style: none;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// cursor: pointer;
|
|
|
|
|
// justify-content: space-around;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// height: 60px;
|
|
|
|
|
|
|
|
|
|
// // background: rgba(0, 0, 0, 0.05);
|
|
|
|
|
// span {
|
|
|
|
|
// height: 100%;
|
|
|
|
|
// width: calc(100% / 5);
|
|
|
|
|
// line-height: 60px;
|
|
|
|
|
// font-size: 1.1em;
|
|
|
|
|
// font-weight: 600;
|
|
|
|
|
// text-align: center;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// .currency-list {
|
|
|
|
|
// background: #efefef;
|
|
|
|
|
// box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.02);
|
|
|
|
|
// // margin-top: 0.5%;
|
|
|
|
|
// padding: 0px 10px;
|
|
|
|
|
// margin-top: 10px;
|
|
|
|
|
// background: #f8f8fa;
|
|
|
|
|
// border: 1px solid #efefef;
|
|
|
|
|
// span {
|
|
|
|
|
// overflow: hidden;
|
|
|
|
|
// text-overflow: ellipsis;
|
|
|
|
|
// white-space: nowrap;
|
|
|
|
|
// }
|
|
|
|
|
// .hash {
|
|
|
|
|
// width: 50%;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
}
|
|
|
|
|
.reportBlockBox:hover {
|
|
|
|
|
box-shadow: 3px 3px 10px 4px #d2c3e9;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.EchartsBox {
|
|
|
|
|
width: 80%;
|
|
|
|
|
min-height: 300px;
|
|
|
|
|
.chart {
|
|
|
|
|
height: 300px;
|
|
|
|
|
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
|
|
|
margin-top: 2%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.formBox {
|
|
|
|
|
width: 80%;
|
|
|
|
|
min-height: 300px;
|
|
|
|
|
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
|
|
|
margin-top: 2%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.reportBlock {
|
|
|
|
|
width: 100%;
|
|
|
|
|
// height: 900%;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
max-height: 700px;
|
|
|
|
|
margin-top: 3%;
|
|
|
|
|
// margin-bottom: 1%;
|
|
|
|
|
padding-bottom: 2%;
|
|
|
|
|
|
|
|
|
|
// background-image: url(../../assets/img/miningAccount/btm.png);
|
|
|
|
|
// background-size: 100% 20%;
|
|
|
|
|
// background-repeat: no-repeat;
|
|
|
|
|
// background-position: 0% 109%;
|
|
|
|
|
|
|
|
|
|
.reportBlockBox {
|
|
|
|
|
width: 75%;
|
|
|
|
|
// height: 90%;
|
|
|
|
|
// background: papayawhip;
|
|
|
|
|
// box-shadow: 0PX 0PX 10PX 3PX #ccc;
|
|
|
|
|
// background: #f5f9fd;
|
|
|
|
|
// background: #fff;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
// padding: 10PX 10PX;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
transition: all 0.2s linear;
|
|
|
|
|
|
|
|
|
|
.top {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 28%;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
|
|
|
padding: 20px 0px;
|
|
|
|
|
color: #fff;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
font-size: 1.2em;
|
|
|
|
|
.lucky {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
.luckyNum {
|
|
|
|
|
font-size: 1.8em;
|
|
|
|
|
}
|
|
|
|
|
.luckyText {
|
|
|
|
|
font-size: 1em;
|
|
|
|
|
margin-top: 5%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
div {
|
|
|
|
|
width: 20%;
|
|
|
|
|
background: #2eaeff;
|
|
|
|
|
height: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
margin-left: 3%;
|
|
|
|
|
border-radius: 15px;
|
|
|
|
|
box-shadow: 0px 8px 20px 0px rgba(46, 174, 255, 0.5);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.belowTable {
|
|
|
|
|
width: 100%;
|
|
|
|
|
// height: 100%;
|
|
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
margin-bottom: 100px;
|
|
|
|
|
ul {
|
|
|
|
|
width: 100%;
|
|
|
|
|
max-height: 650px;
|
|
|
|
|
min-height: 200px;
|
|
|
|
|
// height: 100%;
|
|
|
|
|
// background: #2EAEFF;
|
|
|
|
|
// padding: 20PX 0PX;
|
|
|
|
|
padding: 0;
|
|
|
|
|
margin: 0;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
// overflow-y: auto;
|
|
|
|
|
// background: #2EAEFF;
|
|
|
|
|
|
|
|
|
|
.table-title {
|
|
|
|
|
position: sticky;
|
|
|
|
|
top: 0px;
|
|
|
|
|
background: #d2c3ea;
|
|
|
|
|
padding: 0px 10px;
|
|
|
|
|
color: #433278;
|
|
|
|
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
.hash {
|
|
|
|
|
width: 58%;
|
|
|
|
|
text-align: left;
|
|
|
|
|
margin-left: 5%;
|
|
|
|
|
}
|
|
|
|
|
.blockRewards {
|
|
|
|
|
width: 18%;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
font-size: 0.95em;
|
|
|
|
|
text-align: left;
|
|
|
|
|
margin-left: 1%
|
|
|
|
|
}
|
|
|
|
|
.transactionFee {
|
|
|
|
|
width: 18%;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
font-size: 0.95em;
|
|
|
|
|
}
|
|
|
|
|
span {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
font-size: 0.95em;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
li:nth-child(even) {
|
|
|
|
|
background-color: #ffff;
|
|
|
|
|
background: #f8f8fa;
|
|
|
|
|
}
|
|
|
|
|
li {
|
|
|
|
|
width: 100%;
|
|
|
|
|
list-style: none;
|
|
|
|
|
display: flex;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
align-items: center;
|
|
|
|
|
height: 60px;
|
|
|
|
|
|
|
|
|
|
// background: rgba(0, 0, 0, 0.05);
|
|
|
|
|
span {
|
|
|
|
|
height: 100%;
|
|
|
|
|
width: calc(100% / 5);
|
|
|
|
|
line-height: 60px;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
text-align: center;
|
|
|
|
|
font-size: 0.95rem;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.currency-list {
|
|
|
|
|
background: #efefef;
|
|
|
|
|
box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.02);
|
|
|
|
|
// margin-top: 0.5%;
|
|
|
|
|
padding: 0px 10px;
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
background: #f8f8fa;
|
|
|
|
|
border: 1px solid #efefef;
|
|
|
|
|
span {
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
}
|
|
|
|
|
.hash {
|
|
|
|
|
width: 58%;
|
|
|
|
|
margin-left: 5%;
|
|
|
|
|
text-align: left;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.reward{
|
|
|
|
|
width: 18%;
|
|
|
|
|
text-align: left;
|
|
|
|
|
margin-left: 1%;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.reportBlockBox:hover {
|
|
|
|
|
box-shadow: 3px 3px 10px 4px #d2c3e9;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.interval {
|
|
|
|
|
// display: flex;
|
|
|
|
|
// background: red;
|
|
|
|
|
// width: 100%;
|
|
|
|
|
// height: 30PX;
|
|
|
|
|
span {
|
|
|
|
|
margin-left: 10px;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
transition: all 0.2s linear;
|
|
|
|
|
}
|
|
|
|
|
span:hover {
|
|
|
|
|
color: #2eaeff;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.footerBox {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 300px;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
align-items: center;
|
|
|
|
|
background: rgba(204, 204, 204, 0.1);
|
|
|
|
|
// margin-top: 1%;
|
|
|
|
|
}
|
|
|
|
|
.footerSon {
|
|
|
|
|
width: calc(100% / 3);
|
|
|
|
|
height: 80%;
|
|
|
|
|
border-right: 1px solid rgba(0, 0, 0, 0.1);
|
|
|
|
|
// background: greenyellow;
|
|
|
|
|
}
|
|
|
|
|
.active {
|
|
|
|
|
background: #6e3edb;
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.el-card {
|
|
|
|
|
background: transparent;
|
|
|
|
|
padding-left: 12%;
|
|
|
|
|
box-shadow: none;
|
|
|
|
|
border: none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.monitor-list {
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
height: 9vh;
|
|
|
|
|
width: 86%;
|
|
|
|
|
// background: #fff;
|
|
|
|
|
box-shadow: 0px 0px 10px 3px #ccc;
|
|
|
|
|
border-radius: 5px;
|
|
|
|
|
background: #fff;
|
|
|
|
|
// background: #2eaeff;
|
|
|
|
|
i {
|
|
|
|
|
font-size: 0.8em;
|
|
|
|
|
}
|
|
|
|
|
.btn {
|
|
|
|
|
// border: 1PX solid #b3d8ff;
|
|
|
|
|
width: 50px;
|
|
|
|
|
height: 100%;
|
|
|
|
|
line-height: 9vh;
|
|
|
|
|
text-align: center;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
background-color: #ecf5ff;
|
|
|
|
|
// icon
|
|
|
|
|
font-size: 24px;
|
|
|
|
|
color: #000;
|
|
|
|
|
background: #d2c3e9;
|
|
|
|
|
transition: all 0.3s linear;
|
|
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
|
background-color: #e0dfff;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.left {
|
|
|
|
|
border-radius: 5px 0px 0px 5px;
|
|
|
|
|
box-shadow: 0px 0px 5px 1px #ccc;
|
|
|
|
|
}
|
|
|
|
|
.right {
|
|
|
|
|
border-radius: 0px 5px 5px 0px;
|
|
|
|
|
box-shadow: 0px 0px 5px 1px #ccc;
|
|
|
|
|
}
|
|
|
|
|
.list-box {
|
|
|
|
|
width: calc(100vw - 100px);
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-items: center;
|
|
|
|
|
.list {
|
|
|
|
|
// width: calc(100vw - 100PX);
|
|
|
|
|
width: 100%;
|
|
|
|
|
display: flex;
|
|
|
|
|
transform: all 2s;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-items: center;
|
|
|
|
|
padding-left: 2%; //添加币种的时候取消
|
|
|
|
|
|
|
|
|
|
height: 90%;
|
|
|
|
|
.list-item {
|
|
|
|
|
width: 120px;
|
|
|
|
|
height: 95%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
// background: palegoldenrod;
|
|
|
|
|
// padding: 10PX;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
margin-left: 18px;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
border-radius: 10px;
|
|
|
|
|
transition: all 0.3s linear;
|
|
|
|
|
padding: 5px;
|
|
|
|
|
span {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 25%;
|
|
|
|
|
border-radius: 5px;
|
|
|
|
|
padding: 0px 2px;
|
|
|
|
|
text-transform: capitalize;
|
|
|
|
|
font-size: 0.8rem;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
}
|
|
|
|
|
img {
|
|
|
|
|
width: 2.3vw;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.list-item:hover {
|
|
|
|
|
font-size: 1rem;
|
|
|
|
|
box-shadow: 0px 0px 3px 1px rgba(210, 195, 234, 0.8);
|
|
|
|
|
// padding: 5PX;
|
|
|
|
|
span {
|
|
|
|
|
background: #6e3edb;
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
img {
|
|
|
|
|
width: 38px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
position: relative;
|
|
|
|
|
left: 0;
|
|
|
|
|
transition: left 1s;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// -----------------------
|
|
|
|
|
// .currencyBox {
|
|
|
|
|
// width: 75%;
|
|
|
|
|
// // background: palegoldenrod;
|
|
|
|
|
// // background: gold;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// border: 1px solid #ccc;
|
|
|
|
|
// box-shadow: 5px 5px 10px 2px #ccc;
|
|
|
|
|
// padding: 5px 20px;
|
|
|
|
|
// position: relative;
|
|
|
|
|
// border-radius: 10px;
|
|
|
|
|
// overflow: hidden;
|
|
|
|
|
|
|
|
|
|
// .leftSliding {
|
|
|
|
|
// position: absolute;
|
|
|
|
|
// left: 0;
|
|
|
|
|
// top: 0;
|
|
|
|
|
// width: 3%;
|
|
|
|
|
// height: 100%;
|
|
|
|
|
// background: #D2C3E9;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
// i {
|
|
|
|
|
// font-size: 1.5em;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
// .rightSliding {
|
|
|
|
|
// position: absolute;
|
|
|
|
|
// top: 0;
|
|
|
|
|
// right: 0;
|
|
|
|
|
// width: 3%;
|
|
|
|
|
// height: 100%;
|
|
|
|
|
// background: #D2C3E9;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
// i {
|
|
|
|
|
// font-size: 1.5em;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
// .currencyContent {
|
|
|
|
|
// width: 94%; // 调整为扣除左右滑动模块后的宽度
|
|
|
|
|
// overflow: auto;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// flex-wrap: nowrap;
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
// .sunCurrency {
|
|
|
|
|
// width: 7%;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// justify-content: space-between;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// flex-direction: column;
|
|
|
|
|
// padding: 5px 2px;
|
|
|
|
|
// border-radius: 22px;
|
|
|
|
|
// // border: 1px solid rgba(223, 83, 52, 0.3);
|
|
|
|
|
// cursor: pointer;
|
|
|
|
|
// font-weight: 600;
|
|
|
|
|
// margin-left: 5px;
|
|
|
|
|
// // width: 9%;
|
|
|
|
|
// // background: rgba(223, 83, 52, 0.05);
|
|
|
|
|
// height: 70px;
|
|
|
|
|
// font-size: 0.7em;
|
|
|
|
|
// transition: all 0.2s linear;
|
|
|
|
|
// // background: #433278;
|
|
|
|
|
|
|
|
|
|
// img {
|
|
|
|
|
// width: 35px;
|
|
|
|
|
// margin-left: 5%;
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
// span {
|
|
|
|
|
// text-transform: uppercase;
|
|
|
|
|
// // margin-top: 5px;
|
|
|
|
|
// // background: gold;
|
|
|
|
|
// width: 90%;
|
|
|
|
|
// text-align: center;
|
|
|
|
|
// // height: 25px;
|
|
|
|
|
// display: flex;
|
|
|
|
|
// align-items: center;
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
// padding: 5px 3px;
|
|
|
|
|
// border-radius: 5px;
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
// .sunCurrency:hover {
|
|
|
|
|
// // background: rgba(223, 83, 52, 0.05);
|
|
|
|
|
// // background: #D2C3E9;
|
|
|
|
|
// // font-size: 0.8em;
|
|
|
|
|
// span {
|
|
|
|
|
// background: #6E3EDB;
|
|
|
|
|
// color: #fff;
|
|
|
|
|
// }
|
|
|
|
|
// img {
|
|
|
|
|
// width: 30px;
|
|
|
|
|
// margin-left: 5%;
|
|
|
|
|
// }
|
|
|
|
|
// // box-shadow: 0px 0px 5px 3px rgba(223, 83, 52, 0.05);
|
|
|
|
|
// // span{
|
|
|
|
|
// // background: #621BFF;
|
|
|
|
|
// // color: #fff;
|
|
|
|
|
// // border-radius: 10%;
|
|
|
|
|
|
|
|
|
|
// // }
|
|
|
|
|
// }
|
|
|
|
|
// }
|
|
|
|
|
.timeActive {
|
|
|
|
|
color: #5721e4;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
.describeBox{
|
|
|
|
|
width: 100%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
margin-top: 30px;
|
|
|
|
|
font-size: 0.85rem;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
max-height: 100px;
|
|
|
|
|
|
|
|
|
|
p{
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
width: 72%;
|
|
|
|
|
text-align: left;
|
|
|
|
|
padding: 0px 20px;
|
|
|
|
|
background: #e7dff3;
|
|
|
|
|
border-radius: 8px;
|
|
|
|
|
padding: 10px 20px;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: start;
|
|
|
|
|
.describeTitle{
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
color: #6E3EDB;
|
|
|
|
|
}
|
|
|
|
|
i{
|
|
|
|
|
color: #6E3EDB;
|
|
|
|
|
margin-right: 5px;
|
|
|
|
|
line-height: 18px;
|
|
|
|
|
}
|
|
|
|
|
// letter-spacing: 2px;
|
|
|
|
|
.view{
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
margin-left: 8px;
|
|
|
|
|
color: #6E3EDB;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
.view:hover{
|
|
|
|
|
|
|
|
|
|
color: #000;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
.el-input.is-disabled .el-input__inner {
|
|
|
|
|
color: rgba(0, 0, 0, 0.8);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
@media screen and (min-width: 220px) and (max-width: 1279px) {
|
|
|
|
|
.el-menu--horizontal {
|
|
|
|
|
width: 100%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
</style>
|
