二手商品列表

src/main/resources/static/css/flea-market/list.css

@@ -11,11 +11,11 @@
     .activeImg{opacity: 0.5;}
     .fabu {float: right;text-align: center;color: #e15616;border-bottom: 1px solid #e15616;height: 32px;margin-right: 30px}
     .fabu a {line-height: 40px;color: #e15616}
-    .mainTab {background: #fff;width:1184px;position: absolute;z-index: 1;}
+    .mainTab {background: #fff;width:1184px;height: 40px;float: left;}
     .Listitem:nth-of-type(4n) {margin-right: 0;}
     .mainTab li {height: 40px;line-height: 40px;text-align: center;color: #627386;cursor: pointer;width: 128px;float: left;}
     .mainTab li.addstyle {background: #ffe6dc;color: #e15616;}
-    .shopList {width: 1184px;margin: 20px auto;font-size: 0;}
+    .shopList {width: 1184px;margin: 20px auto;float:left;font-size: 0;}
     .Listitem {width: 284px;display: inline-block;margin: 0 16px 20px 0;}
     .itemImg {display: block;position: relative;width: 100%;height: 284px;margin-right: 20px;background-color: #fff;cursor: pointer;}
     .itemImg .bigImg {width: 100%;height: 100%;}

src/main/resources/static/js/flea-market/list.js

@@ -73,6 +73,7 @@ var fleaMarketList = new Vue({
          handle: function (index) {//一級分类
                var _this = this;
                _this.currentId = index;
+               _this.tabTitleName = '二手仪器';
                if ( _this.currentId == '1'){
                     _this.mainflag = true;
                }else {
@@ -81,13 +82,15 @@ var fleaMarketList = new Vue({
                }
                _this.gettabList();
           },
-           handleChild:function(item){ //二级分类
+         handleChild:function(item){ //二级分类
                var _this = this;
                _this.currentID2 = item.value;
-               _this.tabTitleName = item.name;
-                if (_this.currentID2==item.value){
-                    _this.mainflag=false;
-                }
+               if(!isPC){
+                   _this.tabTitleName = item.name;
+                   if (_this.currentID2==item.value){
+                       _this.mainflag=false;
+                   }
+               }
                _this.gettabList();
           },
            gettabList:function () {

src/main/resources/templates/flea-market/list.html

@@ -18,9 +18,15 @@
         </div>
         <template>
             <ul class="secondTitle " v-if="isPC">
-                <li class="ClassA icon" @click="handle('1')" :class="[currentId == '1' ? 'active':'',currentId == '1' ? 'jqSelect':'']">{{ tabTitleName }}</li>
-                <li class="ClassA icon" @click="handle('2')" :class="[currentId == '2' ? 'active':'',currentId == '2' ? 'jqSelect':'']">临期产品</li>
-                <li class="ClassA icon" @click="handle('3')" :class="[currentId == '3' ? 'active':'',currentId == '3' ? 'jqSelect':'']">其他</li>
+                <li class="ClassA icon" @click="handle('1')" :class="[currentId == '1' ? 'active':'',currentId == '1' ? 'jqSelect':'']">
+                    {{ tabTitleName }}
+                </li>
+                <li class="ClassA icon" @click="handle('2')" :class="[currentId == '2' ? 'active':'',currentId == '2' ? 'jqSelect':'']">
+                    临期产品
+                </li>
+                <li class="ClassA icon" @click="handle('3')" :class="[currentId == '3' ? 'active':'',currentId == '3' ? 'jqSelect':'']">
+                    其他
+                </li>
                 <li class="fabu">
                     <a href="/flea-market/form.html">我要发布</a>
                 <li/>