列表

src/main/resources/static/css/base/base.h5.css

@@ -106,11 +106,11 @@
 .productItem .item .name span{color:#93979F;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
 .productItem .item .name em{font-style: normal;color: #e15616;}
 .productItem .item .price{height:21vw;text-align:center}
-.productItem .item .price em{display:block;height:7vw;line-height:4.6vw;color:#4A4F58;font-style:normal;}
+.productItem .item .price em{display:block;height:7vw;line-height:5vw;color:#4A4F58;font-style:normal;}
 .productItem .item .price em.p{color:#F55C5C}
-.productItem .item .price .icon{display:inline-block;font-size:0;width:4vw;height:4vw;line-height:4vw;position:relative;vertical-align:top;margin-top:0}
+.productItem .item .price .icon{display:inline-block;font-size:0;width:17vw;height:5vw;line-height:5vw;position:relative;vertical-align:top;margin-top:0}
 .productItem .item .price .icon.on{position:absolute;left:0;top:0;margin:0}
-.productItem .item .price .icon:before{width:4vw;height:4vw;background-position:55% 25.2%}
+/*.productItem .item .price .icon:before{width:4vw;height:4vw;background-position:55% 25.2%}*/
 .productItem .item .price .icon.on:before{background-position:49% 25.2%}
 .productItem .item .btn{height:9vw;line-height:9vw}
 .productItem .item .btn{display:inline-block;width:35.8vw;height:9vw;text-align:center;overflow:hidden;color:#F94B4B;background:#FEF6F3;border-radius:2px}
@@ -138,5 +138,10 @@
 #scrollTop .phoneHover a{color:#E15616}
 #scrollTop .phoneHover a>i{display:inline-block;height:7.2vw;line-height:7.2vw;padding:0 2vw;background:#F55C5C;border-radius:3.6vw;margin-left:4vw;font-size:3.4vw}
 
-
+/**/
+.mIcon.one{background-image: url(/img/base/baseH5/Grade1.png)}
+    .mIcon.two{background-image: url(/img/base/baseH5/Grade2.png)}
+    .mIcon.three{background-image: url(/img/base/baseH5/Grade3.png)}
+    .mIcon.four{background-image: url(/img/base/baseH5/Grade4.png)}
+    .mIcon.five{background-image: url(/img/base/baseH5/Grade5.png)}
 

src/main/resources/static/css/base/base.pc.css

@@ -181,14 +181,15 @@ header{box-shadow: 0 2px 10px #ebecef;}
 .productItem .name{display:block;padding:14px 35px;height:48px;line-height:24px}
 .productItem .name span{color:#93979F;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
 .productItem .name em{font-style: normal;color: #e15616;}
-.productItem .price{height:48px;}
-.productItem .price em{display:block;height:48px;line-height:48px;color:#4A4F58;font-style:normal;text-align:center;}
-.productItem .price em.p{color:#F55C5C}
+.productItem .price{height:48px;border-top: 1px solid #E15616}
+.productItem .price em{height:48px;line-height:48px;color:#4A4F58;font-style:normal;margin-left: 15px;font-weight: bold;
+    font-size: 14px}
+.productItem .price em.p{color:#333333}
 .productItem .price .icon{display:inline-block;font-size:0;width:24px;height:24px;line-height:24px;position:relative;vertical-align:top;margin-top:12px}
 .productItem .price .icon.on{position:absolute;left:0;top:0;margin:0}
-.productItem .price .icon:before{width:24px;height:24px;background-position:-146px -251px}
+/*.productItem .price .icon:before{width:24px;height:24px;background-position:-146px -251px}*/
 .productItem .price .icon.on:before{background-position:-116px -251px}
-.productItem .btnBox{display:none;position:absolute;width:284px;height:68px;background:#FEF6F3;text-align:center;bottom:0;left:0}
+.productItem .btnBox{display:none;position:absolute;width:284px;height:55px;background:#E15616;text-align:center;bottom:0;left:0}
 .productItem .item:hover .btnBox{display:block}
 .productItem .item:hover .name span{color: #e15616;}
 .productItem .item:hover{box-shadow:0px 2px 6px #dedede;-moz-transition: all 0.5s;-webkit-transition:all 0.5s;transition:all 0.3s;-webkit-transform:translate3d(0,-2px,0);transform:translate3d(0,-2px,0);}
@@ -211,7 +212,7 @@ header{box-shadow: 0 2px 10px #ebecef;}
 /* 登录弹框 */
 .loginAlert{padding-top:5px;}
 .loginAlert span:first-child:after{content: '，';}
-.loginAlert:after{content:'';display:block;width:125px;height:125px;background:url(/img/account/to_login.png) no-repeat left top;background-size:100% 100%;margin:10px 0 0 15px;}
+/*.loginAlert:after{content:'';display:block;width:125px;height:125px;background:url(/img/account/to_login.png) no-repeat left top;background-size:100% 100%;margin:10px 0 0 15px;}*/
 /* 咨询，回到顶部 */
 #scrollTop{display:none;position:fixed;right:50%;margin-right:-700px;width:88px;z-index:9999;bottom:120px;}
 #scrollTop .item{width:100%;background-color:#fff;box-sizing:border-box;text-align:center;box-shadow:0 2px 4px rgb(254,246,243);border-radius:2px;margin-bottom:10px;font-size:12px;position:relative}
@@ -227,4 +228,89 @@ header{box-shadow: 0 2px 10px #ebecef;}
 #scrollTop .item .phoneHover a:hover{text-decoration:underline}
 #scrollTop .item:hover .phoneHover{display:block}
 
-
+/**/
+.mIcon.one{background-image: url(/img/base/Grade1.png)}
+    .mIcon.two{background-image: url(/img/base/Grade2.png)}
+    .mIcon.three{background-image: url(/img/base/Grade3.png)}
+    .mIcon.four{background-image: url(/img/base/Grade4.png)}
+    .mIcon.five{background-image: url(/img/base/Grade5.png)}
+     a.pricebox{color: #fff;width: 100%;height: 100%;position: absolute;left: 0;line-height: 55px;font-size: 14px}
+    .login-btn{float:right;
+    margin:10px 10px 0 0;
+    padding:2px 5px;
+    border:1px solid rgba(225,86,22,0.16862745098039217);
+    color:#E15616;
+    border-radius:2px;
+    height: 24px;
+    line-height: 24px;
+    }
+    .productItem .price .icon{
+    width: 80px;
+    height: 24px;
+    margin-top: 5px;
+    }
+    .moneyicon{
+     font-weight: bold;
+    }
+    .activity{
+    text-align: center;
+    display: inline-block;
+    height: 24px;
+    border: 1px solid rgba(225,86,22,0.30196078431372547);
+    opacity: 1;
+    border-radius: 2px;
+    font-size: 12px;
+    font-family: Microsoft YaHei;
+    font-weight: 400;
+    line-height: 24px;
+    color: rgba(225,86,22,1) !important;
+    position: relative;
+    z-index: 1;
+    cursor: pointer;
+    background: #fff;
+    padding: 0px 20px 0 5px;
+    margin-left: 15px;
+ }
+ .activitystyle{
+    border-bottom: 1px solid #fff !important;
+}
+.activity .icon{
+       width: 15px;
+    height: 15px;
+    position: absolute;
+    top: 10px;
+    background: transparent url(/img/base/tubiao@2x.png) no-repeat no-repeat scroll right 5px center;
+    background-position: -168px -48px;
+    right: 0;
+}
+.activity  .activeicon{
+    background-position: -207px -46px;
+        top: 8px;
+}
+.activityBox{
+    border: 1px solid rgba(225,86,22,0.30196078431372547);
+    border-radius: 0px 2px 2px 2px;
+    position: absolute;
+    background: #fff;
+    left: 0;
+    font-size: 12px;
+    text-align: center;
+    top: 28px;
+    line-height: 40px;
+    padding:10px;
+    max-height: 319px;
+    overflow: auto;
+}
+.activeBtn{
+    width: 57px;
+    height: 24px;
+    background: #E15616;
+    color: #fff;
+    border-radius: 2px;
+    float: right;
+    margin-top: 10px;
+    cursor: pointer;
+}
+.priceicon{
+    font-weight: bold;
+}

src/main/resources/static/css/index/index.pc.css

@@ -84,3 +84,16 @@ li{list-style:none;}
 #sideNav .item>a:first-child:before{display:none}
 #sideNav .item>a.on{background:#FEF6F3;color:#E15616}
 
+.btnBox{
+    background:#E15616;
+    height: 55px;
+    line-height: 55px;
+    position: absolute;
+    width: 100%;
+    bottom: 0
+}
+.btnBox a{
+    color: #fff;
+    font-size: 12px;
+    text-align: center
+}

src/main/resources/static/css/product/detail.h5.css

@@ -19,9 +19,9 @@ li{list-style:none}
 .productBox .detailBox .row em.ser{color:#93979F;display:inline-block;margin-right:4vw}
 .productBox .detailBox .row em.ser:before{content:'\2713';display:inline-block;width:3.4vw;height:3.4vw;text-align:center;line-height:3.4vw;font-size:3.4vw;background:#E15616;border-radius:1.7vw;color:#FFF;margin-right:1.4vw}
 .productBox .detailBox .price{height:21vw}
-.productBox .detailBox .price .icon{display:inline-block;font-size:0;width:4vw;height:4vw;line-height:4vw;position:relative;vertical-align:text-top;margin-top:0}
+.productBox .detailBox .price .icon{display:inline-block;font-size:0;width:17vw;height:5vw;line-height:5vw;position:absolute;vertical-align:text-top;margin-top:.2vw}
 .productBox .detailBox .price .icon.on{position:absolute;left:0;top:0;margin:0}
-.productBox .detailBox .price .icon:before{width:4vw;height:4vw;background-position:55% 25.2%}
+/*.productBox .detailBox .price .icon:before{width:4vw;height:4vw;background-position:55% 25.2%}*/
 .productBox .detailBox .price .icon.on:before{background-position:49% 25.2%}
 .productBox .detailBox .number{display:inline-block;width:26.6vw;line-height:6.4vw;height:6.4vw;box-sizing:border-box;border:1px solid #FFE6DC;border-radius:2px;font-size:0;white-space:nowrap;text-align:center;overflow:hidden;vertical-align:top}
 .productBox .detailBox .number>em{display:inline-block;width:6.4vw;height:6.4vw;background:#FFE6DC;font-size:4vw;line-height:6vw;vertical-align:top}

src/main/resources/static/css/product/detail.pc.css

@@ -17,36 +17,36 @@ li{list-style:none;}
 .productBox .zoomImage{display:none;overflow:hidden;position:absolute;right:-466px;top:0;width:452px;height:452px;border:1px solid #e4e4e4;z-index:9999;background:#FFF}
 .productBox .zoomImage img{width:950px;height:950px;margin-right:10px;display:block}
 
-.productBox .detailBox .crumbs{height:28px;line-height:28px;font-size:14px;overflow:hidden;color:#93979F}
+.productBox .detailBox .crumbs{height:28px;line-height:28px;font-size:14px;overflow:hidden;color:#93979F;padding:0;}
 .productBox .detailBox .crumbs a{color:#93979F}
 .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 .tags{padding:2px 0}
-.productBox .detailBox .tags span{display:inline-block;height:16px;line-height:16px;padding:0 6px;font-size:12px;color:#FFF;background:#86B2FF;border-radius:2px;margin-right:10px}
-.productBox .detailBox .detail{box-sizing:border-box;padding:14px 20px;font-size:14px;color:#93979F;background:#F3F7FE;border-radius:2px;margin:10px 0;position:relative;}
-.productBox .detailBox .detail hr{border:none;border-top:1px dashed #BEC2C9;margin:12px 0}
-.productBox .detailBox .row{position:relative;padding:3px 0 3px 80px;line-height:24px}
+.productBox .detailBox .tags span{display:inline-block;line-height:16px;padding: 3px 6px;font-size:12px;color: #999999;border-radius:2px;margin-right:10px;border: 1px solid #EDEDED;}
+.productBox .detailBox .detail{box-sizing:border-box;padding:14px 20px;font-size:14px;color:#999999;background:#FDF8F6;border-radius:2px;margin:10px 0;position:relative;}
+.productBox .detailBox .detail hr{border:none;border-top:1px dashed #F9DDD0;margin:12px 0}
+.productBox .detailBox .row{padding:3px 0 3px 80px;line-height:24px}
 .productBox .detailBox .row .l{display:inline-block;min-width:60px;height:24px;text-align:justify;vertical-align:top;margin-left:-80px;}
 .productBox .detailBox .row .l:after{content:'';display:inline-block;width:100%}
 .productBox .detailBox .row>i{font-style:normal;}
-.productBox .detailBox .row em{font-style:normal;color:#4A4F58}
-.productBox .detailBox .row em.ser{color:#93979F;display:inline-block;margin-right:20px}
-.productBox .detailBox .row em.ser:before{content:'\2713';display:inline-block;width:12px;height:12px;text-align:center;line-height:12px;font-size:12px;background:#E15616;border-radius:6px;color:#FFF;margin-right:5px}
+.productBox .detailBox .row em{font-style:normal;color:#333333;margin-left: 15px}
+.productBox .detailBox .row em.ser{color:#93979F;display:inline-block;margin-right:20px;background-image: url(/img/base/fuwu.png)}
+.productBox .detailBox .row em.ser:before{content:'\2713';display:inline-block;width:12px;height:12px;text-align:center;line-height:12px;font-size:12px;background:#E15616;border-radius:6px;color:#FFF;margin-right:5px;}
 .productBox .detailBox .price{height:24px}
-.productBox .detailBox .price .icon{display:inline-block;font-size:0;width:24px;height:24px;line-height:24px;position:relative;vertical-align:top}
+.productBox .detailBox .price .icon{display:inline-block;font-size:0;width:80px;height:24px;line-height:24px;position:relative;vertical-align:top}
 .productBox .detailBox .price .icon.on{position:absolute;left:0;top:0;margin:0}
-.productBox .detailBox .price .icon:before{width:24px;height:24px;background-position:-146px -251px}
+/*.productBox .detailBox .price .icon:before{width:24px;height:24px;background-position:-146px -251px}*/
 .productBox .detailBox .price .icon.on:before{background-position:-116px -251px}
-.productBox .detailBox .number{display:inline-block;width:130px;line-height:24px;height:24px;box-sizing:border-box;border:1px solid #FFE6DC;border-radius:2px;font-size:0;white-space:nowrap;text-align:center;overflow:hidden;vertical-align:top;}
-.productBox .detailBox .number>em{display:inline-block;width:24px;height:22px;background:#FFE6DC;font-size:20px;line-height:20px;vertical-align:top;cursor:pointer}
-.productBox .detailBox .number input{width:80px;border:none;line-height:22px;font-size:14px;vertical-align:top;text-align:center;color:#E15616;}
+.productBox .detailBox .number{display:inline-block;width:96px;line-height:24px;height:24px;box-sizing:border-box;border:1px solid #FFE6DC;border-radius:2px;font-size:0;white-space:nowrap;text-align:center;overflow:hidden;vertical-align:top;}
+.productBox .detailBox .number>em{display:inline-block;width:24px;height:22px;background:#FFE6DC;font-size:20px;line-height:20px;vertical-align:top;cursor:pointer;margin: 0}
+.productBox .detailBox .number input{width:48px;border:none;line-height:22px;font-size:14px;vertical-align:top;text-align:center;color:#E15616;}
 
 .productBox .detailBox .detail .flag{position:absolute;right:0;top:0;font-size:0}
 .productBox .detailBox .detail .flag:before{display:inline-block;width:115px;height:115px;background-position:0 -453px}
 .productBox .detailBox .detail .btn{position:absolute;right:20px;top:20px;height:32px;line-height:32px;padding:0 16px;background:#F94B4B;font-size:14px;color:#FFF;border-radius:2px}
 .productBox .detailBox .detail .row .btn{top:6px;right:0}
-.productBox .detailBox .btnBox{text-align:center;padding:15px 0}
-.productBox .detailBox .btnBox .cart,.productBox .detailBox .btnBox .buy{display:inline-block;width:160px;height:40px;line-height:40px;text-align:center;border:1px solid #E15616;background:#FFE6DC;cursor:pointer;border-radius:2px;font-size:16px;color:#E15616;margin:0 15px}
+.productBox .detailBox .btnBox{padding:15px 0}
+.productBox .detailBox .btnBox .cart,.productBox .detailBox .btnBox .buy{display:inline-block;width:160px;height:40px;line-height:40px;text-align:center;border:1px solid #E15616;background:#fff;cursor:pointer;border-radius:2px;font-size:16px;color:#E15616;margin:0 10px}
 .productBox .detailBox .btnBox .cart:before{display:inline-block;width:20px;height:20px;vertical-align:middle;background-position:-30px -1px;margin-right:2px}
 .productBox .detailBox .btnBox .buy{background:#E15616;color:#FFF}
 .productBox .detailBox .detail .btn:hover,.productBox .detailBox .btnBox .cart:hover,.productBox .detailBox .btnBox .buy:hover{opacity:.8}
@@ -55,7 +55,7 @@ li{list-style:none;}
 
 .recommendBox{margin-bottom:16px;overflow: hidden;}
 .recommendBox .hd{font-size:16px;color:#4A4F58;font-weight:bold;padding:16px 32px}
-#productRecommend{width:100%;min-height:205px;padding:15px 7px;background:#FFF}
+#productRecommend{padding:10px;}
 #productRecommend li{float:left;width:167px;height:205px;overflow:hidden;}
 #productRecommend li .item{width:153px;height:205px;margin:0 auto;line-height:22px}
 #productRecommend li .item a{display:block;width:100%;height:100%;color:#93979F}
@@ -68,8 +68,8 @@ li{list-style:none;}
 #productRecommend .swiper-pagination span:before{content:"";display:inline-block;width:100%;height:4px;background:#E15616;border-radius:2px}
 #productRecommend .swiper-pagination span.on{width:28px;opacity:1;}
 
-.wrap>.productInfo{float:left;box-sizing:border-box;padding:0 16px;width:884px;background:#FFF}
-.productInfo .tabTit{height:40px;line-height:40px;border-bottom:1px solid #E15621;font-size:16px;color:#93979F}
+.wrap>.productInfo{float:left;box-sizing:border-box;padding:0 16px;width:884px;background:#FFF;height: 600px}
+.productInfo .tabTit{height:40px;line-height:40px;border-bottom:1px solid #E15621;font-size:16px;color:#333333}
 .productInfo .tabTit span{display:inline-block;box-sizing:border-box;min-width:130px;text-align:center;height:100%;padding:0 32px;cursor:pointer}
 .productInfo .tabTit span:hover{color:#E15621}
 .productInfo .tabTit span.on,.productInfo .tabTit span.on:hover{background:#E15621;color:#FFF}
@@ -82,12 +82,169 @@ li{list-style:none;}
 .productInfo .comment{color:#93979F;padding:40px 0}
 
 .wrap>.rgt{float:right;width:284px}
-.wrap>.rgt .hd{height:40px;line-height:40px;padding:0 16px;font-size:16px;color:#E15616;font-weight:bold;background:#FEF6F3}
+.wrap>.rgt .hd{height:40px;line-height:40px;padding:0 16px;font-size:18px;color:#fff;font-weight:bold;background:rgba(255,156,71,1)}
 .shopBox{margin-bottom:16px;background:#FFF}
-.shopBox .bd{padding:0 16px 16px}
-.shopBox .bd .name{line-height:20px;padding: 10px 0;font-weight:bold;color:#4A4F58;font-size:14px;border-bottom:1px solid #F7F7F7}
+.shopBox .bd{padding:15px}
+.shopBox .bd .name{line-height:20px;padding: 10px 0;font-weight:bold;color:#4A4F58;font-size:14px;border-bottom:1px solid #F7F7F7;position: relative}
 .shopBox .bd .tit{line-height:30px;font-weight:bold;color:#4A4F58;font-size:14px}
-.shopBox .bd .con{line-height:20px;color:#93979F;font-size:12px;margin-bottom:12px}
-.shopBox .bd .btn{display:block;width:100%;height:36px;line-height:36px;text-align:center;box-sizing:border-box;border-radius:2px;border:1px solid #E15616;font-size:14px;color:#E15616;margin-top:12px}
+.shopBox .bd .con{line-height:20px;color:#666;font-size:12px;margin-bottom:12px}
+.shopBox .bd .btn{display:block;width:100%;height:36px;line-height:36px;text-align:center;box-sizing:border-box;border-radius:2px;border:1px solid #E15616;font-size:14px;color:#fff;margin-top:12px;background: rgba(225,86,22,1)}
 .wrap>.rgt .contact{background:#FFF}
-.wrap>.rgt .contact .bd{padding:10px 16px 16px;line-height:24px;font-size:14px;color:#4A4F58;font-weight:bold}
+.wrap>.rgt .contact .bd{padding:15px;line-height:24px;font-size:12px;color:#4A4F58;margin-bottom: 12px}
+.wrap>.rgt .contact .bd div:nth-child(1){font-weight: bold;font-size: 14px;}
+.wrap>.rgt .contact .bd div{margin-bottom: 12px}
+
+.row img{width: 12px;height: 12px;display: inline-block;margin: -3px 5px}
+.row .fuwu{margin-right: 15px}
+    input[type="number"]{
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    }
+    input::-webkit-outer-spin-button,
+    input::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    }
+a.member-detail{
+     cursor: pointer;
+    margin-top: 5px;
+    color: #fff;
+    font-size: 14px;
+    width: 153px;
+    height: 36px;
+    background: #E15616;
+    text-align: center;
+    line-height: 36px;
+    border-radius: 2px;
+    float: left;
+}
+.Boxtext{
+    text-align: left;
+    line-height: 25px;
+    color: #333333;
+    padding-bottom: 5px;
+}
+.item-tips{
+    width: 312px;
+    height: auto;
+    padding: 12px;
+    border: 1px solid rgba(225,86,22,0.30196078431372547);
+    background: #ffffff;
+    position: absolute;
+    top: 28px;
+    left: 93px;
+}
+.tip-tr{
+    width: 100%;
+    height: 42px;
+    border-bottom: 1px solid rgba(225,86,22,0.30196078431372547);
+}
+.tips-content{
+    width: 294px;
+    height: auto;
+    border: 1px solid rgba(225,86,22,0.30196078431372547);
+    border-radius: 5px;
+    margin: auto;
+}
+.tip-td{
+    width: 146px;
+    height: 100%;
+    float: left;
+    line-height: 42px;
+    font-size: 14px;
+    color: #E15616;
+    text-align: center;
+}
+.tip-tr:last-child{
+    border-bottom: none;
+}
+.tip-td:nth-child(1){
+    border-right: 1px solid rgba(225,86,22,0.30196078431372547);
+}
+a.upgrade{
+    width: 154px;
+    height: 36px;
+    background: rgba(225,86,22,1);
+    opacity: 1;
+    border-radius: 2px;
+    display: inline-block;
+    text-align: center;
+    line-height: 36px;
+    color: #fff
+}
+.activepro{
+    width: 312px;
+    overflow: hidden;
+    cursor: pointer;
+}
+.activeimg{
+    width: 68px;
+    height: 68px;
+    float: left;
+    line-height: 68px
+}
+.activeimg img{
+    width: 100%;
+    height: 100%
+}
+.activeright{
+    float: right;
+    width: 230px
+}
+.activeright p{
+        text-align: left;
+    line-height: 20px;
+    font-size: 12px
+}
+.loginWithParam{
+    color: rgb(225, 86, 22);
+    width: 100%;
+    text-align: left
+}
+.vip-tips{
+    width: 114px;
+    height: 30px;
+    background-color: #666;
+    border-radius: 2px;
+    line-height: 30px;
+    font-size: 12px;
+    color: #FFF;
+    text-align: center;
+    position: absolute;
+    top: -29px;
+    left: 81%;
+    display: inline-block;
+     opacity: 0;
+    transition: all 1s;
+    z-index: 999
+}
+.vip-tips:before {
+    content: "";
+    width: 10px;
+    height: 10px;
+    background: #666;
+    position: absolute;
+    bottom: -3px;
+    left: 17px;
+    transform: rotate(45deg);
+}
+.icon.shop:hover .vip-tips{
+     opacity: 1;
+}
+.row .pricedeail{
+    font-weight: bold;
+}
+.original-price{
+    text-decoration:line-through;
+}
+.modalForm{
+    opacity: 0
+}
+.show{
+    opacity: 1;
+}
+.modal-back{
+    display: block;
+}
+.activityBox{
+left: 93px;
+}

src/main/resources/static/js/base.js

@@ -356,11 +356,14 @@ function setSearchProductList(list, userId) {
         });
         // 0公开价格 1不公开价格 2仅对会员机构公开
         if (item.p_price_flag !== 1) {
-            productIdArr.push(item.id)
+            productIdArr.push(item.p_id)
         }
     });
     if (userId && userId > 0) {
         setProductPrice(resultData, productIdArr.join(","), userId, function () {});
+    }else {
+    var userId = 0;
+     setProductPrice(resultData, productIdArr.join(","), userId, function () {});
     }
     return resultData;
 }
@@ -373,10 +376,14 @@ function setProductPrice(productList, productIds, userId, callback){
             var priceList = r.data;
             productList.map(function(product){
                 priceList.map(function(item){
-                    if(product.id === item.productId){
+                    if(product.id*1 === item.productId){
                         product.userIdentity = item.userIdentity;
                         product.price = item.price;
                         product.priceLoaded = true;
+                        product.ladderPriceFlag = item.ladderPriceFlag;
+                     var actStatus = item.actStatus;
+                        product.actStatus=actStatus;
+                        product.promotions =item.promotions;
                     }
                 });
             });
@@ -394,6 +401,12 @@ function toBeforePath(){
     }
     window.location.href = beforePath;
 }
+function toLogin() {//去登录
+    window.location.href ='login.html';
+}
+function  upgrade () { //升级会员
+    window.location.href='';
+}
 /**
  * 至少保留两位小数
  * 10 => "10.00"

src/main/resources/static/js/index.js

@@ -1,13 +1,14 @@
 var homeData = new Vue({
     el: '#container',
     data: {
-        userId:'',
+        userId:0,
         images: [],
         recommends: [],
         recommendPage: 1,
         pageFloors: [],
         advertising: [],
-        asideNav: []
+        asideNav: [],
+        productIdArr:[],
     },
     methods: {
         getBanners: function(){
@@ -84,7 +85,7 @@ var homeData = new Vue({
                         }
                     },500);
                     // 获取价格
-                    if(_self.userId && _self.userId>0){
+                    // if(_self.userId && _self.userId>0){
                         var productIdArr = [];
                         _self.recommends.map(function (item) {
                             // 0公开价格 1不公开价格 2仅对会员机构公开
@@ -93,10 +94,12 @@ var homeData = new Vue({
                             }
                         });
                         setProductPrice(_self.recommends, productIdArr.join(","), _self.userId, function () {});
-                    }
+                        console.log(_self.recommends)
+                    // }
                 }
             });
         },
+
         getFloorData: function(){
             var _self = this;
             $.getJSON("/home/floor").done(function (r) {

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

@@ -3,7 +3,7 @@ var productDetail = new Vue({
     data: {
         productId: 0,
         userId: 0,
-        userIdentity: '',
+        userIdentity: '', //2-会员机构；3-供应商；4-普通机构
         userToken: '',
         images: [],
         price: 564,
@@ -12,6 +12,22 @@ var productDetail = new Vue({
         recommendPage: 1,
         recommends: [],
         parameters: [],
+        isShow:false,
+        ladderList:[],//阶梯价
+        deailData:{},
+        promotions:{},//促销活动信息
+        recommde:false,
+        recommdeindex:0,
+        number:0,
+        minBuyNumber:0,
+        buyRetailPrice:0,
+        allTotalPrice:0,
+        typedata:0,
+        promotionsId:0,//活动商品id
+        giftData:[],//赠品
+        isQuantity:false,
+        isStock:false,
+        cartAlert:false
 
     },
     computed: {},
@@ -49,6 +65,147 @@ var productDetail = new Vue({
                 }
             });
         },
+    toLogin:function() {
+    location.href ='/login.html';
+   },
+        productDetail:function(){
+         var _self = this;
+            if(_self.productId ===0){return;}
+            $.getJSON(spiServer + "/product/detail/price",{
+                // userId:this.userId,
+                // productId: this.productId
+                userId:10684,
+                productId: _self.productId
+            }).done(function (r) {
+                if (r.code === 0 && r.data) {
+                _self.priceFlag = r.data.priceFlag;
+                _self.number = r.data.minBuyNumber;//最小起訂量
+                _self.buyRetailPriceStep = r.data.step;
+                _self.minBuyNumber = r.data.minBuyNumber;
+                _self.buyRetailPrice = r.data.price;
+                    console.log(r)
+                    if(r.data.ladderPriceFlag==1){
+                        _self.ladderPrice();
+                     }else {
+                        _self.allTotalPrice = _self.number * _self.deailData.price;
+                     }
+                   _self.deailData =r.data;
+                    if(_self.deailData.actStatus==1){
+                    _self.promotions =  _self.deailData.promotions;
+                    _self.promotionsId = _self.deailData.promotions.id;
+                     _self.promotionsProduct();
+                    }
+
+                }
+            });
+        },
+        changeCountAdd:function () { //数量增加按钮
+        var _this = this;
+            if(_this.buyRetailPriceStep == 2){
+					_this.number += _this.minBuyNumber
+				}else{
+					_this.number++
+				}
+				_this.allTotalPrice = _this.number * _this.deailData.price;
+				_this.calculatPerice()
+        },
+        changeCountSub:function(){//popup弹窗数量减按钮
+           var _this = this;
+				if(_this.number<=_this.minBuyNumber){
+					_this.number= _this.minBuyNumber;
+					_this.isQuantity =true;
+					 layer.tips('此商品最小起批量为' + _this.minBuyNumber, $(this).parent().find(".calc-input"), {
+                        tips: 1,
+                        time: 3000
+                         });
+					return
+				}else{
+					if(_this.buyRetailPriceStep == 2){
+						_this.number-=_this.minBuyNumber
+					}else{
+						_this.number--
+					}
+					_this.allTotalPrice = _this.number * _this.deailData.price;
+					_this.calculatPerice();
+					_this.isQuantity =false
+				}
+			 },
+			 changeNumber:function(e){
+			   var  _this=this;
+				var _value = e.detail.value;
+				if(!_value){
+					_this.number = _this.minBuyNumber
+				}else if(_value < _this.minBuyNumber){
+					_this.layer.msg('该商品最小起订量为'+_this.minBuyNumber,2000);
+					_this.number = _this.minBuyNumber
+				}else if( _value % _this.minBuyNumber !=0 ){
+					_this.layer.msg('购买量必须为起订量的整数倍',2000);
+					_this.number = _this.minBuyNumber
+				}else{
+					_this.number = e.detail.value;
+					_this.allTotalPrice = _this.number * _this.deailData.price;
+					_this.calculatPerice();
+				}
+			},
+        calculatPerice:function(){//判断是否为阶梯价然后做计算价格处理
+              var _this = this;
+				if(_this.deailData.ladderPriceFlag == '1'){
+					_this.ladderList.forEach(function (item,index) {
+						if(_this.number>=item.buyNum){
+							_this.buyRetailPrice = item.buyPrice
+							_this.allTotalPrice = _this.number*item.buyPrice
+						}
+					})
+				}else{
+					_this.buyRetailPrice = _this.deailData.price;
+				}
+			},
+		addShopCart:function(){ //加入购物车
+			    var _this = this;
+               $.getJSON(spiServer + "/shoppingCart/addCart",{
+                        productID: _this.productId,
+                        userID: _this.userId,
+                        productCount: _this.number,
+                   }).done(function (res) {
+                          if(res.code==0){
+                                _this.cartAlert = true;
+                                _this.typedata = res.data;//商品种数
+                            }else {
+
+                                _this.cartAlert = false;
+                            }
+                })
+                // request.addCart(params,function (res) {
+                //         if(res.code==0){
+                //             _this.cartAlert = true;
+                //             _this.typedata = res.data;//商品种数
+                //         }else {
+                //
+                //             _this.cartAlert = false;
+                //         }
+                // })
+			},
+		buyShopCart:function(){//立即购买
+			    var _this = this;
+                var productid = _this.productId;
+                    allCount =  _this.number;
+                var confirmorder ={
+                        allPrice:_this.allTotalPrice,
+                        productID:productid,
+                        productCount:allCount,
+                        type:1
+                    };
+                   _util.setStorageItem('confirmGoodsInfo',JSON.stringify({data:confirmorder}));
+                    window.location.href = '/order/confirmOrder.jsp?type=1';
+			},
+		Continueshop:function(){ //继续购物
+			 var _this = this;
+			    _this.cartAlert = false;
+			     location.reload()
+			},
+			settlement:function(){//去结算
+			   window.location.href = "/shopping/cart.html"
+			},
         getRecommends: function(){
             var _self = this;
             if(this.productId ===0){return;}
@@ -57,31 +214,45 @@ var productDetail = new Vue({
                 recommendType: this.recommendType
             }).done(function (r) {
                 if (r.code === 0 && r.data) {
-                    _self.recommends = r.data;
-                    _self.recommendPage = Math.ceil(r.data.length / 7);
-                    setTimeout(function(){
-                        if (isPC) {
-                            $('#productRecommend').slide({
-                                mainCell:".swiper-wrapper"
-                                ,titCell:".swiper-pagination span"
-                                ,effect: "leftLoop"
-                                ,interTime: 3000
-                                ,autoPlay: true
-                                ,scroll:7
-                                ,vis:7
-                                ,trigger: "mouseover"
-                            });
-                        } else {
-                            var swiper = new Swiper('#productRecommend', {
-                                slidesPerView: 3,
-                                freeMode: true,
-                                spaceBetween: 0
-                            });
-                        }
-                    },500);
+                    // _self.recommendPage = Math.ceil(r.data.length / 7);
+                    if(r.data.length > 0){
+                        _self.recommends = r.data;
+                        _self.recommde =true;
+                    }else {
+                       _self.recommde =false;
+                    }
+                    if(r.data.length<7){
+                        var length = 7-r.data.length;
+                        _self.recommdeindex = length;
+                    }else {
+                        var remainderres=r.data.length%7;
+                         _self.recommdeindex= 7-remainderres;
+                    }
+                }
+            });
+        },
+        ladderPrice:function(){
+            var _self = this;
+            if(this.productId ===0){return;}
+            $.getJSON(spiServer + "/product/ladderPrice",{
+                productId: this.productId
+            }).done(function (r) {
+                if (r.code === 0 && r.data) {
+                    console.log(r)
+                   _self.ladderList =r.data;
+                   _self.ladderList.forEach(function (item,index) {
+						if(_self.number>=item.buyNum){
+							_self.buyRetailPrice = item.buyPrice
+							_self.allTotalPrice = _self.buyRetailPrice*_self.number;
+						}
+					})
+
                 }
             });
         },
+        clubupgrade:function(){
+            location.href='/myAccount/club/clubupgrade.jsp'
+        },
         getParameters: function(){
             var _self = this;
             if(this.productId ===0){return;}
@@ -93,6 +264,26 @@ var productDetail = new Vue({
                 }
             });
         },
+        activity:function () {
+           var _this = this;
+           _this.isShow = !_this.isShow;
+        },
+        activeBtn:function () {
+           var _this = this;
+            _this.isShow = false;
+        },
+        promotionsProduct:function () {//赠品接口
+            var _self = this;
+            if(_self.promotionsId ===0){return;}
+            $.getJSON(spiServer + "/product/promotions/gifts",{
+                promotionsId: _self.promotionsId
+            }).done(function (r) {
+                if (r.code === 0 && r.data) {
+                    console.log(r)
+                    _self.giftData = r.data;
+                }
+            });
+        }
     },
     created: function () {
         this.productId = getUrlParam("id") ? getUrlParam("id")*1 : 0;
@@ -103,6 +294,7 @@ var productDetail = new Vue({
         this.getImages();
     },
     mounted: function () {
+        this.productDetail();
         this.getRecommends();
         $('.productInfo').slide({
             mainCell:".tabCon"
@@ -110,11 +302,36 @@ var productDetail = new Vue({
             ,trigger: "click"
         });
         if(globalUserData){
-            this.userId = globalUserData.userId;
-            this.userIdentity = globalUserData.identity;
+           console.log(globalUserData)
+            globalUserData.userId ? globalUserData.userId : globalUserData.userID;
+            this.userIdentity = globalUserData.identity ? globalUserData.identity : globalUserData.userIdentity;
             this.userToken = globalUserData.token;
         }
-
+         //相關推薦輪播
+        var mySwiper = new Swiper('#productRecommend',{
+                slidesPerView: 7,
+                spaceBetween: 12,
+                slidesPerGroup: 7,
+                autoplay: {
+                    delay:10000,
+                    disableOnInteraction: false,//是否禁止autoplay。默认为true：停止。
+                },
+                loop: false,
+                observer: true, //修改swiper自己或子元素时，自动初始化swiper
+                observeParents: true, //修改swiper的父元素时，自动初始化swiper
+                pagination: {
+                    el: '.swiper-pagination',
+                    clickable: true,
+                },
+                on:{
+                    init:function() {
+                        var length = this.slides.length;
+                        if(length < 8) {
+                            this.autoplay.stop();
+                        }
+                    }
+                }
+       })
 
     }
 });

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

@@ -23,6 +23,7 @@ var productList = new Vue({
         smallType: "",
         tinyType: "",
         userId: 0,
+        shopID:0,
         userIdentity: '',
         userToken: ''
     },
@@ -85,6 +86,7 @@ var productList = new Vue({
                     }else{
                         _self.listData = _self.listData.concat(resultData);
                     }
+                    console.log(_self.listData)
                 }
                 _self.listLoading = false;
                 _self.requestFlag = true;
@@ -138,12 +140,14 @@ var productList = new Vue({
                 if (r.code === 0 && r.data) {
                     var result = JSON.parse(r.data);
                     _self.listRecord = result.total;
+                    console.log(_self.userId)
                     var resultData = setSearchProductList(result.items, _self.userId);
                     if(isPC){
                         _self.listData = resultData;
                     }else{
                         _self.listData = _self.listData.concat(resultData);
                     }
+                    console.log(_self.listData)
                 }
                 _self.listLoading = false;
                 _self.requestFlag = true;
@@ -174,6 +178,7 @@ var productList = new Vue({
         var userInfo = localStorage.getItem('userInfo');
         if(userInfo){
             this.userId = JSON.parse(userInfo).userId;
+            this.shopID = JSON.parse(userInfo).shopId;
         }
         if (this.searchFlag) {
             // 获取列表数据

src/main/resources/templates/index.html

@@ -66,23 +66,53 @@
                                 </a>
                                 <div class="price mfhc">
                                     <template v-if="userId && userId>0">
-                                        <em v-if="p.priceFlag==1">未公开价格</em>
+                                        <template v-if="p.priceFlag==1">
+                                            <em >￥价格未公开</em>
+                                             <div class="btnBox " >
+                                                <a href="javascript:0" class="pricebox">价格未公开，请联系 0755-22907771</a>
+                                            </div>
+                                        </template>
                                         <template v-else>
-                                            <em v-if="!p.priceLoaded">正在获取价格...</em>
-                                            <template v-else-if="p.priceFlag==2 && p.userIdentity!=2">
-                                                <em>价格仅会员可见</em>
+<!--                                            <em v-if="!p.priceLoaded">正在获取价格...</em>-->
+                                            <template v-if="p.priceFlag==2 && p.userIdentity!=2">
+                                                <em>￥会员可见</em>
                                                 <div class="btnBox">
-                                                    <a href="javascript:void(0)" class="btn">升级成为会员</a>
+                                                    <a href="javascript:void(0)" class="pricebox" @click="upgrade">升级成为会员</a>
                                                 </div>
                                             </template>
                                             <em v-else class="p" v-text="'￥'+parseFloat(p.price).toFixed(2)"></em>
+                                            <a href="javascript:void(0);" class="login-btn" v-if="p.actStatus==1">{{p.promotions.name}}</a>
+                                            <template  v-else-if="p.userIdentity==3">
+                                                <em class="p" v-if="p.supplierId==shopID" v-text="'￥'+parseFloat(p.price).toFixed(2)"></em>
+                                                <em v-else>
+                                                    <span class="moneyicon">￥</span>
+                                                    <i class="icon mIcon">
+                                                        <i v-if="p.priceGrade==1" class="icon mIcon one"></i>
+                                                        <i v-if="p.priceGrade==2" class="icon mIcon two"></i>
+                                                        <i v-if="p.priceGrade==3" class="icon mIcon three"></i>
+                                                        <i v-if="p.priceGrade==4" class="icon mIcon four"></i>
+                                                        <i v-if="p.priceGrade==5" class="icon mIcon five"></i>
+                                                    </i>
+                                                 </em>
+                                            </template>
                                         </template>
+
                                     </template>
                                     <template v-else>
-                                        <em>价格：<i class="icon mIcon" v-for="i in 5">
-                                                <i v-if="i==1||p.priceGrade>=i" class="icon mIcon on"></i>
-                                        </i></em>
-                                        <div class="btnBox"><a href="javascript:void(0)" class="btn add toLogin">加入购物车</a></div>
+                                       <em >
+                                             <span class="moneyicon">￥</span>
+                                             <i class="icon mIcon">
+                                                <i v-if="p.priceGrade==1" class="icon mIcon one"></i>
+                                                <i v-if="p.priceGrade==2" class="icon mIcon two"></i>
+                                                <i v-if="p.priceGrade==3" class="icon mIcon three"></i>
+                                                <i v-if="p.priceGrade==4" class="icon mIcon four"></i>
+                                                <i v-if="p.priceGrade==5" class="icon mIcon five"></i>
+                                             </i>
+                                        </em>
+                                        <a href="javascript:void(0);" class="login-btn" v-if="p.actStatus==1">{{p.promotions.name}}</a>
+                                        <div class="btnBox">
+                                            <a href="/login.html" class="pricebox" @click="toLogin">登录查看价格</a>
+                                        </div>
                                     </template>
                                 </div>
                             </div>

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

@@ -48,21 +48,196 @@
                     <span th:each="tag: *{tagList}" th:text="${tag}"></span>
                 </p>
                 <div class="detail">
-                    <p class="row"><span class="l">价格</span><i>：</i>
+                    <p class="row"><span class="l">采美价</span><i>：</i>
                     <template v-if="userId && userId>0">
-                        <em v-if="priceFlag==1">未公开价格</em>
-                        <template v-else>
+                       <em v-if="priceFlag==1" class="pricedeail">￥价格未公开</em>
+                       <template v-else>
                             <template v-if="priceFlag==2 && userIdentity!=2">
-                                <em>价格仅会员可见</em>
-                                <a v-if="priceFlag==2 && userIdentity!=2" href="javascript:void(0)" class="btn">去升级会员查看价格</a>
+                                <em style="font-weight: bold" class="pricedeail">￥会员可见</em>
                             </template>
-                            <em v-else class="price" v-text="'￥'+parseFloat(price).toFixed(2)"></em>
+                            <em v-else class="price pricedeail" :class="promotions.type==1&&promotions.mode==1?'original-price':''">￥{{buyRetailPrice}}</em>
+                        </template>
+                    </template>
+                    <template v-else>
+                        <em class="price">
+                        <span class="priceicon">￥</span>
+                            <i class="icon mIcon">
+                                <i th:if="*{priceGrade}==1" class="icon mIcon one"></i>
+                                <i th:if="*{priceGrade}==2" class="icon mIcon two"></i>
+                                <i th:if="*{priceGrade}==3" class="icon mIcon three"></i>
+                                <i th:if="*{priceGrade}==4" class="icon mIcon four"></i>
+                                <i th:if="*{priceGrade}==5" class="icon mIcon five"></i>
+                            </i>
+                        </em>
+                    </template>
+                    </p>
+                    <template  v-if="priceFlag!=2  && userIdentity!=2 ">
+                        <p class="row"> <span class="l">市场价</span><i>：</i>
+                             <em class="pricedeail" :class="deailData.actStatus==1?'original-price':''">￥{{buyRetailPrice}}</em>
+                        </p>
+                    </template>
+                    <p class="row" style="position:relative;" v-if="deailData.actStatus==1||deailData.ladderPriceFlag==1" ><span class="l">促销</span><i>：</i>
+                      <span class="activity" @click="activity" :class="isShow?'activitystyle':''" v-if="deailData.ladderPriceFlag==1">阶梯价格<i class="icon" :class="isShow?'activeicon':''"></i> </span>
+                      <span class="activity" @click="activity" :class="isShow?'activitystyle':''" v-if="deailData.actStatus==1">{{promotions.name}}：{{promotions.touchPrice.toFixed(2)}}<i class="icon" :class="isShow?'activeicon':''"></i> </span>
+
+
+                    <template v-if="userId && userId>0">
+                        <!-- 已登录 会员可见   -->
+                        <template v-if="priceFlag==2 && userIdentity !=2">
+                            <div class="activityBox" v-show="isShow">
+                              <p>
+                                <a style="color: #E15616" href="javascript:0" @click="clubupgrade" class="loginWithParam">升级会员</a>，参与{{promotions.name}}促销活动
+                              </p>
+                              <button class="activeBtn" @click="activeBtn">了解</button>
+                         </div>
                         </template>
+                        <template v-else>
+                        <div class="activityBox" v-show="isShow" v-if="promotions.type==3&&promotions.mode==2">
+                            <!--  店铺满减-->
+                               <p class="Boxtext">
+                                  <a style="color: #E15616" href="javascript:0" class="loginWithParam">全店铺满减：满1000.00，减500.00</a>
+                                    </br>促销时间：不限时
+                                </p>
+                                <button class="activeBtn" @click="activeBtn" v-show="isShow">了解</button>
+                         </div>
+                         <div class="activityBox" v-show="isShow"  v-if="promotions.type==1&&promotions.mode==3">
+                               <!-- 店铺满赠 -->
+                                <p class="Boxtext">
+                                    <a style="color: #E15616" href="javascript:0" class="loginWithParam">全店铺，满1000.00，赠送商品：</a>
+                                    </br>促销时间：{{promotions.beginTime}}~{{promotions.endTime}}
+                                </p>
+                                   <div class="activepro" v-for="promotions in giftData">
+                                      <a :href="'/product/detail.shtml?id='+promotions.productId" target="_blank">
+                                           <div class="activeimg">
+                                               <img :src="promotions.image">
+                                           </div>
+                                           <div class="activeright">
+                                               <p>{{promotions.name}}</p>
+                                               <p>x1</p>
+                                           </div>
+                                       </a>
+                                   </div>
+                              <button class="activeBtn" @click="activeBtn" v-show="isShow">了解</button>
+                        </div>
+                         <div class="activityBox" v-show="isShow"  v-if="promotions.type==1&&promotions.mode==1">
+                           <!--单品优惠 -->
+                               <p class="Boxtext">
+                                  <a style="color: #E15616" href="javascript:0" class="loginWithParam">促销时间:{{promotions.beginTime}}~{{promotions.endTime}}</a>
+                               </p>
+                               <button class="activeBtn" @click="activeBtn" v-show="isShow">了解</button>
+                         </div>
+                          <div class="activityBox" v-show="isShow" v-if="promotions.type==1&&promotions.mode==2">
+                           <!--单品满减 -->
+                               <p class="Boxtext">
+                                  <a style="color: #E15616" href="javascript:0" class="loginWithParam">购买此商品，满1000.00，减500.00</a>
+                                </br>促销时间：不限时
+                               </p>
+                               <button class="activeBtn" @click="activeBtn" v-show="isShow">了解</button>
+                         </div>
+                          <div class="activityBox" v-show="isShow"  v-if="promotions.type==1&&promotions.mode==3">
+                               <!-- 单品满赠 -->
+                                <p class="Boxtext">
+                                    <a style="color: #E15616" href="javascript:0" class="loginWithParam">购买此商品，满1000.00，赠送商品：</a>
+                                    </br>促销时间：{{promotions.beginTime}}~{{promotions.endTime}}
+                                </p>
+                                   <div class="activepro" v-for="promotions in giftData">
+                                      <a :href="'/product/detail.shtml?id='+promotions.productId" target="_blank">
+                                           <div class="activeimg">
+                                               <img :src="promotions.image">
+                                           </div>
+                                           <div class="activeright">
+                                               <p>{{promotions.name}}</p>
+                                               <p>x1</p>
+                                           </div>
+                                       </a>
+                                   </div>
+                              <button class="activeBtn" @click="activeBtn" v-show="isShow">了解</button>
+                        </div>
+                        <!--阶梯价-->
+                        <div class="item-tips activityBox" v-show="isShow"  v-if="deailData.ladderPriceFlag==1">
+                           <div class="tips-content">
+                                 <div class="tip-tr">
+                                    <div class="tip-td">起订量</div>
+                                    <div class="tip-td">价格</div>
+                                 </div>
+                           <div class="tip-ul">
+                                 <ul class="tip-ul">
+                                    <li class="tip-tr ladderPriceList"  v-for="(item,index) in ladderList">
+                                        <div class="tip-td buyNumRangeShow">{{item.numRange}}</div>
+                                        <div class="tip-td buyPrice">￥{{item.buyPrice}}</div>
+                                    </li>
+                                 </ul>
+                           </div>
+                         </div>
+                          <button class="activeBtn" @click="activeBtn" v-show="isShow">了解</button>
+                       </div>
+                       <div class="activityBox" v-show="isShow"  v-if="promotions.type==2&&promotions.mode==2">
+                               <!-- 凑单满减 -->
+                                <p class="Boxtext">
+                                    <a style="color: #E15616" href="javascript:0" class="loginWithParam">购买下列商品，满1000.00，减500.00</a>
+                                    </br>促销时间：{{promotions.beginTime}}~{{promotions.endTime}}
+                                </p>
+<!--                                   <div class="activepro" v-for="promotions in giftData">-->
+<!--                                      <a :href="'/product/detail.shtml?id='+promotions.productId" target="_blank">-->
+<!--                                           <div class="activeimg">-->
+<!--                                               <img :src="promotions.image">-->
+<!--                                           </div>-->
+<!--                                           <div class="activeright">-->
+<!--                                               <p>{{promotions.name}}</p>-->
+<!--                                               <p>x1</p>-->
+<!--                                           </div>-->
+<!--                                       </a>-->
+<!--                                   </div>-->
+                              <button class="activeBtn" @click="activeBtn" v-show="isShow">了解</button>
+                        </div>
+                        <div class="activityBox" v-show="isShow"  v-if="promotions.type==2&&promotions.mode==3">
+                               <!-- 凑单满赠 -->
+                                <p class="Boxtext">
+                                    <a style="color: #E15616" href="javascript:0" class="loginWithParam">购买此商品，满1000.00</a>
+                                    </br>促销时间：{{promotions.beginTime}}~{{promotions.endTime}}
+                                </p>
+<!--                                   <div class="activepro" v-for="promotions in giftData">-->
+<!--                                      <a :href="'/product/detail.shtml?id='+promotions.productId" target="_blank">-->
+<!--                                           <div class="activeimg">-->
+<!--                                               <img :src="promotions.image">-->
+<!--                                           </div>-->
+<!--                                           <div class="activeright">-->
+<!--                                               <p>{{promotions.name}}</p>-->
+<!--                                               <p>x1</p>-->
+<!--                                           </div>-->
+<!--                                       </a>-->
+<!--                                   </div>-->
+                                 <p  href="javascript:0" class="loginWithParam">赠送商品：</p>
+                                   <div class="activepro" v-for="promotions in giftData">
+                                      <a :href="'/product/detail.shtml?id='+promotions.productId" target="_blank">
+                                           <div class="activeimg">
+                                               <img :src="promotions.image">
+                                           </div>
+                                           <div class="activeright">
+                                               <p>{{promotions.name}}</p>
+                                               <p>x1</p>
+                                           </div>
+                                       </a>
+                                   </div>
+                              <button class="activeBtn" @click="activeBtn" v-show="isShow">了解</button>
+                        </div>
+
+                       </template>
                     </template>
                     <template v-else>
-                        <em class="price"><i class="icon mIcon" th:each="i:${#numbers.sequence(1,5)}">
-                                <i th:if="*{priceGrade}>=${i} or ${i}==1" class="icon mIcon on"></i>
-                        </i></em>
+                        <!--   未登录      -->
+                        <div class="activityBox" v-show="isShow" v-if="deailData.ladderPriceFlag==1">
+                              <p>
+                                <a style="color: #E15616" href="javascript:0" @click="toLogin">登录</a>，享受阶梯价格优惠
+                              </p>
+                              <button class="activeBtn" @click="activeBtn">了解</button>
+                         </div>
+                        <div class="activityBox" v-show="isShow" v-else>
+                              <p>
+                                <a style="color: #E15616" href="javascript:0" @click="toLogin">登录</a>，参与{{promotions.name}}促销活动
+                              </p>
+                              <button class="activeBtn" @click="activeBtn">了解</button>
+                         </div>
                     </template>
                     </p>
                     <p class="row"><span class="l">品牌</span><i>：</i><em th:text="*{brandName}"></em></p>
@@ -70,30 +245,32 @@
                     <p class="row"><span class="l">商品编码</span><i>：</i><em th:text="*{productCode}"></em></p>
                     <p class="row"><span class="l">库存</span><i>：</i><em th:text="*{stock}"></em></p>
                     <p class="row"><span class="l">起批量</span><i>：</i><em th:text="*{minBuyNumber}"></em></p>
-                    <p class="row"><span class="l">采购量</span><i>：</i>
+                    <p class="row" v-if="priceFlag== 0 && userIdentity !=2"><span class="l" >采购量</span><i>：</i>
                         <span class="number">
-                            <em class="sub">-</em>
-                            <input type="number" th:value="*{minBuyNumber}">
-                            <em class="add">+</em>
+                            <em class="sub" @click="changeCountSub" :class="[isQuantity==true?'disabled':'']">-</em>
+                            <input type="number" v-model="number" maxlength='6' @blur="changeNumber($event)" >
+                            <em class="add" @click="changeCountAdd" :class="[isStock==true?'disabled':'']">+</em>
                         </span>
                         <input type="hidden" th:value="*{step}">
                     </p>
                     <hr>
                     <p class="row"><span class="l">服务</span><i>：</i>
-                        <em class="ser">无忧退货</em>
-                        <em class="ser">急速退款</em>
-                        <em class="ser">正品保证</em>
+                           <img src="/img/base/fuwu.png" alt="selected"><span class="fuwu">无忧退货</span>
+                           <img src="/img/base/fuwu.png" alt="selected"><span class="fuwu">快速退款</span>
+                           <img src="/img/base/fuwu.png" alt="selected"><span class="fuwu">正品保证</span>
                     </p>
-                    <a href="javascript:void(0);" class="btn">登录查看价格</a>
                     <span class="icon mIcon flag"></span>
                 </div>
-                <div class="btnBox">
-                    <a href="javascript:void(0);" class="cart icon">加入购物车</a>
-                    <a href="javascript:void(0);" class="buy">立即购买</a>
-                </div>
-                <div class="concatBox">
-                    <img src="/img/common/concat.png">
-                </div>
+               <template v-if="userId && userId>0">
+                <a v-if="priceFlag==2 && userIdentity!=2" class="upgrade" @click="clubupgrade" href="javascript:0">升级会员查看价格</a>
+                    <div class="btnBox" v-if="priceFlag==0">
+                        <a href="javascript:void(0);" class="cart icon" @click='addShopCart'>加入购物车</a>
+                        <a href="javascript:void(0);" class="buy" @click="buyShopCart">立即购买</a>
+                    </div>
+                </template>
+                <template v-else>
+                    <a href="javascript:void(0);" class="member-detail " @click="toLogin">登录查看价格</a>
+                </template>
             </div>
         </div>
 
@@ -109,6 +286,13 @@
                             </a>
                         </div>
                     </li>
+                    <li class="swiper-slide  defaulImg" v-for="(item,index) in recommdeindex">
+                       <div class="item">
+                            <a href="javascript:0" class="image">
+                                <img src="/img/base/placeholder.png" alt="">
+                            </a>
+                     </div>
+                </li>
                 </ul>
                 <div v-show="recommendPage>1" class="swiper-pagination mfc"><span v-if="isPC" v-for="i in recommendPage"></span></div>
             </div>

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

@@ -110,23 +110,53 @@
                     </a>
                     <div class="price mfhc">
                         <template v-if="userId && userId>0">
-                            <em v-if="p.priceFlag==1">未公开价格</em>
+                            <template v-if="p.priceFlag==1">
+                                <em >￥价格未公开</em>
+                                 <div class="btnBox " >
+                                    <a href="javascript:0" class="pricebox">价格未公开，请联系 0755-22907771</a>
+                                </div>
+                            </template>
                             <template v-else>
                                 <em v-if="!p.priceLoaded">正在获取价格...</em>
-                                <template v-else-if="p.priceFlag==2 && p.userIdentity!=2">
-                                    <em>价格仅会员可见</em>
+                                <template v-else-if="p.priceFlag ==2 && p.userIdentity!=2">
+                                    <em>￥会员可见</em>
                                     <div class="btnBox">
-                                        <a href="javascript:void(0)" class="btn">升级成为会员</a>
+                                        <a href="javascript:void(0)" class="pricebox" @click="upgrade">升级成为会员</a>
                                     </div>
                                 </template>
                                 <em v-else class="p" v-text="'￥'+parseFloat(p.price).toFixed(2)"></em>
+                                <a href="javascript:void(0);" class="login-btn" v-if="p.actStatus==1">{{p.promotions.name}}</a>
+                                <a href="javascript:void(0);" class="login-btn" v-else-if="p.ladderPriceFlag==1">阶梯价格</a>
+                                 <template  v-else-if="p.userIdentity==3">
+                                    <em class="p" v-if="p.supplierId==shopID" v-text="'￥'+parseFloat(p.price).toFixed(2)"></em>
+                                    <em v-else>
+                                        <span class="moneyicon">￥</span>
+                                        <i class="icon mIcon">
+                                            <i v-if="p.priceGrade==1" class="icon mIcon one"></i>
+                                            <i v-if="p.priceGrade==2" class="icon mIcon two"></i>
+                                            <i v-if="p.priceGrade==3" class="icon mIcon three"></i>
+                                            <i v-if="p.priceGrade==4" class="icon mIcon four"></i>
+                                            <i v-if="p.priceGrade==5" class="icon mIcon five"></i>
+                                        </i>
+                                     </em>
+                                </template>
                             </template>
                         </template>
                         <template v-else>
-                            <em>价格：<i class="icon mIcon" v-for="i in 5">
-                                    <i v-if="i==1||p.priceGrade>=i" class="icon mIcon on"></i>
-                            </i></em>
-                            <div class="btnBox"><a href="javascript:void(0)" class="btn add toLogin">加入购物车</a></div>
+                            <em>
+                                <span class="moneyicon">￥</span>
+                            <i class="icon mIcon">
+                                <i v-if="p.priceGrade==1" class="icon mIcon one"></i>
+                                <i v-if="p.priceGrade==2" class="icon mIcon two"></i>
+                                <i v-if="p.priceGrade==3" class="icon mIcon three"></i>
+                                <i v-if="p.priceGrade==4" class="icon mIcon four"></i>
+                                <i v-if="p.priceGrade==5" class="icon mIcon five"></i>
+                            </i>
+                            </em>
+                             <a href="javascript:void(0);" class="login-btn" v-if="p.actStatus==1">{{p.promotions.name}}</a>
+                            <div class="btnBox">
+                                <a href="/login.jsp" class="pricebox">登录查看价格</a>
+                            </div>
                         </template>
                     </div>
                 </div>