<template>
	<view class="bg-white">
		<block v-if="!loading">
			<view class="border-solid border-t-0 border-l-0 border-r-0 border-b-[1px] border-gray-100 p-[30rpx]">
				<view class="text-[32rpx]">
					{{noticeDetail.title}}
				</view>
				<view class="flex align-center justify-between text-[26rpx] text-gray-400 mt-[30rpx]">
					<text>{{noticeDetail.create_time}}</text>
					<text>{{noticeDetail.category_id_name}}</text>
					<text>浏览 {{noticeDetail.views}}</text>
				</view>
			</view>
			<view class="px-[30rpx] py-[30rpx]">
				<u-parse :content="noticeDetail.content" :tagStyle="style"></u-parse>
			</view>
		</block>
		<u-loading-page :loading="loading" fontSize="16" color="#333"></u-loading-page>
	</view>
</template>

<script setup lang="ts">
	import { reactive, ref } from 'vue'
	import { onLoad } from '@dcloudio/uni-app'
	import { t } from '@/locale'
	import { getNoticeDetail } from '@/addon/xypm/api/content';
	import { useShare } from '@/hooks/useShare'

	const { setShare, onShareAppMessage, onShareTimeline } = useShare()
	onShareAppMessage()
	onShareTimeline()

	let noticeDetail = ref<Array<any>>([]);
	let loading = ref<boolean>(true);
	let style = {
		h2: 'margin-bottom: 20rpx;',
		p: 'margin-bottom: 10rpx;line-height: 1.5;',
		img: 'margin: 20rpx 0;',
	};
	onLoad((option) => {
		loading.value = true;
		getNoticeDetail(option.id).then((res) => {
			noticeDetail.value = res.data;
			loading.value = false;
			let share = {
				title: noticeDetail.value.title,
				desc: noticeDetail.value.title,
				url: noticeDetail.value.image
			}
            uni.setNavigationBarTitle({
                title: noticeDetail.value.title
            })
			setShare({
				wechat: {
					...share
				},
				weapp: {
					...share
				}
			});
		});
	})
</script>
<style>
	@import '@/addon/xypm/styles/common.scss';
</style>