<template>
  <div class="body">

    <div class="tabs">
      <el-table
        :data="tableData"
        header-cell-class-name="theader"
        :header-cell-style="{background:'#F2F2F2 !important',color:'#333333',height:'60px',fontSize:'14px'}"
        style="width: 100%">
        <el-table-column
          prop="create_time"
          align="center"
          label="发布日期">
        </el-table-column>
        <!-- <el-table-column
          prop=""
          align="center"
          label="通知类型">
        </el-table-column> -->
        <el-table-column
          prop="title"
          align="center"
          label="通知标题">
        </el-table-column>
        <el-table-column
          prop="content"
          align="center"
          label="通知详情">
        </el-table-column>
      </el-table>
    </div>
    <div class="pagination">
      <el-pagination
        background
        layout="total, prev, pager, next"
        :current-page="query.page"
        :page-size="query.limit"
        :total="pageTotal"
        @current-change="handlePageChange"
      ></el-pagination>
    </div>

  </div>
</template>
<script>
import {informList} from '../../api/index'
export default {
  data(){
    return{
      query:{
        page:1,
        limit:10,
      },
      tableData:[],
      pageTotal:0
    }
  },
  created(){
    this.getData();
  },
  methods:{
    getData(){
      informList(this.query).then(res => {
        console.info(res)
        if(res.code==100){
          this.tableData=res.list;
          this.pageTotal=res.count
        }else{
          this.$message.error(res.msg)
        }
      })
    },
    // 分页导航
    handlePageChange(val) {
      this.$set(this.query, 'page', val);
      this.getData();
    }
  }
}
</script>
<style scoped>
  .body{
    width: 1200px;
    margin: 0 auto;
  }
  .el-dropdown-link{
    color: #EAB1B1;
    cursor: pointer;
  }
  .tabs{
    margin-top: 20px;
  }
  .tabs>>> .el-table tr{
    border:1px solid #E9B7B7 !important
  }
  .tabs>>>.el-table td, .el-table th.is-leaf{
    border-bottom: none;
  }
  .tabs>>>.el-table::before{
    height: 0;
  }
</style>
