同期活动

App.vue

@@ -1,5 +1,6 @@
 <script>
 	export default {
+		computed: {},
 		onLaunch: function() {
 			console.log('App Launch')
 		},
@@ -13,5 +14,5 @@
 </script>
 
 <style lang="scss">
-  @import "@/static/style/app.scss";
-</style>
+	@import "@/static/style/app.scss";
+</style>

components/common/u-dropdown-select/index.vue

@@ -193,6 +193,16 @@
 						console.log('offsetTop:', data.top);
 					}
 				}).exec()
+				console.log(this.showOptions)
+				if (this.showOptions) {
+					this.$emit('dropdown')
+				}
+			},
+			showDropdown() {
+				this.showOptions = true
+			},
+			hideDropdown() {
+				this.showOptions = false
 			}
 		}
 	}
@@ -218,6 +228,7 @@
 		border: 1rpx solid #D9D9D9;
 		&.active{
 			background-color: $buttonPrimaryColor;
+			border-color: $buttonPrimaryColor;
 			color: white;
 		}
 		.van-icon{
@@ -261,11 +272,11 @@
 	.u-dropdown-action{
 		display: grid;
 		grid-template-columns: 1fr 1fr;
-	}
-	.van-button{
-		border-radius: 0rpx;
-		height: 80rpx;
-		font-size: $fontSize2;
+		.van-button{
+			border-radius: 0rpx;
+			height: 80rpx;
+			font-size: $fontSize2;
+		}
 	}
 	.van-empty__description{
 		font-size: $fontSize2;

components/common/u-panel/index.vue

@@ -2,7 +2,7 @@
 	<view class="u-panel">
 		<view class="u-panel-head display-flex-between">
 			<view class="u-panel-title">{{ title }}</view>
-			<view class="u-panel-link" @tap="onClickLink">
+			<view v-if="link" class="u-panel-link" @tap="onClickLink">
 				{{ linkText || '查看更多' }} <van-icon class="van-icon" name="arrow" />
 			</view>
 		</view>
@@ -47,7 +47,7 @@
 		}
 	}
 </script>
-<style lang="scss" scoped>
+<style lang="scss">
 	.u-panel{
 		padding: 24rpx 28rpx;
 	}

components/common/u-scroll-view/index.vue

@@ -0,0 +1,40 @@
+<template>
+	<scroll-view :scroll-y="true" :style="pageScrollStyle">
+		<slot></slot>
+	</scroll-view>	
+</template>
+
+<script>
+	export default {
+		options: {
+			styleIsolation: 'shared'
+		},
+		props: {
+			tabbarConflict: Boolean
+		},
+		computed: {
+			pageScrollStyle() {
+				let pageHeight = this.$config.pageHeight
+				if (this.tabbarConflict) {
+					pageHeight = this.$config.pageHeight - uni.upx2px(150)
+				}
+				console.log("tabbarConflict")
+				console.log(this.tabbarConflict)
+				return 'height: ' + pageHeight + 'px'
+			}
+		},
+		watch: {
+		},
+		data() {
+			return {}
+		},
+		created() {
+		},
+		mounted() {
+		},
+		methods: {
+		}
+	}
+</script>
+<style lang="scss">
+</style>

components/common/u-search/index.vue

@@ -0,0 +1,96 @@
+<template>
+	<view class="u-search">
+		<view class="u-search-input">
+			<van-search :value="searchKeyword" :placeholder="placeholder" use-action-slot class="van-search"
+				@change="query">
+				<view class="u-search-text" slot="action" @tap="onClickSearch">搜索</view>
+			</van-search>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		options: {
+			styleIsolation: 'shared'
+		},
+		props: {
+			value: String,
+			placeholder: {
+				type: String,
+				default: ''
+			}
+		},
+		computed: {},
+		watch: {
+			searchKeyword(val) {
+				this.$emit('input', val)
+			}
+		},
+		data() {
+			return {
+				searchKeyword: ''
+			}
+		},
+		created() {},
+		mounted() {},
+		methods: {
+			query(e) {
+				this.searchKeyword = e.detail
+			},
+			onClickSearch() {
+				this.$emit('search')
+			}
+		}
+	}
+</script>
+<style lang="scss">
+	.u-search {
+		.u-search-input {
+			height: 64rpx;
+			border-radius: 50rpx;
+			background-color: #FFFFFF;
+			box-shadow: 0 4rpx 4rpx 0 rgba(0, 0, 0, 0.15);
+			border: 2rpx solid #D9D9D9;
+			padding: 4rpx;
+			overflow: hidden;
+
+			.van-field__placeholder {
+				font-size: $fontSize1;
+			}
+
+			.van-cell__left-icon-wrap {
+				height: 50rpx;
+			}
+
+			.van-field__control {
+				font-size: $fontSize1;
+				height: 50rpx;
+			}
+		}
+
+		.van-search {
+			--search-padding: 0rpx;
+			--search-input-height: 34rpx;
+			--search-background-color: #FFFFFF;
+			padding-right: 24rpx;
+			font-size: $fontSize1;
+		}
+
+		.u-search-text {
+			font-size: $fontSize1;
+		}
+
+		.van-search__action {
+			color: #333333;
+		}
+
+		.van-icon {
+			color: #D4D4D6;
+		}
+
+		.van-cell {
+			padding: 2rpx 0rpx 2rpx !important;
+		}
+	}
+</style>

components/common/u-tabs/index.vue

@@ -1,7 +1,7 @@
 <template>
 	<van-tabs :class="clazz" :active="tabActive" :ellipsis="false" @change="tabChange">
 		<template v-for="(item, index) in tabs">
-			<van-tab class="u-tab" :title="item.label" :name="item.value"></van-tab>
+			<van-tab class="u-tab" :title="item.label" :name="item.value" :key="item.value"></van-tab>
 		</template>
 	</van-tabs>
 </template>
@@ -56,8 +56,6 @@
 		},
 		created() {
 			// this.tabActive = this.active
-			console.log("===================")
-			console.log(this.tabStyle)
 		},
 		mounted() {
 		},

components/layout/nav-bar.vue

@@ -4,8 +4,8 @@
 		</view>
 		<view class="nav-bar-title" :style="{ height: titleBarHeight +'px' }">
 			<template v-if="title">
-				<view>
-					<van-icon v-if="hasParent" name="arrow-left" @click="goBack"/>
+				<view class="btn-back" @click="goBack">
+					<van-icon v-if="hasParent" name="arrow-left" />
 				</view>
 				<view class="nav-bar-title-text">{{ title }}</view>
 				<view></view>
@@ -35,14 +35,20 @@
 			}
 		},
 		created() {
-			const systemInfo = uni.getSystemInfoSync()
-			this.statusBarHeight = systemInfo.statusBarHeight
+			const windowInfo = uni.getWindowInfo()
+			this.statusBarHeight = windowInfo.statusBarHeight
 			const menuButtonInfo = uni.getMenuButtonBoundingClientRect()
-			this.titleBarHeight = (menuButtonInfo.top - this.statusBarHeight) * 2 + menuButtonInfo.height + (systemInfo.screenWidth / 750 * 16)
+			this.titleBarHeight = (menuButtonInfo.top - this.statusBarHeight) * 2 + menuButtonInfo.height + (windowInfo.screenWidth / 750 * 16)
+			this.$emit('init', {
+				detail: {
+					navbarHeight: this.statusBarHeight + this.titleBarHeight,
+					pageHeight: windowInfo.screenHeight - (this.statusBarHeight + this.titleBarHeight)
+				}
+			})
 		},
 		methods: {
 			goBack() {
-				uni.navigateBack()
+				wx.navigateBack()
 			}
 		}
 	}
@@ -70,4 +76,7 @@
 		text-transform: none;
 		padding-left: 8rpx;
 	}
+	.btn-back{
+		padding: 0 6rpx;
+	}
 </style>

main.js

@@ -4,9 +4,33 @@ import App from './App'
 import Vue from 'vue'
 import Store from './store'
 import { initLocale } from '@/locales/i18n'
+import NavBar from '@/components/layout/nav-bar'
+import UScrollView from '@/components/common/u-scroll-view'
+import UPanel from '@/components/common/u-panel'
+import USearch from '@/components/common/u-search'
+import USwiper from '@/components/common/u-swiper'
+import UDropdownSelect from '@/components/common/u-dropdown-select'
+import UTabs from '@/components/common/u-tabs'
 
 import './uni.promisify.adaptor'
 Vue.config.productionTip = false
+Vue.prototype.$config = {
+	pageHeight: 0
+}
+Vue.prototype.onInitNavbar = function(e) {
+	this.$config.pageHeight = e.detail.pageHeight
+	console.log("this.$config.pageHeight")
+	console.log(this.$config.pageHeight)
+}
+// 自定义公供组件
+Vue.component('NavBar', NavBar)
+Vue.component('UScrollView', UScrollView)
+Vue.component('UPanel', UPanel)
+Vue.component('USearch', USearch)
+Vue.component('USwiper', USwiper)
+Vue.component('UDropdownSelect', UDropdownSelect)
+Vue.component('UTabs', UTabs)
+
 App.mpType = 'app'
 const app = new Vue({
 	App,

pages.json

@@ -6,6 +6,13 @@
 				"navigationBarTitleText": "uni-app"
 			}
 		},
+		{ "path": "pages/activity/index" },
+		{ "path": "pages/activity/detail" },
+		{ "path": "pages/activity/guest" },
+		// { "path": "pages/exhibitor/index" },
+		{ "path": "pages/exhibitor/exhibit" },
+		{ "path": "pages/exhibitor/exhibit-detail" },
+		{ "path": "pages/exhibitor/detail" },
 		// 组件页面
 		{ "path": "pages/components/index" },
 		// WEBVIEW
@@ -29,7 +36,9 @@
 			"van-collapse": "/wxcomponents/vant/collapse/index",
 			"van-collapse-item": "/wxcomponents/vant/collapse-item/index",
 			"van-search": "/wxcomponents/vant/search/index",
-			"van-overlay": "/wxcomponents/vant/overlay/index"	
+			"van-overlay": "/wxcomponents/vant/overlay/index"	,
+			"van-collapse": "/wxcomponents/vant/collapse/index",
+			"van-collapse-item": "/wxcomponents/vant/collapse-item/index"
 		}
 	},
 	"uniIdRouter": {}

pages/activity/components/activity-recommend.vue

@@ -0,0 +1,117 @@
+<template>
+	<view class="activity-recommend">
+		<view v-if="recommendType === 'home'" class="activity-tab">
+			<u-tabs :active.sync="tabActive" :tabs="tabs" tab-style="default" @change="tabChange"/>
+		</view>
+		<view class="activity-list">
+			<template v-for="(item, index) in [1, 2, 3]">
+					<view class="activity-item" :key="index">
+						<view class="activity-title">KOSHINE 新品上线,解锁防脱生发新方式</view>
+						<view class="activity-time">2024年03月20日 | E1馆二楼M16会议室</view>
+						<view class="activity-summary">
+							<view class="text">Kostal推出第四种机型的太阳能并网逆变器 2008年7月5日:KOSTAL公司原来只有PIKO系列太阳能并网逆变器10.1和5.5,中间没有其他功率段的产品。</view>
+							<van-button class="btn-to-detail" type="primary">
+								<template>
+									<view>了解详情</view> <view class="arrow iconfont icon-right-s"></view>
+								</template>
+							</van-button>
+						</view>
+					</view>
+			</template>
+		</view>
+	</view>
+</template>
+
+<script>
+	
+	export default {
+		options: {
+			styleIsolation: 'shared'
+		},
+		components: {
+		},
+		props: {
+			recommendType: {
+				type: String,
+				default: 'home'
+			}
+		},
+		data() {
+			return {
+				tabActive: '1',
+				tabs: [{
+					label: '展会新闻',
+					value: 1
+				}, {
+					label: '展商新闻',
+					value: 2
+				}]
+			}
+		},
+		created() {
+		},
+		methods: {
+			tabChange() {
+				
+			}
+		}
+	}
+</script>
+<style lang="scss">
+	.activity-list{
+		display: grid;
+		grid-template-columns: 1fr;
+		grid-row-gap: 18rpx;
+		margin-top: 28rpx;
+	}
+	.activity-item{
+		display: flex;
+		flex-direction: column;
+		height: 210rpx;
+		background-color: #F6F6F6;
+		border-radius: 10rpx;
+		padding: 24rpx 30rpx;
+	}
+	.activity-title{
+		@extend .text-ellipsis-line;
+		font-family: Arial, Arial;
+		font-weight: bold;
+		font-size: $fontSize2;
+		line-height: 35rpx;
+	}
+	.activity-time{
+		font-size: $fontSize1;
+		color: #333333;
+		margin: 12rpx 0;
+	}
+	.activity-summary{
+		display: flex;
+		align-items: center;
+		font-size: 18rpx;
+		line-height: 25rpx;
+		.btn-to-detail{
+			flex-shrink: 0;
+			.van-button__text{
+				display: flex!important;
+				align-items: center;
+				font-size: 18rpx;
+			}
+		}
+		.text{
+			padding-right: 30rpx;
+			color: #555555;
+			@extend .text-ellipsis-line;
+			-webkit-line-clamp: 2;  
+		}
+		.arrow{
+			margin-left: 12rpx;
+			font-size: $fontSize0;
+		}
+	}
+	
+	.activity-tab{
+		van-button{
+			margin-right: 13rpx;
+		}
+	}
+</style>

pages/activity/index.vue

@@ -0,0 +1,147 @@
+<template>
+	<view class="activity-index">
+		<nav-bar title="同期活动" @init="onInitNavbar"></nav-bar>
+		<u-scroll-view :tabbar-conflict="true">
+			<view class="main-container">
+				<view class="activity-head">
+					<view class="activity-head-title">同期活动</view>
+					<view class="activity-head-desc">今年慕尼黑上海电子生产设备展将围绕四大行业主题开展共计9场同期论坛，论坛围绕工业机器人、柔性制造、储能与新能源、汽车线束、智能座舱、智能制造、TGV先进材料、封装、胶粘剂、新能源汽车等热门话题展开更多探讨与交流。</view>
+				</view>
+				<view class="activity-list">
+					<template v-for="(item, index) in [1, 2, 3, 4]">
+						<view class="activity-item" hover-class="active" :key="index" @click="onClickActivity(item)">
+							<view class="activity-title">
+								<view>TGV先进材料及封装产业化机遇高峰论坛</view>
+								<view class="activity-favourites" :class="{ 'active': index === 1 }">
+									<view v-if="index == 1" class="iconfont icon-favourites-filled-star-symbol"></view>
+									<view v-else class="iconfont icon-Favourites-Add-Large"></view>
+									<view class="activity-favourites-text">收藏</view>
+								</view>
+							</view>
+							<view class="activity-time">2024年03月20日 | E1馆二楼M16会议室</view>
+							<view class="activity-views">浏览：1080</view>
+							<view class="activity-desc">
+								<view>
+									本次论坛将探讨玻璃基芯片板级封装载板在Mini/Micro直显、MIP封装、2.5D/3D封装、射频芯片载板、光通信芯片载板以及其他芯片载板，尤其是半导体先进封装领域的应用。
+								</view>
+								<view>
+									<van-button class="activity-detail-link" type="primary">
+										<template>
+											<view>了解详情</view> <view class="arrow iconfont icon-right-s"></view>
+										</template>
+									</van-button>
+								</view>
+							</view>
+						</view>
+					</template>
+				</view>
+			</view>
+		</u-scroll-view>
+	</view>
+</template>
+
+<script>
+
+	export default {
+		options: {
+			styleIsolation: 'shared'
+		},
+		components: {
+		},
+		data() {
+			return {}
+		},
+		created() {},
+		methods: {
+			onClickActivity(item){
+				uni.navigateTo({
+					url: '/pages/activity/detail'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.activity-head{
+		color: #333333;
+		.activity-head-title{
+			font-weight: bold;
+			font-size: $fontSize5;
+			line-height: 49rpx;
+		}
+		.activity-head-desc{
+			margin-top: 20rpx;
+			font-size: $fontSize2;
+			line-height: 40rpx;
+		}
+	}
+	.activity-list{
+		display: grid;
+		grid-template-columns: 1fr;
+		grid-row-gap: 30rpx;
+		margin-top: 40rpx;
+		color: #333333;
+	}
+	.activity-item{
+		padding: 20rpx;
+		background-color: #FFFFFF;
+		box-shadow: 0rpx 4rpx 20rpx 0rpx rgba(0,0,0,0.15);
+		&.active{
+			border: 4rpx solid rgba(232,116,0,0.34);
+			padding: 16rpx 16rpx;
+			.activity-favourites{
+				color: $textActionColor;
+			}
+		}
+		.activity-favourites{
+			@extend .display-flex-center;
+			font-size: $fontSize1;
+			&.active{
+				color: $textActionColor;
+			}
+			.iconfont{
+				font-size: $fontSize1;
+				margin-right: 4rpx;
+			}
+		}
+		.activity-title{
+			@extend .display-flex-between;
+			flex: 1;
+			line-height: 38rpx;
+			&>view:first-child{
+				font-weight: bold;
+				font-size: $fontSize3;
+			}
+		}
+		.activity-time{
+			margin-top: 15rpx;
+			font-family: Inter, Inter;
+			font-size: $fontSize1;
+		}
+		.activity-views{
+			margin-top: 15rpx;
+			font-family: Inter, Inter;
+			font-size: $fontSize0;
+			color: #7D7D7D;
+			line-height: 19rpx;
+		}
+		.activity-desc{
+			@extend .display-flex-between;
+			margin-top: 15rpx;
+			&>view:first-child{
+				@extend .text-ellipsis-line;
+				flex: 1;
+				margin-right: 51rpx;
+				font-size: 18rpx;
+				line-height: 30rpx;
+			}
+		}
+		.activity-detail-link{
+			flex-shrink: 0;
+			.van-button__text{
+				font-size: 18rpx;
+			}
+		}
+	}
+</style>

pages/exhibitor/components/exhibit-recommend.vue

@@ -0,0 +1,87 @@
+<template>
+	<view class="exhibit-recommend">
+		<view class="exhibit-list">
+			<template v-for="(item, index) in [1, 2, 3, 4]">
+				<view class="exhibit-item" hover-class="active" :key="index">
+					<view class="exhibit-image">
+						<image src="/static/img/example/exhibit.png"/>
+					</view>
+					<view class="exhibit-name">汽车连接器 86W MLK 1,2 SD-HOLDER</view>
+					<view class="exhibit-tag">常规产品</view>
+				</view>
+			</template>
+		</view>
+	</view>
+</template>
+
+<script>
+	
+	export default {
+		options: {
+			styleIsolation: 'shared'
+		},
+		components: {
+		},
+		data() {
+			return {
+			}
+		},
+		created() {
+		},
+		methods: {
+			tabChange() {
+				
+			}
+		}
+	}
+</script>
+<style lang="scss">
+	.exhibit-recommend{
+		.exhibit-list{
+			display: grid;
+			grid-template-columns: 1fr 1fr;
+			grid-column-gap: 18rpx;
+			grid-row-gap: 30rpx;
+			.exhibit-item{
+				position: relative;
+				&.active{
+					.exhibit-tag{
+						background-color: #FCEDE1;
+						color: #E57519;
+					}
+					.exhibit-name{
+						color: #E57519;
+					}
+					.exhibit-image{
+						border: 1rpx solid #E57519;
+					}
+				}
+			}
+			.exhibit-image{
+				width: 100%;
+				height: 178rpx;
+				border: 1rpx solid #D9D9D9;
+				image{
+					width: 100%;
+					height: 100%;
+				}
+			}
+			.exhibit-name {
+				font-family: Poppins, Poppins;
+				font-size: $fontSize0;
+				color: #333333;
+				margin-top: 12rpx;
+			}
+			.exhibit-tag{
+				position: absolute;
+				top: 20rpx;
+				left: 31rpx;
+				font-size: 10rpx;
+				color: #333333;
+				background-color: #E2E8F0;
+				border-radius: 4rpx;
+				padding: 5rpx 8rpx;
+			}
+		}
+	}
+</style>

pages/exhibitor/detail.vue

@@ -0,0 +1,185 @@
+<template>
+	<view class="exhibitor-detail">
+		<nav-bar title="展商详情" @init="onInitNavbar"></nav-bar>
+		<u-scroll-view>
+			<view class="main-container">
+				<view class="exhibitor-main">
+					<view class="exhibitor-logo">
+						<image src="/static/img/example/exhibitor_logo.png" mode="widthFix" />
+					</view>
+					<view class="exhibitor-title">
+						<view class="exhibitor-title-1">
+							科世达（上海）连接器有限公司 AB
+						</view>
+						<view class="exhibitor-title-2">
+							 Leopold Kostal GmbH & Co. KG
+						</view>
+						<view class="exhibitor-title-3">
+							中国（含港澳台）
+						</view>
+					</view>
+					<view class="exhibitor-number">
+						<view class="exhibitor-number-label">展位号:</view>
+						<view class="exhibitor-number-text">E1.1101</view>
+					</view>
+				</view>
+				<view class="exhibitor-desc">
+					科世达（上海）连接器有限公司从事连接器、连接器系统的生产加工，汽车零部件、电子元器件、机械设备及其零配件、工具、模具、连接器产品及其生产设备的批发、进出口、佣金代理（拍卖除外），并提供相关配套服务（包括上门安装、保养、维修服务）。
+				</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>
+				</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>
+				<view class="exhibitor-operation">
+					<view class="exhibitor-views">浏览：30911</view>
+					<view class="exhibitor-action">
+						<view>
+							<view class="iconfont icon-xiaochengxu-renqiicon"></view>
+							<view>人气：11192</view>
+						</view>
+						<view>
+							<view class="iconfont icon-zhuanfa"></view>
+							<view>分享</view>
+						</view>
+						<view>
+							<view class="iconfont icon-Favourites-Add-Large"></view>
+							<view>收藏</view>
+						</view>
+						<view>
+							<view class="iconfont icon-Heart"></view>
+							<view>点赞</view>
+						</view>
+						<view>
+							<view class="iconfont icon-xiaochengxu-toupiaoicon"></view>
+							<view>投票</view>
+						</view>
+					</view>
+				</view>
+				<u-panel title="展品资料">
+					<exhibit-recommend />
+					<view class="click-more"><van-button type="primary">点击展开更多展品</van-button></view>
+				</u-panel>
+				<u-panel title="展商新闻">
+					<news-recommend recommend-type="detail" />
+					<view class="click-more"><van-button type="primary">点击展开更多新闻</van-button></view>
+				</u-panel>
+				<u-panel title="展商活动">
+					<activity-recommend recommend-type="detail" />
+					<view class="click-more"><van-button type="primary">点击展开更多活动</van-button></view>
+				</u-panel>
+			</view>
+		</u-scroll-view>
+	</view>
+</template>
+
+<script>
+	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'
+	
+	export default {
+		options: {
+			// styleIsolation: 'shared'
+		},
+		components: {
+			ExhibitRecommend,
+			ActivityRecommend,
+			NewsRecommend
+		},
+		computed: {
+		},
+		data() {
+			return {
+				
+			}
+		},
+		created() {
+		},
+		methods: {
+		}
+	}
+</script>
+
+<style lang="scss">
+	@import "@/static/style/exhibitor-detail.scss";
+	.exhibitor-detail{
+		.exhibitor-main{
+			display: flex;
+		}
+		.exhibitor-logo{
+			width: 166rpx;
+			height: 166rpx;
+			background: #FFFFFF;
+			border: 1rpx solid #D9D9D9;
+			image{
+				width: 100%;
+				height: 100%;
+			}
+		}
+		.exhibitor-title{
+			font-family: Poppins, Poppins;
+			font-size: 30rpx;
+			color: #000000;
+			line-height: 40rpx;
+			padding-left: 19rpx;
+			padding-right: 24rpx;
+			.exhibitor-title-1{
+				font-weight: bold;
+			}
+			.exhibitor-title-2 {
+				font-size: 28rpx;
+			}
+			.exhibitor-title-3 {
+				font-size: $fontSize0;
+				color: #333333;
+				line-height: 20rpx;
+				margin-top: 10rpx;
+			}
+		}
+		.exhibitor-number{
+			flex-shrink: 0;
+			justify-content: flex-end;
+			margin-top: 12rpx;
+		}
+		.exhibitor-number-label{
+			font-size: $fontSize0;
+			color: #555555;
+		}
+		.exhibitor-number-text{
+			font-family: Poppins, Poppins;
+			font-weight: bold;
+			font-size: $fontSize5;
+			color: #E57519;
+			letter-spacing: 2rpx;
+		}
+		.exhibitor-desc{
+			font-family: Poppins, Poppins;
+			font-size: $fontSize1;
+			color: #333333;
+			line-height: 35rpx;
+			margin-top: 30rpx;
+			margin-bottom: 12rpx;
+		}
+		.u-panel{
+			margin-top: 40rpx;
+		}
+		.click-more{
+			display: flex;
+			justify-content: center;
+			margin-top: 49rpx;
+		}
+	}
+</style>

pages/exhibitor/exhibit-detail.vue

@@ -0,0 +1,199 @@
+<template>
+	<view class="exhibit-detail exhibitor-detail">
+		<nav-bar title="展品介绍" @init="onInitNavbar"></nav-bar>
+		<u-scroll-view>
+			<view class="main-container">
+				<view class="exhibit-image">
+					<image src="/static/img/example/exhibit.png" />
+					<view class="exhibit-tag">2025新品</view>
+				</view>
+				<view class="exhibit-name">汽车连接器 86W MLK 1,2 SD-HOLDER</view>
+				<view class="exhibit-desc">适用于连接器、连接器系统的生产加工，汽车零部件、电子元器件、机械设备及其零配件、工具、模具、连接器产品及其生产设备的批发、进出口、佣金代理（拍卖除外），并提供相关配套服务（包括上门安装、保养、维修服务）。</view>
+				<view class="exhibit-tags 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>
+				</view>
+				<view class="exhibit-tags 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>
+				<view class="exhibit-operation exhibitor-operation">
+					<view class="exhibitor-views">浏览：30911</view>
+					<view class="exhibitor-action">
+						<view>
+							<view class="iconfont icon-xiaochengxu-renqiicon"></view>
+							<view>人气：11192</view>
+						</view>
+						<view>
+							<view class="iconfont icon-zhuanfa"></view>
+							<view>分享</view>
+						</view>
+						<view>
+							<view class="iconfont icon-Favourites-Add-Large"></view>
+							<view>收藏</view>
+						</view>
+						<view>
+							<view class="iconfont icon-Heart"></view>
+							<view>点赞</view>
+						</view>
+						<view>
+							<view class="iconfont icon-xiaochengxu-toupiaoicon"></view>
+							<view>投票</view>
+						</view>
+					</view>
+				</view>
+				<u-panel title="展商信息">
+					<view class="exhibitor-card">
+						<view class="exhibitor-info">
+							<view class="exhibitor-logo">
+								<image src="/static/img/example/kostal_log.png" mode="widthFix" />
+							</view>
+							<view class="exhibitor-name-cn">科世达（上海）连接器有限公司</view>
+							<view class="exhibitor-name-en">Leopold Kostal GmbH & Co. KG</view>
+							<view class="exhibitor-detail-link">
+								<van-button type="primary" @click="onClickDetail">
+									<template>
+										<view>点击了解展商更多信息</view> <view class="arrow iconfont icon-right-s"></view>
+									</template>
+								</van-button>
+							</view>
+						</view>
+						<view class="exhibitor-number">
+							<view class="exhibitor-number-label">我们的展位号</view>
+							<view class="exhibitor-number-text">E1馆 1101</view>
+						</view>
+					</view>
+				</u-panel>
+			</view>
+		</u-scroll-view>
+	</view>
+</template>
+
+<script>
+
+	export default {
+		options: {
+			// styleIsolation: 'shared'
+		},
+		components: {
+		},
+		computed: {},
+		data() {
+			return {}
+		},
+		created() {
+		},
+		methods: {
+			onClickDetail(e) {
+				uni.navigateTo({
+					url: '/pages/exhibitor/detail'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	@import "@/static/style/exhibitor-detail.scss";
+	.exhibit-detail{
+		.exhibit-image{
+			position: relative;
+			height: 438rpx;
+			background-color: #FFFFFF;
+			border-radius: 5rpx;
+			border: 1rpx solid #D6D6D6;
+			.exhibit-tag{
+				position: absolute;
+				top: 28rpx;
+				left: 29rpx;
+				padding: 12rpx 22rpx;
+				color: $textActionColor;
+				font-size: $fontSize0;
+				background-color: lighten($textActionColor, 43%);
+			}
+		}
+		.exhibitor-detail-link{
+			.van-button__text{
+				font-size: 18rpx;
+			}
+		}
+		.exhibit-name{
+			margin-top: 28rpx;
+			font-family: Poppins, Poppins;
+			font-weight: bold;
+			font-size: $fontSize5;
+			color: #000000;
+			line-height: 42rpx;
+		}
+		.exhibit-desc{
+			margin-top: 18rpx;
+			font-family: Poppins, Poppins;
+			font-size: $fontSize1;
+			color: #555555;
+			line-height: 35rpx;
+		}
+		.exhibitor-card{
+			display: flex;
+			background-color: #FFFFFF;
+			.exhibitor-info{
+				padding: 36rpx;
+			}
+			.exhibitor-logo{
+				width: 194rpx;
+			}
+			.exhibitor-detail-link{
+				margin-top: 36rpx;
+			}
+			.exhibitor-name-cn,.exhibitor-name-en{
+				font-family: Poppins, Poppins;
+				font-size: $fontSize2;
+				color: #000000;
+				line-height: 28rpx;
+			}
+			.exhibitor-name-en{
+				margin-top: 10rpx;
+				font-size: $fontSize1;
+			}
+			.exhibitor-number{
+				@extend .display-flex-center;
+				flex-direction: column;
+				width: 267rpx;
+				background-color: $buttonPrimaryColor;
+				color: #FFFFFF;
+			}
+			.exhibitor-number-text{
+				width: 161rpx;
+				text-align: center;
+				font-family: Poppins, Poppins;
+				font-weight: bold;
+				font-size: 55rpx;
+				line-height: 64rpx;
+				margin-top: 30rpx;
+			}
+			.exhibitor-number-label{
+				font-family: Poppins, Poppins;
+				font-size: $fontSize2;
+				line-height: 28rpx;
+				color: rgba(255, 255,  255, 0.74);
+			}
+		}
+		.u-panel{
+			margin-top: 54rpx;
+			padding: 0;
+			.u-panel-title{
+				&:after{
+					display: none;
+				}
+			}
+		}
+	}
+</style>

pages/exhibitor/exhibit.vue

@@ -0,0 +1,170 @@
+<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="/static/img/example/ad_690x90.png" mode="aspectFill"/>
+			</view>
+			<view class="exhibitor-list">
+				<template v-for="item in [1, 2, 3]">
+					<view class="exhibit-item exhibitor-item" hover-class="active" @click="onClickExhibit(item)">
+						<view class="exhibit-body">
+							<view class="exhibitor-body">
+								<view class="exhibitor-logo"><image src="/static/img/example/exhibit.png" mode="widthFix" /></view>
+								<view class="exhibitor-name">汽车连接器 86W MLK 1,2 SD-HOLDER</view>
+								<view class="exhibitor-number">
+									<view class="exhibitor-number-label">展位号:</view>
+									<view class="exhibitor-number-text">E1.1101</view>
+								</view>
+							</view>
+							<view class="exhibitor-name">
+								<view class="exhibitor-name-cn">科世达（上海）连接器有限公司</view>
+								<view class="exhibitor-name-en">Leopold Kostal GmbH & Co. KG</view>
+							</view>
+						</view>
+						<view class="exhibitor-footer">
+							<view class="exhibitor-views">浏览：30911</view>
+							<view class="exhibitor-action">
+								<view>
+									<view class="iconfont icon-zhuanfa"></view>
+									<view>分享</view>
+								</view>
+								<view>
+									<view class="iconfont icon-Favourites-Add-Large"></view>
+									<view>收藏</view>
+								</view>
+								<view>
+									<view class="iconfont icon-Heart"></view>
+									<view>点赞</view>
+								</view>
+								<view>
+									<view class="iconfont icon-xiaochengxu-toupiaoicon"></view>
+									<view>投票</view>
+								</view>
+							</view>
+						</view>
+					</view>
+				</template>	
+			</view>
+		</view>
+		</u-scroll-view>
+	</view>
+</template>
+
+<script>
+
+	export default {
+		options: {
+			// styleIsolation: 'shared'
+		},
+		components: {
+		},
+		computed: {
+		},
+		data() {
+			return {
+				scrollviewHeight: 0,
+				searchKeyword: '',
+				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) {
+				uni.navigateTo({
+					url: '/pages/exhibitor/exhibit-detail'
+				})
+			},
+			onSearch() {
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	@import "@/static/style/exhibitor.scss";
+	.exhibit-index{
+		.exhibit-body{
+			display: flex;
+			flex-direction: column;
+			&>.exhibitor-name{
+				margin-left: 113rpx;
+			}
+			.exhibitor-name-cn{
+				margin-bottom: 5rpx;
+			}
+			.exhibitor-name-cn,.exhibitor-name-en{
+				color: #7d7d7d;
+				font-size: $fontSize1;
+				font-weight: normal;
+			}
+		}
+		.exhibitor-body{
+			&>.exhibitor-name{
+				margin-left: 23rpx;
+				line-height: 40rpx;
+			}
+		}
+	}
+</style>

pages/exhibitor/index.vue

@@ -1,39 +1,80 @@
 <template>
 	<view class="exhibitor-index">
-		<nav-bar title="展商信息"></nav-bar>
-		<view class="main-container">
-			<view class="exhibitor-filter">
-				<view>
-					<view>展馆号</view>
-					<u-dropdown-select v-model="categoryId" placeholder="产品分类" :options="categories" /> 
+		<nav-bar title="展商信息" @init="onInitNavbar"></nav-bar>
+		<u-scroll-view :tabbar-conflict="true">
+			<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>
-				<view>
-					<view>产品类别</view>
-					<u-dropdown-select v-model="categoryId" placeholder="产品分类" :options="categories" /> 
+				<u-search v-model="searchKeyword" placeholder="搜索展商 / 展品名称 / 会议" @search="onSearch" />
+				<view class="ad-space">
+					<image src="/static/img/example/ad_690x90.png" mode="aspectFill"/>
 				</view>
-				<view>
-					<view>应用领域</view>
-					<u-dropdown-select v-model="categoryId" placeholder="产品分类" :options="categories" /> 
+				<view class="exhibitor-list">
+					<template v-for="item in [1, 2, 3, 4, 5, 6, 7, 8]">
+						<view class="exhibitor-item" hover-class="active" @click="onClickExhibitor">
+							<view class="exhibitor-body">
+								<view class="exhibitor-logo"><image src="/static/img/example/exhibitor_logo.png" mode="widthFix" /></view>
+								<view class="exhibitor-name">
+									<view class="exhibitor-name-cn">科世达（上海）连接器有限公司</view>
+									<view class="exhibitor-name-en">Leopold Kostal GmbH & Co. KG</view>
+								</view>
+								<view class="exhibitor-number">
+									<view class="exhibitor-number-label">展位号:</view>
+									<view class="exhibitor-number-text">E1.1101</view>
+								</view>
+							</view>
+							<view class="exhibitor-footer">
+							<view class="exhibitor-views">浏览：30911</view>
+							<view class="exhibitor-action">
+								<view>
+									<view class="iconfont icon-zhuanfa"></view>
+									<view>分享</view>
+								</view>
+								<view>
+									<view class="iconfont icon-Favourites-Add-Large"></view>
+									<view>收藏</view>
+								</view>
+								<view>
+									<view class="iconfont icon-Heart"></view>
+									<view>点赞</view>
+								</view>
+								<view>
+									<view class="iconfont icon-xiaochengxu-toupiaoicon"></view>
+									<view>投票</view>
+								</view>
+							</view>
+						</view>
+						</view>
+					</template>	
 				</view>
 			</view>
-		</view>
+		</u-scroll-view>
 	</view>
 </template>
 
 <script>
-	import NavBar from '@/components/layout/nav-bar.vue'
-	import UDropdownSelect from '@/components/common/u-dropdown-select/index.vue'
 
 	export default {
 		options: {
 			// styleIsolation: 'shared'
 		},
 		components: {
-			NavBar,
-			UDropdownSelect
 		},
 		data() {
 			return {
+				searchKeyword: '',
 				categories: [{
 					label: '表面贴装',
 					value: 1,
@@ -75,16 +116,26 @@
 			}
 		},
 		created() {},
-		methods: {}
+		methods: {
+			onClickExhibitor() {
+				uni.navigateTo({
+					url: '/pages/exhibitor/detail'
+				})
+			},
+			onSelectDropdown(index) {
+				['select1', 'select2', 'select3'].forEach(v => {
+					if (v !== 'select' + index) {
+						this.$refs[v].hideDropdown()
+					}
+				})
+			},
+			onSearch() {
+				
+			}
+		}
 	}
 </script>
 
-<style lang="scss" scoped>
-	.exhibitor-filter{
-		display: grid;
-		grid-template-columns: repeat(3, 1fr);
-		grid-gap: 29rpx;
-		font-size: $fontSize2;
-		color: #333333;
-	}
+<style lang="scss">
+	@import "@/static/style/exhibitor.scss";
 </style>

pages/index/home.vue

@@ -10,13 +10,7 @@
 		</nav-bar>
 		<u-swiper :items="images" indicato-dots-style="morphing" :height="387" />
 		<view class="main-container">
-			<view class="search-container">
-				<view class="search-input">
-					<van-search :value="searchKeyword" placeholder="搜索展商 / 展品名称 / 会议" use-action-slot class="van-search">
-						<view class="search-text" slot="action" @tap="onClickSearch">搜索</view>
-					</van-search>
-				</view>
-			</view>
+			<u-search v-model="searchKeyword" placeholder="搜索展商 / 展品名称 / 会议" @search="onClickSearch"/>
 			<view class="nav-icons">
 				<template v-for="(item, index) in navIcons">
 					<view class="nav-icon-wrapper display-flex-center" :key="index">
@@ -90,9 +84,7 @@
 </template>
 
 <script>
-	import NavBar from '@/components/layout/nav-bar.vue'
-	import USwiper from '@/components/common/u-swiper/index.vue'
-	import UPanel from '@/components/common/u-panel/index.vue'
+
 	import NewsRecommend from '@/pages/news/components/news-recommend.vue'
 
 	export default {
@@ -100,9 +92,6 @@
 			styleIsolation: 'shared'
 		},
 		components: {
-			NavBar,
-			USwiper,
-			UPanel,
 			NewsRecommend
 		},
 		data() {
@@ -214,10 +203,25 @@
 				}],
 			}
 		},
-		created() {},
+		created() {
+			uni.loadFontFace({
+				family: 'Poppins',
+				source: 'url("https://oss.starify.cn/test/Poppins-SemiBold.ttf")',
+				desc: {
+					fontPath: '', // 本地字体文件的路径
+				},
+				success: () => {
+					console.log('字体加载成功');
+				},
+				fail: (e) => {
+					console.log(e)
+					console.error('字体加载失败');
+				},
+			})
+		},
 		methods: {
 			onClickSearch() {
-
+				console.log(this.searchKeyword)
 			}
 		}
 	}

pages/index/index.vue

@@ -2,6 +2,7 @@
 	<view class="content">
 		<home v-if="tabbarActive === 'home'" />
 		<exhibitor v-if="tabbarActive === 'exhibitor'" />
+		<activity v-if="tabbarActive === 'activity'" />
 		<tab-bar :active.sync="tabbarActive"></tab-bar>
 	</view>
 </template>
@@ -10,6 +11,7 @@
 	import TabBar from '@/components/layout/tab-bar.vue'
 	import Home from '@/pages/index/home.vue'
 	import Exhibitor from '@/pages/exhibitor/index.vue'
+	import Activity from '@/pages/activity/index.vue'
 
 	export default {
 		options: {
@@ -18,7 +20,8 @@
 		components: {
 			TabBar,
 			Home,
-			Exhibitor
+			Exhibitor,
+			Activity
 		},
 		data() {
 			return {

pages/index/webview.vue

@@ -5,11 +5,9 @@
 </template>
 
 <script>
-	import NavBar from '@/components/layout/nav-bar.vue'
 
 	export default {
 		components: {
-			NavBar
 		},
 		data() {
 			return {

pages/news/components/news-recommend.vue

@@ -1,16 +1,16 @@
 <template>
 	<view class="news-recommend">
-		<view class="news-tab">
+		<view v-if="recommendType === 'home'" class="news-tab">
 			<u-tabs :active.sync="tabActive" :tabs="tabs" tab-style="default" @change="tabChange"/>
 		</view>
 		<view class="news-list">
-			<template v-for="item in [1, 2, 3]">
-					<view class="news-item">
+			<template v-for="(item, index) in [1, 2, 3]">
+					<view class="news-item" :key="index">
 						<view class="news-title">组装自动化与测试测量深度融合，赋能电子制造业高质量发展2024</view>
 						<view class="news-time">2024年6月28日</view>
 						<view class="news-summary">
 							<view class="text">在人类历史长河中，工业生产一直是社会进步的重要驱动力，而自动化技术的飞速发展，使其正在经历前所未有的变革。特别是在电子生产制造领域，传统的人工操作由于易疲劳、品质不稳定以及</view>
-							<view class="to-detail"><view>了解详情</view> <view class="arrow iconfont icon-a-righticon_huaban11"></view></view>
+							<view class="to-detail" @click="onClickDetail(item)"><view>了解详情</view> <view class="arrow iconfont icon-right-s"></view></view>
 						</view>
 					</view>
 			</template>
@@ -19,11 +19,15 @@
 </template>
 
 <script>
-	import UTabs from '@/components/common/u-tabs/index.vue'
 	
 	export default {
 		components: {
-			UTabs
+		},
+		props: {
+			recommendType: {
+				type: String,
+				default: 'home'
+			}
 		},
 		data() {
 			return {
@@ -42,6 +46,11 @@
 		methods: {
 			tabChange() {
 				
+			},
+			onClickDetail(item) {
+				uni.navigateTo({
+					url: '/pages/index/webview?url=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'
+				})
 			}
 		}
 	}

static/font/demo_index.html

@@ -55,6 +55,30 @@
           <ul class="icon_lists dib-box">
           
             <li class="dib">
+              <span class="icon iconfont">&#xe669;</span>
+                <div class="name">favourites-filled-star-symbol</div>
+                <div class="code-name">&amp;#xe669;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe668;</span>
+                <div class="name">转发</div>
+                <div class="code-name">&amp;#xe668;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe695;</span>
+                <div class="name">小程序-联系我们icon</div>
+                <div class="code-name">&amp;#xe695;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe694;</span>
+                <div class="name">小程序-参观登记icon</div>
+                <div class="code-name">&amp;#xe694;</div>
+              </li>
+          
+            <li class="dib">
               <span class="icon iconfont">&#xe693;</span>
                 <div class="name">小程序-人气icon</div>
                 <div class="code-name">&amp;#xe693;</div>
@@ -205,15 +229,15 @@
               </li>
           
             <li class="dib">
-              <span class="icon iconfont">&#xee4a;</span>
-                <div class="name">right icon_画板 1-copy</div>
-                <div class="code-name">&amp;#xee4a;</div>
+              <span class="icon iconfont">&#xee4e;</span>
+                <div class="name">right icon_画板 1-copy-copy</div>
+                <div class="code-name">&amp;#xee4e;</div>
               </li>
           
             <li class="dib">
-              <span class="icon iconfont">&#xe678;</span>
-                <div class="name">right icon_画板 1</div>
-                <div class="code-name">&amp;#xe678;</div>
+              <span class="icon iconfont">&#xee4a;</span>
+                <div class="name">right icon_画板 1-copy</div>
+                <div class="code-name">&amp;#xee4a;</div>
               </li>
           
             <li class="dib">
@@ -1518,10 +1542,10 @@
 <pre><code class="language-css"
 >@font-face {
   font-family: 'iconfont';
-  src: url('iconfont.woff2?t=1730365109161') format('woff2'),
-       url('iconfont.woff?t=1730365109161') format('woff'),
-       url('iconfont.ttf?t=1730365109161') format('truetype'),
-       url('iconfont.svg?t=1730365109161#iconfont') format('svg');
+  src: url('iconfont.woff2?t=1730788484478') format('woff2'),
+       url('iconfont.woff?t=1730788484478') format('woff'),
+       url('iconfont.ttf?t=1730788484478') format('truetype'),
+       url('iconfont.svg?t=1730788484478#iconfont') format('svg');
 }
 </code></pre>
           <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@@ -1548,6 +1572,42 @@
         <ul class="icon_lists dib-box">
           
           <li class="dib">
+            <span class="icon iconfont icon-favourites-filled-star-symbol"></span>
+            <div class="name">
+              favourites-filled-star-symbol
+            </div>
+            <div class="code-name">.icon-favourites-filled-star-symbol
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-zhuanfa"></span>
+            <div class="name">
+              转发
+            </div>
+            <div class="code-name">.icon-zhuanfa
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-xiaochengxu-lianxiwomenicon"></span>
+            <div class="name">
+              小程序-联系我们icon
+            </div>
+            <div class="code-name">.icon-xiaochengxu-lianxiwomenicon
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-xiaochengxu-canguandengjiicon"></span>
+            <div class="name">
+              小程序-参观登记icon
+            </div>
+            <div class="code-name">.icon-xiaochengxu-canguandengjiicon
+            </div>
+          </li>
+          
+          <li class="dib">
             <span class="icon iconfont icon-xiaochengxu-renqiicon"></span>
             <div class="name">
               小程序-人气icon
@@ -1764,38 +1824,38 @@
           </li>
           
           <li class="dib">
-            <span class="icon iconfont icon-a-righticon_huaban11"></span>
+            <span class="icon iconfont icon-right-s"></span>
             <div class="name">
               right icon_画板 1
             </div>
-            <div class="code-name">.icon-a-righticon_huaban11
+            <div class="code-name">.icon-right-s
             </div>
           </li>
           
           <li class="dib">
-            <span class="icon iconfont icon-a-righticon_huaban11-copy"></span>
+            <span class="icon iconfont icon-left-s"></span>
             <div class="name">
-              right icon_画板 1-copy
+              right icon_画板 1-copy-copy
             </div>
-            <div class="code-name">.icon-a-righticon_huaban11-copy
+            <div class="code-name">.icon-left-s
             </div>
           </li>
           
           <li class="dib">
-            <span class="icon iconfont icon-a-righticon_huaban1"></span>
+            <span class="icon iconfont icon-up-s"></span>
             <div class="name">
-              right icon_画板 1
+              right icon_画板 1-copy
             </div>
-            <div class="code-name">.icon-a-righticon_huaban1
+            <div class="code-name">.icon-up-s
             </div>
           </li>
           
           <li class="dib">
-            <span class="icon iconfont icon-a-righticon_huaban1-copy"></span>
+            <span class="icon iconfont icon-down-s"></span>
             <div class="name">
               right icon_画板 1-copy
             </div>
-            <div class="code-name">.icon-a-righticon_huaban1-copy
+            <div class="code-name">.icon-down-s
             </div>
           </li>
           
@@ -3745,6 +3805,38 @@
           
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-favourites-filled-star-symbol"></use>
+                </svg>
+                <div class="name">favourites-filled-star-symbol</div>
+                <div class="code-name">#icon-favourites-filled-star-symbol</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-zhuanfa"></use>
+                </svg>
+                <div class="name">转发</div>
+                <div class="code-name">#icon-zhuanfa</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-xiaochengxu-lianxiwomenicon"></use>
+                </svg>
+                <div class="name">小程序-联系我们icon</div>
+                <div class="code-name">#icon-xiaochengxu-lianxiwomenicon</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-xiaochengxu-canguandengjiicon"></use>
+                </svg>
+                <div class="name">小程序-参观登记icon</div>
+                <div class="code-name">#icon-xiaochengxu-canguandengjiicon</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
                   <use xlink:href="#icon-xiaochengxu-renqiicon"></use>
                 </svg>
                 <div class="name">小程序-人气icon</div>
@@ -3937,34 +4029,34 @@
           
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-righticon_huaban11"></use>
+                  <use xlink:href="#icon-right-s"></use>
                 </svg>
                 <div class="name">right icon_画板 1</div>
-                <div class="code-name">#icon-a-righticon_huaban11</div>
+                <div class="code-name">#icon-right-s</div>
             </li>
           
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-righticon_huaban11-copy"></use>
+                  <use xlink:href="#icon-left-s"></use>
                 </svg>
-                <div class="name">right icon_画板 1-copy</div>
-                <div class="code-name">#icon-a-righticon_huaban11-copy</div>
+                <div class="name">right icon_画板 1-copy-copy</div>
+                <div class="code-name">#icon-left-s</div>
             </li>
           
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-righticon_huaban1"></use>
+                  <use xlink:href="#icon-up-s"></use>
                 </svg>
-                <div class="name">right icon_画板 1</div>
-                <div class="code-name">#icon-a-righticon_huaban1</div>
+                <div class="name">right icon_画板 1-copy</div>
+                <div class="code-name">#icon-up-s</div>
             </li>
           
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-righticon_huaban1-copy"></use>
+                  <use xlink:href="#icon-down-s"></use>
                 </svg>
                 <div class="name">right icon_画板 1-copy</div>
-                <div class="code-name">#icon-a-righticon_huaban1-copy</div>
+                <div class="code-name">#icon-down-s</div>
             </li>
           
             <li class="dib">

static/font/iconfont.css

@@ -14,6 +14,22 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-favourites-filled-star-symbol:before {
+  content: "\e669";
+}
+
+.icon-zhuanfa:before {
+  content: "\e668";
+}
+
+.icon-xiaochengxu-lianxiwomenicon:before {
+  content: "\e695";
+}
+
+.icon-xiaochengxu-canguandengjiicon:before {
+  content: "\e694";
+}
+
 .icon-xiaochengxu-renqiicon:before {
   content: "\e693";
 }
@@ -110,19 +126,19 @@
   content: "\e726";
 }
 
-.icon-a-righticon_huaban11:before {
+.icon-right-s:before {
   content: "\e679";
 }
 
-.icon-a-righticon_huaban11-copy:before {
-  content: "\ee4a";
+.icon-left-s:before {
+  content: "\ee4e";
 }
 
-.icon-a-righticon_huaban1:before {
-  content: "\e678";
+.icon-up-s:before {
+  content: "\ee4a";
 }
 
-.icon-a-righticon_huaban1-copy:before {
+.icon-down-s:before {
   content: "\ee4b";
 }
 
@@ -978,3 +994,4 @@
   content: "\e802";
 }
 
+

static/font/iconfont.json

@@ -6,6 +6,34 @@
   "description": "",
   "glyphs": [
     {
+      "icon_id": "8945265",
+      "name": "favourites-filled-star-symbol",
+      "font_class": "favourites-filled-star-symbol",
+      "unicode": "e669",
+      "unicode_decimal": 58985
+    },
+    {
+      "icon_id": "28640061",
+      "name": "转发",
+      "font_class": "zhuanfa",
+      "unicode": "e668",
+      "unicode_decimal": 58984
+    },
+    {
+      "icon_id": "42324266",
+      "name": "小程序-联系我们icon",
+      "font_class": "xiaochengxu-lianxiwomenicon",
+      "unicode": "e695",
+      "unicode_decimal": 59029
+    },
+    {
+      "icon_id": "42324160",
+      "name": "小程序-参观登记icon",
+      "font_class": "xiaochengxu-canguandengjiicon",
+      "unicode": "e694",
+      "unicode_decimal": 59028
+    },
+    {
       "icon_id": "42298016",
       "name": "小程序-人气icon",
       "font_class": "xiaochengxu-renqiicon",
@@ -176,28 +204,28 @@
     {
       "icon_id": "40818688",
       "name": "right icon_画板 1",
-      "font_class": "a-righticon_huaban11",
+      "font_class": "right-s",
       "unicode": "e679",
       "unicode_decimal": 59001
     },
     {
+      "icon_id": "42318968",
+      "name": "right icon_画板 1-copy-copy",
+      "font_class": "left-s",
+      "unicode": "ee4e",
+      "unicode_decimal": 61006
+    },
+    {
       "icon_id": "42251098",
       "name": "right icon_画板 1-copy",
-      "font_class": "a-righticon_huaban11-copy",
+      "font_class": "up-s",
       "unicode": "ee4a",
       "unicode_decimal": 61002
     },
     {
-      "icon_id": "40818663",
-      "name": "right icon_画板 1",
-      "font_class": "a-righticon_huaban1",
-      "unicode": "e678",
-      "unicode_decimal": 59000
-    },
-    {
       "icon_id": "42251100",
       "name": "right icon_画板 1-copy",
-      "font_class": "a-righticon_huaban1-copy",
+      "font_class": "down-s",
       "unicode": "ee4b",
       "unicode_decimal": 61003
     },

static/style/app.scss

@@ -1,5 +1,4 @@
 @import "~@/static/font/iconfont.css";
-
 .tabbar-icon {
   font-family: "iconfont";
 }
@@ -29,13 +28,21 @@ $fontSize5: 36rpx;
 	font-family: Inter, Inter;
 	box-sizing: border-box;
 }
+page{
+	background-color: #FAFAFA;
+}
+image{
+	width: 100%;
+	height: 100%;
+}
 view,input{
   box-sizing: border-box;
-	font-family: Inter, Inter;
+	font-family: Arial, Arial;
 }
 .main-container {
 	padding: 30rpx;
-}
+	background-color: #FAFAFA;
+ }
 // 字体大小
 .font-size-1{
 	font-size: $fontSize1;
@@ -56,12 +63,23 @@ view,input{
 .van-button{
 	font-size: 20rpx;
 }
+.van-button--normal{
+	.van-button__text{
+		display: flex!important;
+		align-items: center;
+	}
+	.iconfont{
+		margin-left: 12rpx;
+		font-size: $fontSize0;
+	}
+}
 .van-button--primary {
 	--button-primary-background-color: #E57519;
 	--button-primary-border-color: #E57519;
 	--button-primary-color: #ffffff;
 	--button-border-radius: 6rpx;
 	--button-default-height: 50rpx;
+	--button-normal-font-size: 20rpx;
 }
 .van-button--default {
 	--button-primary-background-color: #FFFFFF;
@@ -69,4 +87,5 @@ view,input{
 	--button-primary-color: #ffffff;
 	--button-border-radius: 6rpx;
 	--button-default-height: 50rpx;
+	--button-normal-font-size: 20rpx;
 }

static/style/exhibitor-detail.scss

@@ -0,0 +1,58 @@
+.exhibitor-detail{
+	.exhibitor-tags{
+		display: flex;
+		align-items: flex-start;
+		font-size: 18rpx;
+		margin-top: 28rpx;
+		.exhibitor-tags-list{
+			display: flex;
+			align-items: center;
+			flex-wrap: wrap;
+		}
+		.exhibitor-tags-category{
+			color: #555555;
+			line-height: 21rpx;
+			flex-shrink: 0;
+			padding-top: 4rpx;
+		}
+		.exhibitor-tag{
+			@extend .display-flex-center;
+			height: 29rpx;
+			padding: 8rpx;
+			background-color: #E3E9F1;
+			border-radius: 4;
+			margin-right: 16rpx;
+			color: #333333;
+			white-space: nowrap;
+			margin-bottom: 9rpx;
+		}
+	}
+	.exhibitor-operation{
+		display: flex;
+		align-items: center;
+		padding-top: 33rpx;
+		.exhibitor-action{
+			display: grid;
+			flex: 1;
+			grid-template-columns: 1.5fr 1fr 1fr 1fr 1fr;
+			font-size: $fontSize0;
+			color: #555555;
+			&>view{
+				display: flex;
+				align-items: center;
+				white-space: nowrap;
+			}
+			.iconfont{
+				font-size: 28rpx;
+				margin-right: 4rpx;
+			}
+		}
+		.exhibitor-views{
+			font-weight: 400;
+			font-size: $fontSize0;
+			color: #555555;
+			line-height: 20rpx;
+			margin-right: 57rpx;
+		}
+	}
+}

static/style/exhibitor.scss

@@ -0,0 +1,123 @@
+.exhibitor-index{
+	.exhibitor-filter{
+		display: grid;
+		grid-template-columns: repeat(3, minmax(0, 1fr));
+		grid-gap: 29rpx;
+		font-size: $fontSize2;
+		color: #333333;
+		.exhibitor-filter-label{
+			font-family: Arial, Arial;
+			font-size: $fontSize2;
+			color: #333333;
+			margin-bottom: 8rpx;
+		}
+	}
+	.u-search{
+		margin-top: 34rpx;
+		margin-bottom: 42rpx;
+	}
+	.exhibitor-list{
+		display: grid;
+		grid-template-columns: 1fr;
+		grid-gap: 23rpx;
+	}
+	.exhibitor-item{
+		border-radius: 8rpx;
+		background: #FFFFFF;
+		box-shadow: 0rpx 4rpx 20rpx 0rpx rgba(0,0,0,0.15);
+		padding: 26rpx 23rpx;
+		border: 1rpx solid #D9D9D9;
+		&.active{
+			border: 4rpx solid rgba(232,116,0,0.34);
+			padding: 24rpx 21rpx;
+		}
+	}
+	.exhibitor-body{
+		display: flex;
+		.exhibitor-name{
+			flex: 1;
+			color: #333333;
+			font-weight: bold;
+			line-height: 38rpx;
+			font-size: $fontSize3;
+			margin-left: 12rpx;
+			margin-right: 28rpx;
+			&>view{
+				width: 100%;
+				@extend .text-ellipsis-line;
+				-webkit-line-clamp: 2; 
+			}
+		}
+		.exhibitor-name-cn{
+			font-family: Poppins, Poppins;
+		}
+		.exhibitor-name-en{
+			font-family: Poppins, Poppins;
+			font-weight: normal;
+			font-size: $fontSize2;
+		}
+		.exhibitor-number{
+			flex-shrink: 0;
+			justify-content: flex-end;
+			margin-top: 12rpx;
+		}
+		.exhibitor-number-label{
+			font-size: $fontSize0;
+			color: #555555;
+		}
+		.exhibitor-number-text{
+			font-family: Poppins, Poppins;
+			font-weight: bold;
+			font-size: $fontSize4;
+			color: #E57519;
+			letter-spacing: 2rpx;
+		}
+		.exhibitor-logo{
+			width: 90rpx;
+			height: 90rpx;
+			border-radius: 6rpx;
+			border: 1rpx solid #E1E1E1;
+		}
+		image{
+			width: 100%;
+			height: 100%;
+		}
+	}
+	.exhibitor-footer{
+		display: flex;
+		align-items: center;
+		padding-top: 33rpx;
+		.exhibitor-action{
+			display: grid;
+			flex: 1;
+			grid-template-columns: repeat(4, 1fr);
+			font-size: $fontSize1;
+			color: #555555;
+			&>view{
+				display: flex;
+				align-items: center;
+			}
+			.iconfont{
+				font-size: 28rpx;
+				margin-right: 4rpx;
+			}
+		}
+		
+		.exhibitor-views{
+			font-weight: 400;
+			font-size: $fontSize1;
+			color: #555555;
+			line-height: 20rpx;
+			margin-right: 57rpx;
+		}
+	}
+	.ad-space{
+		height: 90rpx;
+		background-color: #FEF1E8;
+		margin-bottom: 42rpx;
+		image{
+			width: 100%;
+			height: 100%;
+		}
+	}
+}