add

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

@@ -8,16 +8,16 @@
     .sortBox .down:after{border-width:5px 5px 0 5px;border-color:#BEC2C9 transparent transparent transparent;top:31px}
     .sortBox .down.up:before{border-bottom-color:#E15616}
     .sortBox .down.up:after{border-top-color:#E15616;opacity:.3}
-    .classifyBox .classification div{display: inline-block;line-height: 64px;text-align: center;color: #4a4f58;font-size: 16px;cursor: pointer;}
-    .classifyBox .classification {border-bottom: 1px solid #f7f7f7;}
-    .classifyBox .classification .class-title{border-right: 1px solid #f7f7f7;width: 127px;}
-    .classifyBox .classification .class-nav-main{}
+    .classifyBox .classification .class-nav-main div{text-align: center;display: inline-block;line-height: 64px;color: #4a4f58;font-size: 16px;cursor: pointer;padding: 0 16px;}
+    .classifyBox .classification {border-bottom: 1px solid #f7f7f7;align-items: center;display: -webkit-flex;}
+    .classifyBox .classification .class-title{width: 127px;text-align: center;font-size: 16px;}
+    .classifyBox .classification .class-nav-main{width:1040px;display: inline-block;border-left: 1px solid #f7f7f7;}
     .classifyBox .classification .class-nav-main div.on{color: #e15616;}
-    .classifyBox .classification .class-nav-main div{width: 127px;}
     .crumbs-nav >div{display: inline-block}
     .crumbs-nav-item{display: inline-block;padding: 0 12px;border: 1px solid #cccccc;line-height: 24px;margin-right: 16px;color: #909090;border-radius: 2px;cursor: pointer;}
     .crumbs-nav-item.on{color: #e15616;border: 1px solid #e15616;}
-    .sortBox div.on{background:#ffe6dc;color: #e15616 }
+    .sortBox .on{background:#ffe6dc }
+    .classifyBox .classification.sortBox .class-nav-main div{border-right: 1px solid #f7f7f7;width: 127px;padding: 0;}
     .list-container{margin-top: 32px;width: 1200px;}
     .list-container ul li.productItem {width: 184px;height: 288px;float: left;background: #fff;position: relative;margin: 0 16px 16px 0;overflow: hidden;float: left;}
     .list-container ul li img {width: 100%;height: 184px;}

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

@@ -2,35 +2,48 @@
     #productList{width: 1184px;margin:32px auto}
     .crumbs-nav{height: 40px}
     .crumbs-nav .crumbs-link{color:#4a4f58 }
-    .sortBox .down{position:relative;margin:0 8px}
-    .sortBox .down:before,.sortBox .down:after{position:absolute;right:32px;content:'';width:0;height:0;border-style:solid}
-    .sortBox .down:before{border-width:0 5px 5px 5px;border-color:transparent transparent #BEC2C9 transparent;top:25px}
-    .sortBox .down:after{border-width:5px 5px 0 5px;border-color:#BEC2C9 transparent transparent transparent;top:31px}
-    .sortBox .down.up:before{border-bottom-color:#E15616}
-    .sortBox .down.up:after{border-top-color:#E15616;opacity:.3}
-    .classifyBox .classification div{
+    .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:23px}
+    .sortBox li:after{border-width:5px 5px 0 5px;border-color:#BEC2C9 transparent transparent transparent;top:30px}
+    .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}
+    .classification .class-nav-main div,.classification .class-nav-main li{
+        text-align: center;
         display: inline-block;
         line-height: 64px;
-        text-align: center;
         color: #4a4f58;
         font-size: 16px;
         cursor: pointer;
+        padding: 0 16px;
+    }
+    #listClassify{
+        margin: 0 auto;
+        box-sizing: border-box;
+        background: rgba(255,255,255,1);
+        border-radius: 0 0 2px 2px;
     }
-    .classifyBox .classification {
+     .classification {
         border-bottom: 1px solid #f7f7f7;
+        align-items: center;
+        display: -webkit-flex;
     }
-    .classifyBox .classification .class-title{
-        border-right: 1px solid #f7f7f7;
+    .classification .class-title{
         width: 127px;
+        text-align: center;
+        font-size: 16px;
+        line-height: 64px;
     }
-    .classifyBox .classification .class-nav-main{
+    .classification .class-nav-main{
+        width:1040px;
+        display: inline-block;
+        border-left: 1px solid #f7f7f7;
     }
-    .classifyBox .classification .class-nav-main div.on{
+    .classification .class-nav-main div.on{
         color: #e15616;
     }
-    .classifyBox .classification .class-nav-main div{
-        width: 127px;
-    }
     .crumbs-nav >div{display: inline-block}
     .crumbs-nav-item{
         display: inline-block;
@@ -47,6 +60,13 @@
         border: 1px solid #e15616;
     }
     .sortBox .on{background:#ffe6dc }
+    .classification.sortBox .class-nav-main li{
+        border-right: 1px solid #f7f7f7;
+        width: 127px;
+        padding: 0;
+        position: relative;
+    }
+
     .list-container{
         margin-top: 32px;
         width: 1200px;
@@ -106,6 +126,10 @@
     .productItem .image .icon{
         position: inherit;
     }
+    .sortBox li.on, .sortBox li.up, .sortBox li.down {
+        background: #FFE6DC;
+        color: #E15616;
+    }
 }
 
 

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

@@ -427,7 +427,7 @@
 @media screen and (max-width:768px) {
     .section_container_right{
         position: absolute;
-        top: 27vw;
+        top: 26vw;
         width: 100%;
         background: #fff;
         padding: 3.2vw 0;

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

@@ -10,8 +10,20 @@ var ProductApi = {
                 callback(res);
             });
         },
-        GetProductList: function (params, callback) {//仪器/产品- 商品列表
-            Http.AjaxService({ url:'/product/listByTypeID', type:'get', data:params, json:true})
+        GetProductList: function (params, callback) {//仪器/产品- 一级商品列表
+            Http.AjaxService({ url:'/search/query/product/bigType', type:'get', data:params, json:true})
+            .then(function(res){
+                callback(res);
+            });
+        },
+        GetProductsmallList: function (params, callback) {//仪器/产品- 二级商品列表
+            Http.AjaxService({ url:'/search/query/product/smallType', type:'get', data:params, json:true})
+            .then(function(res){
+                callback(res);
+            });
+        },
+        GetProducttinyList: function (params, callback) {//仪器/产品- 三级商品列表
+            Http.AjaxService({ url:'/search/query/product/tinyType', type:'get', data:params, json:true})
             .then(function(res){
                 callback(res);
             });

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

@@ -112,7 +112,7 @@ var productList = new Vue({
             userIdentity: 3,
             },
         ],
-         termsName:'',
+         bigName:'',
          smallName:'',
          tinyName:'',
          bigTypeID:'',
@@ -121,6 +121,8 @@ var productList = new Vue({
          termsNameflag:false,
          tinyflag:false,
          smallflag:false,
+         listRecord: 0,
+         pageInput: '1',
           params: {
             userId:0,
             pageSize: 0,
@@ -130,14 +132,32 @@ var productList = new Vue({
             tinyTypeID:0,
             sortType:2,
             source:'www',
-
         },
-
+    },
+     computed: {
+        pageTotal: function () {
+            var total = Math.ceil(this.listRecord / this.params.pageSize);
+            return total > 0 ? total : 1;
+        },
+        showPageBtn: function () {
+            var total = Math.ceil(this.listRecord / this.params.pageSize);
+            total = total > 0 ? total : 1;
+            var index = this.params.pageNum, arr = [];
+            if (total <= 6) {
+                for (var i = 1; i <= total; i++) {
+                    arr.push(i);
+                }
+                return arr;
+            }
+            if (index <= 3) return [1, 2, 3, 4, 5, 0, total];
+            if (index >= total - 2) return [1, 0, total - 4, total - 3, total - 2, total - 1, total];
+            return [1, 0, index - 2, index - 1, index, index + 1, index + 2, 0, total];
+        }
     },
     methods:{
     getclassify:function(){
         var _self = this;
-        ProductApi.GetbigTypeclassify({source:'www',bigTypeID:_self.params.bigTypeID},function (res) {
+        ProductApi.GetbigTypeclassify({source:_self.params.source,bigTypeID:_self.params.bigTypeID},function (res) {
             if(res.code==0){
                 _self.smalltypeList = res.data;
             }else {
@@ -169,7 +189,7 @@ var productList = new Vue({
             this.tinyName = ''
         },
         oneclass:function (item) {//选择一及分类
-            this.termsName=item.name;
+            this.bigName=item.name;
             this.smallName = '';
             this.params.bigTypeID = item.bigTypeID;
             this.termsNameflag = true;

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

@@ -1,7 +1,7 @@
  var instrueMent = new Vue({
     el:'#instrueMent',
     data:{
-        categorylist:[ ],
+        categorylist:[],
         hotlist:[
             {name:'玻尿酸',value:'0'},
             {name:'械字号',value:'1'},
@@ -16,6 +16,7 @@
          productList:[],
          recommends: [],
          userId:0,
+         typeSort:'',
          moreflag:true,
          showflag:false,
     },
@@ -37,20 +38,13 @@
             }
         },
         toserch:function(item){
-        window.location.href='/product/instruelist.html?bigTypeID='+item.bigTypeID
+            window.location.href='/product/instruelist.html?bigTypeID='+item.bigTypeID
         },
         seeMore:function(){
             this.moreflag = false
         },
          getClassify: function(){
             var _self = this;
-            PublicApi.GetProductClassify({typeSort:2,source:'www'},function (res) {
-                if (res.code==0){
-                    _self.categorylist = res.data;
-                }else {
-                     CAIMEI.Alert(res.msg, '确定', false);
-                }
-            })
             $.getJSON(spiServer+"/home/recommend").done(function (r) {
                 if (r.code === 0 && r.data) {
                     _self.recommends = r.data;
@@ -107,6 +101,8 @@
         if(userInfo){
             this.userId = JSON.parse(userInfo).userId;
         }
-    this.getClassify();
+        this.typeSort = getUrlParam('id');
+
+        this.getClassify();
     },
  })

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

@@ -1,52 +1,14 @@
 var productList = new Vue({
     el:'#productList',
     data:{
+        userId:0,
         searchFlag: false,
         listLoading: true,
         requestFlag: true,
         noMore: false,
-        classify:[
-            {
-                name:'面部抗衰',
-                smallTypeID:'1001',
-                tinytypeList:[
-                    { name: "高端护理",smallTypeID:'101'},
-                    { name: "高端护理",smallTypeID:'102'},
-                    { name: "高端护理",smallTypeID:'103'},
-                    { name: "高端护理",smallTypeID:'104'},
-                    { name: "高端护理",smallTypeID:'105'},
-                ]},
-            {
-                name:'瘦身塑形',
-                smallTypeID:'1002',
-                tinytypeList:[
-                    { name: "超声",smallTypeID:'2002'},
-                    { name: "射频",smallTypeID:'2003'},
-                    { name: "激光",smallTypeID:'2004'},
-                    { name: "高端护理",smallTypeID:'2005'},
-                    { name: "高端护理",smallTypeID:'2001'},
-                ]},
-            {
-                name:'产后修复',
-                smallTypeID:'1003',
-                tinytypeList:[
-                    { name: "修复",smallTypeID:'3003'},
-                    { name: "修复",smallTypeID:'3002'},
-                    { name: "修复",smallTypeID:'3004'},
-                    { name: "修复",smallTypeID:'3005'},
-                    { name: "修复",smallTypeID:'3001'},
-                ]},
-            {
-                name:'精油系列',
-                smallTypeID:'1004',
-                tinytypeList:[
-                    { name: "补水",smallTypeID:'4005'},
-                    { name: "保湿",smallTypeID:'4004'},
-                    { name: "保湿",smallTypeID:'4003'},
-                    { name: "保湿",smallTypeID:'4002'},
-                    { name: "补水",smallTypeID:'4001'},
-                ]},
-        ],
+        classify:[],
+        smalltypeList:[],//二级分类
+        tinytypeList:[],//三级分类
         listData:[
             {
                 actStatus: 1,
@@ -151,35 +113,36 @@ var productList = new Vue({
                 userIdentity: 3,
             },
         ],
-        termsName:'',
-        twoclassName:'',
-        smallTypeID:'',
-        twosmallTypeID:'',
-        tinytypeList:[],
+        bigName:'',
+        smallName:'',
+        tinyName:'',
+        bigTypeID:'',
+        smallTypeID:'',//二级分类id
+        tinyTypeID:'',//三级分类id
         termsNameflag:false,
-        twoclassflag:false,
+        tinyflag:false,
+        smallflag:false,
         listRecord: 0,
         pageInput: '1',
+        source:'www',
         params: {
-            size: 0,
-            num: 0,
-            keyword: "",
-            sortField: "",
+            id:'',
+            identity:GLOBAL_USER_IDENTITY,
+            sortField:'',
             sortType: 1, // 1降序，其他升序
-            bid: "",
-            sid: "",
-            tid: ""
+            pageSize: 24,
+            pageNum: 1,
         },
     },
     computed: {
         pageTotal: function () {
-            var total = Math.ceil(this.listRecord / this.params.size);
+            var total = Math.ceil(this.listRecord / this.params.pageSize);
             return total > 0 ? total : 1;
         },
         showPageBtn: function () {
-            var total = Math.ceil(this.listRecord / this.params.size);
+            var total = Math.ceil(this.listRecord / this.params.pageSize);
             total = total > 0 ? total : 1;
-            var index = this.params.num, arr = [];
+            var index = this.params.pageNum, arr = [];
             if (total <= 6) {
                 for (var i = 1; i <= total; i++) {
                     arr.push(i);
@@ -192,6 +155,84 @@ var productList = new Vue({
         }
     },
     methods:{
+        getclassify:function(){
+        var _self = this;
+        ProductApi.GetbigTypeclassify({source:_self.source,bigTypeID:_self.bigTypeID},function (res) {
+            if(res.code==0){
+                _self.smalltypeList = res.data;
+            }else {
+           CAIMEI.Alert(res.msg,'确定',false)
+            }
+        })
+    },
+        getproductList:function(){//一级商品列表
+           var _self=this;
+           ProductApi.GetProductList(_self.params,function (res) {
+               if( res.code==0){
+                     var result = JSON.parse(res.data);
+                      _self.listRecord = result.total;
+                       var resultData = setSearchProductList(result.items, _self.userId, function(){
+                            _self.$forceUpdate();
+                            setTimeout(function(){
+                                // 图片懒加载
+                                $("img[data-original]").lazyload();
+                            },500);
+                        });
+                        if(isPC){
+                            _self.listData = resultData;
+                        }else{
+                            _self.listData = _self.listData.concat(resultData);
+                        }
+                        console.log(_self.listData)
+               }else {
+                CAIMEI.Alert(res.msg,'确定',false)
+               }
+           })
+        },
+        getsmallList:function(){//二级商品列表
+            var _self=this;
+            ProductApi.GetProductsmallList(_self.params,function (res) {
+                 if( res.code==0){
+                    var result = JSON.parse(res.data);
+                      _self.listRecord = result.total;
+                      _self.listRecord = result.total;
+                       var resultData = setSearchProductList(result.items, _self.userId, function(){
+                            _self.$forceUpdate();
+                            setTimeout(function(){
+                                // 图片懒加载
+                                $("img[data-original]").lazyload();
+                            },500);
+                        });
+                        if(isPC){
+                            _self.listData = resultData;
+                        }else{
+                            _self.listData = _self.listData.concat(resultData);
+                        }
+                 }
+            })
+        },
+        gettinyList:function(){//三级商品列表
+            var _self=this;
+            ProductApi.GetProducttinyList(_self.params,function (res) {
+                 if( res.code==0){
+                    var result = JSON.parse(res.data);
+                      _self.listRecord = result.total;
+                      _self.listRecord = result.total;
+                       var resultData = setSearchProductList(result.items, _self.userId, function(){
+                            _self.$forceUpdate();
+                            setTimeout(function(){
+                                // 图片懒加载
+                                $("img[data-original]").lazyload();
+                            },500);
+                        });
+                        if(isPC){
+                            _self.listData = resultData;
+                        }else{
+                            _self.listData = _self.listData.concat(resultData);
+                        }
+                 }
+            })
+        },
         toPagination: function (pageNum) {
             if (pageNum <= this.pageTotal) {
                 var params = {pageNum: pageNum};
@@ -199,32 +240,102 @@ var productList = new Vue({
             }
         },
         toSortList: function (sortField, sortType) {
-            var params = {
-                sortfield: sortField,
-                sorttype: sortType
-            };
-            window.location.href = updateUrlParam(params);
+             this.params.sortField=sortField;
+             this.params.sortType = sortType;
+             this.getproductList();
         },
-        remove:function(){
-            this.twoclassflag = false;
+         removesmall:function(){//删除二级
+            this.smallName = '';
+        },
+        removetiny:function(){//删除三级分类
+            this.tinyName = ''
         },
         oneclass:function (item) {//选择一及分类
-            this.termsName=item.name;
-            this.smallTypeID = item.smallTypeID;
-            this.tinytypeList = item.tinytypeList;
-            this.termsNameflag = true
+            this.bigName=item.name;
+            this.smallName = '';
+            this.bigTypeID = item.bigTypeID;
+            this.params.id = item.bigTypeID;
+            this.termsNameflag = true;
+            this.getclassify();
+            this.getproductList();
         },
         twoclass:function (item) {//选择二级分类
-            this.twoclassName = item.name;
-            this.twosmallTypeID = item.smallTypeID;
-            this.twoclassflag = true;
+            this.smallName = item.name;
+            this.tinyName = '';
+            this.smallTypeID = item.smallTypeID;
+            this.params.id = item.smallTypeID;
+            this.smallflag = true;
+            this.tinytypeList =item.tinytypeList;
+            this.getsmallList();
+        },
+        tinyclass:function (item) {//选择三级分类
+            this.tinyName = item.name;
+            this.params.tinyTypeID = item.tinyTypeID;
+            this.tinyflag = true;
+            this.gettinyList();
         }
     },
     created:function () {
-        setTimeout(function(){
-            // 图片懒加载
-            $("img[data-original]").lazyload();
-        },500)
+        var userInfo = localStorage.getItem('userInfo');
+        if(userInfo){
+            this.userId = JSON.parse(userInfo).userId;
+        }
+    },
+    mounted:function () {
+        var _self = this;
+        this.bigTypeID = getUrlParam('bigTypeID');
+        this.params.id=this.bigTypeID;
+        PublicApi.GetProductClassify({typeSort:2,source:'www'},function (res) {
+                if (res.code==0){
+                    _self.classify = res.data;
+                    _self.classify.forEach(function (item) {
+                        if(_self.bigTypeID == item.bigTypeID){
+                            _self.bigName = item.name;
+                        }
+                    })
+                }else {
+                     CAIMEI.Alert(res.msg, '确定', false);
+                }
+            });
+        this.getclassify();
+        this.getproductList();
+        if(!isPC){
+            $('footer').addClass("noneImportant");
+            //移动端上垃加载更多
+            $(window).on('scroll', function(){
+                var scrollTop = $(this).scrollTop();
+                var scrollHeight = $(document).height();
+                var windowHeight = window.innerHeight;
+                if (scrollTop + windowHeight >= scrollHeight) {
+                    //此处是滚动条到底部时候触发的事件，在这里写要加载的数据，或者是拉动滚动条的操作
+                    var totalPage = Math.ceil(_self.listRecord / _self.params.size)?Math.ceil(_self.listRecord / _self.params.size):1;
+                    var next = _self.params.num+1;
+                    if(next <= totalPage){
+                        if (_self.requestFlag){
+                            _self.params.num = next;
+                            if (_self.searchFlag) {
+                                // 获取列表数据
+                                _self.getListByKeyword();
+                            } else {
+                                // 根据分类获取数据
+                                if (_self.params.tid && _self.params.tid>0) {
+                                    _self.getListByCategory("tinyType", _self.params.tid);
+                                } else if (_self.params.sid && _self.params.sid>0){
+                                    _self.getListByCategory("smallType", _self.params.sid);
+                                } else if (_self.params.bid && _self.params.bid>0) {
+                                    _self.getListByCategory("bigType", _self.params.bid);
+                                }
+                            }
+                        }
+                        _self.requestFlag = false;
+                    }else{
+                        //到底了
+                        _self.noMore = true;
+                        $('footer').removeClass("noneImportant");
+                    }
+                }
+            });
+        }
     }
 
 })

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

@@ -1,16 +1,7 @@
  var produceContainer = new Vue({
     el:'#produceContainer',
     data:{
-        classlyList:[
-            // {name:'中胚层产品',icon:'https://m.360buyimg.com/babel/jfs/t1/60778/37/9838/3066/5d7739faEd3b7dbb9/dd4d9ef7ce8fc169.png',keyword:'/product/produce-list.html'},
-            // {name:'中胚层产品',icon:'https://m.360buyimg.com/babel/jfs/t1/60778/37/9838/3066/5d7739faEd3b7dbb9/dd4d9ef7ce8fc169.png',keyword:'/product/produce-list.html'},
-            // {name:'中胚层产品',icon:'https://m.360buyimg.com/babel/jfs/t1/60778/37/9838/3066/5d7739faEd3b7dbb9/dd4d9ef7ce8fc169.png',keyword:'/product/produce-list.html'},
-            // {name:'中胚层产品',icon:'https://m.360buyimg.com/babel/jfs/t1/60778/37/9838/3066/5d7739faEd3b7dbb9/dd4d9ef7ce8fc169.png',keyword:'/product/produce-list.html'},
-            // {name:'中胚层产品',icon:'https://m.360buyimg.com/babel/jfs/t1/60778/37/9838/3066/5d7739faEd3b7dbb9/dd4d9ef7ce8fc169.png',keyword:'/product/produce-list.html'},
-            // {name:'中胚层产品',icon:'https://m.360buyimg.com/babel/jfs/t1/60778/37/9838/3066/5d7739faEd3b7dbb9/dd4d9ef7ce8fc169.png',keyword:'/product/produce-list.html'},
-            // {name:'中胚层产品',icon:'https://m.360buyimg.com/babel/jfs/t1/60778/37/9838/3066/5d7739faEd3b7dbb9/dd4d9ef7ce8fc169.png',keyword:'/product/produce-list.html'},
-            // {name:'中胚层产品',icon:'https://m.360buyimg.com/babel/jfs/t1/60778/37/9838/3066/5d7739faEd3b7dbb9/dd4d9ef7ce8fc169.png',keyword:'/product/produce-list.html'}
-            ],
+        classlyList:[],
         hotlist:[
             {name:'玻尿酸',type:'1',keyword:''},
             {name:'械字号',type:'1',keyword:''},
@@ -1163,6 +1154,7 @@
             }
         ],
         showflag:false,
+        sortType:'',
     },
      filters: {
          NumFormat:function(value) {//处理金额
@@ -1170,9 +1162,12 @@
          },
      },
     methods:{
+        toserch:function(item){
+              window.location.href='/product/produce-list.html?bigTypeID='+item.bigTypeID
+        },
         getClassify: function() {
             var _self = this;
-            PublicApi.GetProductClassify({typeSort: 1, source: 'www'}, function (res) {
+            PublicApi.GetProductClassify({typeSort:1, source: 'www'}, function (res) {
                 if (res.code == 0) {
                     _self.classlyList = res.data;
                 } else {
@@ -1211,6 +1206,7 @@
         if(userInfo){
             this.userId = JSON.parse(userInfo).userId;
         }
+        this.sortType = getUrlParam('id');
         this.getClassify();
     }
  });

src/main/resources/static/js/supplier-center/shop/release.js

@@ -182,9 +182,13 @@ var releaseContainer = new Vue({
                     _this.releaseParams.firstClassifyName = data.bigTypeName;
                     _this.releaseParams.twoClassifyName = data.smallTypeName;
                     _this.releaseParams.threeClassifyName = data.tinyTypeName;
+                    _this.releaseParams.commodityType =data.commodityType;
                     _this.releaseParams.brandName = data.brandName;
-                     _this.releaseParams.commodityType =data.commodityType;
                     _this.GoodsImagesList = _this.EchoGoodsImagesListFn(data.imageList);
+                    if(data.commodityType !=null){
+                        _this.releaseParams.commodityTyp = data.commodityType;
+                        _this.GetFistClassFn(_this.releaseParams.commodityTyp);
+                    }
                     if(data.searchKey != null){
                         _this.setSearchKeyArray(data.searchKey);
                     }

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

@@ -16,25 +16,25 @@
     <div class="crumbs-nav">
         <div class="crumbs-link"> 筛选条件： </div>
         <div  class="crumbs-nav-main">
-            <div class="crumbs-nav-item" v-if="termsNameflag">{{termsName}}</div>
+            <div class="crumbs-nav-item" v-if="termsNameflag">{{bigName}}</div>
             <div class="crumbs-nav-item on" @click="removesmall" v-if="smallName!=''">{{smallName}} x</div>
             <div class="crumbs-nav-item on" @click="removetiny" v-if="tinyName!=''">{{tinyName}} x</div>
         </div>
     </div>
-     <div  id="listClassify" class="classifyBox"  >
+     <div  id="listClassify" class="classifyBox">
         <div class="classification" >
             <div class="class-title">分类</div>
             <div class="class-nav-main">
                 <div v-for="item in classify" @click="oneclass(item)" :class="{'on':item.bigTypeID==params.bigTypeID}">{{item.name}}</div>
             </div>
         </div>
-        <div class="classification">
+        <div class="classification"  v-if="smalltypeList!=''">
             <div class="class-title">二级</div>
             <div class="class-nav-main">
                 <div v-for="item in smalltypeList" @click="twoclass(item)" :class="{'on':item.smallTypeID==params.smallTypeID}">{{item.name}}</div>
             </div>
         </div>
-         <div class="classification" v-if="params.smallTypeID!=''">
+         <div class="classification" v-if="params.smallTypeID!='' && tinytypeList!=''">
             <div class="class-title">三级</div>
             <div class="class-nav-main">
                 <div v-for="item in tinytypeList" @click="tinyclass(item)" :class="{'on':item.tinyTypeID==params.tinyTypeID}">{{item.name}}</div>
@@ -122,6 +122,21 @@
             </ul>
         </div>
     </template>
+    <!--分页-->
+    <div v-if="(!isPC) && noMore" class="noMore">---- 没有更多了 ----</div>
+    <div v-if="isPC && pageTotal>1" class="pageWrap clear">
+        <a v-if="params.pageNum>1" class="prev" @click="toPagination(params.pageNum*1-1)" href="javascript:void(0);"></a>
+        <template v-for="n in showPageBtn">
+            <a v-if="n" :class="{'on':(n==params.pageNum)}" @click="toPagination(n)" href="javascript:void(0);" v-text="n"></a>
+            <span v-else>···</span>
+        </template>
+        <a v-if="params.pageNum<pageTotal" class="next" @click="toPagination(params.pageNum*1+1)" href="javascript:void(0);"></a>
+        <span>共<b v-text="pageTotal>1?pageTotal:1"></b>页</span>
+        <span>跳至</span>
+        <input v-model="pageInput" @blur="checkNum()"/>
+        <span>页</span>&nbsp;
+        <a class="btn" href="javascript:void(0);" @click="toPagination(pageInput)">点击跳转</a>
+    </div>
 </div>
 <!-- 引入底部 -->
 <template th:replace="components/footer"></template>

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

@@ -12,71 +12,62 @@
 
 <!-- 商品列表 -->
 <div id="productList">
-    <template v-if="isPC">
-        <div class="crumbs-nav">
+        <div class="crumbs-nav" v-if="isPC">
             <div class="crumbs-link"> 筛选条件： </div>
             <div  class="crumbs-nav-main">
-                <div class="crumbs-nav-item" v-if="termsNameflag">{{termsName}}</div>
-                <div class="crumbs-nav-item on" @click="remove" v-if="twoclassflag">{{twoclassName}} x</div>
+                <div class="crumbs-nav-item" v-if="bigName !=''">{{bigName}}</div>
+                <div class="crumbs-nav-item on" @click="removesmall" v-if="smallName!=''">{{smallName}} x</div>
+                <div class="crumbs-nav-item on" @click="removetiny" v-if="tinyName!=''">{{tinyName}} x</div>
             </div>
         </div>
-        <div  id="listClassify" class="classifyBox">
+        <div id="listClassify">
+        <template v-if="isPC">
             <div class="classification">
                 <div class="class-title">分类</div>
                 <div class="class-nav-main">
-                    <div v-for="item in classify" @click="oneclass(item)" :class="{'on':item.smallTypeID==smallTypeID}">{{item.name}}</div>
+                    <div v-for="item in classify" @click="oneclass(item)" :class="{'on':item.bigTypeID==bigTypeID}">{{item.name}}</div>
                 </div>
             </div>
-            <div class="classification">
+            <div class="classification" v-if="smalltypeList!='' && smalltypeList!=null">
                 <div class="class-title">二级</div>
                 <div class="class-nav-main">
-                    <div v-for="item in tinytypeList" @click="twoclass(item)" :class="{'on':item.smallTypeID==twosmallTypeID}">{{item.name}}</div>
+                    <div v-for="item in smalltypeList" @click="twoclass(item)" :class="{'on':item.smallTypeID==smallTypeID}">{{item.name}}</div>
                 </div>
             </div>
-            <div class="sortBox classification">
-                <div class="class-title" :class="{'on':params.sortField == ''}" @click="toSortList('',1)">综合</div>
+            <div class="classification" v-if="params.smallTypeID!=''&& tinytypeList!=''&& tinytypeList!=null">
+                <div class="class-title">三级</div>
                 <div class="class-nav-main">
-                    <template>
-                        <div class="down" @click="toSortList('sales',0)"><span>销量</span></div>
-                    </template>
-                    <template>
-                        <div class="down" @click="toSortList('favorite',0)"><span>人气</span></div>
-                    </template>
-                    <template>
-                        <div class="down"  @click="toSortList('price',0)"><span>价格</span></div>
-                    </template>
+                    <div v-for="item in tinytypeList" @click="tinyclass(item)" :class="{'on':item.tinyTypeID==tinyTypeID}">{{item.name}}</div>
                 </div>
             </div>
+        </template>
+            <div class="sortBox classification">
+                <ul class="mfc class-nav-main">
+                    <li class="class-title" :class="{'on':params.sortField == ''}" @click="toSortList('',1)">综合</li>
+                        <template>
+                            <li v-if="params.sortField == 'sales' && params.sortType == 1" class="down"
+                            @click="toSortList('sales',0)"><span>销量</span></li>
+                            <li v-else-if="params.sortField == 'sales' && params.sortType == 0" class="up"
+                            @click="toSortList('sales',1)"><span>销量</span></li>
+                            <li v-else @click="toSortList('sales',0)"><span>销量</span></li>
+                        </template>
+                        <template>
+                             <li v-if="params.sortField == 'favorite' && params.sortType == 1" class="down"
+                            @click="toSortList('favorite',0)"><span>人气</span></li>
+                            <li v-else-if="params.sortField == 'favorite' && params.sortType == 0" class="up"
+                            @click="toSortList('favorite',1)"><span>人气</span></li>
+                            <li v-else @click="toSortList('favorite',0)"><span>人气</span></li>
+                        </template>
+                        <template>
+                             <li v-if="params.sortField == 'price' && params.sortType == 1" class="down"
+                            @click="toSortList('price',0)"><span>价格</span></li>
+                            <li v-else-if="params.sortField == 'price' && params.sortType == 0" class="up"
+                            @click="toSortList('price',1)"><span>价格</span></li>
+                            <li v-else @click="toSortList('price',0)"><span>价格</span></li>
+                        </template>
+                </ul>
+            </div>
         </div>
-     </template>
-     <template v-else>
-          <div class="sortBox">
-            <ul class="mfc">
-                <li :class="{'on':params.sortField == ''}" @click="toSortList('',1)">综合</li>
-                <template>
-                    <li v-if="params.sortField == 'sales' && params.sortType == 1" class="down"
-                        @click="toSortList('sales',0)"><span>销量</span></li>
-                    <li v-else-if="params.sortField == 'sales' && params.sortType == 0" class="up"
-                        @click="toSortList('sales',1)"><span>销量</span></li>
-                    <li v-else @click="toSortList('sales',0)"><span>销量</span></li>
-                </template>
-                <template>
-                    <li v-if="params.sortField == 'favorite' && params.sortType == 1" class="down"
-                        @click="toSortList('favorite',0)"><span>人气</span></li>
-                    <li v-else-if="params.sortField == 'favorite' && params.sortType == 0" class="up"
-                        @click="toSortList('favorite',1)"><span>人气</span></li>
-                    <li v-else @click="toSortList('favorite',0)"><span>人气</span></li>
-                </template>
-                <template>
-                    <li v-if="params.sortField == 'price' && params.sortType == 1" class="down"
-                        @click="toSortList('price',0)"><span>价格</span></li>
-                    <li v-else-if="params.sortField == 'price' && params.sortType == 0" class="up"
-                        @click="toSortList('price',1)"><span>价格</span></li>
-                    <li v-else @click="toSortList('price',0)"><span>价格</span></li>
-                </template>
-            </ul>
-        </div>
-     </template>
     <template>
         <div class="list-container">
             <ul class="clear mfw">
@@ -118,12 +109,12 @@
     <!--分页-->
     <div v-if="(!isPC) && noMore" class="noMore">---- 没有更多了 ----</div>
     <div v-if="isPC && pageTotal>1" class="pageWrap clear">
-        <a v-if="params.num>1" class="prev" @click="toPagination(params.num*1-1)" href="javascript:void(0);"></a>
+        <a v-if="params.pageNum>1" class="prev" @click="toPagination(params.pageNum*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.pageNum)}" @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.pageNum<pageTotal" class="next" @click="toPagination(params.pageNum*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()"/>
@@ -134,6 +125,7 @@
 <!-- 引入底部 -->
 <template th:replace="components/footer"></template>
 <template th:replace="components/foot-link"></template>
+<script charset="utf-8" type="text/javascript" th:src="@{/js/common/serviceapi/product.service.js(v=${version})}"></script>
 <script charset="utf-8" type="text/javascript" th:src="@{/js/product/produce-list.js(v=${version})}"></script>
 </body>
 </html>

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

@@ -13,10 +13,10 @@
     <div class="inner">
         <div class="section_container_left">
             <div class="section_container_nav">
-                <a :href="item.keyword" class="container_nav_item" v-for="(item,index) in classlyList">
+                <div class="container_nav_item" v-for="(item,index) in classlyList" @click="toserch(item)">
                     <div class="item_icon"><img :src="item.wwwIcon" alt=""></div>
                     <div class="item_text">{{ item.name }}</div>
-                </a>
+                </div>
             </div>
             <div class="section_page" v-for="(page,index) in pageList">
                 <div class="section_page_title">