Merge remote-tracking branch 'origin/developerB' into developerB

# Conflicts:
#	src/main/resources/config/dev/application-dev.yml

src/main/java/com/caimei/www/controller/unlimited/ProductController.java

@@ -27,6 +27,7 @@ public class ProductController extends BaseController {
 
     private static final String PRODUCT_LIST_PATH = "product/list";
     private static final String PRODUCT_DETAIL_PATH = "product/detail";
+    private static final String PRODUCT_SUPPORTING_PATH = "product/product-supporting";
     private static final String PROMOTIONS_LIST_PATH = "product/promotions";
     private static final String INSTRUMENT_PAGE_PATH = "product/instrument";
     private static final String TEMPORARY_PAGE_PATH = "product/temporary";
@@ -325,4 +326,11 @@ public class ProductController extends BaseController {
     public String getCouponExpPath(){
         return ACTIVITY_COUPON_EXP;
     }
+    /**
+     * H5配套商品页
+     */
+    @GetMapping("/product/product-supporting.html")
+    public String getProductSupporting(){
+        return PRODUCT_SUPPORTING_PATH;
+    }
 }

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

@@ -63,7 +63,15 @@ li{list-style:none}
 .productBox .detailBox .concatBox{height:20vw;padding-bottom:4vw}
 .productBox .detailBox .concatBox img{height:20vw;width:auto}
 .productBox .detailBox .upgrade{width:100%;background:#F94B4B;border-radius:2px;display:inline-block;text-align:center;height:11.2vw;line-height:11.2vw;font-size:3.4vw;color:#FFF;margin:1.7vw 0}
-
+/*配套商品*/
+.product-supporting{width: 100%;height: 44vw;box-sizing: border-box;padding: 3.3vw;background-color: #FFFFFF;margin: 1.3vw 0;}
+.product-supporting-title{width: 100%;height: 6.2vw;line-height: 6.2vw;font-size: 3.6vw;color: #333333;text-align: left;font-weight: bold;}
+.product-supporting-content{width: 100%;height: 24.2vw;margin-top: 3vw;position: relative;}
+.product-supporting-content .product-supporting-list{width:24.2vw;height: 24.2vw;float: left;box-sizing: border-box;border: 1px solid #E2E7EF;margin-right: 2.4vw;border-radius: 2px;}
+.product-supporting-content .product-supporting-list img{width:100%;height: 100%;display: block;border-radius: 2px;}
+.product-supporting-more{width: 14vw;height: 100%;position: absolute;right: 0;top: 0;padding-left: 7.5vw;box-sizing: border-box;display: flex;align-items: center;}
+.product-supporting-more .mIcon{width: 6.5vw;height: 6.5vw;}
+.product-supporting-more .mIcon::before{width: 6.5vw;height: 6.5vw;background: url("/img/base/icon-xiayibu@2x.png");background-size: cover;}
 .recommendBox{margin-top:2vw;width:100%;background:#FFF}
 .recommendBox .hd{font-size:3.4vw;color:#E15621;font-weight:bold;padding:2.7vw;text-align:center}
 #productRecommend{width:100%;height:50vw;overflow:hidden;position:relative;box-sizing:border-box;padding:0 2.4vw}

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

@@ -77,7 +77,56 @@ li{list-style:none;}
 .productBox .detailBox .concatBox{height:120px;padding:15px}
 .productBox .detailBox .concatBox img{height:120px;width:auto}
 .productBox .detailBox .upgrade{background:#F94B4B;border-radius:2px;display:inline-block;text-align:center;color:#FFFFFF;height:40px;line-height:40px;padding:0 30px;font-size:16px}
-
+/*配套商品*/
+.product-supporting{width: 100%;min-height: 200px;background-color: #FFFFFF;box-sizing: border-box;padding: 16px;margin-bottom: 16px;}
+.product-supporting-title{width: 100%;height: 30px;line-height: 30px;text-align: left;font-size: 16px;color: #333333;font-weight: bold;}
+.product-supporting-content{width: 100%;height: auto;}
+.product-supporting-td{width: 100%;height: 38px;line-height: 38px;}
+.product-supporting-td p{font-size: 14px;color: #627386;float: left;text-align: center;}
+.product-supporting-td p.td-1{width: 10%;text-align: left;}
+.product-supporting-td p.td-2{width: 25%;text-align: center;}
+.product-supporting-td p.td-3{width: 15%;}
+.product-supporting-td p.td-4{width: 15%;}
+.product-supporting-td p.td-5{width: 20%;}
+.product-supporting-td p.td-6{width: 15%;}
+.product-supporting-list{width: 100%;height: 102px;box-sizing: border-box;padding: 16px;}
+.product-supporting-list .tr{font-size: 14px;color: #627386;float: left;text-align: center;}
+.product-supporting-list .tr-1{width:10%;}
+.product-supporting-list .tr-1 img{width: 70px;height: 70px;display: block;box-sizing: border-box;border: 1px solid #E2E7EF;border-radius: 2px;}
+.product-supporting-list .tr-2{width:25%;height: 100%;box-sizing: border-box;padding: 16px 0;}
+.product-supporting-list .tr-2 p{text-align: justify;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;word-break: break-all;}
+.product-supporting-list .tr-3{width:15%;line-height: 70px}
+.product-supporting-list .tr-4{width:15%;box-sizing: border-box;padding: 16px 0 0 44px;text-align: left;}
+.product-supporting-list .tr-4 .price .icon:before{width:63px;height: 22px;}
+.product-supporting-list .tr-4 .price .icon.i5:before{background-position:-2px -835px}
+.product-supporting-list .tr-4 .price .icon.i1:before{background-position:-2px -715px}
+.product-supporting-list .tr-4 .price .icon.i2:before{background-position:-2px -745px}
+.product-supporting-list .tr-4 .price .icon.i3:before{background-position:-2px -775px}
+.product-supporting-list .tr-4 .price .icon.i4:before{background-position:-2px -805px}
+.product-supporting-list .tr-4 .price .price_text_tag .svip-tag,
+.product-supporting-list .tr-4 .price .price_text_tag .listTag{-webkit-transform: translateX(4px);-ms-transform: translateX(4px);transform: translateX(4px)}
+.product-supporting-list .tr-4 .price .svip-tag{width:100%;height:22px;letter-spacing:0}
+.product-supporting-list .tr-4 .price .couponTag{margin: 0 4px 0 0;float: left;}
+.product-supporting-list .tr-4 .price .svip-tag .svip-icon{position:relative;z-index:9;display:inline-block;width:30px;height:22px;text-align:center;line-height:22px;font-size:12px;font-weight:400;color:#F0CB72;opacity:1;background:#333333}
+.product-supporting-list .tr-4 .price .svip-tag .svip-icon.btr{border-radius:2px 8px 0px 2px}
+.product-supporting-list .tr-4 .price .svip-tag .svip-price{z-index:1;position:relative;display:inline-block;padding-left:24px;padding-right:2px;margin-left:-27px;line-height:22px;background:#F0CB72;opacity:1;border-radius:2px;font-size:12px}
+.product-supporting-list .tr-4 .price .svip-tag .svip-price span{color: #333}
+.product-supporting-list .tr-5{width:20%;box-sizing: border-box;padding: 16px 0;}
+.product-supporting-list .tr-5 .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}
+.product-supporting-list .tr-5 .number>em{display:inline-block;width:24px;height:22px;background:#FFE6DC;font-size:20px;font-style:normal;line-height:20px;vertical-align:top;cursor:pointer}
+.product-supporting-list .tr-5 .number input{width:48px;border:none;line-height:22px;font-size:14px;vertical-align:top;text-align:center;color:#E15616}
+.product-supporting-list .tr-6{width:15%;box-sizing: border-box;padding: 16px 0;padding-left: 30px;}
+.product-supporting-more{width: 100%;height: 32px;}
+.product-supporting-more .more{width: 98px;height: 32px;line-height: 32px;font-size: 14px;margin: 0 auto;border-radius: 2px;border: 1px solid #cccccc;color: #909090;text-align: left;transition: all 0.2s;cursor: pointer;padding-left: 15px;box-sizing: border-box;position: relative;}
+.product-supporting-more .more .icon:before{background-position: -93px 7px;width: 20px;height: 32px;right: 0;position: absolute;}
+.product-supporting-button{width: 100%;height: auto;}
+.product-supporting-button .product-supporting-total{width: 100%;height: 44px;text-align: right;line-height: 44px;font-size: 16px;color: #22272E;}
+.product-supporting-button .product-supporting-total .ore{color: #E15621;}
+.product-supporting-button .product-supporting-total .red{color: #F94B4B;}
+.product-supporting-button .product-supporting-btn{width: 100%;height: 36px;text-align: right;}
+.product-supporting-button .product-supporting-btn .btn{width: 128px;height: 36px;text-align: center;border: 1px solid #E15621;float: right;margin-left: 20px;line-height: 36px;font-size: 14px;}
+.product-supporting-button .product-supporting-btn .btn.add{background-color: #FFE6DC;color: #E15621;}
+.product-supporting-button .product-supporting-btn .btn.buy{background-color: #E15621;color: #FFFFFF;}
 .recommendBox{margin-bottom:16px;overflow: hidden;}
 .recommendBox .hd{font-size:16px;color:#4A4F58;font-weight:bold;padding:16px 15px}
 #productRecommend{padding:16px 5px;background: #fff}

src/main/resources/static/css/product/instruement-list.css

@@ -1,9 +1,24 @@
 .productItem .price .price_text_tag{-webkit-transform: scale(0.8) translateX(-20px);-ms-transform: scale(0.8) translateX(-20px);transform: scale(0.8) translateX(-20px)}
 
 @media screen and (min-width:768px){
-    #productList{width: 1184px;margin:32px auto}
+    #productList{width: 1184px;margin:32px auto;position: relative;}
     .crumbs-nav{height: 40px}
     .crumbs-nav .crumbs-link{color:#4a4f58 }
+    .product-brand{width:1184px;box-sizing:border-box;min-height: 88px;padding:24px 12px 12px 12px;font-size:0;text-align:center;background:#FFF;position: relative;}
+    .product-brand .product-brand-name{width: 116px;float: left;border-right: 1px solid #F7F7F7;line-height: 44px;text-align: center;font-size: 16px;color: #4A4F58;}
+    .product-brand .product-brand-name.show{line-height: 88px;}
+    .product-brand-more{width: 50px;height: 32px;line-height: 32px;font-size: 14px;margin: 0 auto;color: #909090;text-align: left;transition: all 0.2s;cursor: pointer;box-sizing: border-box;position: absolute;right: 24px;top: 24px;}
+    .product-brand-more .icon:before{background-position: -93px 7px;width: 20px;height: 32px;right: 0;position: absolute;}
+    .product-brand-list{width: 970px;float: left;box-sizing: border-box;padding:0 24px;height: 44px;overflow: scroll;overflow-x: hidden;overflow-y:auto;}
+    .product-brand-list.show{height: 88px;}
+    .product-brand-list .brand-list{width: 90px;height: 32px;padding: 0 12px;border: 1px solid #E2E7EF;float: left;box-sizing: border-box;line-height: 32px;font-size: 16px;color: #4A4F58;border-radius: 2px;margin-right: 24px;margin-bottom: 12px;}
+    .product-brand-list .brand-list.checked{border-color: #E15621;}
+    .product-brand-list .brand-list.checked a{color: #E15621;}
+    .product-brand-list .brand-list a{width: 100%;height: 100%;display: block;text-align: center;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 1;line-clamp: 1;-webkit-box-orient: vertical;word-break: break-all;}
+    .product-brand-list .brand-list a:hover{color: #4A4F58;}
+    .product-brand-list .brand-list.checked a:hover{color: #E15621;}
+    .sortBox{width:1184px;margin:16px auto;box-sizing:border-box;text-align:center;background:#FFFFFF;position: relative;}
+    .sortBox li{float: left;}
     .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:27px}
     .sortBox li:after{border-width:5px 5px 0 5px;border-color:#BEC2C9 transparent transparent transparent;top:34px}
@@ -12,6 +27,11 @@
     .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}
+    .sortBox .sortBox-checked{width: 200px;height: 64px;position: absolute;top: 0;right: 0;box-sizing: border-box;padding: 18px;}
+    .sortBox-checked .sortBox-new{float: right;height: 28px;line-height: 16px;box-sizing: border-box;padding: 6px 0;display: flex;cursor: pointer;margin-right: 10px;}
+    .sortBox-checked .coll-checked{width: 16px;height: 16px;background: url("/img/cart/icon_weigouxuan@2x.png") no-repeat;background-size: cover;display: block;margin-right: 6px;}
+    .sortBox-checked .coll-checked.checked{background: url("/img/cart/icon_yixuanze@2x.png") no-repeat;background-size: cover;}
+
     .classification .class-nav-main div,.classification .class-nav-main li{text-align:center;display:inline-block;line-height:64px;color:#4a4f58;font-size:16px;cursor:pointer;padding:0 16px}
     #listClassify{margin:0 auto;-webkit-box-sizing:border-box;box-sizing:border-box;background:rgba(255,255,255,1);border-radius:0 0 2px 2px}
     .classification{border-bottom:1px solid #f7f7f7;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-flex}
@@ -63,10 +83,11 @@
 
 
 @media screen and (max-width:768px){
+    #productList{position: relative;}
     .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,.sortBox li:after{position:absolute;right:0;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}
@@ -74,6 +95,10 @@
     .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}
+    .sortBox li.screen:before{border-width:0 0 0 0;border-color:transparent transparent transparent transparent;top:5vw;}
+    .sortBox li.screen:after{border-width:0 0 0 0;border-color:transparent transparent transparent transparent;top:5vw}
+    .sortBox li.screen .mIcon{width: 4vw;height: 4vw;display: block;position: absolute;top: 0.8vw;right: -2vw;}
+    .sortBox li.screen .mIcon:before{width: 4vw;height: 4vw;background-position: -70vw -78vw;}
     .list-container ul{margin: 3.2vw auto;width: 97vw;}
     .list-container ul li{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;}
@@ -104,5 +129,31 @@
     .productItem .price .price_text_tag .svip-tag .svip-price{z-index:1;position:relative;float: left;padding-left:5.4vw;padding-right:0.6vw;margin-left:-6vw;line-height:4.74vw;height: 4.74vw; background:#F0CB72;opacity:1;border-radius:2px;font-size:2.8vw}
     .productItem .price .price_text_tag .svip-tag .svip-price span{color: #333}
     .productItem .price .price_text_tag .svip-tag .svip-price span:nth-child(2){margin-left: -0.4vw}
+    /*筛选项*/
+    .product-brand-fiexd{width: 100%;height: 100%;position: fixed;top: 15vw;left: 0;background: rgba(0,0,0,0.6);z-index: 9999;}
+    .product-brand{width: 100%;position: relative;top: 0;left: 0;background: #FFFFFF;z-index: 9999;padding: 3vw 0;border-radius: 0 0 1.6vw 1.6vw;box-sizing: border-box;}
+    .product-brand .product-brand-name{width: 100%;float: left;line-height: 10.4vw;background: #F7F7F7;height: 10.4vw;padding:0 3vw;box-sizing: border-box;}
+    .product-brand .product-brand-name .title{float: left;}
+    .product-brand .product-brand-name .num{float: right;font-size: 3vw;}
+    .product-brand .product-brand-name .num span{color: #E15621;}
+    .product-brand-more{width: 100%;height: 32px;line-height: 32px;font-size: 3.4vw;float: left;color: #909090;text-align: center;box-sizing: border-box;}
+    .product-brand-more .icon:before{background-position: -51.5vw 0px;width: 5.4vw;height: 6.7vw;right: 37vw;position: absolute;}
+    .product-brand-more.show .icon:before{background-position: -43.5vw 0px;width: 5.4vw;height: 6.7vw;right: 37vw;position: absolute;}
+    .product-brand-list{width: 100%;float: left;box-sizing: border-box;padding:3vw;height:22vw;overflow: scroll;overflow-x: hidden;overflow-y:auto;}
+    .product-brand-list.show{height: 44vw;}
+    .product-brand-list .brand-list{width: 20.5vw;height: 7.2vw;padding: 0 2.4vw;border: 1px solid #E2E7EF;float: left;box-sizing: border-box;line-height: 7.2vw;;font-size: 3vw;color: #4A4F58;border-radius: 1vw;margin-right: 3.2vw;margin-bottom: 2.4vw;}
+    .product-brand-list .brand-list:nth-child(4n){margin-right: 0;}
+    .product-brand-list .brand-list.checked{border-color: #E15621;}
+    .product-brand-list .brand-list.checked a{color: #E15621;}
+    .product-brand-list .brand-list a{width: 100%;height: 100%;display: block;text-align: center;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 1;line-clamp: 1;-webkit-box-orient: vertical;word-break: break-all;}
+    .product-brand-list .brand-list a:hover{color: #4A4F58;}
+    .product-brand-list .brand-list.checked a:hover{color: #E15621;}
+    .product-screen{width: 100%;height: auto;padding:0 3vw;box-sizing: border-box;}
+    .product-screen .sortBox-new{width: 100%;height: 9vw;line-height: 16px;box-sizing: border-box;padding: 2.5vw 0;cursor: pointer;margin-right: 10px;}
+    .product-screen .coll-checked{width: 16px;height: 16px;background: url("/img/cart/icon_weigouxuan@2x.png") no-repeat;background-size: cover;display: block;float: right;}
+    .product-screen .coll-checked.checked{background: url("/img/cart/icon_yixuanze@2x.png") no-repeat;background-size: cover;}
+    .product-screen-btn{width: 100%;height: 11.2vw;float: left;margin-top: 4vw;}
+    .product-screen-btn .sub-button{width: 64vw;height: 11.2vw;margin: 0 auto;line-height: 11.2vw;background-color: #E15621;text-align: center;font-size: 3.4ve;color: #FFFFFF;}
+
 }
 

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

@@ -4,17 +4,35 @@ 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}
+    .product-brand{width:1184px;margin:16px auto;box-sizing:border-box;min-height: 88px;padding:24px 12px 12px 12px;font-size:0;text-align:center;background:#FFF;position: relative;}
+    .product-brand .product-brand-name{width: 116px;float: left;border-right: 1px solid #F7F7F7;line-height: 44px;text-align: center;font-size: 16px;color: #4A4F58;}
+    .product-brand .product-brand-name.show{line-height: 88px;}
+    .product-brand-more{width: 50px;height: 32px;line-height: 32px;font-size: 14px;margin: 0 auto;color: #909090;text-align: left;transition: all 0.2s;cursor: pointer;box-sizing: border-box;position: absolute;right: 24px;top: 24px;}
+    .product-brand-more .icon:before{background-position: -93px 7px;width: 20px;height: 32px;right: 0;position: absolute;}
+    .product-brand-list{width: 970px;float: left;box-sizing: border-box;padding:0 24px;height: 44px;overflow: scroll;overflow-x: hidden;overflow-y:auto;}
+    .product-brand-list.show{height: 88px;}
+    .product-brand-list .brand-list{width: 90px;height: 32px;padding: 0 12px;border: 1px solid #E2E7EF;float: left;box-sizing: border-box;line-height: 32px;font-size: 16px;color: #4A4F58;border-radius: 2px;margin-right: 24px;margin-bottom: 12px;}
+    .product-brand-list .brand-list.checked{border-color: #E15621;}
+    .product-brand-list .brand-list.checked a{color: #E15621;}
+    .product-brand-list .brand-list a{width: 100%;height: 100%;display: block;text-align: center;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 1;line-clamp: 1;-webkit-box-orient: vertical;word-break: break-all;}
+    .product-brand-list .brand-list a:hover{color: #4A4F58;}
+    .product-brand-list .brand-list.checked a:hover{color: #E15621;}
+    .sortBox{width:1184px;margin:16px auto;box-sizing:border-box;text-align:center;background:#FFFFFF;position: relative;}
+    .sortBox li{display:inline-block;cursor:pointer;width:128px;height:64px;line-height:64px;font-size:16px;background:#FFFFFF;color:#93979F;position:relative;float: left;border-right: 1px solid #F7F7F7;}
     .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:before{border-width:0 5px 5px 5px;border-color:transparent transparent #BEC2C9 transparent;top:26px}
+    .sortBox li:after{border-width:5px 5px 0 5px;border-color:#BEC2C9 transparent transparent transparent;top:34px}
     .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}
+    .sortBox .sortBox-checked{width: 200px;height: 64px;position: absolute;top: 0;right: 0;box-sizing: border-box;padding: 18px;}
+    .sortBox-checked .sortBox-new{float: right;height: 28px;line-height: 16px;box-sizing: border-box;padding: 6px 0;display: flex;cursor: pointer;margin-right: 10px;}
+    .sortBox-checked .coll-checked{width: 16px;height: 16px;background: url("/img/cart/icon_weigouxuan@2x.png") no-repeat;background-size: cover;display: block;margin-right: 6px;}
+    .sortBox-checked .coll-checked.checked{background: url("/img/cart/icon_yixuanze@2x.png") no-repeat;background-size: cover;}
+
     .productList{width:1184px;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:nth-child(6n){margin-right:0}
@@ -63,11 +81,12 @@ li{list-style:none}
 * 移动端
 */
 @media screen and (max-width:768px){
+    #productList{position: relative;}
     /*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,.sortBox li:after{position:absolute;right:0vw;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}
@@ -75,6 +94,10 @@ li{list-style:none}
     .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}
+    .sortBox li.screen:before{border-width:0 0 0 0;border-color:transparent transparent transparent transparent;top:5vw;}
+    .sortBox li.screen:after{border-width:0 0 0 0;border-color:transparent transparent transparent transparent;top:5vw}
+    .sortBox li.screen .mIcon{width: 4vw;height: 4vw;display: block;position: absolute;top: 0.8vw;right: -2vw;}
+    .sortBox li.screen .mIcon:before{width: 4vw;height: 4vw;background-position: -70vw -78vw;}
     .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;}
@@ -112,6 +135,31 @@ li{list-style:none}
     .productItem .price .svip-tag .svip-price{z-index:1;position:relative;float: left;padding-left:5.4vw;padding-right:0.6vw;margin-left:-6vw;line-height:4.74vw;height: 4.74vw; background:#F0CB72;opacity:1;border-radius:2px;font-size:2.8vw}
     .productItem .price .svip-tag .svip-price span{color: #333}
     .productItem .price .svip-tag .svip-price span:nth-child(2){margin-left: -0.4vw}
+    /*筛选项*/
+    .product-brand-fiexd{width: 100%;height: 100%;position: fixed;top: 15vw;left: 0;background: rgba(0,0,0,0.6);z-index: 9999;}
+    .product-brand{width: 100%;position: relative;top: 0;left: 0;background: #FFFFFF;z-index: 9999;padding: 3vw 0;border-radius: 0 0 1.6vw 1.6vw;box-sizing: border-box;}
+    .product-brand .product-brand-name{width: 100%;float: left;line-height: 10.4vw;background: #F7F7F7;height: 10.4vw;padding:0 3vw;box-sizing: border-box;}
+    .product-brand .product-brand-name .title{float: left;}
+    .product-brand .product-brand-name .num{float: right;font-size: 3vw;}
+    .product-brand .product-brand-name .num span{color: #E15621;}
+    .product-brand-more{width: 100%;height: 32px;line-height: 32px;font-size: 3.4vw;float: left;color: #909090;text-align: center;box-sizing: border-box;}
+    .product-brand-more .icon:before{background-position: -51.5vw 0px;width: 5.4vw;height: 6.7vw;right: 37vw;position: absolute;}
+    .product-brand-more.show .icon:before{background-position: -43.5vw 0px;width: 5.4vw;height: 6.7vw;right: 37vw;position: absolute;}
+    .product-brand-list{width: 100%;float: left;box-sizing: border-box;padding:3vw;height:22vw;overflow: scroll;overflow-x: hidden;overflow-y:auto;}
+    .product-brand-list.show{height: 44vw;}
+    .product-brand-list .brand-list{width: 20.5vw;height: 7.2vw;padding: 0 2.4vw;border: 1px solid #E2E7EF;float: left;box-sizing: border-box;line-height: 7.2vw;;font-size: 3vw;color: #4A4F58;border-radius: 1vw;margin-right: 3.2vw;margin-bottom: 2.4vw;}
+    .product-brand-list .brand-list:nth-child(4n){margin-right: 0;}
+    .product-brand-list .brand-list.checked{border-color: #E15621;}
+    .product-brand-list .brand-list.checked a{color: #E15621;}
+    .product-brand-list .brand-list a{width: 100%;height: 100%;display: block;text-align: center;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 1;line-clamp: 1;-webkit-box-orient: vertical;word-break: break-all;}
+    .product-brand-list .brand-list a:hover{color: #4A4F58;}
+    .product-brand-list .brand-list.checked a:hover{color: #E15621;}
+    .product-screen{width: 100%;height: auto;padding:0 3vw;box-sizing: border-box;}
+    .product-screen .sortBox-new{width: 100%;height: 9vw;line-height: 16px;box-sizing: border-box;padding: 2.5vw 0;cursor: pointer;margin-right: 10px;}
+    .product-screen .coll-checked{width: 16px;height: 16px;background: url("/img/cart/icon_weigouxuan@2x.png") no-repeat;background-size: cover;display: block;float: right;}
+    .product-screen .coll-checked.checked{background: url("/img/cart/icon_yixuanze@2x.png") no-repeat;background-size: cover;}
+    .product-screen-btn{width: 100%;height: 11.2vw;float: left;margin-top: 4vw;}
+    .product-screen-btn .sub-button{width: 64vw;height: 11.2vw;margin: 0 auto;line-height: 11.2vw;background-color: #E15621;text-align: center;font-size: 3.4ve;color: #FFFFFF;}
 
 }
 

src/main/resources/static/css/product/product-supporting.h5.css

@@ -0,0 +1,54 @@
+@media screen and (max-width:768px) {
+    #supporting{width: 100%;}
+    .supporting-title{width:100%;height: 11.4vw;box-sizing: border-box;padding:3vw;background-color: #F7F7F7;box-sizing: border-box;}
+    .supporting-title .title{float: left;line-height: 5.4vw;font-size: 3.6vw;color: #2D3036;text-align: left;}
+    .supporting-title .coll-span{display: block;float: right;margin-left: 20px;height: 28px;line-height: 16px;box-sizing: border-box;padding: 6px 0;display: flex;cursor: pointer;}
+    .supporting-title .coll-checked{width: 16px;height: 16px;background: url("/img/cart/icon_weigouxuan@2x.png") no-repeat;background-size: cover;display: block;margin-right: 6px;}
+    .supporting-title .coll-checked.checked{background: url("/img/cart/icon_yixuanze@2x.png") no-repeat;background-size: cover;}
+    .supporting-content{width: 100%;min-height:50vw;background-color: #FFFFFF;padding-bottom: 27.7vw;}
+    .supporting-list{width: 100%;height: 38vw;box-sizing: border-box;border-bottom: 1px solid #E1E1E1;padding:3.2vw 4vw;}
+    .supporting-list .list-checked{width: 6.5vw;height: 100%;display: flex;align-items: center;float: left;}
+    .supporting-list .list-checked .coll-checked{width: 16px;height: 16px;background: url("/img/cart/icon_weigouxuan@2x.png") no-repeat;background-size: cover;display: block;margin-right: 6px;}
+    .supporting-list .list-checked .coll-checked.checked{background: url("/img/cart/icon_yixuanze@2x.png") no-repeat;background-size: cover;}
+    .supporting-list .list-image{width: 24vw;height: 100%;float: left;margin-right: 2vw;}
+    .supporting-list .list-image img{width: 24vw;height: 24vw;box-sizing: border-box;display: block;border: 1px solid #E1E1E1;border-radius: 2px;}
+    .supporting-list .list-info{width: 59vw;float: left;height: 100%;}
+    .supporting-list .list-info .list-name{width:100%;height: 10.5vw;text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;word-break: break-all;line-height: 5.2vw;text-align: justify;font-size: 3.6vw;color: #22272E;}
+    .supporting-list .list-info .list-unit{width: 100%;line-height: 5vw;height: 5vw;font-size: 2.8vw;color: #627386;}
+    .supporting-list .list-info .list-price{width: 100%;line-height: 5vw;height: 5vw;font-size: 2.8vw;margin-bottom: 1.5vw;}
+    .supporting-list .list-info .list-price .price-box{float: left;line-height: 5vw;}
+
+    .supporting-list .list-info .list-price .price-box .main_price_show{color: #F94B4B;font-size: 3.6vw;line-height: 5vw;}
+    .supporting-list .list-info .list-price .price-box .main_price_show.none{text-decoration: line-through;color: #999999;}
+    .supporting-list .list-info .list-price .price-number{float: right;width: 20.8vw;height: 5vw;box-sizing: border-box;}
+    .supporting-list .list-info .list-price .price-number .number{display: inline-block;width: 100%;line-height: 5.5vw;height: 5.5vw;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;}
+    .supporting-list .list-info .list-price .price-number .number>em{display: inline-block;width: 5vw;height: 5vw;background: #FFE6DC;font-size: 3.8vw;line-height: 5vw;vertical-align: top;font-style: normal;text-align: center;}
+    .supporting-list .list-info .list-price .price-number .number input{width: 10.2vw;border: none;line-height: 5vw;vertical-align: top;text-align: center;color: #E15616;font-size: 3.4vw;}
+
+    .supporting-list .list-info .list-price .price_grade{width: 100%;float: left;}
+    .supporting-list .list-info .list-price .price_grade .bold{font-size: 3.4vw;}
+    .supporting-list .list-info .list-price .mIcon:before{width:15.8vw;height: 5vw}
+    .supporting-list .list-info .list-price .mIcon.i5:before {background-position: -84vw -97.5vw;}
+    .supporting-list .list-info .list-price .mIcon.i1:before {background-position: -84vw -69.5vw;}
+    .supporting-list .list-info .list-price .mIcon.i2:before {background-position: -84vw -76.5vw;}
+    .supporting-list .list-info .list-price .mIcon.i3:before {background-position: -84vw -83.7vw;}
+    .supporting-list .list-info .list-price .mIcon.i4:before {background-position: -84vw -90.7vw;}
+    .supporting-list .list-info .list-price .mIcon {display: inline-block;font-size: 0;height: 5vw;line-height: 5vw;vertical-align: text-bottom;}
+
+    .supporting-list .list-info .svip-tag{float: left; height:4.74vw;letter-spacing:0;overflow: hidden}
+    .supporting-list .list-info .svip-tag .svip-icon{position:relative;z-index:9;float: left; width:7.8vw;height:4.74vw;text-align:center;line-height:4.74vw;font-size:2.6vw;font-weight:400;color:#F0CB72;opacity:1;background:#333333}
+    .supporting-list .list-info .svip-tag .svip-icon.btr{border-radius:2px 8px 0px 2px}
+    .supporting-list .list-info .svip-tag .svip-price{z-index:1;position:relative;float: left;padding-left:5.4vw;padding-right:0.6vw;margin-left:-5vw;line-height:4.74vw;height: 4.74vw; background:#F0CB72;opacity:1;border-radius:2px;font-size:2.8vw}
+    .supporting-list .list-info .svip-tag .svip-price span{color: #333}
+    .supporting-list .list-info .svip-tag .svip-price span:nth-child(2){margin-left: -0.4vw}
+
+    .supporting-submit{width: 100%;height: 26.7vw;box-sizing: border-box;padding:7.2vw 3.3vw;position:fixed;bottom: 0;left: 0;background-color: #FFFFFF;display: flex;box-shadow: 8px 8px 8px 8px rgb(0 0 0 / 7%);}
+    .supporting-submit .supporting-submit-total{flex: 4;}
+    .supporting-submit .supporting-submit-total p{line-height:5.6vw;font-size: 3.4vw;color: #4A4F58; }
+    .supporting-submit .supporting-submit-total p .ore{color: #E15621;}
+    .supporting-submit .supporting-submit-total p .red{color: #F94B4B;}
+    .supporting-submit .supporting-submit-button{flex: 6;display: flex;}
+    .supporting-submit .btn{width: 22.4vw;height: 11.2vw;flex: 1;line-height: 11.2vw;border: 1px solid #E15621;text-align: center;color: #FFFFFF;font-size: 3.4vw;margin: 0 2vw;border-radius: 2px;}
+    .supporting-submit .btn.buy{background-color: #E15621;}
+    .supporting-submit .btn.add{background-color: #FFE6DC;color: #E15621;}
+}

src/main/resources/static/css/shopping/shopping.css

@@ -237,6 +237,20 @@ li{list-style:none}
     .listWrap .cartItem .priceTag .svip-tag .svip-icon.btr{border-radius:2px 8px 0px 2px}
     .listWrap .cartItem .priceTag .svip-tag .svip-price{z-index:1;position:relative;display:inline-block;padding-left:24px;padding-right:2px;margin-left:-27px;line-height:22px;background:#F0CB72;opacity:1;border-radius:2px;font-size:14px}
     .listWrap .cartItem .priceTag .svip-tag .svip-price span{color: #333}
+    /*订单金额偏小弹窗提示*/
+    .confirm-Model{width: 100%;height: 100%;position: fixed;top: 0;left: 0;background: rgba(0,0,0,0.3);z-index: 9999;}
+    .confirm-Model .model-content{width: 389px;height: 342px;background: #FFFFFF;border-radius: 2px;position: absolute;top: 0;right: 0;left: 0;bottom: 0;margin: auto;z-index: 9998;}
+    .confirm-Model .model-content .title{width: 100%;height: 48px;box-sizing: border-box;font-size: 14px;line-height: 48px;text-align: left;color: #333333;float: left;position: relative;border-bottom: 1px solid #EFEFEF;background-color: #F8F8F8;padding: 0 14px;}
+    .confirm-Model .model-content .title .icon-close{width: 16px;height: 16px;display: block;position: absolute;right:12px;top: 12px;background: url("/img/base/icon.png")-319px 0 no-repeat;cursor: pointer;}
+    .confirm-Model .model-content .content{margin: 20px 0 0 0;width: 100%;height: auto;line-height: 24px;float: left;padding: 0 14px;box-sizing: border-box;}
+    .confirm-Model .model-content .content p{text-align: left;font-size: 14px;color: #666666;font-weight: normal;}
+    .confirm-Model .model-content .content p.small{font-size:12px;color: #E15621;}
+    .confirm-Model .model-content .content-image {width: 100%;height: 128px;float: left;margin: 12px 0;}
+    .confirm-Model .model-content .content-image img{width: 128px;height: 128px;display: block;margin: 0 auto;}
+    .confirm-Model .model-content .button{width: 100%;height: 32px;float: left;padding: 0 14px;box-sizing: border-box;}
+    .confirm-Model .model-content .button a{height: 32px;padding: 0 15px;display: block;margin-left: 10px;border-radius: 2px;font-size: 14px;text-align: center;line-height: 32px;color: #FFFFFF;float: right;box-sizing: border-box;border: 1px solid #FFFFFF;}
+    .confirm-Model .model-content .button a.cancel{background: #FFFFFF;border-color: #B8BFCA;color: #333333;}
+    .confirm-Model .model-content .button a.confirm{background: #E15616;}
 
 }
 
@@ -428,6 +442,20 @@ li{list-style:none}
     .coupon-popup .coupon-list-cell .coupon-tags{height: 4.8vw;line-height: 4.8vw;text-align: center;background-color: #f94b4b;color: #FFF;border-radius: 1.6vw 0 1.6vw 0;position: absolute;top: 0;left: 0;padding: 0 1.5vw;font-size: 3vw;}
     .coupon-popup .coupon-list-cell{background: url("/img/account/icon-coupon-uesb@h52x.png") no-repeat;background-size: cover;}
     .coupon-popup .coupon-list-cell.none{background: url("/img/account/icon-coupon-received@h52x.png") no-repeat;background-size: cover;}
+    /*订单金额偏小弹窗提示*/
+    .confirm-Model{width: 100%;height: 100%;position: fixed;top: 0;left: 0;background: rgba(0,0,0,0.3);z-index: 9999;}
+    .confirm-Model .model-content{width: 74.6vw;height: 100.8vw;background: #FFFFFF;border-radius: 2vw;position: absolute;top: 0;right: 0;left: 0;bottom: 0;margin: auto;z-index: 9998;}
+    .confirm-Model .model-content .title{width: 100%;height: 11vw;box-sizing: border-box;font-size: 14px;line-height: 11vw;text-align: left;color: #333333;float: left;position: relative;border-bottom: 1px solid #EFEFEF;background-color: #FFFFFF;padding: 0 14px;}
+    .confirm-Model .model-content .title .icon-close{width: 16px;height: 16px;display: block;position: absolute;right:12px;top: 12px;background: url("/img/base/icon.png")-319px 0 no-repeat;cursor: pointer;}
+    .confirm-Model .model-content .content{margin: 4.8vw 0 4.8vw 0;width: 100%;height: auto;line-height: 4.8vw;float: left;box-sizing: border-box;}
+    .confirm-Model .model-content .content p{text-align: left;font-size: 3.4vw;color: #666666;font-weight: normal;}
+    .confirm-Model .model-content .content p.small{font-size:3vw;color: #E15621;}
+    .confirm-Model .model-content .content-image {width: 100%;height: 128px;float: left;margin-bottom: 20px;}
+    .confirm-Model .model-content .content-image img{width: 29.5vw;height: 29.5vw;display: block;margin: 0 auto;}
+    .confirm-Model .model-content .button{width: 100%;height: 9.9vw;float: left;box-sizing: border-box;}
+    .confirm-Model .model-content .button a{width: 100%;height: 9.9vw;display: block;border-radius: 2px;font-size: 3.4vw;text-align: center;line-height: 9.9vw;color: #FFFFFF;float: right;box-sizing: border-box;border: 1px solid #FFFFFF;}
+    .confirm-Model .model-content .button a.cancel{background: #FFFFFF;border-color: #B8BFCA;color: #333333;}
+    .confirm-Model .model-content .button a.confirm{background: #E15616;margin-bottom: 2vw}
 
 }
 

src/main/resources/static/js/common/serviceapi/order.service.js

@@ -88,6 +88,19 @@ var OrderApi = {
                 callback(res);
             });
         },
+        /* 组合商品立即购买确认订单 */
+        OrderClubProductSupporting: function (params, callback) {
+            Http.AjaxService({
+                url:'/order/club/product/buynow',
+                type:'GET',
+                data:params,
+                json:false,
+                isHost:true
+            })
+            .then(function(res){
+                callback(res);
+            });
+        },
         /* 获取订单邮费信息 */
         GetOrderPostage: function (params, callback) {
             Http.AjaxService({

src/main/resources/static/js/common/serviceapi/product.service.js

@@ -397,4 +397,42 @@ var ProductApi = {
                 callback(res);
             });
         },
+        /**
+         * @组合商品
+         * @param:userId 用户userId
+         * @param:productId 商品Id
+         * @param:pageNum 页码
+         * @param:pageSize 每一页条数
+         */
+        getCommodityCombinationList:function (params, callback) {//获取商品收藏列表
+            Http.AjaxService({
+                url:'/commodity/seller/combination/list',
+                type:'get',
+                data:params,
+                json:true,
+                isHost:true
+            })
+                .then(function(res){
+                    callback(res);
+                });
+        },
+        /**
+         * @商品筛选品牌项
+         * @param:keyword 关键词
+         * @param:id 分类Id
+         * @param:idType 1 一级分类 2 二级分类 3 三级分类
+         * @param:identity
+         */
+        getCommoditySearchQUeryBrand:function (params, callback) {//获取商品收藏列表
+            Http.AjaxService({
+                url:'/commodity/search/query/brand',
+                type:'get',
+                data:params,
+                json:true,
+                isHost:true
+            })
+                .then(function(res){
+                    callback(res);
+                });
+        },
 };

src/main/resources/static/js/common/serviceapi/shopping.service.js

@@ -131,10 +131,11 @@ var ShoppingApi = {
          */
         ShoppingAddCarts:function (params, callback) {
             Http.AjaxService({
-                url:'/shoppingCart/addCarts',
+                url:'/order/club/cart/add/bulk',
                 type:'post',
                 data:params,
-                json:false
+                json:false,
+                isHost:true
             })
             .then(function(res){
                 callback(res);

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

@@ -41,6 +41,13 @@ var productDetail = new Vue({
         trainingType: '',
         isShowPopup: false,
         currentTab: 1,
+        listQuery:{
+            source:1,
+            userId:0,
+            productId:0,
+            pageNum:1,
+            pageSize:30,
+        },
         couponParam: {// 获取弹窗优惠券领取参数
             userId: 0,
             productId: 0,
@@ -48,9 +55,16 @@ var productDetail = new Vue({
             source: 1
         },
         isCouponEmpty: false,
+        isProductChecked:false,
         productCoupon: [], 							// 优惠券
         productCouponList: [],						// 优惠券弹窗列表
         collectionType:false,                       // 商品收藏状态
+        supportingList:[],
+        defaultSupportingList:[],
+        isShowMoreButton:false,
+        checkedNum:0,
+        totalPrice:0,
+
 
     },
     filters: {
@@ -72,9 +86,50 @@ var productDetail = new Vue({
                     return '新用户券';
                     break;
             }
+        },
+        NumFormat:function(value) {
+            return Number(value).toFixed(2);
         }
     },
     methods: {
+        // 是否显示vip标签价格
+        showVipPriceTag: function(product){
+            return (product.priceFlag !== 1 && product.svipProductFlag === 1 && ((GLOBAL_USER_IDENTITY === 4 && GLOBAL_VIP_FLAG === 1) || GLOBAL_USER_IDENTITY === 2));
+        },
+        PromotionsFormat:function(promo){//促销活动类型数据处理
+            if(promo!=null){
+                if(promo.type == 1 && promo.mode == 1){
+                    return true
+                }else{
+                    return false
+                }
+            }
+            return false
+        },
+        getCommodityCombinationList: function () {// 获取收藏商品列表
+            var _self = this;
+            ProductApi.getCommodityCombinationList(_self.listQuery,function (response) {
+                if (response.code === 0 ) {
+                    var data = response.data;
+                    if(data.results.length > 0 ){
+                        var list = data.results.map((el,index)=>{
+                            el.isChecked = false;
+                            el.number = el.minBuyNumber;
+                            return el;
+                        });
+                        _self.supportingList = list;
+                        _self.defaultSupportingList = _self.supportingList.slice(0,5);
+                        if(_self.supportingList.length > 0 ){
+                            _self.isShowMoreButton = true;
+                        }
+                    }else{
+                        _self.supportingList = [];
+                    }
+                }else {
+                    CAIMEI.Alert(response.msg, '确定');
+                }
+            });
+        },
         getImages: function () {
             var _self = this;
             if (!this.productId) {
@@ -468,14 +523,169 @@ var productDetail = new Vue({
                 })
             }
         },
+        supportingNumberSub: function(pros){// 配套商品数量减减
+            var _self = this;
+            if (pros.number <= pros.minBuyNumber) {
+                pros.number = pros.minBuyNumber
+                return
+            } else {
+                if (pros.step === 2) {
+                    pros.number -= pros.minBuyNumber
+                } else {
+                    pros.number--
+                }
+            }
+            _self.numberChange(pros);
+        },
+        supportingNumberAdd: function(pros){  // 配套商品数量加加
+            var _self = this;
+            if (pros.step === 2) {
+                pros.number += pros.minBuyNumber
+            } else {
+                pros.number++
+            }
+            _self.numberChange(pros);
+        },
+        supportingNumberChange: function(pros){ // 配套商品数量输入
+            var _self = this;
+            pros.number = Math.ceil(pros.number/pros.step)*pros.step;
+            _self.numberChange(pros);
+        },
+        numberChange: function(pros){
+            var _self = this;
+            if(pros.ladderPriceFlag){
+                pros.ladderPrices.forEach(function(ladder){
+                    if(pros.number>=ladder.buyNum){
+                        pros.price = ladder.buyPrice;
+                        pros.originalPrice = ladder.buyPrice;
+                    }
+                });
+            }
+            // 计算价格
+            _self.calculatetTtalPrice();
+        },
+        calculatetTtalPrice: function () { // 计算配套商品总价格
+            var _self = this;
+            var totalPrice = 0;
+            _self.supportingList.forEach(function (pros) {
+                if(pros.isChecked){
+                    pros.totalPrice = pros.number*pros.price;
+                }else{
+                    pros.totalPrice = 0;
+                }
+                totalPrice += pros.totalPrice;
+            })
+            _self.totalPrice = totalPrice;
+        },
+        checkedSoperv:function (pros) {// 勾选配套商品
+            console.log(pros)
+            var _self = this;
+            var goodsCheckedLength = 0;
+            pros.isChecked = !pros.isChecked
+            _self.supportingList.forEach(el => {
+                if(el.isChecked) {
+                    goodsCheckedLength++;
+                }
+            })
+            _self.checkedNum = goodsCheckedLength;
+            if(goodsCheckedLength>0){
+                _self.isProductChecked = true
+            }else{
+                _self.isProductChecked = false
+            }
+            _self.calculatetTtalPrice();
+        },
+        handleSupportingSubmit:function (type) {
+            var _self = this;
+            if (_self.userId > 0) {
+                switch (type) {
+                    case 'buy':
+                        console.log('立即购买')
+                        _self.toConfirmation()
+                        break
+                    case 'add':
+                        console.log('加入购物车')
+                        _self.getAddProductCart()
+                        break
+                }
+            } else {
+                _self.toLogin();
+            }
+        },
+        getAddProductCart:function () {
+            //批量增加购物车成功和toast弹窗提示成功
+            var _self = this;
+            var checkedList = [];
+            if(!_self.isProductChecked){
+                CAIMEI.dialog('请先选择商品',false);
+                return;
+            }
+            _self.supportingList.forEach((el)=>{
+                if(el.isChecked){
+                    checkedList.push({ productId:el.productId , productCount: el.number });
+                }
+            })
+            ShoppingApi.ShoppingAddCarts({userId:_self.listQuery.userId,productInfo:JSON.stringify(checkedList)},function(response){
+                if(response.code === 0){
+                    globalHead.getHeadCart(_self.listQuery.userId);
+                    $.confirm({
+                        useBootstrap: false,
+                        boxWidth: (isPC?'338px':'74.6vw'),
+                        title: false,
+                        content:'<div class="cartAlert"><h6>商品已成功加入购物车！</h6><p>当前购物车共<em>'+response.data+'</em>种商品</p></div>',
+                        closeIcon: true,
+                        animation: 'opacity',
+                        closeAnimation: 'opacity',
+                        animateFromElement: false,
+                        scrollToPreviousElement: false,
+                        buttons: {
+                            login: {
+                                text: '去结算',
+                                btnClass: 'btn-to-cart',
+                                action: function(){
+                                    window.location.href = '/shopping/cart.html';
+                                }
+                            },
+                            close: {
+                                text: '继续购物',
+                                btnClass: 'btn-to-goon'
+                            }
+                        }
+                    });
+                } else {
+                    dialog("加入购物车失败！");
+                }
+            })
+        },
+        toConfirmation:function () {
+            var _self = this;
+            //跳转确认订单页面
+            var checkedList = []
+            if(!_self.isProductChecked){
+                CAIMEI.dialog('请先选择商品',false);
+                return;
+            }
+            _self.supportingList.forEach((el)=>{
+                if(el.isChecked){
+                    checkedList.push({ id:el.productId , count: el.number })
+                }
+            })
+            CAIMEI.Storage.setItem('KEY_SUPPORE', JSON.stringify(checkedList));
+            window.location.href = '/shopping/confirm.html?type=3';
+        },
+        showSupportingMore:function () {
+            var _self = this;
+            _self.isShowMoreButton = false;
+            _self.defaultSupportingList = _self.supportingList;
+        },
         // 是否显示vip标签价格
         showVipPriceTag(product){
             return (product.priceFlag !== 1 && product.svipProductFlag === 1 && ((GLOBAL_USER_IDENTITY === 4 && GLOBAL_VIP_FLAG === 1) || GLOBAL_USER_IDENTITY === 2));
-        }
+        },
     },
     created: function () {
-        this.productId = this.couponParam.productId = $("#productId").val();
-        this.userId = this.couponParam.userId = GLOBAL_USER_ID;
+        this.productId = this.couponParam.productId = this.listQuery.productId = $("#productId").val();
+        this.userId = this.couponParam.userId = this.listQuery.userId = GLOBAL_USER_ID;
         this.productStock = $("#productStock").val();
         this.getImages();
         // identity: 0个人，1协销，2会员机构，3供应商，4普通机构
@@ -493,7 +703,7 @@ var productDetail = new Vue({
         this.getProductPrice();
         this.getParameters();
         this.queryProductDetilsCoupons();
-
+        this.getCommodityCombinationList();
         // $('.productInfo').slide({
         //     mainCell:".tabCon"
         //     ,titCell:".tabTit span"

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

@@ -26,7 +26,21 @@ var productList = new Vue({
         shopID:0,
         userIdentity: '',
         userToken: '',
-        addhtml:'<span class="tag">美博会</span>'
+        addhtml:'<span class="tag">美博会</span>',
+        brandParam: {
+            keyword: '',
+            id: '',
+            idType: '',
+            identity: 0
+        },
+        brandLists: [],
+        defaultBrandLists:[],
+        checkedBrandList:[],
+        checkedBrandLength:0,
+        isProductScreen:false,
+        isActiviChecked:false,
+        isNewsChecked:false,
+        isShowAllBrands:false
     },
     filters: {
         NumFormat:function(value) {
@@ -123,6 +137,61 @@ var productList = new Vue({
                 }
             });
         },
+        getCommoditySearchQUeryBrand:function() { // 查询筛选项品牌
+            var _self = this;
+            ProductApi.getCommoditySearchQUeryBrand(_self.brandParam,function (response) {
+                console.log(response);
+                if (response.code === 0 && response.data ) {
+                    var data = response.data;
+                    _self.defaultBrandLists = data.map((el, index) => {
+                        el.isChecked = false;
+                        return el;
+                    })
+                    _self.brandLists = _self.defaultBrandLists.slice(0,8)
+                    console.log('品牌=============>', this.brandLists)
+                }else {
+                    console.log('查询品牌列表异常')
+                }
+            });
+        },
+        choiceBrand:function(brand,index){// 选择品牌
+            var _self = this;
+            brand.isChecked = !brand.isChecked
+            if (brand.isChecked) {
+                _self.checkedBrandList.push(brand)
+            } else {
+                _self.checkedBrandList.splice(index, 1)
+            }
+            _self.checkedBrandLength = _self.checkedBrandList.length
+            console.log('checkedBrandList', _self.checkedBrandList)
+        },
+        showMoreItem:function(){// 点击更多品牌
+            this.isShowAllBrands = !this.isShowAllBrands;
+        },
+        hanldCheckedActivi:function(){// 选择促销商品选项
+            this.isActiviChecked = !this.isActiviChecked;
+            if(this.isActiviChecked){
+                this.listQuery.promotionFlag = 1
+            }else{
+                this.listQuery.promotionFlag = 0
+            }
+        },
+        hanldCheckedNews:function(){// 选择新品选项
+            this.isNewsChecked = !this.isNewsChecked;
+            if(this.isNewsChecked){
+                this.listQuery.newFlag = 1
+            }else{
+                this.listQuery.newFlag = 0
+            }
+        },
+        showIsProductScreen:function(){//
+            this.isProductScreen = true;
+        },
+        handleConfirmScreen:function(){
+            this.isProductScreen = false;
+            this.params.num = 1;
+            this.getListByKeyword();
+        }
         // getListByCategory: function (path, categoryId) {
         //     var _self = this;
         //     $.getJSON(spiServer+"/search/query/product/"+ path ,{
@@ -163,7 +232,7 @@ var productList = new Vue({
             this.params.size = 10;
             this.params.num = 1;
         }
-        this.params.keyword = getUrlParam("keyword") ? getUrlParam("keyword") : "";
+        this.params.keyword = this.brandParam.keyword = getUrlParam("keyword") ? getUrlParam("keyword") : "";
         // 搜索框赋值
         $('#topSearch').find('[data-select]').attr("data-select", 0).text("产品");
         $('#topSearch').find('.jqSelect').find('select').val(0);
@@ -183,7 +252,8 @@ var productList = new Vue({
         }
         // 获取列表数据
         this.getListByKeyword();
-
+        // 获取对应品牌列表
+        this.getCommoditySearchQUeryBrand();
         // if (this.searchFlag) {
         //     // 获取列表数据
         //     this.getListByKeyword();
@@ -229,6 +299,7 @@ var productList = new Vue({
                             _self.params.num = next;
                             // 获取列表数据
                             _self.getListByKeyword();
+
                             // if (_self.searchFlag) {
                             //     // 获取列表数据
                             //     _self.getListByKeyword();

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

@@ -22,7 +22,21 @@ var productList = new Vue({
             pageNum: 1,
             idType:1
         },
-        addhtml:'<span class="tag">美博会</span>'
+        addhtml:'<span class="tag">美博会</span>',
+        brandParam: {
+            keyword: '',
+            id: '',
+            idType: '',
+            identity: 0
+        },
+        brandLists: [],
+        defaultBrandLists:[],
+        checkedBrandList:[],
+        checkedBrandLength:0,
+        isProductScreen:false,
+        isActiviChecked:false,
+        isNewsChecked:false,
+        isShowAllBrands:false
     },
      filters:{
          NumFormat:function(value) {//处理金额
@@ -104,6 +118,61 @@ var productList = new Vue({
             }
             return false
         },
+        getCommoditySearchQUeryBrand:function() { // 查询筛选项品牌
+            var _self = this;
+            ProductApi.getCommoditySearchQUeryBrand(_self.brandParam,function (response) {
+                console.log(response);
+                if (response.code === 0 && response.data ) {
+                    var data = response.data;
+                    _self.defaultBrandLists = data.map((el, index) => {
+                        el.isChecked = false;
+                        return el;
+                    })
+                    _self.brandLists = _self.defaultBrandLists.slice(0,8)
+                    console.log('品牌=============>', this.brandLists)
+                }else {
+                    console.log('查询品牌列表异常')
+                }
+            });
+        },
+        choiceBrand:function(brand,index){// 选择品牌
+            var _self = this;
+            brand.isChecked = !brand.isChecked
+            if (brand.isChecked) {
+                _self.checkedBrandList.push(brand)
+            } else {
+                _self.checkedBrandList.splice(index, 1)
+            }
+            _self.checkedBrandLength = _self.checkedBrandList.length
+            console.log('checkedBrandList', _self.checkedBrandList)
+        },
+        showMoreItem:function(){// 点击更多品牌
+            this.isShowAllBrands = !this.isShowAllBrands;
+        },
+        hanldCheckedActivi:function(){// 选择促销商品选项
+            this.isActiviChecked = !this.isActiviChecked;
+            if(this.isActiviChecked){
+                this.listQuery.promotionFlag = 1
+            }else{
+                this.listQuery.promotionFlag = 0
+            }
+        },
+        hanldCheckedNews:function(){// 选择新品选项
+            this.isNewsChecked = !this.isNewsChecked;
+            if(this.isNewsChecked){
+                this.listQuery.newFlag = 1
+            }else{
+                this.listQuery.newFlag = 0
+            }
+        },
+        showIsProductScreen:function(){//
+            this.isProductScreen = true;
+        },
+        handleConfirmScreen:function(){// 确定筛选项
+            this.isProductScreen = false;
+            this.params.pageNum = 1;
+            this.getListByKeyword();
+        }
     },
     created:function () {
         var userInfo = localStorage.getItem('userInfo');

src/main/resources/static/js/product/product-supporting.js

@@ -0,0 +1,251 @@
+var supporting = new Vue({
+    el: "#supporting",
+    data: {
+        showProduct: false,
+        productId: 0,
+        userId: 0,
+        listQuery:{
+            source:1,
+            userId:0,
+            productId:0,
+            pageNum:1,
+            pageSize:30,
+        },
+        supportingList:[],
+        isAllChecked:false,
+        isProductChecked:false,
+        checkedNum:0,
+        totalPrice:0
+
+    },
+    filters: {
+        NumFormat:function(value) {
+            return Number(value).toFixed(2);
+        }
+    },
+    methods: {
+        getCommodityCombinationList: function () {// 获取组合商品列表
+            var _self = this;
+            ProductApi.getCommodityCombinationList(_self.listQuery,function (response) {
+                if (response.code === 0 ) {
+                    var data = response.data;
+                    if(data.results.length > 0 ){
+                        var list = data.results.map((el,index)=>{
+                            el.isChecked = false;
+                            el.number = el.minBuyNumber;
+                            return el;
+                        });
+                        _self.supportingList = list;
+                        _self.defaultSupportingList = _self.supportingList.slice(0,5);
+                        if(_self.supportingList.length > 0 ){
+                            _self.isShowMoreButton = true;
+                        }
+                        console.log('defaultSupportingList',_self.defaultSupportingList)
+                    }else{
+                        _self.supportingList = [];
+                    }
+                }else {
+                    CAIMEI.Alert(response.msg, '确定');
+                }
+            });
+        },
+        supportingNumberSub: function(pros){
+            var _self = this;
+            if (pros.number <= pros.minBuyNumber) {
+                pros.number = pros.minBuyNumber
+                return
+            } else {
+                if (pros.step === 2) {
+                    pros.number -= pros.minBuyNumber
+                } else {
+                    pros.number--
+                }
+            }
+            _self.numberChange(pros);
+        },
+        supportingNumberAdd: function(pros){  //商品数量加加
+            var _self = this;
+            if (pros.step === 2) {
+                pros.number += pros.minBuyNumber
+            } else {
+                pros.number++
+            }
+            _self.numberChange(pros);
+        },
+        supportingNumberChange: function(pros){
+            var _self = this;
+            pros.number = Math.ceil(pros.number/pros.step)*pros.step;
+            _self.numberChange(pros);
+        },
+        numberChange: function(pros){
+            var _self = this;
+            if(pros.ladderPriceFlag){
+                pros.ladderPrices.forEach(function(ladder){
+                    if(pros.number>=ladder.buyNum){
+                        pros.price = ladder.buyPrice;
+                        pros.originalPrice = ladder.buyPrice;
+                    }
+                });
+            }
+            // 计算价格
+            _self.calculatetTtalPrice();
+        },
+        calculatetTtalPrice: function () {
+            var _self = this;
+            var totalPrice = 0;
+            _self.supportingList.forEach(function (pros) {
+                if(pros.isChecked){
+                    pros.totalPrice = pros.number*pros.price;
+                }else{
+                    pros.totalPrice = 0;
+                }
+                totalPrice += pros.totalPrice;
+            })
+            _self.totalPrice = totalPrice;
+        },
+        isCheckedAll(){//全选
+            var _self = this;
+            _self.isAllChecked = !_self.isAllChecked;
+            _self.supportingList.forEach((el)=>{
+                el.isChecked = _self.isAllChecked;
+            })
+            if(_self.isAllChecked){
+                _self.isProductChecked = true;
+                _self.checkedNum = _self.supportingList.length;
+            }else{
+                _self.isProductChecked = false;
+                _self.checkedNum = 0;
+            }
+            _self.calculatetTtalPrice();
+        },
+        checkedSoperv:function (pros) {// 勾选
+            console.log(pros)
+            var _self = this;
+            var goodsCheckedLength = 0;
+            pros.isChecked = !pros.isChecked
+            _self.supportingList.forEach(el => {
+                if(el.isChecked) {
+                    goodsCheckedLength++;
+                }
+            })
+            _self.checkedNum = goodsCheckedLength;
+            _self.isAllChecked = goodsCheckedLength === _self.supportingList.length;
+            if(goodsCheckedLength>0){
+                _self.isProductChecked = true
+            }else{
+                _self.isProductChecked = false
+            }
+            _self.calculatetTtalPrice();
+        },
+        // 是否显示vip标签价格
+        showVipPriceTag: function(product){
+            return (product.priceFlag !== 1 && product.svipProductFlag === 1 && ((GLOBAL_USER_IDENTITY === 4 && GLOBAL_VIP_FLAG === 1) || GLOBAL_USER_IDENTITY === 2));
+        },
+        PromotionsFormat:function(promo){//促销活动类型数据处理
+            if(promo!=null){
+                if(promo.type == 1 && promo.mode == 1){
+                    return true
+                }else{
+                    return false
+                }
+            }
+            return false
+        },
+        handleSupportingSubmit:function (type) {
+            var _self = this;
+            if (_self.listQuery.userId > 0) {
+                switch (type) {
+                    case 'buy':
+                        console.log('立即购买')
+                        _self.toConfirmation()
+                        break
+                    case 'add':
+                        console.log('加入购物车')
+                        _self.getAddProductCart()
+                        break
+                }
+            } else {
+                _self.toLogin();
+            }
+        },
+        getAddProductCart:function () {
+            //批量增加购物车成功和toast弹窗提示成功
+            var _self = this;
+            var checkedList = [];
+            if(!_self.isProductChecked){
+                CAIMEI.dialog('请先选择商品',false);
+                return;
+            }
+            _self.supportingList.forEach((el)=>{
+                if(el.isChecked){
+                    checkedList.push({ productId:el.productId , productCount: el.number });
+                }
+            })
+            ShoppingApi.ShoppingAddCarts({userId:_self.listQuery.userId,productInfo:JSON.stringify(checkedList)},function(response){
+                if(response.code === 0){
+                    globalHead.getHeadCart(_self.listQuery.userId);
+                    $.confirm({
+                        useBootstrap: false,
+                        boxWidth: (isPC?'338px':'74.6vw'),
+                        title: false,
+                        content:'<div class="cartAlert"><h6>商品已成功加入购物车！</h6><p>当前购物车共<em>'+response.data+'</em>种商品</p></div>',
+                        closeIcon: true,
+                        animation: 'opacity',
+                        closeAnimation: 'opacity',
+                        animateFromElement: false,
+                        scrollToPreviousElement: false,
+                        buttons: {
+                            login: {
+                                text: '去结算',
+                                btnClass: 'btn-to-cart',
+                                action: function(){
+                                    window.location.href = '/shopping/cart.html';
+                                }
+                            },
+                            close: {
+                                text: '继续购物',
+                                btnClass: 'btn-to-goon'
+                            }
+                        }
+                    });
+                } else {
+                    dialog("加入购物车失败！");
+                }
+            })
+        },
+        toConfirmation:function () {
+            var _self = this;
+            //跳转确认订单页面
+            var checkedList = []
+            if(!_self.isProductChecked){
+                CAIMEI.dialog('请先选择商品',false);
+                return;
+            }
+            _self.supportingList.forEach((el)=>{
+                if(el.isChecked){
+                    checkedList.push({ id:el.productId , count: el.number })
+                }
+            })
+            CAIMEI.Storage.setItem('KEY_SUPPORE', JSON.stringify(checkedList));
+            window.location.href = '/shopping/confirm.html?type=3';
+        },
+        toLogin: function () {
+            setBeforeUrl();
+            window.location.href = '/login.html';
+        },
+    },
+    created: function () {
+        this.userId = this.listQuery.userId = GLOBAL_USER_ID;
+        // identity: 0个人，1协销，2会员机构，3供应商，4普通机构
+    },
+    mounted: function () {
+        this.listQuery.productId = getUrlParam("productId") ? getUrlParam("productId")*1 : "";
+        this.userId = this.listQuery.userId = GLOBAL_USER_ID;
+        this.getCommodityCombinationList();
+        // $('.productInfo').slide({
+        //     mainCell:".tabCon"
+        //     ,titCell:".tabTit span"
+        //     ,trigger: "click"
+        // });
+    }
+});

src/main/resources/static/js/shopping/cart.js

@@ -198,10 +198,22 @@ var shoppingCart = new Vue({
                                 totalCount += cart.number;
                                 // 单品满减
                                 if (cart.promotions && cart.promotions.type * 1 === 1 && cart.promotions.mode * 1 === 2) {
-                                    // 单品满减-重新计算供应商总价/满减金额
-                                    if (cart.price * cart.number >= cart.promotions.touchPrice) {
-                                        supplierPrice -= cart.promotions.reducedPrice;
-                                        supplierReducedPrice += cart.promotions.reducedPrice;
+                                    var price = cart.price * cart.number;
+                                    if(cart.promotions.discount == 1){
+                                        var discountNum = parseInt( price/cart.promotions.touchPrice);
+                                        console.log('单品满减促销叠加通道叠加次数',discountNum)
+                                        // 单品满减-重新计算供应商总价/满减金额
+                                        if ( price >= cart.promotions.touchPrice) {
+                                            supplierPrice -= cart.promotions.reducedPrice*discountNum
+                                            supplierReducedPrice += cart.promotions.reducedPrice*discountNum
+                                        }
+                                    }else{
+                                        console.log(' 单品满减非促销叠加通道')
+                                        // 单品满减-重新计算供应商总价/满减金额
+                                        if ( price >= cart.promotions.touchPrice) {
+                                            supplierPrice -= cart.promotions.reducedPrice;
+                                            supplierReducedPrice += cart.promotions.reducedPrice;
+                                        }
                                     }
                                 }
                                 //sivp优惠价格
@@ -212,10 +224,20 @@ var shoppingCart = new Vue({
                         });
                         // 店铺满减
                         if (supplier.promotions && supplier.promotions.mode * 1 === 2) {
-                            // 店铺满减-计算供应商总价/满减金额
-                            if (supplierPrice >= supplier.promotions.touchPrice) {
-                                supplierPrice -= supplier.promotions.reducedPrice;
-                                supplierReducedPrice += supplier.promotions.reducedPrice;
+                            if(supplier.promotions.discount == 1){// 支持促销叠加条件的店铺满减 执行
+                                var prosDiscountNum = parseInt(supplierPrice/supplier.promotions.touchPrice) // 店铺满减促销叠加次数 = 店铺合计价格/满减促销价格
+                                console.log('店铺满减促销叠加通道叠加次数',prosDiscountNum)
+                                if (supplierPrice >= supplier.promotions.touchPrice) {
+                                    supplierPrice -= supplier.promotions.reducedPrice*prosDiscountNum
+                                    supplierReducedPrice += supplier.promotions.reducedPrice*prosDiscountNum
+                                }
+                            }else{
+                                console.log('店铺满减非促销叠加通道')
+                                // 店铺满减-计算供应商总价/满减金额
+                                if (supplierPrice >= supplier.promotions.touchPrice) {
+                                    supplierPrice -= supplier.promotions.reducedPrice;
+                                    supplierReducedPrice += supplier.promotions.reducedPrice;
+                                }
                             }
                         }
                     }

src/main/resources/static/js/shopping/confirm.js

@@ -51,6 +51,11 @@ var shoppingConfirm = new Vue({
         productParam: Object.assign({}, defaultProductParam), 	// 商品立即购买确认订单参数
         postageParam: Object.assign({}, defaultPostageParam),	// 邮费计算参数
         confirmParam: Object.assign({}, defaultConfirmParam), 	// 提交订单参数
+        supportParm:{// 组合商品立即购买确认订单参数
+            productInfo:'',
+            source:2,			// 来源：1WWW 2小程序
+            userId:0			// 用户Id
+        },
         address: {
             id: '',
             townId: '',
@@ -118,6 +123,9 @@ var shoppingConfirm = new Vue({
         couponList:[], // 可用优惠券列表
         isCouponShow:false,
         svipReducedPrice: 0, //超级会员优惠金额
+        isModelAlert:false, // 订单不足提示弹窗
+        isModelAlertText:'',
+        isShowConfirm:true
     },
     computed: {
 
@@ -161,34 +169,18 @@ var shoppingConfirm = new Vue({
             if(_self.userId ===0){return;}
             OrderApi.ProductCreateOrderInfo(_self.productParam,function(response){
                 if (response.code === 0 ) {
-                    var data = response.data;
-                    _self.listData = data.list;
-                    _self.totalPrice =  data.totalPrice;
-                    _self.reducedPrice = data.reducedPrice;
-                    _self.totalCount =  data.totalCount;
-                    _self.kindCount = data.kindCount;
-                    _self.balance.userMoney = data.userMoney;
-                    _self.balance.originUserMoney = data.userMoney;
-                    _self.hanldShouldPayFee = data.totalPrice;
-                    _self.svipReducedPrice = data.svipReducedPrice;
-                    _self.postageParam.productIds =  _self.getProductIds(data.list); // 获取订单商品id列表 以 , 隔开
-                    console.log('邮费接口数据',  _self.postageParam)
-                    _self.getAddressList(_self.userId,20);
-                    if( data.couponList &&  data.couponList.length>0){
-                        _self.isCouponShow = true;
-                        _self.couponAmount = data.couponList[0].couponAmount;
-                        _self.confirmParam.clubCouponId = data.couponList[0].clubCouponId;
-                        data.couponList.forEach((el) => {
-                            _self.couponList.push(Object.assign(el,{ischecked:false}))
-                        })
-                        _self.couponList[0].ischecked = true;
-                        _self.hanldShouldPayFee = data.totalPrice - _self.couponAmount;
-                    }
-                    _self.totalDiscountAmount =  _self.reducedPrice + _self.couponAmount;
-                    if(data.invoice){
-                        data.invoice.type = 0;
-                        _self.orderInvoice =  data.invoice;
-                    }
+                    _self.setCreatDataInfo(response.data)
+                }else{
+                    CAIMEI.Alert(r.msg, '确定', false);
+                }
+            });
+        },
+        OrderClubProductSupporting:function(){// 组合商品确认订单初始化
+            var _self = this;
+            if(_self.userId ===0){return;}
+            OrderApi.OrderClubProductSupporting(_self.supportParm,function(response){
+                if (response.code === 0 ) {
+                    _self.setCreatDataInfo(response.data)
                 }else{
                     CAIMEI.Alert(r.msg, '确定', false);
                 }
@@ -199,39 +191,42 @@ var shoppingConfirm = new Vue({
             if(_self.userId ===0){return;}
             OrderApi.GetOrderConfirmInfo(_self.cartParam,function(response){
                 if (response.code === 0 ) {
-                    var data = response.data;
-                    _self.listData = data.list;
-                    _self.totalPrice =  data.totalPrice;
-                    _self.reducedPrice = data.reducedPrice;
-                    _self.totalCount =  data.totalCount;
-                    _self.kindCount = data.kindCount;
-                    _self.balance.userMoney = data.userMoney;
-                    _self.balance.originUserMoney = data.userMoney;
-                    _self.hanldShouldPayFee = data.totalPrice;
-                    _self.svipReducedPrice = data.svipReducedPrice;
-                    _self.postageParam.productIds =  _self.getProductIds(data.list); // 获取订单商品id列表 以 , 隔开
-                    _self.getAddressList(_self.userId,20);
-                    console.log('邮费接口数据',  _self.postageParam)
-                    if( data.couponList &&  data.couponList.length>0){
-                        _self.isCouponShow = true;
-                        _self.couponAmount = data.couponList[0].couponAmount;
-                        _self.confirmParam.clubCouponId = data.couponList[0].clubCouponId;
-                        data.couponList.forEach((el) => {
-                            _self.couponList.push(Object.assign(el,{ischecked:false}))
-                        })
-                        _self.couponList[0].ischecked = true;
-                        _self.hanldShouldPayFee = data.totalPrice - _self.couponAmount;
-                    }
-                    _self.totalDiscountAmount =  _self.reducedPrice + _self.couponAmount;
-                    if(data.invoice){
-                        data.invoice.type = 0;
-                        _self.orderInvoice =  data.invoice;
-                    }
+                    _self.setCreatDataInfo(response.data)
                 }else{
                     CAIMEI.Alert(r.msg, '确定', false);
                 }
             });
         },
+        setCreatDataInfo(data){
+            var _self = this;
+            _self.listData = data.list;
+            _self.totalPrice =  data.totalPrice;
+            _self.reducedPrice = data.reducedPrice;
+            _self.totalCount =  data.totalCount;
+            _self.kindCount = data.kindCount;
+            _self.balance.userMoney = data.userMoney;
+            _self.balance.originUserMoney = data.userMoney;
+            _self.hanldShouldPayFee = data.totalPrice;
+            _self.svipReducedPrice = data.svipReducedPrice;
+            _self.postageParam.productIds =  _self.getProductIds(data.list); // 获取订单商品id列表 以 , 隔开
+            _self.getAddressList(_self.userId,20);
+            console.log('邮费接口数据',  _self.postageParam)
+            if( data.couponList &&  data.couponList.length>0){
+                _self.isCouponShow = true;
+                _self.couponAmount = data.couponList[0].couponAmount;
+                _self.confirmParam.clubCouponId = data.couponList[0].clubCouponId;
+                data.couponList.forEach((el) => {
+                    _self.couponList.push(Object.assign(el,{ischecked:false}))
+                })
+                _self.couponList[0].ischecked = true;
+                _self.hanldShouldPayFee = data.totalPrice - _self.couponAmount;
+            }
+            _self.totalDiscountAmount =  _self.reducedPrice + _self.couponAmount;
+            if(data.invoice){
+                data.invoice.type = 0;
+                _self.orderInvoice =  data.invoice;
+            }
+        },
         getFreight: function(){// 获取邮费
             var _self = this;
             console.log(_self.postageParam, '邮费接口调用')
@@ -662,8 +657,18 @@ var shoppingConfirm = new Vue({
             n=(r1>=r2)?r1:r2;
             return ((arg1*m-arg2*m)/m).toFixed(n);
         },
-        submitOrder: function(){
+        submitOrder: function(){// 提交按钮点击
+            var _self = this;
+            if( _self.hanldShouldPayFee<1000){
+                _self.isModelAlert = true;
+                _self.isModelAlertText = '采购金额过小，将扣除500采美豆。建议您使用微信扫描 以下二维码，进入采美旗下“呵呵商城”小程序购买小额 商品。';
+            }else{
+                _self.handleClickOrderSubmitMit()
+            }
+        },
+        handleClickOrderSubmitMit:function () {// 提交订单
             var _self = this;
+            _self.isModelAlert = false;
             if(_self.submitLoading){return false;}
             if(!_self.confirmParam.addressId){
                 CAIMEI.dialog('请先添加收货地址～');
@@ -726,7 +731,7 @@ var shoppingConfirm = new Vue({
                 _self.confirmParam.orderInvoice = _self.orderInvoice;
             }
             var hanldPostageFlag =
-            _self.confirmParam.payInfo.postage = parseInt(_self.hanldPostage).toFixed(2);
+                _self.confirmParam.payInfo.postage = parseInt(_self.hanldPostage).toFixed(2);
             _self.confirmParam.payInfo.postageFlag = parseInt(_self.hanldPostageFlag);
             _self.confirmParam.payInfo.orderShouldPayFee = parseFloat(_self.hanldShouldPayFee).toFixed(2);
             _self.confirmParam.payInfo = JSON.stringify(_self.confirmParam.payInfo);
@@ -743,15 +748,23 @@ var shoppingConfirm = new Vue({
                         window.location.href = '/pay/success.html?pageType=www&type=success&payAmount='+data.payTotalFee;
                     }else{//余额抵扣部分订单金额或者未支付的
                         var order = {
-                                orderId:data.orderId,
-                                orderNo:data.orderNo,
-                                orderMark:data.orderMark,
-                                payableAmount:data.payableAmount
-                            };
+                            orderId:data.orderId,
+                            orderNo:data.orderNo,
+                            orderMark:data.orderMark,
+                            payableAmount:data.payableAmount
+                        };
                         CAIMEI.Storage.removeItem('confirmOrderInfo');
                         CAIMEI.Storage.setItem('confirmOrderInfo',JSON.stringify({data:order}));
                         window.location.href = '/pay/caimei-paycash.html?type=confirm&orderId='+data.orderId;
                     }
+                }else if(res.code === -3){
+                    _self.isModelAlert = true;
+                    _self.isShowConfirm = false;
+                    _self.submitLoading = false;
+                    _self.isModelAlertText = res.msg;
+                    _self.confirmParam.payInfo = JSON.parse(_self.confirmParam.payInfo);
+                    _self.confirmParam.orderInfo = JSON.parse(_self.confirmParam.orderInfo);
+                    _self.confirmParam.orderInvoice = JSON.parse(_self.confirmParam.orderInvoice);
                 }else{
                     CAIMEI.Alert(res.msg,'确定',true, function(){
                         setTimeout(function(){
@@ -764,6 +777,10 @@ var shoppingConfirm = new Vue({
                 }
             });
         },
+        handleCloseModel:function () {
+            this.isModelAlert = false;
+            this.isShowConfirm= true;
+        },
         getProductIds: function(list){// 获取订单商品id列表
             var productIds = [];
             list.forEach(function(supplier){
@@ -778,27 +795,28 @@ var shoppingConfirm = new Vue({
     created: function () {
         var _self = this;
         var urlType = getUrlParam("type") ? getUrlParam("type")*1 : "";
-        console.log('urlType',urlType)
         if(globalUserData){
-            _self.userId = _self.productParam.userId = _self.cartParam.userId = _self.postageParam.userId =   globalUserData.userId;
+            _self.userId = _self.productParam.userId = _self.cartParam.userId = _self.postageParam.userId = _self.supportParm.userId =   globalUserData.userId;
             _self.confirmParam.clubId = globalUserData.clubId
             _self.userIdentity = globalUserData.identity;
             _self.userToken = globalUserData.token;
             // type:（1购物车提交[对应表cm_cart]，2直接购买提交, 3协销下单）
             if(urlType === 1) {//购物车提交
                 _self.confirmParam.cartType = 1;
-                // _self.cartParam.productIds = _self.postageParam.productIds = _self.productIds = window.localStorage.getItem("shoppingProductIds");
                 _self.cartParam.productIds =  _self.productIds = window.localStorage.getItem("shoppingProductIds");
                 // 获取列表数据
                 _self.getCartCreateOrderInfo();
             }else if(urlType === 2){//立即购买
                 _self.confirmParam.cartType = 2;
-                // _self.productParam.productId = _self.postageParam.productIds = _self.productIds = getUrlParam("productId");
                 _self.productParam.productId =  _self.productIds = getUrlParam("productId");
                 _self.productParam.productCount = getUrlParam("count");
                 if(_self.productParam.productId && _self.productParam.productCount) {
                     _self.getProductCreateOrderInfo();
                 }
+            }else if(urlType === 3){// 组合商品立即购买
+                _self.supportParm.productInfo = CAIMEI.Storage.getItem("KEY_SUPPORE");
+                _self.OrderClubProductSupporting()
+                console.log('_self.supportParm.productInfo',_self.supportParm.productInfo)
             }
         }
     },

src/main/resources/static/js/user-center/account/beans.js

@@ -71,7 +71,9 @@ var orderPage = new Vue({
                     11:'退款回收',
                     12:'登录奖励',
                     13:'查看商品资料',
-                    14:'购买超级会员'
+                    14:'购买超级会员',
+                    15:'系统扣除',
+                    16:'系统退回',
                 };
             Object.keys(stateTextObject).forEach(function(key){
                 if(key == state){

src/main/resources/static/js/user-center/collection/collection.js

@@ -142,8 +142,6 @@ var orderPage = new Vue({
         },
         hanldBuyCart:function (pros,type) {// 1 加入购物车 2 立即购买
             var _self = this;
-            console.log('pros',pros)
-            console.log('type',type)
             if(type == 1) {
                 _self.shoppingCart(pros);
             }else{
@@ -155,13 +153,14 @@ var orderPage = new Vue({
             var checkedList = [];
             if(!_self.isProductChecked){
                 CAIMEI.dialog('请先选择商品',false);
+                return;
             }
             _self.listData.forEach((el)=>{
                 if(el.isChecked){
-                    checkedList.push(el.productId);
+                    checkedList.push({ productId:el.productId , productCount: el.minBuyNumber });
                 }
             })
-            ShoppingApi.ShoppingAddCarts({userId:_self.listQuery.userId,productIds:checkedList.join(",")},function(response){
+            ShoppingApi.ShoppingAddCarts({userId:_self.listQuery.userId, productInfo:JSON.stringify(checkedList)},function(response){
                 if(response.code === 0){
                     globalHead.getHeadCart(_self.listQuery.userId);
                     $.confirm({

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

@@ -258,6 +258,148 @@
                 </template>
             </div>
         </div>
+        <!--配套商品区域-->
+        <div class="wrap">
+            <div class="product-supporting">
+                <!--PC-->
+                <template v-if="isPC">
+                    <div class="product-supporting-title">配套商品</div>
+                    <div class="product-supporting-content">
+                        <div class="product-supporting-td">
+                            <p class="td-1">商品图片</p>
+                            <p class="td-2">商品名称</p>
+                            <p class="td-3">规格</p>
+                            <p class="td-4">价格</p>
+                            <p class="td-5">采购量</p>
+                            <p class="td-6">选择</p>
+                        </div>
+                        <div class="product-supporting-pro">
+                            <div class="product-supporting-list" v-for="pros in defaultSupportingList">
+                                <div class="tr tr-1">
+                                    <a :href="'/product-'+pros.productId+'.html'">
+                                        <img :src="pros.image" :alt="pros.name">
+                                    </a>
+                                </div>
+                                <div class="tr tr-2">
+                                    <a :href="'/product-'+pros.productId+'.html'">
+                                        <p v-html="pros.name"></p>
+                                    </a>
+                                </div>
+                                <div class="tr tr-3">
+                                    <p v-html="pros.unit"></p>
+                                </div>
+                                <div class="tr tr-4">
+                                    <div class="price">
+                                        <!--用户身份 0、个人 1、协销 2、会员机构 3、供应商 4,普通机构-->
+                                        <template v-if="GLOBAL_USER_ID && GLOBAL_USER_ID>0">
+                                            <!--0公开价格 1不公开价格 2仅对会员机构公开-->
+                                            <div class="main_price_unde" v-if="pros.priceFlag==1">￥价格未公开</div>
+                                            <!-- 资质机构 || (价格全部机构可见 && 普通机构) || (供应商 && 商品为供应商下的商品) || 超级会员用户 -->
+                                            <template
+                                                    v-else-if="GLOBAL_USER_IDENTITY === 2 || (pros.priceFlag === 0 && GLOBAL_USER_IDENTITY === 4) || (GLOBAL_USER_IDENTITY === 3 && pros.shopId === GLOBAL_SHOP_ID) || GLOBAL_VIP_FLAG === 1">
+                                                <div class="main_price_show"
+                                                     :class="{none: PromotionsFormat(pros.promotions) || (pros.svipProductFlag === 1 && showVipPriceTag(pros))}">
+                                                    ￥{{ (PromotionsFormat(pros.promotions) || showVipPriceTag(pros) ? pros.originalPrice :
+                                                    pros.price ) | NumFormat }}
+                                                </div>
+                                            </template>
+                                            <!--机构价仅会员可见 && 用户是普通机构-->
+                                            <div class="main_price_unde" v-else-if="pros.priceFlag==2 && GLOBAL_USER_IDENTITY === 4">
+                                                ￥会员可见
+                                            </div>
+                                            <!--供应商除自己的商品外，也显示价格等级-->
+                                            <div class="price_grade" v-else><span class="bold">￥</span><i
+                                                    :class="'icon mIcon i'+pros.priceGrade"></i></div>
+                                            <div class="price_text_tag clear">
+                                                <p class="couponTag" v-if="pros.couponsLogo">优惠券</p>
+                                                <template v-if="pros.svipProductFlag === 1">
+                                                    <div class="svip-tag">
+                                                        <div class="svip-icon">SVIP</div>
+                                                        <template v-if="showVipPriceTag(pros)">
+                                                            <div class="svip-price">
+                                                                <span v-html="pros.svipPriceTag"></span>
+                                                            </div>
+                                                        </template>
+                                                    </div>
+                                                </template>
+                                                <template v-else>
+                                                    <p class="listTag" v-if="pros.actStatus==1">{{pros.promotions.name}}
+                                                        <span v-if="pros.priceFlag != 1 && PromotionsFormat(pros.promotions)">:￥{{pros.price | NumFormat}}</span>
+                                                    </p>
+                                                </template>
+                                            </div>
+                                        </template>
+                                        <template v-else>
+                                            <div class="price_grade"><i :class="'icon mIcon i'+pros.priceGrade"></i></div>
+                                            <div class="price_text_tag">
+                                                <p class="couponTag" v-if="pros.couponsLogo">优惠券</p>
+                                                <template v-if="pros.svipProductFlag === 1">
+                                                    <div class="svip-tag">
+                                                        <div class="svip-icon">SVIP</div>
+                                                    </div>
+                                                </template>
+                                                <template v-else>
+                                                    <p class="listTag" v-if="pros.actStatus==1">{{p.promotions.name}}</p>
+                                                </template>
+                                            </div>
+                                        </template>
+                                    </div>
+                                </div>
+                                <div class="tr tr-5">
+                                    <span class="number">
+                                        <em class="sub" @click="supportingNumberSub(pros)">-</em>
+                                        <input type="number" :value="pros.number" v-model="pros.number" @change="supportingNumberChange(pros)">
+                                        <em class="add" @click="supportingNumberAdd(pros)">+</em>
+                                    </span>
+                                </div>
+                                <div class="tr tr-6">
+                                    <template v-if="pros.priceFlag == 1 || (pros.priceFlag==2 && GLOBAL_USER_IDENTITY === 4) || GLOBAL_USER_IDENTITY == 3">
+                                        <div class="checked-box">
+                                           <p>不可选择</p>
+                                        </div>
+                                    </template>
+                                    <template v-else>
+                                        <div class="checked-box" @click="checkedSoperv(pros)">
+                                            <input class="check" type="checkbox" @change="" v-model="pros.isChecked">
+                                        </div>
+                                    </template>
+                                </div>
+                            </div>
+                            <div class="product-supporting-more" v-if="isShowMoreButton">
+                                <div class="more" @click="showSupportingMore">
+                                    <i class="icon mIcon"></i>
+                                    查看更多
+                                </div>
+                            </div>
+                        </div>
+                        <div class="product-supporting-button">
+                            <div class="product-supporting-total">
+                                <p>共 <span class="ore">{{ checkedNum }}</span>件商品，合计:<span class="red">￥{{ totalPrice | NumFormat }}元</span></p>
+                            </div>
+                            <div class="product-supporting-btn">
+                                <div class="btn buy" @click="handleSupportingSubmit('buy')">立即购买</div>
+                                <div class="btn add" @click="handleSupportingSubmit('add')">加入购物车</div>
+                            </div>
+                        </div>
+                    </div>
+                </template>
+                <!--H5-->
+                <template v-else>
+                    <div class="product-supporting-title">配套商品({{ supportingList.length }})</div>
+                    <div class="product-supporting-content">
+                        <div class="product-supporting-list" v-for="(pros,index) in defaultSupportingList" :key="index" v-if="index<3">
+                            <a :href="'/product-'+pros.productId+'.html'">
+                                <img :src="pros.image" :alt="pros.name">
+                            </a>
+                        </div>
+                        <a :href="'/product/product-supporting.html?productId='+productId" class="product-supporting-more">
+                            <i class="icon mIcon"></i>
+                        </a>
+                    </div>
+                </template>
+            </div>
+        </div>
+        <!--相关推荐区域-->
         <div class="recommendBox" v-if="recommends.length>0">
             <div class="hd">相关推荐</div>
             <div id="productRecommend" class="swiper-container">

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

@@ -53,6 +53,55 @@
                     </div>
                 </div>
             </div>
+        </template>
+        <!--品牌选择-->
+        <template v-if="isPC">
+            <div class="product-brand clear">
+                <div class="product-brand-name" :class="isShowAllBrands ? 'show' : ''">
+                    <p class="title">品牌</p>
+                    <p v-if="!isPC" class="num">已选中<span>{{ checkedBrandLength }}</span>个品牌</p>
+                </div>
+                <div class="product-brand-list" :class="isShowAllBrands ? 'show' : ''">
+                    <div class="brand-list" v-for="(brand,index) in brandLists" :key="index"
+                         @click="choiceBrand(brand, index)" :class="brand.isChecked ? 'checked' : ''">
+                        <a href="javascript:void(0)" :title="brand.name" v-html="brand.name"></a>
+                    </div>
+                </div>
+                <div class="product-brand-more" :class="isShowAllBrands ? 'show' : ''" @click="showMoreItem">{{
+                    isShowAllBrands ? '收起' : '更多' }} <i class="icon mIcon"></i></div>
+            </div>
+        </template>
+        <template v-else>
+            <div class="product-brand-fiexd" v-if="isProductScreen">
+                <div class="product-brand clear">
+                    <div class="product-screen">
+                        <div class="sortBox-new" @click="hanldCheckedActivi">
+                            <span>促销商品</span>
+                            <span class="coll-checked" :class="[isActiviChecked ? 'checked': '']"></span>
+                        </div>
+                        <div class="sortBox-new" @click="hanldCheckedNews">
+                            <span>新品</span>
+                            <span class="coll-checked" :class="[isNewsChecked ? 'checked': '']"></span>
+                        </div>
+                    </div>
+                    <div class="product-brand-name" :class="isShowAllBrands ? 'show' : ''">
+                        <p class="title">品牌</p>
+                        <p v-if="!isPC" class="num">已选中<span>{{ checkedBrandLength }}</span>个品牌</p>
+                    </div>
+                    <div class="product-brand-list" :class="isShowAllBrands ? 'show' : ''">
+                        <div class="brand-list" v-for="(brand,index) in brandLists" :key="index"
+                             @click="choiceBrand(brand, index)" :class="brand.isChecked ? 'checked' : ''">
+                            <a href="javascript:void(0)" :title="brand.name" v-html="brand.name"></a>
+                        </div>
+                    </div>
+                    <div class="product-brand-more" :class="isShowAllBrands ? 'show' : ''" @click="showMoreItem">{{
+                        isShowAllBrands ? '收起' : '查看全部' }} <i
+                                class="icon mIcon"></i></div>
+                    <div class="product-screen-btn" @click="handleConfirmScreen">
+                        <div class="sub-button">确定</div>
+                    </div>
+                </div>
+            </div>
         </template>
             <div class="sortBox classification">
                 <ul class="mfc class-nav-main">
@@ -78,7 +127,23 @@
                             @click="toSortList('price',1)"><span>价格</span></li>
                             <li v-else @click="toSortList('price',0)"><span>价格</span></li>
                         </template>
+                        <template v-if="!isPC">
+                            <li class="screen" @click="showIsProductScreen">
+                                <span>筛选</span>
+                                <i class="mIcon"></i>
+                            </li>
+                        </template>
                 </ul>
+                <div class="sortBox-checked" v-if="isPC">
+                    <div class="sortBox-new" @click="hanldCheckedActivi">
+                        <span class="coll-checked" :class="[isActiviChecked ? 'checked': '']"></span>
+                        <span>促销商品</span>
+                    </div>
+                    <div class="sortBox-new" @click="hanldCheckedNews">
+                        <span class="coll-checked" :class="[isNewsChecked ? 'checked': '']"></span>
+                        <span>新品</span>
+                    </div>
+                </div>
             </div>
         </div>
         <!--商品列表-->
@@ -141,7 +206,7 @@
                                         </div>
                                     </template>
                                     <!--会员可见-->
-                                    <div class="main_price_unde" v-if="p.priceFlag==2 && GLOBAL_USER_IDENTITY === 4">￥会员可见</div>
+                                    <div class="main_price_unde" v-else-if="p.priceFlag==2 && GLOBAL_USER_IDENTITY === 4">￥会员可见</div>
                                     <!--其他-->
                                     <div class="price_grade" v-else><span class="bold">￥</span><i :class="'icon mIcon i'+p.priceGrade"></i></div>
                                 </template>

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

@@ -19,53 +19,53 @@
         <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>-->
+    <!--    <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">
@@ -78,9 +78,58 @@
         </div>
     </div>
     <template v-else>
+        <!--品牌选择-->
+        <template v-if="isPC">
+            <div class="product-brand clear">
+                <div class="product-brand-name" :class="isShowAllBrands ? 'show' : ''">
+                    <p class="title">品牌</p>
+                    <p v-if="!isPC" class="num">已选中<span>{{ checkedBrandLength }}</span>个品牌</p>
+                </div>
+                <div class="product-brand-list" :class="isShowAllBrands ? 'show' : ''">
+                    <div class="brand-list" v-for="(brand,index) in brandLists" :key="index"
+                         @click="choiceBrand(brand, index)" :class="brand.isChecked ? 'checked' : ''">
+                        <a href="javascript:void(0)" :title="brand.name" v-html="brand.name"></a>
+                    </div>
+                </div>
+                <div class="product-brand-more" :class="isShowAllBrands ? 'show' : ''" @click="showMoreItem">{{
+                    isShowAllBrands ? '收起' : '更多' }} <i class="icon mIcon"></i></div>
+            </div>
+        </template>
+        <template v-else>
+            <div class="product-brand-fiexd" v-if="isProductScreen">
+                <div class="product-brand clear">
+                    <div class="product-screen">
+                        <div class="sortBox-new" @click="hanldCheckedActivi">
+                            <span>促销商品</span>
+                            <span class="coll-checked" :class="[isActiviChecked ? 'checked': '']"></span>
+                        </div>
+                        <div class="sortBox-new" @click="hanldCheckedNews">
+                            <span>新品</span>
+                            <span class="coll-checked" :class="[isNewsChecked ? 'checked': '']"></span>
+                        </div>
+                    </div>
+                    <div class="product-brand-name" :class="isShowAllBrands ? 'show' : ''">
+                        <p class="title">品牌</p>
+                        <p v-if="!isPC" class="num">已选中<span>{{ checkedBrandLength }}</span>个品牌</p>
+                    </div>
+                    <div class="product-brand-list" :class="isShowAllBrands ? 'show' : ''">
+                        <div class="brand-list" v-for="(brand,index) in brandLists" :key="index"
+                             @click="choiceBrand(brand, index)" :class="brand.isChecked ? 'checked' : ''">
+                            <a href="javascript:void(0)" :title="brand.name" v-html="brand.name"></a>
+                        </div>
+                    </div>
+                    <div class="product-brand-more" :class="isShowAllBrands ? 'show' : ''" @click="showMoreItem">{{
+                        isShowAllBrands ? '收起' : '查看全部' }} <i
+                                class="icon mIcon"></i></div>
+                    <div class="product-screen-btn" @click="handleConfirmScreen">
+                        <div class="sub-button">确定</div>
+                    </div>
+                </div>
+            </div>
+        </template>
         <!--排序-->
         <div class="sortBox">
-            <ul class="mfc">
+            <ul class="mfc clear">
                 <li :class="{'on':params.sortField == ''}" @click="toSortList('',1)">综合</li>
                 <template>
                     <li v-if="params.sortField == 'sales' && params.sortType == 1" class="down"
@@ -103,7 +152,23 @@
                         @click="toSortList('price',1)"><span>价格</span></li>
                     <li v-else @click="toSortList('price',0)"><span>价格</span></li>
                 </template>
+                <template v-if="!isPC">
+                    <li class="screen" @click="showIsProductScreen">
+                        <span>筛选</span>
+                        <i class="mIcon"></i>
+                    </li>
+                </template>
             </ul>
+            <div class="sortBox-checked" v-if="isPC">
+                <div class="sortBox-new" @click="hanldCheckedActivi">
+                    <span class="coll-checked" :class="[isActiviChecked ? 'checked': '']"></span>
+                    <span>促销商品</span>
+                </div>
+                <div class="sortBox-new" @click="hanldCheckedNews">
+                    <span class="coll-checked" :class="[isNewsChecked ? 'checked': '']"></span>
+                    <span>新品</span>
+                </div>
+            </div>
         </div>
         <!--商品列表-->
         <ul class="productList clear mfw">
@@ -136,16 +201,21 @@
                             <!--0公开价格 1不公开价格 2仅对会员机构公开-->
                             <div class="main_price_unde" v-if="p.priceFlag==1">￥价格未公开</div>
                             <!-- 资质机构 || (价格全部机构可见 && 普通机构) || (供应商 && 商品为供应商下的商品) || 超级会员用户 -->
-                            <template v-else-if="GLOBAL_USER_IDENTITY === 2 || (p.priceFlag === 0 && GLOBAL_USER_IDENTITY === 4) || (GLOBAL_USER_IDENTITY === 3 && p.shopId === GLOBAL_SHOP_ID) || GLOBAL_VIP_FLAG === 1">
+                            <template
+                                    v-else-if="GLOBAL_USER_IDENTITY === 2 || (p.priceFlag === 0 && GLOBAL_USER_IDENTITY === 4) || (GLOBAL_USER_IDENTITY === 3 && p.shopId === GLOBAL_SHOP_ID) || GLOBAL_VIP_FLAG === 1">
                                 <div class="main_price_show"
-                                    :class="{none: PromotionsFormat(p.promotions) || (p.svipProductFlag === 1 && showVipPriceTag(p))}">
-                                    ￥{{ (PromotionsFormat(p.promotions) || showVipPriceTag(p) ? p.originalPrice : p.price ) | NumFormat }}
+                                     :class="{none: PromotionsFormat(p.promotions) || (p.svipProductFlag === 1 && showVipPriceTag(p))}">
+                                    ￥{{ (PromotionsFormat(p.promotions) || showVipPriceTag(p) ? p.originalPrice :
+                                    p.price ) | NumFormat }}
                                 </div>
                             </template>
                             <!--机构价仅会员可见 && 用户是普通机构-->
-                            <div class="main_price_unde" v-else-if="p.priceFlag==2 && GLOBAL_USER_IDENTITY === 4">￥会员可见</div>
+                            <div class="main_price_unde" v-else-if="p.priceFlag==2 && GLOBAL_USER_IDENTITY === 4">
+                                ￥会员可见
+                            </div>
                             <!--供应商除自己的商品外，也显示价格等级-->
-                            <div class="price_grade" v-else><span class="bold">￥</span><i :class="'icon mIcon i'+p.priceGrade"></i></div>
+                            <div class="price_grade" v-else><span class="bold">￥</span><i
+                                    :class="'icon mIcon i'+p.priceGrade"></i></div>
                         </template>
                         <template v-else>
                             <div class="price_text_tag">
@@ -159,7 +229,8 @@
                                     <p class="listTag" v-if="p.actStatus==1">{{p.promotions.name}}</p>
                                 </template>
                             </div>
-                            <div class="price_grade"><span class="bold">￥</span><i :class="'icon mIcon i'+p.priceGrade"></i></div>
+                            <div class="price_grade"><span class="bold">￥</span><i
+                                    :class="'icon mIcon i'+p.priceGrade"></i></div>
                         </template>
                     </div>
                 </a>
@@ -171,10 +242,12 @@
     <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>
+            <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>
+        <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()"/>
@@ -185,7 +258,8 @@
 <!-- 引入底部 -->
 <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/common/serviceapi/product.service.js(v=${version})}"></script>
 <script charset="utf-8" type="text/javascript" th:src="@{/js/product/list.js(v=${version})}"></script>
 </body>
 </html>

src/main/resources/templates/product/product-supporting.html

@@ -0,0 +1,124 @@
+<!DOCTYPE html>
+<html lang="zh-CN" xmlns:th="https://www.thymeleaf.org" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+      xsi:schemaLocation="https://www.thymeleaf.org ">
+<head>
+    <title>采美365网-配套商品</title>
+    <template th:replace="components/head-link"></template>
+    <link th:href="@{/css/product/product-supporting.h5.css(v=${version})}" rel="stylesheet" type="text/css">
+    <template th:replace="components/analysis"></template>
+</head>
+<body>
+<!-- 引用头部 -->
+<template th:replace="components/header"></template>
+
+<!-- 购物车列表 -->
+<div id="supporting">
+    <!--列表-->
+    <div class="supporting-title">
+        <div class="title">配套商品</div>
+        <div class="coll-span all" @click="isCheckedAll">
+            <span class="coll-checked" :class="[isAllChecked ? 'checked': '']"></span>
+            <span>全选</span>
+        </div>
+    </div>
+    <div class="supporting-content">
+        <div class="supporting-list" v-for="(pros,index) in supportingList" :key="index">
+            <div class="list-checked"  @click="checkedSoperv(pros)">
+                <span class="coll-checked" :class="[pros.isChecked ? 'checked': '']"></span>
+            </div>
+            <div class="list-image">
+                <img :src="pros.image" :alt="pros.name">
+            </div>
+            <div class="list-info">
+                <div class="list-name">{{ pros.name }}</div>
+                <div class="list-unit">规格：{{ pros.unit }}</div>
+                <div class="list-price">
+                    <template v-if="GLOBAL_USER_ID && GLOBAL_USER_ID>0">
+                        <div class="price-box">
+                            <!--0公开价格 1不公开价格 2仅对会员机构公开-->
+                            <div class="main_price_unde" v-if="pros.priceFlag==1">￥价格未公开</div>
+                            <!-- 资质机构 || (价格全部机构可见 && 普通机构) || (供应商 && 商品为供应商下的商品) || 超级会员用户 -->
+                            <template
+                                    v-else-if="GLOBAL_USER_IDENTITY === 2 || (pros.priceFlag === 0 && GLOBAL_USER_IDENTITY === 4) || (GLOBAL_USER_IDENTITY === 3 && pros.shopId === GLOBAL_SHOP_ID) || GLOBAL_VIP_FLAG === 1">
+                                <div class="main_price_show"
+                                     :class="{none: PromotionsFormat(pros.promotions) || (pros.svipProductFlag === 1 && showVipPriceTag(pros))}">
+                                    ￥{{ (PromotionsFormat(pros.promotions) || showVipPriceTag(pros) ? pros.originalPrice :
+                                    pros.price ) | NumFormat }}
+                                </div>
+                            </template>
+                            <!--机构价仅会员可见 && 用户是普通机构-->
+                            <div class="main_price_unde" v-else-if="pros.priceFlag==2 && GLOBAL_USER_IDENTITY === 4">
+                                ￥会员可见
+                            </div>
+                            <!--供应商除自己的商品外，也显示价格等级-->
+                            <div class="price_grade" v-else><span class="bold">￥</span><i :class="'icon mIcon i'+pros.priceGrade"></i></div>
+                        </div>
+                        <div class="price-number">
+                            <span class="number">
+                                <em class="sub" @click="supportingNumberSub(pros)">-</em>
+                                <input type="number" :value="pros.number" v-model="pros.number" @change="supportingNumberChange(pros)">
+                                <em class="add" @click="supportingNumberAdd(pros)">+</em>
+                            </span>
+                        </div>
+                    </template>
+                    <template v-else>
+                        <div class="price_grade">
+                            <span class="bold">￥</span><i :class="'icon mIcon i'+pros.priceGrade"></i>
+                        </div>
+                    </template>
+                </div>
+                <div class="list-tags">
+                    <template v-if="GLOBAL_USER_ID && GLOBAL_USER_ID>0">
+                        <div class="price_text_tag clear">
+                            <p class="couponTag" v-if="pros.couponsLogo">优惠券</p>
+                            <template v-if="pros.svipProductFlag === 1">
+                                <div class="svip-tag">
+                                    <div class="svip-icon">SVIP</div>
+                                    <template v-if="showVipPriceTag(pros)">
+                                        <div class="svip-price">
+                                            <span v-html="pros.svipPriceTag"></span>
+                                        </div>
+                                    </template>
+                                </div>
+                            </template>
+                            <template v-else>
+                                <p class="listTag" v-if="pros.actStatus==1">{{pros.promotions.name}}
+                                    <span v-if="pros.priceFlag != 1 && PromotionsFormat(pros.promotions)">:￥{{pros.price | NumFormat}}</span>
+                                </p>
+                            </template>
+                        </div>
+                    </template>
+                    <template v-else>
+                        <div class="price_text_tag">
+                            <p class="couponTag" v-if="pros.couponsLogo">优惠券</p>
+                            <template v-if="pros.svipProductFlag === 1">
+                                <div class="svip-tag">
+                                    <div class="svip-icon">SVIP</div>
+                                </div>
+                            </template>
+                            <template v-else>
+                                <p class="listTag" v-if="pros.actStatus==1">{{p.promotions.name}}</p>
+                            </template>
+                        </div>
+                    </template>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="supporting-submit">
+        <div class="supporting-submit-total">
+            <p>共<span class="ore">{{ checkedNum }}</span>件商品</p>
+            <p>合计<span class="red">￥{{ totalPrice | NumFormat }}元</span></p>
+        </div>
+        <div class="supporting-submit-button">
+            <div class="btn add" @click="handleSupportingSubmit('add')">加入购物车</div>
+            <div class="btn buy" @click="handleSupportingSubmit('buy')">立即购买</div>
+        </div>
+    </div>
+</div>
+<!-- 引入底部 -->
+<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/product-supporting.js(v=${version})}"></script>
+</body>
+</html>

src/main/resources/templates/shopping/confirm.html

@@ -399,7 +399,28 @@
             </div>
         </div>
     </div>
-
+    <!--订单采购量不足提示-->
+    <div class="confirm-Model" v-if="isModelAlert">
+        <div class="model-content">
+            <div class="title"><p>提示</p><i class="icon-close" @click.stop="handleCloseModel"></i></div>
+            <div class="content">
+                <p>{{ isModelAlertText }}</p>
+                <p class="small" v-if="userBeans<0">注：采购金额过小的订单，需要扣除500采美豆</p>
+            </div>
+            <div class="content-image">
+                <img src="/img/common/qr_code_hehe.jpg" alt="呵呵商城">
+            </div>
+            <div class="button" id="payButton">
+                <template v-if="isShowConfirm">
+                    <a class="btn confirm" href="javascript:void(0);" @click.stop="handleClickOrderSubmitMit">继续提交</a>
+                    <a class="btn cancel" href="javascript:void(0);" @click.stop="handleCloseModel" v-if="isShowConfirm">取消</a>
+                </template>
+                <template v-else>
+                    <a class="btn confirm" href="javascript:void(0);" @click.stop="handleCloseModel">了解</a>
+                </template>
+            </div>
+        </div>
+    </div>
 </div>
 <!-- 引入底部 -->
 <template th:replace="components/footer"></template>