privacy_policy.vue 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <template>
  2. <view class="container">
  3. <scroll-view class="content-scroll" scroll-y>
  4. <view class="rich-content">
  5. <rich-text :nodes="privacyContent"></rich-text>
  6. </view>
  7. </scroll-view>
  8. </view>
  9. </template>
  10. <script setup>
  11. import { ref, onMounted } from 'vue';
  12. import { getAgreement } from '@/api/auth';
  13. const privacyContent = ref('<p style="text-align: center; padding: 20px;">内容加载中...</p>');
  14. onMounted(async () => {
  15. try {
  16. const res = await getAgreement('privacy');
  17. if (res && res.data) {
  18. // 后端返回的对象包含 title 和 content,这里取 content 段落显示
  19. privacyContent.value = res.data.content || '<p style="text-align: center; padding: 20px;">暂无相关协议内容</p>';
  20. // 如果有标题,动态设置导航栏标题
  21. if (res.data.title) {
  22. uni.setNavigationBarTitle({
  23. title: res.data.title
  24. });
  25. }
  26. }
  27. } catch (err) {
  28. console.error('获取隐私政策失败:', err);
  29. privacyContent.value = '<p style="text-align: center; padding: 20px; color: #999;">协议加载失败,请稍后重试</p>';
  30. }
  31. });
  32. </script>
  33. <style lang="scss" scoped>
  34. .container {
  35. min-height: 100vh;
  36. background-color: #FFFFFF;
  37. }
  38. .content-scroll {
  39. height: 100vh;
  40. }
  41. .rich-content {
  42. padding: 0 40rpx 60rpx; // 核心:两侧保留40rpx间距
  43. box-sizing: border-box;
  44. }
  45. </style>