From 5b555ddf9055d9eabdb13cfb71d18e968b2a7267 Mon Sep 17 00:00:00 2001
From: minimaxagent1 <minimaxagent1@gmail.com>
Date: Thu, 31 Jul 2025 09:02:38 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B0=8F=E7=A8=8B=E5=BA=8F=E5=AF=BC=E8=88=AA?=
 =?UTF-8?q?=E6=A0=8F=E8=AE=BE=E8=AE=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 enum/common.js              |   5 +-
 pages/monk/monk.vue         | 418 ++++++++++++++++++------------------
 pages/walkInto/walkInto.vue |  98 ++++++++-
 3 files changed, 305 insertions(+), 216 deletions(-)

diff --git a/enum/common.js b/enum/common.js
index 009a0f0..e70e6e4 100644
--- a/enum/common.js
+++ b/enum/common.js
@@ -1,6 +1,7 @@
 export const CommonEnum = {
 
-    BACKGROUND: "https://api.ccttiot.com/image-1753769939853.png", //返回的按钮图像
-	RIGHT_CHEVRON:"https://api.ccttiot.com/image-1753773619878.png"
+    BACKGROUND: "https://api.ccttiot.com/image-1753769939853.png", //背景图片
+	RIGHT_CHEVRON:"https://api.ccttiot.com/image-1753773619878.png",
+    BACK_BUTTON:"https://api.ccttiot.com/image-1753868358514.png"
 };
 export default CommonEnum;
\ No newline at end of file
diff --git a/pages/monk/monk.vue b/pages/monk/monk.vue
index e4f438f..c4608af 100644
--- a/pages/monk/monk.vue
+++ b/pages/monk/monk.vue
@@ -1,233 +1,237 @@
 <template>
-	<view class="page">
+  <view class="page">
 		<u-navbar title="寺庙高僧" :border-bottom="false" :background="bgc" back-icon-color="#262B37" title-color='#262B37'
 			title-size='36' height='36' id="navbar">
 		</u-navbar>
-		<view class="header">
-			<image class="background-image" :src="CommonEnum.BACKGROUND" mode="aspectFill"></image>
-			<view class='searchBox'>
-				<image class="search-icon" :src="MonkEnum.SEARCH" mode="aspectFit"></image>
-				<input
-					class="search-input"
-					v-model="searchName"
-					placeholder="请输入高僧姓名"
-					placeholder-class="search-placeholder"
-					@confirm="onSearch"
-					confirm-type="search"
-				/>
-				<view class="search-btn" @click="onSearch">搜索</view>
-			</view>
-			<view class="monk-list">
-				<view class="monk-item" v-for="(item, idx) in monkList" :key="item.id">
-					<image class="monk-avatar" :src="item.imgUrl" mode="aspectFill"></image>
-					<view class="monk-info">
-						<view class="desc-row">
-							<view class="monk-desc">{{ item.name }}，{{ stripHtmlTags(item.profile) }}</view>
-							<view class="monk-detail" @click="goDetail(item)">查看详情&gt;</view>
-						</view>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+    <container>
+      <view class="header">
+        <image class="background-image" :src="CommonEnum.BACKGROUND" mode="aspectFill"></image>
+        <view class='searchBox'>
+          <image class="search-icon" :src="MonkEnum.SEARCH" mode="aspectFit"></image>
+          <input
+              class="search-input"
+              v-model="searchName"
+              placeholder="请输入高僧姓名"
+              placeholder-class="search-placeholder"
+              @confirm="onSearch"
+              confirm-type="search"
+          />
+          <view class="search-btn" @click="onSearch">搜索</view>
+        </view>
+        <view class="monk-list">
+          <view class="monk-item" v-for="(item, idx) in monkList" :key="item.id">
+            <image class="monk-avatar" :src="item.imgUrl" mode="aspectFill"></image>
+            <view class="monk-info">
+              <view class="desc-row">
+                <view class="monk-desc">{{ item.name }}，{{ stripHtmlTags(item.profile) }}</view>
+                <view class="monk-detail" @click="goDetail(item)">查看详情&gt;</view>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </container>
+
+  </view>
 </template>
 
 <script>
-	import {
-		CommonEnum
-	} from '@/enum/common.js'
-	import {
-		MonkEnum
-	} from '@/enum/monk.js'
-	import {
-		getMonkList
-	} from '@/api/monk/monk.js'
+import {
+  CommonEnum
+} from '@/enum/common.js'
+import {
+  MonkEnum
+} from '@/enum/monk.js'
+import {
+  getMonkList
+} from '@/api/monk/monk.js'
 
-	export default {
-		data() {
-			return {
-				bgc: {
-					backgroundColor: "#F5F0E7"
-				},
-				CommonEnum,
-				MonkEnum,
-				monkList: [],
-				searchName: ''
-			}
-		},
-		onLoad() {
-			this.fetchMonkList()
-		},
-		methods: {
-			async fetchMonkList() {
-				try {
-					const res = await getMonkList({ name: this.searchName })
-					if (res.code === 200 && Array.isArray(res.rows)) {
-						this.monkList = res.rows
-					} else {
-						uni.showToast({
-							title: res.msg || '获取失败',
-							icon: 'none'
-						})
-					}
-				} catch (e) {
-					uni.showToast({
-						title: '网络错误',
-						icon: 'none'
-					})
-				}
-			},
-			onSearch() {
-				this.fetchMonkList()
-			},
-			// 去除 HTML 标签，返回纯文本
-			stripHtmlTags(html) {
-				if (!html) return ''; // 处理空值
-				return html.replace(/<[^>]+>/g, ''); // 正则替换所有 HTML 标签
-			},
-			goDetail(item) {
-				uni.navigateTo({
-					url: `/pages/monk/monkDetail?id=${item.id}`,
-					fail: (err) => {
-						console.error('跳转失败:', err);
-						uni.showToast({
-							title: '页面跳转失败',
-							icon: 'none'
-						});
-					}
-				});
-			}
-		}
-	}
+export default {
+  data() {
+    return {
+      bgc: {
+        backgroundColor: "#F5F0E7"
+      },
+      CommonEnum,
+      MonkEnum,
+      monkList: [],
+      searchName: ''
+    }
+  },
+  onLoad() {
+    this.fetchMonkList()
+  },
+  methods: {
+    async fetchMonkList() {
+      try {
+        const res = await getMonkList({name: this.searchName})
+        if (res.code === 200 && Array.isArray(res.rows)) {
+          this.monkList = res.rows
+        } else {
+          uni.showToast({
+            title: res.msg || '获取失败',
+            icon: 'none'
+          })
+        }
+      } catch (e) {
+        uni.showToast({
+          title: '网络错误',
+          icon: 'none'
+        })
+      }
+    },
+    onSearch() {
+      this.fetchMonkList()
+    },
+    // 去除 HTML 标签，返回纯文本
+    stripHtmlTags(html) {
+      if (!html) return ''; // 处理空值
+      return html.replace(/<[^>]+>/g, ''); // 正则替换所有 HTML 标签
+    },
+    goDetail(item) {
+      uni.navigateTo({
+        url: `/pages/monk/monkDetail?id=${item.id}`,
+        fail: (err) => {
+          console.error('跳转失败:', err);
+          uni.showToast({
+            title: '页面跳转失败',
+            icon: 'none'
+          });
+        }
+      });
+    }
+  }
+}
 </script>
 
 <style lang="scss">
-	.page {
-		width: 750rpx;
-		min-height: 100vh;
-		background: #F5F0E7;
-		border-radius: 0rpx 0rpx 0rpx 0rpx;
-	}
+.page {
+  position: relative;
+  width: 750rpx;
+  min-height: 100vh;
+  background: #F5F0E7;
+  border-radius: 0rpx 0rpx 0rpx 0rpx;
+}
 
-	.header {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		min-height: 100vh;
-		background-color: transparent;
-		margin: 20px 14px 40rpx 14px;
-		width: 694rpx;
-		border-radius: 16rpx;
-		position: relative;
-	}
+.header {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  min-height: 100vh;
+  background-color: transparent;
+  margin: 20px 14px 40rpx 14px;
+  width: 694rpx;
+  border-radius: 16rpx;
+  position: relative;
+}
 
-	.background-image {
-		position: absolute;
-		top: 0;
-		left: 0;
-		width: 100%;
-		height: 100%;
-		z-index: -1;
-		border-radius: 16rpx;
-	}
+.background-image {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: -1;
+  border-radius: 16rpx;
+}
 
-	.searchBox {
-		display: flex;
-		align-items: center;
-		width: 660rpx;
-		height: 70rpx;
-		background: #FFFBF5;
-		border-radius: 10rpx;
-		border: 1rpx solid #C7A26D;
-		margin-top: 20rpx;
-		padding: 0 12rpx;
-	}
+.searchBox {
+  display: flex;
+  align-items: center;
+  width: 660rpx;
+  height: 70rpx;
+  background: #FFFBF5;
+  border-radius: 10rpx;
+  border: 1rpx solid #C7A26D;
+  margin-top: 20rpx;
+  padding: 0 12rpx;
+}
 
-	.search-icon {
-		width: 32rpx;
-		height: 32rpx;
-		margin: 0 28rpx;
-	}
+.search-icon {
+  width: 32rpx;
+  height: 32rpx;
+  margin: 0 28rpx;
+}
 
-	.search-input {
-		flex: 1;
-		font-size: 28rpx;
-		color: #333;
-		background: transparent;
-		border: none;
-		outline: none;
-		height: 100%;
-	}
+.search-input {
+  flex: 1;
+  font-size: 28rpx;
+  color: #333;
+  background: transparent;
+  border: none;
+  outline: none;
+  height: 100%;
+}
 
-	.search-placeholder {
-		color: #bfa16b;
-		font-size: 28rpx;
-	}
+.search-placeholder {
+  color: #bfa16b;
+  font-size: 28rpx;
+}
 
-	.search-btn {
-		background: #bfa16b;
-		color: #fff;
-		font-size: 26rpx;
-		border-radius: 6rpx;
-		padding: 0 24rpx;
-		height: 48rpx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		margin-left: 16rpx;
-	}
+.search-btn {
+  background: #bfa16b;
+  color: #fff;
+  font-size: 26rpx;
+  border-radius: 6rpx;
+  padding: 0 24rpx;
+  height: 48rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-left: 16rpx;
+}
 
-	.monk-list {
-		width: 100%;
-		margin-top: 24rpx;
-	}
+.monk-list {
+  width: 100%;
+  margin-top: 24rpx;
+}
 
-	.monk-item {
-		display: flex;
-		flex-direction: row;
-		align-items: flex-start;
-		background: transparent;
-		margin-bottom: 24rpx;
-	}
+.monk-item {
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+  background: transparent;
+  margin-bottom: 24rpx;
+}
 
-	.monk-avatar {
-		width: 184rpx;
-		height: 184rpx;
-		background: #e5e5e5;
-		border-radius: 8rpx;
-		margin-right: 18rpx;
-	}
+.monk-avatar {
+  width: 184rpx;
+  height: 184rpx;
+  background: #e5e5e5;
+  border-radius: 8rpx;
+  margin-right: 18rpx;
+}
 
-	.monk-info {
-		flex: 1;
-		display: flex;
-		flex-direction: column;
-		justify-content: flex-start;
-	}
+.monk-info {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+}
 
-	.desc-row {
-		display: flex;
-		align-items: flex-end;
-		flex-direction: column;
-		width: 100%;
-	}
+.desc-row {
+  display: flex;
+  align-items: flex-end;
+  flex-direction: column;
+  width: 100%;
+}
 
-	.monk-desc {
-		line-height: 38rpx;
-		font-size: 28rpx;
-		color: #695347;
-		margin-top: 8rpx;
-		word-break: break-all;
-		// 让内容最多显示4行，超出省略
-		display: -webkit-box;
-		-webkit-line-clamp: 4;
-		-webkit-box-orient: vertical;
-		overflow: hidden;
-	}
+.monk-desc {
+  line-height: 38rpx;
+  font-size: 28rpx;
+  color: #695347;
+  margin-top: 8rpx;
+  word-break: break-all;
+  // 让内容最多显示4行，超出省略
+  display: -webkit-box;
+  -webkit-line-clamp: 4;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
 
-	.monk-detail {
-		color: #bfa16b;
-		font-size: 24rpx;
-		white-space: nowrap;
-	}
+.monk-detail {
+  color: #bfa16b;
+  font-size: 24rpx;
+  white-space: nowrap;
+}
 </style>
\ No newline at end of file
diff --git a/pages/walkInto/walkInto.vue b/pages/walkInto/walkInto.vue
index 9ceacf5..f015277 100644
--- a/pages/walkInto/walkInto.vue
+++ b/pages/walkInto/walkInto.vue
@@ -1,29 +1,65 @@
 <template>
   <view class="page">
-    <u-navbar title="走进平山" :border-bottom="false" :background="bgc" back-icon-color="#262B37" title-color='#262B37'
-              title-size='36' height='36' id="navbar">
-    </u-navbar>
-    <view class="header">
+    <!-- 自定义导航栏 -->
+    <view class="custom-navbar" :style="{ paddingTop: statusBarHeight + 'px', height: navBarHeight + 'px' }">
+      <view class="navbar-left" @click="goBack" :style="{ height: capsuleHeight + 'px', lineHeight: capsuleHeight + 'px' }">
+        <image :src="CommonEnum.BACK_BUTTON" mode="aspectFit" class="back-icon"></image>
+      </view>
+      <view class="navbar-title" :style="{ height: capsuleHeight + 'px', lineHeight: capsuleHeight + 'px' }">走进平山</view>
+      <view class="navbar-right" :style="{ height: capsuleHeight + 'px', lineHeight: capsuleHeight + 'px' }"></view>
+    </view>
+
+    <view class="header" :style="{ marginTop: navBarHeight + 'px' }">
   <!--    <image src="" mode=""></image> -->
-	  <view>111</view>
+	  <view>111222</view>
     </view>
   </view>
 </template>
 
 <script>
+import CommonEnum from "../../enum/common";
+
 export default {
+  computed: {
+    CommonEnum() {
+      return CommonEnum
+    }
+  },
   data() {
     return {
       bgc: {
         backgroundColor: "#F5F0E7",
       },
+      statusBarHeight: 0,
+      navBarHeight: 0,
+      menuButtonInfo: null,
+      capsuleHeight: 0,
     }
   },
   onLoad() {
-
+    this.getSystemInfo();
   },
   methods: {
-
+    goBack() {
+      uni.navigateBack({
+        delta: 1
+      });
+    },
+    getSystemInfo() {
+      // 获取系统信息
+      const systemInfo = uni.getSystemInfoSync();
+      // 获取状态栏高度
+      this.statusBarHeight = systemInfo.statusBarHeight;
+      
+      // 获取胶囊按钮信息
+      this.menuButtonInfo = uni.getMenuButtonBoundingClientRect();
+      
+      // 计算胶囊高度
+      this.capsuleHeight = this.menuButtonInfo.height;
+      
+      // 计算导航栏高度（胶囊底部到状态栏顶部的距离）
+      this.navBarHeight = this.menuButtonInfo.bottom + 8;
+    }
   }
 }
 </script>
@@ -35,6 +71,54 @@ page {
 	background: #F5F0E7;
 	border-radius: 0rpx 0rpx 0rpx 0rpx;
 }
+
+/* 自定义导航栏样式 */
+.custom-navbar {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 999;
+  padding-top: 0;
+  background-color: #F5F0E7;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-left: 30rpx;
+  padding-right: 30rpx;
+  box-sizing: border-box;
+}
+
+.navbar-left {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 60rpx;
+
+  .back-icon {
+    width: 56rpx;
+    height: 56rpx;
+  }
+}
+
+.navbar-title {
+  font-size: 36rpx;
+  font-weight: bold;
+  color: #695347;
+  flex: 1;
+  text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.navbar-right {
+  width: 60rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
 .header {
   min-height: 100vh;
   display: flex;