diff --git a/src/assets/img/Home/download.png b/src/assets/img/Home/download.png
new file mode 100644
index 0000000000000000000000000000000000000000..b3ca83d5f78ddce3280006cc221f59453170202f
Binary files /dev/null and b/src/assets/img/Home/download.png differ
diff --git a/src/assets/img/Home/file.png b/src/assets/img/Home/file.png
new file mode 100644
index 0000000000000000000000000000000000000000..8f850136b38c8ea8f7d5c24290d53620f9be4fc4
Binary files /dev/null and b/src/assets/img/Home/file.png differ
diff --git a/src/assets/img/Home/trustee.png b/src/assets/img/Home/trustee.png
new file mode 100644
index 0000000000000000000000000000000000000000..793c63912f0177f76fa060106f50a546a6ea8460
Binary files /dev/null and b/src/assets/img/Home/trustee.png differ
diff --git a/src/views/Home/index.vue b/src/views/Home/index.vue
index 33eb9144562fde67853fc8bd30fb8c2d70094f0a..f5546c7b6eb9dc2ad03af55327699383e8468915 100644
--- a/src/views/Home/index.vue
+++ b/src/views/Home/index.vue
@@ -1,57 +1,23 @@
 <template>
   <div id="con">
-    <div class="top flex">
-      <div class="left box">
-        <video :src="videoSrc" controls class="video" />
-      </div>
-      <!-- 新闻会议tab -->
-      <div class="right box tabbox videoboxs">
-        <el-tabs v-model="curTab" @tab-click="handleClick">
-          <el-tab-pane
-            v-for="(e, index) in tabList"
-            :key="index"
-            :label="e.title"
-            :name="index + 1 + ''"
-          >
-            <ul class="tabslist">
-              <li
-                v-for="(item, index) in noticeList"
-                :key="index"
-                title="点击查看pdf文件"
-                @click="setPdf(item)"
-              >
-                <div class="left">
-                  <div class="circle"></div>
-                  {{ item.articleTitle }}
-                </div>
-                <div class="right">
-                  {{ item.createTime }}
-                </div>
-              </li>
-            </ul>
-          </el-tab-pane>
-        </el-tabs>
-      </div>
-    </div>
-    <!-- 联盟地图 -->
-    <div class="dataAnalysis map_box">
-      <div class="flex">
-        <div class="left box cenbox">
-          <div class="box_title text-center">联盟地图</div>
-          <!-- <img class="map" src="~@/assets/img/Home/map.png" alt="" /> -->
-          <Map></Map>
+    <Notice v-show="isNotice"></Notice>
+    <div v-show="!isNotice">
+      <div class="top flex">
+        <div class="left box">
+          <video :src="videoSrc" controls class="video" />
         </div>
-        <div class="right box tabbox" style="height: 458px">
-          <el-tabs v-model="exTab">
+        <!-- 新闻会议tab -->
+        <div class="right box tabbox videoboxs">
+          <el-tabs v-model="curTab" @tab-click="handleClick">
             <el-tab-pane
-              v-for="(e, index) in example"
+              v-for="(e, index) in tabList"
               :key="index"
               :label="e.title"
-              :name="e.title"
+              :name="index + 1 + ''"
             >
-              <ul class="tabslist" style="height: 380px" :loading="listLoading">
+              <ul class="tabslist">
                 <li
-                  v-for="(item, index) in exampleList"
+                  v-for="(item, index) in noticeList"
                   :key="index"
                   title="点击查看pdf文件"
                   @click="setPdf(item)"
@@ -60,145 +26,187 @@
                     <div class="circle"></div>
                     {{ item.articleTitle }}
                   </div>
-                  <div class="right">
-                    {{ item.createTime }}
-                  </div>
+                  <div class="right">{{ item.createTime }}11</div>
                 </li>
               </ul>
             </el-tab-pane>
           </el-tabs>
         </div>
       </div>
-    </div>
-    <!-- 机构排名 -->
-    <div class="dataAnalysis" style="background: #fff">
-      <div class="flex" style="margin-bottom: 0px">
-        <div class="box cenbox cenboxs">
-          <div class="range left_range">
-            <div class="text-center">
-              <span class="range_title text-center">
-                累计上报合格病例数机构排名
-              </span>
-            </div>
-            <div class="rangecontent">
-              <div class="top20"></div>
-              <ul class="rangeList">
-                <li
-                  v-for="(item, index) in rangeList"
-                  :key="index"
-                  :style="{
-                    color: index < 3 ? '#4E68FF' : '#333333',
-                    alignSelf: index > 9 ? 'flex-end' : '',
-                  }"
+      <!-- 联盟地图 -->
+      <div class="dataAnalysis map_box">
+        <div class="flex">
+          <div class="left box cenbox">
+            <div class="box_title text-center">联盟地图</div>
+            <!-- <img class="map" src="~@/assets/img/Home/map.png" alt="" /> -->
+            <Map></Map>
+          </div>
+          <div class="right box tabbox" style="height: 458px">
+            <el-tabs v-model="exTab">
+              <el-tab-pane
+                v-for="(e, index) in example"
+                :key="index"
+                :label="e.title"
+                :name="e.title"
+              >
+                <ul
+                  class="tabslist"
+                  style="height: 380px"
+                  :loading="listLoading"
                 >
-                  <div>{{ index + 1 }}</div>
-                  <div>{{ item.unionName }}</div>
-                  <div>{{ item.nums }}</div>
-                </li>
-              </ul>
-            </div>
+                  <li
+                    v-for="(item, index) in exampleList"
+                    :key="index"
+                    title="点击查看pdf文件"
+                    @click="setPdf(item)"
+                  >
+                    <div class="left">
+                      <div class="circle"></div>
+                      {{ item.articleTitle }}
+                    </div>
+                    <div class="right">
+                      {{ item.createTime }}
+                    </div>
+                  </li>
+                </ul>
+              </el-tab-pane>
+            </el-tabs>
           </div>
-          <div class="range">
-            <div class="text-center">
-              <span class="range_title text-center">近90天上报量机构排名</span>
+        </div>
+      </div>
+      <!-- 机构排名 -->
+      <div class="dataAnalysis" style="background: #fff">
+        <div class="flex" style="margin-bottom: 0px">
+          <div class="box cenbox cenboxs">
+            <div class="range left_range">
+              <div class="text-center">
+                <span class="range_title text-center">
+                  累计上报合格病例数机构排名
+                </span>
+              </div>
+              <div class="rangecontent">
+                <div class="top20"></div>
+                <ul class="rangeList">
+                  <li
+                    v-for="(item, index) in rangeList"
+                    :key="index"
+                    :style="{
+                      color: index < 3 ? '#4E68FF' : '#333333',
+                      alignSelf: index > 9 ? 'flex-end' : '',
+                    }"
+                  >
+                    <div>{{ index + 1 }}</div>
+                    <div>{{ item.unionName }}</div>
+                    <div>{{ item.nums }}</div>
+                  </li>
+                </ul>
+              </div>
             </div>
-
-            <div class="rangecontent">
-              <div class="top10"></div>
-              <ul class="rangeList">
-                <li
-                  v-for="(item, index) in curQuarterList"
-                  :key="index"
-                  :style="{
-                    color: index < 3 ? '#4E68FF' : '#333333',
-                  }"
+            <div class="range">
+              <div class="text-center">
+                <span class="range_title text-center"
+                  >近90天上报量机构排名</span
                 >
-                  <div>{{ index + 1 }}</div>
-                  <div>{{ item.unionName }}</div>
-                  <div>{{ item.nums }}</div>
-                </li>
-              </ul>
+              </div>
+
+              <div class="rangecontent">
+                <div class="top10"></div>
+                <ul class="rangeList">
+                  <li
+                    v-for="(item, index) in curQuarterList"
+                    :key="index"
+                    :style="{
+                      color: index < 3 ? '#4E68FF' : '#333333',
+                    }"
+                  >
+                    <div>{{ index + 1 }}</div>
+                    <div>{{ item.unionName }}</div>
+                    <div>{{ item.nums }}</div>
+                  </li>
+                </ul>
+              </div>
             </div>
           </div>
         </div>
       </div>
-    </div>
 
-    <!-- 健康科普 -->
-    <div class="healthPopularization">
-      <div class="title_box">
-        <div class="title">健康科普</div>
-        <div class="empty"></div>
+      <!-- 健康科普 -->
+      <div class="healthPopularization">
+        <div class="title_box">
+          <div class="title">健康科普</div>
+          <div class="empty"></div>
+        </div>
+        <ul class="typeList">
+          <li
+            v-for="(item, index) in typeList"
+            :key="index"
+            :style="{ backgroundImage: 'url(' + item.src + ')' }"
+            @click="
+              $router.push({
+                path: '/healthpopularization',
+                query: { tabIndex: index },
+              })
+            "
+          >
+            {{ item.name }}
+          </li>
+        </ul>
       </div>
-      <ul class="typeList">
-        <li
-          v-for="(item, index) in typeList"
-          :key="index"
-          :style="{ backgroundImage: 'url(' + item.src + ')' }"
-          @click="
-            $router.push({
-              path: '/healthpopularization',
-              query: { tabIndex: index },
-            })
-          "
-        >
-          {{ item.name }}
-        </li>
-      </ul>
-    </div>
 
-    <!--  科学研究 -->
-    <div class="scientificresearch">
-      <div class="title_box">
-        <div class="title">科学研究</div>
-        <div class="empty"></div>
-      </div>
-      <ul class="researchList">
-        <li
-          v-for="(item, index) in researchList"
-          :key="index"
-          @click="
-            $router.push({
-              path: '/scientificresearch',
-              query: { tabIndex: index },
-            })
-          "
-        >
-          {{ item }}
-        </li>
-      </ul>
-    </div>
-    <!-- 粘性定位 -->
-    <div v-show="showFixed" class="fixed_box">
-      <ul class="f_list">
-        <el-popover
-          popper-class="poperbackground"
-          v-for="(item, index) in rigBarList"
-          :key="index"
-          placement="left-start"
-          title=""
-          width="200"
-          trigger="hover"
-          :content="item.content"
-        >
+      <!--  科学研究 -->
+      <div class="scientificresearch">
+        <div class="title_box">
+          <div class="title">科学研究</div>
+          <div class="empty"></div>
+        </div>
+        <ul class="researchList">
           <li
-            slot="reference"
-            :style="{ background: fixIndex == index ? '#4e68ff' : '#fff' }"
-            @mouseenter="fixIndex = index"
-            @mouseleave="fixIndex = -1"
+            v-for="(item, index) in researchList"
+            :key="index"
+            @click="
+              $router.push({
+                path: '/scientificresearch',
+                query: { tabIndex: index },
+              })
+            "
           >
-            <template v-if="fixIndex == index">
-              <img :src="item.src2" alt="" /><span style="color: #fff">{{
-                item.name
-              }}</span>
-            </template>
-            <template v-else>
-              <img :src="item.src1" alt="" /><span>{{ item.name }}</span>
-            </template>
+            {{ item }}
           </li>
-        </el-popover>
-      </ul>
+        </ul>
+      </div>
+      <!-- 粘性定位 -->
+      <div v-show="showFixed" class="fixed_box">
+        <ul class="f_list">
+          <el-popover
+            popper-class="poperbackground"
+            v-for="(item, index) in rigBarList"
+            :key="index"
+            placement="left-start"
+            title=""
+            width="200"
+            trigger="hover"
+            :content="item.content"
+          >
+            <li
+              slot="reference"
+              :style="{ background: fixIndex == index ? '#4e68ff' : '#fff' }"
+              @mouseenter="fixIndex = index"
+              @mouseleave="fixIndex = -1"
+            >
+              <template v-if="fixIndex == index">
+                <img :src="item.src2" alt="" /><span style="color: #fff">{{
+                  item.name
+                }}</span>
+              </template>
+              <template v-else>
+                <img :src="item.src1" alt="" /><span>{{ item.name }}</span>
+              </template>
+            </li>
+          </el-popover>
+        </ul>
+      </div>
     </div>
+
     <!-- 弹窗 -->
     <pdf-dialog
       ref="pdfDialog"
@@ -212,10 +220,12 @@ import { getRankTotal, getCurrentQuarter } from "@/api/Home"
 import { articleList } from "@/api/operation-management"
 import Map from "./Map"
 import PdfDialog from "./PdfDialog/index.vue"
+import Notice from "./notice/index.vue"
 export default {
-  components: { Map, PdfDialog },
+  components: { Map, PdfDialog, Notice },
   data() {
     return {
+      isNotice: false,
       curPdf: {},
       pdfSrc: "",
       fixIndex: -1,
@@ -311,6 +321,10 @@ export default {
   },
   methods: {
     setPdf(item) {
+      if (item.moduleType === 2) {
+        this.isNotice = true
+        return
+      }
       this.$refs.pdfDialog.showPdf = true
       this.curPdf = item
       this.pdfSrc =
diff --git a/src/views/Home/notice/components/AllianceApply.vue b/src/views/Home/notice/components/AllianceApply.vue
new file mode 100644
index 0000000000000000000000000000000000000000..c78d01ca65b238d1a99bc59ad251fb2c8cf4261c
--- /dev/null
+++ b/src/views/Home/notice/components/AllianceApply.vue
@@ -0,0 +1,190 @@
+<template>
+  <div class="container">
+    <h2>申请加入国家消化道早癌防治中心联盟</h2>
+    <div class="sub_title">申请阶段</div>
+    <div class="content">
+      <h3>1、下载申请材料</h3>
+      <div class="upload_item" v-for="item in list" :key="item.id">
+        <div class="img-file">
+          <img src="@/assets/img/Home/file.png" alt="" />
+        </div>
+        <div style="float: left" class="upload_label">
+          <strong>{{ item.label }} </strong>
+          <span>{{ item.size }}</span>
+        </div>
+        <div class="img-load" @click="download(item)">
+          <img src="@/assets/img/Home/download.png" alt="" />
+        </div>
+      </div>
+      <h3>2、发送至邮箱</h3>
+      <p>service@gecachina.cn</p>
+      <h3>3、定期参与入盟培训</h3>
+      <p>培训内容：新系统使用、筛查方法及医患沟通等</p>
+      <h3>4、材料认证 - 开通账户</h3>
+      <p>a. 回复确认入盟邀请函</p>
+      <p>b. 账户开通：门诊、体检、、社区</p>
+      <h3>5、数据审核</h3>
+      <p>
+        a.
+        按要求上传足量病例后，联盟官网将公示入盟医院：三甲医院需上传100例数据，非三甲医院需上传50例
+      </p>
+      <p>b. 目前已入联盟但未公示的医院，需补充病例才可公示</p>
+      <h3>6、官网公示 - 申请成功</h3>
+    </div>
+
+    <div class="sub_title">运行阶段</div>
+    <div class="content">
+      <h3>1、定期沟通会 - 数据上传</h3>
+      <p>a. 根据指导建议做出积极响应：制定后续跟进计划</p>
+      <p>
+        b. 已在官网公示名单中的医院将定期开启回溯重申，如不合格将从名单中摘除
+      </p>
+      <h3>2、正式授牌</h3>
+      <p>正式入盟后需要定期上传筛查数据（高质量且有效）才可获得授牌</p>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      list: [
+        {
+          id: 1,
+          url:
+            "http://www.ncrcgastro.org/d/file/coordination/apply/2020-05-27/67235e21623910e9e0c04f23fa3314d6.docx",
+          label: "国家消化道早癌防治中心”（早期胃癌筛查项目）申请表.docx",
+          size: "35.7 KB",
+        },
+        {
+          id: 2,
+          url:
+            "http://www.ncrcgastro.org/d/file/coordination/apply/2019-06-05/3ecfa10aa09afdf73526d41cda151d0f.pdf",
+          label: "早期胃癌筛查项目 申请表填写标准(1).pdf",
+          size: "351 KB",
+        },
+        {
+          id: 3,
+          url:
+            "http://www.ncrcgastro.org/d/file/coordination/apply/2019-06-05/a18cf8ea29d870da693ea8bd79d2ce33.docx",
+          label: "信息系统账号申请表(2).docx",
+          size: "22 KB",
+        },
+        {
+          id: 4,
+          url:
+            "http://www.ncrcgastro.org/d/file/coordination/apply/2019-06-12/206be4b4d462aa5812dbba723e69f518.docx",
+          label: "GECA联盟申请Q&A问答汇总.docx",
+          size: "216 KB",
+        },
+      ],
+    }
+  },
+  methods: {
+    download({ url, label }) {
+      const el = document.createElement("a")
+      el.download = label
+      el.target = "_blank"
+      el.style.display = "none"
+      el.href = url
+      document.body.appendChild(el)
+      el.click()
+      URL.revokeObjectURL(el.href)
+      document.body.removeChild(el)
+    },
+  },
+  mounted() {},
+  watch: {},
+}
+</script>
+<style lang="scss" scoped>
+.container {
+  padding: 30px 10px;
+  h2 {
+    font-weight: bold;
+    font-size: 28px;
+    text-align: center;
+    height: 36px;
+    font-size: 32px;
+    font-family: AlibabaPuHuiTiB;
+    letter-spacing: 3px;
+    margin-bottom: 50px;
+    color: #4e68ff;
+    line-height: 36px;
+  }
+  .content {
+    padding-left: 30px;
+    letter-spacing: 1px;
+    h3 {
+      font-size: 18px;
+      font-weight: bold;
+      color: #333333;
+      line-height: 50px;
+      margin-top: 10px;
+    }
+    p {
+      line-height: 20px;
+      padding-left: 15px;
+    }
+  }
+  .upload_item {
+    width: 780px;
+    height: 60px;
+    background: #f5f5f5;
+    border-radius: 8px;
+    line-height: 60px;
+    overflow: hidden;
+    margin-bottom: 20px;
+    .img-file {
+      float: left;
+      padding: 0 10px;
+      width: 60px;
+      line-height: 60px;
+      img {
+        transform: translateY(10px);
+        width: 40px;
+        height: 40px;
+      }
+    }
+    .upload_label {
+      float: left;
+    }
+    .img-load {
+      float: right;
+      width: 60px;
+      height: 60px;
+      background-color: #ebeeff;
+      text-align: center;
+      cursor: pointer;
+      img {
+        transform: translateY(10px);
+        width: 28px;
+        height: 28px;
+      }
+    }
+
+    strong {
+      color: #333333;
+      font-size: 16px;
+      margin-right: 10px;
+    }
+  }
+  .sub_title {
+    font-size: 18px;
+    font-weight: bold;
+    color: #333333;
+    margin: 10px;
+    padding-left: 15px;
+    letter-spacing: 2px;
+    position: relative;
+    &::before {
+      content: " ";
+      border-left: 4px solid #4e68ff;
+      position: absolute;
+      height: 18px;
+      top: 4px;
+      left: 0;
+    }
+  }
+}
+</style>
diff --git a/src/views/Home/notice/components/HospitalsList.vue b/src/views/Home/notice/components/HospitalsList.vue
new file mode 100644
index 0000000000000000000000000000000000000000..73eb847a94e276de80b3b6cd2cc10f58fcc852a8
--- /dev/null
+++ b/src/views/Home/notice/components/HospitalsList.vue
@@ -0,0 +1,258 @@
+<template>
+  <div class="container">
+    <h2>GECA联盟理事及医院名单</h2>
+    <div v-for="row in list" :key="row.label">
+      <div class="sub_title">
+        {{ row.label }}
+      </div>
+      <div class="content">
+        <span v-for="item in row.items" :key="item">{{ item }}</span>
+      </div>
+    </div>
+    <div style="padding-left: 48px">
+      <img src="@/assets/img/Home/trustee.png" alt="" />
+    </div>
+    <div class="sub_title">CEGA联盟医院名单</div>
+    <el-table :data="tableData" :span-method="objectSpanMethod" border>
+      <el-table-column width="60" type="index">
+        <template #header>
+          <div>序号</div>
+        </template>
+      </el-table-column>
+      <el-table-column prop="s" label="省份/直辖市" min-width="160px">
+      </el-table-column>
+      <el-table-column prop="n" label="医院名称" align="left" min-width="340px">
+      </el-table-column>
+      <el-table-column
+        prop="a"
+        label="授牌医院"
+        min-width="110px"
+        class-name="mark"
+      >
+      </el-table-column>
+      <el-table-column
+        prop="t"
+        label="填报数据医院"
+        min-width="140px"
+        class-name="mark"
+      >
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+<script>
+import tableData from "./tpl"
+export default {
+  data() {
+    return {
+      list: [
+        {
+          label: "名誉理事长",
+          items: [
+            "白书忠",
+            "程书钧",
+            "樊代明",
+            "赫捷",
+            "林东昕",
+            "沈洪兵",
+            "沈祖尧",
+            "王陇德",
+            "于金明",
+            "詹启敏",
+            "张雁灵",
+            "郑树",
+          ],
+        },
+        {
+          label: "顾问",
+          items: [
+            "姜庆五",
+            "陆星华",
+            "夏玉亭",
+            "游苏宁",
+            "于中麟",
+            "袁媛",
+            "张齐联",
+            "张子琪",
+          ],
+        },
+        {
+          label: "副理事长",
+          items: [
+            "曹志强",
+            "曾强",
+            "陈刚",
+            "陈广域",
+            "陈昱湖",
+            "陈薇娜",
+            "陈卫昌",
+            "丁俊峰",
+            "房静远",
+            "冯佶",
+            "高峰",
+            "郭学刚",
+            "何纳",
+            "吉朋松",
+            "季加孚",
+            "金震东",
+            "兰平",
+            "李少辉",
+            "李挺",
+            "李汛",
+            "李延青",
+            "廖专",
+            "令孤恩强",
+            "刘峰",
+            "刘小梅",
+            "吕宾",
+            "马进",
+            "唐承薇",
+            "王贵齐",
+            "王磊",
+            "王立东",
+            "邬堂春",
+            "吴开春",
+            "徐国良",
+            "杨爱明",
+            "杨嘉林",
+            "杨民",
+            "杨云生",
+            "姚俊杰",
+            "张澍田",
+            "张晓华",
+            "周丽雅",
+            "邹晓平",
+          ],
+        },
+        {
+          label: "秘书长",
+          items: ["杜奕奇"],
+        },
+        {
+          label: "常务副秘书长",
+          items: ["柏愚", "蔡全才", "王洛伟"],
+        },
+        {
+          label: "副秘书长",
+          items: [
+            "柴宁莉",
+            "常佳",
+            "董莉君",
+            "冀明",
+            "李方",
+            "李锐",
+            "钱朝斌",
+            "颜杰",
+            "姚方",
+            "尹畅",
+            "张磊",
+          ],
+        },
+        {
+          label: "秘书",
+          items: [
+            "陈丽竹",
+            "崔勇",
+            "杜寒",
+            "郝阳帆",
+            "胡良皞",
+            "胡亚琴",
+            "王天骄",
+            "吴萍",
+            "辛磊",
+            "徐美玲",
+            "张辉",
+            "张颖",
+          ],
+        },
+        {
+          label: "常务理事",
+        },
+      ],
+      tableData,
+    }
+  },
+  methods: {
+    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+      if (columnIndex === 1) {
+        if (row.span) {
+          return {
+            rowspan: row.span,
+            colspan: 1,
+          }
+        } else {
+          return {
+            rowspan: 0,
+            colspan: 0,
+          }
+        }
+      }
+    },
+  },
+  mounted() {},
+  watch: {},
+}
+</script>
+<style lang="scss" scoped>
+.container {
+  padding: 30px 10px;
+  ::v-deep .el-table {
+    margin-top: 20px;
+    margin-left: 20px;
+    width: 820px;
+    font-size: 16px;
+    td.mark .cell {
+      font-weight: bold;
+      color: #4e68ff;
+    }
+    td.is-left {
+      text-align: left;
+    }
+  }
+  h2 {
+    font-weight: bold;
+    font-size: 28px;
+    text-align: center;
+    height: 36px;
+    font-size: 32px;
+    font-family: AlibabaPuHuiTiB;
+    letter-spacing: 3px;
+    margin-bottom: 50px;
+    color: #4e68ff;
+    line-height: 36px;
+  }
+  .sub_title {
+    font-size: 18px;
+    font-weight: bold;
+    color: #333333;
+    margin: 10px 20px;
+    padding-left: 15px;
+    letter-spacing: 2px;
+    position: relative;
+    &::before {
+      content: " ";
+      border-left: 4px solid #4e68ff;
+      position: absolute;
+      height: 18px;
+      top: 4px;
+      left: 0;
+    }
+  }
+  .content {
+    width: 800px;
+    font-size: 16px;
+    font-family: AlibabaPuHuiTiR;
+    color: #333333;
+    line-height: 35px;
+    padding-left: 50px;
+    padding-bottom: 10px;
+    span {
+      display: inline-block;
+      width: 65px;
+      margin-right: 50px;
+      text-align: justify;
+      text-align-last: justify;
+    }
+  }
+}
+</style>
diff --git a/src/views/Home/notice/components/tpl.js b/src/views/Home/notice/components/tpl.js
new file mode 100644
index 0000000000000000000000000000000000000000..d4e6801a8e033c9468fcf5456ae8bd0569c65257
--- /dev/null
+++ b/src/views/Home/notice/components/tpl.js
@@ -0,0 +1,339 @@
+export default [
+  //1
+  { n: "北京大学第三医院", s: "北京市", a: "✔", span: 11 },
+  { n: "北京京煤集团总医院", s: "北京市" },
+  { n: "北京市和平里医院", s: "北京市", a: "✔", t: "✔" },
+  { n: "北京协和医院", s: "北京市", a: "✔" },
+  { n: "北京燕化医院", s: "北京市", a: "✔", t: "✔" },
+  { n: "陆军总医院", s: "北京市", a: "✔" },
+  { n: "清华大学第一附属医院", s: "北京市", a: "✔" },
+  { n: "首都医科大学附属北京天坛医院", s: "北京市", a: "✔" },
+  { n: "首都医科大学附属北京友谊医院", s: "北京市", a: "✔" },
+  { n: "中国人民解放军总医院", s: "北京市", a: "✔" },
+  { n: "中国医学科学院肿瘤医院", s: "北京市", a: "✔" },
+  //12
+  { n: "复旦大学附属中山医院", s: "上海市", a: "✔", span: 10 },
+  { n: "上海交通大学医学院附属仁济医院", s: "上海市", a: "✔" },
+  { n: "上海交通大学医学院附属瑞金医院", s: "上海市", a: "✔" },
+  { n: "上海市第八人民医院", s: "上海市" },
+  { n: "上海市光华中西医结合医院", s: "上海市", a: "✔" },
+  { n: "上海市浦东医院", s: "上海市", a: "✔" },
+  { n: "上海市普陀区中心医院", s: "上海市" },
+  { n: "上海市松江区中心医院", s: "上海市", a: "✔" },
+  { n: "上海长海医院", s: "上海市", a: "✔", t: "✔" },
+  { n: "同济大学附属同济医院", s: "上海市", a: "✔" },
+  //22
+  { n: "陆军军医大学大坪医院", s: "重庆市", a: "✔", span: 7 },
+  { n: "陆军军医大学西南医院", s: "重庆市", a: "✔" },
+  { n: "陆军军医大学新桥医院", s: "重庆市", a: "✔" },
+  { n: "沙坪坝区人民医院", s: "重庆市" },
+  { n: "重庆市中医院", s: "重庆市", a: "✔", t: "✔" },
+  { n: "重庆市肿瘤医院", s: "重庆市" },
+  { n: "重庆医科大学附属第二医院", s: "重庆市", a: "✔" },
+  //29
+  { n: "安徽淮南朝阳医院", s: "安徽省", span: 10 },
+  { n: "安徽省蚌埠医学院第二附属医院", s: "安徽省" },
+  { n: "安徽省立医院", s: "安徽省" },
+  { n: "安徽医科大学第一附属医院", s: "安徽省", a: "✔" },
+  { n: "安庆市立医院", s: "安徽省", a: "✔" },
+  { n: "蚌埠医学院第一附属医院", s: "安徽省", a: "✔" },
+  { n: "淮北市人民医院", s: "安徽省", t: "✔" },
+  { n: "皖南医学院第二附属医院", s: "安徽省", t: "✔" },
+  { n: "皖南医学院弋矶山医院", s: "安徽省", a: "✔" },
+  { n: "中国人民解放军海军安庆医院", s: "安徽省" },
+  //39
+  { n: "福建省老年医院", s: "福建省", span: 10 },
+  { n: "福建省立医院南院(省立金山医院)", s: "福建省", t: "✔" },
+  { n: "福建省肿瘤医院", s: "福建省", a: "✔" },
+  { n: "福建医科大学附属第二医院", s: "福建省" },
+  { n: "南京军区福州总医院", s: "福建省", a: "✔" },
+  { n: "宁德市医院", s: "福建省" },
+  { n: "宁德市中医院", s: "福建省" },
+  { n: "三明市第一医院", s: "福建省" },
+  { n: "石狮市总医院", s: "福建省", a: "✔" },
+  { n: "漳州正兴医院", s: "福建省" },
+
+  // 49
+  { n: "兰州大学第一医院", s: "甘肃省", a: "✔", span: 3 },
+  { n: "兰州市第一人民医院", s: "甘肃省", a: "✔", t: "✔" },
+  { n: "武威肿瘤医院", s: "甘肃省", a: "✔" },
+
+  //52
+  { n: "潮州市人民医院", s: "广东省", span: 43 },
+  { n: "东源县中医院", s: "广东省" },
+  { n: "佛冈县人民医院", s: "广东省" },
+  { n: "佛山市第二人民医院", s: "广东省" },
+  { n: "佛山市中医院", s: "广东省" },
+  { n: "广东韶关市第一人民医院", s: "广东省" },
+  { n: "广东省佛山市南海区人民医院", s: "广东省" },
+  { n: "广东省惠州市第一人民医院", s: "广东省" },
+  { n: "广东省惠州市中心人民医院", s: "广东省", t: "✔" },
+  { n: "广东省罗定市人民医院", s: "广东省" },
+  { n: "广东省人民医院", s: "广东省" },
+  { n: "广东省人民医院珠海医院", s: "广东省" },
+  { n: "广东省四会市人民医院", s: "广东省" },
+  { n: "广东省肇庆市高要区人民医院", s: "广东省" },
+  { n: "广东省中山市黄圃人民医院", s: "广东省" },
+  { n: "广东省中医院珠海医院", s: "广东省" },
+  { n: "广州市第一人民医院", a: "✔", s: "广东省" },
+  { n: "广州市番禺区中心医院", a: "✔", s: "广东省" },
+  { n: "广州市花都区人民医院", s: "广东省" },
+  { n: "广州市中西医结合医院", s: "广东省" },
+  { n: "广州医科大学附属第二医院", a: "✔", s: "广东省", t: "✔" },
+  { n: "广州医科大学附属第五医院", a: "✔", s: "广东省" },
+  { n: "广州中医药大学第一附属医院", s: "广东省" },
+  { n: "怀集县人民医院", s: "广东省" },
+  { n: "暨南大学附属第一医(广州华侨医院）", s: "广东省" },
+  { n: "江门市中心医院", s: "广东省" },
+  { n: "茂名市人民医院", a: "✔", s: "广东省", t: "✔" },
+  { n: "南方医科大学南方医院", a: "✔", s: "广东省", t: "✔" },
+  { n: "南方医科大学深圳医院", a: "✔", s: "广东省" },
+  { n: "南方医科大学珠江医院", s: "广东省" },
+  { n: "清远市人民医院", s: "广东省", a: "✔" },
+  { n: "韶关市粤北人民医院", s: "广东省" },
+  { n: "深圳市宝安第二人民医院（集团）", s: "广东省", a: "✔" },
+  { n: "深圳市罗湖区人民医院", s: "广东省" },
+  { n: "中国人民解放军南部战区总医院", s: "广东省" },
+  { n: "中山大学附属第二医院", s: "广东省" },
+  { n: "中山大学附属第六医院", s: "广东省" },
+  { n: "中山大学附属第五医院", s: "广东省" },
+  { n: "中山大学附属第一医院", s: "广东省", a: "✔" },
+  { n: "中山市小榄人民医院", s: "广东省", a: "✔", t: "✔" },
+  { n: "中信健康管理中心", s: "广东省", a: "✔" },
+  { n: "珠海市人民医院", s: "广东省", t: "✔", a: "✔" },
+  { n: "遵义医学院第五附属珠海医院", s: "广东省" },
+
+  // 95
+  { n: "贵州省第三人民医院", s: "贵州省", span: 4 },
+  { n: "贵州省医科大学附属医院", s: "贵州省" },
+  { n: "贵州省肿瘤医院", s: "贵州省" },
+  { n: "遵义医学院附属医院", s: "贵州省", a: "✔" },
+  // 99
+  { n: "海南省肿瘤医院", s: "海南省", a: "✔", span: 1 },
+  // 100
+  { n: "哈励逊国际和平医院", s: "河北省", span: 7 },
+  { n: "邯郸市第一医院", s: "河北省" },
+  { n: "邯郸市中心医院", s: "河北省" },
+  { n: "河北省人民医院", s: "河北省", a: "✔" },
+  { n: "河北医科大学第二医院", s: "河北省", a: "✔" },
+  { n: "河北医科大学第三医院", s: "河北省", a: "✔" },
+  { n: "邢台医学高等专科学校第一附属医院", s: "河北省" },
+  // 107
+  { n: "河南宏力医院", s: "河南省", span: 10 },
+  { n: "河南中医药大学第三附属医院", s: "河南省", a: "✔" },
+  { n: "黄河水利委员会黄河中心医院", s: "河南省", a: "✔" },
+  { n: "平煤神马医疗集团总医院", s: "河南省" },
+  { n: "西峡县人民医院", s: "河南省" },
+  { n: "新乡市第一人民医院", s: "河南省" },
+  { n: "新乡医学院第一附属医院", s: "河南省", a: "✔" },
+  { n: "许昌市人民医院", s: "河南省" },
+  { n: "郑州大学第五附属医院", s: "河南省", a: "✔" },
+  { n: "郑州颐和医院", s: "河南省" },
+  // 117
+  { n: "大庆油田总医院", s: "黑龙江省", span: 15, a: "✔" },
+  { n: "哈尔滨汽轮机厂医院", s: "黑龙江省" },
+  { n: "哈尔滨医科大学附属第二医院", s: "黑龙江省" },
+  { n: "哈尔滨医科大学附属第一医院", s: "黑龙江省", a: "✔" },
+  { n: "鹤岗鹤矿医院", s: "黑龙江省" },
+  { n: "鹤岗市人民医院", s: "黑龙江省" },
+  { n: "黑龙江省医院", s: "黑龙江省", a: "✔" },
+  { n: "黑龙江中医药大学附属第二医院", s: "黑龙江省" },
+  { n: "鸡西矿业集团总医院", s: "黑龙江省" },
+  { n: "鸡西人民医院", s: "黑龙江省" },
+  { n: "佳木斯大学附属第一医院", s: "黑龙江省" },
+  { n: "七台河市七煤医院", s: "黑龙江省" },
+  { n: "七台河市人民医院", s: "黑龙江省" },
+  { n: "双鸭山人民医院", s: "黑龙江省", t: "✔" },
+  { n: "双鸭山市双矿医院", s: "黑龙江省" },
+
+  // 132
+  { n: "恩施土家族苗族自治州中心医院", span: 20, s: "湖北省" },
+  { n: "湖北民族学院附属民大医院" },
+  { n: "湖北省第三人民医院" },
+  { n: "湖北省建始县人民医院" },
+  { n: "华中科技大学同济医学院附属同济医院" },
+  { n: "华中科技大学同济医学院附属协和医院" },
+  { n: "荆门市第二人民医院" },
+  { n: "荆门市第一人民医院" },
+  { n: "荆门市中医医院" },
+  { n: "荆州市第一人民医院" },
+  { n: "荆州市中心医院" },
+  { n: "三峡大学附属仁和医院" },
+  { n: "十堰市人民医院" },
+  { n: "十堰市太和医院" },
+  { n: "武汉大学人民医院", a: "✔" },
+  { n: "武汉大学中南医院", a: "✔" },
+  { n: "武汉市中心医院", a: "✔" },
+  { n: "宜昌市第一人民医院" },
+  { n: "宜昌市夷陵医院" },
+  { n: "宜昌市中心人民医院", a: "✔", t: "✔" },
+  // 152
+  { n: "南华大学附属第二医院", span: 4, s: "湖南省" },
+  { n: "南华大学附属第一医院", a: "✔" },
+  { n: "中南大学湘雅二医院", a: "✔" },
+  { n: "中南大学湘雅医院" },
+
+  // 156
+  { n: "吉林大学第一医院", span: 3, s: "吉林省", a: "✔" },
+  { n: "吉林大学中日联谊医院", a: "✔" },
+  { n: "长春市中心医院", a: "✔" },
+  // 159
+  { n: "鹅湖人民医院", s: "江苏省", a: "✔", span: 24 },
+  { n: "江南大学附属医院", a: "✔" },
+  { n: "江苏省第二中医院" },
+  { n: "江苏省人民医院", a: "✔" },
+  { n: "江阴市人民医院", a: "✔", t: "✔" },
+  { n: "昆山市第三人民医院", t: "✔" },
+  { n: "昆山中医医院", a: "✔", t: "✔" },
+  { n: "连云港市第二人民医院" },
+  { n: "南京鼓楼医院", a: "✔" },
+  { n: "南京市第一医院", a: "✔" },
+  { n: "南京医科大学第二附属医院", a: "✔" },
+  { n: "苏州大学附属第一医院", a: "✔" },
+  { n: "泰康仙林鼓楼医院", t: "✔" },
+  { n: "无锡市第二人民医院", a: "✔", t: "✔" },
+  { n: "无锡市第二中医医院", a: "✔", t: "✔" },
+  { n: "无锡市第三人民医院", a: "✔", t: "✔" },
+  { n: "无锡市人民医院", a: "✔", t: "✔" },
+  { n: "无锡市锡山人民医院", a: "✔", t: "✔" },
+  { n: "无锡市中医医院", a: "✔", t: "✔" },
+  { n: "徐州医科大学附属医院", a: "✔" },
+  { n: "盐城市大丰同仁医院" },
+  { n: "宜兴市人民医院", a: "✔", t: "✔" },
+  { n: "镇江市第一人民医院", a: "✔" },
+  { n: "中国人民解放军第101医院", a: "✔", t: "✔" },
+  //183
+  { n: "赣南医学院第一附属医院", s: "江西省", span: 13, a: "✔" },
+  { n: "赣州市人民医院", a: "✔" },
+  { n: "江西省九江学院附属医院" },
+  { n: "南昌大学第一附属医院", a: "✔" },
+  { n: "南昌市第一医院" },
+  { n: "萍乡市人民医院", t: "✔" },
+  { n: "上饶市立医院" },
+  { n: "上饶市人民医院" },
+  { n: "宜春市人民医院" },
+  { n: "鹰潭市人民医院" },
+  { n: "鹰潭市中医院" },
+  { n: "于都县人民医院", a: "✔" },
+  { n: "中国人民解放军联勤保障部队第九〇八医院" },
+  //196
+  { n: "本溪市中心医院", s: "辽宁省", span: 3 },
+  { n: "营口市中心医院" },
+  { n: "中国医科大学附属盛京医院", a: "✔" },
+  //199
+  { n: "青海大学附属医院", s: "青海省", span: 1 },
+  //200
+  { n: "滨州医学院附属医院", s: "山东省", a: "✔", span: 15 },
+  { n: "德州市人民医院" },
+  { n: "临沂市中心医院" },
+  { n: "青岛大学附属医院", a: "✔" },
+  { n: "庆云县人民医院" },
+  { n: "山东大学齐鲁医院", a: "✔" },
+  { n: "山东省立医院", a: "✔" },
+  { n: "胜利油田中心医院", a: "✔", t: "✔" },
+  { n: "滕州市中心人民医院" },
+  { n: "威海市立医院" },
+  { n: "威海市中心医院", a: "✔" },
+  { n: "烟台市烟台山医院", a: "✔" },
+  { n: "烟台毓璜顶医院", a: "✔" },
+  { n: "阳光融和医院" },
+  { n: "中国人民解放军联勤保障部队第九七〇医院" },
+  //215
+  { n: "大同大学附属医院", s: "山西省", span: 11 },
+  { n: "大同市第二人民医院肿瘤医院", a: "✔" },
+  { n: "大同市第三人民医院" },
+  { n: "大同市第五人民医院" },
+  { n: "山西晋城无烟煤矿业集团有限责任公司总医院" },
+  { n: "山西省人民医院", a: "✔", t: "✔" },
+  { n: "山西省中医药研究院" },
+  { n: "太原市中心医院" },
+  { n: "同煤集团公司总医院" },
+  { n: "长治医学院附属和平医院", a: "✔" },
+  { n: "中化二建集团医院" },
+  // 226
+  { n: "安康市中心医院", s: "陕西省", span: 7, a: "✔" },
+  { n: "宝鸡市人民医院" },
+  { n: "西安交通大学第二附属医院", a: "✔" },
+  { n: "西安交通大学第一附属医院", a: "✔" },
+  { n: "西安市中心医院" },
+  { n: "西安医学院第一附属医院" },
+  { n: "榆林市第二医院", a: "✔" },
+  //233
+  { n: "阿坝藏族羌族自治州人民医院", s: "四川省", span: 30, t: "✔" },
+  { n: "成都市第二人民医院" },
+  { n: "成都市第三人民医院", a: "✔", t: "✔" },
+  { n: "成都市第五人民医院" },
+  { n: "成都市龙泉驿区第一人民医院", t: "✔" },
+  { n: "成都市郫都区人民医院" },
+  { n: "成都市温江区人民医院" },
+  { n: "成都天府新区人民医院" },
+  { n: "成都医学院第一附属医院" },
+  { n: "川北医学院附属医院" },
+  { n: "达川区人民医院" },
+  { n: "达州市中西医结合医院" },
+  { n: "达州市中心医院" },
+  { n: "都江堰市人民医院", t: "✔" },
+  { n: "广元市第三人民医院" },
+  { n: "广元市第四人民医院" },
+  { n: "广元市中心医院" },
+  { n: "乐山市人民医院", a: "✔" },
+  { n: "绵阳市中心医院" },
+  { n: "绵竹市人民医院" },
+  { n: "四川宝石花医院" },
+  { n: "四川大学华西医院", a: "✔" },
+  { n: "四川简阳市人民医院", t: "✔" },
+  { n: "四川省科学城医院" },
+  { n: "四川省内江市中医院" },
+  { n: "四川省人民医院", a: "✔" },
+  { n: "四川省自贡市第一人民医院", t: "✔" },
+  { n: "西藏自治区人民政府驻成都办事处医院", a: "✔" },
+  { n: "雅安市人民医院" },
+  { n: "中江县人民医院" },
+  //263
+  { n: "大理白族自治州人民医院", a: "✔", s: "云南省", span: 6 },
+  { n: "个旧市人民医院" },
+  { n: "昆明医科大学第一附属医院", a: "✔" },
+  { n: "曲靖市第一人民医院", a: "✔" },
+  { n: "文山市人民医院" },
+  { n: "云南省第一人民医院", a: "✔" },
+  //269
+  { n: "滨海县人民医院", s: "浙江省", span: 9 },
+  { n: "淳安县第一人民医院" },
+  { n: "建德市第一人民医院" },
+  { n: "宁波市医疗中心李惠利医院" },
+  { n: "桐庐县中医院" },
+  { n: "永康方大瑞金医院" },
+  { n: "浙江衢化医院" },
+  { n: "浙江省台州医院", a: "✔" },
+  { n: "浙江省中医院", a: "✔" },
+  //278
+  { n: "广西象州县中医医院", s: "广西壮族自治区", span: 5 },
+  { n: "广西医科大学第一附属医院", a: "✔" },
+  { n: "广西壮族自治区南溪山医院", a: "✔", t: "✔" },
+  { n: "桂林市第二人民医院" },
+  { n: "钦州第二人民医院", a: "✔", t: "✔" },
+  //283
+  { n: "宁夏回族自治区人民医院", s: "宁夏回族自治区", span: 3 },
+  { n: "宁夏人民医院宁南医院", s: "宁夏回族自治区", t: "✔" },
+  { n: "宁夏医科大学总医院", s: "宁夏回族自治区", a: "✔", t: "✔" },
+  // 286
+  { n: "巴彦淖尔市医院", s: "内蒙古自治区", span: 15 },
+  { n: "包钢集团第三职工医院" },
+  { n: "包头市蒙医中医医院" },
+  { n: "包头市中心医院" },
+  { n: "包头市肿瘤医院" },
+  { n: "包头医学院第二附属医院" },
+  { n: "鄂尔多斯市中心医院", a: "✔" },
+  { n: "呼和浩特市第一医院" },
+  { n: "呼伦贝尔市人民医院" },
+  { n: "内蒙古科技大学包头医学院第一附属医院", a: "✔" },
+  { n: "内蒙古医科大学附属医院", a: "✔" },
+  { n: "内蒙古自治区人民医院" },
+  { n: "内蒙古自治区中医医院" },
+  { n: "乌海市人民医院" },
+  { n: "准格尔旗中心医院" },
+
+  { n: "新疆维吾尔自治区人民医院", s: "新疆维吾尔自治区", span: 3, a: "✔" },
+  { n: "新疆伊犁哈萨克自治州友谊医院", s: "新疆维吾尔自治区", a: "✔" },
+  { n: "新疆医科大学第一附属医院", s: "新疆维吾尔自治区", a: "✔" },
+]
diff --git a/src/views/Home/notice/index.vue b/src/views/Home/notice/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..0b642c3ef91f2ff15cf554df04a5437886150b08
--- /dev/null
+++ b/src/views/Home/notice/index.vue
@@ -0,0 +1,116 @@
+<template>
+  <el-container>
+    <el-aside width="240px">
+      <h3 class="side_title">通知公告</h3>
+      <ul class="side-list">
+        <li
+          :class="currentComponent === name ? 'active' : ''"
+          v-for="{ isTop, time, name, label } in list"
+          :key="name"
+          @click="currentComponent = name"
+        >
+          <h4>{{ label }}</h4>
+          <div>
+            <span class="isTop" v-if="isTop">置顶</span>
+            <span class="time">{{ time }}</span>
+          </div>
+        </li>
+      </ul>
+    </el-aside>
+    <el-main>
+      <component :is="currentComponent"></component>
+    </el-main>
+  </el-container>
+</template>
+<script>
+import AllianceApply from "./components/AllianceApply.vue"
+import HospitalsList from "./components/HospitalsList.vue"
+export default {
+  name: "Notice",
+  components: {
+    AllianceApply,
+    HospitalsList,
+  },
+  data() {
+    return {
+      list: [
+        {
+          name: "AllianceApply",
+          label: "申请加入国家消化道早癌防治中心联盟",
+          time: "2022-09-20",
+          isTop: true,
+        },
+        {
+          name: "HospitalsList",
+          label: "GECA联盟理事及医院名单",
+          time: "2022-11-20",
+          isTop: true,
+        },
+      ],
+      currentComponent: "AllianceApply",
+    }
+  },
+  methods: {},
+  mounted() {},
+  watch: {},
+}
+</script>
+<style lang="scss" scoped>
+.el-aside {
+  background-color: #fff;
+  border-radius: 4px;
+  .side_title {
+    font-size: 18px;
+    font-weight: bold;
+    color: #333333;
+    margin: 20px;
+    padding-left: 15px;
+    letter-spacing: 2px;
+    border-radius: 4px;
+    position: relative;
+    &::before {
+      content: " ";
+      border-left: 4px solid #4e68ff;
+      position: absolute;
+      height: 18px;
+      top: 4px;
+      left: 0;
+    }
+  }
+  .side-list {
+    li {
+      padding: 20px 15px;
+      cursor: pointer;
+      font-size: 12px;
+      &.active {
+        background: rgba(78, 104, 255, 0.06);
+        h4 {
+          color: #4e68ff;
+        }
+      }
+      h4 {
+        font-size: 16px;
+        letter-spacing: 1px;
+        font-weight: bold;
+        line-height: 26px;
+      }
+      .isTop {
+        width: 32px;
+        height: 20px;
+        padding: 2px 5px;
+        color: #7085fe;
+        background: rgba(112, 133, 254, 0.1);
+        border-radius: 1px;
+      }
+      .time {
+        color: #999999;
+      }
+    }
+  }
+}
+.el-main {
+  background-color: #fff;
+  border-radius: 4px;
+  margin-left: 20px;
+}
+</style>