<!--
	投标服务费缴费详情
 -->
<!--
  @description:投标服务费财务管理-投标服务费缴费详情
  @Modifier:肖文龙
  @routerPath:/bidServiceFee/bidServiceFeeStatisticsList/serviceChargeDetail
              /bidServiceFee/bidServiceFeeManagementList/serviceChargeDetail
  @date:2019-12-9 14:42:36
-->
<template>
  <div class="p0-16">
    <!-- 返回 -->
    <section class="title">
      <router-link :to="returnPrev">
        <i class="iconfont icon-fanhui pointer" />
      </router-link>
      投标服务费缴费详情
    </section>
    <!-- 投标服务费缴费详情 -->
    <div class="page-title">
      01 投标服务费缴费详情
    </div>
    <table class="tableData">
      <tr>
        <td>机构名称</td>
        <td colspan="3">
          {{ formData.details.agency }}
        </td>
      </tr>
      <tr>
        <td>项目名称</td>
        <td>{{ formData.details.title }}</td>
        <td>项目编号</td>
        <td>{{ formData.details.projectCode }}</td>
      </tr>
      <tr>
        <td>项目预算金额（万元）</td>
        <td>{{ formData.details.budgetAmount }}</td>
        <td>缴费金额</td>
        <td>{{ formData.details.paymenAamount }}</td>
      </tr>
      <tr>
        <td>支付方式</td>
        <td>{{ formData.details.paymentMode=='00'?'易支付':'支付宝' }}</td>
        <td>支付时间</td>
        <td>{{ formData.details.paymentData }}</td>
      </tr>
      <tr>
        <td>联系人</td>
        <td>{{ formData.details.contacts }}</td>
        <td>联系电话</td>
        <td>{{ formData.details.mobilePhone }}</td>
      </tr>
      <tr>
        <td>电子邮箱</td>
        <td>{{ formData.details.electronicsMail }}</td>
        <td>开票信息</td>
        <td>{{ formData.details.invoiceInformation }}</td>
      </tr>
    </table>
    <!-- ======================== -->
    <el-table :data="formData.details.bidSection" style="width: 100%;margin-top: 20px;" size="small">
      <el-table-column :label="'序号'" type="index" align="center" />
      <el-table-column :label="'包组编号'" prop="packageNumber" align="center" />
      <el-table-column :label="'标包名称'" prop="NameBid" align="center" />
      <el-table-column :label="'服务费金额（元）'" prop="serviceFeeAmount" align="center" />
    </el-table>
    <!--分页组件-->
    <pagination :pagination-data="paginationData" @change="initList" />
  </div>
</template>

<script>
import { getSublist } from '@/api/purchase/purchaseMain'
import { ListMixin } from '@/mixins/ListMixin'
import pagination from '@comp/common/pagination/pagination'
export default {
  name: 'BidServiceFeeServiceChargeDetail',
  components: {
    pagination
  },
  mixins: [ListMixin],
  data() {
    return {
      title: '',
      // 缴费详情
      formData: {
        details: {},
        sublist: []
      },
      rules: {
        auditOpinion: [{
          required: true,
          message: '请填写发票号码',
          trigger: 'blur'
        }]
      },
      batch: {
        auditFlag: '', // 01-审核通过 ||02-审核不通过
        auditOpinion: '', // 审核意见
        ids: []
      },
      returnPrev: '' // 返回

    }
  },
  mounted() {
    // 返回
    this.returnPrev = `/bidServiceFee/${this.$route.params.bidServiceFee}`
    this.initData()
    this.initList()
  },
  methods: {
    // 初始化
    initData() {
      const projectId = this.$route.query.id
      // 初始化项目信息
      getSublist(projectId).then(response => {
        // ==============初始化===================
        // 采购项目信息
        this.formData.details = response.data.tbpurchaseMainEntityVO
      })
    },
    // 物料信息
    initList(page, pageSize) {
      const data = this.sublist
      this.formData.sublist = []
      for (const v in data) {
        if (v >= (page - 1) * pageSize && v < pageSize * page) {
          const sublistData = {
            sort: data.sort, // 序号
            brand: data[v].brand, // 品牌
            budgetTotal: data[v].budgetTotal, // 预算总额
            budgetUnit: data[v].budgetUnit, // 预算单价
            id: data[v].id, // 物料id
            materialCode: data[v].materialCode, // 物料编码
            materialName: data[v].materialName, // 物料名称
            model: data[v].model, // 型号
            needsNumber: data[v].needsNumber, // 需求数量
            purchaseId: data[v].purchaseId, // 采购申请id
            units: data[v].units // 计量单位
          }
          this.formData.sublist.push(sublistData)
        }
      }
    }

  }
}
</script>

<style lang="less" scoped>

</style>
