campus-errand/miniapp/pages/config/runner-agreement.vue
2026-03-20 18:09:42 +08:00

106 lines
2.0 KiB
Vue

<template>
<view class="agreement-page">
<!-- 自定义导航栏 -->
<view class="custom-navbar" :style="{ paddingTop: statusBarHeight + 'px' }">
<view class="navbar-content">
<view class="nav-back" @click="goBack">
<image class="back-icon" src="/static/ic_back.png" mode="aspectFit"></image>
</view>
<text class="navbar-title">跑腿协议</text>
<view class="nav-placeholder"></view>
</view>
</view>
<view :style="{ height: (statusBarHeight + 44) + 'px' }"></view>
<rich-text v-if="content" :nodes="content" class="rich-content"></rich-text>
<view v-else class="empty-tip">
<text>暂无内容</text>
</view>
</view>
</template>
<script>
import { getRunnerAgreement } from '../../utils/api'
export default {
data() {
return {
content: '',
statusBarHeight: 0
}
},
onLoad() {
const sysInfo = uni.getSystemInfoSync()
this.statusBarHeight = sysInfo.statusBarHeight || 0
this.loadContent()
},
methods: {
goBack() { uni.navigateBack() },
/** 加载跑腿协议内容 */
async loadContent() {
try {
const res = await getRunnerAgreement()
this.content = res?.value || res?.content || ''
} catch (e) {
// 静默处理
}
}
}
}
</script>
<style scoped>
/* 自定义导航栏 */
.custom-navbar {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 999;
background: #FFB700;
}
.navbar-content {
height: 44px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 20rpx;
}
.nav-back {
width: 60rpx;
height: 60rpx;
display: flex;
align-items: center;
justify-content: center;
}
.back-icon {
width: 40rpx;
height: 40rpx;
}
.navbar-title {
font-size: 34rpx;
font-weight: bold;
color: #363636;
}
.nav-placeholder {
width: 60rpx;
}
.agreement-page {
min-height: 100vh;
background-color: #ffffff;
padding: 30rpx;
}
.rich-content {
font-size: 28rpx;
color: #333333;
line-height: 1.8;
}
.empty-tip {
text-align: center;
padding: 100rpx 0;
}
.empty-tip text {
font-size: 28rpx;
color: #999999;
}
</style>