<template>
	<view class="content">
		<view class="title">{{title}}</view>
		<view class="time"><text>{{categorie}}</text>{{time}}</view>
		<view class="text">
			<rich-text :nodes="content"></rich-text>
		</view>
	</view>
</template>

<script>
	import { info } from '@/apis/interfaces/notice.js'
	export default {
		data() {
			return {
				title		: '',
				content		: '',
				time		: '',
				categorie	: ''
			};
		},
		onLoad(e){
			info(e.id).then(res => {
				this.title 		= res.title
				this.time  		= res.created_at
				this.content	= res.content.replace(/\<img/gi, '<img style="max-width:100%; height:auto; display:block;"');
				this.categorie	= res.categories[0].title
			}).catch(err => {
				uni.showToast({
					title: err.message,
					icon : 'none'
				})
			})
		}
	}
</script>

<style lang="scss">
	.content{
		background: white;
		min-height: 100vh;
		padding: 30rpx;
		box-sizing: border-box;
		.title{
			font-size: 40rpx;
			font-weight: bold;
			padding: 20rpx 0;
		}
		.time{
			color: gray;
			font-size: 28rpx;
			padding-bottom: 70rpx;
			text{
				color: $main-color;
				margin-right: 20rpx;
				text-align: justify;
			}
		}
	}
</style>
