店铺、供应商、求购二级页面搜索统一增加搜索联想词

components/applyPurchase/ApplyInfo.vue

@@ -3,9 +3,8 @@
     <div class="apply-info-title">
       <p>最新求购信息</p>
       <span>海量求购，一网打尽</span>
-      <div>
-        <input type="text" class="form-control" v-model="keyWord" @keyup.13="searchList" :placeholder="user.logged ? '品牌/物料名称/型号/规格/公司' : '品牌/物料名称/型号/规格'" />
-        <span @click="searchList">搜索</span>
+      <div class="search">
+        <search-header :outerKeyword="searchKeyWord" :type="'purchase'" @searchAction="searchList" :placeholder="user.logged ? '公司/品牌/物料名称/型号/规格' : '品牌/物料名称/型号/规格'"></search-header>
       </div>
     </div>
     <div class="apply-info-list">
@@ -147,6 +146,7 @@
   </div>
 </template>
 <script>
+import SearchHeader from '~components/common/PcSearchHeader.vue'
 import Page from '~components/common/page/pageComponent.vue'
 import SayPrice from './SayPrice.vue'
 import Clipboard from 'clipboard'
@@ -163,7 +163,8 @@ export default {
       linkBoxIndex: -1,
       showShare: false,
       url: '',
-      Timer: {}
+      Timer: {},
+      searchKeyWord: ''
     }
   },
   filters: {
@@ -205,7 +206,7 @@ export default {
       return baseUtils.checkNullStr(str) ? str : '-'
     }
   },
-  components: { Page, SayPrice },
+  components: { Page, SayPrice, SearchHeader },
   computed: {
     storeInfo() {
       return this.$store.state.shop.storeInfo.store.data
@@ -326,7 +327,7 @@ export default {
       this.$store.dispatch('applyPurchase/loadPurchaseManList', {
         pageNumber: this.nowPage,
         pageSize: this.pageSize,
-        keyword: this.keyWord,
+        keyword: this.keyWord = this.searchKeyWord === '' ? null : this.searchKeyWord,
         isLogin: this.user.logged ? 1 : 0,
         sorting:
           !this.sorting || JSON.stringify(this.sorting) === '{}'
@@ -335,7 +336,8 @@ export default {
         enUU: this.user.data.enterprise ? this.user.data.enterprise.uu : null
       })
     },
-    searchList: function() {
+    searchList: function(type) {
+      this.searchKeyWord = type.keyword
       this.nowPage = 1
       this.resetList()
     },
@@ -369,7 +371,7 @@ export default {
   }
 }
 </script>
-<style lang="scss" scoped>
+<style lang="scss">
   .apply-info {
     margin: 0 auto;
     .apply-info-title {
@@ -412,19 +414,6 @@ export default {
             bottom-right-radius: 0;
           }
         }
-        > span {
-          display: inline-block;
-          width: 69px;
-          color: #fff;
-          background: #2496f1;
-          text-align: center;
-          margin: 0 6px 0 -1px;
-          border: {
-            top-right-radius: 3px;
-            bottom-right-radius: 3px;
-          }
-          cursor: pointer;
-        }
         > a {
           background: #ffa200;
           color: #fff;
@@ -785,4 +774,37 @@ export default {
     text-align: right;
     float: none;
   }
+  .search-content-pc {
+    position: relative;
+    input {
+      width: 283px!important;
+      height: 32px;
+      border: 1px solid #2496f1;
+      line-height: 32px;
+      font-size: 13px;
+      margin-top: 14px;
+      border: {
+        top-right-radius: 0;
+        bottom-right-radius: 0;
+      }
+    }
+    span.input-group-btn .btn{
+      top: 7px;
+      display: inline-block;
+      width: 69px;
+      color: #fff;
+      background: #2496f1;
+      text-align: center;
+      margin: 0 6px 0 -1px;
+      border: {
+        top-right-radius: 3px;
+        bottom-right-radius: 3px;
+      }
+      cursor: pointer;
+    }
+    ul{
+      left: 0 !important ;
+      top: 46px !important ;
+    }
+  }
 </style>

components/common/PcSearchHeader.vue

@@ -7,23 +7,17 @@
         <button type="button" class="btn btn-default" @click="onSearch()">搜索</button>
       </span>
     </div>
-    <!--<input type="text" v-model="keyword" @input="onKeywordInput()" :placeholder="placeholder" @keyup.13="onSearch()">-->
-    <!--<span @click="onSearch()"><i class="iconfont icon-sousuo"></i></span>-->
-    <ul v-if="emptyStatus && type == 'supplier' && keyword && keyword !== '' && showSimilarWord">
-      <template v-if="similarList.pBrandEn && similarList.pBrandEn.length">
-        <li class="title text-ellipse">品牌</li>
-        <li class="text-ellipse" v-for="brand in similarList.pBrandEn.slice(0, 4)" @click="onSearch(brand.nameEn, 'pBrandEn', $event)">{{brand.nameEn}}</li>
-      </template>
-      <template v-if="similarList.kind && similarList.kind.length">
-        <li class="title text-ellipse">物料名称</li>
-        <li class="text-ellipse" v-for="kind in similarList.kind.slice(0, 4)" @click="onSearch(kind.kind, 'kind', $event)">{{kind.kind}}</li>
+    <ul v-if="emptyStatus && keyword && keyword !== '' && showSimilarWord">
+      <template v-if="similarList.store && similarList.store.length">
+        <template v-if="type === 'supplier' || type === 'default'">
+          <li class="title text-ellipse" v-text="type === 'supplier' ? '公司名' : type === 'default' ? '店铺名' : ''">店铺名</li>
+          <li class="text-ellipse" v-for="store in similarList.store.slice(0, 4)" @click="onSearch(store.name, 'store', $event)">{{store.name}}</li>
+        </template>
+        <template v-if="type=== 'purchase' && user.logged">
+          <li class="title text-ellipse" v-text="'公司'">公司</li>
+          <li class="text-ellipse" v-for="store in similarList.store.slice(0, 4)" @click="onSearch(store.name, 'store', $event)">{{store.name}}</li>
+        </template>
       </template>
-      <template v-if="similarList.pCmpCode && similarList.pCmpCode.length">
-        <li class="title text-ellipse">型号</li>
-        <li class="text-ellipse" v-for="code in similarList.pCmpCode.slice(0, 4)" @click="onSearch(code.pCmpCode, 'pCmpCode', $event)">{{code.pCmpCode}}</li>
-      </template>
-    </ul>
-    <ul v-if="emptyStatus && type == 'default' && keyword && keyword !== '' && showSimilarWord">
       <template v-if="similarList.brand && similarList.brand.length">
         <li class="title text-ellipse">品牌</li>
         <li class="text-ellipse" v-for="brand in similarList.brand.slice(0, 4)" @click="onSearch(brand.nameEn, 'brand', $event)">{{brand.nameEn}}</li>
@@ -94,15 +88,10 @@
     computed: {
       emptyStatus () {
         let similarList = this.similarList
-        if (this.type === 'supplier') {
-          return (similarList.pCmpCode && similarList.pCmpCode.length) ||
-            (similarList.pBrandEn && similarList.pBrandEn.length) ||
-            (similarList.kind && similarList.kind.length)
-        } else if (this.type === 'default') {
-          return (similarList.component && similarList.component.length) ||
-            (similarList.brand && similarList.brand.length) ||
-            (similarList.kind && similarList.kind.length)
-        }
+        return (similarList.component && similarList.component.length) ||
+          (similarList.brand && similarList.brand.length) ||
+          (similarList.kind && similarList.kind.length) ||
+          (similarList.store && similarList.store.length)
       }
     },
     methods: {
@@ -121,17 +110,22 @@
           })
         } else {
           let sType = null
-          if (this.type === 'default' && this.keyword && this.keyword !== '' && this.similarList.component) {
-            if (this.similarList.brand[0] && this.keyword === this.similarList.brand[0].nameEn) {
+          if (this.keyword && this.keyword !== '' && this.similarList.component) {
+            if (this.similarList.store[0] && this.keyword === this.similarList.store[0].name) {
+              sType = 'store'
+            } else if (this.similarList.brand[0] && this.keyword === this.similarList.brand[0].nameEn) {
               sType = 'brand'
             } else if (this.similarList.kind[0] && this.keyword === this.similarList.kind[0].nameCn) {
               sType = 'kind'
             } else if (this.similarList.component[0] && this.keyword === this.similarList.component[0].code) {
               sType = 'code'
             } else {
-              let arr = [ ...this.similarList.brand, ...this.similarList.kind, ...this.similarList.component]
+              let arr = [ ...this.similarList.store, ...this.similarList.brand, ...this.similarList.kind, ...this.similarList.component]
               if (arr[0]) {
-                if (arr[0].nameEn) {
+                if (arr[0].name) {
+                  this.keyword = arr[0].name
+                  sType = 'store'
+                } else if (arr[0].nameEn) {
                   this.keyword = arr[0].nameEn
                   sType = 'brand'
                 } else if (arr[0].nameCn) {
@@ -143,28 +137,6 @@
                 }
               }
             }
-          } else if (this.type === 'supplier' && this.keyword && this.keyword !== '' && this.similarList.pCmpCode) {
-            if (this.similarList.pBrandEn[0] && this.keyword === this.similarList.pBrandEn[0].nameEn) {
-              sType = 'pBrandEn'
-            } else if (this.similarList.kind[0] && this.keyword === this.similarList.kind[0].kind) {
-              sType = 'kind'
-            } else if (this.similarList.pCmpCode[0] && this.keyword === this.similarList.pCmpCode[0].pCmpCode) {
-              sType = 'pCmpCode'
-            } else {
-              let arr = [...this.similarList.pBrandEn, ...this.similarList.kind, ...this.similarList.pCmpCode]
-              if (arr[0]) {
-                if (arr[0].nameEn) {
-                  this.keyword = arr[0].nameEn
-                  sType = 'pBrandEn'
-                } else if (arr[0].kind) {
-                  this.keyword = arr[0].kind
-                  sType = 'kind'
-                } else if (arr[0].pCmpCode) {
-                  this.keyword = arr[0].pCmpCode
-                  sType = 'pCmpCode'
-                }
-              }
-            }
           }
           this.$emit('searchAction', {
             keyword: this.keyword,
@@ -222,6 +194,7 @@
         line-height: 36px;
         padding: 0 10px;
         font-size: 14px;
+        color: #333;
         &:hover {
           background: #f6f5f5;
           cursor: pointer;

components/mobile/base/SearchHeader.vue

@@ -3,21 +3,17 @@
     <a @click="goLastPage"><i class="iconfont icon-fanhui"></i></a>
     <input type="text" v-model="keyword" @input="onKeywordInput()" :placeholder="placeholder" @keyup.13="onSearch()">
     <span @click="onSearch()"><i class="iconfont icon-sousuo"></i></span>
-    <ul v-if="emptyStatus && type == 'supplier' && keyword && keyword !== '' && showSimilarWord">
-      <template v-if="similarList.pBrandEn && similarList.pBrandEn.length">
-        <li class="title text-ellipse">品牌</li>
-        <li class="text-ellipse" v-for="brand in similarList.pBrandEn.slice(0, 4)" @click="onSearch(brand.nameEn, 'pBrandEn', $event)">{{brand.nameEn}}</li>
+    <ul v-if="emptyStatus && keyword && keyword !== '' && showSimilarWord">
+      <template v-if="similarList.store && similarList.store.length && (similarType == 'all' || similarType == 'store')">
+        <template v-if="type === 'supplier' || type === 'default'">
+          <li class="title text-ellipse" v-if="similarType == 'all'"  v-text="type === 'supplier' ? '公司名' : type === 'default' ? '店铺名' : ''">公司名</li>
+          <li class="text-ellipse" v-for="store in similarList.store.slice(0, 8)" @click="onSearch(store.name, 'store', $event)">{{store.name}}</li>
+        </template>
+        <template v-if="type=== 'purchase' && user.logged">
+          <li class="title text-ellipse" v-if="similarType == 'all'">公司</li>
+          <li class="text-ellipse" v-for="store in similarList.store.slice(0, 8)" @click="onSearch(store.name, 'store', $event)">{{store.name}}</li>
+        </template>
       </template>
-      <template v-if="similarList.kind && similarList.kind.length">
-        <li class="title text-ellipse">物料名称</li>
-        <li class="text-ellipse" v-for="kind in similarList.kind.slice(0, 4)" @click="onSearch(kind.kind, 'kind', $event)">{{kind.kind}}</li>
-      </template>
-      <template v-if="similarList.pCmpCode && similarList.pCmpCode.length">
-        <li class="title text-ellipse">型号</li>
-        <li class="text-ellipse" v-for="code in similarList.pCmpCode.slice(0, 4)" @click="onSearch(code.pCmpCode, 'pCmpCode', $event)">{{code.pCmpCode}}</li>
-      </template>
-    </ul>
-    <ul v-if="emptyStatus && type == 'default' && keyword && keyword !== '' && showSimilarWord">
       <template v-if="similarList.brand && similarList.brand.length && (similarType == 'all' || similarType == 'brand')">
         <li class="title text-ellipse" v-if="similarType == 'all'">品牌</li>
         <li class="text-ellipse" v-for="brand in similarList.brand.slice(0, 8)" @click="onSearch(brand.nameEn, 'brand', $event)">{{brand.nameEn}}</li>
@@ -97,15 +93,10 @@
     computed: {
       emptyStatus () {
         let similarList = this.similarList
-        if (this.type === 'supplier') {
-          return (similarList.pCmpCode && similarList.pCmpCode.length) ||
-            (similarList.pBrandEn && similarList.pBrandEn.length) ||
-            (similarList.kind && similarList.kind.length)
-        } else if (this.type === 'default') {
-          return (similarList.component && similarList.component.length) ||
-            (similarList.brand && similarList.brand.length) ||
-            (similarList.kind && similarList.kind.length)
-        }
+        return (similarList.store && similarList.store.length) ||
+          (similarList.component && similarList.component.length) ||
+          (similarList.brand && similarList.brand.length) ||
+          (similarList.kind && similarList.kind.length)
       }
     },
     methods: {
@@ -124,17 +115,22 @@
           })
         } else {
           let sType = null
-          if (this.type === 'default' && this.keyword && this.keyword !== '' && this.similarList.brand) { // 防止接口报错无法搜索
-            if (this.similarList.brand[0] && this.keyword === this.similarList.brand[0].nameEn) {
+          if (this.keyword && this.keyword !== '' && this.similarList.brand) { // 防止接口报错无法搜索
+            if (this.similarList.store[0] && this.keyword === this.similarList.store[0].name) {
+              sType = 'store'
+            } else if (this.similarList.brand[0] && this.keyword === this.similarList.brand[0].nameEn) {
               sType = 'brand'
             } else if (this.similarList.kind[0] && this.keyword === this.similarList.kind[0].nameCn) {
               sType = 'kind'
             } else if (this.similarList.component[0] && this.keyword === this.similarList.component[0].code) {
               sType = 'code'
             } else {
-              let arr = [...this.similarList.brand, ...this.similarList.kind, ...this.similarList.component]
+              let arr = [...this.similarList.store, ...this.similarList.brand, ...this.similarList.kind, ...this.similarList.component]
               if (arr[0]) {
-                if (arr[0].nameEn) {
+                if (arr[0].name) {
+                  this.keyword = arr[0].name
+                  sType = 'store'
+                } else if (arr[0].nameEn) {
                   this.keyword = arr[0].nameEn
                   sType = 'brand'
                 } else if (arr[0].nameCn) {
@@ -146,28 +142,6 @@
                 }
               }
             }
-          } else if (this.type === 'supplier' && this.keyword && this.keyword !== '' && this.similarList.pBrandEn) { // 防止接口报错无法搜索
-            if (this.similarList.pBrandEn[0] && this.keyword === this.similarList.pBrandEn[0].nameEn) {
-              sType = 'pBrandEn'
-            } else if (this.similarList.kind[0] && this.keyword === this.similarList.kind[0].kind) {
-              sType = 'kind'
-            } else if (this.similarList.pCmpCode[0] && this.keyword === this.similarList.pCmpCode[0].pCmpCode) {
-              sType = 'pCmpCode'
-            } else {
-              let arr = [...this.similarList.pBrandEn, ...this.similarList.kind, ...this.similarList.pCmpCode]
-              if (arr[0]) {
-                if (arr[0].nameEn) {
-                  this.keyword = arr[0].nameEn
-                  sType = 'pBrandEn'
-                } else if (arr[0].kind) {
-                  this.keyword = arr[0].kind
-                  sType = 'kind'
-                } else if (arr[0].pCmpCode) {
-                  this.keyword = arr[0].pCmpCode
-                  sType = 'pCmpCode'
-                }
-              }
-            }
           }
           this.$emit('searchAction', {
             keyword: this.keyword,

components/mobile/supplier/List.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <search-header @searchAction="search" :useMatchRule="false" :similarUrl="similarUrl" :type="'supplier'" :placeholder="'品牌/物料名称/型号/公司名'"></search-header>
+    <search-header @searchAction="search" :useMatchRule="false" :type="'supplier'" :placeholder="'公司名/品牌/物料名称/型号'"></search-header>
     <div class="supplier-list mobile-content">
       <ul v-if="listData && listData.length">
         <li v-for="item in listData" @click="goSupplierDetail(item)">
@@ -34,7 +34,6 @@
         isDataChange: false,
         remindText: '',
         timeoutCount: 0,
-        similarUrl: '/search/product/similarKeywords',
         field: null
       }
     },

components/mobile/supplier/List2.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <search-header2 @searchAction="search" :similarUrl="similarUrl" :type="'supplier'" :placeholder="'品牌/物料名称/型号/公司名'"></search-header2>
+    <search-header2 @searchAction="search" :type="'supplier'" :placeholder="'公司名/品牌/物料名称/型号'"></search-header2>
     <div class="supplier-list mobile-content">
       <ul v-if="listData && listData.length">
         <li v-for="item in listData" @click="goSupplierDetail(item)">
@@ -34,7 +34,6 @@
         isDataChange: false,
         remindText: '',
         timeoutCount: 0,
-        similarUrl: '/search/product/similarKeywords',
         field: null
       }
     },

components/provider/Suppliers.vue

@@ -15,7 +15,7 @@
         <!--<tr>{{$data}}</tr>-->
         <tr style="height: 50px;">
           <td colspan="5">
-            <search-header :outerKeyword="keyword" @searchAction="search" :placeholder="'品牌/物料名称/型号/店铺名'"></search-header>
+            <search-header :outerKeyword="keyword" @searchAction="search" :placeholder="'店铺名/品牌/物料名称/型号'"></search-header>
             <a @click="goStoreApply" class="btn-sure"><button class="btn btn-primary">立即入驻</button></a>
           </td>
         </tr>

components/supplier/merchant.vue

@@ -5,7 +5,7 @@
       <span>供应商列表</span>
     </div>
     <div class="search">
-      <search-header :outerKeyword="searchCode" :similarUrl="similarUrl" :type="'supplier'" @searchAction="search" :placeholder="'品牌/物料名称/型号/公司名'"></search-header>
+      <search-header :outerKeyword="searchCode" :type="'supplier'" @searchAction="search" :placeholder="'公司名/品牌/物料名称/型号'"></search-header>
     </div>
   </div>
   <div class="list_info">
@@ -73,7 +73,6 @@
           count: 10,
           page: 1
         },
-        similarUrl: '/search/product/similarKeywords',
         type: ''
       }
     },
@@ -206,12 +205,17 @@
       width:370px;
       padding-top:7px;
       margin-right:10px;
+      .search-content-pc input{
+        width: 100% !important;
+        margin-top: 0!important;
+      }
       .search-content-pc > ul{
         left:0;
         top:100%;
         width:100%;
       }
       .btn{
+        margin-top: 0!important;
         width:68px;
         background: #2496f1;
         color:#fff;
@@ -312,7 +316,7 @@
         }
         &:hover{
           cursor:pointer;
-          box-shadow: 0 0 5px rgba(0,0,0,.8);
+          box-shadow: 0 0 5px rgba(0,0,0,.4);
           .content{
             color:#2496f1;
             .enterprise_name{

pages/mobile/applyPurchase/list/index.vue

@@ -1,31 +1,27 @@
 <template>
-  <div class="mobile-content">
-    <div class="mobile-header">
-      <a @click="goLastPage"><i class="iconfont icon-fanhui"></i></a>
-      <div class="search-content">
-        <input type="text" v-model="seekKeyword" :placeholder="user.logged ? '品牌/物料名称/型号/规格/公司' : '品牌/物料名称/型号/规格'" @keyup.13="searchSeek">
-        <span @click="searchSeek">
-        <i class="iconfont icon-sousuo"></i>
-        </span>
+  <div>
+    <search-header @searchAction="searchSeek" :useMatchRule="false" :type="'purchase'" :outerKeyword="searchKeyword" :placeholder="user.logged ? '公司/品牌/物料名称/型号/规格' : '品牌/物料名称/型号/规格'"></search-header>
+    <div class="mobile-content">
+      <div class="seek-title">
+        <img src="/images/mobile/@2x/applyPurchase/home/seek-title.png" alt="">
+        <span>最新求购信息</span>
       </div>
+      <seek-list :isSearch="isSearch" :keyword="searchKeyword" :purchaseManList="purchaseManListData" :isDataChange="isDataChange"></seek-list>
+      <!--<loading v-show="isSearchSearchingMore"></loading>-->
+      <div v-if="purchaseManList && false"></div>
     </div>
-    <div class="seek-title">
-      <img src="/images/mobile/@2x/applyPurchase/home/seek-title.png" alt="">
-      <span>最新求购信息</span>
-    </div>
-    <seek-list :isSearch="isSearch" :keyword="remindKeyword" :purchaseManList="purchaseManListData" :isDataChange="isDataChange"></seek-list>
-    <!--<loading v-show="isSearchSearchingMore"></loading>-->
-    <div v-if="purchaseManList && false"></div>
   </div>
 </template>
 <script>
   import SeekList from '~components/mobile/applyPurchase/SeekList.vue'
   import {Loading} from '~components/mobile/common'
+  import {SearchHeader} from '~components/mobile/base'
   export default {
     layout: 'mobile',
     components: {
       SeekList,
-      Loading
+      Loading,
+      SearchHeader
     },
     data () {
       return {
@@ -38,7 +34,7 @@
         isChange: false,
         isDataChange: false,
         isSearch: false,
-        remindKeyword: ''
+        searchKeyword: ''
       }
     },
     mounted: function () {
@@ -88,11 +84,11 @@
         this.reloadData()
       },
       reloadData: function () {
-        this.$store.dispatch('applyPurchase/loadPurchaseManList', {pageNumber: this.page, pageSize: this.size, sorting: {'releaseDate': 'DESC'}, keyword: this.seekKeyword, enUU: this.$store.state.option.user.data.enterprise ? this.$store.state.option.user.data.enterprise.uu : null, isLogin: this.user.logged ? '1' : '0'})
+        this.$store.dispatch('applyPurchase/loadPurchaseManList', {pageNumber: this.page, pageSize: this.size, sorting: {'releaseDate': 'DESC'}, keyword: this.seekKeyword = this.searchKeyword === '' ? null : this.searchKeyword, enUU: this.$store.state.option.user.data.enterprise ? this.$store.state.option.user.data.enterprise.uu : null, isLogin: this.user.logged ? '1' : '0'})
       },
-      searchSeek: function () {
+      searchSeek: function (type) {
         this.isSearch = true
-        this.remindKeyword = this.seekKeyword
+        this.searchKeyword = type.keyword
         this.page = 1
         this.isChange = true
         this.reloadData()

pages/mobile/shop/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <search-header @searchAction="onSearch" :useMatchRule="false" :outerKeyword="keyword" :placeholder="'品牌/物料名称/型号/店铺名'"></search-header>
+    <search-header @searchAction="onSearch" :useMatchRule="false" :outerKeyword="keyword" :placeholder="'店铺名/品牌/物料名称/型号'"></search-header>
     <div class="shop mobile-content">
       <div class="shop-top">
         <p><i class="iconfont icon-dianpu1"></i><span>{{list.totalElements || 0}}</span>家店铺</p>