Merge branch 'master' of http://192.168.0.115:3000/shaogen1995/ShouBo

web/src/views/About/Director.vue

@@ -82,8 +82,8 @@
         </p>
       </div>
       <div class="back_btn"
-        @click="$router.push('/Layout/About')"
-        @keydown.enter.passive="$router.push('/Layout/About')"
+        @click="$router.replace('/Layout/About')"
+        @keydown.enter.passive="$router.replace('/Layout/About')"
         tabindex="0"
         aria-label="Link"
       >

web/src/views/About/President.vue

@@ -48,7 +48,7 @@
         </div>
       </div>
     </div>
-    <div class="back_btn" @click="$router.push('/Layout/About')">Back to top</div>
+    <div class="back_btn" @click="$router.replace('/Layout/About')">Back to top</div>
   </div>
 </template>
 
@@ -170,6 +170,7 @@ export default {
     }
   }
   .back_btn {
+    font-family: Arial, Helvetica, sans-serif;
     height: 38px;
     width: 160px;
     margin: 30px auto;

web/src/views/About/index.vue

@@ -57,8 +57,8 @@
       </div>
       <p
         class="more"
-        @click="$router.push('/Layout/About/Director')"
-        @keydown.enter.passive="$router.push('/Layout/About/Director')"
+        @click="$router.replace('/Layout/About/Director')"
+        @keydown.enter.passive="$router.replace('/Layout/About/Director')"
         tabindex="0"
         aria-label="Link"
       >
@@ -128,8 +128,8 @@
         class="see"
         src="/data/About/a7.gif"
         alt=""
-        @click="$router.push('/Layout/About/link')"
-        @keydown.enter.passive="$router.push('/Layout/About/link')"
+        @click="$router.replace('/Layout/About/link')"
+        @keydown.enter.passive="$router.replace('/Layout/About/link')"
         tabindex="0"
         aria-label="Link"
         aria-description="See More"

web/src/views/Collections/index.vue

@@ -1,24 +1,29 @@
 <template>
   <div class="Collections">
-    <div class="banWrapper"
+    <div
+      class="banWrapper"
       data-aria-viewport-area
       tabindex="0"
-      aria-label aria-description="You've reached the banner area of the Collections section; this section has one image; please use the tab key to go through the content."
+      aria-label
+      aria-description="You've reached the banner area of the Collections section; this section has one image; please use the tab key to go through the content."
     >
-      <div class="ban" tabindex="0" aria-label="Image"
+      <div
+        class="ban"
+        tabindex="0"
+        aria-label="Image"
         aria-description="Colections"
       ></div>
     </div>
     <!-- 面包屑 -->
-    <div class="pos" data-aria-viewport-area tabindex="0"
-      aria-label aria-description="You've reached the path area; this area has three URLs; use the tab key to go through the content."
+    <div
+      class="pos"
+      data-aria-viewport-area
+      tabindex="0"
+      aria-label
+      aria-description="You've reached the path area; this area has three URLs; use the tab key to go through the content."
     >
       <span class="pos1" tabindex="0">Your Position:&nbsp;</span>
-      <Router-link
-        to="/Layout/Home"
-        tabindex="0"
-        aria-description="Home"
-      >
+      <Router-link to="/Layout/Home" tabindex="0" aria-description="Home">
         Home>
       </Router-link>
       <Router-link
@@ -28,18 +33,17 @@
       >
         Collections>
       </Router-link>
-      <Router-link
-        to=""
-        tabindex="0"
-        :aria-description="mbTxt"
-      >
+      <Router-link to="" tabindex="0" :aria-description="mbTxt">
         {{ mbTxt }}>
       </Router-link>
     </div>
     <!-- 内容 -->
     <div class="conten" :class="mbTxt">
-      <ul data-aria-viewport-area tabindex="0"
-        aria-label aria-description="You've reached the collection category menu, please use the tab key to navigate through the menu."
+      <ul
+        data-aria-viewport-area
+        tabindex="0"
+        aria-label
+        aria-description="You've reached the collection category menu, please use the tab key to navigate through the menu."
       >
         <li
           @click="cutTab(item.url)"
@@ -57,8 +61,12 @@
         </li>
       </ul>
       <!-- 右侧内容 -->
-      <div class="right" data-aria-viewport-area tabindex="0"
-        aria-label aria-description="You've reached the tiles of ${keyword}, please use the tab key to go through the tiles."
+      <div
+        class="right"
+        data-aria-viewport-area
+        tabindex="0"
+        aria-label
+        aria-description="You've reached the tiles of ${keyword}, please use the tab key to go through the tiles."
       >
         <div
           class="row"
@@ -70,20 +78,22 @@
           <img
             class="rowImg"
             :src="`/data/Collections/${mbTxt}/${index + 1}.png`"
-            :alt="item.h3.replace(/(<([^>]+)>)/ig, '')"
+            :alt="item.h3.replace(/(<([^>]+)>)/gi, '')"
             tabindex="0"
-            :aria-description="item.h3.replace(/(<([^>]+)>)/ig, '')"
+            :aria-description="item.h3.replace(/(<([^>]+)>)/gi, '')"
           />
           <div class="info">
             <!-- 箭头 -->
             <img src="/data/Collections/arrow.png" alt="" />
-            <h3 v-html="item.h3"
+            <h3
+              v-html="item.h3"
               tabindex="0"
-              :aria-description="item.h3.replace(/(<([^>]+)>)/ig, '')"
+              :aria-description="item.h3.replace(/(<([^>]+)>)/gi, '')"
             ></h3>
-            <p v-html="item.p"
+            <p
+              v-html="item.p"
               tabindex="0"
-              :aria-description="item.p.replace(/(<([^>]+)>)/ig, '')"
+              :aria-description="item.p.replace(/(<([^>]+)>)/gi, '')"
             ></p>
           </div>
         </div>
@@ -136,45 +146,48 @@ export default {
         this.mbTxt = temp;
         this.data = Collections[this.mbTxt];
 
-        let keyword = ''
+        let keyword = "";
         switch (this.mbTxt) {
-          case 'Bronzes':
-            keyword = 'Bronzes'
+          case "Bronzes":
+            keyword = "Bronzes";
             break;
-          case 'Ceramics':
-            keyword = 'Ceramics'
+          case "Ceramics":
+            keyword = "Ceramics";
             break;
-          case 'Buddhist':
-            keyword = 'buddhist statues'
+          case "Buddhist":
+            keyword = "buddhist statues";
             break;
-          case 'Jadewares':
-            keyword = 'Jadewares'
+          case "Jadewares":
+            keyword = "Jadewares";
             break;
-          case 'Calligraphies':
-            keyword = 'Calligraphies'
+          case "Calligraphies":
+            keyword = "Calligraphies";
             break;
-          case 'Paintings':
-            keyword = 'Paintings'
+          case "Paintings":
+            keyword = "Paintings";
             break;
-          case 'Gold':
-            keyword = 'gold & silverwares'
+          case "Gold":
+            keyword = "gold & silverwares";
             break;
-          case 'Coins':
-            keyword = 'coins & banknotes'
+          case "Coins":
+            keyword = "coins & banknotes";
             break;
-          case 'Brocades':
-            keyword = 'brocades & embroideries'
+          case "Brocades":
+            keyword = "brocades & embroideries";
             break;
-          case 'Cultural':
-            keyword = 'cultural supplies'
+          case "Cultural":
+            keyword = "cultural supplies";
             break;
-          case 'Miscellaneous':
-            keyword = 'miscellaneous arts'
+          case "Miscellaneous":
+            keyword = "miscellaneous arts";
             break;
           default:
             break;
         }
-        this.$eventBus.$emit('request-read', `You've reached the page contains tiles of ${keyword} of the Collections section. This page contains one navigation section, six window sections, and one interactive section. To choose a section, please hit the shortcut key.`)
+        this.$eventBus.$emit(
+          "request-read",
+          `You've reached the page contains tiles of ${keyword} of the Collections section. This page contains one navigation section, six window sections, and one interactive section. To choose a section, please hit the shortcut key.`
+        );
       },
       immediate: true,
     },
@@ -192,12 +205,11 @@ export default {
       });
     },
     cutTab(path) {
-      this.$router.push(`/Layout/Collections/${path}`).catch(() => {});
+      this.$router.replace(`/Layout/Collections/${path}`).catch(() => {});
     },
   },
   //生命周期 - 创建完成（可以访问当前this实例）
-  created() {
-  },
+  created() {},
   //生命周期 - 挂载完成（可以访问DOM元素）
   mounted() {},
   beforeCreate() {}, //生命周期 - 创建之前
@@ -299,7 +311,7 @@ export default {
             line-height: 22px;
             padding-bottom: 5px;
             font-weight: 700;
-            /deep/& > i {
+            /deep/i {
               font-style: italic;
             }
             /deep/.smImg {
@@ -310,6 +322,9 @@ export default {
           p {
             font-size: 14px;
             color: #626262;
+            /deep/ i {
+              font-style: italic;
+            }
           }
         }
         &:hover {
@@ -324,6 +339,9 @@ export default {
             }
             p {
               color: #fff;
+              /deep/ i {
+                font-style: italic;
+              }
             }
           }
         }
@@ -731,9 +749,8 @@ export default {
       }
     }
   }
-  .Miscellaneous{
+  .Miscellaneous {
     height: 641px;
   }
-
 }
 </style>

web/src/views/Events/index.vue

@@ -83,7 +83,7 @@ export default {
   //方法集合
   methods: {
     skip(id) {
-      this.$router.push(`/Layout/EventsInfo/${id}`);
+      this.$router.replace(`/Layout/EventsInfo/${id}`);
     },
   },
   //生命周期 - 创建完成（可以访问当前this实例）

web/src/views/Events/info.vue

@@ -140,7 +140,7 @@ export default {
       this.toTop()
     },
     skip(id) {
-      this.$router.push(`/Layout/EventsInfo/${id}`).catch(() => {});
+      this.$router.replace(`/Layout/EventsInfo/${id}`).catch(() => {});
     },
     // 点击回到顶部
     toTop() {

web/src/views/Exhibitions/component/List.vue

@@ -175,7 +175,7 @@ export default {
     // 点击单个文章跳转详情
     toInfo(id){
      let k = this.$route.params.id;
-      this.$router.push({
+      this.$router.replace({
         name:'ExhibitionsInfo',
         query:{id,k}
       })

web/src/views/Exhibitions/index.vue

@@ -129,7 +129,7 @@ export default {
   //方法集合
   methods: {
     skip(url) {
-      this.$router.push(url).catch(() => {});
+      this.$router.replace(url).catch(() => {});
     },
   },
   //生命周期 - 创建完成（可以访问当前this实例）

web/src/views/Exhibitions/info.vue

@@ -126,7 +126,7 @@
         </div>
       </div>
       <!-- Exhibition Objects -->
-      <div class="picpart" ref="Objects" v-if="data.objects !== 0" data-aria-viewport-area tabindex="0"
+      <div class="picpart" ref="Objects" :class="{noShow:data.objects === 0}" data-aria-viewport-area tabindex="0"
         aria-label aria-description="You've reached the section of exhibition objects, please use the tab key to go through the content."
       >
         <div class="title_3" tabindex="0">——<span>Exhibition Objects</span>——</div>
@@ -179,7 +179,7 @@
         data-aria-viewport-area
         tabindex="0"
         aria-label aria-description="You've reached the section of exhibition galleries, please use the tab key to go through the content."
-        v-if="data.galleries !== 0"
+        :class="{noShow:data.galleries === 0}"
       >
         <div class="title_3" tabindex="0">——<span>Exhibition Galleries</span>——</div>
         <!-- 图片 -->
@@ -258,10 +258,10 @@ export default {
     },
     // 点击面包屑的最后一个
     backExh(txt) {
-      if (txt === "Current") this.$router.push("/Layout/Exhibitions/1");
-      else if (txt === "Permanent") this.$router.push("/Layout/Exhibitions/2");
-      else if (txt === "Past") this.$router.push("/Layout/Exhibitions/3");
-      else if (txt === "Overseas") this.$router.push("/Layout/Exhibitions/4");
+      if (txt === "Current") this.$router.replace("/Layout/Exhibitions/1");
+      else if (txt === "Permanent") this.$router.replace("/Layout/Exhibitions/2");
+      else if (txt === "Past") this.$router.replace("/Layout/Exhibitions/3");
+      else if (txt === "Overseas") this.$router.replace("/Layout/Exhibitions/4");
     },
     // 固定滚动的切换
     cutGun(val) {
@@ -471,6 +471,9 @@ export default {
             line-height: 26px;
             text-align: center;
           }
+          /deep/ i {
+            font-style: italic;
+          }
         }
         /deep/p {
           font-size: 18px;
@@ -583,8 +586,15 @@ export default {
         height: auto;
       }
     }
+    .noShow{
+      border:none;
+      padding: 0;
+      height: 0;
+      overflow: hidden;
+    }
   }
   .back_btn {
+    font-family: Arial, Helvetica, sans-serif;
     height: 38px;
     width: 160px;
     margin: 30px auto;

web/src/views/Home/index.vue

@@ -60,7 +60,7 @@
       aria-label aria-description="You've reached the pop-up window section; this section contains four URLs; please use the tab key to go through the content."
     >
       <div
-        class="t1" @click="$router.push('/Layout/Visit/2')"
+        class="t1" @click="$router.replace('/Layout/Visit/2')"
         tabindex="0"
         aria-label="Link"
         aria-description="Reservation"
@@ -84,7 +84,7 @@
           </div>
         </div>
       </div>
-      <div class="t2" @click="$router.push('/Layout/Visit/1')"
+      <div class="t2" @click="$router.replace('/Layout/Visit/1')"
         tabindex="0"
         aria-label="Link"
         aria-description="Visit Info"
@@ -130,7 +130,7 @@
           </div>
         </div>
       </div>
-      <div class="t4" @click="$router.push('/Layout/Events')"
+      <div class="t4" @click="$router.replace('/Layout/Events')"
         tabindex="0"
         aria-label="Link"
         aria-description="Events"
@@ -171,7 +171,7 @@ export default {
   methods: {
     // 底部的跳转
     botskip() {
-      this.$router.push("/Layout/About").catch(() => {});
+      this.$router.replace("/Layout/About").catch(() => {});
       setTimeout(() => {
         window.scrollTo({ top: 1307, behavior: "smooth" });
       }, 100);

web/src/views/JoinSupport/Give.vue

@@ -75,7 +75,7 @@ export default {
   //方法集合
   methods: {
     skip(id) {
-      this.$router.push({
+      this.$router.replace({
         name: "GiveInfo",
         query: { id },
       });

web/src/views/JoinSupport/Volunteer.vue

@@ -45,7 +45,7 @@ export default {
   methods: {
     // 点击单个进入详情
     skip(id) {
-      this.$router.push({
+      this.$router.replace({
         name: "VolunteerInfo",
         query: { id },
       });

web/src/views/JoinSupport/index.vue

@@ -97,7 +97,7 @@ export default {
   //方法集合
   methods: {
     skip(url){
-      this.$router.push(`/Layout/JoinSupport/${url}`).catch(() => {});
+      this.$router.replace(`/Layout/JoinSupport/${url}`).catch(() => {});
     }
   },
   //生命周期 - 创建完成（可以访问当前this实例）

web/src/views/LearnEngage/index.vue

@@ -133,7 +133,7 @@ export default {
   methods: {
     // 跳转到info页面
     toInfo(id) {
-      this.$router.push({
+      this.$router.replace({
         name: "LearnEngageInfo",
         query: { id, k:this.topId,m:this.pageSize},
       });
@@ -144,7 +144,7 @@ export default {
       window.scrollTo({ top: 300, behavior: "smooth" });
     },
     skip(url) {
-      this.$router.push(url).catch(() => {});
+      this.$router.replace(url).catch(() => {});
     },
     // 封装一个处理数据的方法
     getData() {

web/src/views/LearnEngage/info.vue

@@ -76,8 +76,8 @@
         </div>
         <div
           class="back"
-          @click="$router.push(`/Layout/LearnEngage/${mbTxt}?m=${pageSize}`)"
-          @keydown.enter.passive="$router.push(`/Layout/LearnEngage/${mbTxt}?m=${pageSize}`)"
+          @click="$router.replace(`/Layout/LearnEngage/${mbTxt}?m=${pageSize}`)"
+          @keydown.enter.passive="$router.replace(`/Layout/LearnEngage/${mbTxt}?m=${pageSize}`)"
           tabindex="0"
           aria-label="Link"
         >

web/src/views/Publications/Publications1.vue

@@ -105,7 +105,7 @@ export default {
   methods: {
     // 点击书籍跳转
     jump(id) {
-      this.$router.push({
+      this.$router.replace({
         name: "PublicationsInfo",
         query: { id },
       });

web/src/views/Publications/index.vue

@@ -91,11 +91,11 @@ export default {
         else if (id <= 17) temp = 2019;
         else if (id <= 23) temp = 2018;
         else temp = 2017;
-        this.$router.push({
+        this.$router.replace({
           name: "Publications1",
           query: { k: temp },
         });
-      } else this.$router.push(url).catch(() => {});
+      } else this.$router.replace(url).catch(() => {});
     },
     backUrl() {
       if (this.$route.path === "/Layout/PublicationsInfo") {
@@ -107,7 +107,7 @@ export default {
         else if (id <= 17) temp = 2019;
         else if (id <= 23) temp = 2018;
         else temp = 2017;
-        this.$router.push({
+        this.$router.replace({
           name: "Publications1",
           query: { k: temp },
         });

web/src/views/Search/data.js

@@ -259,7 +259,7 @@ export const Exhibitions = [
     id: 33,
     cover: '/data/Exhibitions/Past/23.jpg',
     h3: 'Chinese Traditional Custom of the Birthday Celebration for the Senior Citizen',
-    p: '​The exhibition "Chinese Traditional Custom of the Birthday Celebration for the Senior Citizen," sponsored by the Embassy of People"s Republic of China in the Republic of Mauritius, Ministry of Arts and Culture in the Republic of Mauritius and the Beijing Municipal Administration of Cultural Heritage, and hosted by the China Cultural Center in Mauritius and the Capital Museum, was unveiled on Feb. 10, 2018 at the Cultural Center."',
+    p: `The exhibition "Chinese Traditional Custom of the Birthday Celebration for the Senior Citizen," sponsored by the Embassy of People's Republic of China in the Republic of Mauritius, Ministry of Arts and Culture in the Republic of Mauritius and the Beijing Municipal Administration of Cultural Heritage, and hosted by the China Cultural Center in Mauritius and the Capital Museum, was unveiled on Feb. 10, 2018 at the Cultural Center."`,
     path: '#/Layout/ExhibitionsInfo?id=33&k=3'
   },
   {

web/src/views/Search/dataAll.js

@@ -257,7 +257,7 @@ export const dataAll = [
     id: 33,
     cover: '/data/Exhibitions/Past/23.jpg',
     h3: 'Chinese Traditional Custom of the Birthday Celebration for the Senior Citizen',
-    p: '​The exhibition "Chinese Traditional Custom of the Birthday Celebration for the Senior Citizen," sponsored by the Embassy of People"s Republic of China in the Republic of Mauritius, Ministry of Arts and Culture in the Republic of Mauritius and the Beijing Municipal Administration of Cultural Heritage, and hosted by the China Cultural Center in Mauritius and the Capital Museum, was unveiled on Feb. 10, 2018 at the Cultural Center."',
+    p: `The exhibition "Chinese Traditional Custom of the Birthday Celebration for the Senior Citizen," sponsored by the Embassy of People's Republic of China in the Republic of Mauritius, Ministry of Arts and Culture in the Republic of Mauritius and the Beijing Municipal Administration of Cultural Heritage, and hosted by the China Cultural Center in Mauritius and the Capital Museum, was unveiled on Feb. 10, 2018 at the Cultural Center."`,
     path: '#/Layout/ExhibitionsInfo?id=33&k=3'
   },
   {

web/src/views/Visit/Visit2.vue

@@ -2,7 +2,7 @@
   <div class="Visit2" data-aria-viewport-area tabindex="0"
     aria-label aria-description="You've reached the content area for the Reservation page. This area contains three parts of content. Please press the tab key to browse the information."
   >
-    <div
+    <!-- <div
       class="public"
       :class="{ hintShow: hintShow }"
       @click="hintShow = true"
@@ -14,7 +14,7 @@
         The reservation service is now under maintenance. Please go to Capital
         Museum's WeChat account for reservation.<span>X</span>
       </div>
-    </div>
+    </div> -->
     <div class="mm1">
       <div class="mm1l">
         <p>
@@ -34,18 +34,18 @@
           required to show the number and valid ID in order to receive free
           entrance tickets on the day of their visit.
         </p>
-        <h2 tabindex="0">Online Reservation</h2>
+        <!-- <h2 tabindex="0">Online Reservation</h2> -->
       </div>
     </div>
     <div class="sidebar">
       <ul>
         <!-- 第一个内容 -->
         <li class="title">
+          <div class="showCon" @click="cutFlag('one')"></div>
           <span tabindex="0">Guidelines for Reservations</span>
           <span
             class="arrow"
             :class="{ 'arrow-up': flag === 'one' }"
-            @click="cutFlag('one')"
             @keydown.enter.passive="cutFlag('one')"
             tabindex="0"
             aria-label="Button"
@@ -223,6 +223,7 @@
                 </tr>
               </tbody>
             </table>
+            <br/>
             <table data-sort="sortDisabled">
               <tbody>
                 <tr class="firstRow">
@@ -371,11 +372,11 @@
         </li>
         <!-- 第二个内容 -->
         <li class="title title2">
+          <div class="showCon" @click="cutFlag('tow')"></div>
           <span tabindex="0">Group Visit</span>
           <span
             class="arrow"
             :class="{ 'arrow-up': flag === 'tow' }"
-            @click="cutFlag('tow')"
             @keydown.enter.passive="cutFlag('tow')"
             tabindex="0"
             aria-label="Button"
@@ -480,11 +481,11 @@
         </li>
         <!-- 第三个内容 -->
         <li class="title title3">
+          <div class="showCon" @click="cutFlag('three')"></div>
           <span tabindex="0">Relevant Information</span>
           <span
             class="arrow"
             :class="{ 'arrow-up': flag === 'three' }"
-            @click="cutFlag('three')"
             @keydown.enter.passive="cutFlag('three')"
             tabindex="0"
             aria-label="Button"
@@ -672,10 +673,19 @@ export default {
     clear: both;
     & > ul {
       .title {
+        position: relative;
         font-size: 24px;
         line-height: 50px;
         margin-bottom: 1px;
         background: url("../../assets/images/Visit/m-28.jpg") no-repeat;
+        .showCon{
+          cursor: pointer;
+          position: absolute;
+          top: 0;
+          left: 0;
+          width: 100%;
+          height: 50px;
+        }
         span {
           margin-left: 10px;
         }

web/src/views/Visit/Visit7.vue

@@ -90,14 +90,18 @@ activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
         padding-top: 20px;
         width: 50%;
         &>p{
+          position: relative;
           display: flex;
           align-items: center;
           font-size: 14px;
           margin-bottom: 20px;
+          padding-left: 45px;
           &>span{
+            position: absolute;
+            top: -5px;
+            left: 0;
             display: block;
             font-size: 30px;
-            margin-right: 10px;
           }
         }
         &:nth-of-type(1){

web/src/views/Visit/index.vue

@@ -79,7 +79,7 @@ export default {
   //方法集合
   methods: {
     skip(url){
-      this.$router.push(url).catch(() => {});
+      this.$router.replace(url).catch(() => {});
     }
   },
   //生命周期 - 创建完成（可以访问当前this实例）

web/src/views/bottom/Employment.vue

@@ -284,6 +284,7 @@ export default {
     }
   }
   .back_btn {
+    font-family: Arial, Helvetica, sans-serif;
     height: 38px;
     width: 160px;
     margin: 30px auto;

web/src/views/bottom/Index.vue

@@ -1,14 +1,22 @@
 <template>
-  <div class="bottomIndex" data-aria-viewport-area tabindex="0"
-    aria-label aria-description="You've reached the content area of the Site Index, please use the tab key to navigate through the content."
+  <div
+    class="bottomIndex"
+    data-aria-viewport-area
+    tabindex="0"
+    aria-label
+    aria-description="You've reached the content area of the Site Index, please use the tab key to navigate through the content."
   >
-    <img src="/data/Index/1.jpg" alt="" 
+    <img
+      src="/data/Index/1.jpg"
+      alt=""
       tabindex="0"
       aria-label="Text"
       aria-description="Site Index"
     />
     <div class="home" title="Home" tabindex="-1">
-      <img src="/data/Index/home.jpg" alt=""
+      <img
+        src="/data/Index/home.jpg"
+        alt=""
         @click="skip('/')"
         @keydown.enter.passive="skip('/')"
         tabindex="0"
@@ -430,7 +438,13 @@ export default {
           left: "0px",
           path: "",
         },
-        { title: "Moblie Site", width: "105px", top: 1, left: "0px", path: "/null" },
+        {
+          title: "Moblie Site",
+          width: "105px",
+          top: 1,
+          left: "0px",
+          path: "https://zzbbh.4dage.com/shouBoM/index.html#/Layout/Home",
+        },
         {
           title: "Terms of Use",
           width: "120px",
@@ -463,7 +477,11 @@ export default {
   //方法集合
   methods: {
     skip(url, sroll) {
-      this.$router.push(url).catch(() => {});
+      if(url==='https://zzbbh.4dage.com/shouBoM/index.html#/Layout/Home') {
+        window.open(url)
+        return
+      }
+      this.$router.replace(url).catch(() => {});
       if (sroll) {
         setTimeout(() => {
           window.scrollTo({ top: sroll, behavior: "smooth" });
@@ -475,7 +493,10 @@ export default {
   created() {},
   //生命周期 - 挂载完成（可以访问DOM元素）
   mounted() {
-    this.$eventBus.$emit('request-read', ` You've reached the Site Index page. This page contains one navigation section, three window sections, and one interactive section. To choose an area, please hit the shortcut key.`)
+    this.$eventBus.$emit(
+      "request-read",
+      ` You've reached the Site Index page. This page contains one navigation section, three window sections, and one interactive section. To choose an area, please hit the shortcut key.`
+    );
   },
   beforeCreate() {}, //生命周期 - 创建之前
   beforeMount() {}, //生命周期 - 挂载之前
@@ -523,7 +544,7 @@ export default {
           position: absolute;
         }
       }
-      .active{
+      .active {
         cursor: pointer;
       }
       .one {

web/src/views/bottom/Use.vue

@@ -246,6 +246,7 @@ export default {
     }
   }
   .back_btn {
+    font-family: Arial, Helvetica, sans-serif;
     height: 38px;
     width: 160px;
     margin: 30px auto;

web/src/views/layout/index.vue

@@ -203,25 +203,25 @@ export default {
     // 点击搜索
     search() {
       // if (this.searchTxt.trim() === "" || this.searchTxt.trim().length < 4) return
-      this.$router.push({
+      this.$router.replace({
         name: "Search",
         params: {txt:this.searchTxt},
       });
     },
     // 第一级的跳转
     skipOne(url) {
-      this.$router.push("/Layout/" + url).catch(() => {});
+      this.$router.replace("/Layout/" + url).catch(() => {});
     },
     // 第二级的跳转
     skipTow(url, about) {
       document.activeElement.blur()
       // 如果是about页面
       if (about === true) {
-        this.$router.push("/Layout/About").catch(() => {});
+        this.$router.replace("/Layout/About").catch(() => {});
         setTimeout(() => {
           window.scrollTo({ top: url, behavior: "smooth" });
         }, 100);
-      } else this.$router.push(url).catch(() => {});
+      } else this.$router.replace(url).catch(() => {});
     },
   },
   //生命周期 - 创建完成（可以访问当前this实例）

web/src/views/null/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="null">
     <div>
-      <div @click="$router.push('/')">返 回 首 页</div>
+      <div @click="$router.replace('/')">返 回 首 页</div>
       <div class="back" @click="$router.go(-1)">返 回 上 一 页</div>
     </div>
   </div>

webM/src/assets/base.css

@@ -44,7 +44,6 @@ html {
  */
 
 body {
-    font-family:Bold;
     margin: 0;
 }
 

webM/src/router/index.js

@@ -311,7 +311,7 @@ router.beforeEach((to, from, next) => {
 // 全局后置钩子，设置title
 router.afterEach(to => {
   // 设置title
-  document.title = to.meta.myTitle;
+  window.document.title = to.meta.myTitle;
 })
 
 

webM/src/views/About/Director.vue

@@ -36,7 +36,11 @@ export default {
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {},
   //生命周期 - 挂载完成（可以访问DOM元素）
-  mounted() {},
+  mounted() {
+    setTimeout(() => {
+      window.document.title = 'From the Director';
+    }, 100);
+  },
   beforeCreate() {}, //生命周期 - 创建之前
   beforeMount() {}, //生命周期 - 挂载之前
   beforeUpdate() {}, //生命周期 - 更新之前

webM/src/views/About/Link.vue

@@ -215,7 +215,11 @@ export default {
   //生命周期 - 创建完成（可以访问当前this实例）
   created() {},
   //生命周期 - 挂载完成（可以访问DOM元素）
-  mounted() {},
+  mounted() {
+    setTimeout(() => {
+      window.document.title = "Partners & Connections";
+    }, 100);
+  },
   beforeCreate() {}, //生命周期 - 创建之前
   beforeMount() {}, //生命周期 - 挂载之前
   beforeUpdate() {}, //生命周期 - 更新之前

webM/src/views/About/index.vue

@@ -273,7 +273,7 @@ export default {
       overflow-x: auto;
       z-index: 10;
       .rowAll {
-        width: 545px;
+        width: 645px;
         padding: 20px;
         background-color: #f7f6f3;
         .row {
@@ -356,12 +356,14 @@ export default {
       }
     }
   }
-  .curSorll {
-    z-index: 99;
-    position: fixed;
-    top: 0;
-    left: 0;
-  }
+    .curSorll {
+      max-width: 500px;
+      z-index: 99;
+      position: fixed;
+      top: 0;
+      left: 50%;
+      transform: translateX(-50%);
+    }
 }
 @media screen and (max-width: 370px) {
   #About3 {

webM/src/views/Collections/Detail.vue

@@ -38,7 +38,7 @@ export default {
       if (v.id === id) this.data = v;
     });
     setTimeout(() => {
-      document.title = this.data.h3;
+      window.document.title = this.data.h3;
     }, 100);
   },
   beforeCreate() {}, //生命周期 - 创建之前
@@ -52,6 +52,7 @@ export default {
 </script>
 <style lang='less' scoped>
 .CollectionsDeta {
+  padding-top: 50px;
   width: 100%;
   .main {
     width: 100%;

webM/src/views/Collections/info.vue

@@ -64,7 +64,7 @@ export default {
         if (k === temp) temp = this.mate[k];
       }
       setTimeout(() => {
-        document.title = temp;
+        window.document.title = temp;
       }, 100);
       this.txt = temp;
     },

webM/src/views/Exhibitions/Detail.vue

@@ -214,7 +214,7 @@ export default {
     this.$nextTick(() => {
       setTimeout(() => {
         // 改变网址title
-        document.title = this.data.title;
+        window.document.title = this.data.title;
 
         let tempArr = this.data.page;
         let dom = document.querySelector(".card");
@@ -250,6 +250,7 @@ export default {
 }
 
 .ExDetail {
+  padding-top: 50px;
   width: 100%;
   .topImg {
     width: 100%;
@@ -323,17 +324,19 @@ export default {
         left: 50%;
         transform: translateX(-50%);
         .page {
+          opacity: 0.3;
+          color: #b79550;
           position: absolute;
           font-weight: 700;
           right: 5px;
           bottom: 5px;
-          font-size: 14px;
+          font-size: 16px;
         }
         .txt {
-          touch-action: pan-y!important;
+          touch-action: pan-y !important;
           padding: 20px;
           width: 100%;
-          height: 480px;
+          height: 466px;
           overflow-y: auto;
           & > h3 {
             color: #bc1c24;
@@ -368,7 +371,7 @@ export default {
     }
     padding: 40px 0 0;
     .box3_Obj {
-      touch-action: pan-y!important;
+      touch-action: pan-y !important;
       display: flex;
       align-items: center;
       justify-content: space-around;

webM/src/views/Exhibitions/Galleries.vue

@@ -73,7 +73,7 @@ export default {
       if (v.id === id) this.data = v.info;
     });
     setTimeout(() => {
-      document.title = "Exhibition Galleries";
+      window.document.title = "Exhibition Galleries";
     }, 100);
   },
   beforeCreate() {}, //生命周期 - 创建之前

webM/src/views/Exhibitions/Objects.vue

@@ -73,7 +73,7 @@ export default {
       if (v.id === id) this.data = v.info;
     });
     setTimeout(() => {
-      document.title = 'Exhibition Objects';
+      window.document.title = 'Exhibition Objects';
     }, 100);
   },
   beforeCreate() {}, //生命周期 - 创建之前

webM/src/views/Exhibitions/index.vue

@@ -136,11 +136,13 @@ export default {
       color: #fff;
     }
   }
-  .curSorll {
-    z-index: 99;
-    position: fixed;
-    top: 0;
-    left: 0;
-  }
+    .curSorll {
+      max-width: 500px;
+      z-index: 99;
+      position: fixed;
+      top: 0;
+      left: 50%;
+      transform: translateX(-50%);
+    }
 }
 </style>

webM/src/views/Home/index.vue

@@ -20,11 +20,15 @@
         </div>
         <div class="towTxt">
           <h3>Opening Hours 09:00-17:00</h3>
-          <p>No admission after 16:00 <br />Closed on Monday</p>
+          <p>No admission after 16:00 <br />Closed on Mondays(Except for holidays)</p>
         </div>
         <div class="towTxt">
-          <h3>Phone</h3>
-          <p>+86 (10) 63370491</p>
+          <h3>Individual visitors:</h3>
+          <p>+86 (10) 63393339</p>
+        </div>
+        <div class="towTxt">
+          <h3>Group visitors:</h3>
+          <p>+86 (10) 63370458</p>
         </div>
         <ul class="row">
           <li v-for="item in vData" :key="item.id" @click="skip(item.path)">
@@ -181,6 +185,7 @@ export default {
             color: #bc1c24;
           }
           & > p {
+            font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
             font-size: 12px;
             line-height: 12px;
           }

webM/src/views/Join/Volunteer.vue

@@ -5,16 +5,18 @@
     @swiperight="moveSwiper(0)"
   >
     <div
-      @click="skip(item.id)"
       class="row"
       :class="{ active: index === imgInd }"
       v-for="(item, index) in imgList"
       :key="index"
     >
       <!-- <p>{{ item.name }}</p> -->
-      <img
-        :src="require(`@/assets/img/Join/${item.id}.png`)" alt=""
-      />
+      <div class="dingwei">
+        <div :class="{ activeBox: 0 === imgInd }" @click="skip('1')"></div>
+        <div :class="{ activeBox: 1 === imgInd }" @click="skip('2')"></div>
+        <div :class="{ activeBox: 2 === imgInd }" @click="skip('3')"></div>
+      </div>
+      <img :src="require(`@/assets/img/Join/${item.id}.png`)" alt="" />
     </div>
   </v-touch>
 </template>
@@ -73,7 +75,7 @@ export default {
 </script>
 <style lang='less' scoped>
 .JoinVo {
-  touch-action: pan-y!important;
+  touch-action: pan-y !important;
   padding: 20px 0 40px;
   background-color: #f7f6f3;
   .row {
@@ -83,9 +85,21 @@ export default {
     width: 100%;
     opacity: 0;
     height: 0;
-    &>img{
+    & > img {
       width: 100%;
     }
+    .dingwei {
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      display: flex;
+      & > div {
+        width: 30%;
+      }
+      .activeBox{
+        width: 40%;
+      }
+    }
   }
   .active {
     opacity: 1;

webM/src/views/Join/index.vue

@@ -127,11 +127,13 @@ export default {
       color: #fff;
     }
   }
-  .curSorll {
-    z-index: 99;
-    position: fixed;
-    top: 0;
-    left: 0;
-  }
+    .curSorll {
+      max-width: 500px;
+      z-index: 99;
+      position: fixed;
+      top: 0;
+      left: 50%;
+      transform: translateX(-50%);
+    }
 }
 </style>

webM/src/views/Join/info.vue

@@ -46,7 +46,7 @@ export default {
       if (v.id === id) this.data = v;
     });
     setTimeout(() => {
-      document.title = this.data.h3;
+      window.document.title = this.data.h3;
     }, 100);
   },
   beforeCreate() {}, //生命周期 - 创建之前

webM/src/views/Layout/index.vue

@@ -2,6 +2,7 @@
   <div class="Layout" ref="Layout" @scroll="scrollEvent">
     <!-- 顶部top -->
     <div class="top" :style="`background-color:${$route.meta.topColor}`">
+      <!-- <div class="MBL"></div> -->
       <div class="left">
         <img
           src="@/assets/img/Layout/mean.png"
@@ -11,6 +12,7 @@
       </div>
       <div class="right">
         <img
+          class="logoTop"
           src="@/assets/img/Layout/logo.png"
           alt=""
           @click="$router.push('/Layout/Home').catch(() => {})"
@@ -28,6 +30,8 @@
     <Router-view />
     <!-- 点击菜单 -->
     <div class="meanPage" v-show="meanPage">
+      <!-- 毛玻璃 -->
+      <div class="meanPageMBL"></div>
       <div class="conten">
         <div class="searchTop">
           <div class="back">
@@ -57,7 +61,14 @@
             v-for="(item, index) in menaData"
             :key="index"
           >
-            <span>{{ item.name }}</span>
+            <div class="oneMean">
+              {{ item.name }}
+              <van-icon
+                :name="menaSon === index ? 'arrow-down' : 'arrow'"
+                @click.stop="oneMeanChange(index,item.show)"
+              />
+              <!-- <van-icon name="arrow-down" /> -->
+            </div>
             <template
               v-if="
                 menaSon === index || item.show.includes($route.meta.myTitle)
@@ -268,13 +279,22 @@ export default {
   },
   //方法集合
   methods: {
+    // 一级菜单箭头的展开和收起
+    oneMeanChange(index,show) {
+      if(show.includes(this.$route.meta.myTitle)) return
+      if (this.menaSon === index) this.menaSon = null;
+      else this.menaSon = index;
+    },
     // 封装一个地址栏改变监听$route的方法
     routeChange() {
       let t = this.$route.params.t;
-      if (t && t !== "null") this.txt = t;
-
       // 对于二级菜单高亮的重定义
       let temp = this.$route.path;
+      // 首页的重定义
+      if (temp === "/Layout/Home") this.menaSon = null;
+      if (temp.includes("Layout/Search")) {
+        if (t && t !== "null") this.txt = t;
+      } else this.txt = "";
       let myId = this.$route.query.id;
       myId = Number(myId);
       if (temp === "/Layout/VisitInfo") temp = "/Layout/Visit/2";
@@ -288,29 +308,31 @@ export default {
         else if (myId <= 47) temp = "/Layout/Exhibitions/Past";
         else temp = "/Layout/Exhibitions/Overseas";
       }
-      if(temp ==='/Layout/CollectionsDetail') {
-        let k =this.$route.query.k
-        if(k==='Bronzes') temp ='/Layout/Collections/Bronzes'
-        else if(k==='Ceramics') temp ='/Layout/Collections/Ceramics'
-        else if(k==='Buddhist') temp ='/Layout/Collections/Buddhist'
-        else if(k==='Jadewares') temp ='/Layout/Collections/Jadewares'
-        else if(k==='Calligraphies') temp ='/Layout/Collections/Calligraphies'
-        else if(k==='Paintings') temp ='/Layout/Collections/Paintings'
-        else if(k==='Gold') temp ='/Layout/Collections/Gold'
-        else if(k==='Coins') temp ='/Layout/Collections/Coins'
-        else if(k==='Brocades') temp ='/Layout/Collections/Brocades'
-        else if(k==='Cultural') temp ='/Layout/Collections/Cultural'
-        else temp ='/Layout/Collections/Miscellaneous'
+      if (temp === "/Layout/CollectionsDetail") {
+        let k = this.$route.query.k;
+        if (k === "Bronzes") temp = "/Layout/Collections/Bronzes";
+        else if (k === "Ceramics") temp = "/Layout/Collections/Ceramics";
+        else if (k === "Buddhist") temp = "/Layout/Collections/Buddhist";
+        else if (k === "Jadewares") temp = "/Layout/Collections/Jadewares";
+        else if (k === "Calligraphies")
+          temp = "/Layout/Collections/Calligraphies";
+        else if (k === "Paintings") temp = "/Layout/Collections/Paintings";
+        else if (k === "Gold") temp = "/Layout/Collections/Gold";
+        else if (k === "Coins") temp = "/Layout/Collections/Coins";
+        else if (k === "Brocades") temp = "/Layout/Collections/Brocades";
+        else if (k === "Cultural") temp = "/Layout/Collections/Cultural";
+        else temp = "/Layout/Collections/Miscellaneous";
       }
-      if(temp ==='/Layout/Learn/Info') {
-        if(myId<=39) temp ='/Layout/Learn/Students'
-        else if(myId<=72) temp ='/Layout/Learn/Adults'
-        else temp ='/Layout/Learn/Families'
+      if (temp === "/Layout/Learn/Info") {
+        if (myId <= 39) temp = "/Layout/Learn/Students";
+        else if (myId <= 72) temp = "/Layout/Learn/Adults";
+        else temp = "/Layout/Learn/Families";
       }
-      if(temp ==='/Layout/Publications/Info') temp ='/Layout/Publications/Magazines'
-      if(temp ==='/Layout/Join/Info') temp ='/Layout/Join/Volunteer'
-      if(temp ==='/Layout/AboutDirector') temp ='/Layout/About/1'
-      if(temp ==='/Layout/AboutLink') temp ='/Layout/About/3'
+      if (temp === "/Layout/Publications/Info")
+        temp = "/Layout/Publications/Magazines";
+      if (temp === "/Layout/Join/Info") temp = "/Layout/Join/Volunteer";
+      if (temp === "/Layout/AboutDirector") temp = "/Layout/About/1";
+      if (temp === "/Layout/AboutLink") temp = "/Layout/About/3";
       this.menaInd = temp;
 
       this.meanPage = false;
@@ -389,10 +411,13 @@ export default {
     padding: 0 10px;
     align-items: center;
     width: 100%;
+    max-width: 500px;
+    transform: translateX(-50%);
     top: 0;
-    left: 0;
+    left: 50%;
     position: fixed;
     height: 50px;
+    z-index: 10;
     .left {
       width: 20px;
       height: 20px;
@@ -404,6 +429,12 @@ export default {
     .right {
       display: flex;
       align-items: center;
+      .logoTop {
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+      }
       & > img {
         width: 20px;
         height: 20px;
@@ -417,6 +448,17 @@ export default {
         }
       }
     }
+    // 毛玻璃
+    .MBL {
+      position: absolute;
+      left: 0;
+      top: 0;
+      width: 100%;
+      height: 100%;
+      background: rgba(210, 168, 127, 0.1);
+      backdrop-filter: blur(4px);
+      z-index: -1;
+    }
   }
   .erwei {
     margin-top: 30px;
@@ -426,6 +468,8 @@ export default {
     justify-content: space-between;
     & > img {
       width: 40%;
+      max-width: 156px;
+      max-height: 156px;
     }
   }
 
@@ -483,8 +527,10 @@ export default {
   .searchBox {
     padding: 10px;
     position: fixed;
+    max-width: 500px;
     top: 0;
-    left: 0;
+    left: 50%;
+    transform: translateX(-50%);
     z-index: 992;
     width: 100vw;
     height: 100vh;
@@ -526,15 +572,28 @@ export default {
   // 菜单页面
   .meanPage {
     position: fixed;
+    max-width: 500px;
     top: 0;
-    left: 0;
+    left: 50%;
+    transform: translateX(-50%);
     z-index: 991;
     width: 100vw;
     height: 100vh;
     overflow-y: auto;
-    background-color: rgba(255, 255, 255, 0.9);
+    // m毛玻璃
+    .meanPageMBL {
+      position: absolute;
+      left: 0;
+      top: 0;
+      width: 100%;
+      height: 100%;
+      background: rgba(0, 0, 0, 0.2);
+      backdrop-filter: blur(4px);
+      z-index: -1;
+    }
     .conten {
-      min-height: 100vh;
+      height: 100vh;
+      overflow-y: auto;
       width: 90%;
       background-color: #f6f4f1;
       .searchTop {
@@ -565,6 +624,23 @@ export default {
           color: #c1aa7b;
           font-size: 20px;
           padding-bottom: 20px;
+          .oneMean {
+            position: relative;
+            & > i {
+              width: 50px;
+              height: 50px;
+              line-height: 50px;
+              text-align: right;
+              font-size: 24px;
+              font-weight: 400;
+              color: #c1aa7b;
+              z-index: 10;
+              position: absolute;
+              right: 0px;
+              top: 50%;
+              transform: translateY(-50%);
+            }
+          }
           .rowSon {
             padding-left: 30px;
             font-size: 16px;

webM/src/views/Learn/index.vue

@@ -120,11 +120,13 @@ export default {
       color: #fff;
     }
   }
-  .curSorll {
-    z-index: 99;
-    position: fixed;
-    top: 0;
-    left: 0;
-  }
+    .curSorll {
+      max-width: 500px;
+      z-index: 99;
+      position: fixed;
+      top: 0;
+      left: 50%;
+      transform: translateX(-50%);
+    }
 }
 </style>

webM/src/views/Learn/info.vue

@@ -52,7 +52,7 @@ export default {
       if (v.id === id) this.data = v.info;
     });
     setTimeout(() => {
-      document.title = this.data.title;
+      window.document.title = this.data.title;
     }, 100);
   },
   beforeCreate() {}, //生命周期 - 创建之前
@@ -104,26 +104,33 @@ export default {
         display: block;
       }
       .info_1 {
-        background: url("../../assets/img/bg_5.png") 1px 8px no-repeat;
+        background: url("../../assets/img/bg_6.png") left 8px no-repeat;
       }
       .info_2 {
-        background: url("../../assets/img/bg_6.png") left 8px no-repeat;
+        background: url("../../assets/img/bg_7.png") 3px 8px no-repeat;
       }
       .info_3 {
-        background: url("../../assets/img/bg_7.png") 3px 8px no-repeat;
+        background: url("../../assets/img/bg_8.png") left 8px no-repeat;
       }
     }
     .txt{
-      &>img{
-        width: 100%;
-        margin-bottom: 15px;
-      }
       /deep/ p {
         font-size: 14px;
         color: #6A6A6A;
         margin-bottom: 15px;
         line-height: 18px;
       }
+      /deep/ img{
+        width: 100%;
+        margin-bottom: 15px;
+      }
+      /deep/ i {
+          font-weight: 700;
+          font-style: normal;
+      }
+      /deep/ .xx{
+        font-weight: 700;
+      }
     }
   }
 }

webM/src/views/Publications/Catalogues.vue

@@ -123,7 +123,7 @@ export default {
     position: relative;
     transition: all 0.3s;
     .page {
-      z-index: 999;
+      z-index: 990;
       background-color: rgba(183, 149, 80, .3);
       width: 68px;
       height: 40px;

webM/src/views/Publications/index.vue

@@ -127,11 +127,13 @@ export default {
       color: #fff;
     }
   }
-  .curSorll {
-    z-index: 99;
-    position: fixed;
-    top: 0;
-    left: 0;
-  }
+    .curSorll {
+      max-width: 500px;
+      z-index: 99;
+      position: fixed;
+      top: 0;
+      left: 50%;
+      transform: translateX(-50%);
+    }
 }
 </style>

webM/src/views/Publications/info.vue

@@ -36,7 +36,7 @@ export default {
     }
     setTimeout(() => {
       // 设置title
-      document.title = this.info.p;
+      window.document.title = this.info.p;
     }, 100);
   },
   //生命周期 - 挂载完成（可以访问DOM元素）
@@ -68,7 +68,7 @@ export default {
       left: 0;
       width: 100%;
       text-align: center;
-      padding: 15px 0;
+      padding: 15px 20px;
       background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0));
     }
   }

webM/src/views/Publications/lookPdf.vue

@@ -46,7 +46,6 @@ export default {
         },
       ],
       info: {},
-      loding: true,
     };
   },
   //监听属性 类似于data概念
@@ -68,7 +67,7 @@ export default {
       setTimeout(() => {
         let dom = document.querySelector(".Layout .bottom");
         dom.style.display = "none";
-        document.title = this.info.name;
+        window.document.title = this.info.name;
         // 获取顶部固定栏
         let LayoutTop = document.querySelector(".Layout .top");
         LayoutTop.style.display = "none";

webM/src/views/Search/index.vue

@@ -204,7 +204,7 @@ export default {
     overflow-x: auto;
     z-index: 10;
     .rowAll {
-      width: 1256px;
+      width: 1356px;
       padding: 20px;
       background-color: #f7f6f3;
       .row {

webM/src/views/Visit/VisitInfo.vue

@@ -16,18 +16,18 @@
       </div>
     </div>
     <!-- 1 -->
-    <div class="info1" v-show="cutInd===0">
+    <div class="info1" v-show="cutInd === 0">
       <div class="title">Ways of Reservation</div>
       <img src="@/assets/img/Visit/pp1.jpg" alt="" />
       <p>
         There are 3,600 daily personal booking places, available through website
-        (3000 places) and telephone (600 places). The
-        website首页（地址待定）offers 24-hour service, and the telephone+86 (10)
-        63393339service is available from 09:00 to 17:00. One person is only
-        allowed to book one ticket.
+        (3000 places) and telephone (600 places). The website
+        <a href="#/">首页（地址待定）</a> offers 24-hour service, and the
+        telephone <br/>+86 (10) 63393339 service is available from 09:00 to 17:00. One
+        person is only allowed to book one ticket.
       </p>
       <p>
-        For group reservation, we offer 400 tickets a day. Please call+86 (10)
+        For group reservation, we offer 400 tickets a day. Please call +86 (10)
         63370458 between 09:00 to 17:00. Identity information of the group
         leader is required.
       </p>
@@ -36,6 +36,7 @@
         seven days in advance.
       </p>
       <div class="title">Way to Get Ticket</div>
+      <img src="@/assets/img/Visit/pp2.jpg" alt="" />
       <p>
         For personal visitors, please obtain the ticket at the service center at
         the north door by
@@ -49,20 +50,58 @@
         the ground floor
       </p>
       <p>with valid documents and introductory letters.</p>
+      <div class="title">Entrance Time</div>
+      <img src="@/assets/img/Visit/pp3.jpg" alt="" />
+      <p>From 09:00-16:00, Tuesday to Sunday.</p>
+      <p>The museum is closed every Monday, except for holidays.</p>
+      <p>Please enter the museum before 16:00.</p>
+      <div class="title">Special Notices</div>
+      <p>
+        1. One ticket is only for one person and the ticket is only valid on the
+        date printed. Please have the ticket checked at the entrance.
+      </p>
+      <p>
+        2. Senior citizens (above 60) and handicapped persons can enter the
+        exhibition with valid documents even without reservation. Please ask
+        museum personnel for help.
+      </p>
+      <p>
+        3. Space in the exhibition is limited, so museum may control the visitor
+        numbers at any time to ensure orderly and pleasant viewing. Thanks for
+        your understanding and cooperation.
+      </p>
+      <p>
+        4. The exhibition lasts for three months. Please keep this in mind when
+        planning a visit.
+      </p>
     </div>
     <!-- 2 -->
-    <div class="info1" v-show="cutInd===1">
-      <p>We encourage groups and travel agencies to make reservations by telephone.</p>
-      <p>Requirements: Name of the tour group, full name of the person making the reservation, </p>
+    <div class="info1" v-show="cutInd === 1">
+      <img src="@/assets/img/Visit/pp5.jpg" alt="" />
+
+      <p>
+        We encourage groups and travel agencies to make reservations by
+        telephone.
+      </p>
+      <p>
+        Requirements: Name of the tour group, full name of the person making the
+        reservation,
+      </p>
       <p>contact information and number of group members.</p>
-      <p>Telephone reservation (group visitors): +86 (10) 63370458 </p>
+      <p>Telephone reservation (group visitors): +86 (10) 63370458</p>
+      <img src="@/assets/img/Visit/pp6.jpg" alt="" />
+    </div>
+    <!-- 3 -->
+    <div class="info1" v-show="cutInd === 2">
+      <p>
+        Ticket-reservation is subject to change when there is a large museum
+        event or a special opening ceremony for a new exhibition. The Capital
+        Museum will make a publicannouncement in advance. Please visit the
+        official website or inquire by telephone for detailed information.
+      </p>
+      <p>Official website: 首页（地址待定）</p>
+      <p>Phone: +86 (10) 63370491</p>
     </div>
-  <!-- 3 -->
-  <div class="info1" v-show="cutInd===2">
-    <p>Ticket-reservation is subject to change when there is a large museum event or a special opening ceremony for a new exhibition. The Capital Museum will make a publicannouncement in advance. Please visit the official website or inquire by telephone for detailed information.</p>
-    <p>Official website: 首页（地址待定）</p>
-    <p>Phone: +86 (10) 63370491</p>
-  </div>
   </div>
 </template>
 
@@ -143,7 +182,7 @@ export default {
     & > img {
       width: 100%;
     }
-    &>h3{
+    & > h3 {
       position: absolute;
       font-size: 24px;
       color: #fff;

webM/src/views/Visit/index.vue

@@ -23,7 +23,7 @@
         <h3>Hours</h3>
         <p>Tuesday - Sunday,9:00 - 17:00</p>
         <p>(No admission after 16:00)</p>
-        <p>Clised on Mondays(Except for holidays)</p>
+        <p>Closed on Mondays(Except for holidays)</p>
         <h3>Direction</h3>
         <p>16 Fuxingmenwai Street, Xicheng District, Beijing 100045</p>
         <p class="ttb">Subway</p>
@@ -165,7 +165,7 @@ export default {
         {
           cover: "/data/Visit/Audio2.jpg",
           h3: "Free Commentary Service",
-          p: "Commentators provide free services on each open day (Tuesday to Sunday). Please check.the specific time and exhibition location in the museum on the day of your visit.",
+          p: "Commentators provide free services on each open day (Tuesday to Sunday). Please check the specific time and exhibition location in the museum on the day of your visit.",
         },
         {
           cover: "/data/Visit/Audio3.jpg",
@@ -194,7 +194,7 @@ export default {
         {
           cover: "/data/Visit/cafe1.jpg",
           h3: "Cafeteria",
-          p: "he cafeteria is located on the northeast corner of the round exhibition room at basement level. Covering about 200 square meters, it offers coffee, soft drinks and low alcohol beverages.",
+          p: "The cafeteria is located on the northeast corner of the round exhibition room at basement level. Covering about 200 square meters, it offers coffee, soft drinks and low alcohol beverages.",
         },
         {
           cover: "/data/Visit/cafe2.jpg",
@@ -386,7 +386,7 @@ export default {
       overflow-x: auto;
       z-index: 10;
       .rowAll {
-        width: 1045px;
+        width: 1150px;
         padding: 20px;
         background-color: #f7f6f3;
         .row {
@@ -583,10 +583,12 @@ export default {
       }
     }
     .curSorll {
+      max-width: 500px;
       z-index: 99;
       position: fixed;
       top: 0;
-      left: 0;
+      left: 50%;
+      transform: translateX(-50%);
     }
   }
 }

webM/src/views/bottom/Employment.vue

@@ -161,7 +161,7 @@ export default {
         font-size: 22px;
         font-weight: 700;
         padding-left: 30px;
-        background: url("../../assets/img/Layout/chosen.png") left center
+        background: url("../../assets/img/Layout/chosen.png") left 3px
           no-repeat;
         background-size: 22px 18px;
         margin-bottom: 5px;