<template>
	<div class="details">
			<div class="boxtitle">
				当前位置：首页 > 文章详情
			</div>
		<div class="jmbox">
			<div class="center" v-html="content">
				
			</div>
		</div>
	</div>
</template>

<script>
import { details } from '@/request/api.js'

import jmBox from '@/components/box.vue'
	export default {
		components: {
			jmBox,
		},
		data() {
			return {
				content: '',
				id: this.$route.params.id || this.$route.query.id || 0,
			}
		},
		mounted() {
			this.getData()
		},
		methods: {
			getData() {
				const id = this.id
				details({},id).then(res => {
					
					if (res.data.url == '') {
						this.content = res.data.content
					} else{
						this.originalText(res.data.url)
					}
				})
			},
			// 查看原文
			originalText(url) {
				 window.open(url)
				 this.$router.go(-1)
			}
		},
		watch: {
			page() {
				this.getlave()
			}
		}
	}
</script>

<style lang="scss" scoped>
$red: #D82020;
.jmbox {
	min-height: 600px;
	padding: 30px 0;
	box-shadow: 1px 1px 6px #e1e1e1;
}
.details {
	border-top: solid 2px $red;
	background-color: #fff;
	.boxtitle {
		padding: 10px;
		background-color: #F2F2F2;
	}
	.center {
		padding: 25px 40px;
		.time,.price,.remarks,.name,.intention {
			border: solid 1px #F2F2F2;
			padding: 5px;
		}
		.time,.price,.remarks {
			flex: 1;
		}
		.name,.intention {
			flex: 2;
		}
		.title {
			color: $red;
			display: flex;
			justify-content: space-around;
		}
		.list {
			.item {
				display: flex;
				justify-content: space-around;
			}
		}
	}
}
</style>

