<template>
	<view class="assemble">
		<view class="html-style" v-html="text"></view>
	</view>
</template>

<script>
	import agreement from '@/api/agreement.js';
	export default {
		data() {
			return {
				type: 1, //类型 1为用户协议,2为隐私策略
				text: '',
			}
		},
		onLoad(item) {
			console.log(item.type, '类型')
			this.init(item.type)
		},
		methods: {
			//初始化拿数据的接口
			init(type) {
				if (type == 1) {
					//获取用户协议
					agreement.userAgreement('service').then(res => {
						if(res.code == 1){
							this.text = res.data.content
						}else{
							this.text = ''
						}					
					})
					uni.setNavigationBarTitle({
						title: '用户协议'
					});
				} else if (type == 2) {
					//获取隐私策略
					agreement.userAgreement('privacy').then(res => {
						if(res.code == 1){
							this.text = res.data.content
						}else{
							this.text = ''
						}					
					})
					uni.setNavigationBarTitle({
						title: '隐私策略'
					});
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.assemble {
		width: 100%;
		height: 100vh;
		overflow: auto;
		background-color: $bg-color-white;
	}

	.html-style {
		padding: 30rpx 40rpx;
		line-height: 1.8;
		font-size: $font-size-base;
		color: $text-color-base;
		
		// 富文本内容样式优化
		::v-deep p {
			margin-bottom: 20rpx;
			line-height: 1.6;
		}

		::v-deep h1, ::v-deep h2, ::v-deep h3 {
			color: $color-primary;
			margin: 30rpx 0 20rpx 0;
			font-weight: bold;
		}
		
		::v-deep h1 {
			font-size: $font-size-extra-lg;
		}

		::v-deep h2 {
			font-size: $font-size-lg;
		}

		::v-deep h3 {
			font-size: $font-size-medium;
		}

		::v-deep ul, ::v-deep ol {
			margin: 20rpx 0;
			padding-left: 40rpx;
		}

		::v-deep li {
			margin-bottom: 10rpx;
			line-height: 1.6;
		}

		::v-deep strong {
			color: $text-color-base;
			font-weight: bold;
		}

		::v-deep a {
			color: $color-primary;
			text-decoration: underline;
		}
	}
</style>