<template>
  <div class="main-contain">
    <div class="position">
      <bread-crumb :crumbs='crumbs'></bread-crumb>
    </div>
    <div class="app-container">
      <el-row :gutter="12" style="margin-top: 10px">
        <el-table
         :data="articsData"
          border fit highlight-current-row
          :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)'}"
        >   
           <el-table-column
                align="center" 
                type="selection"
                width="55">
          </el-table-column> 
          <el-table-column label="标题" align="center">
            <template slot-scope="scope">
            {{scope.row.title}}
          </template>
          </el-table-column>

          <el-table-column label="评论状态" align="center">
            <template>
              <span>正常</span>
            </template>
          </el-table-column>

          <el-table-column label="总评论数" align="center">
            <template slot-scope="scope">
             {{scope.row.comment_num}}
            </template>
          </el-table-column>

          <el-table-column label="操作" align="center">

            <template slot-scope="scope">
              <el-tooltip class="item" effect="dark" content="查看" placement="top">
                <el-button
                  size="mini"
                  type="primary"
                  icon="el-icon-edit-outline"
                  @click="$router.push('/articles/articleCommentDetail/'+scope.row.id)">
                </el-button>
              </el-tooltip>
            </template>
          </el-table-column>

        </el-table>

        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :page-sizes="[10,20,50,100]"
          :page-size="10"
          background
          style="margin-top:20px;float: right"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total">
        </el-pagination>

      </el-row>
    </div>
  </div>
</template>

<script>
  import BreadCrumb from '../components/bread-crumb'
   import { getAllComment } from '@/api/act/submitinfo'
  export default {
    name: 'articleComment',
    components:{
      BreadCrumb
    },
    data(){
      return{
        crumbs: [
          { path: false, name: '文章管理' },
          { path: '/articles/articleComment', name: '文章评论' }
        ],
        listQuery:{
           page:1,
           limit:10,
           title:'',
           commentNnum:'',
        },
         articsData:[],
         handleSizeChange(limit) {
            this.listQuery.limit = limit;
            this.GetAllAritcles();
        },
         handleCurrentChange(page) {
            this.listQuery.page = page;
            this.GetAllAritcles();
        },
        total:0,
      }
    },
    methods:{
         getAllComment(){
           getAllComment(this.listQuery).then(response=>{
                if(response.data.state == 1){
                   this.articsData = response.data.data.articles; 
                   console.log("文章内容",this.articsData)                 
                   this.total =  response.data.data.total                 
                }
           });
         }
    },
    created(){
      this.getAllComment();
    }
  }
</script>

<style scoped>

</style>
