修改活动效果

components/home/Video.vue

 <template>
   <div class="video-wrapper" :class="className">
     <div class="content" @mouseenter="handleMouseEnter" @mouseleave="showType = ''" @mousemove="handleMouseEnter" @click="handleClick" ref="target" :style="{ color: activeColor, cursor: mouseCursor }">
-      <ul class="video-list">
+      <!-- <ul class="video-list">
         <li class="video-item" v-for="(item, index) in list" :key="index">
           <div class="video-poster">
             <img :src="item.poster" />
@@ -12,7 +12,22 @@
             <div class="video-desc">{{ item.desc }}</div>
           </div>
         </li>
-      </ul>
+      </ul> -->
+      <div v-swiper:mySwiper="swiperOption" ref="mySwiper">
+        <div class="swiper-wrapper">
+          <div class="swiper-slide" v-for="(item, index) in list" :key="index">
+            <div class="item-media">
+              <img :src="item.poster">
+              <div class="video-play" @click="open(item)" @mouseenter.stop="handleVideoMouseEnter" @mousemove.stop="handleVideoMouseEnter"></div>
+            </div>
+            <div class="item-text">
+              <div class="item-text-tit">{{ item.title }}</div>
+              <div class="item-text-desc">{{ item.desc }}</div>
+            </div>
+          </div>
+        </div>
+        <div class="swiper-pagination swiper-pagination-bullets"></div>
+      </div>
       <!-- <div v-if="showType === 'left' && showIndex > 0" class="video-btn video-prev" @click="handlePrev"></div>
       <div v-if="showType === 'right' && showIndex < list.length - 1" class="video-btn video-next" @click="handleNext"></div> -->
     </div>
@@ -45,8 +60,8 @@ export default {
           poster: 'https://webapp-pub.ezijing.com/project/marywood-plus/video_poster2.png'
         },
         {
-          title: '玛丽伍德介绍',
-          desc: 'The Introduction of Marywood Univeristy',
+          title: '玛丽伍德大学介绍',
+          desc: 'The Introduction of Marywood University',
           src: 'https://webapp-pub.ezijing.com/project/marywood/marywood.mp4',
           poster: 'https://webapp-pub.ezijing.com/project/marywood-plus/video_poster.png'
         }
@@ -55,7 +70,14 @@ export default {
       playVideo: {},
       showType: '',
       showIndex: 0,
-      mouseCursor: 'pointer'
+      mouseCursor: 'pointer',
+      swiperOption: {
+        speed: 400,
+        autoplay: false,
+        delay: 3000,
+        loop: false,
+        height: 500
+      }
     }
   },
   computed: {
@@ -100,9 +122,10 @@ export default {
     },
     handlePrev() {
       // 末尾的视频放到前面
-      const deleteVideo = this.list.splice(this.list.length - 1, 1)
-      this.list.unshift(deleteVideo[0])
+      // const deleteVideo = this.list.splice(this.list.length - 1, 1)
+      // this.list.unshift(deleteVideo[0])
       this.showIndex--
+      this.$refs.mySwiper.swiper.slideTo(this.showIndex)
       if (this.showIndex === 0) {
         this.mouseCursor = 'default'
         this.showType = ''
@@ -110,9 +133,10 @@ export default {
     },
     handleNext() {
       // 第一个视频放到最后
-      const deleteVideo = this.list.splice(0, 1)
-      this.list = this.list.concat(deleteVideo)
+      // const deleteVideo = this.list.splice(0, 1)
+      // this.list = this.list.concat(deleteVideo)
       this.showIndex++
+      this.$refs.mySwiper.swiper.slideTo(this.showIndex)
       if (this.showIndex === this.list.length - 1) {
         this.mouseCursor = 'default'
         this.showType = ''
@@ -147,6 +171,7 @@ export default {
     max-width: 1200px;
     margin: 0 auto;
     position: relative;
+    padding:65px 0;
   }
   .video-list {
     display: flex;
@@ -239,6 +264,64 @@ export default {
     transform: translate(-50%, -50%);
     z-index: 10000;
   }
+  .swiper-container{
+    height: 550px;
+    overflow:unset;
+    .swiper-wrapper{
+      width:1300px;
+    }
+    .swiper-slide{
+      width:1200px !important;
+      position:relative;
+      display:flex;
+      align-items: center;
+      .item-media{
+        width:550px;
+        height:550px;
+        position:relative;
+        img{
+          width:100%;
+          height:100%;
+        }
+        .video-play {
+          position: absolute;
+          top: 50%;
+          left: 50%;
+          width: 79px;
+          height: 79px;
+          background: url(https://webapp-pub.ezijing.com/project/marywood-plus/icon_play.png) no-repeat center center;
+          background-size: contain;
+          transform: translate(-50%, -50%);
+          cursor: pointer;
+          z-index: 2200;
+        }
+      }
+      .item-text{
+        color:#fff;
+        padding:0 50px;
+        .item-text-tit{
+          font-size:36px;
+          line-height:60px;
+        }
+        .item-text-desc{
+          font-size:20px;
+        }
+      }
+      &:after{
+        content: "";
+        display: block;
+        width: 100%;
+        height: 100%;
+        position: absolute;
+        top: 0;
+        left: 0;
+        background: rgba(0,0,0,.6);
+      }
+      &.swiper-slide-active:after{
+        display:none;
+      }
+    }
+  }
 }
 .is-h5 {
   .overlay {

langs/en-US.js

@@ -86,7 +86,7 @@ export default {
   },
   // 底部
   foot: {
-    address: '地    址：北京市海淀区中关村东路1号院清华科技园7号楼5层',
+    address: '地    址：北京市海淀区中关村东路1号院清华科技园7号楼威盛大厦5层',
     contact: '联系电话：010-62798073',
     email: '邮    箱：service@ezijing.com',
     link1: '中国教育部',

langs/zh-CN.js

@@ -110,7 +110,7 @@ export default {
   },
   // 底部
   foot: {
-    address: '地    址：北京市海淀区中关村东路1号院清华科技园7号楼5层',
+    address: '地    址：北京市海淀区中关村东路1号院清华科技园7号楼威盛大厦5层',
     contact: '联系电话：010-62798073',
     email: '邮    箱：service@ezijing.com',
     link1: '中国教育部',

pages/dataDownload/dataDownload.vue

@@ -33,7 +33,7 @@ export default {
       fileList: [
         {
           name: '招生简章',
-          url: 'https://webapp-pub.ezijing.com/project/marywood/%E6%8B%9B%E7%94%9F%E7%AE%80%E7%AB%A0.pdf?v=2',
+          url: 'https://webapp-pub.ezijing.com/project/marywood-plus/%E6%8B%9B%E7%94%9F%E7%AE%80%E7%AB%A0.pdf?v=2',
           icon: 'https://webapp-pub.ezijing.com/project/marywood/pdf.png'
         },
         {