<template>
  <div class="page">
    <el-table :data="dataList" border cell-class-name="vertical-top-cell" v-loading="loading" empty-text="暂无爱心值记录">
      <el-table-column prop="xxx" label="序号">
        <template slot-scope="scope">{{ scope.$index + 1 }}</template>
      </el-table-column>
      <el-table-column prop="xxx" label="订单编号"></el-table-column>
      <el-table-column prop="xxx" label="操作时间"></el-table-column>
      <el-table-column prop="xxx" label="爱心值数值">
        <template slot-scope="scope"></template>
      </el-table-column>
      <el-table-column prop="xxx" label="类型"></el-table-column>
      <el-table-column prop="xxx" label="状态">
        <template slot-scope="scope"></template>
      </el-table-column>
      <el-table-column prop="xxx" label="操作人员"></el-table-column>
      <el-table-column prop="xxx" label="备注"></el-table-column>
    </el-table>
    <el-pagination
      :current-page="queryParams.page"
      :page-sizes="[10, 20, 50, 100]"
      :page-size="queryParams.limit"
      :total="total"
      layout="total, sizes, prev, pager, next, jumper"
      @size-change="pageSizeChangeHandle"
      @current-change="pageCurrentChangeHandle">
    </el-pagination>
  </div>
</template>

<script>
export default {
  data () {
    return {
      queryParams: {
        memberId: this.$route.query.memberId || '',
        page: 1,
        limit: 10
      },
      dataList: [],
      total: 0,
      loading: false
    }
  },
  methods: {
    getList () {
      this.loading = true
      this.$http.get('/xxx', { params: this.queryParams }).then(({ data: res }) => {
        if (res.code === 200) {
          this.dataList = res.data.list
          this.total = res.data.total
        }
        this.loading = false
      })
    },
    pageSizeChangeHandle (val) {
      this.queryParams.limit = val
      this.getList()
    },
    pageCurrentChangeHandle (val) {
      this.queryParams.page = val
      this.getList()
    }
  }
}
</script>

<style scoped lang="scss">
</style>
