<template>
<view class="search-index">
<nav-bar title="搜索" @init="onInitNavbar"></nav-bar>
<u-scroll-view :tabbar-conflict="false" @scroll-near-lower="onScrollToLower">
<view class="main-container">
<u-search v-model="searchKeyword" placeholder="搜索展商 / 展品名称 / 会议" @search="onClickSearch"/>
<view class="search-result-text">搜索结果</view>
<template v-if="isEmpty">
<van-empty description="暂无数据" />
</template>
<template v-else>
<u-tabs :active.sync="tabActive" :tabs="tabs" tab-style="default" @change="tabChange"/>
<view v-if="tabActive === 1" class="search-result-list exhibit-list">
<template v-for="(item, index) in exhibitorList">
<exhibitor-item :item="item" :key="index" @updateItemValue="updateItemValue()"/>
</template>
</view>
<view v-else-if="tabActive === 2" class="search-result-list exhibit-list">
<template v-for="(item, index) in exhibitList">
<exhibit-item :item="item" :key="index" @updateItemValue="updateItemValue()"/>
</template>
</view>
<view v-else-if="tabActive === 3" class="search-result-list exhibit-list">
<template v-for="(item, index) in newsList">
<news-item :item="item" :key="index" />
</template>
</view>
<view v-else-if="tabActive === 4" class="search-result-list exhibit-list">
<template v-for="(item, index) in activityList">
<activity-item :item="item" :key="index" @updateItemValue="updateItemValue()"/>
</template>
</view>
<view v-else-if="tabActive === 5" class="search-result-list exhibit-list">
<template v-for="(item, index) in mettingList">
<activity-item :item="item" :key="index" platform="metting" @updateItemValue="updateItemValue()"/>
</template>
</view>
</template>
<disclaimer-text></disclaimer-text>
</view>
</u-scroll-view>
</view>
</template>
<script>
import NavBar from '@/components/layout/nav-bar'
import UTabs from '@/components/common/u-tabs'
import UScrollView from '@/components/common/u-scroll-view'
import USearch from '@/components/common/u-search'
import ExhibitItem from '@/pages/exhibitor/components/exhibit-item.vue'
import ExhibitorItem from '@/pages/exhibitor/components/exhibitor-item.vue'
import NewsItem from '@/pages/news/components/news-item.vue'
import ActivityItem from '@/pages/activity/components/activity-item.vue'
import { globalSearch, mettingList, exhibitorsList, exhibitorsProductList, exhibitorsNewsList, exhibitorsBoothActivityList } from '@/api/exhibitor'
import DisclaimerText from '@/components/disclaimer-text/index.vue'
export default {
options: {
styleIsolation: 'shared'
},
components: {
NavBar,
UScrollView,
UTabs,
USearch,
ExhibitItem,
ExhibitorItem,
NewsItem,
ActivityItem,
DisclaimerText
},
data() {
return {
searchKeyword: '',
tabActive: 1,
isEmpty: false,
defaultTabs: [{
label: '展商',
value: 1
}, {
label: '展品',
value: 2
}, {
label: '展商新闻',
value: 3
}, {
label: '展商活动',
value: 4
}, {
label: '同期活动',
value: 5
}],
tabs: [],
exhibitorList: [],
exhibitorListLoading: false,
exhibitorListLastPage: 1,
exhibitorListParams: {
page: 1,
page_size: 10,
keyword: ''
},
exhibitList: [],
exhibitListLoading: false,
exhibitListLastPage: 1,
exhibitListParams: {
page: 1,
page_size: 10,
keyword: ''
},
newsList: [],
newsListLoading: false,
newsListLastPage: 1,
newsListParams: {
page: 1,
page_size: 10,
keyword: ''
},
activityList: [],
activityListLoading: false,
activityListLastPage: 1,
activityListParams: {
page: 1,
page_size: 10,
keyword: ''
},
mettingList: [],
mettingListLoading: false,
mettingListLastPage: 1,
mettingListParams: {
page: 1,
page_size: 10,
keyword: ''
},
listParams: {
page: 1,
page_size: 10,
keyword: ''
}
}
},
onLoad(options) {
console.log('options')
console.log(options.query)
this.searchKeyword = options.query
this.onClickSearch()
},
created() {},
methods: {
tabChange() {
},
onClickSearch() {
this.listParams.page = 1
this.listParams.keyword = this.searchKeyword
this.exhibitorListParams = {...this.listParams}
this.exhibitListParams = {...this.listParams}
this.newsListParams = {...this.listParams}
this.activityListParams = {...this.listParams}
this.mettingListParams = {...this.listParams}
this.tabs = [...this.defaultTabs]
this.getGlobalSearch()
this.getMettingList()
},
getGlobalSearch() { // 全局搜索
globalSearch(this.listParams).then(res => {
if (res.code === 0) {
this.exhibitorList = res.data.exhibitors_list.data ?? []
this.exhibitorListLastPage = res.data.exhibitors_list.last_page ?? 1
this.exhibitList = res.data.product_list.data ?? []
this.exhibitListLastPage = res.data.product_list.last_page ?? 0
this.newsList = res.data.news_list.data ?? []
this.newsListLastPage = res.data.news_list.last_page ?? 0
this.activityList = res.data.booth_activity_list.data ?? []
this.activityListLastPage = res.data.booth_activity_list.last_page ?? 0
if (this.exhibitorList.length === 0) {
this.tabs = this.tabs.filter(item => item.value !== 1);
}
if (this.exhibitList.length === 0) {
this.tabs = this.tabs.filter(item => item.value !== 2);
}
if (this.newsList.length === 0) {
this.tabs = this.tabs.filter(item => item.value !== 3);
}
if (this.activityList.length === 0) {
this.tabs = this.tabs.filter(item => item.value !== 4);
}
}
})
},
getExhibitorsList() { // 展商
this.exhibitorListLoading = true
exhibitorsList(this.exhibitorListParams).then(res => {
if (res.data.data) {
if (this.exhibitorListParams.page > 1) {
this.exhibitorList = [...this.exhibitorList, ...res.data.data]
} else {
this.exhibitorList = res.data.data
this.exhibitorListLastPage = res.data.last_page
}
} else {
this.showToast('系统繁忙，稍候再试')
}
this.exhibitorListLoading = false
})
},
getExhibitList() { // 展品
this.exhibitListLoading = true
exhibitorsProductList(this.exhibitListParams).then(res => {
if (res.data.data) {
if (this.exhibitListParams.page > 1) {
this.exhibitList = [...this.exhibitList, ...res.data.data]
} else {
this.exhibitList = res.data.data
this.exhibitListLastPage = res.data.last_page
}
} else {
this.showToast('系统繁忙，稍候再试')
}
this.exhibitListLoading = false
})
},
getExhibitorsNewsList() { // 展商新闻
this.newsListLoading = true
exhibitorsNewsList(this.newsListParams).then(res => {
if (res.data.data) {
if (this.newsListParams.page > 1) {
this.newsList = [...this.newsList, ...res.data.data]
} else {
this.newsList = res.data.data
this.newsListLastPage = res.data.last_page
}
} else {
this.showToast('系统繁忙，稍候再试')
}
this.newsListLoading = false
})
},
getActivityList() { // 展台活动
this.activityListLoading = true
exhibitorsBoothActivityList(this.activityListParams).then(res => {
if (res.data.data) {
if (this.activityListParams.page > 1) {
this.activityList = [...this.activityList, ...res.data.data]
} else {
this.activityList = res.data.data
this.activityListLastPage = res.data.last_page
}
} else {
this.showToast('系统繁忙，稍候再试')
}
this.activityListLoading = false
})
},
getMettingList() { // 同期活动
this.mettingListLoading = true
mettingList(this.mettingListParams).then(res => {
if (res.data.data) {
if (this.mettingListParams.page > 1) {
this.mettingList = [...this.mettingList, ...res.data.data]
} else {
this.mettingList = res.data.data
this.mettingListLastPage = res.data.last_page
}
if (this.mettingListParams.page === 1 && this.mettingList.length === 0) {
this.tabs = this.tabs.filter(item => item.value !== 5);
}
} else {
this.showToast('系统繁忙，稍候再试')
}
this.mettingListLoading = false
})
},
onScrollToLower(e) {
if (this.tabActive === 1) {
if (this.exhibitorListLastPage === this.exhibitorListParams.page) return
if (this.exhibitorListLoading === true) return
this.exhibitorListLoading = true
this.exhibitorListParams.page = this.exhibitorListParams.page+1
this.getExhibitorsList()
} else if (this.tabActive === 2) {
if (this.exhibitListLastPage === this.exhibitListParams.page) return
if (this.exhibitListLoading === true) return
this.exhibitListLoading = true
this.exhibitListParams.page = this.exhibitListParams.page+1
this.getExhibitList()
} else if (this.tabActive === 3) {
if (this.newsListLastPage === this.newsListParams.page) return
if (this.newsListLoading === true) return
this.newsListLoading = true
this.newsListParams.page = this.newsListParams.page+1
this.getExhibitorsNewsList()
} else if (this.tabActive === 4) {
if (this.activityListLastPage === this.activityListParams.page) return
if (this.activityListLoading === true) return
this.activityListLoading = true
this.activityListParams.page = this.activityListParams.page+1
this.getActivityList()
} else if (this.tabActive === 5) {
if (this.mettingListLastPage === this.mettingListParams.page) return
if (this.mettingListLoading === true) return
this.mettingListLoading = true
this.mettingListParams.page = this.mettingListParams.page+1
this.getMettingList()
}
},
updateItemValue(e) {
if (this.tabActive === 1) {
this.exhibitorList.forEach((item) => {
if (item.id === e.id) {
item[e.key] = e.value
}
})
} else if (this.tabActive === 2) {
this.exhibitList.forEach((item) => {
if (item.id === e.id) {
item[e.key] = e.value
}
})
} else if (this.tabActive === 4) {
this.activityList.forEach((item) => {
if (item.id === e.id) {
item[e.key] = e.value
}
})
} else if (this.tabActive === 5) {
this.mettingList.forEach((item) => {
if (item.id === e.id) {
item[e.key] = e.value
}
})
}
}
}
}
</script>
<style lang="scss">
.search-result-text{
margin: 33rpx 0;
display: block;
font-size: $fontSize3;
color: #000000;
}
.search-result-list{
display: grid;
grid-template-columns: 1fr;
grid-row-gap: 28rpx;
margin-top: 32rpx;
}
</style>