63 lines
2.1 KiB
Vue
63 lines
2.1 KiB
Vue
<script setup>
|
||
/**
|
||
* 协议页：?type=privacy | terms
|
||
* 合规必备页，「我的」与登录页均可直达。
|
||
*/
|
||
import { computed, ref } from "vue";
|
||
import { onLoad, onShareAppMessage } from "@dcloudio/uni-app";
|
||
import contentApi from "@/api/content";
|
||
|
||
const type = ref("privacy");
|
||
const blocks = ref([]);
|
||
const title = ref("");
|
||
const validFrom = ref("");
|
||
const updatedAt = ref("");
|
||
|
||
/** 页眉日期行：生效日期 + 更新日期（接口缺哪项就不显示哪项） */
|
||
const metaText = computed(() => {
|
||
const parts = [];
|
||
if (validFrom.value) parts.push(`生效日期：${validFrom.value}`);
|
||
if (updatedAt.value) parts.push(`更新日期：${updatedAt.value}`);
|
||
return parts.join(" · ");
|
||
});
|
||
|
||
onLoad(async (options) => {
|
||
type.value = options?.type === "terms" ? "terms" : "privacy";
|
||
const res = await contentApi.getAgreement(type.value);
|
||
title.value = res.title;
|
||
blocks.value = res.blocks || [];
|
||
validFrom.value = res.validFrom;
|
||
updatedAt.value = res.updatedAt;
|
||
});
|
||
|
||
onShareAppMessage(() => ({
|
||
title: `${title.value} · 云从居`,
|
||
path: `/pages-sub/agreement/index?type=${type.value}`,
|
||
}));
|
||
</script>
|
||
|
||
<template>
|
||
<view class="relative min-h-screen w-full overflow-hidden">
|
||
<!-- 导航栏固定：状态栏 + 导航条不随页面滚动 -->
|
||
<view class="fixed left-0 right-0 top-0 z-[60] bg-white">
|
||
<AppStatusBar />
|
||
<AppNavBar :title="title" />
|
||
</view>
|
||
<!-- 流内占位：状态栏高度动态（用组件占位）+ 导航条固定高度，二者相加才是固定区总高 -->
|
||
<AppStatusBar />
|
||
<view class="h-[46px]" />
|
||
|
||
<view class="px-5 pt-[18px] pb-10">
|
||
<view class="text-[11.5px] text-ink3 mb-[18px]">{{ metaText }}</view>
|
||
<view class="text-[19px] font-semibold mb-[6px] text-ink">{{ title }}</view>
|
||
|
||
<template v-for="(block, i) in blocks" :key="i">
|
||
<view v-if="block.type === 'h5'" class="text-[14px] font-semibold mt-5 mb-2 text-ink">{{ block.text }}</view>
|
||
<view v-else class="text-[13px] leading-[1.9] text-[#4B5563]">{{ block.text }}</view>
|
||
</template>
|
||
|
||
<view class="h-10" />
|
||
</view>
|
||
</view>
|
||
</template>
|