2025-04-11 02:31:26 +00:00
|
|
|
|
|
|
|
|
|
import { watch } from "vue";
|
|
|
|
|
import { getCoinInfo, getPoolPower, getMinerCount, getLuck, getBlockInfo, getNetPower, getParam } from "../../api/home"
|
|
|
|
|
import { line } from "../../utils/echarts";
|
|
|
|
|
import * as echarts from "echarts";
|
|
|
|
|
import { Debounce, throttle } from "../../utils/publicMethods";
|
|
|
|
|
|
|
|
|
|
export default {
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
activeName: "second",
|
|
|
|
|
|
|
|
|
|
option: {
|
|
|
|
|
tooltip: {
|
|
|
|
|
trigger: "axis",
|
|
|
|
|
//解决tooltip显示不全问题1
|
|
|
|
|
confine: true,
|
|
|
|
|
|
|
|
|
|
formatter: function (params) {
|
|
|
|
|
var res
|
|
|
|
|
res = params[0].axisValueLabel;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
for (let i = 0; i <= params.length - 1; i++) {
|
|
|
|
|
|
|
|
|
|
if (params[i].seriesName == "Currency Price" || params[i].seriesName == "币价") {
|
|
|
|
|
res += `</br>${params[i].marker} ${params[i].seriesName}      <span style="font-weight: bold">${params[i].value} USD</span>`
|
|
|
|
|
} else {
|
|
|
|
|
res += `</br>${params[i].marker} ${params[i].seriesName}      <span style="font-weight: bold">${params[i].value}</span>`
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return res;
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
legend: {
|
|
|
|
|
right: "30",
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
// grid: {//解决Y轴显示不全
|
|
|
|
|
// left: "10%",//10%
|
|
|
|
|
// containLabel: true
|
|
|
|
|
// },
|
|
|
|
|
grid: {
|
|
|
|
|
left: "10%",
|
|
|
|
|
right: "15%",
|
|
|
|
|
top: "20%",
|
|
|
|
|
bottom: "12%",
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
xAxis: {
|
|
|
|
|
// type: "time",
|
|
|
|
|
boundaryGap: false,
|
|
|
|
|
|
|
|
|
|
// axisTick: {
|
|
|
|
|
// //去除刻度
|
|
|
|
|
// show: false,
|
|
|
|
|
// },
|
|
|
|
|
// axisLine: {
|
|
|
|
|
// //去除轴线
|
|
|
|
|
// show: false,
|
|
|
|
|
// },
|
|
|
|
|
data: []
|
|
|
|
|
},
|
|
|
|
|
yAxis: [
|
|
|
|
|
{
|
|
|
|
|
// position: "left",
|
|
|
|
|
type: "value",
|
|
|
|
|
name: "GH/s",
|
|
|
|
|
nameTextStyle: {
|
|
|
|
|
|
|
|
|
|
padding: [0, 0, 0, -40],
|
2025-05-16 06:01:38 +00:00
|
|
|
|
},
|
2025-04-11 02:31:26 +00:00
|
|
|
|
// min: `dataMin`,
|
|
|
|
|
// max: `dataMax`,
|
2025-05-16 06:01:38 +00:00
|
|
|
|
axisLabel: {
|
|
|
|
|
formatter: function (value) {
|
|
|
|
|
// let data
|
|
|
|
|
// if (value > 10000000) {
|
|
|
|
|
// data = `${(value / 10000000)} KW`
|
|
|
|
|
// } else if (value > 1000000) {
|
|
|
|
|
// data = `${(value / 1000000)} M`
|
|
|
|
|
// } else if (value / 10000) {
|
|
|
|
|
// data = `${(value / 10000)} W`
|
|
|
|
|
// }
|
|
|
|
|
return value
|
|
|
|
|
}
|
|
|
|
|
}
|
2025-04-11 02:31:26 +00:00
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
|
|
|
|
|
position: "right",
|
|
|
|
|
// type: "log",
|
|
|
|
|
// splitNumber: "5",
|
|
|
|
|
show: true,
|
|
|
|
|
// min: 0,
|
|
|
|
|
// max: this.maxValue,
|
|
|
|
|
splitLine: {//不显示右侧Y轴横线
|
|
|
|
|
show: false
|
|
|
|
|
},
|
|
|
|
|
name: "USD",
|
|
|
|
|
nameTextStyle: {
|
|
|
|
|
|
|
|
|
|
padding: [0, 0, 0, 40],
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
],
|
|
|
|
|
dataZoom: [
|
|
|
|
|
{
|
|
|
|
|
type: "inside",
|
|
|
|
|
start: 0,
|
|
|
|
|
end: 100,
|
|
|
|
|
maxSpan: 100,
|
|
|
|
|
minSpan: 2,
|
|
|
|
|
animation: false,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
type: "inside",//slider
|
|
|
|
|
start: 0,
|
|
|
|
|
end: 100,
|
|
|
|
|
// showDetail: false,
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
series: [
|
|
|
|
|
{
|
|
|
|
|
name: "Computational power",
|
|
|
|
|
type: "line",
|
|
|
|
|
smooth: false, //线条是否圆滑
|
|
|
|
|
symbol: "circle",
|
|
|
|
|
symbolSize: 5,
|
|
|
|
|
showSymbol: false,
|
|
|
|
|
itemStyle: {
|
|
|
|
|
color: "#5721E4",
|
|
|
|
|
borderColor: "rgba(221,220,107,0.1)",
|
|
|
|
|
borderWidth: 12,
|
|
|
|
|
},
|
|
|
|
|
lineStyle: {
|
|
|
|
|
//线条样式
|
|
|
|
|
color: "#5721E4",
|
|
|
|
|
width: "2",
|
|
|
|
|
},
|
|
|
|
|
areaStyle: {
|
|
|
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
|
|
|
{
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: 'rgb(210,195,234)'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: 'rgb(255, 255, 255)'
|
|
|
|
|
}
|
|
|
|
|
])
|
|
|
|
|
},
|
|
|
|
|
zlevel: 1, z: 1,
|
|
|
|
|
data: [],
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: "Refusal rate",
|
|
|
|
|
type: "line",
|
|
|
|
|
smooth: false, //线条是否圆滑
|
|
|
|
|
symbol: "circle",
|
|
|
|
|
symbolSize: 5,
|
|
|
|
|
showSymbol: false,
|
|
|
|
|
itemStyle: {
|
|
|
|
|
color: "#FE2E74",
|
|
|
|
|
borderColor: "rgba(221,220,107,0.1)",
|
|
|
|
|
borderWidth: 12,
|
|
|
|
|
},
|
|
|
|
|
lineStyle: {
|
|
|
|
|
//线条样式
|
|
|
|
|
color: "#FE2E74",
|
|
|
|
|
width: "2",
|
|
|
|
|
},
|
|
|
|
|
areaStyle: {
|
|
|
|
|
origin: 'start',//颜色始终显示在线条下
|
|
|
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
|
|
|
{
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: 'rgb(252,220,233)'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: 'rgb(255, 255, 255)'
|
|
|
|
|
}
|
|
|
|
|
])
|
|
|
|
|
},
|
|
|
|
|
data: [],
|
|
|
|
|
yAxisIndex: 1,
|
|
|
|
|
zlevel: 2, z: 2,
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
minerOption: {
|
|
|
|
|
legend: {
|
|
|
|
|
right: "50",
|
|
|
|
|
formatter: function (name) {
|
|
|
|
|
return name;
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
tooltip: {
|
|
|
|
|
trigger: "axis",
|
|
|
|
|
textStyle: {
|
|
|
|
|
align: "left",
|
|
|
|
|
},
|
|
|
|
|
animation: false,
|
|
|
|
|
confine: true,
|
|
|
|
|
formatter: function (params) {
|
|
|
|
|
var res = params[0].axisValueLabel;
|
|
|
|
|
|
|
|
|
|
for (let i = 0; i <= params.length - 1; i++) {
|
|
|
|
|
|
|
|
|
|
if (params[i].seriesName == "Currency Price" || params[i].seriesName == "币价") {
|
|
|
|
|
res += `</br>${params[i].marker} ${params[i].seriesName}      <span style="font-weight: bold">${params[i].value} USD</span>`
|
|
|
|
|
} else {
|
|
|
|
|
res += `</br>${params[i].marker} ${params[i].seriesName}      <span style="font-weight: bold">${params[i].value}</span>`
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return res;
|
|
|
|
|
},
|
|
|
|
|
// axisPointer: {
|
|
|
|
|
// animation: false,
|
|
|
|
|
// snap: true,
|
|
|
|
|
// label: {
|
|
|
|
|
// precision: 2, //坐标轴保留的位数
|
|
|
|
|
// },
|
|
|
|
|
// type: "cross", //cross shadow
|
|
|
|
|
// crossStyle: {
|
|
|
|
|
// //十字轴横线
|
|
|
|
|
// // opacity: "0",
|
|
|
|
|
// width: 0.5,
|
|
|
|
|
// },
|
|
|
|
|
// lineStyle: {
|
|
|
|
|
// // opacity: 0,
|
|
|
|
|
// },
|
|
|
|
|
// },
|
|
|
|
|
},
|
|
|
|
|
grid: {
|
|
|
|
|
left: "10%",
|
|
|
|
|
right: "15%",
|
|
|
|
|
top: "20%",
|
|
|
|
|
bottom: "12%",
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
xAxis: {
|
|
|
|
|
// type: "time",
|
|
|
|
|
boundaryGap: false,
|
|
|
|
|
|
|
|
|
|
axisTick: {
|
|
|
|
|
//去除刻度
|
|
|
|
|
show: false,
|
|
|
|
|
},
|
|
|
|
|
axisLine: {
|
|
|
|
|
//去除轴线
|
|
|
|
|
show: false,
|
|
|
|
|
},
|
|
|
|
|
data: []
|
|
|
|
|
},
|
|
|
|
|
yAxis: [
|
|
|
|
|
{
|
|
|
|
|
position: "left",
|
|
|
|
|
type: "value",
|
|
|
|
|
// min: `dataMin`,
|
|
|
|
|
// max: `dataMax`,
|
|
|
|
|
name: "GH/s",
|
|
|
|
|
nameTextStyle: {
|
|
|
|
|
padding: [0, 0, 0, -40],
|
2025-06-13 06:58:47 +00:00
|
|
|
|
},
|
|
|
|
|
axisLabel: {
|
|
|
|
|
formatter: function (value) {
|
|
|
|
|
// let data
|
|
|
|
|
// if (value > 10000000) {
|
|
|
|
|
// data = `${(value / 10000000)} KW`
|
|
|
|
|
// } else if (value > 1000000) {
|
|
|
|
|
// data = `${(value / 1000000)} M`
|
|
|
|
|
// } else if (value / 10000) {
|
|
|
|
|
// data = `${(value / 10000)} W`
|
|
|
|
|
// }
|
|
|
|
|
return value
|
|
|
|
|
}
|
2025-04-11 02:31:26 +00:00
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
position: "right",
|
|
|
|
|
// type: "log",
|
|
|
|
|
// splitNumber: "5",
|
|
|
|
|
show: true,
|
|
|
|
|
// min: 0,
|
|
|
|
|
// max: this.maxValue,
|
|
|
|
|
splitLine: {//不显示右侧Y轴横线
|
|
|
|
|
show: false
|
|
|
|
|
},
|
|
|
|
|
name: "USD",
|
|
|
|
|
nameTextStyle: {
|
|
|
|
|
|
|
|
|
|
padding: [0, 0, 0, 40],
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
],
|
|
|
|
|
dataZoom: [
|
|
|
|
|
{
|
|
|
|
|
type: "inside",
|
|
|
|
|
start: 0,
|
|
|
|
|
end: 100,
|
|
|
|
|
maxSpan: 100,
|
|
|
|
|
minSpan: 2,
|
|
|
|
|
animation: false,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
type: "inside",//slider
|
|
|
|
|
start: 0,
|
|
|
|
|
end: 100,
|
|
|
|
|
// showDetail: false,
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
series: [
|
|
|
|
|
{
|
|
|
|
|
name: "全网算力",
|
|
|
|
|
type: "line",
|
|
|
|
|
smooth: false, //线条是否圆滑
|
|
|
|
|
symbol: "circle",
|
|
|
|
|
symbolSize: 5,
|
|
|
|
|
showSymbol: false,
|
|
|
|
|
itemStyle: {
|
|
|
|
|
color: "#5721E4",
|
|
|
|
|
borderColor: "rgba(221,220,107,0.1)",
|
|
|
|
|
borderWidth: 12,
|
|
|
|
|
},
|
|
|
|
|
lineStyle: {
|
|
|
|
|
//线条样式
|
|
|
|
|
color: "#5721E4",
|
|
|
|
|
width: "2",
|
|
|
|
|
},
|
|
|
|
|
areaStyle: {
|
|
|
|
|
origin: 'start',
|
|
|
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
|
|
|
{
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: 'rgb(210,195,234)'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: 'rgb(255, 255, 255)'
|
|
|
|
|
}
|
|
|
|
|
])
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
data: [],
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
name: "币价",
|
|
|
|
|
type: "line",
|
|
|
|
|
smooth: false, //线条是否圆滑
|
|
|
|
|
symbol: "circle",
|
|
|
|
|
symbolSize: 5,
|
|
|
|
|
showSymbol: false,
|
|
|
|
|
itemStyle: {
|
|
|
|
|
color: "#FE2E74",
|
|
|
|
|
borderColor: "rgba(221,220,107,0.1)",
|
|
|
|
|
borderWidth: 12,
|
|
|
|
|
},
|
|
|
|
|
lineStyle: {
|
|
|
|
|
//线条样式
|
|
|
|
|
color: "#FE2E74",
|
|
|
|
|
width: "2",
|
|
|
|
|
},
|
|
|
|
|
// rgb(253,64,128)
|
|
|
|
|
areaStyle: {
|
|
|
|
|
origin: 'start',//颜色始终显示在线条下
|
|
|
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
|
|
|
{
|
|
|
|
|
offset: 0,
|
|
|
|
|
color: 'rgb(252,220,233)'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
offset: 1,
|
|
|
|
|
color: 'rgb(255, 255, 255)'
|
|
|
|
|
}
|
|
|
|
|
])
|
|
|
|
|
},
|
|
|
|
|
data: [],
|
|
|
|
|
yAxisIndex: 1,
|
|
|
|
|
zlevel: 2, z: 2,
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
],
|
|
|
|
|
},
|
|
|
|
|
CountOption: { ...line },
|
|
|
|
|
powerDialogVisible: false,
|
|
|
|
|
minerDialogVisible: false,
|
|
|
|
|
currentPage: 1,
|
|
|
|
|
currency: "nexa",
|
|
|
|
|
currencyPath: `${this.$baseApi}img/nexa.png`,
|
|
|
|
|
currencyList: [
|
|
|
|
|
{
|
|
|
|
|
path: "nexaAccess",
|
|
|
|
|
value: "nexa",
|
|
|
|
|
label: "nexa",
|
|
|
|
|
img: require("../../assets/img/currency-nexa.png"),
|
|
|
|
|
imgUrl: `${this.$baseApi}img/nexa.png`,
|
|
|
|
|
name: "course.NEXAcourse",
|
|
|
|
|
show: true,
|
|
|
|
|
amount: 10000,
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
path: "grsAccess",
|
|
|
|
|
value: "grs",
|
|
|
|
|
label: "grs",
|
|
|
|
|
img: require("../../assets/img/currency/grs.svg"),
|
|
|
|
|
imgUrl: `${this.$baseApi}img/grs.svg`,
|
|
|
|
|
name: "course.GRScourse",
|
|
|
|
|
show: true,
|
|
|
|
|
amount: 1,
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
path: "monaAccess",
|
|
|
|
|
value: "mona",
|
|
|
|
|
label: "mona",
|
|
|
|
|
img: require("../../assets/img/currency/mona.svg"),
|
|
|
|
|
imgUrl: `${this.$baseApi}img/mona.svg`,
|
|
|
|
|
name: "course.MONAcourse",
|
|
|
|
|
show: true,
|
|
|
|
|
amount: 1,
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
path: "dgbsAccess",
|
|
|
|
|
value: "dgbs",
|
|
|
|
|
// label: "dgb-skein-pool1",
|
|
|
|
|
label: "dgb(skein)",
|
|
|
|
|
img: require("../../assets/img/currency/DGB.svg"),
|
|
|
|
|
imgUrl: `${this.$baseApi}img/dgb.svg`,
|
|
|
|
|
name: "course.dgbsCourse",
|
|
|
|
|
show: true,
|
|
|
|
|
amount: 1,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
path: "dgbqAccess",
|
|
|
|
|
value: "dgbq",
|
|
|
|
|
// label: "dgb(qubit-pool1)",
|
|
|
|
|
label: "dgb(qubit)",
|
|
|
|
|
img: require("../../assets/img/currency/DGB.svg"),
|
|
|
|
|
imgUrl: `${this.$baseApi}img/dgb.svg`,
|
|
|
|
|
name: "course.dgbqCourse",
|
|
|
|
|
show: true,
|
|
|
|
|
amount: 1,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
path: "dgboAccess",
|
|
|
|
|
value: "dgbo",
|
|
|
|
|
// label: "dgb-odocrypt-pool1",
|
|
|
|
|
label: "dgb(odocrypt)",
|
|
|
|
|
img: require("../../assets/img/currency/DGB.svg"),
|
|
|
|
|
imgUrl: `${this.$baseApi}img/dgb.svg`,
|
|
|
|
|
name: "course.dgboCourse",
|
|
|
|
|
show: true,
|
|
|
|
|
amount: 1,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
path: "rxdAccess",
|
|
|
|
|
value: "rxd",
|
|
|
|
|
label: "radiant(rxd)",
|
|
|
|
|
img: require("../../assets/img/currency/rxd.png"),
|
|
|
|
|
imgUrl: `${this.$baseApi}img/rxd.png`,
|
|
|
|
|
name: "course.RXDcourse",
|
|
|
|
|
show: true,
|
|
|
|
|
amount: 100,
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
path: "enxAccess",
|
|
|
|
|
value: "enx",
|
|
|
|
|
label: "Entropyx(enx)",
|
|
|
|
|
img: require("../../assets/img/currency/enx.svg"),
|
|
|
|
|
imgUrl: `${this.$baseApi}img/enx.svg`,
|
|
|
|
|
name: "course.ENXcourse",
|
|
|
|
|
show: true,
|
|
|
|
|
amount: 5000,
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
path: "alphminingPool",
|
|
|
|
|
value: "alph",
|
|
|
|
|
label: "alephium",
|
|
|
|
|
img: require("../../assets/img/currency/alph.svg"),
|
|
|
|
|
imgUrl: `${this.$baseApi}img/alph.svg`,
|
|
|
|
|
name: "course.alphCourse",
|
|
|
|
|
show: true,
|
|
|
|
|
amount: 1,
|
|
|
|
|
|
2025-05-16 06:01:38 +00:00
|
|
|
|
},
|
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
// { //告知已删除此币种 Radiant
|
|
|
|
|
// value: "dgb2_odo",
|
|
|
|
|
// label: "dgb-odocrypt-pool2",
|
|
|
|
|
// img: require("../../assets/img/currency/DGB.svg"),
|
|
|
|
|
// imgUrl: "https://s2.coinmarketcap.com/static/img/coins/64x64/109.png",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// value: "dgb_qubit_a10",
|
|
|
|
|
// label: "dgb-qubit-pool2",
|
|
|
|
|
// img: require("../../assets/img/currency/DGB.svg"),
|
|
|
|
|
// imgUrl: "https://s2.coinmarketcap.com/static/img/coins/64x64/109.png",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// value: "dgb_skein_a10",
|
|
|
|
|
// label: "dgb-skein-pool2",
|
|
|
|
|
// img: require("../../assets/img/currency/DGB.svg"),
|
|
|
|
|
// imgUrl: "https://s2.coinmarketcap.com/static/img/coins/64x64/109.png",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// value: "dgb_odo_b20",
|
|
|
|
|
// label: "dgb-odoscrypt-pool3",
|
|
|
|
|
// img: require("../../assets/img/currency/DGB.svg"),
|
|
|
|
|
// imgUrl: "https://s2.coinmarketcap.com/static/img/coins/64x64/109.png",
|
|
|
|
|
// },
|
|
|
|
|
|
|
|
|
|
],
|
|
|
|
|
params: {
|
|
|
|
|
coin: "nexa",
|
|
|
|
|
interval: "rt",
|
|
|
|
|
},
|
|
|
|
|
PowerParams: {
|
|
|
|
|
coin: "nexa",
|
|
|
|
|
interval: "rt",
|
|
|
|
|
},
|
|
|
|
|
BlockInfoParams: {
|
|
|
|
|
coin: "nexa",
|
|
|
|
|
limit: 10,
|
|
|
|
|
page: 1,
|
|
|
|
|
},
|
|
|
|
|
CoinData: {
|
|
|
|
|
algorithm: "",
|
|
|
|
|
height: "",
|
|
|
|
|
totalDifficulty: "",
|
|
|
|
|
totalPower: "",
|
|
|
|
|
price: "",
|
|
|
|
|
poolPower: "",
|
|
|
|
|
poolMc: "",
|
|
|
|
|
},
|
|
|
|
|
luckData: {
|
|
|
|
|
luck3d: "96.26 %",
|
|
|
|
|
luck7d: "96.26 %",
|
|
|
|
|
luck30d: "96.26 %",
|
|
|
|
|
luck90d: "96.26 %",
|
|
|
|
|
},
|
|
|
|
|
BlockInfoData: [
|
|
|
|
|
// {
|
|
|
|
|
// height: "847545",
|
|
|
|
|
// date: "2024-06-12 09:11:57",
|
|
|
|
|
// hash: "00000…9392577",
|
|
|
|
|
// reward: "3.12500000",
|
|
|
|
|
// fees: "0.40962024",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// height: "847545",
|
|
|
|
|
// date: "2024-06-12 09:11:57",
|
|
|
|
|
// hash: "00000…9942577",
|
|
|
|
|
// reward: "3.12500000",
|
|
|
|
|
// fees: "0.40962024",
|
|
|
|
|
// }, {
|
|
|
|
|
// height: "847545",
|
|
|
|
|
// date: "2024-06-12 09:11:57",
|
|
|
|
|
// hash: "00000…9925757",
|
|
|
|
|
// reward: "3.12500000",
|
|
|
|
|
// fees: "0.40962024",
|
|
|
|
|
// }, {
|
|
|
|
|
// height: "847545",
|
|
|
|
|
// date: "2024-06-12 09:11:57",
|
|
|
|
|
// hash: "00000…9925677",
|
|
|
|
|
// reward: "3.12500000",
|
|
|
|
|
// fees: "0.40962024",
|
|
|
|
|
// }, {
|
|
|
|
|
// height: "847545",
|
|
|
|
|
// date: "2024-06-12 09:11:57",
|
|
|
|
|
// hash: "00000…9925877",
|
|
|
|
|
// reward: "3.12500000",
|
|
|
|
|
// fees: "0.40962024",
|
|
|
|
|
// }, {
|
|
|
|
|
// height: "847545",
|
|
|
|
|
// date: "2024-06-12 09:11:57",
|
|
|
|
|
// hash: "00000…9928577",
|
|
|
|
|
// reward: "3.12500000",
|
|
|
|
|
// fees: "0.40962024",
|
|
|
|
|
// },
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
],
|
|
|
|
|
intervalList: [
|
|
|
|
|
// {
|
|
|
|
|
// value: "1h",
|
|
|
|
|
// label: "home.hour",
|
|
|
|
|
// },
|
|
|
|
|
{
|
|
|
|
|
value: "rt",
|
|
|
|
|
label: "home.realTime",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: "1d",
|
|
|
|
|
label: "home.day",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
offset: 0,
|
|
|
|
|
itemWidth: 30, // 每个小容器(包含图片)的宽度
|
|
|
|
|
listWidth: 1000, // 整个图片列表的宽度(10 个小容器的宽度总和)
|
|
|
|
|
itemActive: "nexa",
|
|
|
|
|
timeActive: "rt",
|
|
|
|
|
powerActive: true,
|
|
|
|
|
minerChartLoading: false,
|
|
|
|
|
newBlockInfoData: [
|
|
|
|
|
// {
|
|
|
|
|
// height:"556",
|
|
|
|
|
// date:"",
|
|
|
|
|
// hash:"SDJFIOSJISJIODJIFJ",
|
|
|
|
|
// reward:"545",
|
|
|
|
|
// fees:"56",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// height:"5556",
|
|
|
|
|
// date:"",
|
|
|
|
|
// hash:"SDJFIOSJISJ66IODJIFJ",
|
|
|
|
|
// reward:"5465",
|
|
|
|
|
// fees:"56",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// height:"5556",
|
|
|
|
|
// date:"",
|
|
|
|
|
// hash:"SDJFIOSJISJ66IODJIFJ",
|
|
|
|
|
// reward:"5465",
|
|
|
|
|
// fees:"56",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// height:"5556",
|
|
|
|
|
// date:"",
|
|
|
|
|
// hash:"SDJFIOSJISJ66IODJIFJ",
|
|
|
|
|
// reward:"5465",
|
|
|
|
|
// fees:"56",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// height:"5556",
|
|
|
|
|
// date:"",
|
|
|
|
|
// hash:"SDJFIOSJISJ66IODJIFJ",
|
|
|
|
|
// reward:"5465",
|
|
|
|
|
// fees:"56",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// height:"5556",
|
|
|
|
|
// date:"",
|
|
|
|
|
// hash:"SDJFIOSJISJ66IODJIFJ",
|
|
|
|
|
// reward:"5465",
|
|
|
|
|
// fees:"56",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// height:"5556",
|
|
|
|
|
// date:"",
|
|
|
|
|
// hash:"SDJFIOSJISJ66IODJIFJ",
|
|
|
|
|
// reward:"5465",
|
|
|
|
|
// fees:"56",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// height:"5556",
|
|
|
|
|
// date:"",
|
|
|
|
|
// hash:"SDJFIOSJISJ66IODJIFJ",
|
|
|
|
|
// reward:"5465",
|
|
|
|
|
// fees:"56",
|
|
|
|
|
// },
|
|
|
|
|
|
|
|
|
|
],
|
|
|
|
|
reportBlockLoading: false,
|
|
|
|
|
BlockShow: true,
|
|
|
|
|
showCalculator: false,
|
|
|
|
|
value: "nexa",
|
|
|
|
|
input3: "",
|
|
|
|
|
select: "GH/s",
|
|
|
|
|
selectTime: [
|
|
|
|
|
{
|
|
|
|
|
value: "day",
|
|
|
|
|
label: "home.everyDay",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: "week",
|
|
|
|
|
label: "home.weekly",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: "month",
|
|
|
|
|
label: "home.monthly",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: "year",
|
|
|
|
|
label: "home.annually",
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
time: "day",
|
|
|
|
|
input: "",
|
|
|
|
|
inputPower: 1,
|
|
|
|
|
profit: "",
|
|
|
|
|
factor: "",
|
|
|
|
|
CalculatorData: {
|
|
|
|
|
hpb: "10",
|
|
|
|
|
reward: "20",
|
|
|
|
|
price: "30",
|
|
|
|
|
costTime: "600",
|
|
|
|
|
poolFee: "0.15",
|
|
|
|
|
},
|
|
|
|
|
transactionFeeList: [//没有交易费
|
|
|
|
|
|
|
|
|
|
{
|
|
|
|
|
label: "grs",
|
|
|
|
|
coin: "grs",
|
|
|
|
|
feeShow: false,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: "mona",
|
|
|
|
|
coin: "mona",
|
|
|
|
|
feeShow: false,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: "radiant",
|
|
|
|
|
coin: "rxd",
|
|
|
|
|
feeShow: false,
|
|
|
|
|
},
|
|
|
|
|
// {
|
|
|
|
|
|
|
|
|
|
// label:"dgb(skein)",
|
|
|
|
|
// coin: "dgbs",
|
|
|
|
|
// feeShow: false,
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
|
|
|
|
|
// coin: "dgbq",
|
|
|
|
|
// label:"dgb(qubit)",
|
|
|
|
|
// feeShow: false,
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
|
|
|
|
|
// coin: "dgbo",
|
|
|
|
|
// label: "dgb(odocrypt)",
|
|
|
|
|
// feeShow: false,
|
|
|
|
|
// },
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
],
|
|
|
|
|
FeeShow: true,
|
|
|
|
|
lang: 'en',
|
2025-04-18 06:45:39 +00:00
|
|
|
|
activeItemCoin: {
|
2025-04-11 02:31:26 +00:00
|
|
|
|
value: "nexa",
|
|
|
|
|
label: "nexa",
|
|
|
|
|
img: require("../../assets/img/currency-nexa.png"),
|
|
|
|
|
imgUrl: `${this.$baseApi}img/nexa.png`,
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
isInternalChange: false,
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
"$i18n.locale": (val) => {
|
|
|
|
|
location.reload();//刷新页面 刷新echarts
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
activeItemCoin: {
|
|
|
|
|
handler(newVal) {
|
2025-04-18 06:45:39 +00:00
|
|
|
|
// 防止无限循环
|
|
|
|
|
if (this.isInternalChange) {
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
this.handleActiveItemChange(newVal);
|
2025-04-11 02:31:26 +00:00
|
|
|
|
},
|
|
|
|
|
deep: true
|
2025-04-18 06:45:39 +00:00
|
|
|
|
}
|
2025-04-11 02:31:26 +00:00
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
|
|
|
|
|
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
this.lang = this.$i18n.locale; // 初始化语言值
|
|
|
|
|
this.$addStorageEvent(1, `activeItemCoin`, JSON.stringify(this.currencyList[0]))
|
|
|
|
|
this.minerChartLoading = true
|
|
|
|
|
if (this.$isMobile) {
|
|
|
|
|
this.option.yAxis[1].show = false
|
|
|
|
|
this.option.grid.left = "16%"
|
|
|
|
|
this.option.grid.right = "5%"
|
|
|
|
|
this.option.grid.top = "10%"
|
|
|
|
|
this.option.grid.bottom = "45%"
|
|
|
|
|
|
|
|
|
|
this.option.legend.bottom = 5
|
|
|
|
|
this.option.legend.right = "30%"
|
|
|
|
|
this.option.xAxis.axisLabel = {
|
|
|
|
|
interval: 8,
|
|
|
|
|
rotate: 70
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.minerOption.yAxis[1].show = false
|
|
|
|
|
this.minerOption.grid.left = "16%"
|
|
|
|
|
this.minerOption.grid.right = "5%"
|
|
|
|
|
this.minerOption.grid.top = "10%"
|
|
|
|
|
this.minerOption.grid.bottom = "45%"
|
|
|
|
|
|
|
|
|
|
this.minerOption.legend.bottom = 5
|
|
|
|
|
this.minerOption.legend.right = "30%"
|
|
|
|
|
this.minerOption.xAxis.axisLabel = {
|
|
|
|
|
interval: 8,
|
|
|
|
|
rotate: 70
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
2025-05-16 06:01:38 +00:00
|
|
|
|
}else{ //动态计算图表的grid.left 让左侧的Y轴标签显示完全
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const yAxis = this.option.yAxis[0]; // 第一个 Y 轴
|
|
|
|
|
const maxValue = Math.max(...this.option.series[0].data); // 获取数据最大值
|
|
|
|
|
const formatter = yAxis.axisLabel.formatter;
|
|
|
|
|
const formattedValue = formatter(maxValue); // 格式化最大值
|
2025-06-13 06:58:47 +00:00
|
|
|
|
|
2025-05-16 06:01:38 +00:00
|
|
|
|
|
|
|
|
|
// 创建一个临时 DOM 元素计算宽度
|
|
|
|
|
const tempDiv = document.createElement('div');
|
|
|
|
|
tempDiv.style.position = 'absolute';
|
|
|
|
|
tempDiv.style.visibility = 'hidden';
|
|
|
|
|
tempDiv.style.fontSize = '12px'; // 与 axisLabel.fontSize 一致
|
|
|
|
|
tempDiv.innerText = formattedValue;
|
|
|
|
|
document.body.appendChild(tempDiv);
|
|
|
|
|
const labelWidth = tempDiv.offsetWidth;
|
|
|
|
|
document.body.removeChild(tempDiv);
|
|
|
|
|
|
|
|
|
|
// 动态设置 grid.left,加上安全边距
|
|
|
|
|
const safeMargin = 20;
|
|
|
|
|
this.option.grid.left = labelWidth + safeMargin + 'px';
|
|
|
|
|
|
2025-06-13 06:58:47 +00:00
|
|
|
|
|
|
|
|
|
// ------------全网算力图---------------
|
|
|
|
|
//
|
|
|
|
|
|
|
|
|
|
const yAxis2 = this.minerOption.yAxis[0]; // 第一个 Y 轴
|
|
|
|
|
const maxValue2 = Math.max(...this.minerOption.series[0].data); // 获取数据最大值
|
|
|
|
|
const formatter2 = yAxis2.axisLabel.formatter;
|
|
|
|
|
const formattedValue2 = formatter2(maxValue2); // 格式化最大值
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 创建一个临时 DOM 元素计算宽度
|
|
|
|
|
const tempDiv2 = document.createElement('div');
|
|
|
|
|
tempDiv2.style.position = 'absolute';
|
|
|
|
|
tempDiv2.style.visibility = 'hidden';
|
|
|
|
|
tempDiv2.style.fontSize = '12px'; // 与 axisLabel.fontSize 一致
|
|
|
|
|
tempDiv2.innerText = formattedValue2;
|
|
|
|
|
document.body.appendChild(tempDiv2);
|
|
|
|
|
const labelWidth2 = tempDiv2.offsetWidth;
|
|
|
|
|
document.body.removeChild(tempDiv2);
|
|
|
|
|
// 动态设置 grid.left,加上安全边距
|
|
|
|
|
const safeMargin2 = 20;
|
|
|
|
|
this.minerOption.grid.left = labelWidth2 + safeMargin2 + 'px';
|
|
|
|
|
|
2025-05-16 06:01:38 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
}
|
|
|
|
|
|
2025-05-16 06:01:38 +00:00
|
|
|
|
|
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
|
|
|
|
|
this.getBlockInfoData(this.BlockInfoParams)
|
|
|
|
|
this.getCoinInfoData(this.params)
|
|
|
|
|
this.getPoolPowerData(this.PowerParams)
|
|
|
|
|
|
2025-04-18 06:45:39 +00:00
|
|
|
|
// 注册需要在网络恢复后自动重新调用的方法
|
|
|
|
|
this.registerRecoveryMethod('getCoinInfoData', this.params);
|
|
|
|
|
this.registerRecoveryMethod('getPoolPowerData', this.PowerParams);
|
|
|
|
|
this.registerRecoveryMethod('getBlockInfoData', this.BlockInfoParams);
|
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
this.$addStorageEvent(1, `currencyList`, JSON.stringify(this.currencyList))
|
|
|
|
|
if (this.$refs.select) {
|
|
|
|
|
this.$refs.select.$el.children[0].children[0].setAttribute('style', "background:url(https://test.m2pool.com/img/nexa.png) no-repeat 10PX;background-size: 20PX 20PX;color:#333;padding-left: 30PX;");
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
this.fetchParam({ coin: this.params.coin })
|
|
|
|
|
|
|
|
|
|
this.minerChartLoading = false
|
|
|
|
|
|
|
|
|
|
// let activeItemCoin =localStorage.getItem(`activeItemCoin`)
|
|
|
|
|
// this.activeItemCoin=JSON.parse(activeItemCoin)
|
|
|
|
|
window.addEventListener("setItem", () => {
|
2025-04-18 06:45:39 +00:00
|
|
|
|
let value = localStorage.getItem(`activeItemCoin`)
|
|
|
|
|
this.activeItemCoin = JSON.parse(value)
|
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
methods: {
|
2025-06-13 06:58:47 +00:00
|
|
|
|
|
|
|
|
|
handelOptionYAxis(option){
|
|
|
|
|
const yAxis = option.yAxis[0]; // 第一个 Y 轴
|
|
|
|
|
const maxValue = Math.max(...option.series[0].data); // 获取数据最大值
|
|
|
|
|
const formatter = yAxis.axisLabel.formatter;
|
|
|
|
|
const formattedValue = formatter(maxValue); // 格式化最大值
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 创建一个临时 DOM 元素计算宽度
|
|
|
|
|
const tempDiv = document.createElement('div');
|
|
|
|
|
tempDiv.style.position = 'absolute';
|
|
|
|
|
tempDiv.style.visibility = 'hidden';
|
|
|
|
|
tempDiv.style.fontSize = '12px'; // 与 axisLabel.fontSize 一致
|
|
|
|
|
tempDiv.innerText = formattedValue;
|
|
|
|
|
document.body.appendChild(tempDiv);
|
|
|
|
|
const labelWidth = tempDiv.offsetWidth;
|
|
|
|
|
document.body.removeChild(tempDiv);
|
|
|
|
|
|
|
|
|
|
// 动态设置 grid.left,加上安全边距
|
|
|
|
|
const safeMargin = 20;
|
|
|
|
|
option.grid.left = labelWidth + safeMargin + 'px';
|
|
|
|
|
|
|
|
|
|
return option
|
|
|
|
|
},
|
2025-04-11 02:31:26 +00:00
|
|
|
|
slideLeft() {
|
|
|
|
|
const allLength = this.currencyList.length * 120
|
|
|
|
|
const boxLength = document.getElementById('list-box').clientWidth
|
|
|
|
|
if (allLength < boxLength) return
|
|
|
|
|
const listEl = document.getElementById('list')
|
|
|
|
|
const leftMove = Math.abs(parseInt(window.getComputedStyle(listEl, null)?.left))
|
|
|
|
|
if (leftMove + boxLength - 360 < boxLength) {
|
|
|
|
|
// 到最开始的时候
|
|
|
|
|
listEl.style.left = '0PX'
|
|
|
|
|
} else {
|
|
|
|
|
listEl.style.left = '-' + (leftMove - 360) + 'PX'
|
|
|
|
|
}
|
|
|
|
|
},
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
|
|
|
|
|
//初始化图表
|
|
|
|
|
inCharts() {
|
|
|
|
|
if (this.myChart == null) {
|
|
|
|
|
this.myChart = echarts.init(document.getElementById("chart"));
|
|
|
|
|
}
|
|
|
|
|
// this.maxValue = Math.round(this.maxValue * 3)
|
|
|
|
|
// if (this.maxValue > 0) {
|
|
|
|
|
// this.option.yAxis[1].max = this.maxValue
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
// this.option.legend.show = false
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.option.series[0].name = this.$t(`home.computingPower`)
|
|
|
|
|
this.option.series[1].name = this.$t(`home.currencyPrice`)
|
|
|
|
|
|
|
|
|
|
this.myChart.setOption(this.option);
|
|
|
|
|
// 回调函数,在渲染完成后执行
|
|
|
|
|
this.myChart.on('finished', () => {
|
|
|
|
|
// 在这里执行显示给用户的操作
|
|
|
|
|
// console.log('图表渲染完成,显示给用户');
|
|
|
|
|
this.minerChartLoading = false
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
// window.addEventListener("resize", () => {
|
|
|
|
|
// if (this.myChart) this.myChart.resize();
|
|
|
|
|
// });
|
|
|
|
|
|
|
|
|
|
window.addEventListener('resize', throttle(() => {
|
|
|
|
|
if (this.myChart) this.myChart.resize();
|
|
|
|
|
}, 200));
|
|
|
|
|
},
|
|
|
|
|
inChartsMiner() {
|
|
|
|
|
if (this.MinerChart == null) {
|
|
|
|
|
this.MinerChart = echarts.init(document.getElementById("minerChart"));
|
|
|
|
|
}
|
|
|
|
|
|
2025-06-13 06:58:47 +00:00
|
|
|
|
this.minerOption= this.handelOptionYAxis(this.minerOption) // Y轴文字显示动态调整grid.left
|
2025-04-11 02:31:26 +00:00
|
|
|
|
this.minerOption.series[0].name = this.$t(`home.networkPower`)
|
|
|
|
|
this.minerOption.series[1].name = this.$t(`home.currencyPrice`)
|
|
|
|
|
this.MinerChart.setOption(this.minerOption);
|
|
|
|
|
// 回调函数,在渲染完成后执行
|
|
|
|
|
this.MinerChart.on('finished', () => {
|
|
|
|
|
// console.log('图表渲染完成,显示给用户');
|
|
|
|
|
this.minerChartLoading = false
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
window.addEventListener('resize', throttle(() => {
|
|
|
|
|
if (this.MinerChart) this.MinerChart.resize();
|
|
|
|
|
}, 200));
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
countInCharts() {
|
|
|
|
|
this.countChart = echarts.init(document.getElementById("minerChart"));
|
|
|
|
|
|
|
|
|
|
this.countChart.setOption(this.CountOption);
|
|
|
|
|
|
|
|
|
|
// window.addEventListener("resize", () => {
|
|
|
|
|
// if (this.myChart) this.myChart.resize();
|
|
|
|
|
// });
|
|
|
|
|
},
|
|
|
|
|
async fetchParam(params) {
|
|
|
|
|
try {
|
|
|
|
|
const data = await getParam(params)
|
|
|
|
|
if (data && data.code == 200) {
|
|
|
|
|
this.CalculatorData = data.data
|
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
for (const key in this.CalculatorData) {
|
|
|
|
|
this.CalculatorData[key] = 0
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.calculateIncome(this.CalculatorData)
|
|
|
|
|
} catch (error) {
|
|
|
|
|
console.log(error, 'error')
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
//获取币种信息
|
|
|
|
|
// async getCoinInfoData(params) {
|
|
|
|
|
// const data = await getCoinInfo(params)
|
|
|
|
|
|
|
|
|
|
// if (data && data.code == 200) {
|
|
|
|
|
// this.CoinData = data.data
|
|
|
|
|
|
|
|
|
|
// // this.CoinData.poolPower =Number(this.CoinData.poolPower) .toFixed(2)//算力保留两位小数
|
|
|
|
|
// // this.CoinData.price =this.CoinData.price.toFixed(8)
|
|
|
|
|
// }
|
|
|
|
|
// },
|
|
|
|
|
getCoinInfoData: Debounce(async function (params) {
|
|
|
|
|
|
|
|
|
|
const data = await getCoinInfo(params)
|
|
|
|
|
|
|
|
|
|
if (data && data.code == 200) {
|
|
|
|
|
this.CoinData = data.data
|
|
|
|
|
|
|
|
|
|
// this.CoinData.poolPower =Number(this.CoinData.poolPower) .toFixed(2)//算力保留两位小数
|
|
|
|
|
// this.CoinData.price =this.CoinData.price.toFixed(8)
|
|
|
|
|
} else {
|
|
|
|
|
this.CoinData = {}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}, 200),
|
|
|
|
|
|
2025-04-25 06:09:32 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
getPoolPowerData: Debounce(async function (params) {
|
|
|
|
|
// this.minerChartLoading = true
|
|
|
|
|
this.setLoading('minerChartLoading', true);
|
|
|
|
|
try {
|
|
|
|
|
const data = await getPoolPower(params)
|
|
|
|
|
if (!data) {
|
|
|
|
|
// this.minerChartLoading = false
|
|
|
|
|
this.setLoading('minerChartLoading', false);
|
|
|
|
|
if (this.myChart) {
|
|
|
|
|
this.myChart.dispose()//销毁图表实列
|
|
|
|
|
}
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
let chartData = data.data
|
|
|
|
|
let xData = []
|
|
|
|
|
let pvData = []
|
|
|
|
|
let rejectRate = []
|
|
|
|
|
let price = []
|
|
|
|
|
chartData.forEach(item => {
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
if (item.date.includes(`T`) && params.interval == `rt`) {
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
item.date = `${item.date.split("T")[0]} ${item.date.split("T")[1].split(`.`)[0]}`
|
|
|
|
|
} else if (item.date.includes(`T`) && params.interval == `1d`) {
|
|
|
|
|
item.date = item.date.split("T")[0]
|
|
|
|
|
}
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
xData.push(item.date)
|
|
|
|
|
pvData.push(Number(item.pv).toFixed(2))
|
|
|
|
|
// rejectRate.push((item.rejectRate * 100).toFixed(2))
|
|
|
|
|
if (item.price == 0) {
|
|
|
|
|
price.push(item.price)
|
|
|
|
|
} else if (item.price < 1) {
|
|
|
|
|
price.push(Number(item.price).toFixed(8))
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
} else {
|
|
|
|
|
price.push(Number(item.price).toFixed(2))
|
|
|
|
|
}
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
});
|
|
|
|
|
// this.maxValue = Math.max(...rejectRate);
|
|
|
|
|
// let leftYMaxData = Math.max(...pvData);
|
|
|
|
|
// this.option.yAxis[0].max =leftYMaxData*2
|
|
|
|
|
this.option.xAxis.data = xData
|
|
|
|
|
this.option.series[0].data = pvData
|
|
|
|
|
// this.option.series[1].data = rejectRate
|
|
|
|
|
this.option.series[1].data = price
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
this.inCharts()
|
|
|
|
|
})
|
|
|
|
|
|
2025-04-18 06:45:39 +00:00
|
|
|
|
} catch {
|
2025-04-11 02:31:26 +00:00
|
|
|
|
console.error('获取数据失败:', error);
|
2025-04-18 06:45:39 +00:00
|
|
|
|
} finally {
|
2025-04-11 02:31:26 +00:00
|
|
|
|
// 确保无论成功失败都设置loading为false
|
|
|
|
|
this.setLoading('minerChartLoading', false);
|
2025-04-18 06:45:39 +00:00
|
|
|
|
}
|
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}, 200),
|
|
|
|
|
async fetchNetPower(params) {
|
|
|
|
|
// this.minerChartLoading = true
|
|
|
|
|
this.setLoading('minerChartLoading', true);
|
|
|
|
|
const data = await getNetPower(params)
|
|
|
|
|
if (!data) {
|
|
|
|
|
this.minerChartLoading = false
|
|
|
|
|
if (this.MinerChart) {
|
|
|
|
|
this.MinerChart.dispose()
|
|
|
|
|
}
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
let MinerCount = data.data
|
|
|
|
|
let xData = []
|
|
|
|
|
let pvData = []
|
|
|
|
|
let price = []
|
|
|
|
|
MinerCount.forEach(item => {
|
|
|
|
|
if (item.date.includes(`T`) && params.interval == `rt`) {
|
|
|
|
|
|
|
|
|
|
item.date = `${item.date.split("T")[0]} ${item.date.split("T")[1].split(`.`)[0]}`
|
|
|
|
|
} else if (item.date.includes(`T`) && params.interval == `1d`) {
|
|
|
|
|
item.date = item.date.split("T")[0]
|
|
|
|
|
}
|
|
|
|
|
xData.push(item.date)
|
|
|
|
|
pvData.push(Number(item.pv).toFixed(2))
|
|
|
|
|
if (item.price == 0) {
|
|
|
|
|
price.push(item.price)
|
|
|
|
|
} else if (item.price < 1) {
|
|
|
|
|
price.push(Number(item.price).toFixed(8))
|
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
price.push(Number(item.price).toFixed(2))
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.minerOption.xAxis.data = xData
|
|
|
|
|
this.minerOption.series[0].data = pvData
|
|
|
|
|
this.minerOption.series[1].data = price
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
this.inChartsMiner()
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// this.minerChartLoading = false
|
|
|
|
|
this.setLoading('minerChartLoading', false);
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
// async getMinerCountData(params) {
|
|
|
|
|
// this.minerChartLoading = true
|
|
|
|
|
// const data = await getMinerCount(params)
|
|
|
|
|
// if (!data) {
|
|
|
|
|
// this.minerChartLoading = false
|
|
|
|
|
// if (this.MinerChart) {
|
|
|
|
|
// this.MinerChart.dispose()
|
|
|
|
|
// }
|
|
|
|
|
// return
|
|
|
|
|
// }
|
|
|
|
|
// let MinerCount = data.data
|
|
|
|
|
// let xData = []
|
|
|
|
|
// let Count = []
|
|
|
|
|
// MinerCount.forEach((item) => {
|
|
|
|
|
// if (item.date.includes(`T`)) {
|
|
|
|
|
// // item.date= `${item.date.split("T")[0]} ${item.date.split("T")[1].split(`.`)[0]}`
|
|
|
|
|
// xData.push(`${item.date.split("T")[0]} ${item.date.split("T")[1].split(`.`)[0]}`)
|
|
|
|
|
// } else {
|
|
|
|
|
// xData.push(item.date)
|
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
// Count.push(item.value)
|
|
|
|
|
// })
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// this.minerOption.xAxis.data = xData
|
|
|
|
|
// this.minerOption.series[0].data = Count
|
|
|
|
|
// this.$nextTick(() => {
|
|
|
|
|
// this.inChartsMiner()
|
|
|
|
|
// })
|
|
|
|
|
|
|
|
|
|
// this.minerChartLoading = false
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// },
|
|
|
|
|
|
|
|
|
|
getMinerCountData: Debounce(async function (params) {
|
|
|
|
|
// this.minerChartLoading = true
|
|
|
|
|
this.setLoading('minerChartLoading', true);
|
|
|
|
|
const data = await getMinerCount(params)
|
|
|
|
|
if (!data) {
|
|
|
|
|
this.minerChartLoading = false
|
|
|
|
|
if (this.MinerChart) {
|
|
|
|
|
this.MinerChart.dispose()
|
|
|
|
|
}
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
let MinerCount = data.data
|
|
|
|
|
let xData = []
|
|
|
|
|
let Count = []
|
|
|
|
|
MinerCount.forEach((item) => {
|
|
|
|
|
if (item.date.includes(`T`)) {
|
|
|
|
|
// item.date= `${item.date.split("T")[0]} ${item.date.split("T")[1].split(`.`)[0]}`
|
|
|
|
|
xData.push(`${item.date.split("T")[0]} ${item.date.split("T")[1].split(`.`)[0]}`)
|
|
|
|
|
} else {
|
|
|
|
|
xData.push(item.date)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
Count.push(item.value)
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.minerOption.xAxis.data = xData
|
|
|
|
|
this.minerOption.series[0].data = Count
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
this.inChartsMiner()
|
|
|
|
|
})
|
|
|
|
|
this.setLoading('minerChartLoading', false);
|
|
|
|
|
// this.minerChartLoading = false
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}, 200),
|
|
|
|
|
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
|
|
|
|
|
getBlockInfoData: Debounce(async function (params) {
|
2025-04-18 06:45:39 +00:00
|
|
|
|
try {
|
|
|
|
|
// this.reportBlockLoading = true
|
2025-04-11 02:31:26 +00:00
|
|
|
|
this.setLoading('reportBlockLoading', true);
|
|
|
|
|
const data = await getBlockInfo(params)
|
|
|
|
|
if (data && data.code == 200) {
|
|
|
|
|
this.BlockShow = true
|
|
|
|
|
this.newBlockInfoData = []
|
|
|
|
|
this.BlockInfoData = data.rows
|
|
|
|
|
if (!this.BlockInfoData[0]) {
|
2025-04-18 06:45:39 +00:00
|
|
|
|
// this.reportBlockLoading = false
|
|
|
|
|
this.setLoading('reportBlockLoading', false);
|
2025-04-11 02:31:26 +00:00
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.BlockInfoData.forEach((item, index) => {
|
|
|
|
|
item.date = `${item.date.split("T")[0]} ${item.date.split("T")[1].split(`.`)[0]}`
|
|
|
|
|
if (index < 8) {
|
|
|
|
|
this.newBlockInfoData.push(item)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
this.BlockShow = false
|
|
|
|
|
}
|
|
|
|
|
this.setLoading('reportBlockLoading', false);
|
|
|
|
|
// this.reportBlockLoading = false
|
2025-04-18 06:45:39 +00:00
|
|
|
|
} catch (error) {
|
|
|
|
|
console.error('获取区块信息失败:', error);
|
|
|
|
|
this.BlockShow = false;
|
|
|
|
|
}finally {
|
|
|
|
|
// 确保在任何情况下都会重置 loading 状态
|
|
|
|
|
this.setLoading('reportBlockLoading', false);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}, 200),
|
|
|
|
|
calculateIncome(data) {
|
|
|
|
|
|
|
|
|
|
for (const key in this.CalculatorData) {
|
|
|
|
|
if (!this.CalculatorData[key]) {
|
|
|
|
|
|
|
|
|
|
this.profit = 0
|
|
|
|
|
// var myDiv = document.getElementById('myDiv');
|
|
|
|
|
// this.disableElement(myDiv);
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// 收益计算器实现算法:
|
|
|
|
|
|
|
|
|
|
// 每日币收益 = (目标算力 / 全网算力)* 全网每日出块 * 单个块奖励 * (1 - 矿池手续费率)
|
|
|
|
|
// 每日美元收益 = 每日币收益 * 币价(美元计)
|
|
|
|
|
let target_hashrate
|
|
|
|
|
switch (this.select) {
|
|
|
|
|
case `GH/s`://GH/S(吉哈希每秒):1 GH/S 就是 1×10^9 哈希每秒。
|
|
|
|
|
target_hashrate = this.inputPower * Math.pow(10, 9)
|
|
|
|
|
break;
|
|
|
|
|
case `MH/s`://MH/S(兆哈希每秒):1 MH/S 是 1×10^6 哈希每秒
|
|
|
|
|
target_hashrate = this.inputPower * Math.pow(10, 6)
|
|
|
|
|
break;
|
|
|
|
|
case `TH/s`:// TH/S(太哈希每秒):1 TH/S 是 1×10^12 哈希每秒
|
|
|
|
|
target_hashrate = this.inputPower * Math.pow(10, 12)
|
|
|
|
|
break;
|
|
|
|
|
default:
|
|
|
|
|
break;
|
|
|
|
|
}
|
|
|
|
|
// 这里从response中解析出全网算力、矿池算力、区块奖励
|
|
|
|
|
const net_hashrate = this.CalculatorData.netHashrate // 全网算力,这里的数据是模拟的,实际数据从response中解析
|
|
|
|
|
const reward = this.CalculatorData.reward// 区块奖励, 同上
|
|
|
|
|
// 计算
|
|
|
|
|
const target_hashrate_ratio = target_hashrate / net_hashrate // 用户算力全网占比
|
|
|
|
|
const per_day_reward = (reward * (1 - this.CalculatorData.poolFee)) * this.CalculatorData.count // 全网每日奖励
|
|
|
|
|
const result = target_hashrate_ratio * per_day_reward
|
|
|
|
|
|
|
|
|
|
switch (this.time) {
|
|
|
|
|
case "day":
|
2025-04-18 06:45:39 +00:00
|
|
|
|
this.profit = result.toFixed(8)
|
2025-04-11 02:31:26 +00:00
|
|
|
|
// this.profit = Math.floor(result * 1e10) / 1e10;
|
2025-04-18 06:45:39 +00:00
|
|
|
|
// this.profit = this.toFixedNoRound(result, 10);
|
2025-04-11 02:31:26 +00:00
|
|
|
|
break;
|
|
|
|
|
case "week":
|
2025-04-18 06:45:39 +00:00
|
|
|
|
this.profit = (result * 7).toFixed(8)
|
2025-04-11 02:31:26 +00:00
|
|
|
|
// this.profit = Math.floor(result * 7 * 1e10) / 1e10;
|
2025-04-18 06:45:39 +00:00
|
|
|
|
// this.profit = this.toFixedNoRound(result * 7, 10);
|
2025-04-11 02:31:26 +00:00
|
|
|
|
break;
|
|
|
|
|
case "month":
|
2025-04-18 06:45:39 +00:00
|
|
|
|
this.profit = (result * 30).toFixed(8)
|
2025-04-11 02:31:26 +00:00
|
|
|
|
// this.profit = Math.floor(result * 30 * 1e10) / 1e10;
|
2025-04-18 06:45:39 +00:00
|
|
|
|
// this.profit = this.toFixedNoRound(result * 30, 10);
|
2025-04-11 02:31:26 +00:00
|
|
|
|
break;
|
|
|
|
|
case "year":
|
2025-04-18 06:45:39 +00:00
|
|
|
|
this.profit = (result * 365).toFixed(8)
|
2025-04-11 02:31:26 +00:00
|
|
|
|
// this.profit = Math.floor(result * 365 * 1e10) / 1e10;
|
2025-04-18 06:45:39 +00:00
|
|
|
|
// this.profit = this.toFixedNoRound(result * 365, 10);
|
2025-04-11 02:31:26 +00:00
|
|
|
|
break;
|
|
|
|
|
|
|
|
|
|
default:
|
|
|
|
|
break;
|
|
|
|
|
}
|
2025-04-18 06:45:39 +00:00
|
|
|
|
const nexaFormatter = new Intl.NumberFormat("en-US", {
|
|
|
|
|
minimumFractionDigits: 2, // 强制显示 2 位小数(不足补零)
|
|
|
|
|
maximumFractionDigits: 2, // 可选:限制最多 2 位小数(避免多余位数)
|
2025-04-11 02:31:26 +00:00
|
|
|
|
useGrouping: true, // 不使用千位分隔符(如 1,000)
|
|
|
|
|
});
|
2025-04-18 06:45:39 +00:00
|
|
|
|
if (this.value == "nexa") {
|
|
|
|
|
this.profit = nexaFormatter.format(this.profit);
|
|
|
|
|
} else {
|
|
|
|
|
const formatter = new Intl.NumberFormat("en-US", {
|
|
|
|
|
minimumFractionDigits: 8, // 强制显示足够多的小数位
|
|
|
|
|
useGrouping: true, // 不使用千位分隔符(如 1,000)
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.profit = formatter.format(this.profit);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// const formatter = new Intl.NumberFormat("en-US", {
|
|
|
|
|
// minimumFractionDigits: 8, // 强制显示足够多的小数位
|
|
|
|
|
// useGrouping: false, // 不使用千位分隔符(如 1,000)
|
|
|
|
|
// });
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// this.profit = formatter.format(this.profit);
|
2025-04-11 02:31:26 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
toFixedNoRound(value, decimals = 10) {//保留10位小数 不四舍五入
|
|
|
|
|
const factor = 10 ** decimals;
|
|
|
|
|
return (value < 0 ? Math.ceil(value * factor) : Math.floor(value * factor)) / factor;
|
|
|
|
|
},
|
|
|
|
|
ProfitCalculator(target_hashrate, fee) {
|
|
|
|
|
// 收益计算器实现算法:
|
|
|
|
|
|
|
|
|
|
// 每日币收益 = (目标算力 / 全网算力)* 全网每日出块 * 单个块奖励 * (1 - 矿池手续费率)
|
|
|
|
|
// 每日美元收益 = 每日币收益 * 币价(美元计)
|
|
|
|
|
|
|
|
|
|
// 这里从response中解析出全网算力、矿池算力、区块奖励
|
|
|
|
|
const net_hashrate = 5646.62 // 全网算力,这里的数据是模拟的,实际数据从response中解析
|
|
|
|
|
const reward = 10000000 // 区块奖励, 同上
|
|
|
|
|
// 计算
|
|
|
|
|
const target_hashrate_ratio = target_hashrate / net_hashrate // 用户算力全网占比
|
|
|
|
|
const per_day_reward = (reward * (1 - fee)) * 720 // 全网每日奖励
|
|
|
|
|
const result = target_hashrate_ratio * per_day_reward
|
|
|
|
|
return result
|
|
|
|
|
},
|
|
|
|
|
//禁用
|
|
|
|
|
disableElement(element) {
|
|
|
|
|
element.setAttribute('data-disabled', true);
|
|
|
|
|
element.style.pointerEvents = 'none'; // 阻止鼠标事件
|
|
|
|
|
element.style.opacity = '0.5'; // 设置半透明度
|
|
|
|
|
// 其他CSS样式可以根据需要添加
|
|
|
|
|
},
|
|
|
|
|
handelProfitCalculation() {
|
|
|
|
|
|
|
|
|
|
for (const key in this.CalculatorData) {
|
|
|
|
|
if (!this.CalculatorData[key]) {
|
|
|
|
|
// this.$message({
|
|
|
|
|
// message: this.$t(`home.acquisitionFailed`),
|
|
|
|
|
// type: "error",
|
|
|
|
|
// });
|
|
|
|
|
this.profit = 0
|
|
|
|
|
// var myDiv = document.getElementById('myDiv');
|
|
|
|
|
// this.disableElement(myDiv);
|
|
|
|
|
this.fetchParam({ coin: this.params.coin })
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.showCalculator = true
|
|
|
|
|
},
|
|
|
|
|
handelClose() {
|
|
|
|
|
this.showCalculator = false
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
changeSelection(scope) {
|
|
|
|
|
let brand = scope
|
|
|
|
|
for (let index in this.currencyList) {
|
|
|
|
|
let aa = this.currencyList[index];
|
|
|
|
|
let value = aa.value;
|
|
|
|
|
if (brand === value) {
|
|
|
|
|
this.$refs.select.$el.children[0].children[0].setAttribute('style', "background:url(" + aa.imgUrl + ") no-repeat 10PX;background-size: 20PX 20PX;color:#333;padding-left: 35PX;");
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
this.fetchParam({ coin: this.value })
|
|
|
|
|
|
|
|
|
|
},
|
2025-04-18 06:45:39 +00:00
|
|
|
|
handelJump(url) {
|
2025-04-11 02:31:26 +00:00
|
|
|
|
|
|
|
|
|
if (url === '/AccessMiningPool') {
|
|
|
|
|
const coin = this.currencyList.find(item => item.value === this.params.coin);
|
|
|
|
|
if (!coin) return;
|
|
|
|
|
let jumpName = coin.path.charAt(0).toUpperCase() + coin.path.slice(1) //name跳转 首字母大写
|
|
|
|
|
// 使用 name 进行导航,避免重复的路由参数
|
|
|
|
|
this.$router.push({
|
2025-04-18 06:45:39 +00:00
|
|
|
|
name: jumpName,
|
|
|
|
|
params: {
|
|
|
|
|
lang: this.lang,
|
|
|
|
|
coin: this.params.coin,
|
|
|
|
|
imgUrl: this.currencyPath
|
2025-04-11 02:31:26 +00:00
|
|
|
|
|
2025-04-18 06:45:39 +00:00
|
|
|
|
},
|
|
|
|
|
replace: false // 保留历史记录,允许回退
|
2025-04-11 02:31:26 +00:00
|
|
|
|
});
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
} else {
|
|
|
|
|
// 移除开头的斜杠,统一处理路径格式
|
|
|
|
|
const cleanPath = url.startsWith('/') ? url.slice(1) : url;
|
|
|
|
|
this.$router.push(`/${this.lang}/${cleanPath}`);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
handelCalculation() {
|
|
|
|
|
this.calculateIncome()
|
|
|
|
|
},
|
2025-05-16 06:01:38 +00:00
|
|
|
|
// 获取单个币种项目的完整宽度(包含margin)
|
|
|
|
|
getItemFullWidth() {
|
|
|
|
|
const listEl = this.$refs.currencyList;
|
|
|
|
|
if (!listEl) return 120;
|
|
|
|
|
|
|
|
|
|
const firstItem = listEl.querySelector('.list-item');
|
|
|
|
|
if (!firstItem) return 120;
|
|
|
|
|
|
|
|
|
|
const style = window.getComputedStyle(firstItem);
|
|
|
|
|
const width = firstItem.offsetWidth;
|
|
|
|
|
const marginLeft = parseInt(style.marginLeft) || 0;
|
|
|
|
|
const marginRight = parseInt(style.marginRight) || 0;
|
|
|
|
|
|
|
|
|
|
return width + marginLeft + marginRight;
|
|
|
|
|
},
|
2025-05-16 08:53:11 +00:00
|
|
|
|
|
2025-05-16 06:01:38 +00:00
|
|
|
|
// 左滑动逻辑
|
|
|
|
|
scrollLeft() {
|
2025-05-16 08:53:11 +00:00
|
|
|
|
const allLength = this.currencyList.length * 120
|
|
|
|
|
const boxLength = document.getElementById('list-box').clientWidth
|
|
|
|
|
if (allLength < boxLength) return
|
|
|
|
|
const listEl = document.getElementById('list')
|
|
|
|
|
const leftMove = Math.abs(parseInt(window.getComputedStyle(listEl, null)?.left))
|
|
|
|
|
if (leftMove + boxLength - 360 < boxLength) {
|
|
|
|
|
// 到最开始的时候
|
|
|
|
|
listEl.style.left = '0PX'
|
2025-05-16 06:01:38 +00:00
|
|
|
|
} else {
|
2025-05-16 08:53:11 +00:00
|
|
|
|
listEl.style.left = '-' + (leftMove - 360) + 'PX'
|
2025-05-16 06:01:38 +00:00
|
|
|
|
}
|
2025-05-16 08:53:11 +00:00
|
|
|
|
},
|
|
|
|
|
// 右滑动逻辑
|
|
|
|
|
scrollRight() {
|
|
|
|
|
const allLength = this.currencyList.length * 120
|
|
|
|
|
const boxLength = document.getElementById('list-box').clientWidth
|
|
|
|
|
if (allLength < boxLength) return
|
|
|
|
|
const listEl = document.getElementById('list')
|
|
|
|
|
const leftMove = Math.abs(parseInt(window.getComputedStyle(listEl, null)?.left))
|
|
|
|
|
if (leftMove + boxLength + 360 > allLength) {
|
|
|
|
|
listEl.style.left = '-' + (allLength - boxLength) + 'PX'
|
2025-05-16 06:01:38 +00:00
|
|
|
|
} else {
|
2025-05-16 08:53:11 +00:00
|
|
|
|
listEl.style.left = '-' + (leftMove + 360) + 'PX'
|
2025-05-16 06:01:38 +00:00
|
|
|
|
}
|
2025-05-16 08:53:11 +00:00
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
2025-05-16 06:01:38 +00:00
|
|
|
|
// // 左滑动逻辑
|
|
|
|
|
// scrollLeft() {
|
|
|
|
|
// const allLength = this.currencyList.length * 120
|
|
|
|
|
// const boxLength = document.getElementById('list-box').clientWidth
|
|
|
|
|
// if (allLength < boxLength) return
|
|
|
|
|
// const listEl = document.getElementById('list')
|
|
|
|
|
// const leftMove = Math.abs(parseInt(window.getComputedStyle(listEl, null)?.left))
|
|
|
|
|
// if (leftMove + boxLength - 360 < boxLength) {
|
|
|
|
|
// // 到最开始的时候
|
|
|
|
|
// listEl.style.left = '0PX'
|
|
|
|
|
// } else {
|
|
|
|
|
// listEl.style.left = '-' + (leftMove - 360) + 'PX'
|
2025-04-11 02:31:26 +00:00
|
|
|
|
// }
|
2025-05-16 06:01:38 +00:00
|
|
|
|
// },
|
|
|
|
|
// // 右滑动逻辑
|
|
|
|
|
// scrollRight() {
|
|
|
|
|
// const allLength = this.currencyList.length * 120
|
|
|
|
|
// const boxLength = document.getElementById('list-box').clientWidth
|
|
|
|
|
// if (allLength < boxLength) return
|
|
|
|
|
// const listEl = document.getElementById('list')
|
|
|
|
|
// const leftMove = Math.abs(parseInt(window.getComputedStyle(listEl, null)?.left))
|
|
|
|
|
// if (leftMove + boxLength + 360 > allLength) {
|
|
|
|
|
// listEl.style.left = '-' + (allLength - boxLength) + 'PX'
|
|
|
|
|
// } else {
|
|
|
|
|
// listEl.style.left = '-' + (leftMove + 360) + 'PX'
|
|
|
|
|
// }
|
|
|
|
|
// },
|
|
|
|
|
|
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
handleActiveItemChange(item) {
|
|
|
|
|
if (!item) return;
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
this.currency = item.label;
|
|
|
|
|
this.currencyPath = item.imgUrl;
|
|
|
|
|
this.params.coin = item.value;
|
|
|
|
|
|
2025-04-18 06:45:39 +00:00
|
|
|
|
console.log(this.params.coin, "item");
|
2025-04-11 02:31:26 +00:00
|
|
|
|
this.BlockInfoParams.coin = item.value;
|
|
|
|
|
this.itemActive = item.value;
|
|
|
|
|
this.PowerParams.coin = item.value;
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
// 调用相关数据更新方法
|
|
|
|
|
this.getCoinInfoData(this.params);
|
|
|
|
|
this.getBlockInfoData(this.BlockInfoParams);
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
if (this.powerActive) {
|
2025-04-18 06:45:39 +00:00
|
|
|
|
this.handelPower();
|
2025-04-11 02:31:26 +00:00
|
|
|
|
} else {
|
2025-04-18 06:45:39 +00:00
|
|
|
|
this.handelMiner();
|
2025-04-11 02:31:26 +00:00
|
|
|
|
}
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
this.handelCoinLabel(item.value);
|
2025-04-18 06:45:39 +00:00
|
|
|
|
},
|
2025-04-11 02:31:26 +00:00
|
|
|
|
|
|
|
|
|
clickCurrency(item) {
|
|
|
|
|
if (!item) return;
|
|
|
|
|
// 设置标记,防止触发 watch
|
|
|
|
|
this.isInternalChange = true;
|
|
|
|
|
this.activeItemCoin = item;
|
|
|
|
|
this.$addStorageEvent(1, `activeItemCoin`, JSON.stringify(item))
|
|
|
|
|
// this.currency = item.label
|
|
|
|
|
// this.currencyPath = item.imgUrl
|
|
|
|
|
// this.params.coin = item.value
|
|
|
|
|
// this.BlockInfoParams.coin = item.value
|
|
|
|
|
// this.itemActive = item.value
|
|
|
|
|
// this.PowerParams.coin = item.value
|
|
|
|
|
// this.getCoinInfoData(this.params)
|
|
|
|
|
// this.getBlockInfoData(this.BlockInfoParams)
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
// 在下一个事件循环中重置标记
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
this.isInternalChange = false;
|
|
|
|
|
});
|
|
|
|
|
|
2025-04-18 06:45:39 +00:00
|
|
|
|
|
|
|
|
|
// 直接调用处理方法
|
|
|
|
|
this.handleActiveItemChange(item);
|
|
|
|
|
|
2025-04-11 02:31:26 +00:00
|
|
|
|
},
|
|
|
|
|
clickReportBlock() {
|
|
|
|
|
this.$router.push({
|
|
|
|
|
path: `/${this.lang}/reportBlock`,
|
|
|
|
|
query: {
|
|
|
|
|
coin: this.params.coin,
|
|
|
|
|
imgUrl: this.currencyPath
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
handleClick(tab, event) {
|
|
|
|
|
},
|
|
|
|
|
handelPower() {
|
|
|
|
|
// this.powerDialogVisible = true;
|
|
|
|
|
if (this.MinerChart) {
|
|
|
|
|
this.MinerChart.dispose();
|
|
|
|
|
this.MinerChart = null;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 初始化相关数据
|
|
|
|
|
this.option.xAxis.data = [];
|
|
|
|
|
this.option.series[0].data = [];
|
|
|
|
|
this.option.series[1].data = [];
|
|
|
|
|
|
|
|
|
|
this.powerActive = true
|
|
|
|
|
this.PowerParams.coin = this.params.coin
|
|
|
|
|
this.getPoolPowerData(this.PowerParams)
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
intervalChange(value) {
|
|
|
|
|
this.PowerParams.interval = value
|
|
|
|
|
this.params.interval = value
|
|
|
|
|
this.timeActive = value
|
|
|
|
|
if (this.powerActive) {
|
|
|
|
|
this.getPoolPowerData(this.PowerParams)
|
|
|
|
|
} else if (!this.powerActive) {
|
|
|
|
|
this.fetchNetPower(this.params)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
handelMiner() {
|
|
|
|
|
// this.minerDialogVisible = true;
|
|
|
|
|
// 先销毁可能存在的上一个图表实例
|
|
|
|
|
if (this.myChart) {
|
|
|
|
|
this.myChart.dispose();
|
|
|
|
|
this.myChart = null;
|
|
|
|
|
}
|
|
|
|
|
// 初始化相关数据
|
|
|
|
|
this.minerOption.xAxis.data = [];
|
|
|
|
|
this.minerOption.series[0].data = [];
|
|
|
|
|
|
|
|
|
|
this.powerActive = false
|
|
|
|
|
// this.getMinerCountData(this.params)
|
|
|
|
|
this.fetchNetPower(this.params)
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
handelLabel(coin) {
|
|
|
|
|
let obj = this.currencyList.find(item => item.value == coin)
|
|
|
|
|
if (obj) {
|
|
|
|
|
return obj.label
|
|
|
|
|
} else {
|
|
|
|
|
return ""
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
handelLabel2(coin) {
|
|
|
|
|
if (coin.includes("dgb")) {
|
|
|
|
|
return "dgb"
|
|
|
|
|
} else {
|
|
|
|
|
return coin
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
handelCoinLabel(coin) {
|
|
|
|
|
let obj = {
|
|
|
|
|
coin: "",
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (coin) {
|
|
|
|
|
obj = this.transactionFeeList.find(item => item.coin == coin)
|
|
|
|
|
this.FeeShow = false
|
|
|
|
|
}
|
|
|
|
|
if (!obj) {
|
|
|
|
|
this.FeeShow = true
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
}
|