<template>
	<view class="container">
		<!-- 		<view class="tui-title"></view>
		<tui-card :title="author" :tag="addTime">
			<template v-slot:body>
				<view class="tui-default">{{ title }}</view>
			</template>
			<template v-slot:footer>
				<view class="tui-default"><rich-text :nodes="content" v-html="content"></rich-text></view>
			</template>
		</tui-card> -->

		<view class="container-infoBlock">
			<view class="container-infoBlock-title">{{ title }}</view>
			<view class="container-infoBlock-content" v-html="content"></view>
			<view class="container-infoBlock-bottom">
				<view class="container-infoBlock-bottom-left">{{ author.text }}</view>
				<view class="container-infoBlock-bottom-right">{{ addTime.text }}</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			author: {
				text: ''
			},
			title: '',
			addTime: {
				text: ''
			},
			content: ''
		};
	},
	methods: {
		async getData(id) {
			let res = await getApp().globalData.request.post('push/pushdetail', {
				pushid: id
			});
			console.log(res);
			this.title = res.data.title;
			this.content = res.data.content;
			this.addTime.text = this.$Helper.date.toDateString(res.data.create_time);
			this.author.text = res.data.author;
		}
	},
	onLoad({ pushid }) {
		this.getData(pushid);
	}
};
</script>

<style scoped lang="scss">
page {
	background: #f4f8ff;
}
.container {
}

.container-infoBlock {
	width: 92%;
	margin: 30rpx auto;
}

.container-infoBlock-title {
	font-size: 32rpx;
	color: #333333;
	font-weight: bold;
}

.container-infoBlock-content {
	margin-top: 20rpx;
	color: #666666;
	font-size: 28rpx;
}

.container-infoBlock-bottom {
	margin-top: 20rpx;
	color: #999999;
	font-size: 24rpx;
	display: flex;
}

.container-infoBlock-bottom-left {
	flex: 1;
}

.container-infoBlock-bottom-right {
	flex: 1;
	text-align: right;
}
</style>
