Browse Source

新增弹窗

master
liaoxinyu 1 year ago
parent
commit
596faa7ce7
  1. 63
      src/views/home/index.vue

63
src/views/home/index.vue

@ -219,6 +219,22 @@
<!-- </div>--> <!-- </div>-->
<!--中间显示4个图标--> <!--中间显示4个图标-->
</div> </div>
<!-- 弹出框 -->
<div v-if="visible" class="overlay">
<div class="modal_show">
<div class="">
<div class="close-button" @click="close1">×</div>
</div>
<div>
<span class="modal-content11">
Dear user, hello!<br/>
Warmly congratulate the rapid increase in platform users. In order to better provide the best services to users in each region, we will implement a server management mechanism that is separated by region to ensure that each service can be fully implemented. To this end, we will start a new round of server transformation and upgrade projects. The transformation time will be completed within three hours, and we will provide you with a safer and more efficient service. Special reminder, during the server upgrade and transformation process, users in some regions may be affected when logging in to the platform using the original domain name, and we have activated the emergency response plan. If you have problems logging in using PC or H5, you can contact the customer service representative in time for help and complete the transaction.
We apologize for the inconvenience caused to you and thank all users for their support!
</span>
</div>
</div>
</div>
<!-- 立即体验 --> <!-- 立即体验 -->
<div class="illustration_area"> <div class="illustration_area">
<div class="left"> <div class="left">
@ -630,6 +646,7 @@
line: "", line: "",
helpList: [], helpList: [],
currentCoinIdx: 0, // currentCoinIdx: 0, //
visible: false
}; };
}, },
methods: { methods: {
@ -852,11 +869,15 @@
this.helpList = res.splice(0, 4); this.helpList = res.splice(0, 4);
}); });
}, },
close1() {
this.visible = false;
}
}, },
created() { created() {
this.indexList(); this.indexList();
}, },
mounted() { mounted() {
this.visible = true
this.article(); this.article();
this.getHelpList(); this.getHelpList();
if (this.isLogin) { if (this.isLogin) {
@ -2394,4 +2415,46 @@
bottom: 150px; bottom: 150px;
} }
} }
.overlay {
display: flex;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, 0.5); /* 透明白色背景 */
justify-content: center;
align-items: center;
z-index: 1000; /* 确保在最上层 */
}
.modal_show {
// position: absolute;
background-color: white;
padding: 20px;
border-radius: 8px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
// width: 400px; /* */
width: 50%;
color: #000;
}
.modal-title {
font-size: 18px;
font-weight: bold;
}
.modal-content11 {
margin: 10px 0;
}
.close-button {
height: 40px;
text-align: right;
font-size: 30px;
cursor: pointer;
}
</style> </style>
Loading…
Cancel
Save