<template>
  <div class="create-bidding-content">
    <cy-info-title>基础信息</cy-info-title>
    <basic-information :basic-information="basicInformation" @company="companyNameFunction($event)" />
    <el-form
      ref="ruleFormRef"
      :model="ruleForm"
      :rules="rules"
      label-position="top"
      label-width="150px"
      class="rule-form-orange"
      style="margin-top: 20px"
    >
      <cy-info-title>合同文件（已签署）</cy-info-title>
      <el-form-item
        label="合同文件"
        prop="salesContractFile"
        class="form-required"
      >
        <cy-upload
          ref="salesContractFile"
          :upload-params="{
            fileType: 'salesContractFile'
          }"
          :file-data="ruleForm.salesContractFile"
          :upload-from-orange-status="true"
          placeholder="请上传请上传已签署的合同"
          :disabled="disabled"
          file-type="pdf,png,jpg,jpeg"
        />
      </el-form-item>
      <cy-info-title>合同信息</cy-info-title>
      <el-form-item label="合同编号" prop="contractNumber">
        <el-input
          v-model="ruleForm.contractNumber"
          placeholder="请输入合同编号"
          :disabled="disabled"
        />
      </el-form-item>
      <el-form-item label="合同名称" prop="contractName">
        <el-input
          v-model="ruleForm.contractName"
          placeholder="请输入合同名称"
          :disabled="disabled"
        />
      </el-form-item>
      <el-form-item label="供方公司名称" prop="platformName">
        <el-input
          v-model="ruleForm.platformName"
          placeholder="请输入供方公司名称"
          readonly
        />
      </el-form-item>
      <el-form-item label="需方公司名称" prop="enterprise">
        <el-input
          v-model="ruleForm.enterprise"
          placeholder="请输入需方公司名称"
          readonly
        />
      </el-form-item>
      <el-form-item label="合同约定金额类型" prop="contractPlanAmountType">
        <el-radio-group v-model="ruleForm.contractPlanAmountType" :disabled="disabled">
          <el-radio :label="0">固定金额</el-radio>
          <el-radio :label="1">适时网价</el-radio>
        </el-radio-group>
      </el-form-item>
      <personnel-information ref="personnelInformation" :person-info="personInfo" :personnel-disabled="personnelDisabled" />
      <cy-info-title>质保金</cy-info-title>
      <el-form-item label="是否有质保金" prop="retention">
        <el-radio-group v-model="ruleForm.retention" :disabled="disabled">
          <el-radio :label="true">是</el-radio>
          <el-radio :label="false">否</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item v-if="ruleForm.retention" label="质保金比例" prop="retentionPercent">
        <el-input
          v-model="ruleForm.retentionPercent"
          placeholder="请输入质保金比例"
          :disabled="disabled"
        />
      </el-form-item>
      <cy-info-title>履约保证金</cy-info-title>
      <el-form-item label="是否有履约保证金" prop="performanceBond">
        <el-radio-group v-model="ruleForm.performanceBond" :disabled="disabled">
          <el-radio :label="true">是</el-radio>
          <el-radio :label="false">否</el-radio>
        </el-radio-group>
      </el-form-item>
      <cargo-information ref="cargoInformation" :goods-info="goodsInfo" :cargol-disabled="cargolDisabled" />
    </el-form>
  </div>
</template>

<script>
export default {
  components: {
    BasicInformation: () => import('./BasicInformation.vue'),
    PersonnelInformation: () => import('./PersonnelInformation.vue'),
    CargoInformation: () => import('./CargoInformation.vue')
  },
  props: {
    disabled: {
      type: Boolean,
      default: false
    },
    detailsInfo: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      ruleForm: {
        detailsId: '',
        platformName: '',
        enterprise: '',
        contractNumber: '',
        contractName: '',
        contractPlanAmountType: '',
        performanceBond: '',
        retention: '',
        retentionPercent: '',
        salesContractFile: []
      },
      uploadParams: {},
      rules: {
        contractNumber: [{ required: true, message: '请输入合同编号', trigger: 'blur' }],
        contractName: [{ required: true, message: '请输入合同名称', trigger: 'blur' }],
        contractPlanAmountType: [{ required: true, message: '请输入合同约定金额类型', trigger: 'blur' }],
        retention: [{ required: true, message: '请选择是否有质保金', trigger: 'change' }],
        retentionPercent: [{ required: true, message: '请输入质保金比例', trigger: 'blur' }],
        performanceBond: [{ required: true, message: '请选择是否有履约保证金', trigger: 'change' }]
      },
      personInfo: [],
      goodsInfo: [],
      basicInformation: {},
      personnelDisabled: false,
      cargolDisabled: false
    }
  },
  watch: {
    detailsInfo: {
      handler(newV) {
        if (Object.keys(newV).length) {
          const { id, fileStorages, contractNumber, contractName, contractPlanAmountType, retention, retentionPercent, performanceBond, contractBasicVo, personInfoList, goodsInfoList } = JSON.parse(JSON.stringify(newV))
          this.ruleForm = {
            detailsId: id === 0 ? null : id,
            salesContractFile: fileStorages || [],
            contractNumber,
            contractName,
            contractPlanAmountType,
            retention,
            retentionPercent,
            performanceBond,
            platformName: contractBasicVo.platform,
            enterprise: contractBasicVo.enterprise
          }
          this.personInfo = personInfoList
          this.goodsInfo = goodsInfoList
          this.basicInformation = {
            projectName: contractBasicVo.projectName,
            enterprise: contractBasicVo.enterprise,
            mainEnterprise: contractBasicVo.mainEnterprise,
            platform: contractBasicVo.platform,
            businessNumber: contractBasicVo.businessNumber
          }
          this.personnelDisabled = true
          this.cargolDisabled = true
        }
      },
      immediate: true,
      deep: true
    }
  },
  created() {
    const { type } = this.$route.query
    if (type === 'see') {
      this.personnelDisabled = true
      this.cargolDisabled = true
    }
  },
  methods: {
    companyNameFunction(val) {
      this.ruleForm.platformName = val.platformName
      this.ruleForm.enterprise = val.enterprise
    },
    getParams() {
      return new Promise((resolve, reject) => {
        this.$refs.ruleFormRef.validate(valid => {
          if (valid) {
            const { detailsId, contractNumber, contractName, contractPlanAmountType, retention, retentionPercent, performanceBond } = this.ruleForm
            const { id } = this.$route.query
            const salesContractFileList = this.$refs.salesContractFile.getFileLists
            if (!salesContractFileList.length) {
              this.$message.warning('请上传已签署的合同文件')
              return
            }
            this.$refs.personnelInformation.getParams().then(data => {
              this.$refs.cargoInformation.getParams().then(item => {
                const params = {
                  id: detailsId,
                  ...item,
                  ...data,
                  cSalesContractManagementId: id,
                  contractNumber,
                  contractName,
                  contractPlanAmountType,
                  retention,
                  performanceBond,
                  fileIds: salesContractFileList.map(item => item.id)
                }
                if (retention) {
                  params.retentionPercent = retentionPercent
                }
                resolve(params)
              })
            })
          } else {
            reject()
            return false
          }
        })
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.create-bidding {

}
</style>
