<template>
    <div
            class="pa-4"
            v-if="loaded"
    >
        <h2>{{ detail.title }}</h2>
        <v-subheader class="text-right">{{ detail.desc }}</v-subheader>
        <div v-html="detail.content"></div>
        <v-btn
                color="primary"
                block
                @click="auditPost"
                :disabled="audited"
        >
            审阅完毕
        </v-btn>
    </div>
</template>

<script>
    export default {
        name: "index",
        data() {
            return {
                id: 0,
                loaded: false,
                detail: [],
                audited: false
            }
        },
        mounted() {
            this.id = this.$route.params.id;
            this.$api.article.show(this.id).then(result => {
                this.detail = result.article
                this.audited = result.audited
                this.loaded = true
            })
        },
        methods: {
            auditPost: function () {
                this.$api.article.audit(this.id).then(() => {
                    this.$router.back()
                })
            }
        }
    }
</script>

<style scoped>

</style>