添加后台数据，将品牌图片改为logo图片

components/mobile/Home.vue

@@ -29,21 +29,27 @@
         <div>
           <img src="/images/mobile/@2x/home/brand@2x.png" alt="1">
         </div>
-        <h2>4036万</h2>
+        <h2>
+          {{numbrand[0]}}
+        </h2>
         <p>品牌</p>
       </a>
       <a class="home-main-content">
         <div>
           <img src="/images/mobile/@2x/home/modelbrand@2x.png" alt="1">
         </div>
-        <h2>3250万</h2>
+        <h2>
+          {{numbrand[1]}}
+        </h2>
         <p>型号</p>
       </a>
       <a class="home-main-content">
         <div>
           <img src="/images/mobile/@2x/home/bookbrand@2x.png">
         </div>
-        <h2>926万</h2>
+        <h2>
+         {{numbrand[2]}}
+        </h2>
         <p>规格书</p>
       </a>
       <nuxt-link to="/mobile/shop" class="home-main-content">
@@ -97,7 +103,10 @@
         keyword: '',
         activeType: 'model',
         associate: '',
-        showStoreInfo: false
+        showStoreInfo: false,
+        isMore: false,
+        isShow: false,
+        len: 0
       }
     },
     props: {
@@ -120,10 +129,66 @@
         if (this.keyword) {
           this.$router.push({path: '/mobile/search?w=' + encodeURIComponent(this.keyword)})
         }
+      },
+      matNumber (num) {
+//        let re = /(\d+)(\d{3})/
+        if (num > 99999999) {
+          this.isShow = true
+          let str2 = num.toString()
+          num = Math.floor(num / 100000000)
+          if (parseInt(str2.charAt(str2.length - 8)) > 8) {
+            num = num + 1
+          }
+          num += '亿'
+        }
+        if (num > 9999) {
+          this.isMore = true
+          let str = num.toString()
+          num = Math.floor(num / 10000)
+          if (parseInt(str.charAt(str.length - 4)) > 4) {
+            num = num + 1
+          }
+          num += '万'
+        } else {
+          num += '个'
+        }
+//        let length = String(num).length
+//        this.len = length > 3 ? length + 1 : length
+//        num = (Array(7 - length).join(0) + num)
+//        while (re.test(num)) {
+//          num = num.replace(re, '$1，$2')
+//        }
+//        num = num.split('')
+        return num
+      },
+      forNum (numbers) {
+        let num = []
+        for (let i = 0; i < numbers.length; i++) {
+          num.push(this.matNumber(numbers[i].count))
+        }
+        return num
+      },
+      loadCounts () {
+        this.$store.dispatch('loadProductCounts', { _status: 'actived' })
       }
     },
     created () {
       this.$store.dispatch('resetSearchKeywords')
+    },
+    mounted () {
+      this.$nextTick(() => {
+        setInterval(() => {
+          this.loadCounts()
+        }, 30000)
+      })
+    },
+    computed: {
+      numbrand () {
+        return this.forNum(this.counts)
+      },
+      counts () {
+        return this.$store.state.product.common.counts.data
+      }
     }
   }
 </script>

components/mobile/search/brandList.vue

@@ -5,15 +5,36 @@
         <span>品牌墙</span>
         <span @click="onclick()">展开<i class="iconfont icon-arrow-down"></i></span>
       </div>
-      <div class="brand-list-item">
-        <img src="/images/component/default.png"/>
+      <div class="brand-list-item" :style="isShow?'max-height:2.1rem;':'min-height:2.1rem;'" >
+        <div v-for="item in brandList">
+          <nuxt-link to="/">
+            <img :src="item.logoUrl ||'/images/component/default.png'"/>
+          </nuxt-link>
+        </div>
       </div>
     </div>
   </div>
 </template>
 
 <script>
-    export default {}
+    export default {
+      name: 'brandList',
+      data () {
+        return {
+          isShow: true
+        }
+      },
+      computed: {
+        brandList () {
+          return this.$store.state.searchData.searchBrands.brands.data
+        }
+      },
+      methods: {
+        onclick () {
+          this.isShow = !this.isShow
+        }
+      }
+    }
 </script>
 
 <style scoped lang="scss">
@@ -25,8 +46,10 @@
     border-bottom:.02rem solid #dedfdf;
     width:7.1rem;
     min-height:3.02rem;
+    overflow: hidden;
     text-align: center;
     padding-top:.33rem;
+    padding-bottom:.33rem;
     .brand-list-top{
       span:first-child{
          font-size:.32rem;
@@ -38,13 +61,17 @@
       }
     }
     .brand-list-item{
-      justify-content: flex-start;
+      justify-content: space-between;
       flex-wrap: wrap;
-      display:flex;
+      display:inline-flex;
+      overflow: hidden;
+      margin:0 .2rem;
       img{
-        width:1.75rem;
-        height:.78rem;
+        width:1.57rem;
+        height:.77rem;
         margin-top:.2rem;
+        border-radius: .1rem;
+        border:.02rem solid #53a0f7;
       }
     }
   }

components/mobile/search/detailBrand.vue

@@ -1,10 +1,13 @@
 <template>
   <div class="detail-brand">
-    <div class="detail-brand-content">
+    <div class="detail-brand-content" >
       <h4>主营产品</h4>
       <div class="brand-list">
-        <img src="/images/component/default.png"/>
-        <p>陶瓷电容，多层陶瓷电容陶瓷电容，多层陶瓷电容,陶瓷电容，多层陶瓷电容陶瓷电容电容，多层陶电容瓷瓷电电容瓷电电容瓷电电容……</p>
+        <div class="list-left">
+          <img :src="brandDetail.logoUrl || '/images/component/default.png'" :alt="brandDetail.nameEn"/>
+          <span>{{brandDetail.nameCn}}</span>
+        </div>
+        <p>{{brandDetail.series}}</p>
       </div>
     </div>
 
@@ -12,7 +15,14 @@
 </template>
 
 <script>
-    export default {}
+    export default {
+      name: 'detailBrand',
+      computed: {
+        brandDetail () {
+          return this.$store.state.searchData.searchDetail.detail.data
+        }
+      }
+    }
 </script>
 
 <style scoped lang="scss">
@@ -33,13 +43,31 @@
     }
     .brand-list{
       display:flex;
-      img{
-        display:inline-block;
-        margin:0 .15rem;
+      justify-content: space-between;
+      align-items: center;
+      margin:0 .15rem;
+      .list-left{
+        border:.02rem solid #418ef7;
+        border-radius: .05rem;
         width:2.03rem;
         height:1.73rem;
+        img{
+          display:block;
+          width:100%;
+          height:1.25rem;
+        }
+        span{
+          display: block;
+          font-size: .24rem;
+          color:#fff;
+          text-align: center;
+          width:100%;
+          background: #418ef7;
+          line-height: .45rem;
+        }
       }
       p{
+        width:4.3rem;
         font-size:.28rem;
         line-height: .4rem;
         padding:.12rem .46rem 0 .05rem;

components/mobile/search/goodList.vue

@@ -16,6 +16,11 @@
 <script>
   export default {
     name: 'MobileGoodList',
+    data () {
+      return {
+        isMove: ''
+      }
+    },
     computed: {
       productList () {
         return this.$store.state.searchData.searchList.lists.data
@@ -30,28 +35,31 @@
     width:100%;
     min-height:1.5rem;
     padding-top:.2rem;
-  .brand-item{
-    width:7rem;
-    margin:0 auto;
-    border-radius:.1rem;
-    background: #fff;
-    padding:.2rem;
-    position:relative;
-  p{
-    font-size:.28rem;
-    line-height:.4rem;
-    color:#333;
-    margin:0;
-  span{}
-  }
-  i{
-    display:block;
-    position:absolute;
-    top:.2rem;
-    right:.1rem;
-    font-size:.4rem;
-    color:#ff7800;
-  }
-  }
+    .brand-item{
+      width:7rem;
+      margin:0 auto;
+      border-radius:.1rem;
+      background: #fff;
+      padding:.2rem;
+      position:relative;
+      p{
+        font-size:.28rem;
+        line-height:.4rem;
+        color:#333;
+        margin:0;
+        span{}
+      }
+      i{
+        display:block;
+        position:absolute;
+        top:.2rem;
+        right:.1rem;
+        font-size:.4rem;
+        color:#ff7800;
+      }
+    }
+    div.active{
+       background: #d4d;
+     }
   }
 </style>

nuxt.config.js

@@ -108,5 +108,5 @@ module.exports = {
     ssr: false
   }],
   /* TODO 暂时代理到商城测试版，之后再做出调整 */
-  proxyTable: ['/api/**', '/searchs/**', '/user/**', '/login/**', '/register/**', '/logout/**', '/static/**', '/vendor**', '/user**', '/trade/**', '/recommendation/**', '/store-service/**', '/basic/**', '/logout**', '/operation/**', '/help**', '/product**', '/store**', '/order/proxy**', '/report/**', '/store/**#/**', '/kdn/**', '/product/**Submit', '/admin**', '/product/**Submit/**', '/release/**', '/auth/store/**', '/produce/**', '/file**']
+  proxyTable: ['/api/**', '/search/**', '/user/**', '/login/**', '/register/**', '/logout/**', '/static/**', '/vendor**', '/user**', '/trade/**', '/recommendation/**', '/store-service/**', '/basic/**', '/logout**', '/operation/**', '/help**', '/product**', '/store**', '/order/proxy**', '/report/**', '/store/**#/**', '/kdn/**', '/product/**Submit', '/admin**', '/product/**Submit/**', '/release/**', '/auth/store/**', '/produce/**', '/file**']
 }

pages/mobile/search/_keycode.vue

@@ -4,8 +4,8 @@
       <span :class="activeType=='store'?'active':''" @click="activeType='store'">仅看有货</span>
       <span :class="activeType=='support'?'active':''" @click="activeType='support'">店铺自营</span>
     </div>
-    <brand-list v-if="activeType=='support'"></brand-list>
-    <detail-brand v-if="activeType=='store'"></detail-brand>
+    <brand-list></brand-list>
+    <detail-brand></detail-brand>
     <good-list></good-list>
   </div>
 </template>
@@ -25,13 +25,19 @@
     },
     fetch ({store, route}) {
       return Promise.all([
-        store.dispatch('searchData/searchForList', {count: 15, filter: {}, keyword: route.query.w, page: 1, sorting: {'GO_RESERVE': 'DESC', 'GO_SEARCH': 'DESC'}})
+        store.dispatch('searchData/searchForList', {count: 15, filter: {}, keyword: route.query.w, page: 1, sorting: {'GO_RESERVE': 'DESC', 'GO_SEARCH': 'DESC'}}),
+        store.dispatch('searchData/searchForBrands', {collectList: 'goods_brand', keyword: route.query.w, paramJSON: {}})
       ])
     },
     components: {
       BrandList,
       DetailBrand,
       GoodList
+    },
+    computed: {
+      brandDetail () {
+        return this.$store.state.searchData.searchDetail.detail.data
+      }
     }
   }
 </script>

pages/mobile/shop/index.vue

@@ -1,26 +1,27 @@
 <template>
   <div class="shop">
     <div class="shop-top">
-      <p><i class="iconfont icon-dianpu1"></i><span>{{list.numberOfElements}}</span>家店铺</p>
+      <p><i class="iconfont icon-dianpu1"></i><span>{{list.totalElements}}</span>家店铺</p>
       <span @click="onClick()">全部 <i class="iconfont icon-arrow-down"></i></span>
       <ul class="supdown" v-if="down">
-        <li>原厂</li>
-        <li>代理</li>
-        <li>经销</li>
+        <li @click="onDown('ORIGINAL_FACTORY')">原厂</li>
+        <li @click="onDown('AGENCY')">代理</li>
+        <li @click="onDown('DISTRIBUTION')">经销</li>
+        <li @click="onDown('ORIGINAL_FACTORY-DISTRIBUTION-AGENCY' )">全部</li>
       </ul>
     </div>
     <div class="shop-list" v-for="item in list.content">
       <h3>{{item.storeName}}</h3>
       <div class="list-item">
         <div class="item-img">
-          <i></i>
-          <img :src="item.bannerUrl || '/images/component/default.png'" alt="">
+          <i :style="'background:url(' + isType(item.type) + ')no-repeat 0 0/.65rem .33rem;'"></i>
+          <img :src="item.logoUrl || '/images/component/default.png'">
         </div>
         <div class="list-item-phone">
           <p>电话：<span>{{item.enterprise.enTel}}</span></p>
           <p>传真：<span>{{item.enterprise.enFax}}</span></p>
           <p>商家介绍： <nuxt-link :to="'/mobile/merchantDescription/'+item.uuid">点击查看</nuxt-link></p>
-          <i class="iconfont icon-shoucang" @click="callClick()"></i>
+          <i class="iconfont icon-shoucang" ></i>
         </div>
       </div>
     </div>
@@ -35,13 +36,12 @@
         page: '',
         count: '',
         types: '',
-        down: false,
-        callIcon: false
+        down: false
       }
     },
     fetch ({ store }) {
       return Promise.all([
-        store.dispatch('provider/findStoreList', { page: 1, count: 10, types: 'ORIGINAL_FACTORY' })
+        store.dispatch('provider/findStoreList', { page: 1, count: 10, types: 'ORIGINAL_FACTORY-DISTRIBUTION-AGENCY' })
       ])
     },
     computed: {
@@ -50,11 +50,24 @@
       }
     },
     methods: {
+      isType (type) {
+        let bgurl = ''
+        if (type === 'ORIGINAL_FACTORY') {
+          bgurl = '/images/mobile/@2x/shop/daili@2x.png'
+        }
+        if (type === 'DISTRIBUTION') {
+          bgurl = '/images/mobile/@2x/shop/jingxiao@2x.png'
+        }
+        if (type === 'AGENCY') {
+          bgurl = '/images/mobile/@2x/shop/yuangchang@2x.png'
+        }
+        return bgurl
+      },
       onClick () {
         this.down = !this.down
       },
-      callClick () {
-        this.callIcon = !this.callIcon
+      onDown (type) {
+        this.$store.dispatch('provider/findStoreList', { page: 1, count: 10, types: type })
       }
     }
   }
@@ -134,8 +147,6 @@
           position:absolute;
           width:.65rem;
           height:.33rem;
-          background: url(/images/mobile/@2x/shop/daili@2x.png)no-repeat;
-          background-size: .65rem .33rem;
         }
         img{
           display:inline-block;

pages/mobile/user/_uuid.vue

@@ -5,8 +5,9 @@
       <p>{{userName}}uu用户名</p>
       <span @click="onclick()">全部收藏 <i class="iconfont icon-arrow-down"></i></span>
       <ul class="supdown" v-if="down">
-        <li>店铺关注</li>
-        <li>器件收藏</li>
+        <li @click="onDown('ORIGINAL_FACTORY')">店铺关注</li>
+        <li @click="onDown('ORIGINAL_FACTORY')">器件收藏</li>
+        <li @click="onDown('ORIGINAL_FACTORY')">全部收藏</li>
       </ul>
     </div>
     <div class="shop-list">
@@ -44,6 +45,9 @@
     methods: {
       onclick () {
         this.down = !this.down
+      },
+      onDown () {
+
       }
     }
   }