|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <view class="p15 bg-white"> | 
|---|
|  |  |  | <view class="search-container m-t-12 flex"> | 
|---|
|  |  |  | <view class="flex m-r-20"> | 
|---|
|  |  |  | <view class="m-r-10" style="line-height: 80rpx;" @click="changeType"> | 
|---|
|  |  |  | {{type=='flower'?'按鲜花':'按店铺'}} | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | <u-icon name="arrow-down"></u-icon> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | <view class="flex1 input"> | 
|---|
|  |  |  | <u-input placeholder="请输入花名" v-model="search_flow" clearable @confirm="buttonSearchFlow" @clear="()=>{ | 
|---|
|  |  |  | $nextTick(()=>{buttonSearchFlow()}) | 
|---|
|  |  |  | }"> | 
|---|
|  |  |  | <!-- <u--text text="http://" slot="prefix" margin="0 3px 0 0" type="tips"></u--text> --> | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <template slot="suffix"> | 
|---|
|  |  |  | <uni-icons color="#20613D" type="search" size="24" @click="buttonSearchFlow"></uni-icons> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | <view class="m-t-12"> | 
|---|
|  |  |  | <view class="m-t-20"> | 
|---|
|  |  |  | <view class="title flex"> | 
|---|
|  |  |  | <view class="m-l-0 m-r-a">搜索历史</view> | 
|---|
|  |  |  | <view class="bg-white desc-gray  text-center m-l-a m-r-0" @click.stop="clearHistory"> | 
|---|
|  |  |  | 一键清空 | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | <view class="m-t-12 flex flex-wrap-normal history-item-list"> | 
|---|
|  |  |  | <view class="m-t-12 flex history-item-list"> | 
|---|
|  |  |  | <view class="history-item" v-for="item of history" :key="item" @click="searchBy(item)"> | 
|---|
|  |  |  | {{item}} | 
|---|
|  |  |  | </view> | 
|---|
|  |  |  | 
|---|
|  |  |  | return { | 
|---|
|  |  |  | search_flow: '', | 
|---|
|  |  |  | history: [], | 
|---|
|  |  |  | type: 'flower', //supplierName | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | onShow() { | 
|---|
|  |  |  | 
|---|
|  |  |  | this.$storage.setItem("cache_home_search", JSON.stringify(this.history)) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | methods: { | 
|---|
|  |  |  | changeType() { | 
|---|
|  |  |  | if (this.type == 'flower') { | 
|---|
|  |  |  | this.type = 'supplier' | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | this.type = 'flower' | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | buttonSearchFlow() { | 
|---|
|  |  |  | var name = this.search_flow | 
|---|
|  |  |  | if (name) { | 
|---|
|  |  |  | 
|---|
|  |  |  | this.history.splice(this.history.length - 1, 1) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | console.log('buttonSearchFlow') | 
|---|
|  |  |  | // console.log('buttonSearchFlow') | 
|---|
|  |  |  | var p = '' | 
|---|
|  |  |  | if (this.type === 'flower') { | 
|---|
|  |  |  | p = 'name=' + this.search_flow | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | p = 'supplierName=' + this.search_flow | 
|---|
|  |  |  | } | 
|---|
|  |  |  | uni.navigateTo({ | 
|---|
|  |  |  | url: '/sub_pages/customer/trade/list?name=' + this.search_flow | 
|---|
|  |  |  | url: '/sub_pages/customer/trade/list?' + p | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | 
|---|
|  |  |  | this.history = [] | 
|---|
|  |  |  | this.$storage.setItem("cache_home_search", JSON.stringify(this.history)) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | searchBy(name) { | 
|---|
|  |  |  | if (this.history.indexOf(name) >= 0) { | 
|---|
|  |  |  | this.history.splice(this.history.indexOf(name), 1) | 
|---|
|  |  |  | searchBy(clickname) { | 
|---|
|  |  |  | //值一瞬间会变,引用,所以用加一个,来更改引用 | 
|---|
|  |  |  | var name = '' + clickname | 
|---|
|  |  |  | // if (this.history.indexOf(clickname) >= 0) { | 
|---|
|  |  |  | //    // this.history.splice(this.history.indexOf(clickname), 1) | 
|---|
|  |  |  | // }else{ | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // } | 
|---|
|  |  |  | // this.history.unshift(clickname) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | var p = '' | 
|---|
|  |  |  | if (this.type === 'flower') { | 
|---|
|  |  |  | p = 'name=' + name | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | p = 'supplierName=' + name | 
|---|
|  |  |  | } | 
|---|
|  |  |  | this.history.unshift(name) | 
|---|
|  |  |  | console.log('searchBy', name, p) | 
|---|
|  |  |  | // setTimeout(() => { | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // }, 200) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | uni.navigateTo({ | 
|---|
|  |  |  | url: '/sub_pages/customer/trade/list?name=' + name | 
|---|
|  |  |  | url: '/sub_pages/customer/trade/list?' + p | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | 
|---|
|  |  |  | <style lang="scss" scoped> | 
|---|
|  |  |  | .history-item-list { | 
|---|
|  |  |  | .history-item { | 
|---|
|  |  |  | margin-right: 20rpx; | 
|---|
|  |  |  | margin-right: 30rpx; | 
|---|
|  |  |  | min-width: 100rpx; | 
|---|
|  |  |  | padding: 10rpx 20rpx; | 
|---|
|  |  |  | margin-bottom: 20rpx; | 
|---|
|  |  |  | margin-bottom: 30rpx; | 
|---|
|  |  |  | text-align: center; | 
|---|
|  |  |  | height: 30rpx; | 
|---|
|  |  |  | line-height: 30rpx; | 
|---|
|  |  |  | font-size: 28rpx; | 
|---|
|  |  |  | // padding-left: 10rpx; | 
|---|
|  |  |  | // padding-right: 10rpx; | 
|---|
|  |  |  | border: 2rpx solid #e9e9e9; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|