<template>
  <div class="form-wrap">
    <div class="balance-block">
      账户余额
    </div>
    <el-table
      :data="tableData">
      <el-table-column
        label="商品名称"
        prop="ticketTypeName">
      </el-table-column>
      <el-table-column
        prop="salePrice"
        label="销售价格">
      </el-table-column>
      <el-table-column
        prop="nodata"
        label="合作价格">
      </el-table-column>
      <el-table-column
        label="价格码"
        prop="nodata">
      </el-table-column>
      <el-table-column
        label="是否可售"
        prop="nodata">
      </el-table-column>
      <el-table-column
        label="是否可退">
        <template slot-scope="prop">
          {{ prop.row.is_refund | yesOrNo }}
        </template>
      </el-table-column>
      <el-table-column
        width="220"
        fixed="right"
        label="操作">
        <template slot-scope="scope">
          <el-button
            type="text"
            @click="showInfoDialog(scope.row)">详情</el-button>
          <el-button
            type="text"
            @click="showEditDialog(scope.row)"><i class="el-icon-edit"></i>编辑</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      background
      :current-page.sync="form.pageNum"
      @current-change="getOTATicketSaleList"
      layout="total, prev, pager, next"
      :total="total">
    </el-pagination>
  </div>
</template>

<script>
import { getTicketTypeList } from '@/api/ticketType'
import { getOTATicketSaleList, deleteOTATicketSale, updateOTATicketSale } from '@/api/otaTicketSale'
import moment from 'moment'
export default {
  data () {
    return {
      form: {
        pageNum: 1,
        pageSize: 10,
        keyWords1: '',
        keyWords2: '',
        keyWords3: ''
      },
      loading: false,
      total: 0,
      tableData: [],
      newDialogVisible: false,
      editDialogVisible: false,
      infoDialogVisible: false,
      currentItem: {},
      ticketTypeList: [] // 票种列表
    }
  },
  created () {
    this.getTicketTypeList()
    this.getOTATicketSaleList()
  },
  methods: {
    // 获取票种列表
    getTicketTypeList () {
      return getTicketTypeList({
        pageNum: 1,
        pageSize: 999
      }).then(res => {
        this.ticketTypeList = res.list
      })
    },
    // 获取价格码列表
    getOTATicketSaleList () {
      this.loading = true
      getOTATicketSaleList(this.form).then(res => {
        this.total = res.total
        res.list.forEach(item => {
          item.sellTimeRange = item.sale_time_start + ' - ' + item.sale_time_end
          item.sellDateRange = this.formatDate(item.sellStartDate) + ' - ' + this.formatDate(item.sellEndDate)
          item.createTime = this.formatDateTime(item.createTime)
        })
        this.tableData = res.list
        this.loading = false
      })
    },
    showInfoDialog (item) {
      this.currentItem = item
      this.infoDialogVisible = true
    },
    // 打开编辑对话框
    showEditDialog (item) {
      this.currentItem = item
      this.editDialogVisible = true
    },
    // 删除价格码
    deleteOTATicketSale (item) {
      this.$confirm('确定删除?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deleteOTATicketSale(item).then(res => {
          this.$message.success('删除成功')
          this.getOTATicketSaleList()
        })
      })
    },
    formatDate (val) {
      return moment(val).format('YYYY-MM-DD')
    },
    formatDateTime (val) {
      return moment(val).format('YYYY-MM-DD HH:mm:ss')
    },
    reset () {
      this.$refs.form.resetFields()
    },
    offSale (data) {
      let form = Object.assign({}, data)
      form.saleStatus = 0
      updateOTATicketSale(form).then(res => {
        this.$message.success('操作成功')
        this.getOTATicketSaleList()
      })
    },
    onSale (data) {
      let form = Object.assign({}, data)
      form.saleStatus = 1
      updateOTATicketSale(form).then(res => {
        this.$message.success('操作成功')
        this.getOTATicketSaleList()
      })
    }
  }
}
</script>
