zhengjinyi 3 rokov pred
rodič
commit
21b206b345

+ 2 - 2
src/main/resources/static/css/product/detail.h5.css

@@ -11,7 +11,7 @@ li{list-style:none}
 .productBox .detailBox{box-sizing:border-box;padding:0 3.3vw;overflow:hidden;position: relative;}
 .productBox .detailBox .crumbs{height:8vw;line-height:8vw;font-size:3.1vw;overflow:hidden;color:#93979F}
 .productBox .detailBox .crumbs a{color:#93979F}
-.productBox .detailBox .title{font-size:4.2vw;font-weight:bold;line-height:6.4vw;color:#4A4F58;margin-bottom:3.5vw}
+.productBox .detailBox .title{width: 80vw;font-size:4.2vw;font-weight:bold;line-height:6.4vw;color:#4A4F58;margin-bottom:3.5vw;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;}
 .productBox .detailBox .tags span{display:inline-block;height:4.2vw;line-height:4.2vw;padding:0 1vw;font-size:2.6vw;color:#FFF;background:#86B2FF;border-radius:2px;margin-right:2.7vw}
 .productBox .detailBox .detail{box-sizing:border-box;padding:2.8vw;font-size:3.4vw;line-height:7.5vw;color:#93979F;background:#f3f7fe;border-radius:2px;position:relative;margin:3.5vw 0}
 .productBox .detailBox .detail hr{border:none;border-top:1px dashed #BEC2C9;margin:2vw 0}
@@ -19,7 +19,7 @@ li{list-style:none}
 .productBox .detailBox .none-details .none-image{width: 38.6vw;height: 30.5vw;display: block;margin: 0 auto;}
 .productBox .detailBox .none-details .none-text{width: 100%;height: 4vw;line-height: 4vw;text-align: center;color: #ffb496;font-size: 3.4vw;margin-top: 2vw;}
 .productBox .detailBox .none-details.show{opacity: 1;}
-.productBox .detailBox .product-collection{width:14.4vw;display: block;position: absolute;right: 0;top: 10.4vw;cursor: pointer;}
+.productBox .detailBox .product-collection{width:14vw;display: block;position: absolute;right: 2vw;top: 15.8vw;cursor: pointer;}
 .productBox .detailBox .product-collection img{height: 6.4vw;width: 6.4vw;display: block;margin: 0 auto;margin-bottom: .2vw;}
 .productBox .detailBox .product-collection p{height: 4.4vw;line-height: 4.4vw;text-align: center;font-size: 3vw;color: #333333;}
 .productBox .detailBox .row{position:relative;}

+ 1 - 1
src/main/resources/static/css/product/detail.pc.css

@@ -23,7 +23,7 @@ li{list-style:none;}
 .productBox .detailBox .crumbs{height:28px;line-height:28px;font-size:14px;overflow:hidden;color:#9aa5b5;padding:0;}
 .productBox .detailBox .crumbs a{color:#9aa5b5}
 .productBox .detailBox .crumbs a:hover{color:#E15616}
-.productBox .detailBox .title{font-size:18px;font-weight:bold;line-height:24px;padding:5px 0;color:#4A4F58}
+.productBox .detailBox .title{font-size:18px;font-weight:bold;line-height:24px;padding:5px 0;color:#4A4F58;width: 620px;}
 .productBox .detailBox .tags{padding:2px 0}
 .productBox .detailBox .tags span{display:inline-block;line-height:16px;padding: 3px 6px;font-size:12px;color: #9aa5b5;border-radius:2px;margin-right:10px;border: 1px solid #e2e7ef;}
 .productBox .detailBox .detail{box-sizing:border-box;padding:14px 20px;font-size:14px;color:#9aa5b5;background:#f3f7fe;border-radius:2px;margin:10px 0;position:relative;}

+ 42 - 13
src/main/resources/static/js/user-center/collection/collection.js

@@ -6,6 +6,7 @@ var orderPage = new Vue({
         noMore: false,
         listLoading: true,
         isHandle:false,
+        isListEmpty:false,
         isAllChecked:false,
         isProductChecked:false,
         checkedNum:0,
@@ -59,29 +60,32 @@ var orderPage = new Vue({
                 this.pageInput = 1;
             }
         },
-        getCollectionProductList: function () {
+        getCollectionProductList: function () {// 获取收藏商品列表
             var _self = this;
             ProductApi.getProductUserLikeList(_self.listQuery,function (response) {
                 if (response.code === 0 ) {
                     var data = response.data;
                     _self.listRecord = data.totalRecord;
-                    var list = data.results.map((el,index)=>{
+                    if(data.results.length > 0 ){
+                        var list = data.results.map((el,index)=>{
                             el.isChecked = false;
-                        return el
-                    });
-                    if(isPC){
-                        _self.listData = list;
+                            return el;
+                        });
+                        if(isPC){
+                            _self.listData = list;
+                        }else{
+                            _self.listData = _self.listData.concat(list);
+                        }
+                        _self.isListEmpty = true;
                     }else{
-                        _self.listData = _self.listData.concat(list);
+                        _self.listData = [];
+                        _self.isListEmpty = false;
+                        _self.noMore = false;
                     }
-                    setTimeout(function(){
-                        // 图片懒加载
-                        $("img[data-original]").lazyload();
-                    },500);
                     _self.listLoading = false;
                     _self.requestFlag = true;
                 }else {
-                    CAIMEI.Alert(res.msg, '确定');
+                    CAIMEI.Alert(response.msg, '确定');
                 }
             });
         },
@@ -142,7 +146,7 @@ var orderPage = new Vue({
             if(type == 1) {
                 _self.shoppingCart(pros);
             }else{
-                window.location.href = '/shopping/confirm.html?type=2&id='+pros.productId+'&count='+pros.priceGrade;
+                window.open('/shopping/confirm.html?type=2&id='+pros.productId+'&count='+pros.priceGrade);
             }
         },
         hanldAllAddCart:function () {// 批量加入购物车
@@ -222,6 +226,7 @@ var orderPage = new Vue({
                     if(response.code == 0){
                         CAIMEI.dialog('取消收藏成功',true,function () {
                             _self.getCollectionProductList();
+                            _self.isHandle = false;
                         });
                     }else{
                         CAIMEI.Alert(response.msg, '确定', false);
@@ -275,5 +280,29 @@ var orderPage = new Vue({
             _self.listQuery.userId = this.userId;
             _self.getCollectionProductList();
         }
+        if(!isPC){
+            //移动端上垃加载更多
+            $(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.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.getCollectionProductList();
+                        }
+                        _self.requestFlag = false;
+                    }else{
+                        //到底了
+                        _self.noMore = true;
+                    }
+                }
+            });
+        }
     }
 });

+ 2 - 2
src/main/resources/templates/user-center/collection/collection.html

@@ -45,7 +45,7 @@
       </div>
     </div>
     <div class="collection-content clear">
-      <ul class="productList clear mfw" v-if="listData.length > 0">
+      <ul class="productList clear mfw" v-if="isListEmpty">
         <li class="productItem " v-for="p in listData">
           <div class="product-cancel" @click="hanldCancel(p)" v-if="!isHandle">取消收藏</div>
           <div class="product-button" v-if="!isHandle">
@@ -56,7 +56,7 @@
             <span class="mask-checked" :class="[p.isChecked ?'checked':'']"></span>
           </div>
           <a class="image" :href="'/product-'+p.productId+'.html'" target="_blank">
-            <img src="/img/base/placeholder.png" :data-original="p.image" :alt="p.name">
+            <img :src="p.image" :data-original="p.image" :alt="p.name">
             <p class="name" v-html="p.name" v-if="p.beautyActFlag==1"></p>
             <p class="name" v-html="p.name" v-else></p>
             <div class="price">