展商详情

pages/activity/components/activity-recommend.vue

@@ -1,12 +1,12 @@
 <template>
 	<view class="activity-recommend">
 		<view class="activity-list">
-			<template v-for="(item, index) in [1, 2, 3]">
+			<template v-for="(item, index) in activityList">
 					<view class="activity-item" :key="index" @click="onClickActivity(item)">
-						<view class="activity-title">KOSHINE 新品上线,解锁防脱生发新方式</view>
-						<view class="activity-time">2024年03月20日 | E1馆二楼M16会议室</view>
+						<view class="activity-title">{{ item.title }}</view>
+						<view class="activity-time">{{ formatDate(item.start_time) }} | {{ item.address }}</view>
 						<view class="activity-summary">
-							<view class="text">Kostal推出第四种机型的太阳能并网逆变器 2008年7月5日:KOSTAL公司原来只有PIKO系列太阳能并网逆变器10.1和5.5,中间没有其他功率段的产品。</view>
+							<view class="text">{{ item.content }}</view>
 							<van-button class="btn-to-detail" type="primary">
 								<template>
 									<view>了解详情</view> <view class="arrow iconfont icon-right-s"></view>
@@ -20,6 +20,8 @@
 </template>
 
 <script>
+	import { exhibitorsBoothActivityList } from '@/api/exhibitor'
+	import { link } from '@/utils/request'
 	
 	export default {
 		options: {
@@ -27,16 +29,55 @@
 		},
 		components: {
 		},
-		props: {},
+		props: {
+			// 特定的展商ID
+			exhibitorId: Number
+		},
+		watch: {
+			exhibitorId(val) {
+				this.activityListParams.exhibitors_id = val
+				this.getActivityList()
+			}
+		},
 		data() {
 			return {
+				activityList: [],
+				activityListParams: {
+					page: 1,
+					page_size: 4,
+					exhibitors_id: 0
+				},
+				activityListLoading: false
 			}
 		},
 		created() {
 		},
 		methods: {
-			onClickActivity() {
-				this.navigateTo('https://mp-test-onlinecatelogue.matchexpo.cn/Xiaomi-Computer-Technology-Exhibition-19')
+			getActivityList() {
+				if (this.activityListLoading === true) {
+					return
+				}
+				this.activityListLoading = true
+				exhibitorsBoothActivityList(this.activityListParams).then(res => {
+					if (res.code === 0) {
+						if (this.activityListParams.page > 1) {
+							this.activityList = [...this.activityList, ...res.data.data]
+						} else {
+							this.activityList = res.data.data
+						}
+					}
+					this.activityListLoading = false
+				})
+			},
+			formatDate(dateString) {
+			  const date = new Date(dateString);
+			  const year = date.getFullYear();
+			  const month = date.getMonth() + 1; // 月份从 0 开始
+			  const day = date.getDate();
+			  return `${year}年${month}月${day}日`;
+			},
+			onClickActivity(item) {
+				this.navigateTo(link('/' + item.urla))
 			}
 		}
 	}

pages/exhibitor/components/exhibit-recommend.vue

@@ -1,20 +1,24 @@
 <template>
 	<view class="exhibit-recommend">
 		<view class="exhibit-list">
-			<template v-for="(item, index) in [1, 2, 3, 4, 5, 6, 7, 8]">
+			<template v-for="(item, index) in productList">
 				<view v-if="index < limit" class="exhibit-item" hover-class="active" :key="index" @click="onClickExhibit(item)">
 					<view class="exhibit-image">
-						<image src="https://oss.starify.cn/prod/starify/up/0001000075/20241113/67343f1c494de.png?x-oss-process=image/resize,w_400" mode="aspectFit"/>
+						<image :src="item.pic + '?x-oss-process=image/resize,w_400'" mode="aspectFit"/>
 					</view>
-					<view class="exhibit-name">汽车连接器 86W MLK 1,2 SD-HOLDER</view>
-					<view class="exhibit-tag">常规产品</view>
+					<view class="exhibit-name">{{ item.name }}</view>
+					<view v-for="(itempro) in item.product_attr_names" class="exhibit-tag">{{ itempro }}</view>
 				</view>
 			</template>
 		</view>
+		<view v-if="showExhibitMore" class="click-more">
+			<van-button type="primary" @click="loadMore()">点击展开更多展品</van-button>
+		</view>
 	</view>
 </template>
 
 <script>
+	import { exhibitorsProductList } from '@/api/exhibitor'
 	
 	export default {
 		options: {
@@ -23,7 +27,8 @@
 		components: {
 		},
 		props: {
-			limit: Number
+			limit: Number,
+			exhibitorId: Number
 		},
 		watch: {
 			limit(val) {
@@ -31,18 +36,52 @@
 				if (val === 8) {
 					this.$emit('show-all')
 				}
+			},
+			exhibitorId(val) {
+				this.productListParams.exhibitors_id = val
+				this.getProductList()
 			}
 		},
 		data() {
 			return {
-				
+				productListParams: {
+					page: 1,
+					page_size: 4,
+					exhibitors_id: 0
+				},
+				productList: [],
+				showExhibitMore: true,
+				productListLoading: false
 			}
 		},
 		created() {
 		},
 		methods: {
-			onClickExhibit() {
-				this.navigateTo('/pages/exhibitor/exhibit-detail')
+			getProductList() {
+				if (this.productListLoading === true) {
+					return
+				}
+				this.productListLoading = true
+				exhibitorsProductList(this.productListParams).then(res => {
+					if (res.code === 0) {
+						if (this.productListParams.page > 1) {
+							this.productList = [...this.productList, ...res.data.data]
+						} else {
+							this.productList = res.data.data
+						}
+						if (this.productListParams.page <= res.data.last_page) {
+							this.showExhibitMore = false
+						}
+					}
+					this.productListLoading = false
+				})
+			},
+			loadMore() {
+				this.productListParams.page = this.productListParams.page + 1
+				this.getProductList()
+			},
+			onClickExhibit(item) {
+				this.navigateTo('/pages/exhibitor/exhibit-detail?id=' + item.id)
 			}
 		}
 	}

pages/exhibitor/components/exhibitor-item.vue

@@ -1,5 +1,5 @@
 <template>
-	<view class="exhibitor-item" hover-class="active" @click="onClickExhibitor">
+	<view class="exhibitor-item" hover-class="active" @click="onClickExhibitor(item.id)">
 		<view class="exhibitor-body">
 			<view class="exhibitor-logo"><image :src="item.logo" mode="aspectFit" /></view>
 			<view class="exhibitor-name">
@@ -72,8 +72,8 @@
 					detail: shareInfo
 				})
 			},
-			onClickExhibitor() {
-				this.navigateTo('/pages/exhibitor/detail')
+			onClickExhibitor(id) {
+				this.navigateTo('/pages/exhibitor/detail?id=' + id)
 			}
 		}
 	}

pages/exhibitor/detail.vue

@@ -10,46 +10,41 @@
 					</view>
 					<view class="exhibitor-title">
 						<view class="exhibitor-title-1">
-							科世达（上海）连接器有限公司
+							{{ exhibitor.name_zh_cn }}
 						</view>
 						<view class="exhibitor-title-2">
-							 Leopold Kostal GmbH & Co. KG
+							 {{ exhibitor.name_en_us }}
 						</view>
 						<view class="exhibitor-title-3">
-							中国（含港澳台）
+							{{ exhibitor.country }}
 						</view>
 					</view>
 					<view class="exhibitor-number">
 						<view class="exhibitor-number-label">展位号:</view>
-						<view class="exhibitor-number-text">E1.1101</view>
+						<view class="exhibitor-number-text">{{ exhibitor.hall_booth_no }}</view>
 					</view>
 				</view>
 				<view class="exhibitor-desc">
-					科世达（上海）连接器有限公司从事连接器、连接器系统的生产加工，汽车零部件、电子元器件、机械设备及其零配件、工具、模具、连接器产品及其生产设备的批发、进出口、佣金代理（拍卖除外），并提供相关配套服务（包括上门安装、保养、维修服务）。
+					{{ exhibitor.introduce_zh_cn }}
 				</view>
 				<view class="exhibitor-tags">
 					<view class="exhibitor-tags-category">产品分类：</view>
 					<view class="exhibitor-tags-list">
-						<view class="exhibitor-tag">柔性与印刷电子</view>
-						<view class="exhibitor-tag">电子制造服务</view>
-						<view class="exhibitor-tag">PCB焊接和连接技术</view>
-						<view class="exhibitor-tag">线束和连接器</view>
-						<view class="exhibitor-tag">柔性与印刷电子</view>
-						<view class="exhibitor-tag">电子制造服务</view>
+						<view class="exhibitor-tag" v-for="(item) in exhibitor.product_cate_names">{{ item }}</view>
 					</view>
 				</view>
 				<view class="exhibitor-tags">
 					<view class="exhibitor-tags-category">应用领域：</view>
-					<view class="exhibitor-tags-list"></view>
-					<view class="exhibitor-tag">电脑和周边设备</view>
-					<view class="exhibitor-tag">新能源</view>
+					<view class="exhibitor-tags-list">
+						<view class="exhibitor-tag"  v-for="(item) in exhibitor.application_areas_names">{{ item }}</view>
+					</view>
 				</view>
 				<view class="exhibitor-operation">
-					<view class="exhibitor-views">浏览：30911</view>
+					<view class="exhibitor-views">浏览：{{ exhibitor.pv }}</view>
 					<view class="exhibitor-action">
 						<view>
 							<view class="iconfont icon-xiaochengxu-renqiicon"></view>
-							<view>人气：11192</view>
+							<view>人气：{{ exhibitor.poll_count }}</view>
 						</view>
 						<view>
 							<button :plain="true" @click.stop="onShare()">
@@ -60,31 +55,30 @@
 							</button>
 						</view>
 						<view>
-							<view v-if="exhibitor.favourited" class="iconfont icon-favourites-filled-star-symbol active"></view>
+							<view v-if="exhibitor.is_collect" class="iconfont icon-favourites-filled-star-symbol active"></view>
 							<view v-else class="iconfont icon-Favourites-Add-Large"></view>
 							<view>收藏</view>
 						</view>
 						<view>
-							<view v-if="exhibitor.liked" class="iconfont icon-aixin active"></view>
+							<view v-if="exhibitor.is_like" class="iconfont icon-aixin active"></view>
 							<view v-else class="iconfont icon-heart1"></view>
 							<view>点赞</view>
 						</view>
 						<view>
-							<view v-if="exhibitor.voted" class="iconfont icon-Ticket1 active"></view>
+							<view v-if="exhibitor.is_poll" class="iconfont icon-Ticket1 active"></view>
 							<view v-else class="iconfont icon-xiaochengxu-toupiaoicon"></view>
 							<view>投票</view>
 						</view>
 					</view>
 				</view>
 				<u-panel title="展品资料">
-					<exhibit-recommend :limit="exhibitRecommendLimit" @show-all="showExhibitMore = false"/>
-					<view v-if="showExhibitMore" class="click-more"><van-button type="primary" @click="exhibitRecommendLimit = 8">点击展开更多展品</van-button></view>
+					<exhibit-recommend :limit="exhibitRecommendLimit" :exhibitorId="exhibitorId"/>
 				</u-panel>
 				<u-panel title="展商新闻">
-					<news-recommend recommend-type="detail" />
+					<news-recommend recommend-type="detail" :exhibitorId="exhibitorId" />
 				</u-panel>
 				<u-panel title="展商活动">
-					<activity-recommend recommend-type="detail" />
+					<activity-recommend recommend-type="detail" :exhibitorId="exhibitorId" />
 				</u-panel>
 				<view class="click-more"><van-button type="primary" @click="navigateTo('/pages/exhibitor/index')">点击查看更多展商信息</van-button></view>
 			</view>
@@ -101,6 +95,7 @@
 	import ExhibitRecommend from '@/pages/exhibitor/components/exhibit-recommend.vue'
 	import NewsRecommend from '@/pages/news/components/news-recommend.vue'
 	import ActivityRecommend from '@/pages/activity/components/activity-recommend.vue'
+	import { exhibitorsInfo } from '@/api/exhibitor'
 	
 	export default {
 		options: {
@@ -117,6 +112,10 @@
 		},
 		computed: {
 		},
+		onLoad(options) {
+			this.exhibitorId = options.id
+			this.getExhibitorsInfo()
+		},
 		data() {
 			return {
 				showExhibitMore: true,
@@ -124,28 +123,41 @@
 				shareInfo: null,
 				exhibitRecommendLimit: 4,
 				exhibitor: {
-					favourited: true,
-					liked: false,
-					voted: false
-				}
+					name_zh_cn: '',
+					name_en_us: '',
+					country: '',
+					hall_booth_no: '',
+					product_cate_names: [],
+					application_areas_names: [],
+					pv: 0,
+					poll_count: 0
+				},
+				exhibitorId: 0
 			}
 		},
 		created() {
 			this.loadFontFace('Poppins')
 		},
 		methods: {
+			getExhibitorsInfo() {
+				exhibitorsInfo({id: this.exhibitorId}).then(res => {
+					if (res.code === 0) {
+						this.exhibitor = res.data
+					}
+				})
+			},
 			onShareAppMessage(ops) {
 				return {
 					title: '科世达（上海）连接器有限公司',
 					path: `/pages/exhibitor/detail`,
-					imageUrl: 'https://oss.starify.cn/prod/starify/up/0001018678/20241108/672da70c02212.png?x-oss-process=image/resize,w_600,h_600,limit_0,m_pad'
+					imageUrl: this.exhibitor.logo + '?x-oss-process=image/resize,w_600,h_600,limit_0,m_pad'
 				}
 			},
 			onShare(item) {
 				this.shareInfo = {
-					title: '科世达（上海）连接器有限公司',
-					path: `/pages/exhibitor/detail`,
-					imageUrl: 'https://oss.starify.cn/prod/starify/up/0001018678/20241108/672da70c02212.png?x-oss-process=image/resize,w_600,h_600,limit_0,m_pad'
+					title: this.exhibitor.name_zh_cn,
+					path: `/pages/exhibitor/detail?id=` + this.exhibitor.id,
+					imageUrl: this.exhibitor.logo + '?x-oss-process=image/resize,w_600,h_600,limit_0,m_pad'
 				}
 				this.showShare = true
 			}

pages/exhibitor/index.vue

@@ -6,15 +6,15 @@
 				<view class="exhibitor-filter">
 					<view>
 						<view class="exhibitor-filter-label">展馆号</view>
-						<u-dropdown-select ref="select1" v-model="searchHall" placeholder="选择展馆号" :options="halls" @dropdown="onSelectDropdown(1)" @change="getExhibitorsList()"/> 
+						<u-dropdown-select ref="select1" v-model="searchHall" placeholder="选择展馆号" :options="halls" @dropdown="onSelectDropdown(1)" @change="searchExhibitorsList()"/> 
 					</view>
 					<view>
 						<view class="exhibitor-filter-label">产品类别</view>
-						<u-dropdown-select ref="select2" v-model="searchCategoryId" placeholder="选择产品类别" :options="categories" @dropdown="onSelectDropdown(2)" @change="getExhibitorsList()"/> 
+						<u-dropdown-select ref="select2" v-model="searchCategoryId" placeholder="选择产品类别" :options="categories" @dropdown="onSelectDropdown(2)" @change="searchExhibitorsList()"/> 
 					</view>
 					<view>
 						<view class="exhibitor-filter-label">应用领域</view>
-						<u-dropdown-select  ref="select3" v-model="searchApplicationAreas" placeholder="选择应用领域" :options="applicationAreass" @dropdown="onSelectDropdown(3)" @change="getExhibitorsList()"/> 
+						<u-dropdown-select  ref="select3" v-model="searchApplicationAreas" placeholder="选择应用领域" :options="applicationAreass" @dropdown="onSelectDropdown(3)" @change="searchExhibitorsList()"/> 
 					</view>
 				</view>
 				<u-search v-model="searchKeyword" placeholder="搜索展商 / 展品名称 / 会议" @search="onSearch" />
@@ -127,13 +127,18 @@
 					this.categories = cate
 				})
 			},
+			searchExhibitorsList() {
+				console.log(this.searchCategoryId)
+				this.exhibitorsParams.application_areas_id = this.searchApplicationAreas || ''
+				this.exhibitorsParams.product_cate_id = this.searchCategoryId || ''
+				this.exhibitorsParams.hall = this.searchHall || ''
+				this.exhibitorsParams.page = 1
+				this.getExhibitorsList()
+			},
 			getExhibitorsList() {
 				if (this.exhibitorListLoading === true) {
 					return
 				}
-				this.exhibitorsParams.application_areas_id = this.searchApplicationAreas
-				this.exhibitorsParams.product_cate_id = this.searchCategoryId
-				this.exhibitorsParams.hall = this.searchHall
 				this.exhibitorListLoading = true
 				exhibitorsList(this.exhibitorsParams).then(res => {
 					if (res.data.data) {

pages/news/components/news-item.vue

@@ -1,16 +1,16 @@
 <template>
 	<view class="news-item" @click="onClickDetail(item)">
-		<view class="news-title">组装自动化与测试测量深度融合，赋能电子制造业高质量发展2024</view>
-		<view class="news-time">2024年6月28日</view>
+		<view class="news-title">{{ item.title }}</view>
+		<view class="news-time">{{ formatDate(item.publish_time) }}</view>
 		<view class="news-summary">
-			<view class="text">在人类历史长河中，工业生产一直是社会进步的重要驱动力，而自动化技术的飞速发展，使其正在经历前所未有的变革。特别是在电子生产制造领域，传统的人工操作由于易疲劳、品质不稳定以及</view>
+			<view class="text">{{ item.content }}</view>
 			<view class="to-detail"><view>了解详情</view> <view class="arrow iconfont icon-right-s"></view></view>
 		</view>
 	</view>
 </template>
 
 <script>
-	
+	import { link } from '@/utils/request'
 	export default {
 		components: {
 		},
@@ -25,9 +25,16 @@
 		created() {
 		},
 		methods: {
+			formatDate(dateString) {
+			  const date = new Date(dateString);
+			  const year = date.getFullYear();
+			  const month = date.getMonth() + 1; // 月份从 0 开始
+			  const day = date.getDate();
+			  return `${year}年${month}月${day}日`;
+			},
 			onClickDetail(item) {
 				if (this.type === 'exhibitor')  {
-					this.navigateTo('https://mp-test-onlinecatelogue.matchexpo.cn/Selis-responds-to-Guangzhou-s-inquiry-on-M7-accident-identification-the-owner-does-not-recognize-the-analysis-conclusion-that-the-case-has-entered-the-judicial-procedure')
+					this.navigateTo(link('/' + item.urla))
 				} else {
 					this.navigateTo('https://www.productronicachina.com.cn/2025%E6%85%95%E5%B0%BC%E9%BB%91%E4%B8%8A%E6%B5%B7%E7%94%B5%E5%AD%90%E7%94%9F%E4%BA%A7%E8%AE%BE%E5%A4%87%E5%B1%953%E6%9C%88%E5%A5%8F%E5%93%8D%E6%96%B0%E7%AF%87%E7%AB%A0-%E6%8E%A2%E7%B4%A2%E7%94%B5%E5%AD%90%E5%88%B6%E9%80%A0%E7%9A%84%E6%97%A0%E9%99%90%E5%8F%AF%E8%83%BD')
 				}

pages/news/components/news-recommend.vue

@@ -14,6 +14,7 @@
 <script>
 	import UTabs from '@/components/common/u-tabs'
 	import NewsItem from '@/pages/news/components/news-item.vue'
+	import { exhibitorsNewsList } from '@/api/exhibitor'
 	
 	export default {
 		components: {
@@ -28,6 +29,12 @@
 				default: 'home'
 			}
 		},
+		watch: {
+			exhibitorId(val) {
+				this.newsListParams.exhibitors_id = val
+				this.getNewsList()
+			}
+		},
 		data() {
 			return {
 				newsType: 'exhibition',
@@ -38,7 +45,13 @@
 					label: '展商新闻',
 					value: 'exhibitor'
 				}],
-				newsList: [{}, {}, {}]
+				newsList: [],
+				newsListParams: {
+					page: 1,
+					page_size: 4,
+					exhibitors_id: 0
+				},
+				newsListLoading: false
 			}
 		},
 		created() {
@@ -47,6 +60,22 @@
 			}
 		},
 		methods: {
+			getNewsList() {
+				if (this.newsListLoading === true) {
+					return
+				}
+				this.newsListLoading = true
+				exhibitorsNewsList(this.newsListParams).then(res => {
+					if (res.code === 0) {
+						if (this.newsListParams.page > 1) {
+							this.newsList = [...this.newsList, ...res.data.data]
+						} else {
+							this.newsList = res.data.data
+						}
+					}
+					this.newsListLoading = false
+				})
+			},
 			tabChange() {
 				
 			}