lizixuan/m2pool_web_frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 3 Wiki Activity

1.添加alph币种（矿池分配及转账规则页面、费率页面、挖矿教程页面、起付额度限制、最新报块跳转、支付id跳转） 完成

Browse Source 
2.api文档页面修改8个接口请求方式为post
3.优化代码币种添加通用币种信息及挖矿教程页面跳转通用
4.m2pool断网重连 60秒内重连  处理中
5.收益计算器显示值修改  取消四舍五入 直接保留10位小数 添加千位符分隔显示
6.coinbus 添加seo相关配置及站点地图 处理中
This commit is contained in:
yaoqin
2025-04-11 10:31:26 +08:00
parent ab78808aec
commit 915fc3d7a6
338 changed files with 65858 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

739
mining-pool/src/views/AccessMiningPool/index.vue Normal file
View File

@@ -0,0 +1,739 @@
<template>
<div class="AccessMiningPoolMain">
<section v-if="openAPI" class="openAPI">
<section v-if="$isMobile">
<div class="currencySelect">
<div class="nav">
<div class="nav-item" id="menu1" @click.stop="toggleDropdown">
<img
class="itemImg"
:src="activeItem.imgUrl || ``"
:alt="activeItem.label || ``"
/>
<span style="text-transform: capitalize">
{{ activeItem.label || `` }}</span
>
<i class="arrow"></i>
<div class="dropdown">
<div
class="option"
v-for="item in currencyList"
:key="item.value"
@click.stop="changeMenuName($event, item)"
:class="{ optionActive: $route.path.includes(item.path) }"
>
<img
class="dropdownCoin"
:src="item.imgUrl"
:alt="item.value"
/>
<div class="dropdownText">{{ item.label }}</div>
</div>
</div>
</div>
</div>
</div>
<section>
<keep-alive>
<router-view :key="$route.fullPath" />
</keep-alive>
</section>
</section>
<section class="AccessMiningPool" v-else>
<section class="menu">
<ul>
<li
:class="{ active: currentRoutePath == item.path }"
@click="clickJump(item)"
v-for="item in currencyList"
:key="item.value"
>
<img :src="item.imgUrl" :alt="item.value" loading="lazy" />
<span>
{{ $t(item.name) }}
</span>
</li>
</ul>
</section>
<section class="tutorialContent">
<router-view></router-view>
</section>
</section>
</section>
<section v-else>
<div class="notOpen">
<p>{{ $t(`course.notOpenCurrency`) }}</p>
<div class="imgBox">
<img
src="../../assets/404_images/notOpen.png"
alt="Not open"
loading="lazy"
/>
</div>
</div>
</section>
</div>
</template>
<script>
import IndexJs from "./index";
export default {
mixins: [IndexJs],
watch: {
$route(to, from) {
// 监听路由变化，处理组件更新
this.handleRouteChange(to, from);
}
},
methods: {
handleRouteChange(to, from) {
// 确保组件能够正确响应路由变化
if (to.name !== from.name) {
this.$nextTick(() => {
// 强制更新组件
this.$forceUpdate();
});
}
},
// clickJump(item) {
// if (!item || !item.path) return;
// const route = {
// name: item.path,
// params: {
// lang: this.$i18n.locale
// }
// };
// this.$router.push(route).catch(err => {
// if (err.name !== 'NavigationDuplicated') {
// console.error('Navigation failed:', err);
// }
// });
// }
}
};
</script>
<style lang="scss" scoped>
@media screen and (min-width: 220px) and (max-width: 1279px) {
.AccessMiningPoolMain {
width: 100%;
// min-height: 100vh;
background: transparent !important;
// background-image: url(../../assets/img/miningAccount/top.png);
// background-size: 100% 50%;
// background-repeat: no-repeat;
// background-position: 30% -15%;
padding: 0;
margin: 0;
padding-top: 30px;
display: flex;
justify-content: center;
.mail {
color: #5917c4;
}
}
.notOpen {
width: 100%;
display: inline-block !important;
margin: 50px 00px;
justify-content: center;
padding: 0px 30px;
p {
// background: #D1C2E9;
font-size: 20px !important;
width: 100% !important;
line-height: 50px;
color: #6a24ff;
text-align: center;
}
.imgBox {
display: flex;
justify-content: center;
margin-top: 30px;
}
img {
width: 80%;
}
}
.currencySelect {
display: flex;
align-items: center;
// margin-bottom: 15px;
padding-left: 8px;
font-size: 0.85rem;
.el-menu-demo {
width: 100%;
}
.el-menu {
background: transparent;
}
// .title{
// width: 30%;
// }
.coinSelect {
img {
width: 25px;
}
span {
text-transform: capitalize;
margin-left: 5px;
}
}
}
.moveCurrencyBox {
margin: 0;
padding: 0;
width: 100%;
display: flex;
min-height: 200px;
flex-wrap: wrap;
padding: 10px 20px;
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;
}
}
}
.mainTitle {
padding: 0px 20px;
span {
font-size: 0.95rem;
color: rgba(0, 0, 0, 0.7);
font-weight: 600;
}
}
.tableBox {
margin: 0 auto;
width: 96%;
min-height: 300px;
// background: palegoldenrod;
overflow: hidden;
border-radius: 8px;
font-size: 0.9rem;
margin-bottom: 20px;
box-shadow: 0px 0px 5px 2px #ccc;
margin-top: 10px;
background: #fff;
.table-title {
height: 50px;
background: #d2c4e8;
display: flex;
justify-content: space-around;
align-items: center;
font-weight: 600;
padding-left: 0 !important;
span {
text-align: center;
}
span:nth-of-type(1) {
width: 50% !important;
}
span:nth-of-type(2) {
width: 50% !important;
color: #ca094a;
font-weight: bold;
padding-right: 5px;
}
}
.collapseTitle {
width: 100%;
display: flex;
justify-content: space-around;
align-items: center;
padding-left: 0 !important;
text-align: center;
span {
text-align: center;
}
span:nth-of-type(1) {
width: 50% !important;
display: flex;
align-items: center;
justify-content: center;
img {
margin-right: 5px;
}
}
span:nth-of-type(2) {
width: 50% !important;
color: #ca094a;
font-weight: bold;
}
}
.belowTable {
background: #f0e9f5;
padding: 10px 0px;
div {
width: 100%;
height: auto;
text-align: left;
padding-left: 8%;
p:nth-of-type(1) {
font-weight: 600;
}
p {
word-wrap: break-word;
.copy {
padding: 0px 5px;
display: inline-block;
cursor: pointer;
border: 1px solid #d1c2e9;
border-radius: 5px;
margin-left: 10px;
font-size: 0.8rem;
}
}
}
}
.paginationBox {
text-align: center;
}
}
#careful {
padding: 0px 8px;
font-size: 0.85rem;
color: rgba(0, 0, 0, 0.7);
line-height: 25px;
.mail {
color: #5917c4;
}
}
.step {
width: 99% !important;
margin: 0 auto;
margin-top: 3%;
border: 1px solid rgba(0, 0, 0, 0.1);
box-sizing: border-box;
padding: 15px !important;
p {
line-height: 25px !important;
}
.stepTitle {
height: auto !important;
width: 100%;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
line-height: 30px !important;
font-size: 0.95rem !important;
color: rgba(0, 0, 0, 0.6);
font-weight: 600;
word-wrap: break-word;
}
.textBox {
padding: 10px !important;
color: rgba(5, 32, 75, 0.6);
font-weight: normal !important;
font-size: 0.85rem !important;
}
}
::v-deep .el-collapse-item__content {
padding: 0 !important;
}
.nav {
// position: absolute;
z-index: 1000;
// height: 60px;
// line-height: 60px;
margin-right: 8px;
}
.nav-item {
position: relative;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
padding: 0 10px;
.itemImg {
width: 20px;
margin-right: 5px;
}
.arrow {
margin-left: 5px;
border: solid rgba(0, 0, 0, 0.3);
border-width: 0 1px 1px 0;
display: inline-block;
padding: 3px;
transform: rotate(45deg);
transition: transform 0.3s;
&.up {
transform: rotate(-135deg);
}
}
}
.dropdown {
position: absolute;
top: 28px;
left: 0;
width: 362px;
background: white;
border: 1px solid #eee;
border-radius: 4px;
padding: 3px;
display: none;
flex-wrap: wrap;
gap: 1px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
z-index: 999999;
&.show {
display: flex;
}
.option {
width: 70px;
height: 70px;
background: #f5f5f5;
// display: flex;
// align-items: center;
// justify-content: center;
cursor: pointer;
transition: all 0.3s;
border-radius: 4px;
// flex-direction: column;
// padding:5px;
// padding-top: 5%;
overflow: hidden;
text-align: center;
padding: 5px;
text-overflow: ellipsis;
&:hover {
background: #e8e8e8;
color: #6e3edb;
border: 1px solid #9d8ac9;
}
}
.optionActive {
background: #e8e8e8;
color: #6e3edb;
border: 1px solid #9d8ac9;
}
}
.dropdownCoin {
width: 23px;
margin: 0;
}
.dropdownText {
width: 100%;
font-size: 0.8rem;
// word-wrap: break-word;
text-align: center;
margin: 0;
word-break: break-word;
margin-top: 5px;
}
}
.AccessMiningPoolMain {
width: 100%;
// height: 100vh;
}
.openAPI {
width: 100%;
height: 100%;
}
.AccessMiningPool {
width: 100%;
// height: 100%;
// min-height: 100vh;
background: #fff;
background-image: url(../../assets/img/miningAccount/top.png);
background-size: 100% 65%;
background-repeat: no-repeat;
background-position: 30% -15%;
padding: 0;
margin: 0;
padding-top: 60px;
display: flex;
justify-content: center;
a {
color: #8a2be2;
}
}
.tutorialContent {
width: 60%;
// background: palegreen;
box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.1);
border-radius: 8px;
overflow: hidden;
}
.notOpen {
// background: palegoldenrod;
display: flex;
margin-top: 10%;
justify-content: center;
p {
// background: #D1C2E9;
font-size: 25px;
width: 25%;
line-height: 50px;
color: #6a24ff;
}
}
.menu {
width: 18%;
// background: #D2C3EA
margin-right: 30px;
background: #ffffff;
padding: 20px !important;
border-radius: 8px;
box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.1);
min-height: 300px;
// font-size: 0.9rem;
ul {
margin: 0;
padding: 0;
li {
list-style: none;
min-height: 40px;
line-height: 20px;
text-align: left;
margin-top: 8px;
cursor: pointer;
display: flex;
align-items:start;
padding: 5px;
transition: all 0.3s;
img {
width: 25px;
margin-right: 5px;
}
span{
font-size: 0.9rem;
}
}
li:hover {
text-decoration: underline;
}
}
}
.active {
color: #6924ff;
background: #d2c3ea;
border-radius: 5px;
}
.table {
width: 70%;
box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.1);
// margin: 0 auto;
background: #fff;
border-radius: 8px;
padding: 50px;
.mainTitle {
font-size: 1.5em;
width: 100%;
margin: 0 auto;
font-weight: 600;
color: rgba(0, 0, 0, 0.6);
display: flex;
align-items: center;
justify-content: left;
img {
width: 30px;
margin-right: 5px;
}
// span{
// margin-left: 5PX;
// }
}
.theServer {
width: 100%;
// height: 500PX;
margin: 0 auto;
box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.1);
padding: 10px 10px;
margin-top: 20px;
.title {
width: 100%;
padding-left: 3%;
height: 50px;
line-height: 50px;
font-size: 1.3em;
color: rgba(0, 0, 0, 0.6);
font-weight: 600;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
ul {
width: 100%;
height: 90%;
padding: 0;
margin: 0;
margin-top: 1%;
li {
list-style: none;
height: 40px;
line-height: 40px;
background: #efefef;
display: flex;
justify-content: space-between;
font-size: 0.9rem;
span {
display: inline-block;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: rgba(0, 0, 0, 0.7);
}
.coin {
width: 18%;
display: flex;
align-items: center;
justify-content: center;
img {
width: 25px;
margin-right: 5px;
}
span {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.quota {
color: #ca094a;
font-weight: 600;
}
.difficulty {
width: 10%;
}
.port {
width: 35%;
i {
font-size: 1em;
}
i:hover {
color: #6924ff;
}
}
i {
cursor: pointer;
}
}
li:nth-child(even) {
background-color: #ffff; /* 甚至可以是你想要的任何颜色 */
}
.liTitle {
width: 100%;
height: 50px;
line-height: 50px;
background: #d2c3ea;
color: #36246f;
font-size: 0.95rem;
// span{
// display: inline-block;
// text-align: center;
// }
.coin {
width: 18%;
display: flex;
align-items: center;
justify-content: center;
img {
width: 25px;
}
span {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
// .difficulty{
// width: 10%;
// }
.port {
width: 35%;
}
}
}
}
.careful {
margin-top: 8px;
font-size: 0.9rem;
color: rgba(0, 0, 0, 0.7);
a {
color: #6924ff;
}
}
}
.step {
width: 100%;
margin: 0 auto;
margin-top: 3%;
border: 1px solid rgba(0, 0, 0, 0.1);
box-sizing: border-box;
padding: 20px;
p {
line-height: 30px;
}
.stepTitle {
height: 40px;
width: 100%;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
line-height: 40px;
font-size: 1rem;
color: rgba(0, 0, 0, 0.6);
font-weight: 600;
}
.textBox {
padding: 20px;
color: rgba(5, 32, 75, 0.6);
font-weight: 600;
font-size: 0.95rem;
}
}
</style>