You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
479 lines
11 KiB
479 lines
11 KiB
<template>
|
|
<view class="container">
|
|
<loadlogo v-if="!loadlogo" />
|
|
<view class="page-search" v-if="loadlogo">
|
|
<far-bottom></far-bottom>
|
|
<view class="search-h" :style="{backgroundColor: searchA.serbgw}">
|
|
<view class="search-h-t1">
|
|
<view class="search-h-t1-r f-30" style="color: #999999;" @click="cancelBtn">
|
|
<view class="search-h-t1-r-lk" style="padding-right: 20upx;height: 30px;line-height: 30px;margin-top: 4px;"><text class="iconfont icon-pullleft" style="font-size: 30upx;padding-right: 10upx;"></text>返回</view>
|
|
</view>
|
|
<view class="search-h-t1-l">
|
|
<view class="search-h-t1-l-lab" :style="{backgroundColor: searchA.serbgn}">
|
|
<view class="i icon iconfont icon-search"></view>
|
|
<input type="text" focus='ture' class="search-txt" v-model="keywords" @confirm="search()" placeholder="商品/头条/帖子">
|
|
</view>
|
|
</view>
|
|
<view class="search-h-t1-r f-34" @click="search()">
|
|
<view class="search-h-t1-r-lk weui-grid">确定</view>
|
|
</view>
|
|
</view>
|
|
<view class="search-h-t2" v-if="!ishotSearch">
|
|
<view class="i" :class="{active: listAct == 0}" @click="listActDo(0,'1')">商品</view>
|
|
<view class="i" :class="{active: listAct == 1}" @click="listActDo(1,'3')" v-if="is_headline===1">头条</view>
|
|
<!-- <view class="i" :class="{active: listAct == 2}" @click="listActDo(2,'2')">店铺</view> -->
|
|
<view class="i" :class="{active: listAct == 3}" @click="searchPost(3,'4')" v-if="is_pocket == 1">帖子</view>
|
|
</view>
|
|
</view>
|
|
<view class="search-t1" v-if="ishotSearch">
|
|
<view class="search-t1-t">热门搜索</view>
|
|
<view class="search-t1-b">
|
|
<view class="i f-24" v-for="(item,index) in hotSearchData" :key="index" @click="hotItemSearch(item)">{{item}}</view>
|
|
</view>
|
|
</view>
|
|
<block v-if="!!searchList &&searchList.length>0 || citywideList.length > 0">
|
|
<view class="search-content" style="padding: 20rpx 0;">
|
|
<view class="search-goods" v-if="searchType ==='1'">
|
|
<block v-for="(listItem,index) in searchList" :key="index">
|
|
<goods-style :goodsStyleType="listItem.goods_type" :goodslistData="listItem.info" :issearch="'1'"></goods-style>
|
|
<!-- @remindSuccess="remindSuccess" -->
|
|
</block>
|
|
</view>
|
|
<view class="search-top padding-box" v-if="searchType ==='3'">
|
|
<toplist :topList="searchList" />
|
|
</view>
|
|
<view class="search-store padding-box" v-if="searchType ==='2'">
|
|
<storelist :search="true" :storeList="searchList" />
|
|
</view>
|
|
<view class="search-post padding-box" v-if="searchType ==='4'">
|
|
<!-- 掌上信息 -->
|
|
<!-- <view class="post-item" v-for="(item,index) in citywideList" :key="index">
|
|
<post-list :itemInfo="item" :indexNumber="index" :indexShow='indexShow' @getover="getover" @operationShow="operationShow" ></post-list>
|
|
</view> -->
|
|
<!-- 首页社区 -->
|
|
<pic-text-list :communityList="citywideList" @changenoMore1="changenoMore1" :scrollLock="scrollLock" @changeScrollLock="changeScrollLock"></pic-text-list>
|
|
|
|
</view>
|
|
</view>
|
|
<load-more :isMore="loadingMore"></load-more>
|
|
</block>
|
|
<block v-else>
|
|
<none-mores></none-mores>
|
|
</block>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import App from '@/common/js/app.js'
|
|
import Goodslist from '@/components/template/goodslist.vue'
|
|
import Toplist from '@/components/template/toplist.vue'
|
|
import Storelist from '@/components/template/storelist.vue'
|
|
import Loadlogo from '@/components/template/loadlogo'
|
|
import goodsStyle from '@/components/page/pageComponents/goodsStyle.vue'
|
|
import loadMore from '@/components/template/loadmore.vue'
|
|
import noneMores from '@/components/template/nonemores.vue'
|
|
import postList from '@/components/template/postList'
|
|
import picTextList from "@/components/template/pic_text/pic_text_list.vue"
|
|
// #ifdef H5
|
|
import wxApi from "@/common/js/wxApi.js"
|
|
// #endif
|
|
export default {
|
|
data() {
|
|
return {
|
|
loadlogo: false,
|
|
listAct: 0,
|
|
lng: null,
|
|
lat: null,
|
|
current_page: 1, //当前页数
|
|
keywords: '', //搜索内容
|
|
is_headline: null, //搜索内容详情
|
|
is_pocket:null,
|
|
searchList: [],
|
|
total: null,
|
|
searchType: '1', // 搜索内容类型
|
|
hotSearchData: null, //热门搜索
|
|
ishotSearch: true, //是否打开热门搜索
|
|
loadingMore: true,
|
|
searchA:{},
|
|
postPage:1,
|
|
citywideList:[],
|
|
postTotal:1,
|
|
indexShow: -1,
|
|
scrollLock: false,
|
|
}
|
|
},
|
|
computed: {
|
|
|
|
},
|
|
components: {
|
|
Goodslist,
|
|
Toplist,
|
|
Storelist,
|
|
Loadlogo,
|
|
goodsStyle,
|
|
loadMore,
|
|
noneMores,
|
|
postList,
|
|
picTextList
|
|
},
|
|
mounted() {
|
|
this.hotSearch()
|
|
// #ifdef H5
|
|
wxApi.wxRegister(this.wxApiCallback);
|
|
// #endif
|
|
|
|
// #ifdef MP
|
|
App.getLocation().then(res => {
|
|
this.locationcb(res.latitude, res.longitude)
|
|
})
|
|
// #endif
|
|
},
|
|
onReachBottom() {
|
|
console.log('Bottom')
|
|
let _this = this,
|
|
{
|
|
current_page,
|
|
total,
|
|
searchType
|
|
} = _this;
|
|
if (current_page >= total) {
|
|
_this.loadingMore = true;
|
|
return false;
|
|
}
|
|
if(this.searchType != '4'){
|
|
_this.searchDataInfo(++_this.current_page, searchType, true);
|
|
}else{
|
|
if(this.postPage == this.postTotal){
|
|
_this.loadingMore = true;
|
|
return
|
|
}
|
|
this.postPage++;
|
|
this.searchPost(3,'4',true)
|
|
}
|
|
|
|
},
|
|
methods: {
|
|
operationShow(e) {
|
|
let _this = this;
|
|
_this.indexShow = e;
|
|
},
|
|
getover(id,bor){
|
|
this.$emit('getaver',id,bor)
|
|
},
|
|
//热门搜索列表
|
|
hotSearch() {
|
|
let _this = this;
|
|
App._post_form('&do=GetPlatformInfor&type=2', {}, res => {
|
|
_this.setData({
|
|
hotSearchData: res.data.data,
|
|
searchA:res.data,
|
|
ishotSearch: !!res.data ? true : false
|
|
});
|
|
}, false, () => {
|
|
_this.loadlogo = true;
|
|
})
|
|
// App._post_form('&do=GetPlatformInfor', {
|
|
// type: 2
|
|
// }, res => {
|
|
|
|
// _this.setData({
|
|
// hotSearchData: res.data,
|
|
// ishotSearch: !!res.data ? true : false
|
|
// });
|
|
// console.log(_this.hotSearchData)
|
|
// }, false, () => {
|
|
// _this.loadlogo = true;
|
|
// })
|
|
},
|
|
// 热门搜索点击
|
|
hotItemSearch(searchItem) {
|
|
let _this = this;
|
|
_this.setData({
|
|
keywords: searchItem,
|
|
ishotSearch: false
|
|
})
|
|
_this.search()
|
|
},
|
|
//导入定位
|
|
wxApiCallback() {
|
|
let _this = this;
|
|
console.log(jWeixin);
|
|
jWeixin.ready(() => {
|
|
jWeixin.getLocation({
|
|
type: 'gcj02',
|
|
success: function(res) {
|
|
_this.setData({
|
|
lng: res.longitude,
|
|
lat: res.latitude
|
|
})
|
|
}
|
|
});
|
|
});
|
|
},
|
|
locationcb(lat, lng) {
|
|
let _this = this;
|
|
_this.setData({
|
|
lng,
|
|
lat
|
|
})
|
|
},
|
|
cancelBtn() {
|
|
uni.navigateBack({
|
|
delta: 1
|
|
})
|
|
},
|
|
searchPost(index, type, isSearch = false){
|
|
this.listAct = index;
|
|
this.searchType = '4';
|
|
let _this = this,
|
|
requestData = {
|
|
page:this.postPage,
|
|
keyword: _this.keywords
|
|
};
|
|
App._post_form('&p=pocket&do=infoList', requestData, res => {
|
|
console.log(res);
|
|
if(isSearch){
|
|
_this.citywideList = _this.citywideList.concat(res.data.list);
|
|
}else{
|
|
_this.citywideList = res.data.list;
|
|
_this.postTotal = res.data.total;
|
|
}
|
|
_this.loadingMore = true;
|
|
// console.log(_this.citywideList, '----citywideList----');
|
|
}, false, () => {
|
|
uni.hideLoading()
|
|
});
|
|
},
|
|
//tabbar
|
|
listActDo(index, type, isSearch = false) {
|
|
uni.showLoading()
|
|
if (index > -1) {
|
|
this.listAct = index
|
|
};
|
|
this.initData()
|
|
this.searchDataInfo(1, type)
|
|
this.searchType = isSearch ? '1' : type;
|
|
},
|
|
// 数据初始化
|
|
initData() {
|
|
let _this = this;
|
|
//初始化数据
|
|
_this.current_page = 1;
|
|
},
|
|
//搜索
|
|
search() {
|
|
uni.showLoading({});
|
|
this.listActDo("", "1", true);
|
|
},
|
|
// 搜索详情数据
|
|
searchDataInfo(page = 1, type = '1', isPage = false) {
|
|
let _this = this,
|
|
requestData = {
|
|
page,
|
|
type,
|
|
search: _this.keywords,
|
|
lng: _this.lng,
|
|
lat: _this.lat
|
|
};
|
|
App._post_form('&do=Search', requestData, res => {
|
|
let searchData = res.data;
|
|
if (type === '1') {
|
|
searchData.list = searchData.list.map((val) => {
|
|
let listarr = [];
|
|
listarr.push(val.info)
|
|
val.info = listarr;
|
|
return val
|
|
})
|
|
};
|
|
if (isPage) {
|
|
if (searchData.list.length > 0) {
|
|
_this["searchList"].push(...searchData.list);
|
|
} else {
|
|
_this.loadingMore = true;
|
|
}
|
|
} else {
|
|
_this.setData({
|
|
searchList: searchData.list,
|
|
loadingMore: searchData.list.length === 0 || _this.current_page === res.data.total,
|
|
ishotSearch: false
|
|
})
|
|
}
|
|
_this.setData({
|
|
total: res.data.total,
|
|
is_headline: res.data.is_headline,
|
|
is_pocket:res.data.is_pocket
|
|
})
|
|
}, false, () => {
|
|
uni.hideLoading()
|
|
});
|
|
},
|
|
changenoMore1(e){
|
|
this.loadingMore = e;
|
|
},
|
|
changeScrollLock(e){
|
|
this.scrollLock = e;
|
|
},
|
|
|
|
},
|
|
onPageScroll(e){
|
|
//页面滚动，视频暂停
|
|
this.scrollLock = true;
|
|
// this.handlerScroll();
|
|
},
|
|
|
|
onPullDownRefresh() {
|
|
|
|
}
|
|
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.container {
|
|
background-color: #fff;
|
|
}
|
|
|
|
.page-search {
|
|
background-color: #fff;
|
|
}
|
|
|
|
.search-h {
|
|
padding: 10upx 30upx 0 30upx;
|
|
background-color: #FFD93F;
|
|
}
|
|
|
|
.search-h-t1 {
|
|
height: 80upx;
|
|
line-height: 80upx;
|
|
display: -webkit-flex;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.search-h-t1-l {
|
|
-webkit-flex: 1;
|
|
flex: 1;
|
|
padding-right: 20upx;
|
|
}
|
|
|
|
.search-h-t1-l-lab {
|
|
height: 60upx;
|
|
line-height: 60upx;
|
|
border-radius: 60upx;
|
|
margin-top: 8upx;
|
|
padding-left: 80upx;
|
|
padding-right: 20upx;
|
|
background-color: #FFF4C4;
|
|
display: block;
|
|
position: relative;
|
|
}
|
|
|
|
.search-h-t1-l-lab .i {
|
|
width: 80upx;
|
|
height: 60upx;
|
|
line-height: 60upx;
|
|
font-size: 32upx;
|
|
text-align: center;
|
|
font-style: normal;
|
|
display: block;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
}
|
|
|
|
.search-txt {
|
|
height: 60upx;
|
|
font-size: 28upx;
|
|
}
|
|
|
|
.search-h-t1-r {
|
|
text-align: center;
|
|
}
|
|
|
|
.search-h-t1-r-lk {
|
|
height: 60upx;
|
|
line-height: 60upx;
|
|
margin-top: 8upx;
|
|
padding: 0 20upx;
|
|
border-radius: 100upx;
|
|
}
|
|
|
|
.search-h-t2 {
|
|
display: -webkit-flex;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.search-h-t2 .i {
|
|
font-style: normal;
|
|
padding: 30upx 0;
|
|
}
|
|
|
|
.search-h-t2 .active {
|
|
border-bottom: 6upx solid #353535;
|
|
}
|
|
|
|
.search-t1 {
|
|
padding: 40upx 30upx;
|
|
}
|
|
|
|
.search-t1-t {
|
|
color: #808080;
|
|
font-size: 26upx;
|
|
}
|
|
|
|
.search-t1-b:after {
|
|
content: "";
|
|
display: block;
|
|
clear: both;
|
|
}
|
|
|
|
.search-t1-b .i {
|
|
height: 56upx;
|
|
line-height: 56upx;
|
|
font-size: 24upx;
|
|
font-style: normal;
|
|
margin: 20upx 20upx 0 0;
|
|
padding: 0 30upx;
|
|
background-color: #EDEDED;
|
|
border-radius: 60upx;
|
|
float: left;
|
|
}
|
|
|
|
.search-t2 {
|
|
padding: 40upx 30upx;
|
|
}
|
|
|
|
.search-nothing {
|
|
margin-top: 260upx;
|
|
}
|
|
|
|
.search-nothing .h1 {
|
|
width: 140upx;
|
|
height: 140upx;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.search-nothing .h1 .image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.search-nothing .p {
|
|
color: #999;
|
|
font-size: 32upx;
|
|
text-align: center;
|
|
margin-top: 20upx;
|
|
}
|
|
|
|
.search-top {
|
|
padding: 30upx;
|
|
}
|
|
.search-post{
|
|
|
|
}
|
|
.post-item{
|
|
box-shadow: 0px 8px 24px rgba(221, 221, 221, 0.5);
|
|
}
|
|
</style>
|
|
|