<template>
     <div class="main-contain">
         <div class="position">
            <bread-crumb :crumbs='crumbs'></bread-crumb>
         </div>
         <div class="app-container">
            <el-form label-width="90px" class="clearfix" :model="form" ref="acticleform">
                 <el-row :span=20>
                    <el-form-item>
                        <div class="title">
                           {{form.title}}
                        </div>
                    </el-form-item>
                 </el-row>
                 <el-row :span=20>
                     <el-form-item>
                         <div  class="cont">
                           <li v-html="form.content"></li>
                         </div>
                     </el-form-item>
                 </el-row>
                 <el-row :span=20>
                 <el-form-item>
                    <div class="but">
                      <el-button type="primary" @click="clossPreview()">关闭预览</el-button>
                    </div>    
                 </el-form-item>
          </el-row>        
            </el-form>
       </div>
     </div>
</template>

<script>
    import BreadCrumb from '../components/bread-crumb'
      import { getPreviewInfo } from '@/api/act/submitinfo'
    export default {
        name: "articleEditPreview",
         components:{
            BreadCrumb
        },
        data(){
            return{
                 crumbs: [
                     { path: false, name: '文章管理' },
                     { path: '/articles/articleEditPreview', name: '文章编辑预览' }
                ],
                form:{
                    title:'',
                    content:'',
                }
            }
        },
        methods:{
            articleEditPreview(){
                getPreviewInfo(this.form).then(response=>{
                      if(response.data.state == 1){
                         this.form =  response.data.data.articles;
                         var articles =  response.data.data.articles
                         console.log("articles",articles)        
                      }
                })   
            },
            clossPreview(){
              this.$router.push({path:'/articles/articleList'})
            }
        },
        created(){
            this.articleEditPreview();
        }
    }
</script>
      
<style scoped>
    .title{
       font-size: 20px;
       position: relative;
       left: 750px;
    }

    .cont{
      position: relative;
      left: 200px;
    }
    .but{
      position: relative;
      left: 750px;
    }
</style>
