<template>
    <div>


      <el-card class="training-category opacity-bg fl" style="border-radius: 20px;padding-top: -5px;">
        <div class="m-account" style="color: white;font-size: 1.5rem;">
          <div class="account-tit">
            <a @click="type='文件通知'" class="white" :class="{'current':type=='文件通知'}"  href="javascript:void(0)">文件通知</a>
            <a @click="type='交流互动'" class="white" :class="{'current':type=='交流互动'}"  href="javascript:void(0)">交流互动</a>
            <a @click="type='远程教学'" class="white" :class="{'current':type=='远程教学'}"  href="javascript:void(0)">远程教学</a>
          </div>
        </div>

        <el-table :data="postList" highlight-current-row :show-header="false" height="240px">
          <el-table-column min-width="600px">
            <template slot-scope="{row, $index}">
              <a @click="gotoDetail(row.postId)">{{(page*size)-size+$index+1}}、{{ row.title }}</a>
            </template>
          </el-table-column>
          <el-table-column width="160px">
            <template slot-scope="{row}">
              <span>{{ row.publishTime  }}</span>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination class="tc m-page" @current-change="handlePageChange" :current-page="page" :page-size="size"
          layout="total, prev, pager, next" :total="total">
        </el-pagination>

      </el-card>
    </div>
</template>

<script>
  import { httpServer } from "@/components/httpServer/httpServer.js";
  import { mapGetters,mapActions } from "vuex";
  import settings from '@/settings';
  export default {
    data() {
      return {
        settings,
        postList:[],
        page:1,
        size: 5,
        total:0,
        type:'文件通知',
        loginDialog: false,
        err: {},
      };
    },
    created(){
      this.getPostList()
    },
    computed: {
    	...mapGetters("user", ["typeList", "userInfo"])
    },
    watch:{
      type(){
        this.page = 1
        this.getPostList()
      }
    },
    methods: {
      ...mapActions("user", ["loadBaseInfo", "doLogout", "doLogin"]),
      getPostList(){
        let {page,size,type} = this;
        let param = {page,size,type}
        httpServer("course.getPostList", param).then( res=>{
          if( res.code == 200){
            this.postList = res.data.list
            this.total = res.data.total;
          }
        })
      },
      gotoDetail(postId){
        this.$router.push({name:'news', query:{postId}})
      },
      handlePageChange(page){
        this.page = page;
        this.getPostList()
      }
    }
  }
</script>

<style>
  @import url("../../../../assets/css/m-account.css");
  @import url("../../../../assets/css/m-notice.css");
</style>
