<!--
  @description: 异常订单缴费处理-关联订单
  @Modifier: haofengxian
  @routerPath:
  @date: 2021-3-12-13:42
-->
<template>
  <el-dialog
    :visible.sync="visibleDialog"
    :close-on-click-modal="false"
    :lock-scroll="false"
    title="选择订单"
    width="1080px"
    append-to-body
    custom-class="el-dialog__body-p8 el-dialog_table"
  >
    <el-table
      ref="smallTable"
      :data="tableData"
      select-on-indeterminate
      :row-key="getRowKeys"
      @selection-change="selectionChange"
    >
      <el-table-column
        type="selection"
        width="55"
        align="center"
      />
      <el-table-column type="index" label="序号" align="center" width="60" />
      <el-table-column
        prop="orderCode"
        label="订单编号"
        align="center"
        width="160"
      />
      <el-table-column
        prop="taxOrderTotalMoney"
        label="订单含税金额（元）"
        align="right"
        width="130"
        header-align="center"
      />
      <el-table-column
        prop="actualChargeMoney"
        label="服务费金额（元）"
        align="right"
        width="120"
        header-align="center"
      />
      <el-table-column
        prop="supplierName"
        label="供应商名称"
        header-align="center"
        min-width="180"
      />
      <el-table-column
        :formatter="formatterIfRelief"
        prop="ifRelief"
        label="有无减免"
        align="center"
        header-align="center"
      />
    </el-table>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="ensure('formData')">
        确 定
      </el-button>
      <el-button @click="visibleDialog=false">取 消</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { getVoucherIdOrderListInfo } from '@/api/procurement/procurementOrder'
import { orderServeFeeMixins } from '../../mixins/orderServeFeeMixins'
export default {
  name: 'VoucherOrderListDialog',
  mixins: [orderServeFeeMixins],
  data() {
    return {
      visibleDialog: false,
      tableData: [],
      selectionList: [] // 已选择数据
    }
  },
  methods: {
    // 打开弹框
    openDialogVoucherOrder(data) {
      this.visibleDialog = true
      this.getExcepPayment(data)
    },
    getExcepPayment(data) {
      getVoucherIdOrderListInfo(data.voucherId).then(res => {
        this.tableData = res.data
      }).catch(() => {
      })
    },
    // 确定
    ensure() {
      if (this.selectionList.length > 0) {
        this.$emit('selectedServiceOrder', this.selectionList)
        this.visibleDialog = false
      } else {
        this.$message.warning('请选择')
      }
    },
    // 选择批量待确认收费的数据
    selectionChange(val) {
      this.selectionList = val
    },
    // 获取row的key值优化表格的渲染
    getRowKeys(row) {
      return row.planDetailId
    }
  }
}
</script>

<style scoped>

</style>
