ViewAllowances.vue

<template>
  <div class="viewAllowances">
    <a-button type="primary" @click="back()"><img style="margin-top:-4px;margin-right: 6px;width: 14px" src="../../../assets/back.png"/>返回</a-button>
    <div class="title">查看津贴</div>
    <a-table :columns="columns" :dataSource="subsidyList" size="default" rowKey="couponId" :pagination="pagination" @change="handleTableChange">
      <span slot="type" slot-scope="type">
        {{ type === 'travel' ? '交通补贴' : '餐补'}}
      </span>
      <span slot="initialAmount">发放金额</span>>
      <span slot="residueAmount">余额</span>
      <span slot="endTime" slot-scope="endTime">
        {{ timeToStr(endTime) }}
      </span>
      <span slot="creatTime" slot-scope="createTime">
        {{ timeToStr(createTime) }}
      </span>
    </a-table>
  </div>
</template>

<script>
import { $http } from './../../../api/axios.js'
export default {
  name: 'viewAllowances',
  data () {
    return {
      userId: '',
      columns: [{
        title: '津贴类型',
        dataIndex: 'type',
        scopedSlots: { customRender: 'type' }
      }, {
        title: '发放金额',
        dataIndex: 'initialAmount'
      }, {
        title: '余额',
        dataIndex: 'residueAmount'
      }, {
        title: '截止日期',
        dataIndex: 'endTime',
        scopedSlots: { customRender: 'endTime' }
      }, {
        title: '创建日期',
        dataIndex: 'createTime',
        scopedSlots: { customRender: 'createTime' }
      }],
      pagination: {
        current: 1,
        defaultCurrent: 10,
        defaultPageSize: 10,
        hideOnSinglePage: true,
        total: 0
      },
      subsidyList: []
    }
  },
  watch: {},
  computed: {},
  created: function () {
    this.userId = this.$route.params.userId
    this.querySubsidyList()
  },
  methods: {
    querySubsidyList () {
      let SubsidyListData = this.$qs.stringify({
        userId: this.userId,
        currentPage: this.pagination.current,
        pageNumber: this.pagination.defaultPageSize,
        orgId: sessionStorage.getItem('corpId')
      })
      $http.get(`/v1/account/query_subsidyList_by_user_id?${SubsidyListData}`).then((res) => {
        let data = res.data.data
        this.subsidyList = data.recordList
        this.pagination.total = parseInt(data.totalCount)
      })
    },
    // 表格时间处理
    timeToStr (time) {
      let timeData = new Date(parseInt(time))
      let year = timeData.getFullYear()
      let month = timeData.getMonth() + 1
      let date = timeData.getDate()
      let hour = timeData.getHours()
      let minute = timeData.getMinutes()
      return `${year}年${month}月${date}日`
    },
    handleTableChange (pagination, filters, sorter) {
      this.pagination.current = pagination.current
      this.querySubsidyList()
    },
    back () {
      this.$router.go(-1)
    }
  }
}
</script>

<style lang="less" scoped>
.title{
  font-weight: bold;
  margin-bottom: 20px;
  margin-top: 20px;
}
</style>