<template>
  <el-dialog
    :title="topTitle"
    :visible.sync="show"
    :width="popWidth"
    :close-on-click-modal="false"
    :before-close="handleClose" append-to-body>

    <div class="layout_v" style="margin-bottom: 16px;font-weight: 700;">
      <span class="self_center">{{balanceTitle}}</span>
    </div>

    <avue-crud ref="crud"
               :page.sync="page"
               :data="tableData"
               :table-loading="tableLoading"
               :option="tableOption"
               @on-load="getList"
               @refresh-change="refreshChange"
               @size-change="sizeChange"
               @current-change="currentChange">

    </avue-crud>

  </el-dialog>
</template>

<script>

  import {
    bankFlowList,
    valueFlowList,
    growthFlowList
  } from '@/api/userMgt/userMgt.js'

  export default {
    props: {
      show: Boolean,
      type: String,
      obj: Object,
    },
    data() {
      return {
        searchForm: {},
        tableData: [],
        page: {
            total: 0, // 总页数
            currentPage: 1, // 当前页数
            pageSize: 20 // 每页显示多少条
        },
        tableLoading: false,
        tableOption: {
          border: true,
          stripe: true,
          menuAlign: "center",
          menu: false,
          align: "center",
          addBtn: false,
          column: [
            {
              "type": "input",
              "label": "触发时间",
              "prop": "createTime",
            },
            {
              "type": "input",
              "label": "触发项目",
              "prop": "frontTitle",
            },
            {
              "type": "input",
              "label": "金额",
              "prop": "amount",
              formatter: row => {
                return row.amount > 0 ? ('+' + row.amount) : row.amount
              }
            },
            {
              "type": "input",
              "label": "操作管理员",
              "prop": "adminName",
            },
          ]
        }
      }
    },
    watch: {
      show(n, o) {
        if(n) {
          this.refreshChange()
        }
      }
    },
    computed: {
      topTitle() {
        if(this.type == 'AList') {
          return '海盗币明细'
        } else if(this.type == 'BList') {
          return '巨雾币明细'
        } else if(this.type == 'ValueList') {
          return '财富值明细'
        } else if(this.type == 'GrowthList') {
          return '成长值明细'
        }
        return '标题'
      },
      balanceTitle() {
        if(this.type == 'AList') {
          return '余额:' + this.obj.a
        } else if(this.type == 'BList') {
          return '余额:' + this.obj.b
        } else if(this.type == 'ValueList') {
          return '余额:' + this.obj.value
        } else if(this.type == 'GrowthList') {
          return '余额:' + this.obj.growthValue
        }
        return ''
      },
      popWidth() {
        return '40%'
      },
      req() {
        if(this.type == 'AList') {
          return bankFlowList
        } else if(this.type == 'BList') {
          return bankFlowList
        } else if(this.type == 'ValueList') {
          return valueFlowList
        } else if(this.type == 'GrowthList') {
          return growthFlowList
        }
      },
      currency() {
        if(this.type == 'AList') {
          return 1
        } else if(this.type == 'BList') {
          return 2
        } else {
          return ''
        }
      }
    },
    methods: {
      handleClose() {
        this.$emit('close')
      },
      // 列表查询
      getList(page, params) {
          let req = this.req
          if(req == undefined) {
            return
          }
          this.tableLoading = true
          let p = {
            current: page.currentPage,
            size: page.pageSize,
            userId: this.obj.id,
            currency: this.currency
          }
          this.tableData = []
          this.page.total = 0
          this.tableLoading = false
          req(p).then(response => {
              this.tableData = response.data.data.records
              this.page.total = response.data.data.total
              this.tableLoading = false
          }).catch(() => {
              this.tableLoading=false
          })
      },
      // 刷新事件
      refreshChange() {
          this.getList(this.page)
      },
      // 每页条数改变事件
      sizeChange(pageSize){
          this.page.pageSize = pageSize
      },
      // 当前页发生改变事件
      currentChange(current){
          this.page.currentPage = current
      },
    }
  }

</script>

<style scoped>

</style>
