WindowBird/buddhism
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

高僧详细界面2.0

Browse Source
This commit is contained in:
minimaxagent1 2025-07-30 16:37:13 +08:00
parent 967459409c
commit 40f79363fe
1 changed files with 141 additions and 131 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
pages/monk/monkDetail.vue
View File

@ -14,14 +14,6 @@
<image class="monk-image" :src="monkInfo.imgUrl" mode="aspectFill"></image> <image class="monk-image" :src="monkInfo.imgUrl" mode="aspectFill"></image>
</view> </view>
</view> </view>
<!-- 高僧基本信息 -->
<view class="monk-info" v-if="monkInfo.name">
<image class="monk-avatar" :src="monkInfo.imgUrl || 'https://api.ccttiot.com/image-1753687164375.png'" mode="aspectFill"></image>
<view class="monk-basic">
<text class="monk-name">{{ monkInfo.name }}</text>
<text class="monk-duties">{{ monkInfo.duties }}</text>
</view>
</view> </view>
<!-- 导航标签 --> <!-- 导航标签 -->
@ -42,16 +34,22 @@
<view class="section-title"> <view class="section-title">
{{ tabs[activeTab].title }} {{ tabs[activeTab].title }}
</view> </view>
<view class="monk-basic" v-if="activeTab === 0">
<text class="monk-name">{{ monkInfo.name }}</text>
<view class="duties-wrapper">
<text class="monk-duties">{{ monkInfo.duties }}</text>
</view>
</view>
<view class="section-content" v-html="tabs[activeTab].content"></view> <view class="section-content" v-html="tabs[activeTab].content"></view>
</view> </view>
</view> </view>
</view>
</template> </template>
<script> <script>
import CommonEnum from "../../enum/common"; import CommonEnum from "../../enum/common";
import MonkEnum from "../../enum/monk"; import MonkEnum from "../../enum/monk";
import { getMonkDetail } from "../../api/monkDetail.js"; import {getMonkDetail} from "../../api/monkDetail.js";
export default { export default {
computed: { computed: {
@ -72,7 +70,7 @@ export default {
onLoad(options) { onLoad(options) {
// 获取传递的参数 // 获取传递的参数
if (options.id) { if (options.id) {
this.getMonkDetail(options.id); this.fetchMonkDetail(options.id);
} }
}, },
methods: { methods: {
@ -81,9 +79,9 @@ export default {
this.activeTab = index; this.activeTab = index;
}, },
// 获取高僧详情 // 获取高僧详情
async getMonkDetail(id) { async fetchMonkDetail(monkId) {
try { try {
const res = await getMonkDetail(id); const res = await getMonkDetail(monkId);
if (res.code === 200 && res.data) { if (res.code === 200 && res.data) {
this.monkInfo = res.data; this.monkInfo = res.data;
// 更新标签内容 // 更新标签内容
@ -141,6 +139,7 @@ export default {
.monk-detail-page { .monk-detail-page {
min-height: 100vh; min-height: 100vh;
position: relative; position: relative;
background-color: rgba(255, 255, 255, 0.95);
} }
.bg-image { .bg-image {
@ -197,11 +196,14 @@ export default {
border: 4rpx solid #695347; border: 4rpx solid #695347;
} }
.monk-basic {
}
.monk-basic {
flex: 1; flex: 1;
.monk-name { .monk-name {
font-size: 36rpx; font-size: 48rpx;
font-weight: bold; font-weight: bold;
color: #695347; color: #695347;
display: block; display: block;
@ -213,6 +215,14 @@ export default {
color: #8B7355; color: #8B7355;
display: block; display: block;
} }
.duties-wrapper {
display: inline-block;
background-color: #f5f5f5;
border-radius: 8rpx;
padding: 8rpx 16rpx;
margin-top: 10rpx;
} }
} }