huasheng-erp-order-system-applet/pages/mine/agreement/index.vue

<template>
	<view class="agreement-page">
		<erp-nav-bar :title="title" />

		<scroll-view scroll-y class="content-scroll" :style="{ height: scrollHeight }">
			<view class="article-body">
				<rich-text :nodes="agreementNodes"></rich-text>
			</view>
		</scroll-view>
	</view>
</template>

<script>
import { getAgreement } from '@/api/system/agreement.js';
import ErpNavBar from '@/components/erp-nav-bar.vue';
export default {
	components: { ErpNavBar },
	data() {
		return {
			statusBarHeight: 20,
			title: '',
			agreementNodes: ''
		}
	},
	computed: {
		scrollHeight() {
			return `calc(100vh - ${this.statusBarHeight + 44}px)`;
		}
	},
	async onLoad() {
		this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight || 20;
		try {
			const res = await getAgreement(1);
			this.title = res.data.title;
			this.agreementNodes = res.data.content;
		} catch (e) {
			console.error('[用户协议] 加载失败', e);
			uni.showToast({ title: e || '加载用户协议失败', icon: 'none' });
		}
	},
	methods: {
		goBack() { uni.navigateBack(); }
	}
}
</script>

<style scoped>
.agreement-page {
	width: 100vw;
	height: 100vh;
	background: #ffffff;
	display: flex;
	flex-direction: column;
}

.content-scroll {
	width: 100%;
}

.article-body {
	padding: 40rpx;
	padding-top: 20rpx;
}

.title {
	font-size: 40rpx;
	font-weight: bold;
	color: #1a1a1a;
	margin-bottom: 16rpx;
	text-align: center;
}

.update-time {
	font-size: 24rpx;
	color: #999;
	margin-bottom: 40rpx;
	text-align: center;
}

.footer-tip {
	margin-top: 60rpx;
	padding: 30rpx;
	background: #f8fafc;
	font-size: 24rpx;
	color: #888;
	text-align: center;
}
</style>