<template>
  <el-row>
    <el-row class="movie-list">
      <el-col :md="16" style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
        <el-card class="box-card">
          <div slot="header" class="clearfix">
            <span>充值请求</span>
          </div>
          <div class="text item">
            <el-table
              :data="chargeReqList"
              border
              style="width: 100%"
            >
              <el-table-column
                fixed="left"
                label="No"
                type="index"
              />
              <el-table-column
                prop="chargeId"
                label="充值 ID"
              />
              <el-table-column
                prop="quantity"
                label="金额"
              />
              <el-table-column
                prop="owner"
                label="用户"
              />
              <el-table-column
                fixed="right"
                label="操作"
              >
                <template slot-scope="scope">
                  <el-button
                    size="mini"
                    @click="onApprove(scope.row)"
                  >同意</el-button>
                  <el-button
                    size="mini"
                    type="danger"
                    @click="onDecline(scope.row)"
                  >拒绝</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </el-card>
      </el-col>
    </el-row>
  </el-row>
</template>

<script>
import { userMixin } from 'assets/js/mixin'
import {
  approveCharge, declineCharge,
  getChargeReq, getVipPlan
} from '@/api/admin'

export default {
  name: 'AdminCharge',
  mixins: [userMixin],
  data() {
    return {
      chargeReqList: [],
      vipPlanList: []
    }
  },
  created() {
    document.title = '站点配置'
    getVipPlan().then(resp => {
      if (resp.code === 0) {
        this.vipPlanList = resp.data
      } else {
        this.$message.error(resp.msg)
      }
    })

    this.getData()
  },
  methods: {
    getData() {
      getChargeReq(1).then(resp => {
        if (resp.code === 0) {
          this.chargeReqList = resp.data
        } else {
          this.$message.error(resp.msg)
        }
      })
    },
    onApprove(row) {
      approveCharge(row.chargeId).then(resp => {
        if (resp.code === 0) {
          this.getData()
        } else {
          this.$message.error(resp.msg)
        }
      })
    },
    onDecline(row) {
      declineCharge(row.chargeId).then(resp => {
        if (resp.code === 0) {
          this.getData()
        } else {
          this.$message.error(resp.msg)
        }
      })
    }
  }
}
</script>

<style>
</style>
