zhengjinyi 3 tahun lalu
induk
melakukan
5e910b1e4a

+ 152 - 150
src/main/resources/static/css/activity/activityTopic.css

@@ -5,7 +5,8 @@ a:hover{color:#333}
 100%{opacity:0.8}
 }@keyframes my-fade-ease{0%{opacity:0}
 100%{opacity:0.8}
-}@media screen and (min-width:768px){.banner{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;overflow:hidden}
+}@media screen and (min-width:768px){
+.banner{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;overflow:hidden}
 .banner img{display:block;width:auto;height:510px;max-width:unset}
 .show-more{float:left;width:100%;text-align:center;padding-top:30px}
 .show-more .more-btn{display:inline-block;width:98px;height:30px;line-height:30px;border:1px solid #cccccc;cursor:pointer;-webkit-transition:all 0.4s;-o-transition:all 0.4s;transition:all 0.4s}
@@ -148,153 +149,154 @@ a:hover{color:#333}
 .product-template.floor-grid-10 .floor-main{height:559.14286px;overflow:hidden}
 .product-template.floor-grid-10 .floor-item-ad.ad1{width:100%;height:117.14286px}
 .product-template.floor-grid-10 .floor-item:nth-of-type(5n){margin-right:0}
-}@media screen and (max-width:768px){.banner{width:100vw;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;overflow:hidden}
-.banner img{display:block;width:100vw;height:48vw;max-width:unset}
-.show-more{padding-top:6vw;width:100vw;text-align:center}
-.show-more .more-btn{display:inline-block;width:20vw;height:6vw;font-size:3vw;line-height:6vw;border:1px solid #ccc}
-.show-more .more-btn::after{content:'';width:4vw;height:2.4vw;display:inline-block;background:url(/img/base/icon_m.png) no-repeat;background-size:100vw auto;background-position:-51.5vw -2vw}
-.max{height:auto !important}
-.p-icon{display:inline-block;width:16vw;height:5vw;vertical-align:middle;margin-bottom:1vw;margin-left:-1vw}
-.p-icon::before{content:'';display:inline-block;width:16vw;height:5vw;background:url(/img/base/icon_m.png) no-repeat;background-size:100vw auto}
-.p-icon.i1::before{background-position:-84vw -69.5vw}
-.p-icon.i2::before{background-position:-84vw -76.5vw}
-.p-icon.i3::before{background-position:-84vw -83.5vw}
-.p-icon.i4::before{background-position:-84vw -90.5vw}
-.p-icon.i5::before{background-position:-84vw -97.5vw}
-.swiper-container .swiper-pagination{position:relative;padding-top:2.6vw}
-.swiper-container .swiper-pagination .cm-bullet{display:inline-block;margin:0 2px;width:3vw;height:0.5vw;background:#e15616;opacity:0.2;cursor:pointer}
-.swiper-container .swiper-pagination .cm-bullet.cm-bullet-active{width:20px;opacity:1}
-.inner .floor-item{display:block}
-.inner .floor-scroll{overflow:visible;overflow-x:scroll !important;white-space:nowrap}
-.inner .floor-scroll::-webkit-scrollbar{width:0;height:0;opacity:0;visibility:hidden}
-.inner .floor-scroll .floor-item{display:inline-block !important}
-.inner .floor-title{padding-left:3vw;padding-top:4vw}
-.inner .floor-title h2{font-weight:bold;color:#4a4f58;font-size:4.8vw;line-height:9.7vw}
-.inner .floor-title p{font-weight:normal;color:#93979f;font-size:3.4vw;line-height:4.3vw}
-.picture-template.floor-grid-1 .swiper-slide{padding:0 3vw;-webkit-box-sizing:border-box;box-sizing:border-box}
-.picture-template.floor-grid-1 .floor-item{width:22vw;height:22vw;margin:2vw 2vw 0 0;float:left}
-.picture-template.floor-grid-1 .floor-item img{width:22vw;height:22vw}
-.picture-template.floor-grid-1 .floor-item:nth-of-type(4n){margin-right:0}
-.picture-template.floor-grid-2 .swiper-slide{padding:0 3vw;-webkit-box-sizing:border-box;box-sizing:border-box}
-.picture-template.floor-grid-2 .floor-item{width:30vw;height:21vw;margin:2vw 2vw 0 0;float:left}
-.picture-template.floor-grid-2 .floor-item img{width:30vw;height:21vw}
-.picture-template.floor-grid-2 .floor-item:nth-of-type(3n){margin-right:0}
-.picture-template.floor-grid-3 .floor-item{width:41vw;height:32vw;margin:2vw 2vw 0 0}
-.picture-template.floor-grid-3 .floor-item img{width:41vw;height:32vw}
-.picture-template.floor-grid-3 .floor-item:first-of-type{margin-left:3vw}
-.picture-template.floor-grid-3 .floor-item:last-of-type{margin-right:3vw}
-.picture-template.floor-grid-4{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0 3vw}
-.picture-template.floor-grid-4 .floor-item{width:94vw;height:48vw;margin:2vw 2vw 0 0}
-.picture-template.floor-grid-4 .floor-item img{width:94vw;height:48vw}
-.picture-template.floor-grid-5 .swiper-slide{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0 3vw}
-.picture-template.floor-grid-5 .floor-item{width:46vw;height:28vw;margin:2vw 2vw 0 0;float:left}
-.picture-template.floor-grid-5 .floor-item img{width:46vw;height:28vw}
-.picture-template.floor-grid-5 .floor-item:nth-of-type(2n){margin-right:0}
-.picture-template.floor-grid-6{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0 3vw}
-.picture-template.floor-grid-6 .floor-item{width:94vw;height:45vw;margin:2vw 2vw 0 0}
-.picture-template.floor-grid-6 .floor-item img{width:94vw;height:45vw}
-.article-template .floor-item .floor-item-text h2{font-size:4vw;font-weight:normal;color:#4a4f58;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical}
-.article-template .floor-item .floor-item-text p{color:#86878b;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;text-align:justify}
-.article-template.floor-grid-1 .floor-item{width:94vw;height:33vw;margin:2vw 3vw;background:#fff;-webkit-box-sizing:border-box;box-sizing:border-box;padding:3vw}
-.article-template.floor-grid-1 .floor-item img{width:94vw;height:33vw}
-.article-template.floor-grid-1 .floor-item .floor-item-cover{width:27vw;height:27vw;float:left}
-.article-template.floor-grid-1 .floor-item .floor-item-cover img{width:27vw;height:27vw}
-.article-template.floor-grid-1 .floor-item .floor-item-text{float:right;width:57vw}
-.article-template.floor-grid-1 .floor-item .floor-item-text h2{line-height:5vw;-webkit-line-clamp:1}
-.article-template.floor-grid-1 .floor-item .floor-item-text p{margin-top:3vw;font-size:3vw;line-height:5vw;-webkit-line-clamp:4}
-.article-template.floor-grid-2 .floor-item{width:94vw;height:72vw;margin:2vw 3vw;background:#fff}
-.article-template.floor-grid-2 .floor-item .floor-item-cover{width:94vw;height:48vw}
-.article-template.floor-grid-2 .floor-item .floor-item-cover img{width:94vw;height:48vw}
-.article-template.floor-grid-2 .floor-item .floor-item-text{width:84vw;-webkit-box-sizing:border-box;box-sizing:border-box;padding:3vw}
-.article-template.floor-grid-2 .floor-item .floor-item-text h2{line-height:5vw;-webkit-line-clamp:1}
-.article-template.floor-grid-2 .floor-item .floor-item-text p{margin-top:3vw;font-size:3vw;line-height:5vw;-webkit-line-clamp:2}
-.article-template.floor-grid-3 .floor-item{width:41vw;height:52vw;margin:2vw 2vw 0 0;background:#fff}
-.article-template.floor-grid-3 .floor-item:first-of-type{margin-left:3vw}
-.article-template.floor-grid-3 .floor-item:last-of-type{margin-right:3vw}
-.article-template.floor-grid-3 .floor-item .floor-item-cover{width:41vw;height:29vw}
-.article-template.floor-grid-3 .floor-item .floor-item-cover img{width:41vw;height:29vw}
-.article-template.floor-grid-3 .floor-item .floor-item-text{width:41vw;-webkit-box-sizing:border-box;box-sizing:border-box;padding:3vw}
-.article-template.floor-grid-3 .floor-item .floor-item-text h2{line-height:5vw;-webkit-line-clamp:1}
-.article-template.floor-grid-3 .floor-item .floor-item-text p{margin-top:3vw;font-size:3vw;line-height:5vw;-webkit-line-clamp:2}
-.article-template.floor-grid-4{padding:0 3vw;-webkit-box-sizing:border-box;box-sizing:border-box}
-.article-template.floor-grid-4 .floor-item{width:46vw;height:57vw;margin:2vw 2vw 0 0;float:left;background:#fff}
-.article-template.floor-grid-4 .floor-item:nth-of-type(2n){margin-right:0}
-.article-template.floor-grid-4 .floor-item .floor-item-cover{width:46vw;height:33vw}
-.article-template.floor-grid-4 .floor-item .floor-item-cover img{width:46vw;height:33vw}
-.article-template.floor-grid-4 .floor-item .floor-item-text{width:46vw;-webkit-box-sizing:border-box;box-sizing:border-box;padding:3vw}
-.article-template.floor-grid-4 .floor-item .floor-item-text h2{line-height:5vw;-webkit-line-clamp:1}
-.article-template.floor-grid-4 .floor-item .floor-item-text p{margin-top:3vw;font-size:3vw;line-height:5vw;-webkit-line-clamp:2}
-.product-template{padding:0 3vw;width:100vw;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden}
-.product-template .floor-item-ad{display:block}
-.product-template .floor-item-ad img{width:100%;height:100%}
-.product-template .floor-item{display:block;position:relative;width:46vw;height:68vw;float:left;margin:2vw 2vw 0 0;background:#fff}
-.product-template .floor-item .floor-item-cover{width:46vw;height:46vw}
-.product-template .floor-item .floor-item-cover img{width:46vw;height:46vw}
-.product-template .floor-item .floor-item-text{position:absolute;width:46vw;padding:2vw 3vw;bottom:0;-webkit-box-sizing:border-box;box-sizing:border-box}
-.product-template .floor-item .floor-item-text .pro-tags .tag{display:inline-block;font-size:3vw;padding:0.5vw 0.8vw;border:1px solid #ccc}
-.product-template .floor-item .floor-item-text .pro-title{height:9vw;font-size:3vw;line-height:5vw;color:#4a4f58;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
-.product-template .floor-item .floor-item-text .pro-price .price-tag{height:5vw;padding:1vw 0}
-.product-template .floor-item .floor-item-text .pro-price .price-tag .tag{font-size:2.4vw;display:inline-block;line-height:5vw;color:#e15616;padding:0 0.8vw;border:1px solid #e15616;border-radius:0.5vw}
-.product-template .floor-item .floor-item-text .pro-price .price{height:5vw;line-height:5vw}
-.product-template .floor-item .floor-item-text .pro-price .none{color: #999999;text-decoration: line-through;}
-.product-template.floor-grid-1 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
-.product-template.floor-grid-1 .floor-item-ad.ad1{width:94vw;height:32vw;margin-right:0}
-.product-template.floor-grid-1 .floor-item-ad.ad2{width:46vw;height:35vw}
-.product-template.floor-grid-1 .floor-item-ad.ad3{width:46vw;height:35vw;margin-right:0}
-.product-template.floor-grid-1 .floor-item:nth-of-type(2n){margin-right:0}
-.product-template.floor-grid-2 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
-.product-template.floor-grid-2 .floor-item-ad.ad1{width:46vw;height:68vw}
-.product-template.floor-grid-2 .floor-item-ad.ad2{width:46vw;height:33vw;margin-right:0}
-.product-template.floor-grid-2 .floor-item-ad.ad3{width:46vw;height:33vw;margin-right:0}
-.product-template.floor-grid-2 .floor-item:nth-of-type(2n){margin-right:0}
-.product-template.floor-grid-3 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
-.product-template.floor-grid-3 .floor-item-ad.ad1{width:46vw;height:68vw}
-.product-template.floor-grid-3 .floor-item-ad.ad2{width:46vw;height:33vw;margin-right:0}
-.product-template.floor-grid-3 .floor-item-ad.ad3{width:46vw;height:33vw;margin-right:0}
-.product-template.floor-grid-3 .floor-item-ad.ad4{width:46vw;height:33vw}
-.product-template.floor-grid-3 .floor-item-ad.ad5{width:46vw;height:33vw;margin-right:0}
-.product-template.floor-grid-3 .floor-item:nth-of-type(2n){margin-right:0}
-.product-template.floor-grid-4 .floor-item:nth-of-type(2n){margin-right:0}
-.product-template.floor-grid-5 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
-.product-template.floor-grid-5 .floor-item-ad.ad1{width:94vw;height:24vw}
-.product-template.floor-grid-5 .floor-item-ad.ad2{width:46vw;height:68vw}
-.product-template.floor-grid-5 .floor-item-ad.ad3{width:46vw;height:68vw;margin-right:0}
-.product-template.floor-grid-5 .floor-item:nth-of-type(2n){margin-right:0}
-.product-template.floor-grid-6 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
-.product-template.floor-grid-6 .floor-item-ad.ad1{width:94vw;height:24vw}
-.product-template.floor-grid-6 .floor-item-ad.ad2{width:46vw;height:68vw}
-.product-template.floor-grid-6 .floor-item:nth-of-type(2n+1){margin-right:0}
-.product-template.floor-grid-7 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
-.product-template.floor-grid-7 .floor-item-ad.ad1{width:46vw;height:68vw}
-.product-template.floor-grid-7 .floor-item-ad.ad2{width:46vw;height:68vw;margin-right:0}
-.product-template.floor-grid-7 .floor-item:nth-of-type(2n){margin-right:0}
-.product-template.floor-grid-8 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
-.product-template.floor-grid-8 .floor-item-ad.ad1{width:46vw;height:68vw}
-.product-template.floor-grid-8 .floor-item:nth-of-type(2n+1){margin-right:0}
-.product-template.floor-grid-9 .floor-item-ad,.product-template.floor-grid-10 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
-.product-template.floor-grid-9 .floor-item-ad.ad1,.product-template.floor-grid-10 .floor-item-ad.ad1{width:94vw;height:24vw}
-.product-template.floor-grid-9 .floor-item:nth-of-type(2n),.product-template.floor-grid-10 .floor-item:nth-of-type(2n){margin-right:0}
-.product-template.floor-grid-11{padding:0 !important}
-.product-template.floor-grid-11 .swiper-slide{padding:0 3vw;-webkit-box-sizing:border-box;box-sizing:border-box}
-.product-template.floor-grid-11 .floor-item:nth-of-type(2n){margin-right:0}
-.article-template.floor-main{overflow:hidden}
-.article-template.floor-main.floor-grid-1{height:140vw}
-.article-template.floor-main.floor-grid-2{height:148vw}
-.article-template.floor-main.floor-grid-4{height:118vw}
-.picture-template.floor-main{overflow:hidden}
-.picture-template.floor-main.floor-grid-4{height:100vw}
-.picture-template.floor-main.floor-grid-6{height:47vw}
-.product-template .floor-main{overflow:hidden}
-.product-template .show-more{float:left}
-.product-template.floor-grid-1 .floor-main{height:141vw}
-.product-template.floor-grid-2 .floor-main{height:140vw}
-.product-template.floor-grid-3 .floor-main{height:175vw}
-.product-template.floor-grid-4 .floor-main{height:140vw}
-.product-template.floor-grid-5 .floor-main{height:166vw}
-.product-template.floor-grid-6 .floor-main{height:166vw}
-.product-template.floor-grid-7 .floor-main{height:140vw}
-.product-template.floor-grid-8 .floor-main{height:140vw}
-.product-template.floor-grid-9 .floor-main{height:166vw}
-.product-template.floor-grid-10 .floor-main{height:140vw}
-.product-template.floor-grid-11 .floor-main{overflow:visible}
+}@media screen and (max-width:768px){
+    .banner{width:100vw;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;overflow:hidden}
+    .banner img{display:block;width:100vw;height:48vw;max-width:unset}
+    .show-more{padding-top:6vw;width:100vw;text-align:center}
+    .show-more .more-btn{display:inline-block;width:20vw;height:6vw;font-size:3vw;line-height:6vw;border:1px solid #ccc}
+    .show-more .more-btn::after{content:'';width:4vw;height:2.4vw;display:inline-block;background:url(/img/base/icon_m.png) no-repeat;background-size:100vw auto;background-position:-51.5vw -2vw}
+    .max{height:auto !important}
+    .p-icon{display:inline-block;width:16vw;height:5vw;vertical-align:middle;margin-bottom:1vw;margin-left:-1vw}
+    .p-icon::before{content:'';display:inline-block;width:16vw;height:5vw;background:url(/img/base/icon_m.png) no-repeat;background-size:100vw auto}
+    .p-icon.i1::before{background-position:-84vw -69.5vw}
+    .p-icon.i2::before{background-position:-84vw -76.5vw}
+    .p-icon.i3::before{background-position:-84vw -83.5vw}
+    .p-icon.i4::before{background-position:-84vw -90.5vw}
+    .p-icon.i5::before{background-position:-84vw -97.5vw}
+    .swiper-container .swiper-pagination{position:relative;padding-top:2.6vw}
+    .swiper-container .swiper-pagination .cm-bullet{display:inline-block;margin:0 2px;width:3vw;height:0.5vw;background:#e15616;opacity:0.2;cursor:pointer}
+    .swiper-container .swiper-pagination .cm-bullet.cm-bullet-active{width:20px;opacity:1}
+    .inner .floor-item{display:block}
+    .inner .floor-scroll{overflow:visible;overflow-x:scroll !important;white-space:nowrap}
+    .inner .floor-scroll::-webkit-scrollbar{width:0;height:0;opacity:0;visibility:hidden}
+    .inner .floor-scroll .floor-item{display:inline-block !important}
+    .inner .floor-title{padding-left:3vw;padding-top:4vw}
+    .inner .floor-title h2{font-weight:bold;color:#4a4f58;font-size:4.8vw;line-height:9.7vw}
+    .inner .floor-title p{font-weight:normal;color:#93979f;font-size:3.4vw;line-height:4.3vw}
+    .picture-template.floor-grid-1 .swiper-slide{padding:0 3vw;-webkit-box-sizing:border-box;box-sizing:border-box}
+    .picture-template.floor-grid-1 .floor-item{width:22vw;height:22vw;margin:2vw 2vw 0 0;float:left}
+    .picture-template.floor-grid-1 .floor-item img{width:22vw;height:22vw}
+    .picture-template.floor-grid-1 .floor-item:nth-of-type(4n){margin-right:0}
+    .picture-template.floor-grid-2 .swiper-slide{padding:0 3vw;-webkit-box-sizing:border-box;box-sizing:border-box}
+    .picture-template.floor-grid-2 .floor-item{width:30vw;height:21vw;margin:2vw 2vw 0 0;float:left}
+    .picture-template.floor-grid-2 .floor-item img{width:30vw;height:21vw}
+    .picture-template.floor-grid-2 .floor-item:nth-of-type(3n){margin-right:0}
+    .picture-template.floor-grid-3 .floor-item{width:41vw;height:32vw;margin:2vw 2vw 0 0}
+    .picture-template.floor-grid-3 .floor-item img{width:41vw;height:32vw}
+    .picture-template.floor-grid-3 .floor-item:first-of-type{margin-left:3vw}
+    .picture-template.floor-grid-3 .floor-item:last-of-type{margin-right:3vw}
+    .picture-template.floor-grid-4{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0 3vw}
+    .picture-template.floor-grid-4 .floor-item{width:94vw;height:48vw;margin:2vw 2vw 0 0}
+    .picture-template.floor-grid-4 .floor-item img{width:94vw;height:48vw}
+    .picture-template.floor-grid-5 .swiper-slide{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0 3vw}
+    .picture-template.floor-grid-5 .floor-item{width:46vw;height:28vw;margin:2vw 2vw 0 0;float:left}
+    .picture-template.floor-grid-5 .floor-item img{width:46vw;height:28vw}
+    .picture-template.floor-grid-5 .floor-item:nth-of-type(2n){margin-right:0}
+    .picture-template.floor-grid-6{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0 3vw}
+    .picture-template.floor-grid-6 .floor-item{width:94vw;height:45vw;margin:2vw 2vw 0 0}
+    .picture-template.floor-grid-6 .floor-item img{width:94vw;height:45vw}
+    .article-template .floor-item .floor-item-text h2{font-size:4vw;font-weight:normal;color:#4a4f58;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical}
+    .article-template .floor-item .floor-item-text p{color:#86878b;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;text-align:justify}
+    .article-template.floor-grid-1 .floor-item{width:94vw;height:33vw;margin:2vw 3vw;background:#fff;-webkit-box-sizing:border-box;box-sizing:border-box;padding:3vw}
+    .article-template.floor-grid-1 .floor-item img{width:94vw;height:33vw}
+    .article-template.floor-grid-1 .floor-item .floor-item-cover{width:27vw;height:27vw;float:left}
+    .article-template.floor-grid-1 .floor-item .floor-item-cover img{width:27vw;height:27vw}
+    .article-template.floor-grid-1 .floor-item .floor-item-text{float:right;width:57vw}
+    .article-template.floor-grid-1 .floor-item .floor-item-text h2{line-height:5vw;-webkit-line-clamp:1}
+    .article-template.floor-grid-1 .floor-item .floor-item-text p{margin-top:3vw;font-size:3vw;line-height:5vw;-webkit-line-clamp:4}
+    .article-template.floor-grid-2 .floor-item{width:94vw;height:72vw;margin:2vw 3vw;background:#fff}
+    .article-template.floor-grid-2 .floor-item .floor-item-cover{width:94vw;height:48vw}
+    .article-template.floor-grid-2 .floor-item .floor-item-cover img{width:94vw;height:48vw}
+    .article-template.floor-grid-2 .floor-item .floor-item-text{width:84vw;-webkit-box-sizing:border-box;box-sizing:border-box;padding:3vw}
+    .article-template.floor-grid-2 .floor-item .floor-item-text h2{line-height:5vw;-webkit-line-clamp:1}
+    .article-template.floor-grid-2 .floor-item .floor-item-text p{margin-top:3vw;font-size:3vw;line-height:5vw;-webkit-line-clamp:2}
+    .article-template.floor-grid-3 .floor-item{width:41vw;height:52vw;margin:2vw 2vw 0 0;background:#fff}
+    .article-template.floor-grid-3 .floor-item:first-of-type{margin-left:3vw}
+    .article-template.floor-grid-3 .floor-item:last-of-type{margin-right:3vw}
+    .article-template.floor-grid-3 .floor-item .floor-item-cover{width:41vw;height:29vw}
+    .article-template.floor-grid-3 .floor-item .floor-item-cover img{width:41vw;height:29vw}
+    .article-template.floor-grid-3 .floor-item .floor-item-text{width:41vw;-webkit-box-sizing:border-box;box-sizing:border-box;padding:3vw}
+    .article-template.floor-grid-3 .floor-item .floor-item-text h2{line-height:5vw;-webkit-line-clamp:1}
+    .article-template.floor-grid-3 .floor-item .floor-item-text p{margin-top:3vw;font-size:3vw;line-height:5vw;-webkit-line-clamp:2}
+    .article-template.floor-grid-4{padding:0 3vw;-webkit-box-sizing:border-box;box-sizing:border-box}
+    .article-template.floor-grid-4 .floor-item{width:46vw;height:57vw;margin:2vw 2vw 0 0;float:left;background:#fff}
+    .article-template.floor-grid-4 .floor-item:nth-of-type(2n){margin-right:0}
+    .article-template.floor-grid-4 .floor-item .floor-item-cover{width:46vw;height:33vw}
+    .article-template.floor-grid-4 .floor-item .floor-item-cover img{width:46vw;height:33vw}
+    .article-template.floor-grid-4 .floor-item .floor-item-text{width:46vw;-webkit-box-sizing:border-box;box-sizing:border-box;padding:3vw}
+    .article-template.floor-grid-4 .floor-item .floor-item-text h2{line-height:5vw;-webkit-line-clamp:1}
+    .article-template.floor-grid-4 .floor-item .floor-item-text p{margin-top:3vw;font-size:3vw;line-height:5vw;-webkit-line-clamp:2}
+    .product-template{padding:0 3vw;width:100vw;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden}
+    .product-template .floor-item-ad{display:block}
+    .product-template .floor-item-ad img{width:100%;height:100%}
+    .product-template .floor-item{display:block;position:relative;width:46vw;height:68vw;float:left;margin:2vw 2vw 0 0;background:#fff}
+    .product-template .floor-item .floor-item-cover{width:46vw;height:46vw}
+    .product-template .floor-item .floor-item-cover img{width:46vw;height:46vw}
+    .product-template .floor-item .floor-item-text{position:absolute;width:46vw;padding:2vw 3vw;bottom:0;-webkit-box-sizing:border-box;box-sizing:border-box}
+    .product-template .floor-item .floor-item-text .pro-tags .tag{display:inline-block;font-size:3vw;padding:0.5vw 0.8vw;border:1px solid #ccc}
+    .product-template .floor-item .floor-item-text .pro-title{height:9vw;font-size:3vw;line-height:5vw;color:#4a4f58;overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
+    .product-template .floor-item .floor-item-text .pro-price .price-tag{height:5vw;padding:1vw 0}
+    .product-template .floor-item .floor-item-text .pro-price .price-tag .tag{font-size:2.4vw;display:inline-block;line-height:5vw;color:#e15616;padding:0 0.8vw;border:1px solid #e15616;border-radius:0.5vw}
+    .product-template .floor-item .floor-item-text .pro-price .price{height:5vw;line-height:5vw}
+    .product-template .floor-item .floor-item-text .pro-price .none{color: #999999;text-decoration: line-through;}
+    .product-template.floor-grid-1 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
+    .product-template.floor-grid-1 .floor-item-ad.ad1{width:94vw;height:32vw;margin-right:0}
+    .product-template.floor-grid-1 .floor-item-ad.ad2{width:46vw;height:35vw}
+    .product-template.floor-grid-1 .floor-item-ad.ad3{width:46vw;height:35vw;margin-right:0}
+    .product-template.floor-grid-1 .floor-item:nth-of-type(2n){margin-right:0}
+    .product-template.floor-grid-2 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
+    .product-template.floor-grid-2 .floor-item-ad.ad1{width:46vw;height:68vw}
+    .product-template.floor-grid-2 .floor-item-ad.ad2{width:46vw;height:33vw;margin-right:0}
+    .product-template.floor-grid-2 .floor-item-ad.ad3{width:46vw;height:33vw;margin-right:0}
+    .product-template.floor-grid-2 .floor-item:nth-of-type(2n){margin-right:0}
+    .product-template.floor-grid-3 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
+    .product-template.floor-grid-3 .floor-item-ad.ad1{width:46vw;height:68vw}
+    .product-template.floor-grid-3 .floor-item-ad.ad2{width:46vw;height:33vw;margin-right:0}
+    .product-template.floor-grid-3 .floor-item-ad.ad3{width:46vw;height:33vw;margin-right:0}
+    .product-template.floor-grid-3 .floor-item-ad.ad4{width:46vw;height:33vw}
+    .product-template.floor-grid-3 .floor-item-ad.ad5{width:46vw;height:33vw;margin-right:0}
+    .product-template.floor-grid-3 .floor-item:nth-of-type(2n){margin-right:0}
+    .product-template.floor-grid-4 .floor-item:nth-of-type(2n){margin-right:0}
+    .product-template.floor-grid-5 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
+    .product-template.floor-grid-5 .floor-item-ad.ad1{width:94vw;height:24vw}
+    .product-template.floor-grid-5 .floor-item-ad.ad2{width:46vw;height:68vw}
+    .product-template.floor-grid-5 .floor-item-ad.ad3{width:46vw;height:68vw;margin-right:0}
+    .product-template.floor-grid-5 .floor-item:nth-of-type(2n){margin-right:0}
+    .product-template.floor-grid-6 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
+    .product-template.floor-grid-6 .floor-item-ad.ad1{width:94vw;height:24vw}
+    .product-template.floor-grid-6 .floor-item-ad.ad2{width:46vw;height:68vw}
+    .product-template.floor-grid-6 .floor-item:nth-of-type(2n+1){margin-right:0}
+    .product-template.floor-grid-7 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
+    .product-template.floor-grid-7 .floor-item-ad.ad1{width:46vw;height:68vw}
+    .product-template.floor-grid-7 .floor-item-ad.ad2{width:46vw;height:68vw;margin-right:0}
+    .product-template.floor-grid-7 .floor-item:nth-of-type(2n){margin-right:0}
+    .product-template.floor-grid-8 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
+    .product-template.floor-grid-8 .floor-item-ad.ad1{width:46vw;height:68vw}
+    .product-template.floor-grid-8 .floor-item:nth-of-type(2n+1){margin-right:0}
+    .product-template.floor-grid-9 .floor-item-ad,.product-template.floor-grid-10 .floor-item-ad{float:left;margin:2vw 2vw 0 0}
+    .product-template.floor-grid-9 .floor-item-ad.ad1,.product-template.floor-grid-10 .floor-item-ad.ad1{width:94vw;height:24vw}
+    .product-template.floor-grid-9 .floor-item:nth-of-type(2n),.product-template.floor-grid-10 .floor-item:nth-of-type(2n){margin-right:0}
+    .product-template.floor-grid-11{padding:0 !important}
+    .product-template.floor-grid-11 .swiper-slide{padding:0 3vw;-webkit-box-sizing:border-box;box-sizing:border-box}
+    .product-template.floor-grid-11 .floor-item:nth-of-type(2n){margin-right:0}
+    .article-template.floor-main{overflow:hidden}
+    .article-template.floor-main.floor-grid-1{height:140vw}
+    .article-template.floor-main.floor-grid-2{height:148vw}
+    .article-template.floor-main.floor-grid-4{height:118vw}
+    .picture-template.floor-main{overflow:hidden}
+    .picture-template.floor-main.floor-grid-4{height:100vw}
+    .picture-template.floor-main.floor-grid-6{height:47vw}
+    .product-template .floor-main{overflow:hidden}
+    .product-template .show-more{float:left}
+    .product-template.floor-grid-1 .floor-main{height:141vw}
+    .product-template.floor-grid-2 .floor-main{height:140vw}
+    .product-template.floor-grid-3 .floor-main{height:175vw}
+    .product-template.floor-grid-4 .floor-main{height:140vw}
+    .product-template.floor-grid-5 .floor-main{height:166vw}
+    .product-template.floor-grid-6 .floor-main{height:166vw}
+    .product-template.floor-grid-7 .floor-main{height:140vw}
+    .product-template.floor-grid-8 .floor-main{height:140vw}
+    .product-template.floor-grid-9 .floor-main{height:166vw}
+    .product-template.floor-grid-10 .floor-main{height:140vw}
+    .product-template.floor-grid-11 .floor-main{overflow:visible}
 }

+ 17 - 98
src/main/resources/static/css/product/product-coupon.css

@@ -4,90 +4,22 @@ li{list-style:none}
  * PC端
  */
 @media screen and (min-width:768px){
-    .sortBox{width:1184px;margin:16px auto;box-sizing:border-box;padding:12px;font-size:0;text-align:center;background:#FFF}
-    .sortBox li{display:inline-block;cursor:pointer;width:128px;height:40px;line-height:40px;font-size:16px;background:#F5F5F5;color:#93979F;position:relative;margin:0 8px}
-    .sortBox li.on,.sortBox li.up,.sortBox li.down{background:#FFE6DC;color:#E15616}
-    .sortBox li:before,.sortBox li:after{position:absolute;right:35px;content:'';width:0;height:0;border-style:solid}
-    .sortBox li:before{border-width:0 5px 5px 5px;border-color:transparent transparent #BEC2C9 transparent;top:14px}
-    .sortBox li:after{border-width:5px 5px 0 5px;border-color:#BEC2C9 transparent transparent transparent;top:22px}
-    .sortBox li:first-child:before,.sortBox li:first-child:after{display:none}
-    .sortBox li.up:before{border-bottom-color:#E15616}
-    .sortBox li.up:after{border-top-color:#E15616;opacity:.3}
-    .sortBox li.down:after{border-top-color:#E15616}
-    .sortBox li.down:before{border-bottom-color:#E15616;opacity:.3}
+    .coupon-banner{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;overflow:hidden}
+    .coupon-banner img{display:block;width:auto;height:510px;max-width:unset}
+    .coupon-content{width: 100%;margin-top: 24px;}
     .productList{width:1200px;margin:0 auto;box-sizing:border-box}
-    .productList .productItem {
-        width: 184px;
-        height: 268px;
-        float: left;
-        background: #fff;
-        position: relative;
-        margin: 0 16px 16px 0;
-        overflow: hidden;
-        float: left;
-    }
-    .productList .productItem img {
-        width: 100%;
-        height: 164px;
-    }
-    .productList .productItem .name{
-        display: block;
-        padding: 0 8px;
-        margin-top: 8px;
-        height: 40px;
-        line-height: 21px;
-        vertical-align: middle;
-        word-break: break-all;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        display: -webkit-inline-box;
-        -webkit-line-clamp: 2;
-        -webkit-box-orient: vertical
-    }
-    .productItem .price{
-        border: 0;
-        box-sizing: border-box;
-        padding: 0 8px;
-        height: 54px;
-        width: 100%;
-    }
-    .productItem .price .icon:before{
-        width: 63px;
-    }
-    .productItem .price .icon.i5:before {
-        background-position: -2px -832px;
-    }
-    .productItem .price .icon.i1:before {
-        background-position: -2px -712px;
-    }
-    .productItem .price .icon.i2:before {
-        background-position: -2px -742px;
-    }
-    .productItem .price .icon.i3:before {
-        background-position: -2px -772px;
-    }
-    .productItem .price .icon.i4:before {
-        background-position: -2px -802px;
-    }
-    .listTag{
-        margin: 12px 8px 0 0;
-        padding: 0 2px;
-    }
-    .productItem .image .icon{
-        position: inherit;
-    }
-    .sortBox li.on, .sortBox li.up, .sortBox li.down {
-        background: #FFE6DC;
-        color: #E15616;
-    }
-    .empty{
-        margin-top: 32px;
-        background: #fff;
-    }
-    .empty p{
-        color: #909090;
-        font-size: 14px;
-    }
+    .productList .productItem {width: 184px;height: 268px;float: left;background: #fff;position: relative;margin: 0 16px 16px 0;overflow: hidden;float: left;}
+    .productList .productItem img {width: 100%;height: 164px;}
+    .productList .productItem .name{display: block;padding: 0 8px;margin-top: 8px;height: 40px;line-height: 21px;vertical-align: middle;word-break: break-all;overflow: hidden;text-overflow: ellipsis;display: -webkit-inline-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical}
+    .productItem .price{border: 0;box-sizing: border-box;padding: 0 8px;height: 54px;width: 100%;}
+    .productItem .price .icon:before{width: 63px;}
+    .productItem .price .icon.i5:before {background-position: -2px -832px;}
+    .productItem .price .icon.i1:before {background-position: -2px -712px;}
+    .productItem .price .icon.i2:before {background-position: -2px -742px;}
+    .productItem .price .icon.i3:before {background-position: -2px -772px;}
+    .productItem .price .icon.i4:before {background-position: -2px -802px;}
+    .listTag{margin: 12px 8px 0 0;padding: 0 2px;}
+    .productItem .image .icon{position: inherit;}
     .productItem .price em{font-weight: normal}
     .productItem .price em.bold{font-weight: bold}
     .productItem .price .price_text_tag{width: 100%;height: 22px;box-sizing: border-box;float: left;margin-top: 3px;}
@@ -97,7 +29,6 @@ li{list-style:none}
     .productItem .price .main_price_show { width: 100%;height: 30px;line-height: 30px;font-size: 14px;color: #f94b4b;text-align: left;float: left;}
     .productItem .price .main_price_show.none { color: #999999; text-decoration: line-through;}
     .productItem .name .tag{width: 44px;height: 18px;line-height: 18px;font-size: 12px;display: inline-block;margin-right: 5px;text-align: center;color: #FFFFFF !important;background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);border-radius: 0px 10px 0px 0px;}
-
     .login-btn{font-size: 12px}
     .listTitle{width:1184px;margin:0 auto 16px auto;box-sizing:border-box;padding:16px 30px;border-radius:0 0 2px 2px;background:#fc5331 url(/img/cart/promotions.png) no-repeat right;background-size:auto 100%;color:#FFF}
     .listTitle h1{font-size:20px;line-height:42px;font-weight:normal;margin-bottom:16px}
@@ -105,25 +36,13 @@ li{list-style:none}
     .listTitle p em{color:#e15616;font-style:normal;display:inline-block;height:24px;line-height:24px;padding:0 10px;background:#FFF}
     .productItem .name span.tag{width: 44px;height: 18px;line-height: 18px;font-size: 12px;display: inline-block;margin-right: 5px;text-align: center;color: #FFFFFF !important;background-image: linear-gradient(270deg, #f9c023 0%, #f83600 100%);border-radius: 0px 10px 0px 0px;margin-top: 2px;}
 
-
-
 }
 /**
 * 移动端
 */
 @media screen and (max-width:768px){
-    /*footer{display:none!important;}*/
-    .sortBox{width:100%;margin:1px auto;box-sizing:border-box;background:#FFF;}
-    .sortBox li{width:15vw;height:11.6vw;line-height:11.6vw;text-align:center;font-size:3.4vw;color:#93979F;position:relative;margin:0 5vw}
-    .sortBox li.on,.sortBox li.up,.sortBox li.down{color:#E15616}
-    .sortBox li:before,.sortBox li:after{position:absolute;right:1vw;content:'';width:0;height:0;border-style:solid}
-    .sortBox li:before{border-width:0 .8vw .8vw .8vw;border-color:transparent transparent #BEC2C9 transparent;top:5vw}
-    .sortBox li:after{border-width:.8vw .8vw 0 .8vw;border-color:#BEC2C9 transparent transparent transparent;top:6.5vw}
-    .sortBox li:first-child:before,.sortBox li:first-child:after{display:none}
-    .sortBox li.up:before{border-bottom-color:#E15616}
-    .sortBox li.up:after{border-top-color:#E15616;opacity:.3}
-    .sortBox li.down:after{border-top-color:#E15616}
-    .sortBox li.down:before{border-bottom-color:#E15616;opacity:.3}
+    .coupon-banner{width:100vw;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;overflow:hidden}
+    .coupon-banner img{display:block;width:100vw;height:48vw;max-width:unset}
     .productList{margin: 3.2vw auto;width: 97vw;}
     .productList .productItem{width: 45.6vw;height: 70vw;overflow: hidden;margin: 0 1.3vw 2.6vw 1.3vw;background: #fff;text-align: left;}
     .productItem .price em {display: block;height: 7vw;line-height: 7vw;color: #4A4F58;font-style: normal;float: left;}

+ 3 - 2
src/main/resources/static/css/user-center/account/coupon-collection.css

@@ -11,8 +11,9 @@ li{list-style:none}
     .pageWrap{width: 968px;}
     .navLayout{min-height: 500px;}
     .coupon-container{width: 100%;min-height: 500px;background-color: #FFFFFF;}
-    .coupon-content-list{width: 100%;height: auto;box-sizing: border-box;padding:24px 13px;}
-    .coupon-list-cell{width: 369px;height: 148px;float: left;margin: 0 17px 17px 0;position: relative;background: url("/img/account/icon-coupon-uesb@2x.png") no-repeat;background-size: cover;}
+    .coupon-content-list{width: 100%;height: auto;box-sizing: border-box;padding:24px 13px 7px 13px;}
+    .coupon-list-cell{width: 369px;height: 148px;float: left;margin: 0 24px 17px 0;position: relative;background: url("/img/account/icon-coupon-uesb@2x.png") no-repeat;background-size: cover;}
+    .coupon-list-cell:nth-child(3n){margin-right: 0;}
     .coupon-list-cell .coupon-list-le{width: 299px;height: 148px;float: left;box-sizing: border-box;padding: 24px 14px 12px 14px;}
     .coupon-list-cell .coupon-list-money{width: 100%;height: 56px;line-height: 56px;color: #f94b4b;font-size: 14px;text-align: left;}
     .coupon-list-cell .coupon-list-money .maxMoney{font-size: 40px;margin-right: 8px;}

+ 2 - 1
src/main/resources/static/js/index.js

@@ -19,8 +19,9 @@ var homeData = new Vue({
     methods: {
         // 美博会弹窗链接
         popupPage:function(){
+            var _self = this;
             this.popupFlag=false;
-            window.location.href='/product/activity-306.html';
+            window.location.href='/user/coupon-collection.html';
             localStorage.setItem('lockTime',Date.now());
             window.localStorage.setItem('isActivityStatus',true);
         },

+ 43 - 184
src/main/resources/static/js/product/product-coupon.js

@@ -5,23 +5,16 @@ var productList = new Vue({
         listLoading: true,
         requestFlag: true,
         noMore: false,
-        params: {
-            size: 0,
-            num: 0,
-            keyword: "",
-            sortField: "",
-            sortType: 1, // 1降序,其他升序
-            // bid: "",
-            // sid: "",
-            // tid: ""
+        listQuery:{
+            keyword: '测试',
+            identity: GLOBAL_USER_IDENTITY,
+            pageSize: 18,
+            pageNum: 1,
+            sortField: '',
+            sortType: 1
         },
-        classify: [],
         listData: [], //priceflag 0公开价格 1不公开价格 2仅对会员机构公开,//userIdentity: 2-会员机构, 4-普通机构
         listRecord: 0,
-        pageInput: '1',
-        bigType: "",
-        smallType: "",
-        tinyType: "",
         userId: 0,
         shopID:0,
         userIdentity: '',
@@ -34,66 +27,12 @@ var productList = new Vue({
         }
     },
     computed: {
-        pageTotal: function () {
-            var total = Math.ceil(this.listRecord / this.params.size);
-            return total > 0 ? total : 1;
-        },
-        showPageBtn: function () {
-            var total = Math.ceil(this.listRecord / this.params.size);
-            total = total > 0 ? total : 1;
-            var index = this.params.num, arr = [];
-            if (total <= 6) {
-                for (var i = 1; i <= total; i++) {
-                    arr.push(i);
-                }
-                return arr;
-            }
-            if (index <= 3) return [1, 2, 3, 4, 5, 0, total];
-            if (index >= total - 2) return [1, 0, total - 4, total - 3, total - 2, total - 1, total];
-            return [1, 0, index - 2, index - 1, index, index + 1, index + 2, 0, total];
-        }
+
     },
     methods: {
-        toPagination: function (pageNum) {
-            if (pageNum <= this.pageTotal) {
-                var params = {pageNum: pageNum};
-                window.location.href = updateUrlParam(params);
-            }
-        },
-        toSortList: function (sortField, sortType) {
-            var params = {
-                sortfield: sortField,
-                sorttype: sortType
-            };
-            window.location.href = updateUrlParam(params);
-        },
-        checkNum: function () {
-            if (this.pageInput > this.pageTotal) {
-                this.pageInput = this.pageTotal;
-            } else if (this.pageInput < 1) {
-                this.pageInput = 1;
-            }
-        },
-        PromotionsFormat:function(promo){//促销活动类型数据处理
-            if(promo!=null){
-                if(promo.type == 1 && promo.mode == 1){
-                    return true
-                }else{
-                    return false
-                }
-            }
-            return false
-        },
         getListByKeyword: function () {
             var _self = this;
-            ProductApi.GetProductSearchList({
-                keyword: this.params.keyword,
-                identity: GLOBAL_USER_IDENTITY,
-                pageSize: this.params.size,
-                pageNum: this.params.num,
-                sortField: this.params.sortField,
-                sortType: this.params.sortType
-            },function (res) {
+            ProductApi.GetProductSearchList(_self.listQuery,function (res) {
                 console.log(res);
                 if (res.code === 0 && res.data ) {
                     var result = JSON.parse(res.data);
@@ -105,11 +44,7 @@ var productList = new Vue({
                             $("img[data-original]").lazyload();
                         },500);
                     });
-                    if(isPC){
-                        _self.listData = resultData;
-                    }else{
-                        _self.listData = _self.listData.concat(resultData);
-                    }
+                    _self.listData = _self.listData.concat(resultData);
                     console.log(_self.listData)
                     _self.listLoading = false;
                     _self.requestFlag = true;
@@ -118,54 +53,19 @@ var productList = new Vue({
                 }
             });
         },
-        // getListByCategory: function (path, categoryId) {
-        //     var _self = this;
-        //     $.getJSON(spiServer+"/search/query/product/"+ path ,{
-        //         id: categoryId,
-        //         identity: GLOBAL_USER_IDENTITY,
-        //         pageSize: this.params.size,
-        //         pageNum: this.params.num,
-        //         sortField: this.params.sortField,
-        //         sortType: this.params.sortType
-        //     }, function (r) {
-        //         if (r.code === 0 && r.data) {
-        //             var result = JSON.parse(r.data);
-        //             _self.listRecord = result.total;
-        //             var resultData = setSearchProductList(result.items, _self.userId, function(){
-        //                 _self.$forceUpdate();
-        //                 setTimeout(function(){
-        //                     // 图片懒加载
-        //                     $("img[data-original]").lazyload();
-        //                 },500);
-        //             });
-        //             if(isPC){
-        //                 _self.listData = resultData;
-        //             }else{
-        //                 _self.listData = _self.listData.concat(resultData);
-        //             }
-        //             console.log(_self.listData)
-        //         }
-        //         _self.listLoading = false;
-        //         _self.requestFlag = true;
-        //     })
-        // }
+        PromotionsFormat:function(promo){//促销活动类型数据处理
+            if(promo!=null){
+                if(promo.type == 1 && promo.mode == 1){
+                    return true
+                }else{
+                    return false
+                }
+            }
+            return false
+        },
+
     },
     created: function () {
-        if(isPC){
-            this.params.size = getUrlParam("pageSize") ? getUrlParam("pageSize") * 1 : 20;
-            this.params.num = getUrlParam("pageNum") ? getUrlParam("pageNum") * 1 : 1;
-        }else{
-            this.params.size = 10;
-            this.params.num = 1;
-        }
-        this.params.keyword = getUrlParam("keyword") ? getUrlParam("keyword") : "";
-        // 搜索框赋值
-        $('#topSearch').find('[data-select]').attr("data-select", 0).text("产品");
-        $('#topSearch').find('.jqSelect').find('select').val(0);
-        $('#topSearch').find('.keyword').val(getUrlParam("keyword"));
-        this.params.sortField = getUrlParam("sortField") ? getUrlParam("sortField") : "";
-        this.params.sortType = getUrlParam("sortType") ? getUrlParam("sortType") * 1 : 1;
-        // this.searchFlag = (this.params.keyword !== "");
         if(globalUserData){
             this.userId = globalUserData.userId;
             this.userIdentity = globalUserData.identity;
@@ -178,74 +78,33 @@ var productList = new Vue({
         }
         // 获取列表数据
         this.getListByKeyword();
-
-        // if (this.searchFlag) {
-        //     // 获取列表数据
-        //     this.getListByKeyword();
-        // } else {
-        //     // category=1000-1001-1005
-        //     if (!getUrlParam("category")) {
-        //         this.listLoading = false;
-        //         return false;
-        //     }
-        //     var category = getUrlParam("category").split("-");
-        //     this.params.bid = category[0];
-        //     this.params.sid = category[1];
-        //     this.params.tid = category[2];
-        //     // 根据分类获取数据
-        //     if (this.params.tid && this.params.tid>0) {
-        //         this.getListByCategory("tinyType", this.params.tid);
-        //     } else if (this.params.sid && this.params.sid>0){
-        //         this.getListByCategory("smallType", this.params.sid);
-        //     } else if (this.params.bid && this.params.bid>0) {
-        //         this.getListByCategory("bigType", this.params.bid);
-        //     } else {
-        //         alertInfo("URL参数异常!", function(){
-        //             window.location.href = "/";
-        //         });
-        //     }
-        // }
     },
     mounted: function () {
         var _self = this;
-        if(!isPC){
+            //上垃加载更多
+        if(!isPC) {
             $('footer').addClass("noneImportant");
-            //移动端上垃加载更多
-            $(window).on('scroll', function(){
-                var scrollTop = $(this).scrollTop();
-                var scrollHeight = $(document).height();
-                var windowHeight = window.innerHeight;
-                if (scrollTop + windowHeight >= scrollHeight) {
-                    //此处是滚动条到底部时候触发的事件,在这里写要加载的数据,或者是拉动滚动条的操作
-                    var totalPage = Math.ceil(_self.listRecord / _self.params.size)?Math.ceil(_self.listRecord / _self.params.size):1;
-                    var next = _self.params.num+1;
-                    if(next <= totalPage){
-                        if (_self.requestFlag){
-                            _self.params.num = next;
-                            // 获取列表数据
-                            _self.getListByKeyword();
-                            // if (_self.searchFlag) {
-                            //     // 获取列表数据
-                            //     _self.getListByKeyword();
-                            // } else {
-                            //     // 根据分类获取数据
-                            //     if (_self.params.tid && _self.params.tid>0) {
-                            //         _self.getListByCategory("tinyType", _self.params.tid);
-                            //     } else if (_self.params.sid && _self.params.sid>0){
-                            //         _self.getListByCategory("smallType", _self.params.sid);
-                            //     } else if (_self.params.bid && _self.params.bid>0) {
-                            //         _self.getListByCategory("bigType", _self.params.bid);
-                            //     }
-                            // }
-                        }
-                        _self.requestFlag = false;
-                    }else{
-                        //到底了
-                        _self.noMore = true;
-                        $('footer').removeClass("noneImportant");
+        }
+        $(window).on('scroll', function(){
+            var scrollTop = $(this).scrollTop();
+            var scrollHeight = $(document).height();
+            var windowHeight = window.innerHeight;
+            if (scrollTop + windowHeight >= scrollHeight-400) {
+                //此处是滚动条到底部时候触发的事件,在这里写要加载的数据,或者是拉动滚动条的操作
+                var totalPage = Math.ceil(_self.listRecord / _self.listQuery.pageSize)?Math.ceil(_self.listRecord / _self.listQuery.pageSize):1;
+                var next = _self.listQuery.pageNum+1;
+                if(next <= totalPage){
+                    if (_self.requestFlag){
+                        _self.listQuery.pageNum = next;
+                        // 获取列表数据
+                        _self.getListByKeyword();
                     }
+                    _self.requestFlag = false;
+                }else{
+                    //到底了
+                    _self.noMore = true;
                 }
-            });
-        }
+            }
+        });
     }
 });

+ 1 - 2
src/main/resources/templates/index.html

@@ -359,8 +359,7 @@
         </div>
     </div>
     <!--新用户优惠券弹窗-->
-    <div id="meibohui" class="Popup" v-if="popupFlag" :class="popupFlag ? 'show' :'' "
-         onclick="_czc.push(['_trackEvent','美博会','点击','用户访问','','meibohui'])">
+    <div id="meibohui" class="Popup" v-if="popupFlag" :class="popupFlag ? 'show' :'' ">
         <div class="show_popup">
             <div class="bg_icon" @click="closePopup"><i class="icon mIcon"></i></div>
             <div class="bg_img" @click="popupPage">

+ 59 - 150
src/main/resources/templates/product/product-coupon.html

@@ -4,7 +4,7 @@
 <head>
     <title>采美365网-商品列表</title>
     <template th:replace="components/head-link"></template>
-    <link th:href="@{/css/product/list.css(v=${version})}" rel="stylesheet" type="text/css">
+    <link th:href="@{/css/product/product-coupon.css(v=${version})}" rel="stylesheet" type="text/css">
     <template th:replace="components/analysis"></template>
 </head>
 <body>
@@ -13,175 +13,84 @@
 
 <!-- 商品列表 -->
 <div id="productList">
-    <!-- 面包屑 -->
-    <div v-if="isPC && listData && listData.length>0" class="crumbs">
-        <span>搜索结果</span>
-        <span>&gt;</span> <a href="javascript:void(0);" @click="toPagination(1)" v-text="params.keyword"></a>
-    </div>
-
-    <!--    <template v-if="isPC && listData && listData.length>0">-->
-    <!--        &lt;!&ndash; 面包屑 &ndash;&gt;-->
-    <!--        <div v-if="searchFlag" class="crumbs">-->
-    <!--            <span>搜索结果</span>-->
-    <!--            <span>&gt;</span> <a href="javascript:void(0);" @click="toPagination(1)" v-text="params.keyword"></a>-->
-    <!--        </div>-->
-    <!--        <div v-else class="crumbs">-->
-    <!--            <a href="/">首页</a>-->
-    <!--            <template v-if="params.bid && params.bid>0">-->
-    <!--                <template v-if="params.sid && params.sid>0">-->
-    <!--                    <span>&gt;</span> <a :href="'/product/list.html?category='+params.bid+'-0-0'" v-text="bigType"></a>-->
-    <!--                    <template v-if="params.tid && params.tid>0">-->
-    <!--                        <span>&gt;</span> <a :href="'/product/list.html?category='+params.bid+'-'+params.sid+'-0'" v-text="smallType"></a>-->
-    <!--                        <span>&gt;</span> <span v-text="tinyType"></span>-->
-    <!--                    </template>-->
-    <!--                    <template v-else>-->
-    <!--                        <span>&gt;</span> <span v-text="smallType"></span>-->
-    <!--                    </template>-->
-    <!--                </template>-->
-    <!--                <template v-else>-->
-    <!--                    <span>&gt;</span> <span v-text="bigType"></span>-->
-    <!--                </template>-->
-    <!--            </template>-->
-    <!--        </div>-->
-    <!--        &lt;!&ndash;分类&ndash;&gt;-->
-    <!--        <div v-if="(!searchFlag)" id="listClassify" class="classifyBox">-->
-    <!--            <div class="clsTab">-->
-    <!--                <template v-for="(big,i) in classify">-->
-    <!--                    <a :class="{'on': params.bid==big.bigTypeID}" v-if="big.validFlag==1" href="javascript:void(0);" v-text="big.name"></a>-->
-    <!--                </template>-->
-    <!--            </div>-->
-    <!--            <div class="clsCon">-->
-    <!--                <div class="tabItem" v-for="big in classify" :bid="big.bigTypeID" style="display: none;">-->
-    <!--                    <div class="line" :class="{'on': params.sid==small.smallTypeID}" v-for="small in big.smalltypeList" v-if="small.validFlag==1">-->
-    <!--                        <div class="lft" :class="{'on': params.sid==small.smallTypeID}">-->
-    <!--                            <a :href="'/product/list.html?category='+big.bigTypeID+'-'+small.smallTypeID+'-0'" v-text="small.name"></a>-->
-    <!--                        </div>-->
-    <!--                        <div class="rgt">-->
-    <!--                            <template v-for="tiny in small.tinytypeList">-->
-    <!--                                <a v-if="tiny.validFlag==1" :class="{'on': params.tid==tiny.tinyTypeID}" :href="'/product/list.html?category='+big.bigTypeID+'-'+small.smallTypeID+'-'+tiny.tinyTypeID" v-text="tiny.name"></a>-->
-    <!--                            </template>-->
-    <!--                        </div>-->
-    <!--                    </div>-->
-    <!--                </div>-->
-    <!--            </div>-->
-    <!--        </div>-->
-    <!--    </template>-->
-    <!--loading-->
     <div v-if="listLoading" class="loading">
         <img src="/img/base/loading.gif">
     </div>
-    <!--数据为空-->
-    <div v-else-if="!listLoading && (!listData || listData.length==0)" class="empty">
-        <img src="/img/common/empty.png">
-        <div class="msg">
-            <p>暂未找到你搜索的商品,去<a href="/">商城</a>,逛逛吧~</p>
-        </div>
-    </div>
     <template v-else>
-        <!--排序-->
-        <div class="sortBox">
-            <ul class="mfc">
-                <li :class="{'on':params.sortField == ''}" @click="toSortList('',1)">综合</li>
-                <template>
-                    <li v-if="params.sortField == 'sales' && params.sortType == 1" class="down"
-                        @click="toSortList('sales',0)"><span>销量</span></li>
-                    <li v-else-if="params.sortField == 'sales' && params.sortType == 0" class="up"
-                        @click="toSortList('sales',1)"><span>销量</span></li>
-                    <li v-else @click="toSortList('sales',0)"><span>销量</span></li>
-                </template>
-                <template>
-                    <li v-if="params.sortField == 'favorite' && params.sortType == 1" class="down"
-                        @click="toSortList('favorite',0)"><span>人气</span></li>
-                    <li v-else-if="params.sortField == 'favorite' && params.sortType == 0" class="up"
-                        @click="toSortList('favorite',1)"><span>人气</span></li>
-                    <li v-else @click="toSortList('favorite',0)"><span>人气</span></li>
-                </template>
-                <template>
-                    <li v-if="params.sortField == 'price' && params.sortType == 1" class="down"
-                        @click="toSortList('price',0)"><span>价格</span></li>
-                    <li v-else-if="params.sortField == 'price' && params.sortType == 0" class="up"
-                        @click="toSortList('price',1)"><span>价格</span></li>
-                    <li v-else @click="toSortList('price',0)"><span>价格</span></li>
-                </template>
-            </ul>
+        <!--banner图-->
+        <div class="coupon-banner">
+            <a href='javascript:void(0)'>
+                <img src="https://img-b.caimei365.com/group1/M00/03/2F/Cmgy62CLqkKALo9yAAXXb7lOUDg193.jpg" v-if="isPC">
+                <img src="https://img-b.caimei365.com/group1/M00/03/2F/Cmgy62CLqkKAN-QJAAKb1_mLtyU768.jpg" v-else>
+            </a>
         </div>
         <!--商品列表-->
-        <ul class="productList clear mfw">
-            <li class="productItem " v-for="p in listData">
-                <a class="image" :href="'/product-'+p.productId+'.html'">
-                    <img src="/img/base/placeholder.png" :data-original="p.image" :alt="p.name">
-                    <p class="name" v-html="addhtml + p.name" v-if="p.beautyActFlag==1"></p>
-                    <p class="name" v-html="p.name" v-else></p>
-                    <div class="price">
-                        <template v-if="GLOBAL_USER_ID && GLOBAL_USER_ID>0">
-                            <!--用户身份 0、个人 1、协销 2、会员机构 3、供应商 4,普通机构-->
-                            <template v-if="p.priceFlag==1">
-                                <div class="price_text_tag">
-                                    <p class="listTag" v-if="p.actStatus==1">{{p.promotions.name}}</p>
-                                </div>
-                                <div class="main_price_unde">¥价格未公开</div>
-                            </template>
-                            <template v-else>
-                                <template v-if="(p.priceFlag==0 && p.userIdentity!=3) || p.userIdentity==2 || (p.userIdentity==3 && p.shopId==GLOBAL_SHOP_ID)">
-                                    <div class="price_text_tag">
-                                        <p class="couponTag">优惠券</p>
-                                        <p class="listTag" v-if="p.actStatus==1">
-                                            {{p.promotions.name}}
-                                            <span v-if="p.priceFlag != 1 && PromotionsFormat(p.promotions)">:¥{{p.price | NumFormat}}</span>
-                                        </p>
-                                    </div>
-                                    <div class="main_price_show" :class="PromotionsFormat(p.promotions) ? 'none' : ''">
-                                        ¥{{ (PromotionsFormat(p.promotions) ? p.originalPrice : p.price ) | NumFormat }}
-                                    </div>
-                                </template>
-                                <template v-else-if="p.priceFlag==2 && p.userIdentity==4">
+        <div class="coupon-content clear">
+            <ul class="productList clear mfw">
+                <li class="productItem " v-for="p in listData">
+                    <a class="image" :href="'/product-'+p.productId+'.html'">
+                        <img src="/img/base/placeholder.png" :data-original="p.image" :alt="p.name">
+                        <p class="name" v-html="addhtml + p.name" v-if="p.beautyActFlag==1"></p>
+                        <p class="name" v-html="p.name" v-else></p>
+                        <div class="price">
+                            <template v-if="GLOBAL_USER_ID && GLOBAL_USER_ID>0">
+                                <!--用户身份 0、个人 1、协销 2、会员机构 3、供应商 4,普通机构-->
+                                <template v-if="p.priceFlag==1">
                                     <div class="price_text_tag">
-                                        <p class="couponTag">优惠券</p>
                                         <p class="listTag" v-if="p.actStatus==1">{{p.promotions.name}}</p>
                                     </div>
-                                    <div class="main_price_unde">¥会员可见</div>
+                                    <div class="main_price_unde">¥价格未公开</div>
                                 </template>
                                 <template v-else>
-                                    <div class="price_text_tag">
-                                        <p class="couponTag">优惠券</p>
-                                        <p class="listTag" v-if="p.actStatus==1">{{p.promotions.name}}</p>
-                                    </div>
-                                    <div class="price_grade"><span class="bold">¥</span><i :class="'icon mIcon i'+p.priceGrade"></i></div>
+                                    <template v-if="(p.priceFlag==0 && p.userIdentity!=3) || p.userIdentity==2 || (p.userIdentity==3 && p.shopId==GLOBAL_SHOP_ID)">
+                                        <div class="price_text_tag">
+                                            <p class="couponTag">优惠券</p>
+                                            <p class="listTag" v-if="p.actStatus==1">
+                                                {{p.promotions.name}}
+                                                <span v-if="p.priceFlag != 1 && PromotionsFormat(p.promotions)">:¥{{p.price | NumFormat}}</span>
+                                            </p>
+                                        </div>
+                                        <div class="main_price_show" :class="PromotionsFormat(p.promotions) ? 'none' : ''">
+                                            ¥{{ (PromotionsFormat(p.promotions) ? p.originalPrice : p.price ) | NumFormat }}
+                                        </div>
+                                    </template>
+                                    <template v-else-if="p.priceFlag==2 && p.userIdentity==4">
+                                        <div class="price_text_tag">
+                                            <p class="couponTag">优惠券</p>
+                                            <p class="listTag" v-if="p.actStatus==1">{{p.promotions.name}}</p>
+                                        </div>
+                                        <div class="main_price_unde">¥会员可见</div>
+                                    </template>
+                                    <template v-else>
+                                        <div class="price_text_tag">
+                                            <p class="couponTag">优惠券</p>
+                                            <p class="listTag" v-if="p.actStatus==1">{{p.promotions.name}}</p>
+                                        </div>
+                                        <div class="price_grade"><span class="bold">¥</span><i :class="'icon mIcon i'+p.priceGrade"></i></div>
+                                    </template>
                                 </template>
                             </template>
-                        </template>
-                        <template v-else>
-                            <div class="price_text_tag ">
-                                <p class="couponTag">优惠券</p>
-                                <p class="listTag" v-if="p.actStatus==1">{{p.promotions.name}}</p>
-                            </div>
-                            <div class="price_grade "><span class="bold">¥</span><i :class="'icon mIcon i'+p.priceGrade"></i></div>
-                        </template>
-                    </div>
-                </a>
-            </li>
-        </ul>
+                            <template v-else>
+                                <div class="price_text_tag ">
+                                    <p class="couponTag">优惠券</p>
+                                    <p class="listTag" v-if="p.actStatus==1">{{p.promotions.name}}</p>
+                                </div>
+                                <div class="price_grade "><span class="bold">¥</span><i :class="'icon mIcon i'+p.priceGrade"></i></div>
+                            </template>
+                        </div>
+                    </a>
+                </li>
+            </ul>
+        </div>
     </template>
     <!--分页-->
     <div v-if="(!isPC) && noMore" class="noMore">---- 没有更多了 ----</div>
-    <div v-if="isPC && pageTotal>1" class="pageWrap clear">
-        <a v-if="params.num>1" class="prev" @click="toPagination(params.num*1-1)" href="javascript:void(0);"></a>
-        <template v-for="n in showPageBtn">
-            <a v-if="n" :class="{'on':(n==params.num)}" @click="toPagination(n)" href="javascript:void(0);" v-text="n"></a>
-            <span v-else>···</span>
-        </template>
-        <a v-if="params.num<pageTotal" class="next" @click="toPagination(params.num*1+1)" href="javascript:void(0);"></a>
-        <span>共<b v-text="pageTotal>1?pageTotal:1"></b>页</span>
-        <span>跳至</span>
-        <input v-model="pageInput" @blur="checkNum()"/>
-        <span>页</span>&nbsp;
-        <a class="btn" href="javascript:void(0);" @click="toPagination(pageInput)">点击跳转</a>
-    </div>
+
 </div>
 <!-- 引入底部 -->
 <template th:replace="components/footer"></template>
 <template th:replace="components/foot-link"></template>
 <script charset="utf-8" type="text/javascript" th:src="@{/js/common/serviceapi/product.service.js(v=${version})}"></script>
-<script charset="utf-8" type="text/javascript" th:src="@{/js/product/list.js(v=${version})}"></script>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/product/product-coupon.js(v=${version})}"></script>
 </body>
 </html>