Skip to content

C
crisis-event-miniprogram
Commit 37bcd045 by liangyuhang
Options

添加关键词和单个历史记录删除，搜索结果页添加下拉刷新列表

parent 5eaf8318
Showing with 195 additions and 51 deletions
pages/library/library.wxml
<!--pages/library/library.wxml-->
<view class="container">
<view class="condition-con">
<view class="condition-list">
<view class="condition">
<view class="list">
<block wx:for="{{conditions}}" wx:key="index">
<view class="condition {{tabIndex==index? 'active' : ''}}" data-index="{{index}}" data-name="{{item.name}}" bind:tap="switchTap" >
<view class="tab {{tabIndex==index? 'active' : ''}}" data-index="{{index}}" data-name="{{item.name}}" bind:tap="switchTap" >
{{item.name}}
</view>
</block>
......@@ -11,7 +11,7 @@
</view>
<!-- 列表 -->
<view class="list-con">
<view style="margin-top: 100rpx;">
<eventList eventList="{{eventList}}"></eventList>
</view>
</view>
pages/library/library.wxss
/* pages/library/library.wxss */
/* 条件 */
.condition-con{
.condition{
position: fixed;
top: 0;
left: 0;
......@@ -8,13 +8,14 @@
height: 80rpx;
background-color: #025FEA;
z-index: 999;
margin-bottom: -1000rpx;
}
.condition-list{
.list{
display: flex;
padding: 0 30rpx;
line-height: 80rpx;
}
.condition{
.tab{
width: 20vh;
text-align: center;
font-size: 30rpx;
......@@ -38,7 +39,5 @@
}
.list-con{
margin-top: 100rpx;
}
pages/report/report.wxml
<!--pages/report/report.wxml-->
<view class="container">
<view class="condition-con">
<view class="condition-list">
<view class="condition">
<view class="list">
<block wx:for="{{conditions}}" wx:key="index">
<view class="condition {{tabIndex==index? 'active' : ''}}" data-index="{{index}}" data-name="{{item.name}}" bind:tap="switchTap" >
<view class="tab {{tabIndex==index? 'active' : ''}}" data-index="{{index}}" data-name="{{item.name}}" bind:tap="switchTap" >
{{item.name}}
</view>
</block>
......@@ -11,5 +11,7 @@
</view>
<!-- 列表 -->
<view style="margin-top: 100rpx;">
<reportList reportList="{{reportList}}"></reportList>
</view>
</view>
\ No newline at end of file
pages/report/report.wxss
/* pages/report/report.wxss */
/* 条件 */
.condition-con{
.condition{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 80rpx;
background-color: #025FEA;
z-index: 999;
}
.condition-list{
.list{
display: flex;
padding: 0 30rpx;
line-height: 80rpx;
}
.condition{
.tab{
width: 20vh;
text-align: center;
font-size: 30rpx;
......
pages/search-page/search-page.js
......@@ -7,9 +7,10 @@ Page({
* 页面的初始数据
*/
data: {
keyword:'',
historySearch: [],
hotSearchList: []
hotSearchList: [],
keyword:'',
currentTag:''
},
/**
......@@ -50,11 +51,13 @@ Page({
toSearchResult(){
if (this.data.keyword.trim()) {
let _keyword=this.data.keyword.trim();
// 记录搜索
let historySearch = wx.getStorageSync('historySearch') || [];
historySearch = historySearch.filter(item => item !== this.data.keyword)
historySearch.unshift(this.data.keyword);
console.log(this.data.keyword)
historySearch = historySearch.filter(item => item !== _keyword)
historySearch.unshift(_keyword);
console.log(_keyword)
if (historySearch.length>10){
historySearch.pop();
}
......@@ -62,7 +65,16 @@ Page({
// 跳转到搜索结果页
wx.navigateTo({
url: '/pages/search-result/search-result?keyword=' + this.data.keyword,
url: '/pages/search-result/search-result?keyword=' + _keyword,
})
// 清了本页关键词
this.setData({
keyword:''
})
} else {
wx.showToast({
title: '请输入关键词!',
icon: 'none'
})
}
},
......@@ -103,6 +115,24 @@ Page({
});
this.toSearchResult()
},
// 长按历史搜索标签
touchTag(e){
// console.log("我长按了")
// 赋给currentTag，当tag和currentTag一样时显示右上角的删除图标
this.setData({
currentTag: e.currentTarget.dataset.keyword
});
},
// 移除单个搜索历史
clearOneTag(){
// console.log("点击了移除单个搜索历史")
let historySearch = wx.getStorageSync('historySearch') || [];
historySearch = historySearch.filter(item => item !== this.data.currentTag)
wx.setStorageSync('historySearch', historySearch);
//刷新搜索历史
this.getHistorySearch();
},
// 跳转事件详情页
toEventDetail(e){
let _eventId=e.currentTarget.dataset.id
......@@ -110,6 +140,13 @@ Page({
url: '/pages/event-detail/event-detail?eventId='+ _eventId,
})
},
// 清除关键词
clearKeyword(){
// console.log("清除关键词")
this.setData({
keyword:''
})
},
/**
* 生命周期函数--监听页面隐藏
......
pages/search-page/search-page.wxml
......@@ -5,6 +5,9 @@
<view class='search-box'>
<input placeholder="请输入关键词搜索" class='sear-input' bindconfirm='toSearchResult' bindinput='getSearchInput' value='{{keyword}}'></input>
<image src='../../image/search.png' class='search-img'></image>
<view class='delete' wx:if="{{keyword.length>0}}" bindtap="clearKeyword">
<image src='../../image/delete.png' ></image>
</view>
</view>
<text class='cancel' bindtap='cancel'>取消</text>
</view>
......@@ -19,7 +22,8 @@
</view>
<block wx:for="{{historySearch}}" wx:key='item'>
<view class='list'>
<text class='tags' bindtap='onHistorySearch' data-keyword="{{item}}">{{item}}</text>
<text class='tags' capture-bind:longpress="touchTag" bindtap='onHistorySearch' data-keyword="{{item}}">{{item}}</text>
<image src="../../image/delete.png" wx:if="{{currentTag==item}}" bindtap="clearOneTag"></image>
</view>
</block>
</view>
......
pages/search-page/search-page.wxss
......@@ -45,6 +45,20 @@
top: 14rpx;
display: block;
}
.search-bar .search-box .delete {
width: 18rpx;
height: 18rpx;
position: absolute;
right: 50rpx;
top: -5rpx;
display: block;
z-index: 999;
}
.search-bar .search-box .delete image {
width: 32rpx;
height: 32rpx;
padding: 18rpx;
}
/* 历史搜索 */
.history-search{
......@@ -68,7 +82,7 @@
height: 30rpx;
}
.history-search .list {
overflow: hidden;
position: relative;
font-size: 26rpx;
text-align: center;
display: inline-block;
......@@ -86,6 +100,13 @@
margin-bottom: 20rpx;
padding: 10rpx 30rpx;
}
.history-search .list image{
position: absolute;
right: 10rpx;
top: -10rpx;
width: 30rpx;
height: 30rpx;
}
/* 热门搜索 */
.hot-search{
......
pages/search-result/search-result.js
......@@ -7,12 +7,13 @@ Page({
* 页面的初始数据
*/
data: {
page:1,
size:10,
list:[],
keyword:'',
type:1,
list:[],
total:0
page:1,
size:10,
total:0,
isloading:false
},
/**
......@@ -39,6 +40,17 @@ Page({
this.getListByKeyword();
},
getListByKeyword(){
if(!this.data.keyword.trim()){
wx.showToast({
title: '请输入关键词!',
icon: 'none'
})
return
}
this.setData({
isloading:true
})
var params = {
page: this.data.page,
size: this.data.size,
......@@ -50,6 +62,9 @@ Page({
}else{
this.getReportListByKeyword(params);
}
this.setData({
isloading:false
})
},
//根据关键词查询事件列表
getEventListByKeyword(params){
......@@ -57,16 +72,11 @@ Page({
// console.log(res)
if(res){
this.setData({
list:res.data.data.list,
list:this.data.list.concat(res.data.data.list),
total:res.data.data.total
})
}
}).catch(() => {
wx.showToast({
title: '请求失败!',
icon: 'none'
})
});
},
//根据关键词查询报告列表
getReportListByKeyword(params){
......@@ -74,24 +84,24 @@ Page({
// console.log(res)
if(res){
this.setData({
list:res.data.data.list,
list:this.data.list.concat(res.data.data.list),
total:res.data.data.total
})
}
}).catch(() => {
wx.showToast({
title: '请求失败!',
icon: 'none'
})
});
},
switchTap(e) {
var _type = e.currentTarget.dataset.type;
this.setData({
type: _type
list:[],
type: _type,
page:1,
size:10,
total:0
});
this.getListByKeyword();
},
//绑定输出内容
getSearchInput(e){
this.setData({
keyword: e.detail.value
......@@ -101,9 +111,42 @@ Page({
cancel(){
wx.navigateBack({})
},
//搜索
//本页面再次搜索
search(){
if(this.data.keyword.trim()){
wx.showLoading({
title: '加载中...'
})
let _keyword=this.data.keyword.trim();
// 记录搜索
let historySearch = wx.getStorageSync('historySearch') || [];
historySearch = historySearch.filter(item => item !== _keyword)
historySearch.unshift(_keyword);
if (historySearch.length>10){
historySearch.pop();
}
wx.setStorageSync('historySearch', historySearch);
//search-page传过来的trim过了，这里新绑定的没有
this.setData({
keyword: _keyword
})
this.getListByKeyword();
wx.hideLoading()
} else {
wx.showToast({
title: '请输入关键词!',
icon: 'none'
})
}
},
// 清除关键词
clearKeyword(){
this.setData({
keyword:''
})
},
/**
......@@ -131,7 +174,20 @@ Page({
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
// console.log("触底了")
if(this.data.page * this.data.size>=this.data.total){
//下一页无数据
return wx.showToast({
title: '没有下一页了!',
icon: 'none'
})
}
// 防止加载时刷新
if(this.data.isloading) return
this.setData({
page:this.data.page+1
})
this.getListByKeyword();
},
/**
......
pages/search-result/search-result.json
......@@ -2,6 +2,6 @@
"usingComponents": {
"eventList": "/components/eventList/eventList",
"reportList": "/components/reportList/reportList"
}
},
"enablePullDownRefresh": true
}
\ No newline at end of file
pages/search-result/search-result.wxml
......@@ -7,6 +7,9 @@
<view class='search-box'>
<input class='sear-input' value="{{keyword}}" bindinput='getSearchInput' confirm-type='search' bindconfirm='search'></input>
<image src='../../image/search.png' class='search-img'></image>
<view class='delete' wx:if="{{keyword.length>0}}" bindtap="clearKeyword">
<image src='../../image/delete.png' ></image>
</view>
</view>
<text class='cancel' bindtap='cancel'>取消</text>
</view>
......
pages/search-result/search-result.wxss
......@@ -50,6 +50,20 @@
top: 14rpx;
display: block;
}
.search-bar .search-box .delete {
width: 18rpx;
height: 18rpx;
position: absolute;
right: 50rpx;
top: -5rpx;
display: block;
z-index: 999;
}
.search-bar .search-box .delete image {
width: 32rpx;
height: 32rpx;
padding: 18rpx;
}
.fixed-box .tabs {
width: 100%;
......
utils/http.js
......@@ -5,11 +5,11 @@ const imgURL = baseURL+'/app/'
const request = function(url,options){
wx.getStorageSync('token')
let token = wx.getStorageSync('token')
// if(url!='/mobile/login' && !token){
// wx.reLaunch({
// url: '/pages/login/login',
// })
// }
if(url!='/mobile/login' && !token){
wx.reLaunch({
url: '/pages/login/login',
})
}
return new Promise((resolve,reject)=>{
wx.request({
url:baseURL+url,
......@@ -24,6 +24,7 @@ const request = function(url,options){
resolve(res)
} else if(res.data.code == 401 || res.data.code == 402){
//token过期或者账号在其他地方登录
console.log('token过期或者账号在其他地方登录')
reject()
wx.reLaunch({
url: '/pages/login/login',
......@@ -63,7 +64,7 @@ const request = function(url,options){
// get
export const getRequest = (url, data) => {
// wx.showNavigationBarLoading()
wx.showNavigationBarLoading()
return request(url,{
method:"GET",
data
......
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