Jelajahi Sumber

优化pc端的显示

luxf 1 Minggu lalu
induk
melakukan
e821067949

+ 1 - 0
components/common/u-panel/index.vue

@@ -71,6 +71,7 @@
 		.u-panel-link{
 			font-size: $fontSize2;
 			color: #7D7D7D;
+			cursor: pointer;
 		}
 	}
 </style>

+ 50 - 4
components/layout/nav-bar.vue

@@ -1,5 +1,5 @@
 <template>
-	<view class="nav-bar" :class="{ 'nav-bar-transparent': transparent }">
+	<view v-if="!hideNavbar" class="nav-bar" :class="{ 'nav-bar-transparent': transparent }">
 		<view class="nav-bar-status" :style="{ height: statusBarHeight + 'px' }">
 		</view>
 		<view class="nav-bar-title" :style="{ height: titleBarHeight +'px' }">
@@ -7,7 +7,7 @@
 				<view class="btn-back" @click="goBack">
 					<van-icon v-if="hasParent" name="arrow-left" />
 				</view>
-				<view class="nav-bar-title-text">{{ title }}</view>
+				<view class="nav-bar-title-text">{{ title }} </view>
 				<view></view>
 			</template>
 			<template v-else>
@@ -35,20 +35,66 @@
 		},
 		data() {
 			return {
+				hideNavbar: false,
 				titleBarHeight: 0,
 				statusBarHeight: 0,
 				isNotchScreen: false
 			}
 		},
 		created() {
+			const self = this
 			const windowInfo = uni.getWindowInfo()
 			this.statusBarHeight = windowInfo.statusBarHeight
 			const menuButtonInfo = uni.getMenuButtonBoundingClientRect()
 			this.titleBarHeight = (menuButtonInfo.top - this.statusBarHeight) * 2 + menuButtonInfo.height + (windowInfo.screenWidth / 750 * 16)
+			if (this.showTitle) {
+				uni.getSystemInfo({
+					success(res) {
+						const os = res.system.toLowerCase()
+						self.$config.os = os
+						if (os.includes('windows') || os.includes('mac')) {
+							// 可在pc端隐藏导航
+							self.$emit('init', {
+								detail: {
+									navbarHeight: 0,
+									pageHeight: windowInfo.screenHeight
+								}
+							})
+							self.hideNavbar = true
+							
+							// self.statusBarHeight = 0
+							// self.titleBarHeight = (windowInfo.screenWidth / 750 * 100)
+							// self.$emit('init', {
+							// 	detail: {
+							// 		navbarHeight: (windowInfo.screenWidth / 750 * 100),
+							// 		pageHeight: windowInfo.screenHeight -  (windowInfo.screenWidth / 750 * 100)
+							// 	}
+							// })
+						}
+					}
+				})
+			} else {
+				uni.getSystemInfo({
+					success(res) {
+						const os = res.system.toLowerCase()
+						self.$config.os = os
+						if (os.includes('windows') || os.includes('mac')) {
+							self.statusBarHeight = 0
+							self.titleBarHeight = (windowInfo.screenWidth / 750 * 120)
+							self.$emit('init', {
+								detail: {
+									navbarHeight: (windowInfo.screenWidth / 750 * 120),
+									pageHeight: windowInfo.screenHeight -  (windowInfo.screenWidth / 750 * 120)
+								}
+							})
+						}
+					}
+				})
+			}
 			this.$emit('init', {
 				detail: {
-					navbarHeight: this.statusBarHeight + this.titleBarHeight,
-					pageHeight: windowInfo.screenHeight - (this.statusBarHeight + this.titleBarHeight)
+					navbarHeight: self.hideNavbar ? 0 : (this.statusBarHeight + this.titleBarHeight),
+					pageHeight: windowInfo.screenHeight - (self.hideNavbar ? 0 : (this.statusBarHeight + this.titleBarHeight))
 				}
 			})
 		},

+ 17 - 0
components/layout/tab-bar.vue

@@ -83,6 +83,23 @@
 		methods: {
 			onChange(active) {
 				this.tabbarActive = active
+				if (this.tabbarActive === 'home') {
+					uni.setNavigationBarTitle({
+					  title: '慕尼黑上海电子生产设备展'
+					});
+				} else if (this.tabbarActive === 'exhibitor') {
+					uni.setNavigationBarTitle({
+					  title: '展商'
+					});
+				} else if (this.tabbarActive === 'activity') {
+					uni.setNavigationBarTitle({
+					  title: '同期活动'
+					});
+				} else if (this.tabbarActive === 'user') {
+					uni.setNavigationBarTitle({
+					  title: '个人中心'
+					});
+				}
 				this.$emit('update:active', active)
 				this.$emit('change', active)
 			},

+ 20 - 19
pages.json

@@ -6,33 +6,34 @@
 				"navigationBarTitleText": "慕尼黑上海电子生产设备展"
 			}
 		},
-		{ "path": "pages/news/index" },
-		
-		{ "path": "pages/activity/index" },
-		{ "path": "pages/activity/detail" },
-		{ "path": "pages/activity/guest" },
+		{ "path": "pages/news/index", "style": { "navigationBarTitleText": "新闻" }},
+		// 活动模块
+		{ "path": "pages/activity/index" ,  "style": { "navigationBarTitleText": "同期活动" }},
+		{ "path": "pages/activity/detail",  "style": { "navigationBarTitleText": "同期详情" }},
+		{ "path": "pages/activity/guest",  "style": { "navigationBarTitleText": "演讲嘉宾" }},
+		// 展商模块
 		// { "path": "pages/exhibitor/index" },
-		{ "path": "pages/exhibitor/exhibit" },
-		{ "path": "pages/exhibitor/exhibit-detail" },
-		{ "path": "pages/exhibitor/detail" },
-		
-		{ "path": "pages/user/index" },
-		{ "path": "pages/user/login" },
-		{ "path": "pages/user/setting" },
-		{ "path": "pages/user/info" },
-		{ "path": "pages/user/info-edit" },
-		{ "path": "pages/user/like" },
-		{ "path": "pages/user/favorites" },
-		{ "path": "pages/user/vote" },
+		{ "path": "pages/exhibitor/exhibit", "style": { "navigationBarTitleText": "展品信息" }},
+		{ "path": "pages/exhibitor/exhibit-detail", "style": { "navigationBarTitleText": "展品详情" }},
+		{ "path": "pages/exhibitor/detail", "style": { "navigationBarTitleText": "展商详情" }},
+		// 用户模块
+		{ "path": "pages/user/index", "style": { "navigationBarTitleText": "个人中心" }},
+		{ "path": "pages/user/login", "style": { "navigationBarTitleText": "登录" } },
+		{ "path": "pages/user/setting", "style": { "navigationBarTitleText": "设置" }},
+		{ "path": "pages/user/info", "style": { "navigationBarTitleText": "个人信息" }},
+		{ "path": "pages/user/info-edit", "style": { "navigationBarTitleText": "修改个人信息" }},
+		{ "path": "pages/user/like", "style": { "navigationBarTitleText": "我的点赞" }},
+		{ "path": "pages/user/favorites", "style": { "navigationBarTitleText": "我的收藏" }},
+		{ "path": "pages/user/vote", "style": { "navigationBarTitleText": "我的投票" }},
 		// 组件页面
-		{ "path": "pages/index/search" },
+		{ "path": "pages/index/search",  "style": { "navigationBarTitleText": "搜索" }},
 		// WEBVIEW
 		{ "path": "pages/index/webview", "style": { "navigationStyle": "default", "navigationBarTitleText": "加载中...", "navigationBarBackgroundColor": "#332968" }}
 	],
 	"globalStyle": {
 		"navigationStyle": "custom",
 		"navigationBarTextStyle": "white",
-		"navigationBarTitleText": "uni-app",
+		"navigationBarTitleText": "慕尼黑上海电子生产设备展",
 		"navigationBarBackgroundColor": "#F8F8F8",
 		"backgroundColor": "#F8F8F8",
 		"usingComponents": {

+ 1 - 1
pages/activity/detail.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="activity-detail">
-		<nav-bar title="同期详情" @init="onInitNavbar"></nav-bar>
+		<nav-bar title="同期活动详情" @init="onInitNavbar"></nav-bar>
 		<u-scroll-view>
 			<view class="main-container">
 				<view class="activity-head">

+ 1 - 0
pages/index/components/contact-us.vue

@@ -86,6 +86,7 @@
 			right: -70rpx;
 			.van-icon-close{
 				font-size: 69rpx;
+				cursor: pointer;
 			}
 		}
 	}

+ 1 - 0
pages/index/components/popup-ad.vue

@@ -132,6 +132,7 @@
 			.van-icon-close{
 				font-size: 69rpx;
 				color: #ffffff;
+				cursor: pointer;
 			}
 		}
 	}

+ 2 - 0
pages/index/home.vue

@@ -346,6 +346,7 @@
 		.nav-icon-wrapper {
 			@include display-flex-center;
 			flex-direction: column;
+			cursor: pointer;
 		}
 
 		.nav-text {
@@ -456,6 +457,7 @@
 			background-color: #FFFFFF;
 			box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(0,0,0,0.25);
 			border-radius: 50%;
+			cursor: pointer;
 		}
 		.floating-button-label{
 			margin-top: 4rpx;

+ 1 - 0
pages/user/index.vue

@@ -163,6 +163,7 @@
 				flex-direction: column;
 				font-size: $fontSize3;
 				color: #333333;
+				cursor: pointer;
 				&.active{
 					background-color: rgba(0, 0, 0, 0.05)
 				}

+ 4 - 0
static/style/pages/exhibitor-detail.scss

@@ -41,6 +41,10 @@
 				display: flex;
 				align-items: center;
 				white-space: nowrap;
+				cursor: pointer;
+				&:first-child{
+					cursor: default;
+				}
 			}
 			button{
 				font-size: $fontSize0;

+ 1 - 0
static/style/pages/exhibitor-item.scss

@@ -72,6 +72,7 @@
 			&>view, &>button{
 				display: flex;
 				align-items: center;
+				cursor: pointer;
 			}
 			button{
 				font-size: $fontSize2;

+ 3 - 0
static/style/vant.scss

@@ -73,6 +73,9 @@
 		color: #333333;
 		padding-left: 8rpx;
 	}
+	.van-cell--clickable{
+		cursor: pointer;
+	}
 	.van-cell__title{
 		display: flex;
 		align-items: center;