<template> <view class="exhibit-index exhibitor-index"> <nav-bar title="展品信息" @init="onInitNavbar"></nav-bar> <u-scroll-view> <view class="main-container"> <view class="exhibitor-filter"> <view> <view class="exhibitor-filter-label">展馆号</view> <u-dropdown-select ref="select1" v-model="categoryId" placeholder="选择展馆号" :options="categories" @dropdown="onSelectDropdown(1)" /> </view> <view> <view class="exhibitor-filter-label">产品类别</view> <u-dropdown-select ref="select2" v-model="categoryId" placeholder="选择产品类别" :options="categories" @dropdown="onSelectDropdown(2)" /> </view> <view> <view class="exhibitor-filter-label">应用领域</view> <u-dropdown-select ref="select3" v-model="categoryId" placeholder="选择应用领域" :options="categories" @dropdown="onSelectDropdown(3)" /> </view> </view> <u-search v-model="searchKeyword" placeholder="搜索展商 / 展品名称 / 会议" @search="onSearch" /> <view class="ad-space"> <image src="https://oss.starify.cn/prod/starify/up/0001018678/20241108/672da70a6c76a.png?x-oss-process=image/resize,w_200" mode="aspectFill"/> </view> <van-empty v-if="exhibitList.length === 0" description="暂无数据" /> <view v-else class="exhibit-list exhibitor-list"> <template v-for="(item, index) in exhibitList"> <exhibit-item :item="item" :key="index" /> </template> </view> </view> </u-scroll-view> </view> </template> <script> import NavBar from '@/components/layout/nav-bar' import UScrollView from '@/components/common/u-scroll-view' import USearch from '@/components/common/u-search' import UDropdownSelect from '@/components/common/u-dropdown-select' import ExhibitItem from '@/pages/exhibitor/components/exhibit-item.vue' export default { options: { // styleIsolation: 'shared' }, components: { NavBar, UScrollView, USearch, UDropdownSelect, ExhibitItem }, computed: { }, data() { return { scrollviewHeight: 0, searchKeyword: '', exhibitList: [{ favourited: true }, { liked: true }, { voted: true }, {} ], categories: [{ label: '表面贴装', value: 1, children: [{ label: '表面贴装技术', value: 11 }, { label: 'PCB焊接和连接技术', value: 12 }, { label: '测试测量和质量保证', value: 13 }, { label: '电子组装自动化', value: 14 }, { label: '生产物流和物流技术', value: 15 }, { label: '清洗技术', value: 16 }] }, { label: '线束加工', value: 2 }, { label: '工厂自动化', value: 3 }, { label: '点胶注胶', value: 4 }, { label: '电子制造服务', value: 5 }, { label: '未来服务', value: 6 }] } }, created() { }, methods: { onSelectDropdown(index) { ['select1', 'select2', 'select3'].forEach(v => { if (v !== 'select' + index) { this.$refs[v].hideDropdown() } }) }, onClickExhibit(item) { this.navigateTo('/pages/exhibitor/exhibit-detail') }, onSearch() { this.navigateTo('/pages/index/search?query=' + this.searchKeyword) } } } </script> <style lang="scss"> </style>