Commit c7546171 authored by zhijie.xue's avatar zhijie.xue

完成搜索功能

parent 84db35b5
......@@ -6,7 +6,9 @@ module.exports = {
return http.post(`/api/user/login?code=${code}`);
},
register(params) {
return http.post('/api/user/register', params, { 'content-type': 'application/json' });
return http.post('/api/user/register', params, {
'content-type': 'application/json'
});
},
getMainInfo(params) {
return http.post('/api/user/main', params);
......@@ -24,7 +26,9 @@ module.exports = {
return http.post('/api/user/book', qs.stringify(params));
},
signIn(params) {
return http.post('/api/user/signin', params, { 'content-type': 'application/json' });
return http.post('/api/user/signin', params, {
'content-type': 'application/json'
});
},
getPrizeList(id) {
const params = !id ? undefined : { prizeId: id };
......@@ -46,7 +50,9 @@ module.exports = {
return http.post('/api/user/update/phone', params);
},
getPrize(params) {
return http.post('/api/user/prize/receive', params, { 'content-type': 'application/json' });
return http.post('/api/user/prize/receive', params, {
'content-type': 'application/json'
});
},
checkInnerCode(params) {
return http.post('/api/user/inviteCode', params);
......@@ -62,5 +68,8 @@ module.exports = {
},
getGoodsUrl(params) {
return http.post('/api/goods/promotionUrl', params);
},
getHotList() {
return http.post('/api/goods/hot');
}
};
This diff is collapsed.
......@@ -5,8 +5,41 @@
<van-field clearable left-icon="search" placeholder="搜索" bind:confirm="search" value="{{value}}" bind:input ="setValue" auto-focus ></van-field>
</view>
<view class="search-cancel" bindtap="search">搜索</view>
<view v-show="!searching">
<view class="search-history">
<text class="search-history-text">历史搜索</text>
<image wx:if="{{historyList.length}}" bindtap="clearHistory" src="/static/images/remove@2x.png">删除</image>
</view>
<view class="search-list" v-show="list.length">
<view class="history-list">
<view>
<van-tag wx:for="{{historyList}}" wx:key="index" color="#F1F1F1" text-color="#666666" size="medium"
round
bindtap="doSearch"
data-text="{{item}}">
{{item}}
</van-tag>
</view>
<view class="history-list-action" v-show="showWholeHistoryList" >
<van-icon name="arrow-down" color="#666" size="20px" bindtap="showAllHistory"/>
</view>
</view>
<view class="hot">
<image class="hot-icon" src="/static/images/hot@2x.png"></image>
<text class="hot-text">热搜榜</text>
</view>
<view class="hot-list">
<view class="hot-list-item" wx:for="{{hotList}}" wx:key="index" bindtap="doSearch" data-text="{{item.title}}">
<text class="hot-list-item-index {{index <= 2 ? 'hot-list-item-index-top' : ''}}">{{index + 1}}.</text>
<text class="hot-list-item-text">{{item.title}}</text>
<text wx:if="{{item.saleCount}}" class="hot-list-item-count">{{item.saleCount}}</text>
<image wx:if="{{item.type}}" class="hot-list-item-icon" src="/static/images/{{item.type}}@2x.png"></image>
</view>
</view>
</view>
</view>
</view>
<view class="search-list" v-show="searching">
<view class="search-item" wx:for="{{list}}" wx:key="index" bindtap="toJingdong" data-item="{{item}}">
<view class="image-left">
<van-image use-loading-slot src="{{item.images}}" class="img" width="240rpx" height="240rpx" radius="10rpx" fit="cover">
......@@ -32,7 +65,7 @@
</template>
<script>
import wepy from '@wepy/core';
import { getSearchList, getGoodsUrl } from '../common/api';
import { getSearchList, getGoodsUrl, getHotList } from '../common/api';
let page = 1;
wepy.page({
data: {
......@@ -40,20 +73,63 @@
isDone: false,
isLoading: false,
showLoading: false,
value: ''
value: '',
historyList: [],
showWholeHistoryList: false,
historyLimit: 10,
hotList: [],
searching: false
},
methods: {
setValue(event) {
this.value = event.$wx.detail || '';
this.searching = this.value.length;
if (this.value === '') {
this.list = [];
}
},
updateSearchHisotry(value) {
let list = wx.getStorageSync('search_history');
!list && (list = []);
list.unshift(value);
wx.setStorageSync('search_history', list);
this.historyList = list;
},
loadSearchHistory(limit = true) {
let list = wx.getStorageSync('search_history');
this.showWholeHistoryList = list.length > this.historyLimit;
if (limit) {
list = list.slice(0, this.historyLimit);
}
this.historyList = list || [];
},
clearHistory() {
const that = this;
wx.showModal({
title: '确认删除全部历史记录?',
success(res) {
if (res.confirm) {
wx.setStorageSync('search_history', '');
that.historyList = [];
}
}
});
},
showAllHistory() {
this.loadSearchHistory(false);
this.showWholeHistoryList = false;
},
search() {
page = 1;
this.searching = true;
this.list = [];
this.getList();
},
getList() {
this.isLoading = true;
this.isDone = false;
this.updateSearchHisotry(this.value);
getSearchList({keyword: this.value, page: page}).then(data => {
this.isLoading = false;
if (!data.hasMore) {
......@@ -82,12 +158,25 @@
}).catch(() => {
this.showLoading = false;
});
},
async loadHot() {
const list = await getHotList();
this.hotList = list;
},
doSearch(e) {
const text = e.currentTarget.dataset.text;
this.value = text;
this.search();
}
},
onReachBottom() {
if (this.isDone) return;
if (this.isDone || !this.searching) return;
page++;
this.getList();
},
onLoad() {
this.loadSearchHistory();
this.loadHot();
}
});
</script>
......@@ -98,6 +187,8 @@
"van-field": "../components/vant/field/index",
"van-image": "../components/vant/image/index",
"van-loading": "../components/vant/loading/index",
"van-icon": "../components/vant/icon/index",
"van-tag": "../components/vant/tag/index",
"go-loading": "~@/components/custom/goloading",
}
}
......@@ -135,6 +226,103 @@
text-align: center;
line-height:60rpx;
}
.hot {
margin-top: 71rpx;
display: flex;
align-items: center;
&-text {
font-size: 32rpx;
font-weight: bold;
}
&-icon {
width: 36rpx;
height: 42rpx;
margin-right: 10rpx;
position: relative;
top: -2rpx;
}
}
.hot-list {
margin-top: 41rpx;
&-item {
display: flex;
flex-direction: row;
align-items: center;
margin-bottom: 51rpx;
line-height: 100%;
&-icon {
margin-left: auto;
width: 30rpx;
height: 30rpx;
}
&-index {
font-size: 30rpx;
color: #FF9F15;
font-style: italic;
margin-right: 27rpx;
&-top {
color: #FF5D15;
font-weight: bold;
}
}
&-text {
font-size: 30rpx;
margin-right: 15rpx;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
&-count {
font-size: 24rpx;
color: #999;
}
}
}
.search-history {
margin-top: 51rpx;
margin-bottom: 39rpx;
display: flex;
align-items: center;
&-text {
font-size: 32rpx;
font-weight: bold;
}
image {
margin-left: auto;
width: 30rpx;
height: 28rpx;
}
}
.history-list {
display: flex;
align-items: flex-end;
.van-tag {
margin-right: 20rpx;
font-size: 26rpx;
margin-bottom: 22rpx;
}
&-action {
margin-left: auto;
margin-bottom: 10rpx;
}
}
}
.search-list {
background-color: @whiteback;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment