首页

src/components/home/indexRoll1.vue

@@ -24,16 +24,18 @@
         <div id="swipercom" class="swipercom"
         :class="[windowWidth>768?'active':'']">
           <swiper :options="swiperOption"
-          ref="mySwiper"
+            ref="mySwiper"
             class="swiper" @slideChange="onSlideChange"
             @slideChangeTransitionEnd="slideChangeTransitionEnd">
             <template v-for="(item, index) in plugData.NavList">
               <swiper-slide :key="index" :index="index"
               class="cursor-pointer">
 
-              <div class="relative">
-                <template v-if="item.FileType==1">
-                    <q-img :src="item.FileUrl" alt="image" :ratio="16/9" fill="cover"
+              <div class="relative" :style="{'background':`url(${item.FileUrl})no-repeat`,'background-size':'cover'}"
+              style="border-radius:10px;">
+                <q-img alt="image" :ratio="16/9" fill="cover"/>
+                <!-- <template v-if="item.FileType==1">
+                    <q-img :src="item.FileUrl" no-default-spinner alt="image" :ratio="16/9" fill="cover"
                     v-if="index==0||index==(plugData.NavList.length-1)"
                     @click.stop="OpenNewUrl(item.LinkUrl)">
                       <template v-slot:error>
@@ -49,7 +51,7 @@
                 <q-img v-else alt="" :ratio="16/9" fill="cover">
                   <q-video class="cursor-pointer" :src="item.FileUrl" frameborder="0"
                   allowfullscreen @click.stop="OpenNewUrl(item.LinkUrl)"/>
-                </q-img>
+                </q-img> -->
                 <div class="swipercomSubEnLen absolute bg-white row items-center justify-center">
                   <div class="swipercomSubEnNum row" v-if="windowWidth>=992">
                     <span class="swipercomSubEnN relative block font-serifEn">{{index>9?index+1:'0'+(index+1)}}</span>
@@ -85,28 +87,6 @@
             <div class="swiper-pagination"  slot="pagination"></div>
           </swiper>
         </div>
-        <!-- <div>
-          <slider
-              ref="mySwiper2"
-              :options="options2"
-              style="height: 100%"
-            >
-              <template slot-scope="coverflow">
-                <slideritem
-                  v-for="(item, index) in plugData.NavList"
-                  :key="index"
-                  class="q-mx-sm">
-                  <div class="relative">
-                    <q-img v-if="item.FileType==1"
-                    :ratio="16/9" fill="cover"
-                    :src="item.FileUrl"
-                    />
-                  </div>
-                </slideritem>
-              </template>
-              <div slot="loading">loading...</div>
-            </slider>
-        </div> -->
 
         <div v-if="windowWidth<768"
         class="col inSliSubDescribeToggle row justify-center items-center">
@@ -123,34 +103,16 @@
 </template>
 <script>
   import { swiper, swiperSlide } from "vue-awesome-swiper";
-  import { slider, slideritem } from "vue-concise-slider";
   import "swiper/dist/css/swiper.css";
   import mouse from "./mouse";
   export default {
     components: {
       swiper,
       swiperSlide,
-
-      slider,
-      slideritem,
       mouse },
     props: ['plugData','windowWidth'],
     data() {
       return {
-        options2: {
-          currentPage: 0,
-          speed: 300,//滑动持续时间
-          itemAnimation: false,//第一个到最后一个）特效结束后才能继续滑动
-          centeredSlides: true,//是否居中滑动
-          thresholdDistance: 100,//滑动判定距离
-          thresholdTime: 300,//滑动判定时间
-          loopedSlides: 2,//无限滚动前后遍历数
-          slidesToScroll: 1,//每次滑动项数
-          loop: true,//循环滚动
-          autoplay: '400000',//自动滚动
-          pagination: false,//分页是否显示
-          effect:'slide',
-        },
         X: 0,
         Y: 0,
         Current: 'left',
@@ -173,15 +135,17 @@
           },
           //显示分页
           loop: true,
+          //loopFillGroupWithBlank: true,
           spaceBetween: 50,
           initialSlide: 1,
           centeredSlides: true,
-          loopedSlides: 1,//开启循环
+          loopedSlides: 6,//开启循环
           slidesPerView: 1.5,//设置平滑
+          slidesPerGroup: 1,
           //设置能够同时显示的数量（可设置 auto）
           speed: 1000,
           autoplay: {
-            delay: 4000,
+            delay: 4000000,
             stopOnLastSlide: false,
             disableOnInteraction: false
           },
@@ -209,37 +173,6 @@
               }
             },
           },
-          // notNextTick: true,
-          // direction : 'horizontal',
-          // init:false,
-          // grabCursor: true,
-          // effect: 'coverflow',
-          // slidesPerGroup: 1,//复制若干个slid
-          // autoplay: false,
-          //是否开启自动轮播
-          //切换速度
-          // navigation: {
-          //   prevEl: ".swiper-button-next",
-          //   nextEl: ".swiper-button-prev"
-          // },
-          //左右箭头按钮(可自定义)
-          // cubeEffect: {
-          //     slideShadows: false, //开启slide阴影。默认 true。
-          //     shadow: false, //开启投影。默认 true。
-          //     shadowOffset: 0, //投影距离。默认 20，单位px。
-          //     shadowScale: 0//投影缩放比例。默认0.94。
-          // },
-          // flipEffect: {
-          //     slideShadows: false, //slides的阴影。默认true。
-          //     limitRotation: false, //限制最大旋转角度为180度，默认true。
-          // },
-          // coverflowEffect: {
-					// 	rotate: 0,
-					// 	stretch: 10,
-					// 	depth: 60,
-					// 	modifier: 4.7,
-					// 	slideShadows : false
-					// },
         },
         swiper: null,
         swiper2: null,
@@ -264,7 +197,10 @@
     mounted() {
       setTimeout(() => {
         this.swiper = this.$refs.mySwiper.swiper
-        // this.swiper2 = this.$refs.mySwiper2;
+        let swiperInstance = this.$refs.mySwiper.swiper
+        swiperInstance.loopedSlides = this.FileUrlList.length
+        swiperInstance.update()
+        console.log(this.$refs.mySwiper.swiper.loopedSlides,'----')
       }, 500);
     },
     methods: {
@@ -282,10 +218,8 @@
         if(this.windowWidth<768) return
         if(text=='left'){
           this.swiper.slidePrev();
-          // this.swiper2.pre()
         }else if(text=='right'){
           this.swiper.slideNext()
-          // this.swiper2.next()
 
         }
       },

src/components/home/indexRoll2.vue

@@ -400,7 +400,7 @@
   border-radius: 10px;
   z-index: 1;
   opacity: 0;
-  transition: all 0.5s;
+  transition: all .3s;
 }
 .swipercomTvR2{
   top: 100%;
@@ -411,7 +411,7 @@
   z-index: 2;
   padding: 0 20px 40px 20px;
   opacity: 0;
-  transition: all 0.5s;
+  transition: all .3s;
 }
 .swipercomTitleLR2{
   font-size: 1.5rem;

src/components/navs/newHor-btm.vue

@@ -237,7 +237,6 @@
     },
     created() {
       window.addEventListener('resize', this.handleResize);
-      console.log(this.dataList,'--------222')
     },
     mounted() {
       //获取当前年
@@ -246,7 +245,6 @@
       var jObj = JSON.parse(window.localStorage.getItem('HomeData'));
       this.HomeData = jObj.filter(x=>{ return x.Id == 'index_nav' })
       if(this.HomeData.length>0) this.plugData = this.HomeData[0].plugData
-      console.log(this.HomeData,'====')
     },
     computed: {
       handleResize() {