美博会

src/main/resources/static/css/product/beautytopic.css

@@ -36,7 +36,7 @@
 .special .content .left-box .Beautyfair-page .list{
 	transition: all 0.6s;
 }
-.special .content .left-box .Beautyfair-page .list.Floorplan{height: 612px;overflow: hidden}
+.special .content .left-box .Beautyfair-page .list.Floorplan{height: 660px;overflow: hidden}
 .special .content .left-box .Beautyfair-page .list.max{
 	height: auto;
 }
@@ -53,7 +53,7 @@
 	height: 212px;
 }
 .special .content .left-box .Beautyfair-page .list.Floorplan a{
-	width: 434px;
+	width: 434px !important;
 	height: 290px;
 }
 .special .content .left-box .Beautyfair-page .list.supplier a{
@@ -293,7 +293,7 @@
 #recommendBox .swiper-pagination span{display:inline-block;width:14px;height:4px;border:5px solid transparent;cursor:pointer;opacity:.2;}
 #recommendBox .swiper-pagination span:before{content:"";display:inline-block;width:100%;height:4px;background:#E15616;border-radius:2px}
 #recommendBox .swiper-pagination span.on{width:28px;opacity:1;}
-.Beautyfair-page .swiper-wrapper{height: inherit ;overflow: hidden}
+.Beautyfair-page .swiper-wrapper{height: 612 ;overflow: hidden}
 }
 @media screen and (max-width:768px) {
  	#recommendBox{width: calc(100%);height:120vw;overflow:hidden;position:relative;}

src/main/resources/static/js/product/beautytopic.js

@@ -89,42 +89,9 @@ var beautytopic = new Vue({
             }
             return false
         },
-         SwiperBanner: function(){
-            setTimeout(function(){
-                if (isPC) {
-                   var swiper = new Swiper('.swiper-container', {
-                                slidesPerView: 2,
-                                slidesPerColumn: 2,
-                                slidesPerGroup: 2,
-                                spaceBetween:0,
-                                slidesOffsetBefore:Number,
-                                autoplay:true,
-                                pagination: {
-                                    el: '.swiper-pagination span'
-                                }
-                            });
-                } else {
-                     var swiper = new Swiper('.swiper-container', {
-                                slidesPerView: 2,
-                                slidesPerColumn: 2,
-                                spaceBetween:0,
-                                slidesPerGroup: 2,
-                                autoplay: {
-                                    delay: 3000,
-                                    disableOnInteraction: false
-                                },
-                                pagination: {
-                                    el: '.swiper-pagination'
-                                }
-                            });
-
-                }
-            },300);
-        },
     },
     mounted:function () {
         var _this = this;
-        _this.SwiperBanner();
         if(globalUserData){
             _this.userId = globalUserData.userId;
             _this.userIdentity = globalUserData.userIdentity;
@@ -140,7 +107,39 @@ var beautytopic = new Vue({
             }else {
              _this.listLoading = true;
             }
-        })
+        });
+        setTimeout(function(){
+                if (isPC) {
+                     var swiper = new Swiper('.swiper-container', {
+                        slidesPerView: 2,
+                        slidesPerColumn: 2,
+                        spaceBetween:0,
+                        slidesPerGroup: 2,
+                        autoplay: {
+                            delay: 3000,
+                            disableOnInteraction: false
+                        },
+                         pagination: {
+                            el: '.swiper-pagination'
+                        },
+                    });
+                } else {
+                    var swiper = new Swiper('.swiper-container', {
+                        slidesPerView: 2,
+                        slidesPerColumn: 2,
+                        spaceBetween:0,
+                        slidesPerGroup: 2,
+                        autoplay: {
+                            delay: 3000,
+                            disableOnInteraction: false
+                        },
+                        pagination: {
+                            el: '.swiper-pagination'
+                        }
+                    });
+
+                }
+            },500);
     }
 })
 

src/main/resources/templates/product/beautytopic.html

@@ -73,7 +73,7 @@
 										 </div>
 									 </a>
 								</div>
-								<div class="swiper-pagination swiper-pagination-floor mfc"><span v-if="isPC" v-for="i in  Math.ceil(item.prolist.length / 4)"></span></div>
+								<div class="swiper-pagination mfc"> <span v-if="isPC" v-for="i in  Math.ceil(List.length / 4)"></span></div>
 							 </div>
 						</div>
 						<div class="Beautyfair-page" v-for="(item,index) in productList">