Browse Source

固定头部

your_username 4 days ago
parent
commit
8066af54c5

+ 38 - 18
my/enterpriseInfo/enterpriseInfo.vue

@@ -1,19 +1,21 @@
 <template>
-	<view class="content">
-		<!-- 顶部导航 -->
-		<view class="nav-bar">
-			<view class="nav-left" @click="goBack">
-				<u-icon name="arrow-leftward" color="rgba(51, 51, 51, 1)" style="font-size: 38rpx;"></u-icon>
-			</view>
-			<view class="nav-title">公司介绍</view>
-			<view class="nav-right">
-				<view class="nav-icons">
-					<view class="nav-icon" @click="setCollection">
-						<image v-if="isCollection==0" src="/static/images/index/guanzhu.svg" class="icon-img"></image>
-						<image v-else src="/static/images/index/gzActive.svg" class="icon-img"></image>
-					</view>
-					<view class="nav-icon" @click="showShare">
-						<image src="/static/images/index/fenxiang.svg" class="icon-img"></image>
+	<view class="content" :style="{ paddingTop: (12 + statusBarHeight + 88 - 60) + 'px' }">
+		<!-- 固定顶部导航 -->
+		<view class="fixed-nav" :style="{ paddingTop: (12 + statusBarHeight) + 'px' }">
+			<view class="nav-bar">
+				<view class="nav-left" @click="goBack">
+					<u-icon name="arrow-leftward" color="rgba(51, 51, 51, 1)" style="font-size: 38rpx;"></u-icon>
+				</view>
+				<view class="nav-title">公司介绍</view>
+				<view class="nav-right">
+					<view class="nav-icons">
+						<view class="nav-icon" @click="setCollection">
+							<image v-if="isCollection==0" src="/static/images/index/guanzhu.svg" class="icon-img"></image>
+							<image v-else src="/static/images/index/gzActive.svg" class="icon-img"></image>
+						</view>
+						<view class="nav-icon" @click="showShare">
+							<image src="/static/images/index/fenxiang.svg" class="icon-img"></image>
+						</view>
 					</view>
 				</view>
 			</view>
@@ -204,6 +206,7 @@
 		},
 		data() {
 			return {
+				statusBarHeight: 0, // 状态栏高度
 				backStyle: {
 					color: '#ffffff'
 				},
@@ -271,6 +274,10 @@
 		// 	}
 		// },
 		onLoad(option) {
+			// 获取状态栏高度
+			let systemInfo = uni.getSystemInfoSync();
+			this.statusBarHeight = systemInfo.statusBarHeight || 0;
+			
 			// 获取邀请码保存到本地
 			if (option.invitation) {
 				this.$queue.setData('inviterCode', option.invitation);
@@ -437,15 +444,28 @@
 	}
 
 	.content {
-		padding-top: 88rpx!important;
+		// padding-top 已改为动态计算,在模板中通过 :style 设置
+	}
+
+	.fixed-nav {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 0;
+		z-index: 9999;
+		background-color: #ffffff;
+		padding: 0 32rpx;
+		// padding-top 已改为动态计算,在模板中通过 :style 设置
 	}
 
 	.nav-bar {
 		display: flex;
 		align-items: center;
 		justify-content: space-between;
-		margin-bottom: 30rpx;
-		padding: 0 40rpx;
+		height: 88rpx;
+		padding: 0 8rpx;
+		// margin-bottom: 30rpx; // 已移除,因为现在是固定导航栏
+		// padding: 0 40rpx; // 已调整,因为外层 fixed-nav 已有 padding
 
 		.nav-left {
 			display: flex;

+ 21 - 3
pages/index/game/order.vue

@@ -1,7 +1,8 @@
 <template>
-	<view style="padding: 88rpx 40rpx 40rpx 40rpx;">
-		<!-- 顶部导航 -->
-		<view class="nav-bar">
+	<view style="padding: 148rpx 40rpx 40rpx 40rpx;">
+		<!-- 固定顶部导航 -->
+		<view class="fixed-nav" :style="{ paddingTop: (12 + statusBarHeight) + 'px' }">
+			<view class="nav-bar">
 			<view class="nav-left" @click="goBack">
 				<u-icon name="arrow-leftward" color="rgba(51, 51, 51, 1)" style="font-size: 38rpx;"></u-icon>
 			</view>
@@ -21,6 +22,7 @@
 				</view>
 			</view>
 		</view>
+		</view>
 		
 		<!-- 岗位要求 -->
 		<view class="job flex justify-center">
@@ -316,6 +318,7 @@
 		},
 		data() {
 			return {
+				statusBarHeight: 0, // 状态栏高度
 				loading: true,
 				shows: false,
 				postPushId: '',
@@ -343,6 +346,10 @@
 			};
 		},
 		onLoad(option) {
+			// 获取状态栏高度
+			let systemInfo = uni.getSystemInfoSync();
+			this.statusBarHeight = systemInfo.statusBarHeight || 0;
+			
 			// 获取邀请码保存到本地
 			if (option.invitation) {
 				this.$queue.setData('inviterCode', option.invitation);
@@ -687,6 +694,17 @@
 		padding-bottom: 200rpx;
 	}
 
+	.fixed-nav {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 0;
+		z-index: 9999;
+		background-color: #ffffff;
+		padding: 0 32rpx;
+		// padding-top 已改为动态计算,在模板中通过 :style 设置
+	}
+
 	.urgent-banner {
 		width: 100%;
 		height: 120rpx;

+ 1 - 1
pages/index/index.vue

@@ -2074,7 +2074,7 @@
 
 	.gwList {
 		width: 100%;
-		margin-top: 220rpx;
+		margin-top: 240rpx;
 
 		.gwList-box {
 			width: 710rpx;

+ 15 - 6
pages/jobManagement/jobDetail.vue

@@ -3,7 +3,7 @@
 		<!-- 固定顶部导航栏 -->
 		<view class="fixed-header">
 			<!-- 自定义导航栏 -->
-			<view class="custom-navbar">
+			<view class="custom-navbar" :style="{ paddingTop: (12 + statusBarHeight) + 'px' }">
 				<view class="navbar-content">
 					<view class="nav-left" @click="goBack">
 						<u-icon name="arrow-leftward" color="#333" size="32"></u-icon>
@@ -15,7 +15,11 @@
 		</view>
 		
 		<!-- 主要内容区域 -->
-		<view class="main-content">
+		<view class="main-content" :style="{ 
+			marginTop: (12 + statusBarHeight + 88) + 'px',
+			height: 'calc(100vh - ' + (12 + statusBarHeight + 88) + 'px)',
+			overflowY: 'auto'
+		}">
 			<!-- 审核状态提示 -->
 			<view class="status-section">
 				<view class="status-icon">
@@ -63,9 +67,14 @@
 export default {
 	data() {
 		return {
-			
+			statusBarHeight: 0 // 状态栏高度
 		}
 	},
+	onLoad() {
+		// 获取状态栏高度
+		let systemInfo = uni.getSystemInfoSync();
+		this.statusBarHeight = systemInfo.statusBarHeight || 0;
+	},
 	methods: {
 		goBack() {
 			uni.navigateBack()
@@ -86,7 +95,8 @@ page {
 }
 
 .job-detail-page {
-	min-height: 100vh;
+	height: 100vh;
+	overflow: hidden;
 	background-color: #ffffff;
 }
 
@@ -100,7 +110,7 @@ page {
 }
 
 .custom-navbar {
-	padding-top: 80rpx;
+	// padding-top 已改为动态计算,在模板中通过 :style 设置
 	background-color: #ffffff;
 	box-sizing: border-box;
 	
@@ -133,7 +143,6 @@ page {
 
 .main-content {
 	padding: 0 40rpx;
-	margin-top: 200rpx;
 	padding-bottom: 120rpx;
 }
 

+ 32 - 11
pages/talentSearch/resumeDetail.vue

@@ -1,13 +1,15 @@
 <template>
-	<view class="resume-detail">
-		<!-- 顶部导航栏 -->
-		<view class="navbar">
-			<view class="navbar-content">
-				<view class="navbar-left" @click="goBack">
-					<u-icon name="arrow-leftward" size="38" color="#333"></u-icon>
+	<view class="resume-detail" :style="{ paddingTop: (12 + statusBarHeight + 88 - 60) + 'px' }">
+		<!-- 固定顶部导航栏 -->
+		<view class="fixed-nav" :style="{ paddingTop: (12 + statusBarHeight) + 'px' }">
+			<view class="navbar">
+				<view class="navbar-content">
+					<view class="navbar-left" @click="goBack">
+						<u-icon name="arrow-leftward" size="38" color="#333"></u-icon>
+					</view>
+					<view class="navbar-title">简历详情</view>
+					<view class="navbar-right"></view>
 				</view>
-				<view class="navbar-title">简历详情</view>
-				<view class="navbar-right"></view>
 			</view>
 		</view>
 
@@ -253,6 +255,7 @@
 	export default {
 		data() {
 			return {
+				statusBarHeight: 0, // 状态栏高度
 				resumeId: '',
 				resumeData: {},
 				defaultExpectations: [
@@ -293,6 +296,10 @@
 			}
 		},
 		onLoad(options) {
+			// 获取状态栏高度
+			let systemInfo = uni.getSystemInfoSync();
+			this.statusBarHeight = systemInfo.statusBarHeight || 0;
+			
 			if (options.resumeId) {
 				this.resumeId = options.resumeId;
 				this.loadResumeData();
@@ -321,12 +328,26 @@
 	.resume-detail {
 		min-height: 100vh;
 		padding-bottom: 120rpx;
+		// padding-top 已改为动态计算,在模板中通过 :style 设置
+	}
+
+	.fixed-nav {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 0;
+		z-index: 9999;
+		background-color: #ffffff;
+		padding: 0 32rpx;
+		// padding-top 已改为动态计算,在模板中通过 :style 设置
 	}
 
 	// 顶部导航栏
 	.navbar {
 		background: #fff;
-		padding: 80rpx 0 40rpx 0;
+		height: 88rpx;
+		padding: 0 8rpx;
+		// padding: 80rpx 0 40rpx 0; // 已移除,因为现在是固定导航栏
 		
 		.navbar-content {
 			display: flex;
@@ -346,9 +367,9 @@
 			.navbar-title {
                 color: rgba(23, 23, 37, 1);
                 font-family: DM Sans;
-                font-size: 20px;
+                font-size: 38rpx;
                 font-weight: 700;
-                line-height: 26px;
+                line-height: 52rpx;
                 letter-spacing: 0%;
                 text-align: center;
 			}