首页公告弹窗提醒

src/views/403.vue

+<template>
+  <div class="notice">
+    <header><h3>GECA网站暂停运营公告</h3></header>
+    <main>
+      <article>
+        全体用户：<br />
+        <p>
+          感谢您一直以来对国家消化道早癌防治中心联盟早期胃癌筛查项目的支持和厚爱！
+        </p>
+        <p>
+          由于网站维护的需要，本网站将于2024年9月30日23时59分暂停使用。后续开放时间待通知。
+        </p>
+        <p>
+          若您有任何疑问或建议，请登录账户后用微信扫页面左下角二维码加入问题反馈群向我们反馈。
+        </p>
+        <p>
+          若您有专科专病临床研究数字化应用或数据服务等其他需求，请联系：上海市计算技术研究所有限公司
+          (秦艳13052028226) 。
+        </p>
+        <p>
+          再次感谢广大用户的支持与理解，同时也对此次暂停运营给成的不便深表款意！
+        </p>
+      </article>
+    </main>
+  </div>
+</template>
+
+<style scoped>
+.notice {
+  color: #000;
+  width: 100%;
+  max-width: 700px;
+  margin: 50px auto;
+  h3 {
+    font-size: 30px;
+  }
+}
+header {
+  text-align: center;
+}
+article {
+  line-height: 50px;
+  font-size: 18px;
+  p {
+    text-indent: 2em;
+  }
+}
+</style>

src/views/Home/index.vue

@@ -219,6 +219,15 @@
       :cur-pdf="curPdf"
       :pdf-src="pdfSrc"
     ></pdf-dialog>
+
+    <el-dialog
+      title="通知"
+      top="30px"
+      :visible.sync="dialogVisible"
+      width="70%"
+    >
+      <DialogNotice> </DialogNotice>
+    </el-dialog>
   </div>
 </template>
 <script>
@@ -227,10 +236,12 @@ import { articleList } from "@/api/operation-management"
 import Map from "./Map"
 import PdfDialog from "./PdfDialog/index.vue"
 import Notice from "./notice/index.vue"
+import DialogNotice from "@/views/403"
 export default {
-  components: { Map, PdfDialog, Notice },
+  components: { Map, PdfDialog, Notice, DialogNotice },
   data() {
     return {
+      dialogVisible: true,
       noticeName: "",
       isNotice: false,
       curPdf: {},
@@ -342,9 +353,8 @@ export default {
       document
         .querySelector("#vue-admin-beautiful")
         .addEventListener("scroll", () => {
-          let scrollTop = document.querySelector(
-            "#vue-admin-beautiful"
-          ).scrollTop
+          let scrollTop = document.querySelector("#vue-admin-beautiful")
+            .scrollTop
           if (scrollTop >= 700) {
             this.showFixed = true
           } else {