<template>
    <div class="page">
        <div class="contet">
            <div class="title">{{ info.title }}</div>
            <div class="detail" v-html="info.detail"></div>
        </div>
    </div>
</template>

<script setup>
import { http } from '@/plugins/http.js'
import { onMounted, ref } from 'vue'
import { RouterView, useRoute, useRouter } from 'vue-router'

const info = ref({})
const route = useRoute()
onMounted(() => {
    http.get('/news/get/' + route.query.id).then(res => {
        info.value = res
    })
})
</script>

<style lang="less" scoped>
.page {
    background-color: #f3f3f3;
    box-sizing: border-box;
    padding: 39px 135px 0;
}

.title {
    font-size: 42px;
    text-align: center;
    padding: 50px 100px;
    font-weight: bold;
}

.detail {
    margin: 0 auto;
    max-width: 1400px;
}
.contet {
    background-color: #fff;
}

@media screen and(max-width:1600px) {
    .page {
        padding: 39px 60px;
    }
}
</style>
