购物车搜索

components/mobile/MobileHeader.vue

@@ -108,7 +108,9 @@
         return this.$store.state.componentDetail.detail.data
       },
       showEnHeader () {
-        return this.startWith(this.$route.path, '/mobile/center') || this.startWith(this.$route.path, '/mobile/order') || this.startWith(this.$route.path, '/mobile/user/address')
+        return this.startWith(this.$route.path, '/mobile/center') ||
+          this.startWith(this.$route.path, '/mobile/order') ||
+          this.startWith(this.$route.path, '/mobile/user/address')
       }
 //      showHeader () {
 //        return this.$route.path !== '/' || !this.$route.path || this.$route.path === ''
@@ -205,7 +207,7 @@
         } else if (this.startWith(val, '/mobile/store')) {
           this.showSearchIcon = false
           title = '开店申请'
-        } else if (val === '/mobile/center/user/cart') {
+        } else if (this.startWith(val, '/mobile/center/user/cart')) {
           this.showSearchIcon = false
           title = '购物车'
         } else if (this.startWith(val, '/mobile/center/user/payCenter')) {

components/mobile/base/SearchHeader.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="search-content com-mobile-header">
+  <div class="search-content com-mobile-header mobile-search-header" :class="expandClass">
     <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>
@@ -64,6 +64,10 @@
       useMatchRule: { // 使用既定的匹配规则
         type: Boolean,
         default: true
+      },
+      expandClass: {
+        type: String,
+        default: ''
       }
     },
     data () {
@@ -196,34 +200,53 @@
   }
 </script>
 <style lang="scss" scoped>
-  .search-content {
-    color: #333;
-    input {
-      margin: 0 0 0 .5rem;
-      line-height: normal;
-    }
-    ul {
-      width: 6.48rem;
-      background: #fff;
-      position: absolute;
-      left: .6rem;
-      top: .72rem;
-      border: 1px solid #ccc;
-      border-radius: .05rem;
-      max-height: 4.5rem;
-      overflow-y: auto;
-      li {
-        height: .6rem;
-        line-height: .6rem;
-        padding: 0 .1rem;
-        font-size: .26rem;
-        &.title {
-          color: #666;
-          border-bottom: 1px solid #ddd;
-          font-weight: bold;
-          background: #f6f5f5;
+  .mobile-search-header {
+    &.search-content {
+      color: #333;
+      input {
+        margin: 0 0 0 .5rem;
+        line-height: normal;
+      }
+      ul {
+        width: 6.48rem;
+        background: #fff;
+        position: absolute;
+        left: .6rem;
+        top: .72rem;
+        border: 1px solid #ccc;
+        border-radius: .05rem;
+        max-height: 4.5rem;
+        overflow-y: auto;
+        li {
+          height: .6rem;
+          line-height: .6rem;
+          padding: 0 .1rem;
+          font-size: .26rem;
+          &.title {
+            color: #666;
+            border-bottom: 1px solid #ddd;
+            font-weight: bold;
+            background: #f6f5f5;
+          }
         }
       }
     }
+    &.normal {
+      position: relative;
+      background: #f1f3f6;
+      z-index: 1;
+      input {
+        border: 1px solid #3f84f6;
+        width: 7.1rem;
+        margin: 0 0 0 .1rem;
+      }
+      > a {
+        display: none;
+      }
+      ul {
+        width: 7.1rem;
+        left: .19rem;
+      }
+    }
   }
 </style>

components/mobile/common/PullUp.vue

@@ -64,7 +64,8 @@
         } else {
           height = document.body.scrollHeight
           scrolled = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop
-        } if (this.FixedEl) {
+        }
+        if (this.FixedEl) {
           let obj = document.getElementById(this.fixId)
           // availHeight = document.getElementById(this.fixId).clientHeight + 50
           let _sc = obj.clientHeight + obj.scrollTop

components/mobile/search/componet-item.vue

@@ -38,7 +38,7 @@
       </div>
     </div>
     <div class="list">
-      <div class="fl" @click.stop="goAttach(item.attach)">
+      <div class="fl">
         <div class="name">规格书：</div>
         <div class="text">
           <a :href="item.attach" target="_blank" v-if="item.attach && item.attach !== '' && item.attach !== '1'">
@@ -83,10 +83,12 @@
         <div class="pull-left" @click="buy(item, true, $event)">立即购买</div>
       </div>
     </div>
+    <remind-box :title="remindText" :timeoutCount="timeoutCount"></remind-box>
   </div>
 </template>
 
 <script>
+  import { RemindBox } from '~components/mobile/common'
   export default {
     props: {
       item: {
@@ -94,12 +96,25 @@
         default: {}
       }
     },
+    components: {
+      RemindBox
+    },
+    data () {
+      return {
+        remindText: '',
+        timeoutCount: 0
+      }
+    },
     methods: {
       cancatSeller(item) {
         this.$emit('cancatSeller', item)
       },
       buy(item, flag, e) {
         this.baseUtils.buyOrCar(flag, e, this, item, '/mobile/center/user/pay/')
+      },
+      setRemindText (str) {
+        this.remindText = str
+        this.timeoutCount++
       }
     }
   }

pages/mobile/center/user/cart/_key.vue

@@ -0,0 +1,114 @@
+<template>
+  <div class="mobile-search-goods mobile-content mobile-content-long">
+    <search-header
+      :placeholder="'请输入您要采购的型号'"
+      :outerKeyword="outerKeyword"
+      :useMatchRule="false"
+      :expandClass="'normal'"
+      :similarType="'code'"
+      @searchAction="onSearch"></search-header>
+    <ul>
+      <li v-for="goods in goodsList">
+        <component-item :item="goods" @cancatSeller="concatSeller"></component-item>
+      </li>
+    </ul>
+    <link-user :infoObj="currentStoreInfo"
+               :showLink="showLink"
+               @closeAction="showLink = false"></link-user>
+    <pull-up
+      :allPage="allPage"
+      :page="page"
+      @pullUpAction="onPullUpAction"
+      :searchMore="fetching"></pull-up>
+  </div>
+</template>
+<script>
+  import {LinkUser, SearchHeader} from '~components/mobile/base'
+  import componentItem from '~components/mobile/search/componet-item'
+  import { PullUp } from '~components/mobile/common'
+  export default {
+    layout: 'mobile',
+    components: {
+      LinkUser,
+      SearchHeader,
+      componentItem,
+      PullUp
+    },
+    data () {
+      return {
+        outerKeyword: '',
+        currentStoreInfo: {},
+        showLink: false,
+        page: 1,
+        goodsList: []
+      }
+    },
+    fetch ({ store, params }) {
+      return Promise.all([
+        store.dispatch('searchData/searchForListNew', {count: 10, keyword: params.key, page: 1, type: 'component'})
+      ])
+    },
+    watch: {
+      '$route.params.key': {
+        handler: function (val) {
+          this.outerKeyword = val || ''
+        },
+        immediate: true
+      },
+      'searchList': {
+        handler: function (val) {
+          if (val && val.stock && val.stock.content) {
+            this.goodsList = [...this.goodsList, ...val.stock.content]
+          }
+        },
+        immediate: true
+      }
+    },
+    computed: {
+      listData () {
+        return this.$store.state.searchData.searchList.listNew
+      },
+      searchList () {
+        return this.listData.data
+      },
+      fetching () {
+        return this.listData.fetching
+      },
+      goods () {
+        return this.searchList ? this.searchList.stock : {}
+      },
+      allPage () {
+        return this.goods.total ? Math.ceil(this.goods.total / this.goods.size) : 0
+      }
+    },
+    methods: {
+      onSearch (searchObj) {
+        if (searchObj.keyword) {
+          this.$router.push(`/mobile/center/user/cart/${searchObj.keyword}`)
+        }
+      },
+      concatSeller (item) {
+        this.$http.get(`/api/store-service/stores?uuid=${item.storeid}`).then(res => {
+          this.currentStoreInfo = res.data.enterprise
+          this.showLink = true
+        })
+      },
+      reloadList () {
+        this.$store.dispatch('searchData/searchForListNew', {count: 10, keyword: this.$route.params.key, page: this.page, type: 'component'})
+      },
+      onPullUpAction () {
+        this.page++
+        this.reloadList()
+      }
+    }
+  }
+</script>
+<style lang="scss" scoped>
+  .mobile-search-goods {
+    ul {
+      li {
+        border-bottom: .2rem solid #f1f3f6;
+      }
+    }
+  }
+</style>

pages/mobile/center/user/cart.vue → pages/mobile/center/user/cart/index.vue

@@ -1,5 +1,12 @@
 <template>
   <div class="mobile-cart" :class="{'empty-mobile-cart': !cartList.length}" id="mobileFixContent" @touchmove="blurEvent()">
+    <search-header
+      :placeholder="'请输入您要采购的型号'"
+      :outerKeyword="outerKeyword"
+      :useMatchRule="false"
+      :expandClass="'normal'"
+      :similarType="'code'"
+      @searchAction="onSearch"></search-header>
     <template v-if="cartList.length">
       <ul class="store-list">
         <li class="store-item" v-for="(item, storeIndex) in cartList">
@@ -72,7 +79,7 @@
 </template>
 <script>
   import {RemindBox, PullUp, EmptyStatus} from '~components/mobile/common'
-  import {LinkUser} from '~components/mobile/base'
+  import {LinkUser, SearchHeader} from '~components/mobile/base'
   import { goodsPurchaseOperate } from '~utils/mixin'
   export default {
     layout: 'mobile',
@@ -88,7 +95,8 @@
         allCurrency: 'RMB', // 选定币别
         currentStoreInfo: {},
         showLink: false,
-        isChange: false
+        isChange: false,
+        outerKeyword: ''
       }
     },
     mixins: [goodsPurchaseOperate],
@@ -96,7 +104,8 @@
       RemindBox,
       PullUp,
       LinkUser,
-      EmptyStatus
+      EmptyStatus,
+      SearchHeader
     },
     fetch ({ store }) {
       return Promise.all([
@@ -296,12 +305,10 @@
             storeid: item.storeUuid
           })
         })
-        console.log(arrOD)
         this.$http.post('/trade/order/saveByGroup', {
           arrOD: arrOD,
           currency: this.allCurrency
         }).then(res => {
-          console.log(res.data)
           if (res.data.code === 1) {
             if (res.data.message) {
               this.setRemindText(res.data.message)
@@ -359,6 +366,11 @@
         }, err => {
           this.setRemindText(err.response.data || '系统错误')
         })
+      },
+      onSearch (searchObj) {
+        if (searchObj.keyword) {
+          this.$router.push(`/mobile/center/user/cart/${searchObj.keyword}`)
+        }
       }
     }
   }

plugins/axios.js

@@ -70,7 +70,13 @@ service.interceptors.response.use(response => {
       document.getElementById('loading').setAttribute('class', 'loading')
     }
     // 401拦截
-    if (error.response.status === 401 && !/\/store-service\/stores$/g.test(error.response.config.url)) {
+    if (error.response.status === 401 &&
+        // 当前账套店铺信息
+      !/\/store-service\/stores$/g.test(error.response.config.url) &&
+        // 店铺关注
+      !/\/trade\/storeFocus\/ifFocus/g.test(error.response.config.url) &&
+        // 器件收藏
+      !/\/trade\/collection\/list/g.test(error.response.config.url)) {
       window.location.href = `/auth/login?returnUrl=${window.location.href}`
       return
     }

store/searchData.js

@@ -119,7 +119,7 @@ export const actions = {
         commit('searchHistory/GET_SEARCH_HISTORY_FAILURE', err)
       })
   },
-  // 获取搜索历史
+  // 新版搜索结果
   searchForListNew ({ commit }, params = {}) {
     commit('searchList/REQUEST_LIST_NEW', params)
     return axios.get(`/search/201819`, {params})