<!--
  @description: 供应商报价明细
  @Modifier: 郝定康
  @routerPath:
  @date: 2020-12-15 09:59:09
-->
<template>
  <div>
    <el-dialog
      v-dialogDrag
      :visible.sync="dialogData.dialog"
      :close-on-click-modal="false"
      title="报价明细"
      width="750px"
      custom-class="el-dialog__body-p0"
    >
      <el-table
        ref="smallTable"
        :data="tableData"
      >
        <el-table-column
          type="index"
          label="序号"
          width="60px"
          align="center"
        />
        <el-table-column
          header-align="center"
          label="金额(元)"
          prop="offerTotal"
          align="center"
          min-width="80"
        />
        <el-table-column
          header-align="center"
          label="报价时间"
          prop="negRecordTime"
          align="center"
          min-width="110"
        />
      </el-table>
      <div slot="footer" class="dialog-footer" style="text-align: center">
        <el-button @click="dialogData.dialog=false">
          关 闭
        </el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
/* api 接口 */
import { getMyOfferBidPriceRecords } from '@/api/procurement/procurementOffer'
export default {
  name: 'QuotationDetailsDialog',
  props: {
    // 弹框展示状态
    dialogData: {
      type: Object,
      default: function() {
        return {
          dialog: false,
          supplierId: '' // 供应商id
        }
      }
    },
    tenderBase: {
      type: Object,
      default: function() {
        return {}
      }
    }
  },
  data() {
    return {
      // 报价明细数据
      tableData: []
    }
  },
  watch: {
    // 弹框打开状态
    'dialogData.dialog'(val) {
      if (val) {
        this.getMyOfferData()
      }
    }
  },
  methods: {
    // 报价记录
    getMyOfferData() {
      const params = {
        // 项目标段id
        packId: this.tenderBase.packId,
        // 供应商id
        supplierId: this.dialogData.supplierId
      }
      getMyOfferBidPriceRecords(params).then(res => {
        // 报价明细数据
        this.tableData = res.data
      }).catch(() => {
      })
    }
  }
}
</script>
