boss/uni/module/main/components/withdraw.vue

<template>
  <view id="withdraw">
    <z-table class="table" :data="tableData" :keys="tableProps" :labels="tableHeaders" />
  </view>
</template>

<script>
import tableMixin from '../mixins/table'

const tableHeaders = [
  '用户ID',
  '真实姓名',
  '提现金额',
  '到账金额',
  '账户余额',
  '到账账户',
  '提现时间',
  '到账时间',
  '订单号',
  '支付方式',
  '状态'
]
const tableProps = [
  'uid',
  'real_name',
  'amount',
  'true_amount',
  'after_amount',
  'account',
  'created_atShow',
  'taken_atShow',
  'order_no',
  'channel',
  'statusShow'
]

export default {
  mixins: [tableMixin],
  data() {
    return {
      // 数据总条目
      totalCount: 0,
      currentPage: 1,
      // 列表头显示内容
      tableHeaders,
      // 列表头字段
      tableProps,
      // 列表数据
      tableData: []
    }
  },
  mounted() {
    this.getTableData()
  },
  methods: {
    // 点击重试
    async clickRetry(id) {
      const res = await this.$post('/api/admin/payment/redoDraw', { id })
      console.log(res)
    },
    // 点击用户的 uid
    clickUID(uid) {
      console.log('click uid: ' + uid)
    },
    // 根据状态显示图表样式
    tableRowClassName({ row, rowIndex }) {
      // console.log({row, rowIndex})
      let className = ''
      if(row.status === '1') className = 'success-row'
      return className
    },
    // 格式化列表数据
    formatTableData(data) {
      return data.map(i => ({
        ...i,
        statusShow: i.status === '1' ? '到账' : '失败',
        created_atShow: new Date(Number(i.created_at) * 1000).toLocaleString(),
        taken_atShow: new Date(Number(i.taken_at) * 1000).toLocaleString(),
      }))
    },
    // 获取列表数据
    async getTableData(page = 1) {
      const res = await this.$post('/api/admin/payment/listDraw', { page })
      // console.log(res)
      const data = res.data
      this.tableData = this.formatTableData(res.data.list)
      // console.log(this.tableData)
      this.totalCount = Number(data.total)
      this.totalPage = data.totalPage
    }
  }
}
</script>

<style lang='less' scoped>
.table {
  height: calc(100% - 40px);
}
</style>