vending-machine/mobile/pages/privacy/privacy.vue
18631081161 539b58ea87
All checks were successful
continuous-integration/drone/push Build is passing
细节修改
2026-04-13 14:25:51 +08:00

114 lines
2.3 KiB
Vue

<template>
<view class="privacy-page">
<!-- 自定义导航栏 -->
<view class="custom-nav" :style="{ paddingTop: statusBarHeight + 'px' }">
<view class="nav-inner">
<view class="nav-back" @click="goBack">
<image class="back-icon" src="/static/ic_back2.png" mode="aspectFit" />
</view>
<text class="nav-title">{{ t('privacy.title') }}</text>
<view class="nav-placeholder" />
</view>
</view>
<view class="page-body" :style="{ paddingTop: (statusBarHeight + 44) + 'px' }">
<view v-if="loading" class="loading">
<text>{{ t('common.loading') }}</text>
</view>
<view v-else class="content">
<rich-text :nodes="content" />
</view>
</view>
</view>
</template>
<script setup>
import { ref, onMounted } from 'vue'
import { useI18n } from 'vue-i18n'
import { getPrivacyPolicy } from '../../api/content.js'
const { t } = useI18n()
// 状态栏高度
const statusBarHeight = ref(0)
try {
const sysInfo = uni.getSystemInfoSync()
statusBarHeight.value = sysInfo.statusBarHeight || 0
} catch (e) {}
const content = ref('')
const loading = ref(true)
function goBack() {
uni.navigateBack()
}
async function loadContent() {
loading.value = true
try {
const res = await getPrivacyPolicy()
content.value = res.data?.content ?? res.data ?? ''
} catch (e) {}
finally { loading.value = false }
}
onMounted(() => { loadContent() })
</script>
<style scoped>
.privacy-page {
min-height: 100vh;
background-color: #ffffff;
}
.custom-nav {
position: fixed;
top: 0; left: 0; right: 0;
z-index: 100;
background-color: #DBDBDB;
}
.nav-inner {
height: 44px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 16rpx;
}
.nav-back {
width: 60rpx;
height: 44px;
display: flex;
align-items: center;
justify-content: center;
}
.back-icon {
width: 40rpx;
height: 40rpx;
}
.nav-title {
font-size: 34rpx;
font-weight: 600;
color: #333;
}
.nav-placeholder {
width: 60rpx;
}
.page-body {
padding: 30rpx;
}
.loading {
display: flex;
align-items: center;
justify-content: center;
padding: 60rpx 0;
}
.loading text {
font-size: 28rpx;
color: #999;
}
.content {
font-size: 28rpx;
color: #333;
line-height: 1.8;
}
</style>