Monk页面优化

This commit is contained in:
minimaxagent1 2025-07-31 09:36:28 +08:00
parent 540e05c282
commit c67c2e14b8

View File

@ -1,9 +1,7 @@
<template> <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"> <custom-navbar title="寺庙高僧" />
</u-navbar>
<container>
<view class="header"> <view class="header">
<image class="background-image" :src="CommonEnum.BACKGROUND" mode="aspectFill"></image> <image class="background-image" :src="CommonEnum.BACKGROUND" mode="aspectFill"></image>
<view class='searchBox'> <view class='searchBox'>
@ -30,8 +28,6 @@
</view> </view>
</view> </view>
</view> </view>
</container>
</view> </view>
</template> </template>
@ -45,8 +41,12 @@ import {
import { import {
getMonkList getMonkList
} from '@/api/monk/monk.js' } from '@/api/monk/monk.js'
import CustomNavbar from "../../components/custom-navbar/custom-navbar.vue";
export default { export default {
components: {
CustomNavbar
},
data() { data() {
return { return {
bgc: { bgc: {
@ -106,11 +106,11 @@ export default {
<style lang="scss"> <style lang="scss">
.page { .page {
position: relative;
width: 750rpx; width: 750rpx;
min-height: 100vh; min-height: 100vh;
background: #F5F0E7; background: #F5F0E7;
border-radius: 0rpx 0rpx 0rpx 0rpx; border-radius: 0rpx 0rpx 0rpx 0rpx;
/* 移除padding-top因为导航栏已经处理了状态栏适配 */
} }
.header { .header {
@ -119,7 +119,7 @@ export default {
align-items: center; align-items: center;
min-height: 100vh; min-height: 100vh;
background-color: transparent; background-color: transparent;
margin: 20px 14px 40rpx 14px; margin: 10px 14px 40rpx 14px; /* 减少顶部间距 */
width: 694rpx; width: 694rpx;
border-radius: 16rpx; border-radius: 16rpx;
position: relative; position: relative;
@ -133,6 +133,7 @@ export default {
height: 100%; height: 100%;
z-index: -1; z-index: -1;
border-radius: 16rpx; border-radius: 16rpx;
/* 确保背景图不被导航栏遮挡 */
} }
.searchBox { .searchBox {
@ -143,7 +144,7 @@ export default {
background: #FFFBF5; background: #FFFBF5;
border-radius: 10rpx; border-radius: 10rpx;
border: 1rpx solid #C7A26D; border: 1rpx solid #C7A26D;
margin-top: 20rpx; margin-top: 10rpx; /* 进一步减少顶部间距 */
padding: 0 12rpx; padding: 0 12rpx;
} }
@ -184,6 +185,7 @@ export default {
.monk-list { .monk-list {
width: 100%; width: 100%;
margin-top: 24rpx; margin-top: 24rpx;
/* 确保列表内容正常显示 */
} }
.monk-item { .monk-item {