<template>
    <form-option title="抽查细则公示" class="rule">
        <div v-html="content"></div>
        <el-button class="info" type="primary" @click="editDetail">编辑</el-button>
    </form-option>
</template>

<script>
import FormOption from "@/component/FormOption";
import { getDetail } from '@/api/system';

export default {
    components: {
        FormOption
    },
    data () {
        return {
            content: '',
            id: ''
        }
    },
    mounted () {
        this.initData()
    },
    methods: {
        initData() {
            getDetail().then(res => {
                if (res && res.data && res.data.length > 0) {
                    const item = res.data[0];
                    this.id = item.id;
                    this.content = item.content || '';
                }
            })
        },
        editDetail() {
            this.$router.push(`/system/rule/edit/${this.id}`);
        }
    }
}
</script>

<style lang="scss">
.rule {
    p {
        white-space: normal;
        word-break: break-word;
    }
}
</style>

<style lang="scss" scoped>
.info {
    margin: 14px;
}
</style>