搜索完成

components/main/Search.vue

@@ -4,7 +4,7 @@
       <template v-if="!isPcb">
         <div class="type">
           <span class="type-item" :class="{active: newSearchType == 'component'}" @click="setNewSearchType('component')">型号</span>
-          <span class="type-item" :class="{active: newSearchType == 'product'}" @click="setNewSearchType('product')">物料名称</span>
+          <span class="type-item" :class="{active: newSearchType == 'kind'}" @click="setNewSearchType('kind')">物料名称</span>
           <span class="type-item" :class="{active: newSearchType == 'store'}" @click="setNewSearchType('store')">卖家</span>
           <span class="type-item" :class="{active: newSearchType == 'brand'}" @click="setNewSearchType('brand')">品牌</span>
         </div>
@@ -40,9 +40,9 @@
         v-show="showAssociate"
         @mouseenter="associate.focus=true"
         @mouseleave="associate.focus=false">
-      <li v-for="(k, index) in similarKeywords.result" class="item"
+      <li v-for="(v, index) in similarKeywords.result" class="item"
           :class="{'active': index==associate.activeIndex}"
-          @click.stop.prevent="onAssociateClick(k)">{{k}}
+          @click.stop.prevent="onAssociateClick(v.value)">{{v.value}}
       </li>
      <!-- <li v-if="similarKeywords.data.brand && similarKeywords.data.brand.length > 0" class="similar-title">品牌：</li>
       <li v-for="(k, index) in similarKeywords.data.brand" class="item"
@@ -101,7 +101,7 @@
         searchType: 'product',
         // 新版搜索控制变量
         newSearchType: 'component',
-        isInit: true
+        isInit: false
       }
     },
     computed: {
@@ -112,7 +112,32 @@
         return this.$store.state.hotSearchBrand.hot.data
       },
       similarKeywords () {
-        return this.$store.state.search.keywords.data || {}
+        let list = []
+        let data = this.$store.state.search.keywords.data.result
+        if (data && data.length > 0) {
+          data.forEach(item => {
+            if (this.newSearchType === 'component' && item.code) {
+              list.push({
+                value: item.code
+              })
+            } else if (this.newSearchType === 'kind' && item.nameCn) {
+              list.push({
+                value: item.nameCn
+              })
+            } else if (this.newSearchType === 'store' && item.name) {
+              list.push({
+                value: item.name
+              })
+            } else if (this.newSearchType === 'brand' && item.nameEn) {
+              list.push({
+                value: item.nameEn
+              })
+            }
+          })
+        }
+        return {
+          result: list
+        }
       },
       showAssociate () {
         return this.keyword &&
@@ -157,7 +182,7 @@
           case 'brand':
             type = '品牌'
             break
-          case 'product':
+          case 'kind':
             type = '物料名称'
             break
           case 'store':
@@ -174,8 +199,7 @@
         handler (val, oldVal) {
           let keywords = this.similarKeywords
           if (!keywords.result || !keywords.result.length || this.associate.activeIndex === null || val !== keywords[this.associate.activeIndex]) {
-            this.onChange(this.isInit)
-            this.isInit = false
+            this.onChange()
           }
         }
       },
@@ -185,6 +209,7 @@
             this.newSearchType = route.query.type || 'component'
             this.keyword = route.query.w || ''
           }
+          this.isInit = true
         },
         immediate: true
       }
@@ -221,19 +246,21 @@
           this.keyword = keywords[index]
         }
       },
-      onChange (isInit) {
-        if (!isInit) {
-          this.associate.activeIndex = null
-          if (!this.keyword) {
-            this.associate.show = false
-            this.$store.dispatch('resetSearchKeywords')
-          } else {
+      onChange () {
+        this.associate.activeIndex = null
+        if (!this.keyword) {
+          this.associate.show = false
+          this.$store.dispatch('resetSearchKeywords')
+        } else {
+          if (!this.isInit) {
             this.searchKeywords()
+          } else {
+            this.isInit = false
           }
-          if (this.click_flag) {
-            this.associate.show = false
-            this.click_flag = false
-          }
+        }
+        if (this.click_flag) {
+          this.associate.show = false
+          this.click_flag = false
         }
       },
       searchKeywords () {

components/search/BrandList.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="search-brand-list">
     <ul>
-      <li v-for="item in brands">
+      <nuxt-link :key="item.id" :to="`/search?w=${encodeURIComponent(item.nameEn)}&type=brand`" tag="li" v-for="item in brands">
         <div class="img inline-block">
           <img :src="item.logoUrl || '/images/component/default.png'" alt="">
         </div>
@@ -24,7 +24,7 @@
           </p>
         </div>
         <button>了解详情</button>
-      </li>
+      </nuxt-link>
     </ul>
   </div>
 </template>
@@ -32,7 +32,7 @@
   export default {
     computed: {
       brands () {
-        let brands = this.baseUtils.deepCopy(this.$store.state.searchData.searchList.listNew.data.brands) || []
+        let brands = this.baseUtils.deepCopy(this.$store.state.searchData.searchList.listNew.data.content) || []
         if (brands.length) {
           brands.forEach(item => {
             if (item.application && item.application !== '') {
@@ -63,7 +63,7 @@
         background: #fff;
         border: 1px solid #e2e2e2;
         img {
-          max-width: 206px;
+          max-width: 186px;
           max-height: 152px;
         }
       }
@@ -94,6 +94,7 @@
         width: 100px;
         height: 28px;
         text-align: center;
+        margin-left: 75px;
         &:hover {
           background: #2496f1;
           color: #fff;
@@ -101,6 +102,7 @@
       }
       &:hover {
         background: #ecf2fd;
+        cursor: pointer;
         .params {
           color: #2e91f0;
         }

components/search/ForwardGoodsList.vue

@@ -14,12 +14,12 @@
         <tr v-for="item in forwardGood.content">
           <td>
             <div class="line">
-              <span class="title inline-block">原厂型号</span>
+              <span class="title inline-block">型号</span>
               <span class="content inline-block" :title="item.code" v-text="item.code || '-'"></span>
             </div>
             <div class="line">
               <span class="title inline-block">品牌</span>
-              <span class="content inline-block" :title="item.brand.nameEn">{{item.brand.nameEn || '-'}}</span>
+              <span class="content inline-block" :title="item.pbrand || item.pbranden">{{item.pbrand || item.pbranden ||  '-'}}</span>
             </div>
           </td>
           <td class="single">
@@ -31,7 +31,7 @@
           <td>
             <div class="line">
               <span class="title inline-block">物料名称(类目)</span>
-              <span class="content inline-block" :title="item.kind.nameCn">{{item.kind.nameCn || '-'}}</span>
+              <span class="content inline-block" :title="item.kind || item.kinden">{{item.kind || item.kinden || '-'}}</span>
             </div>
             <div class="line">
               <span class="title inline-block">单位</span>

components/search/GoodList.vue

@@ -64,10 +64,10 @@
           <!--</td>-->
             <td class="brand-code">
               <img v-if="item.status === 602" class="sellout-flag" src="/images/search/sellout-search.png" alt="">
-              <div class="brand" v-if="item.brand&&item.brand.nameEn"><nuxt-link :to="`/product/brand/${item.brand.uuid}`" class="text-num" v-text="item.brand.nameEn"></nuxt-link></div>
+              <div class="brand" v-if="item.branduuid"><nuxt-link :to="`/product/brand/${item.branduuid}`" class="text-num" v-text="item.brandNameCn || item.brandNameEn || '-'"></nuxt-link></div>
               <div class="brand" v-if="!item.brand||!item.brand.nameEn">{{item.brandEn||'—'}}</div>
-              <div class="brand"  v-if="item.kind&&item.kind.nameCn"><nuxt-link :to="`/product/kind/${item.kindid}`" v-text="item.kind.nameCn"></nuxt-link></div>
-              <div class="brand" v-if="!item.kind||!item.kind.nameCn">{{item.kindName || '—'}}</div>
+              <div class="brand" v-if="item.kindUuid"><nuxt-link :to="`/product/kind/${item.kindUuid}`" v-text="item.kindNameCn"></nuxt-link></div>
+              <div class="brand" v-if="!item.kindUuid">{{item.kindNameCn || '—'}}</div>
               <div class="code"  v-if="item.code">
                 <nuxt-link v-if="item.uuid" :to="`/product/component/${item.uuid}`" class="f16 text-bold text-num" v-text="item.code"></nuxt-link>
                 <span v-if="!item.uuid">{{item.code}}</span>

components/search/SupplierList.vue

@@ -3,7 +3,7 @@
     <ul class="list-inline">
       <li class="clearfix" v-for="item in currentGoods.content" @click="goSup(item)">
         <div class="img">
-          <img :src="item.storeLogoUrl || item.logoUrl || '/images/all/default.png'">
+          <img :src="item.storeLogoUrl || item.enLogoUrl || item.logoUrl || '/images/all/default.png'">
           <!--<span class="has_shop"></span>-->
         </div>
         <div class="content">
@@ -21,7 +21,7 @@
             <span>行业：</span><span :title="item.enIndustry">{{item.enIndustry || '暂无信息'}}</span>
           </p>
         </div>
-        <div class="select_btn">{{item.storeUuid ? '进入店铺' : '了解详情'}}</div>
+        <div class="select_btn">{{resultType === 'current' ? '进入店铺' : '了解详情'}}</div>
       </li>
     </ul>
     <supplier-empty :showObj="showDialogObj"></supplier-empty>
@@ -57,9 +57,9 @@
       currentGoods () {
         if (this.goods) {
           if (this.resultType === 'current') {
-            return this.goods.stock
+            return this.goods.stock || {}
           } else {
-            return this.goods.futures
+            return this.goods.futures || {}
           }
         } else {
           return {}
@@ -68,8 +68,10 @@
     },
     methods: {
       goSup (item) {
-        if (item.storeUuid) {
-          this.$router.push(`/store/${item.storeUuid}`)
+        if (this.resultType === 'current') {
+          if (item.storeUuid) {
+            this.$router.push(`/store/${item.storeUuid}`)
+          }
         } else {
           this.$http.get('vendor/introduction/product/count', {params: {vendUU: item.enUU}})
             .then(res => {

pages/search/_keyword.vue

@@ -9,7 +9,7 @@
           @crnameFlagEvent="listenCrnameFlag"
     ></kind>-->
   <brand-detail :supBrandObj="goods.brand" v-if="searchType == 'brand' && goods.brand"></brand-detail>
-  <div class="search-result-type" v-if="!goods.brands">
+  <div class="search-result-type" v-if="!goods.content">
     <span class="inline-block" :class="{active: resultType == 'current'}" @click="setResultType('current')">现货({{stockTotal}}条)</span>
     <span class="inline-block" :class="{active: resultType == 'forward'}" @click="setResultType('forward')">期货({{futureTotal}}条)</span>
   </div>
@@ -22,14 +22,18 @@
     ></good-list>
     <forward-goods-list v-else></forward-goods-list>
   </template>
-  <template v-if="searchType == 'product' || searchType == 'store' || (searchType == 'brand' && goods.brand)">
-    <supplier-list></supplier-list>
+  <template v-if="searchType == 'kind' || searchType == 'store' || (searchType == 'brand' && goods.brand)">
+    <supplier-list :resultType="resultType"></supplier-list>
   </template>
   <template v-if="searchType == 'brand' && !goods.brand">
     <brand-list></brand-list>
   </template>
   <page :total="currentCount" :page-size="pageSize"
         :current="nowPage" @childEvent="listenPage"></page>
+  <div class="empty" v-if="currentCount === 0">
+    <img src="/images/all/empty-cart.png" alt="">
+    <span>暂无搜索结果</span>
+  </div>
 </div>
 </template>
 <script>
@@ -57,7 +61,7 @@
     },
     fetch ({store, route}) {
       return Promise.all([
-        store.dispatch('searchData/searchForListNew', {count: 10, filter: {}, keyword: route.query.w, page: 1, type: route.query.type || 'component'})
+        store.dispatch('searchData/searchForListNew', {count: 10, keyword: route.query.w, page: 1, type: route.query.type || 'component'})
       ])
     },
     components: {
@@ -98,7 +102,7 @@
       },
       // 当前分页数
       currentCount () {
-        if (this.goods.brands) {
+        if (this.goods.content) {
           return this.goods.total
         } else {
           return this.resultType === 'current' ? this.stockTotal : this.futureTotal
@@ -106,7 +110,7 @@
       },
       // 总数
       count () {
-        if (this.goods.brands) {
+        if (this.goods.content) {
           return this.goods.total
         } else {
           return this.stockTotal + this.futureTotal
@@ -114,6 +118,10 @@
       }
     },
     methods: {
+      initParams: function () {
+        this.resultType = 'current'
+        this.nowPage = 1
+      },
       reloadAll: function () {
         this.filter = {}
         this.sorting = {}
@@ -125,10 +133,17 @@
 //        this.reloadCrname()
       },
       reloadList: function () {
-        if (this.sorting === {}) {
-          this.sorting = {}
+        let params = {
+          count: this.pageSize,
+          keyword: this.$route.query.w,
+          page: this.nowPage,
+          type: this.searchType
+        }
+        if (this.searchType === 'component') {
+          params.filter = this.filter
+          params.sorting = this.sorting
         }
-        return this.$store.dispatch('searchData/searchForListNew', {count: this.pageSize, filter: this.filter, keyword: this.$route.query.w, page: this.nowPage, sorting: this.sorting, type: this.searchType})
+        return this.$store.dispatch('searchData/searchForListNew', params)
       },
 //      reloadKind: function () {
 //        if (!this.filter.goods_kindId) {
@@ -270,18 +285,32 @@
   }
 </script>
 <style lang="scss" scoped>
-  .search-result-type {
-    border-bottom: 2px solid #2e91f0;
-    span {
-      padding: 12px 37px;
-      color: #666;
-      font-size: 14px;
-      border: 1px solid #ccc;
-      cursor: pointer;
-      &.active {
-        color: #fff;
-        background: #2e91f0;
-        border-color: #2e91f0;
+  #searchResult {
+    margin-bottom: 36px;
+    .search-result-type {
+      border-bottom: 2px solid #2e91f0;
+      span {
+        padding: 12px 37px;
+        color: #666;
+        font-size: 14px;
+        border: 1px solid #ccc;
+        cursor: pointer;
+        &.active {
+          color: #fff;
+          background: #2e91f0;
+          border-color: #2e91f0;
+        }
+      }
+    }
+    .empty {
+      text-align: center;
+      height: 200px;
+      line-height: 200px;
+      border: 1px solid #e8e8e8;
+      margin-bottom: 10px;
+      span {
+        color: #999;
+        margin-left: 10px;
       }
     }
   }