<template>
  <div class="supplementary-info-content">
    <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-position="top" class="rule-form-orange">
      <cy-info-title>基础信息</cy-info-title>
      <el-form-item label="项目名称" prop="projectName">
        <el-input v-model="ruleForm.projectName" disabled placeholder="请输入项目名称"></el-input>
        <!-- <el-select v-model="ruleForm.businessStatus" placeholder="请选择项目名称" clearable>
          <el-option
            v-for="item in []"
            :key="item.id"
            :label="item.name"
            :value="item.id"
          >
          </el-option>
        </el-select> -->
      </el-form-item>
      <el-form-item label="核心企业名称" prop="customerName">
        <el-input v-model="ruleForm.customerName" disabled placeholder="请输入核心企业名称"></el-input>
      </el-form-item>
      <el-form-item label="供应商（主体）名称" prop="supplierName">
        <el-input v-model="ruleForm.supplierName" disabled placeholder="请输入供应商（主体）名称"></el-input>
      </el-form-item>
      <el-form-item label="贸易平台" prop="tradingPlatformName">
        <el-input v-model="ruleForm.tradingPlatformName" disabled placeholder="请输入贸易平台"></el-input>
      </el-form-item>
      <el-form-item label="业务编号" prop="businessNumber">
        <el-input v-model="ruleForm.businessNumber" disabled placeholder="请输入业务编号"></el-input>
      </el-form-item>
      <el-form-item label="保理合同编号" prop="contractNo">
        <el-input v-model="ruleForm.contractNo" disabled placeholder="请输入保理合同编号"></el-input>
      </el-form-item>
      <el-form-item label="支用批次" prop="quotaDisburseBatch">
        <el-input v-model="ruleForm.quotaDisburseBatch" disabled placeholder="请输入支用批次"></el-input>
      </el-form-item>
      <el-form-item label="融资金额" prop="financingAmount">
        <el-input v-model="ruleForm.financingAmount" disabled placeholder="请输入融资金额">
          <template slot="append">{{ ruleForm.currencyCode }}</template>
        </el-input>
      </el-form-item>
      <cy-info-title>付款信息</cy-info-title>
      <el-form-item label="付款编号" prop="paymentNo">
        <el-input v-model="ruleForm.paymentApply.paymentNo" disabled placeholder="请输入付款编号"></el-input>
      </el-form-item>
      <el-form-item label="付款类型" prop="paymentType">
        <el-input v-model="ruleForm.paymentApply.paymentType" disabled placeholder="请输入付款类型"></el-input>
      </el-form-item>
      <el-form-item label="付款金额" prop="paymentAmount">
        <el-input v-model="ruleForm.paymentApply.paymentAmount" disabled placeholder="请输入付款金额">
          <template slot="append">{{ ruleForm.currencyCode }}</template>
        </el-input>
      </el-form-item>
      <el-form-item label="计划付款日期" prop="planPaymentDate">
        <el-date-picker
          v-model="ruleForm.paymentApply.planPaymentDate"
          type="date"
          placeholder="请选择计划付款日期"
          disabled
          value-format="yyyy-MM-dd"
        >
        </el-date-picker>
      </el-form-item>
      <condition ref="condition" style="width: 100%" type="supplementaryInfo" :details-info="ruleForm.paymentApply.conditionList" :disabled="disabled"></condition>
    </el-form>
  </div>
</template>

<script>
export default {
  components: {
    Condition: () => import('../../financingManage/paymentApplication/components/Condition')
  },
  props: {
    disabled: {
      type: Boolean,
      default: false
    },
    detailsInfo: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      ruleForm: {
        projectName: '',
        customerName: '',
        supplierName: '',
        tradingPlatformName: '',
        businessNumber: '',
        contractNo: '',
        quotaDisburseBatch: '',
        financingAmount: '',
        paymentType: '',
        paymentApply: {
          paymentNo: '',
          paymentType: '',
          paymentAmount: '',
          planPaymentDate: '',
          conditionList: []
        }
      },
      rules: {}
    }
  },
  watch: {
    detailsInfo: {
      handler(val) {
        if (val === undefined) return
        this.ruleForm = JSON.parse(JSON.stringify(val))
      },
      deep: true,
      immediate: true
    }
  },
  methods: {
    getParams() {
      const conditionList = this.$refs.condition.conditionTableData.map((item, index) => {
        item.fileIds = item.follow ? this.$refs.condition.$refs.commTable.$refs[`supplementaryInfoFile${index}`].getFileLists.map(item => item.id) : []
        delete item.exemptionFileIds
        delete item.exemptionFile
        delete item.files
        return item
      })
      for (let i = 0; i < conditionList.length; i++) {
        const { follow, supplement } = conditionList[i]
        if (follow) {
          if (!supplement) {
            this.$message.error('请填写补充说明')
            return false
          }
        }
      }
      return {
        conditionList
      }
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
