commit -m 搜索 分类列表 筛选项

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

@@ -11,6 +11,9 @@ var productList = new Vue({
             keyword: "",
             sortField: "",
             sortType: 1, // 1降序，其他升序
+            brandIds: '', // 品牌Id
+            newFlag: 0, // 查询新品标记，默认0，新品1
+            promotionFlag: 0, // 查询促销标记，默认0，促销1
             // bid: "",
             // sid: "",
             // tid: ""
@@ -33,6 +36,7 @@ var productList = new Vue({
             idType: '',
             identity: 0
         },
+        hrefBrandId:null,
         brandLists: [],
         defaultBrandLists:[],
         checkedBrandList:[],
@@ -110,7 +114,10 @@ var productList = new Vue({
                 pageSize: this.params.size,
                 pageNum: this.params.num,
                 sortField: this.params.sortField,
-                sortType: this.params.sortType
+                sortType: this.params.sortType,
+                brandIds: this.params.brandIds, // 品牌Id
+                newFlag: this.params.newFlag, // 查询新品标记，默认0，新品1
+                promotionFlag: this.params.promotionFlag, // 查询促销标记，默认0，促销1
             },function (res) {
                 console.log(res);
                 if (res.code === 0 && res.data ) {
@@ -144,53 +151,74 @@ var productList = new Vue({
                 if (response.code === 0 && response.data ) {
                     var data = response.data;
                     _self.defaultBrandLists = data.map((el, index) => {
-                        el.isChecked = false;
+                        if(_self.hrefBrandId && _self.hrefBrandId == el.id){
+                            el.isChecked = true;
+                        }else{
+                            el.isChecked = false;
+                        }
                         return el;
                     })
                     _self.brandLists = _self.defaultBrandLists.slice(0,8)
-                    console.log('品牌=============>', this.brandLists)
                 }else {
                     console.log('查询品牌列表异常')
                 }
             });
         },
+        choiceBrandHref: function (brand, index) {// PC端跳转链接
+            window.location.href =  '/product/list.html?keyword=' + encodeURIComponent(this.params.keyword) +
+                                    '&bpn=' + brand.id + '&pro=' + this.params.promotionFlag +
+                                    '&newg='+ this.params.newFlag;
+        },
         choiceBrand:function(brand,index){// 选择品牌
             var _self = this;
             brand.isChecked = !brand.isChecked
             if (brand.isChecked) {
-                _self.checkedBrandList.push(brand)
+                _self.checkedBrandList.push(brand.id)
             } else {
                 _self.checkedBrandList.splice(index, 1)
             }
             _self.checkedBrandLength = _self.checkedBrandList.length
-            console.log('checkedBrandList', _self.checkedBrandList)
+            _self.params.brandIds = this.checkedBrandList.join(',')
         },
         showMoreItem:function(){// 点击更多品牌
             this.isShowAllBrands = !this.isShowAllBrands;
+            this.brandLists = this.defaultBrandLists;
         },
         hanldCheckedActivi:function(){// 选择促销商品选项
             this.isActiviChecked = !this.isActiviChecked;
             if(this.isActiviChecked){
-                this.listQuery.promotionFlag = 1
+                this.params.promotionFlag = 1
             }else{
-                this.listQuery.promotionFlag = 0
+                this.params.promotionFlag = 0
             }
         },
         hanldCheckedNews:function(){// 选择新品选项
             this.isNewsChecked = !this.isNewsChecked;
             if(this.isNewsChecked){
-                this.listQuery.newFlag = 1
+                this.params.newFlag = 1
             }else{
-                this.listQuery.newFlag = 0
+                this.params.newFlag = 0
             }
         },
+        hanldCheckedActiviHref(){// 选择促销商品选项跳转链接(PC专用)
+            var promotionFlag = this.isActiviChecked ? 0 : 1;
+            window.location.href = '/product/list.html?keyword='+encodeURIComponent(this.params.keyword)+
+                                   '&bpn='+this.hrefBrandId+ '&pro='+promotionFlag+'&newg='+ this.params.newFlag;
+        },
+        hanldCheckedNewsHref(){// 选择新品选项跳转链接(PC专用)
+            var newFlag = this.isNewsChecked ? 0 : 1;
+            window.location.href = '/product/list.html?keyword='+encodeURIComponent(this.params.keyword)+
+                                   '&bpn='+this.hrefBrandId+ '&pro=' + this.params.promotionFlag +
+                                   '&newg='+newFlag;
+        },
         showIsProductScreen:function(){//
             this.isProductScreen = true;
         },
         handleConfirmScreen:function(){
-            this.isProductScreen = false;
             this.params.num = 1;
+            this.listData = [];
             this.getListByKeyword();
+            this.isProductScreen = false;
         }
         // getListByCategory: function (path, categoryId) {
         //     var _self = this;
@@ -228,6 +256,22 @@ var productList = new Vue({
         if(isPC){
             this.params.size = getUrlParam("pageSize") ? getUrlParam("pageSize") * 1 : 20;
             this.params.num = getUrlParam("pageNum") ? getUrlParam("pageNum") * 1 : 1;
+            this.hrefBrandId = getUrlParam("bpn") ? getUrlParam("bpn") : null; //bpn 品牌链接参数
+            this.params.promotionFlag = getUrlParam("pro") ? getUrlParam("pro")*1 : 0; // pro 促销商品链接参数
+            this.params.newFlag = getUrlParam("newg") ? getUrlParam("newg")*1 : 0; // newg 新品链接参数
+            if(this.hrefBrandId){
+                this.params.brandIds = this.hrefBrandId +',';
+            }
+            if(this.params.promotionFlag == 1){
+                this.isActiviChecked = true;
+            }else{
+                this.isActiviChecked = false;
+            }
+            if(this.params.newFlag == 1){
+                this.isNewsChecked = true;
+            }else{
+                this.isNewsChecked = false;
+            }
         }else{
             this.params.size = 10;
             this.params.num = 1;

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

@@ -20,7 +20,10 @@ var productList = new Vue({
             sortType: 1, // 上传0，下传1 綜合1
             pageSize: 24,
             pageNum: 1,
-            idType:1
+            idType:1,
+            brandIds: '', // 品牌Id
+            newFlag: 0, // 查询新品标记，默认0，新品1
+            promotionFlag: 0, // 查询促销标记，默认0，促销1
         },
         addhtml:'<span class="tag">美博会</span>',
         brandParam: {
@@ -29,6 +32,7 @@ var productList = new Vue({
             idType: '',
             identity: 0
         },
+        hrefBrandId:'',
         brandLists: [],
         defaultBrandLists:[],
         checkedBrandList:[],
@@ -69,12 +73,12 @@ var productList = new Vue({
                                 $("img[data-original]").lazyload();
                             },500);
                         });
-                        console.log(resultData);
                         if(isPC){
                             _self.listData = resultData;
                         }else{
                             _self.listData = _self.listData.concat(resultData);
                         }
+                   console.log('listData',_self.listData);
                }else {
                   console.log('暂无数据')
                }
@@ -94,15 +98,15 @@ var productList = new Vue({
                 this.params.pageNum = pageNum*1;
                 var url = '/product/classify-'+this.typeSort+'-'+this.bigTypeId+'-'+this.smallTypeId+'-'+this.tinyTypeId+'-'+this.params.pageNum+'-'+this.params.pageSize;
                 if (this.params.sortField) {
-                    url += '-'+this.params.sortField+'-'+this.params.sortType+'.html';
+                    url += '-'+this.params.sortField+'-'+this.params.sortType+'.html?bpn=' + this.hrefBrandId + '&pro=' + this.params.promotionFlag +'&newg='+ this.params.newFlag;
                 } else {
-                    url += '.html';
+                    url += '.html?bpn=' + this.hrefBrandId + '&pro=' + this.params.promotionFlag +'&newg='+ this.params.newFlag;
                 }
                 window.location.href = url;
             }
         },
         toSortList: function (sortField, sortType) {
-            var url = '/product/classify-'+this.typeSort+'-'+this.bigTypeId+'-'+this.smallTypeId+'-'+this.tinyTypeId+'-1-'+this.params.pageSize+'-'+sortField+'-'+sortType+'.html';
+            var url = '/product/classify-'+this.typeSort+'-'+this.bigTypeId+'-'+this.smallTypeId+'-'+this.tinyTypeId+'-1-'+this.params.pageSize+'-'+sortField+'-'+sortType+'.html?bpn=' + this.hrefBrandId + '&pro=' + this.params.promotionFlag +'&newg='+ this.params.newFlag;
             this.params.sortField= sortField;
             this.params.sortType = sortType;
             this.params.pageNum = 1;
@@ -125,53 +129,80 @@ var productList = new Vue({
                 if (response.code === 0 && response.data ) {
                     var data = response.data;
                     _self.defaultBrandLists = data.map((el, index) => {
-                        el.isChecked = false;
+                        if(_self.hrefBrandId && _self.hrefBrandId == el.id){
+                            el.isChecked = true;
+                        }else{
+                            el.isChecked = false;
+                        }
                         return el;
                     })
                     _self.brandLists = _self.defaultBrandLists.slice(0,8)
-                    console.log('品牌=============>', this.brandLists)
                 }else {
                     console.log('查询品牌列表异常')
                 }
             });
         },
+        choiceBrandHref: function (brand, index) {// PC端品牌跳转链接
+            var url = '/product/classify-'+this.typeSort+'-'+this.bigTypeId+'-'+this.smallTypeId+'-'+this.tinyTypeId+'-1-'+this.params.pageSize+'-'+this.params.sortField+'-'+this.params.sortType+'.html?bpn=' + brand.id + '&pro=' + this.params.promotionFlag +'&newg='+ this.params.newFlag;
+            window.location.href =  url;
+        },
         choiceBrand:function(brand,index){// 选择品牌
             var _self = this;
             brand.isChecked = !brand.isChecked
             if (brand.isChecked) {
-                _self.checkedBrandList.push(brand)
+                _self.checkedBrandList.push(brand.id)
             } else {
                 _self.checkedBrandList.splice(index, 1)
             }
             _self.checkedBrandLength = _self.checkedBrandList.length
-            console.log('checkedBrandList', _self.checkedBrandList)
+            _self.params.brandIds = this.checkedBrandList.join(',')
         },
         showMoreItem:function(){// 点击更多品牌
             this.isShowAllBrands = !this.isShowAllBrands;
+            this.brandLists = this.defaultBrandLists;
         },
         hanldCheckedActivi:function(){// 选择促销商品选项
             this.isActiviChecked = !this.isActiviChecked;
             if(this.isActiviChecked){
-                this.listQuery.promotionFlag = 1
+                this.params.promotionFlag = 1
             }else{
-                this.listQuery.promotionFlag = 0
+                this.params.promotionFlag = 0
             }
         },
         hanldCheckedNews:function(){// 选择新品选项
             this.isNewsChecked = !this.isNewsChecked;
             if(this.isNewsChecked){
-                this.listQuery.newFlag = 1
+                this.params.newFlag = 1
             }else{
-                this.listQuery.newFlag = 0
+                this.params.newFlag = 0
             }
         },
+        hanldCheckedActiviHref(){// 选择促销商品选项跳转链接(PC专用)
+            var promotionFlag = this.isActiviChecked ? 0 : 1;
+            var url =  '/product/classify-'+this.typeSort+'-'+this.bigTypeId+'-'+this.smallTypeId+'-'+this.tinyTypeId+'-1-'+this.params.pageSize+'-'+this.params.sortField+'-'+this.params.sortType+'.html?bpn='+this.hrefBrandId+ '&pro='+promotionFlag+'&newg='+ this.params.newFlag;
+            console.log('url==========>',url)
+            window.location.href = url;
+        },
+        hanldCheckedNewsHref(){// 选择新品选项跳转链接(PC专用)
+            var newFlag = this.isNewsChecked ? 0 : 1;
+            var url =  '/product/classify-'+this.typeSort+'-'+this.bigTypeId+'-'+this.smallTypeId+'-'+this.tinyTypeId+'-1-'+this.params.pageSize+'-'+this.params.sortField+'-'+this.params.sortType+'.html?bpn='+this.hrefBrandId+ '&pro=' + this.params.promotionFlag+'&newg='+newFlag;
+            console.log('url==========>',url)
+            window.location.href = url;
+        },
         showIsProductScreen:function(){//
             this.isProductScreen = true;
         },
         handleConfirmScreen:function(){// 确定筛选项
-            this.isProductScreen = false;
-            this.params.pageNum = 1;
-            this.getListByKeyword();
+            if (GLOBAL_USER_ID && GLOBAL_USER_ID>0) {
+                this.params.pageNum = 1;
+                this.listData = [];
+                this.getproductList();
+                this.isProductScreen = false;
+            }else{
+                var url =  '/product/classify-'+this.typeSort+'-'+this.bigTypeId+'-'+this.smallTypeId+'-'+this.tinyTypeId+'-1-'+this.params.pageSize+'-'+this.params.sortField+'-'+this.params.sortType+'.html?bpn='+this.params.brandIds+ '&pro=' + this.params.promotionFlag+'&newg='+this.params.newFlag;
+                console.log('url============>',url)
+                window.location.href = url;
+            }
         }
     },
     created:function () {
@@ -187,19 +218,35 @@ var productList = new Vue({
         this.params.pageNum = paramsArr.length>=6 ? paramsArr[5]*1 : 1;
         this.params.sortField= paramsArr.length>=8 ? paramsArr[7] : "";
         this.params.sortType = paramsArr.length>=9 ? paramsArr[8]*1 : 1;
+        this.hrefBrandId = getUrlParam("bpn") ? getUrlParam("bpn") : null; //bpn 品牌链接参数
+        this.params.promotionFlag = getUrlParam("pro") ? getUrlParam("pro")*1 : 0; // pro 促销商品链接参数
+        this.params.newFlag = getUrlParam("newg") ? getUrlParam("newg")*1 : 0; // newg 新品链接参数
+        if(this.hrefBrandId){
+            this.params.brandIds = this.hrefBrandId +',';
+        }
+        if(this.params.promotionFlag == 1){
+            this.isActiviChecked = true;
+        }else{
+            this.isActiviChecked = false;
+        }
+        if(this.params.newFlag == 1){
+            this.isNewsChecked = true;
+        }else{
+            this.isNewsChecked = false;
+        }
     },
     mounted:function () {
         var _self = this;
         this.listRecord = $('#productCount').val() ? $('#productCount').val()*1 : 0;
         if (this.bigTypeId && this.smallTypeId && this.tinyTypeId) {
-            this.params.id=this.tinyTypeId;
-            this.params.idType = 3;
+            this.params.id= this.brandParam.id = this.tinyTypeId;
+            this.params.idType = this.brandParam.idType = 3;
         } else if (this.bigTypeId && this.smallTypeId) {
-            this.params.id=this.smallTypeId;
-            this.params.idType = 2;
+            this.params.id= this.brandParam.id = this.smallTypeId;
+            this.params.idType = this.brandParam.idType = 2;
         } else {
-            this.params.id=this.bigTypeId;
-            this.params.idType = 1;
+            this.params.id= this.brandParam.id = this.bigTypeId;
+            this.params.idType = this.brandParam.idType = 1;
         }
         if (GLOBAL_USER_ID && GLOBAL_USER_ID>0) {
             _self.getproductList();
@@ -210,6 +257,8 @@ var productList = new Vue({
                 $("img[data-original]").lazyload();
             });
         }
+        // 获取对应品牌列表
+        this.getCommoditySearchQUeryBrand();
         if(!isPC){
             $('footer').addClass("noneImportant");
             //移动端上垃加载更多

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

@@ -25,6 +25,7 @@
                 <div class="crumbs-nav-item" th:if="not${#strings.isEmpty(bigTypeName)}" th:text="${bigTypeName}"></div>
                 <div class="crumbs-nav-item on" th:if="not${#strings.isEmpty(smallTypeName)}" th:text="${smallTypeName}"></div>
                 <div class="crumbs-nav-item on" th:if="not${#strings.isEmpty(tinyTypeName)}" th:text="${tinyTypeName}"></div>
+                <div class="crumbs-nav-item on" th:if="not${#strings.isEmpty(tinyTypeName)}" th:text="${tinyTypeName}"></div>
             </div>
         </div>
         <div id="listClassify">
@@ -63,11 +64,11 @@
                 </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' : ''">
+                         @click="choiceBrandHref(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">{{
+                <div class="product-brand-more" v-if="defaultBrandLists.length>8" :class="isShowAllBrands ? 'show' : ''" @click="showMoreItem">{{
                     isShowAllBrands ? '收起' : '更多' }} <i class="icon mIcon"></i></div>
             </div>
         </template>
@@ -94,7 +95,7 @@
                             <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">{{
+                    <div class="product-brand-more" v-if="defaultBrandLists.length>8" :class="isShowAllBrands ? 'show' : ''" @click="showMoreItem">{{
                         isShowAllBrands ? '收起' : '查看全部' }} <i
                                 class="icon mIcon"></i></div>
                     <div class="product-screen-btn" @click="handleConfirmScreen">
@@ -135,11 +136,11 @@
                         </template>
                 </ul>
                 <div class="sortBox-checked" v-if="isPC">
-                    <div class="sortBox-new" @click="hanldCheckedActivi">
+                    <div class="sortBox-new" @click="hanldCheckedActiviHref">
                         <span class="coll-checked" :class="[isActiviChecked ? 'checked': '']"></span>
                         <span>促销商品</span>
                     </div>
-                    <div class="sortBox-new" @click="hanldCheckedNews">
+                    <div class="sortBox-new" @click="hanldCheckedNewsHref">
                         <span class="coll-checked" :class="[isNewsChecked ? 'checked': '']"></span>
                         <span>新品</span>
                     </div>

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

@@ -86,12 +86,13 @@
                     <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' : ''">
+                    <div class="brand-list" @click="choiceBrandHref(brand, index)" v-for="(brand,index) in brandLists"
+                         :key="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">{{
+                <div class="product-brand-more" v-if="defaultBrandLists.length>8" :class="isShowAllBrands ? 'show' : ''"
+                     @click="showMoreItem">{{
                     isShowAllBrands ? '收起' : '更多' }} <i class="icon mIcon"></i></div>
             </div>
         </template>
@@ -118,7 +119,7 @@
                             <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">{{
+                    <div class="product-brand-more" v-if="defaultBrandLists.length>8" :class="isShowAllBrands ? 'show' : ''" @click="showMoreItem">{{
                         isShowAllBrands ? '收起' : '查看全部' }} <i
                                 class="icon mIcon"></i></div>
                     <div class="product-screen-btn" @click="handleConfirmScreen">
@@ -160,11 +161,11 @@
                 </template>
             </ul>
             <div class="sortBox-checked" v-if="isPC">
-                <div class="sortBox-new" @click="hanldCheckedActivi">
+                <div class="sortBox-new" @click="hanldCheckedActiviHref">
                     <span class="coll-checked" :class="[isActiviChecked ? 'checked': '']"></span>
                     <span>促销商品</span>
                 </div>
-                <div class="sortBox-new" @click="hanldCheckedNews">
+                <div class="sortBox-new" @click="hanldCheckedNewsHref">
                     <span class="coll-checked" :class="[isNewsChecked ? 'checked': '']"></span>
                     <span>新品</span>
                 </div>