<!--
 * @Descripttion: 
 * @version: 
 * @Author: kangkang
 * @Date: 2020-10-04 09:57:46
 * @LastEditors: kangkang
 * @LastEditTime: 2020-10-16 17:42:26
-->
<template>
<div style="height:95%">
  <el-table :show-overflow-tooltip="true" :data="tableData" height="calc(100% - 100px)" style="width: 100%">
    <el-table-column prop="user" label="用户" width="180"
      :filters="[{ text: 'xuzongyang', value: 'xuzongyang' }, { text: 'wanyongkang', value: 'wanyongkang' }]"
      :filter-method="filterTag"
    > </el-table-column>
    <el-table-column prop="operation" label="操作" width="180"> </el-table-column>
    <el-table-column prop="record" label="操作内容"> </el-table-column>
    <el-table-column show-overflow-tooltip prop="create_time" label="操作时间"> </el-table-column>
  </el-table>
  <el-pagination
    background
    :current-page="pageNum"
    style="top:90%"
    layout="prev, pager, next"
    :page-size = "50"
    @prev-click="prev_page"
    @next-click="next_page"
    @current-change="handleCurrentChange"
    :total="count">
  </el-pagination>
</div>
</template>

<script>
export default {
  data () {
    return {
      tableData: [],
      count: 0,
      pageNum: 1
    }
  },

  created () {
    this.$store.commit('setCurrentNav', '日志记录')
    this.getData()
  },
  methods: {
    getData () {
      this.$api.get(this.$api.phpURL + 'api/index/index').then(res => {
        this.tableData = res.data
        this.count = parseInt(res.count)
      })
    },
    prev_page () {
      this.$api.get(this.$api.phpURL + 'api/index/pageList', {page: this.pageNum}).then(res => {
        this.tableData = res.data
      })
    },
    next_page () {
      this.$api.get(this.$api.phpURL + 'api/index/pageList', {page: this.pageNum}).then(res => {
        this.tableData = res.data
      })
    },
    handleCurrentChange: function (currentPage) {
      this.pageNum = currentPage
      this.$api.get(this.$api.phpURL + 'api/index/pageList', {page: this.pageNum}).then(res => {
        this.tableData = res.data
      })
    },
    filterTag (value, row) {
      return row.user === value
    }
  }
}
</script>
